@charset "UTF-8";
/* CSS Document */


.no-js #loader {display: none;}
.js #loader { display: block; position: absolute; left: 100px; top: 0; }
.loading {position: fixed;left: 0px;top: 0px;width: 100%;height: 100%;z-index: 9999;background: #222;}

.spinner {margin: 27% auto;width: 50px;height: 60px;text-align: center;font-size: 10px;}
.spinner > div {background-color: #fff;height: 100%;width: 6px;margin-right:4px;display: inline-block;-webkit-animation: sk-stretchdelay 1.2s infinite ease-in-out;animation: sk-stretchdelay 1.2s infinite ease-in-out;}
.spinner .rect2 {-webkit-animation-delay: -1.1s;animation-delay: -1.1s;}
.spinner .rect3 {-webkit-animation-delay: -1.0s;animation-delay: -1.0s;}
.spinner .rect4 {-webkit-animation-delay: -0.9s;animation-delay: -0.9s;}
.spinner .rect5 {-webkit-animation-delay: -0.8s;animation-delay: -0.8s;}

@-webkit-keyframes sk-stretchdelay {0%, 40%, 100% { -webkit-transform: scaleY(0.4) }  20% { -webkit-transform: scaleY(1.0) }}
@keyframes sk-stretchdelay {0%, 40%, 100% { transform: scaleY(0.4);-webkit-transform: scaleY(0.4);}  20% { transform: scaleY(1.0);-webkit-transform: scaleY(1.0);}}



/* HAUT DE PAGE  */
.upPage {display:inline-block;height:40px;width:40px;position:fixed;bottom:40px;right:10px;overflow: hidden;background: rgba(70,193,209, 0.8) url(../img/picto/up.png) no-repeat center 50% / 30px;visibility: hidden;opacity:0;-webkit-transition: opacity .3s 0s, visibility 0s .3s;-moz-transition: opacity .3s 0s, visibility 0s .3s;transition: opacity .3s 0s, visibility 0s .3s;z-index:999}
.upPage.cd-is-visible, .upPage.cd-fade-out, .no-touch .upPage:hover {-webkit-transition: opacity .3s 0s, visibility 0s 0s;-moz-transition: opacity .3s 0s, visibility 0s 0s;transition: opacity .3s 0s, visibility 0s 0s;}
.upPage.cd-is-visible {visibility: visible;opacity: 1;} 
.upPage.cd-fade-out {opacity: 0.5;}
.no-touch .cd-top:hover {background-color: #e86256;opacity: 1;}


/* FLÈCHE BOUNCE */
.animated-infinite { -webkit-animation-duration: 1.5s; animation-duration: 1.5s; -webkit-animation-fill-mode: both; animation-fill-mode: both; animation-iteration-count:infinite; -webkit-animation-iteration-count:infinite; } 
.bounce { -webkit-animation-name: bounce; animation-name: bounce; }
@-webkit-keyframes bounce { 0%, 20%, 50%, 80%, 100% {-webkit-transform: translateY(0);} 40% {-webkit-transform: translateY(-30px);} 60% {-webkit-transform: translateY(-15px);} } 
@keyframes bounce { 0%, 20%, 50%, 80%, 100% {transform: translateY(0);} 40% {transform: translateY(-30px);} 60% {transform: translateY(-15px);} } 

.fleche{width:100%;position:absolute;bottom:15%;left:0;z-index:101}
.fleche img{margin:0 auto;display:block;z-index:101}





/*  SECTIONS  */
.section {clear: both;padding: 0px;margin: 0px;}
.row {display: -webkit-box;display: -moz-box;display: -ms-flexbox;display: -webkit-flex;display: flex;clear: both;margin: 0 auto;}
.row.up{margin-top:60px}

/*  GROUPING  */
.group:before, .group:after, .row:after { content:""; display:table; }
.group:after, .row:after { clear:both;}


.reverse{flex-direction:row-reverse}
.centerItem{ -webkit-align-items: center;align-items: center;}
.bottomItem{ -webkit-align-items: baseline;align-items: baseline;}
		
/*  COLUMN SETUP  */
.col, .noMarg, .reverseCol {display: block;float:left;}
.noMarg{margin:0}
.col, .reverseCol{margin: 1% 4% 1% 0;}
.col:last-child, .last, .reverseCol:first-child{ margin-right: 0; }


/* noMarg 0%*/
.no_12_of_12 {width: 100%;}
.no_11_of_12 {width: 91.66%;}
.no_10_of_12 {width: 83.33%;}
.no_9_of_12 {width: 75%;}
.no_8_of_12 {width: 66.66%;}
.no_7_of_12 {width: 58.33%;}
.no_6_of_12 {width: 50%;}
.no_5_of_12 {width: 41.66%;}
.no_4_of_12 {width: 33.33%;}
.no_3_of_12 {width: 25%;}
.no_2_of_12 {width: 16.66%;}
.no_1_of_12 {width: 8.333%;}

/* MARGE 3% */
.span_12_of_12 {width: 100%;}
.span_11_of_12 {width: 91.33%;}
.span_10_of_12 {width: 82.66%;}
.span_9_of_12 {width: 74%;}
.span_8_of_12 {width: 65.33%;}
.span_7_of_12 {width: 56.66%;}
.span_6_of_12 {width: 48%;}
.span_5_of_12 {width: 39.33%;}
.span_4_of_12 {width: 30.66%;}
.span_3_of_12 {width: 22%;}
.span_2_of_12 {width: 13.33%;}
.span_1_of_12 {width: 4.666%;}



.real .col{margin:0.5% 1% 0.5% 0}
.real .col:nth-child(3n+0){margin-right:0}
.real .span_4_of_12{width: 32.66%;}


@media only screen and (max-width: 1024px) {
.real .col:nth-child(3n+0){margin-right:1%}
.real .col:nth-child(2n+0){margin-right:0}
.real .span_4_of_12{width: 49.5%;}
}

@media only screen and (max-width: 768px) {

.row {clear:both;display:block;}
.col {margin: 0 0 30px 0;}
.col:last-child, .col.last{margin-bottom:0}

.span_1_of_12, .span_2_of_12, .span_3_of_12, .span_4_of_12, .span_5_of_12, .span_6_of_12, .span_7_of_12, .span_8_of_12, .span_9_of_12, .span_10_of_12, .span_11_of_12, .span_12_of_12, .no_1_of_12, .no_2_of_12, .no_3_of_12, .no_4_of_12, .no_5_of_12, .no_6_of_12, .no_7_of_12, .no_8_of_12, .no_9_of_12, .no_10_of_12, .no_11_of_12, .no_12_of_12  {width: 100%;}

.upPage {height:30px;width:30px;background-size:20px}

.stat .col.span_3_of_12{width:48%}

}

@media only screen and (max-width: 480px) {
.real .col:nth-child(3n+0), .real .col:nth-child(2n+0), .real .col{margin-right:0}
.real .col.show{display:none}
.real .span_4_of_12{width: 100%;}
}



