@keyframes bip{0%{opacity:0;}50%{opacity:1;}100%{opacity:0;}}
@keyframes vibre{0%{left:44%;}80%{left:44%;}85%{left:44.5%;}90%{left:44%;}95%{left:44.5%;}100%{left:44%;}}
@-webkit-keyframes bolaDesierto {
    0% {
        left : -100px;
        opacity: 1
    }
    50% {
        left : 120%;
        opacity: 1
    }
    60% {
        left : 120%;
        opacity: 0
    }
    70% {
        left : -100px;
        opacity: 0
    }
    100% {
        left : -100px;
        opacity: 1
    }
}

@-moz-keyframes bolaDesierto {
    0% {
        left : -100px;
        opacity: 1
    }
    50% {
        left : 120%;
        opacity: 1
    }
    60% {
        left : 120%;
        opacity: 0
    }
    70% {
        left : -100px;
        opacity: 0
    }
    100% {
        left : -100px;
        opacity: 1
    }
}

@keyframes bolaDesierto {
    0% {
        left : -100px;
        opacity: 1
    }
    50% {
        left : 120%;
        opacity: 1
    }
    60% {
        left : 120%;
        opacity: 0
    }
    70% {
        left : -100px;
        opacity: 0
    }
    100% {
        left : -100px;
        opacity: 1
    }
}
@-webkit-keyframes giroBolaDesierto {
    0% {
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg)
    }
    100% {
        -webkit-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg)
    }
}

@-moz-keyframes giroBolaDesierto {
    0% {
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg)
    }
    100% {
        -webkit-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg)
    }
}

@keyframes giroBolaDesierto {
    0% {
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg)
    }
    100% {
        -webkit-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg)
    }
}
html {
    height: 100%;
    margin: 0;
    padding: 0;
    width: 100%;
    /*background-image:url(https://static.qcnscruise.com/images/fondGM.jpg);*/
    background-attachment: fixed;
    background-color: #fff;
    background-position: center top;
    background-repeat: repeat-x;
    background-color:#fff;
    font-family: 'Roboto', sans-serif;
    font-size: 14px;  
    font-weight: 400;
    color:#465963;
    text-rendering:optimizelegibility;
}
body{
    margin:0;
    padding:0;
    height:100%;
    overflow: hidden;
    counter-reset: myIndex;
}
@font-face {
    font-family: "Flaticon";
    src: url("./fonts/Flaticon.eot");
    src: url("./fonts/Flaticon.eot?#iefix") format("embedded-opentype"),
        url("./fonts/Flaticon.woff") format("woff"),
        url("./fonts/Flaticon.ttf") format("truetype"),
        url("./fonts/Flaticon.svg#Flaticon") format("svg");
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: "Tea";
    src: url("./fonts/tea_biscuit.eot");
    src: url("./fonts/tea_biscuit.eot?#iefix") format("embedded-opentype"),
        url("./fonts/tea_biscuit.woff") format("woff"),
        url("./fonts/tea_biscuit.ttf") format("truetype"),
        url("./fonts/tea_biscuit.svg#Flaticon") format("svg");
    font-weight: normal;
    font-style: normal;
}

@media screen and (-webkit-min-device-pixel-ratio:0) {
    @font-face {
        font-family: "Flaticon";
        src: url("./fonts/Flaticon.svg#Flaticon") format("svg");
    }
}
*{margin: 0;padding: 0;}
.transition,.hov,.transition03{ -webkit-transition: 0.1s ease 0s; -moz-transition: 0.1s ease 0s; -o-transition: 0.1 ease 0s; -ms-transition: 0.1s ease 0s; transition: 0.1s ease 0s;}
.transition1{ -webkit-transition: 1s ease 0s; -moz-transition: 1s ease 0s; -o-transition: 1 ease 0s; -ms-transition: 1s ease 0s; transition: 1s ease 0s;}
/*.hover,.fhover{ -webkit-transition: color 0.3s ease 0s; -moz-transition: color 0.3s ease 0s; -o-transition: color 0.3s ease 0s; -ms-transition: color 0.3s ease 0s; transition: color 0.3s ease 0s;}*/
.transition2,.transition05{ -webkit-transition: 0.5s ease 0s; -moz-transition: 0.5s ease 0s; -o-transition: 0.5s ease 0s; -ms-transition: 0.5s ease 0s; transition: 0.5s ease 0s;}
.transition07{ -webkit-transition: 0.7s ease 0s; -moz-transition: 0.7s ease 0s; -o-transition: 0.7s ease 0s; -ms-transition: 0.7s ease 0s; transition: 0.7s ease 0s;}
.transitionAll *{ -webkit-transition: 0.3s ease 0s; -moz-transition: 0.3s ease 0s; -o-transition: 0.3s ease 0s; -ms-transition: 0.3s ease 0s; transition: 0.3s ease 0s;}
.transitionAll03 > *{ -webkit-transition: 0.3s ease 0s; -moz-transition: 0.3s ease 0s; -o-transition: 0.3s ease 0s; -ms-transition: 0.3s ease 0s; transition: 0.3s ease 0s;}
.transitionAll05 > *{ -webkit-transition: 0.5s ease 0s; -moz-transition: 0.5s ease 0s; -o-transition: 0.5s ease 0s; -ms-transition: 0.5s ease 0s; transition: 0.5s ease 0s;}

.notransition{ -moz-transition: none;-webkit-transition: none;-o-transition: color 0 ease-in;transition: none;}

.hov:hover{opacity:0.9;}

h1,h2,h3,h4,h5{font-weight: normal;font-size: inherit;}
*,*::before, *::after,*:not(.noborder) {box-sizing: border-box;}
p {margin: 0;}

/*******FLEX***********/
.flex{display: flex;display: -webkit-flex;}
.flex-colonne{display: flex;display: -webkit-flex;flex-direction: column; -webkit-flex-direction: column;-moz-flex-direction: column;-o-flex-direction: column;-ms-flex-direction: column;}
.flex-colonne-reverse{display: flex;display: -webkit-flex;flex-direction: column-reverse; -webkit-flex-direction: column-reverse;-moz-flex-direction: column-reverse;-o-flex-direction: column-reverse;-ms-flex-direction: column-reverse;}
.flex-row{display: flex;display: -webkit-flex;-webkit-flex-direction: row;-ms-flex-direction: row;flex-direction: row;}
.flex-row-reverse{display: flex;display: -webkit-flex;-webkit-flex-direction: row-reverse;-ms-flex-direction: row-reverse;flex-direction: row-reverse;}

.flex-nowrap{display: flex;display: -webkit-flex;-webkit-flex-wrap: nowrap;-ms-flex-wrap: nowrap;flex-wrap: nowrap;}
.flex-wrap{display: flex;display: -webkit-flex;-webkit-flex-wrap: wrap;-ms-flex-wrap: wrap;flex-wrap: wrap;}

.justify-evenly{justify-content: space-evenly;}
.justify-center{-webkit-justify-content: center;-ms-flex-pack: center;justify-content: center;}
.justify-around{-webkit-justify-content: space-around;-ms-flex-pack: distribute;justify-content: space-around;}
.justify-between{-webkit-justify-content: space-between;-ms-flex-pack: justify;justify-content: space-between;}
.justify-end{-webkit-justify-content: flex-end;justify-content: flex-end;}

.hori-start{-webkit-align-items: flex-start;-ms-flex-align: start;align-items: flex-start;}
.hori-center{-webkit-align-items: center;-ms-flex-align: center;align-items: center;}
.hori-end{-webkit-align-items: flex-end;-ms-flex-align: end;align-items: flex-end;}


.vert-start{-webkit-align-content: flex-start;-ms-flex-line-pack: start;align-content: flex-start;}
.vert-center{-webkit-align-content: center;-ms-flex-line-pack: center;align-content: center;}
.vert-end{-webkit-align-content: flex-end;-ms-flex-line-pack: end;align-content: flex-end;}

.self-end{
    -webkit-align-self: flex-end;
    -ms-flex-item-align: end;
    align-self: flex-end;
}

.grow0{flex-grow: 0;}
.grow1{flex-grow: 1;}
.grow2{flex-grow: 2;}
.grow3{flex-grow: 3;}
.grow4{flex-grow: 4;}
.grow5{flex-grow: 5;}
.grow10{flex-grow: 10;}

.flex1 {flex:1 1 0;-webkit-flex:1 1 0;}
.flex10 {flex: 0 0 10px;-webkit-flex: 0 0 10px;}
.flex15 {flex: 0 0 15px;-webkit-flex: 0 0 15px;}
.flex20 {flex: 0 0 20px;-webkit-flex: 0 0 20px;}
.flex25 {flex: 0 0 25px;-webkit-flex: 0 0 25px;}
.flex30 {flex: 0 0 30px;-webkit-flex: 0 0 30px;}
.flex35 {flex: 0 0 35px;-webkit-flex: 0 0 35px;}
.flex40 {flex: 0 0 40px;-webkit-flex: 0 0 40px;}
.flex50 {flex: 0 0 50px;-webkit-flex: 0 0 50px;}
.flex55 {flex: 0 0 55px;-webkit-flex: 0 0 55px;}
.flex60 {flex: 0 0 60px;-webkit-flex: 0 0 60px;}
.flex70 {flex: 0 0 70px;-webkit-flex: 0 0 70px;}
.flex80 {flex: 0 0 80px;-webkit-flex: 0 0 80px;}
.flex90 {flex: 0 0 90px;-webkit-flex: 0 0 90px;}
.flex100 {flex: 0 0 100px;-webkit-flex: 0 0 100px;}
.flex120 {flex: 0 0 120px;-webkit-flex: 0 0 120px;}
.flex130 {flex: 0 0 130px;-webkit-flex: 0 0 130px;}
.flex140 {flex: 0 0 140px;-webkit-flex: 0 0 140px;}
.flex150 {flex: 0 0 150px;-webkit-flex: 0 0 150px;}
.flex160 {flex: 0 0 160px;-webkit-flex: 0 0 160px;}
.flex170 {flex: 0 0 170px;-webkit-flex: 0 0 170px;}
.flex180 {flex: 0 0 180px;-webkit-flex: 0 0 180px;}
.flex200 {flex: 0 0 200px;-webkit-flex: 0 0 200px;}
.flex240 {flex: 0 0 240px;-webkit-flex: 0 0 240px;}
.flex250 {flex: 0 0 250px;-webkit-flex: 0 0 250px;}
.flex270 {flex: 0 0 270px;-webkit-flex: 0 0 270px;}
.flex280 {flex: 0 0 280px;-webkit-flex: 0 0 280px;}
.flex300 {flex: 0 0 300px;-webkit-flex: 0 0 300px;}
.flex350 {flex: 0 0 350px;-webkit-flex: 0 0 350px;}
.flex450 {flex: 0 0 450px;-webkit-flex: 0 0 450px;}
.flex580 {flex: 0 0 580px;-webkit-flex: 0 0 580px;}
.flex10P {flex: 0 0 10%;-webkit-flex: 0 0 10%;}
.flex25P {flex: 0 0 25%;-webkit-flex: 0 0 25%;}
.flexauto {flex: auto;-webkit-flex: auto;}
.flex00auto {flex: 0 0 auto;}

.gap2P {gap: 2%;}
.gap3P {gap: 3%;}
.gap5P {gap: 5%;}


/*******MARGIN***********/
.top-1{margin-top:-1px;}
.left-1{margin-left:-1px;}
.right-1{margin-right:-1px;}
.bottom-1{margin-bottom:-1px;}
.bottom5{margin-bottom:5px}
.bottom10{margin-bottom:10px}
.bottom20{margin-bottom:20px}
.bottom30{margin-bottom:30px}
.bottom40{margin-bottom:40px}
.bottom50{margin-bottom:50px}
.bottom90{margin-bottom:90px;}
.top5{margin-top:5px;}
.top7{margin-top:7px;}
.top10{margin-top:10px;}
.top15{margin-top:15px;}
.top20{margin-top:20px;}
.top25{margin-top:25px;}
.top30{margin-top:30px;}
.top35{margin-top:35px;}
.top40{margin-top:40px;}
.top50{margin-top:50px;}
.top60{margin-top:60px;}
.top70{margin-top:70px;}
.top80{margin-top:80px;}
.top90{margin-top:90px;}
.top100{margin-top:100px;}
.top10P{margin-top:10%;}
.top12P{margin-top:12.5%;}
.top25P{margin-top:25%;}
.top50P{margin-top:50%;}
.left1{margin-left:1px;}
.left5{margin-left:5px;}
.left10{margin-left:10px;}
.left15{margin-left:15px;}
.left20{margin-left:20px;}
.left25{margin-left:25px;}
.b0{bottom:0}
.t0{top:0}
.t5{top:5px}
.t10{top:10px}
.l0{left:0}
.l5{left:5px}
.l10{left:10px}
.r0{right:0}
.r5{right:5px}
.l0P{left:0%;}
.l15P{left:15%;}
.l20P{left:20%;}
.left30{margin-left:30px;}
.left40{margin-left:40px;}
.left50{margin-left:50px;}
.left60{margin-left:60px;}
.left80{margin-left:80px;}
.left100{margin-left:100px;}
.left1P{margin-left:2%;}
.left2P{margin-left:2%;}
.left4P{margin-left:4%;}
.left5P{margin-left:5%;}
.left10P{margin-left:10%;}
.left8P{margin-left:8%;}
.auto{margin:0 auto}
.autolr{margin-left:auto;margin-right:auto}
.m10{margin: 10px}
.m510{margin: 10px}
.padB10{padding-bottom:10px}
.padB20{padding-bottom:20px}
.padB30{padding-bottom:30px}
.padB35{padding-bottom:35px}
.padB40{padding-bottom:40px}
.padB160{padding-bottom:160px}
.padT10{padding-top:10px}
.padT20{padding-top:20px}
.padT55P{padding-top:55%}
.padT58P{padding-top:58%}
.padT100P{padding-top:100%}
.padB50P{padding-bottom:50%}
.pad2{padding:2px}
.pad2P{padding:2%}
.pad10{padding:10px}
.pad20{padding:20px}
.pad30{padding:30px}
.pad40{padding:40px}
.pad50{padding:5px 0}
.pad100{padding:10px 0}
.pad200{padding:20px 0}
.pad1040{padding:10px 40px}
.pad2040{padding:20px 40px}
.pad400{padding:40px 0}
.pad4020{padding:40px 20px}
.pad600{padding:60px 0}
.pad2010{padding:20px 10px}
.pad510{padding:5px 10px}
.pad710{padding:7px 10px}
.pad1001020{padding:10px 0 10px 0 20px}
.pad010{padding:0 10px}
.pad105{padding:10px 5px}
.pad020{padding:0 20px}
.pad02020{padding:0 20px 20px}
.pad030{padding:0 30px}
.pad040{padding:0 40px}
.pad800{padding:80px 0}
.pad500{padding:50px 0}
.pad520{padding:5px 20px !important}
.pad5020{padding:50px 20px !important}
.pad205{padding:20px 5px !important}
.padLR50{padding-left:50px !important;padding-right:50px !important}
.padLR100{padding-left:100px !important;padding-right:100px !important}
.pad1020{padding:10px 20px !important}
.pad5{padding:5px;}
.pad1{padding:1px;}
.pad05{padding:0 5px;}
.pad2P{padding:2%;}
.pad02P{padding:0 2%;}
.padL5 {padding-left: 5px;}
.padL10 {padding-left: 10px;}
.padL20 {padding-left: 20px;}
.padL30 {padding-left: 30px;}
.padL40 {padding-left: 40px;}
.padL1P {padding-left: 1%;}
.padL2P {padding-left: 2%;}
.padL5P {padding-left: 5%;}
.padL10P {padding-left: 10%;}
.padR5 {padding-right: 5px;}
.padR10 {padding-right: 10px;}
.padR20 {padding-right: 20px;}
.padR40 {padding-right: 40px;}
.padR1P {padding-right: 1%;}
.padR5P {padding-right: 5%;}
.padR10P {padding-right: 10%;}
.padT40{padding-top:40px}
.padT50{padding-top:50px}
.right5{margin-right:5px;}
.right10{margin-right:10px;}
.right15{margin-right:15px;}
.right20{margin-right:20px;}
.right1P{margin-right:1%;}
.right2P{margin-right:2%;}
.right5P{margin-right:5%;}
.leftright1P{margin-left:0.5%;margin-right: 0.5%}
.pad0 {padding: 0 !important;}

/*******POSITION***********/
.vmiddle {vertical-align: middle;}
.vtop {vertical-align: top !important;}
.left{float:left}
.right{float:right}
.spacer{clear:both}
.center{text-align:center}
.absolute{position:absolute}
.relative{position:relative}
.fixed{position:fixed}
.hidden{overflow:hidden}
.hid{visibility:hidden}
.block{display:block}
.inblock{display:inline-block}
.table{display:table}
.cell{display:table-cell;vertical-align:middle}
.cell.top{vertical-align:top !important}
.row{display:table-row}
.none{display:none}
/*.blockMobile{display:none}*/
a{cursor:pointer;color:inherit;text-decoration:none;}
.z-1{z-index: -1}
.z0{z-index: 0}
.z1{z-index: 1}
.z2{z-index: 2}
.z3{z-index: 3}
.z9{z-index: 9 !important}
.z10{z-index: 10 !important}
.z11{z-index: 11 !important}
.z12{z-index: 12 !important}
.z999{z-index: 999 !important}
.writelr{writing-mode: vertical-lr}
.writerl{writing-mode: vertical-rl}

/*******APPARENCE***********/
.ombrepop{box-shadow: 0 24px 38px 3px rgba(0,0,0,0.14), 0 9px 46px 8px rgba(0,0,0,0.12), 0 11px 15px -7px rgba(0,0,0,0.2)}
.ombre0025{box-shadow: 0 0 25px 0 rgba(0,0,0,0.1)}
.ombre01025{box-shadow: 0 10px 25px 0 rgba(0,0,0,0.1)}
.ombre{box-shadow:0 3px 3px rgba(0, 0, 0, 0.2)}
.ombre2{box-shadow:0 0px 5px rgba(0, 0, 0, 0.5)}
.ombre3{box-shadow:0 3px 37px -8px rgba(0, 0, 0, 1)}
.ombre4{box-shadow:0 3px 37px -15px rgba(0, 0, 0, 1)}
.ombreBloc{box-shadow: 0 3px 5px rgba(0, 0, 0, 0.8);}
.ombreInset{ box-shadow:0 10px 10px -10px rgba(0, 0, 0, 0.6) inset, 0 -10px 10px -10px rgba(0, 0, 0, 0.6) inset}
.ombreInsethb:before{box-shadow: 0 -10px  10px -10px rgba(0, 0, 0, 0.6) inset;content: "";position: absolute;bottom: 0;width: 100%;height: 10px;}
.ombreInsethb:after{box-shadow: 0 10px  10px -10px rgba(0, 0, 0, 0.6) inset;content: "";position: absolute;top: 0;width: 100%;height: 10px;}
.spacing05{border-collapse:separate;border-spacing:5px 0}
.radius{border-radius: 5px}
.radius20{border-radius: 20px;}
.radius30{border-radius: 30px;}
.radius50{border-radius: 50px;}
.radius50P{border-radius: 50%;}
ul li{list-style:none}
ul.bullet li{list-style:circle}
img{border:none}
.line10{line-height:10px;}
.line12{line-height:12px;}
.line15{line-height:15px;}
.line17{line-height:17px;}
.line18{line-height:18px}
.line20{line-height:20px}
.line22{line-height:22px;}
.line25{line-height:25px;}
.line28{line-height:25px;}
.line30{line-height:30px;}
.line35{line-height:35px;}
.line40{line-height:40px}
.line45{line-height:45px}
.line50{line-height:50px}
.line60{line-height:60px}
.line70{line-height:70px}
.line80{line-height:80px}
.line90{line-height:90px}
.line100{line-height:100px}
.line120{line-height:120px}
.line160{line-height:160px}
.scroll,.scrollY{overflow-y: auto;overflow-x: hidden;}
.scrollX{overflow-x: auto;overflow-y: hidden;}
.op0{opacity:0 !important}
.op01{opacity:0.1 !important}
.op02{opacity:0.2 !important}
.op03{opacity:0.3 !important}
.op05{opacity:0.5 !important}
.op08{opacity:0.8 !important}
.op1{opacity:1 !important}
.rotate{-ms-transform: rotate(180deg); -webkit-transform: rotate(180deg); transform: rotate(180deg);}
.rotate90{-ms-transform: rotate(90deg); -webkit-transform: rotate(90deg); transform: rotate(90deg);}
.rotate270{-ms-transform: rotate(270deg); -webkit-transform: rotate(270deg); transform: rotate(270deg);
}
.trigauche::before{border-bottom: 10px solid transparent;border-right: 10px solid #fff;border-top: 10px solid transparent;content: " ";height: 0;left: -10px !important;position: absolute;top: 10px;width: 0;}
.trigauche.fg::before{border-right: 10px solid #EDEDED;}
.tribas::before{border-left: 10px solid rgba(0, 0, 0, 0);border-right: 10px solid rgba(0, 0, 0, 0);border-top: 10px solid #fff;bottom: -10px;content: " ";height: 0;left: 30px;position: absolute;width: 0;}
.trihaut::before{border-left: 10px solid rgba(0, 0, 0, 0);border-right: 10px solid rgba(0, 0, 0, 0);border-bottom: 10px solid #fff;top: -10px;content: " ";height: 0;left: calc(50% - 10px);position: absolute;width: 0;}
.trihaut.fn::before{border-bottom: 10px solid #222;}
.tribas.fbl::before{border-top: 10px solid #25a3bc;}
.tridroite::before{border-bottom: 10px solid transparent;border-left: 10px solid #fff;border-top: 10px solid transparent;content: " ";height: 0;right: -10px !important;position: absolute;top: calc(50% - 10px);width: 0;}
.tricomp::before{border-bottom: 50px solid transparent;border-left: 30px solid #bbb;border-top: 50px solid transparent;content: " ";height: 0;position: absolute;right: -30px !important;top: 0;width: 0;z-index: 999;}

/*******WIDTH***********/
.w5{width:5px}
.w10{width:10px}
.w15{width:15px}
.w20{width:20px}
.w25{width:25px}
.w30{width:30px}
.w35{width:35px}
.w40{width:40px}
.w50{width:50px}
.w55{width:55px}
.w60{width:60px}
.w70{width:70px}
.w80{width:80px}
.w90{width:90px}
.w100{width:100px}
.w110{width:110px}
.w120{width:120px}
.w130{width:130px}
.w140{width:140px}
.w150{width:150px}
.w160{width:160px}
.w170{width:170px}
.w180{width:180px}
.w190{width:190px}
.w200{width:200px}
.w220{width:220px}
.w230{width:230px}
.w240{width:240px}
.w250{width:250px}
.w260{width:260px}
.w270{width:270px}
.w280{width:280px}
.w290{width:290px}
.w300{width:300px}
.w320{width:320px}
.w330{width:330px}
.w350{width:350px}
.w400{width:400px}
.w420{width:420px}
.w440{width:440px}
.w450{width:450px}
.w500{width:500px}
.w550{width:550px}
.w560{width:560px}
.w580{width:580px}
.w600{width:600px}
.w650{width:650px}
.w730{width:730px}
.w800{width:800px}
.w1200{width:1200px}
.w740{width:740px}
.maxw400{max-width:400px}
.maxw600{max-width:600px}
.maxw800{max-width:800px}
.maxw1000{max-width:1000px}
.maxw1200{max-width:1200px}
.maxw1400{max-width:1400px}
.w2P{width:2%}
.w3P{width:3%}
.w4P{width:4%}
.w5P{width:5%}
.w6P{width:6%}
.w8P{width:8%}
.w9P{width:9%}
.w10P{width:10%}
.w11P{width:11%}
.w12P{width:12%}
.w13P{width:13%}
.w14P{width:14%}
.w15P{width:15%}
.w166P{width:16.6667%}
.w18P{width:18%}
.w19P{width:19%}
.w20P{width:20%}
.w21P{width:21%}
.w22P{width:22%}
.w23P{width:23%}
.w24P{width:24%}
.w25P{width:25%}
.w28P{width:28%}
.w29P{width:29%}
.w30P{width:30%}
.w32P{width:32%}
.w33P{width:33.3%}
.w34P{width:34%}
.w35P{width:35%}
.w36P{width:36%}
.w38P{width:38%}
.w40P{width:40%}
.w41P{width:41%}
.w42P{width:42%}
.w44P{width:44%}
.w45P{width:45%}
.w46P{width:46%}
.w48P{width:48%}
.w49P{width:49%}
.w50P{width:50%}
.w52P{width:52%}
.w53P{width:53%}
.w55P{width:55%}
.w58P{width:58%}
.w59P{width:59%}
.w60P{width:60%}
.w62P{width:62%}
.w63P{width:63%}
.w65P{width:65%}
.w66P{width:66%}
.w67P{width:67%}
.w68P{width:68%}
.w70P{width:70%}
.w74P{width:74%}
.w75P{width:75%}
.w77P{width:77%}
.w80P{width:80%}
.w85P{width:85%}
.w88P{width:88%}
.w90P{width:90%}
.w95P{width:95%}
.w96P{width:96%}
.w98P{width:98%}
.w100P{width:100%}
.wauto {width: auto !important}
.w26P{width:26%}
.h0{height:0px}
.h5{height:5px}
.h10{height:10px}
.h12{height:12px}
.h15{height:15px}
.h20{height:20px}
.h25{height:25px}
.h30{height:30px}
.h35{height:35px}
.h38{height:38px}
.h40{height:40px}
.h45{height:45px}
.h49{height:49px}
.h50{height:50px}
.h55{height:55px}
.h60{height:60px}
.h65{height:65px}
.h70{height:70px}
.h75{height:75px}
.h80{height:80px}
.h90{height:90px}
.h100{height:100px}
.h110{height:110px}
.h118{height:118px}
.h120{height:120px}
.h125{height:125px}
.h130{height:130px}
.h135{height:135px}
.h140{height:140px}
.h150{height:150px}
.h160{height:160px}
.h170{height:170px}
.h180{height:180px}
.h190{height:190px}
.h200{height:200px}
.h210{height:210px}
.h220{height:220px}
.h230{height:230px}
.h240{height:240px}
.h250{height:250px}
.h260{height:260px}
.h280{height:280px}
.h290{height:290px}
.h300{height:300px}
.h320{height:320px}
.h330{height:330px}
.h340{height:340px}
.h350{height:350px}
.h400{height:400px}
.h450{height:450px}
.h500{height:500px}
.h550{height:550px}
.h10P{height:10%}
.h20P{height:20%}
.h25P{height:25%}
.h33P{height:33.333%}
.h40P{height:40%}
.h45P{height:45%}
.h50P{height:50%}
.h60P{height:60%}
.h70P{height:70%}
.h75P{height:75%}
.h80P{height:80%}
.h90P{height:90%}
.h100P{height:100%}
.h200P{height:200%}
.h75vh{height: 75vh;height: calc(var(--vh, 1vh) * 75);}
.h50vh{height: 50vh;height: calc(var(--vh, 1vh) * 50);}
.h60vh{height: 60vh;height: calc(var(--vh, 1vh) * 60);}
.h70vh{height: 70vh;height: calc(var(--vh, 1vh) * 70);}
.h85vh{height: 85vh;height: calc(var(--vh, 1vh) * 85);}
.h100vh{height: 100vh;height: calc(var(--vh, 1vh) * 100);}
.calcvh{height:calc((var(--vh, 1vh) * 100) - var(--px))}
.maxcalcvh{max-height:calc((var(--vh, 1vh) * 100) - var(--px))}
.hauto{height: auto}
.mh75vh{max-height: 75vh;height: calc(var(--vh, 1vh) * 75);}
.mh80vh{max-height: 80vh;height: calc(var(--vh, 1vh) * 80);overflow-y: auto;overflow-x: hidden}
.mh85vh{max-height: 80vh;height: calc(var(--vh, 1vh) * 80);}
.mh66vh{max-height: calc(100vh - 300px);overflow-y: auto;overflow-x: hidden}
.mh60vh{max-height: calc(60vh);max-height: calc(var(--vh, 1vh) * 60);}
.w0{width:0;}
.maxh200{max-height:200px}
.maxh480{max-height:480px}


/*******BORDER***********/
.br{border-right:1px solid #ddd;}
.brb{border-right:1px solid #fff;}
.bl{border-left:1px solid #ddd}
.bt{border-top:1px solid #ddd;}
.bb{border-bottom:1px solid #ddd}
.bbd{border-bottom:1px solid #ddd}
.bbb{border-bottom:1px solid #fff !important}
.bn{border:none}
.ba{border:1px solid #ddd}
.bb2blc {border-bottom: 3px solid #0069d6;}

/*******BACKGROUND***********/
.cover{background-size: cover;background-position: center;}
.cover.bgfixed{background-attachment: fixed;}
.after{position: relative}
.bgfixed{background-attachment: fixed}
.bg-norepeat{background-repeat: no-repeat;}
#corps:after{-webkit-transition: 0.3s ease 0s; -moz-transition: 0.3s ease 0s; -o-transition: 0.3s ease 0s; -ms-transition: 0.3s ease 0s; transition: 0.3s ease 0s;}
#corps.after:after{-webkit-transition: 0.3s ease 0s; -moz-transition: 0.3s ease 0s; -o-transition: 0.3s ease 0s; -ms-transition: 0.3s ease 0s; transition: 0.3s ease 0s;background-color:#000;content: "";height: 110%;left: -10%;opacity: 0.5;position: absolute;top: -10%;width: 110%;z-index: 10}
.after::after {background-color:#000;content: "";height: 100%;left: 0;opacity: 0.5;position: absolute;top: 0;width: 100%;z-index: 10}
.after.fonce::after {background-color:#000;content: "";height: 100%;left: 0;opacity: 0.8;position: absolute;top: 0;width: 100%;}
.after.radiant::after {opacity: 0.8;background: -moz-linear-gradient(left,  rgba(0,0,0,1) 0%, rgba(0, 0, 0, 0.5) 10%, rgba(0,0,0,0) 65%, rgba(0,0,0,0) 85%, rgba(0,0,0,1) 100%);background: -webkit-linear-gradient(left,  rgba(0,0,0,1) 0%, rgba(0, 0, 0, 0.9) 10%,rgba(0,0,0,0) 65%,rgba(0,0,0,0) 85%,rgba(0,0,0,1) 100%);background: linear-gradient(to right,  rgba(0,0,0,1) 0%, rgba(0, 0, 0, 0.5) 10%,rgba(0,0,0,0) 65%,rgba(0,0,0,0) 85%,rgba(0,0,0,1) 100%);filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#000000',GradientType=1 );}


/*******FONTS***********/
.icon:before, .icon:after {font-family: "Flaticon";font-style: 1rem;font-weight: initial !important}
.font9{font-size:9px;}
.font10{font-size:10px;}
.font11{font-size:11px;}
.font12{font-size:12px;}
.font14{font-size:14px;}
.font16{font-size:16px;}
.font18{font-size:18px;}
.font20{font-size:20px;}
.font22{font-size:22px;}
.font24{font-size:24px;}
.font25{font-size:25px;}
.font26{font-size:26px;}
.font28{font-size:28px;}
.font30{font-size:30px;}
.font35{font-size:35px;}
.font40{font-size:40px;}
.font50{font-size:50px;}
.font60{font-size:60px;}
.font120{font-size:120px;}
.font150{font-size:150px;}

.font100{font-weight:100;letter-spacing: 0 !important}
.font300{font-weight:300}
.font400{font-weight:400}
.font500{font-weight:500}
.font700{font-weight:700}
.font900{font-weight:900}
.light{font-weight: 100}
.bold{font-weight: bold}
.upper{text-transform:uppercase;}
.capital{text-transform:capitalize;}
.lower,.first{text-transform:lowercase;}
.first::first-letter {text-transform:uppercase !important;}
.pointer,.liencache,.target{cursor:pointer}
.move:not(.icon){cursor:move}
.italic{font-style:italic}
.barre{text-decoration:line-through}
.underline{text-decoration:underline}
.nounder{text-decoration:none}
.center{text-align:center}
.justify{text-align:justify}
.txtRight{text-align:right}
.txtLeft{text-align:left !important}
.etc{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.letter1{letter-spacing: 1px}
.letter3{letter-spacing: 3px}
.letter5{letter-spacing: 5px}
.letter10{letter-spacing: 10px}
.txtombre{text-shadow: 0 2px 2px #000000}



/*******FORM***********/
select{font-family: 'Roboto';font-size:14px;background: transparent;border:none;outline:none;display: inline-block;-webkit-appearance: none;-moz-appearance: none;-ms-appearance: none;-o-appearance: none;appearance: none;cursor:pointer;padding-right: 26px;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;margin: 0  !important;width:100% !important;height:35px;color: inherit;padding-left: 2px}
.select.pad0 select{position: absolute;top:0}
.select.pad0{height:30px !important}
select::-ms-expand {
    display: none;
}

.editable{position:relative}

.select.bb,.input.bb,.editable {
    border-bottom: 1px solid #ddd;
}

.select.bb select,.input.bb input{
    padding-left: 0 !important
}
.select.bb .placeholder,.input.bb .placeholder {
    padding : 0 !important;
    font-size: 13px !important;
}
.select.bb .placeholder.active,.input.bb .placeholder.active,.select.bbd .placeholder.active {
    top: -8px !important;
    left: 0 !important;
    font-size: 11px !important;
}
.textarea .placeholder.active{
    top: -20px !important;
    
}

.input.bb:before,.editable:before {
    content: "";
    position: absolute;
    border-bottom: 3px solid #33aaff;
    width: 0 !important;
    left: 0;
    bottom:0;
    transition: 0.3s ease-in-out 0s;
    /* opacity: 0; */
}

.input.bb.active:before,.editable:focus:before {
    width: 100% !important;
}

.select.bb.blanc,.input.bb.blanc {
    border-bottom: 1px solid rgba(255,255,255,0.5);
}
.select.bb.blanc input,.input.bb.blanc input,.input.bb.blanc input:focus {
    color:#fff;
}
.select.bb.blanc .placeholder,.input.bb.blanc .placeholder {
    color:rgba(255,255,255,0.7) !important
}
.input.bb.blanc:before {
    border-bottom: 3px solid #fff;
}
.input.line40.h40 {
    height: 40px !important;
    line-height: 40px !important;
}


@media screen and (-webkit-min-device-pixel-ratio:0) {select {padding-right:25px}}
.select {position:relative;padding: 0;display: block;height: 35px;line-height: 35px}
.select.padR20 {padding-right: 20px}
.select.padR10 {padding-right: 10px}
.select.h40 {height: 40px;line-height: 40px}
.select.none {display: none}
.select::after {font-family: "Flaticon";content: "\f11c";color:#999;font-size: 18px;pointer-events: none;position: absolute;right: 0;text-align: center;top: 0px;width: 24px;height: 35px;line-height: 33px;box-sizing: inherit;}
.select.h40::after {height: 40px;line-height: 38px}
.input::after,.check:not(.icon)::after, .textarea::after {box-sizing: inherit;font-size: 18px;line-height: 35px;height: 35px;pointer-events: none;position: absolute;right: 5px;text-align: center;top: 0;width: 24px;color:#ccc}
.input.radius30{line-height: 40px;height: 40px;}
input.padL10{padding-left:10px !important}
.input.h40,.input.h40::after{line-height: 40px;height: 40px;}
.input.h45::after{line-height: 45px;height: 45px;color:rgba(255,255,255,0.1)}
.combo.after::after {box-sizing: inherit;font-size: 14px;line-height: 35px;height: 35px;pointer-events: none;position: absolute;left: 0;text-align: center;top: 0;width: 24px;}
.combo.after.line30::after,.check:not(.icon).line30::after {line-height: 30px !important;height: 30px !important}
.select::before {background: transparent none repeat scroll 0 0;content: "";display: block;height: 35px;pointer-events: none;position: absolute;right: 0;top: 0;width: 24px;box-sizing: inherit;}
.select.h40::before {height: 40px;}
.select.pad0::after,.select.pad0::before {height: 25px !important;line-height: 25px !important}
option {padding: 5px 0;color: #465963 !important}
option.orange {color: #fe6867 !important}
option:nth-child(even){background-color: #EDEDED;}
option:nth-child(odd){background-color: #fff;}
input[type=text],input[type=password],input[type=date],input[type=email],input[type=number], input[type="tel"]{font-family: 'Roboto';background-color: transparent;border:none;resize:none;font-size:14px;/*text-align: inherit;*/padding-left:5px;color:#465963;}
input[type=text].center,input[type=password].center,input[type=date].center,input[type=email].center,input[type=number].center, input[type="tel"].center{padding-left: 0}
.input.icon input{padding-right: 30px}
input[type=submit]{border:none;resize:none;}
input[type=button]{background: none;
	color: inherit;
	border: none;
	padding: 0;
	font: inherit;
	cursor: pointer;
	outline: inherit;}
input.orange{color: #fe6867}
input.bleu{color: #6382A9}
input.vert{color: #82B440}
input.blanc{color: #fff}
input.font12{font-size: 12px;padding-left: 0}
textarea{border: none;resize: none;color: #465963;font-size: 14px;font-weight: 400;font-family: 'Roboto';background-color: transparent;}
input[type=file]{padding:3px 0 3px 2px;resize:none;border-radius:5px}
input[type=submit]{border:none;}
input[readonly=readonly],input[readonly=readonly]:focus{background-color:transparent;color:#999 !important;cursor:default;-moz-user-select:-moz-none;-webkit-user-select:none;-khtml-user-select:none;-o-user-select:none;user-select:none}
input[type=text]:focus,input[type=password]:focus,input[type=date]:focus,input[type=email]:focus,input[type=number]:focus{color:#6382A9}
input.blanc:focus{color:#A4D905 !important}
input.vert[type=text]:focus,input.vert[type=password]:focus,input.vert[type=date]:focus,input.vert[type=email]:focus,input.vert[type=number]:focus{color:#82B440}
button {color: inherit;}
*:focus {
    outline: none;
}
.select.disabled,.ms-choice.disabled  {background-color:#EDEDED;}
.select.ed {
    width: calc(100% - 40px);
}
input.font22{font-size:22px;font-weight:700}
.input,.check:not(.icon),.combo {position:relative;height: 35px;line-height: 35px}
.input.h45 {position:relative;height: 45px;line-height: 45px}
.textarea{position:relative;}
.check:not(.icon).line30,.combo.line30 {line-height: 30px !important;height: 30px !important}
.placeholder{top:0;left:0;height: 33px;line-height: 33px;font-size: 12px}
.input.h45 .placeholder{top:0;left:0;height: 43px;line-height: 43px;font-size: 12px}
.input.h45 .placeholder.active,.placeholder.active{left: 0px;top: -8px;line-height: 12px;height: 12px;font-size: 11px;color:#999}
.input.blanc .placeholder.active,.select.blanc .placeholder.active{color:#fff}

input[type="checkbox"]:checked + label, input[type="radio"]:checked + label {color: #fe6867;}
input[type="checkbox"] + label, input[type="radio"] + label {cursor: pointer;display: block;font-size: 12px;padding-left: 20px;position: relative}
input[type="checkbox"] + label .icon:after {content: "\f119";left: 0;position: absolute;top:2px}
input[type="checkbox"]:checked + label .icon:after {content: "\f118";}
input[type="radio"] + label .icon:after {content: "\f129";left: 0;position: absolute;;top:2px}
input[type="radio"]:checked + label .icon:after {content: "\f128";}
.check.before {padding-left: 25px;}
.check.before::after {right: inherit;left: 0px;width: 25px !important;}
.check::after{
    box-sizing: inherit;
    font-size: 14px;
    height: 100%;
    pointer-events: none;
    position: absolute;
    right: 0;
    text-align: center;
    top: 0;
    width: 24px;
}
::-webkit-input-placeholder { /* WebKit, Blink, Edge */
    opacity:  0.8;
}
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
    opacity:  0.8;
}
::-moz-placeholder { /* Mozilla Firefox 19+ */
    opacity:  0.8;
}
:-ms-input-placeholder { /* Internet Explorer 10-11 */
    opacity:  0.8;
}

/*******POPUP***********/
.popup,.pop{margin:0 auto;width:100%}
#popupContact,#popupImg,#blocContact{background:#222;bottom:0;display:none;left:0;position:fixed;right:0;top:0;z-index:2;opacity:0.7}
#popupContenu{background:#fff;box-shadow:0 3px 10px 0 #222;display:none;;position:fixed;z-index:2;border-radius: 5px}
#popContent.shadow{box-shadow:0 24px 38px 3px rgba(0,0,0,0.14), 0 9px 46px 8px rgba(0,0,0,0.12), 0 11px 15px -7px rgba(0,0,0,0.2)}

#popupLoad {background: rgba(255, 255, 255, 0.8) url("https://www.bexoffice.pro/images/gfx/loader_n.gif") no-repeat scroll center center;bottom: 0;display: none;left: 0;position: fixed;right: 0;top: 0;z-index: 1000;}
#popupUpload {bottom: 0;display: none;left: 0;position: fixed;right: 0;top: 0;z-index: 1000;}
#loadProduit {background: rgba(255, 255, 255, 0.8) url("https://www.bexoffice.pro/images/gfx/loader_n.gif") no-repeat scroll center 100px;height:100%;width:100%;display: none;left: 0;position: absolute;top: 0;z-index: 5;}
#popupBlanc {background-color: rgba(255, 255, 255, 0.7);bottom: 0;display: none;left: 0;position: fixed;right: 0;top: 0;z-index: 2;}
.loading {background-image: url("https://www.bexoffice.pro/images/gfx/loader_n.gif");background-position: center center;background-repeat: no-repeat;}
.loadingb {background-image: url("https://www.bexoffice.pro/images/gfx/loader.gif");background-position: center center;background-repeat: no-repeat;}
.croix:hover{background-color: #fc507a;}

.vue {
    max-height: 10vh;
    overflow-y: hidden;
    /*Transition time is increased to accomodate the height */
    -webkit-transition: max-height 0.7s ease-in-out 1s; 
    -moz-transition: max-height 0.7s ease-in-out 1s; 
    -o-transition: max-height 0.7sease-in-out 1s; 
    -ms-transition: max-height 0.7s ease-in-out 1s; 
    transition: max-height 0.7s ease-in-out 1s;
}
.divpop .vue {
    -webkit-transition: max-height 0.7s ease-in-out 0s; 
    -moz-transition: max-height 0.7s ease-in-out 0s; 
    -o-transition: max-height 0.7sease-in-out 0s; 
    -ms-transition: max-height 0.7s ease-in-out 0s; 
    transition: max-height 0.7s ease-in-out 0s;
}
.vue {
    max-height: 10vh;
    overflow-y: hidden;
    /*Transition time is increased to accomodate the height */
}

.vue.active {
    max-height: 100vh;
}
.divpop .vue.active {
    max-height: 85vh;
}
.blur5 {
    filter: blur(5px);
}



.compte{counter-increment: myIndex;}
.compte:before{
    content:counter(myIndex);
}



/***********BLOCK****************/
.bloc3{margin-left: 5%}
.bloc4{margin-left: 4%}
.bloc42{margin-left: 2%}
.bloc5{margin-left: 2.5%}
.bloc3:nth-child(3n+1),.bloc4:nth-child(4n+1),.bloc42:nth-child(4n+1),.bloc5:nth-child(5n+1){margin-left: 0 !important}
.canvasjs-chart-credit{display: none !important}
.box:before{padding-top: 50%}