/**
 * Simulateur style sheet.
 *
 * @package    vanilla
 * @subpackage css
 * @author     Loops <evrard at h2a dot lu>
 * @version    SVN: $Id: standards.css 39 2014-10-17 15:51:33Z loops $
 */


input[type="checkbox"] + label.radGroup1:before, input[type="radio"] + label.radGroup1:before,
input[type="checkbox"] + label.radGroup1:after, input[type="radio"] + label.radGroup1:after {background-image: none; }

.none, .none label {pointer-events: none;}
.none{position:relative; display:none}
.none:after{position: absolute;content: "";background: rgba(100, 100, 100, 0.5);width: 96px;height: 90%;top: 0;left: -3px;}
.listli2:nth-child(2n).none:after{left:19px;width:97px}

/*classes à désactiver lors de l'intégration*/
#mainwrap{padding-top:0;}
#maincontent{background:#fff;}
#mainheader, #mainfooter{display:none;}
#mainwrap, #maincontent{height:100%;}
/*end*/

/*body{min-width:320px}*/


/*generic classes*/

#simulatorlayout, .simulatorsection{height:100%;}
#simulatorlayout *, #simulatorlayout *:after, #simulatorlayout *:before{box-sizing:border-box;}
.center-txt{position: absolute;top: 50%;left: 32px;transform: translate(0, -50%);}
.flex-col{display: -ms-flex;display: -webkit-flex;display: flex;-webkit-flex-wrap: wrap;-ms-flex-wrap: wrap;flex-wrap: wrap;justify-content: space-between;}
#simulatorlayout{position:relative;padding:40px;}
@media screen and (max-width: 320px){#simulatorlayout{padding:40px 5px}}


.mtop20{margin-top:20px;}

/*titre principal*/
.simulatorsection_title{font-weight:600;z-index: 1;position: absolute;}

/*image maison*/
.simulatorhouse{position:relative; top:-105px}
	@media screen and (max-width: 1700px){.simulatorhouse{top:-50px}}
	@media screen and (max-width: 1400px){.simulatorhouse{top:-30px}}
	@media screen and (max-width: 1200px){.simulatorhouse{top:0}}
	@media screen and (max-width: 1000px){.simulatorhouse{top:10px}}
	@media screen and (max-width: 500px){.simulatorhouse{top:20px}}
.simulatorhouse_svg{position:absolute;width:100%;height:100%;}

/*liste homepage*/
.list {position:absolute;width:100%;height:100%;top:0;left:0;}
.list .listli{cursor:pointer;padding:0;margin:0;position:absolute;}

.listtitle{order:1;padding:12px 12px 11px 12px;font-size:14px;color:#48565F;background:#f6f6f6;}
.list .listli:nth-child(4) .listtitle, .list .listli:nth-child(5) .listtitle{order:2;}
.list .listli:nth-child(4) .listnumber, .list .listli:nth-child(5) .listnumber{order:1;}
.listnumber{order:2;width:42px;height:42px;background:#FDC337;color:#fff;font-weight:400;font-size:20px;text-align:center;padding:10px;}

/*bouton close*/
a.close{position:absolute;left:calc(100vw - 42px);top:0;z-index: 99;}

.fiches-hide, .fiches-hide-detail {height: 100%;z-index: 98;position: absolute;width: 0;display:block;right:0;top:0;}
.fiches-hide .fiche, .fiches-hide-detail .fiche{width:480px;transition: left 0.3s ease-in-out;-webkit-transition: left 0.3s ease-in-out;left: calc(100%);background:#fff;position:relative;height: calc(100% + 190px);-webkit-box-shadow: 0 3px 10px rgba(0,0,0,0.16);-moz-box-shadow: 0 3px 10px rgba(0,0,0,0.16);box-shadow: 0 3px 10px rgba(0,0,0,0.16);}
.fiches-hide.on .fiche, .fiches-hide-detail.on .fiche{left: calc(100% - 480px);}
@media screen and (max-width: 550px){
	.fiches-hide .fiche, .fiches-hide-detail .fiche{width:320px}
	.fiches-hide.on .fiche, .fiches-hide-detail.on .fiche{left: calc(100% - 320px);}
}


@media screen and (max-width: 320px){
	.fiches-hide .fiche, .fiches-hide-detail .fiche{width:100%;}
	.fiches-hide.on .fiche, .fiches-hide-detail.on .fiche{left: 0;}
}

.fiches-hide .shadow, .fiches-hide-detail .shadow {display:none;position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: none;}
.fiches-hide.on, .fiches-hide-detail.on{right:0;width:100%;}
.fiches-hide .shadow{display:block;background: rgba(255,255,255,0);}
.fiches-hide-detail .shadow{display:block;}

.fiche{padding:60px 39px 0 39px;overflow-x:hidden;overflow-y:auto;}
@media screen and (max-width: 320px){
	.fiche{padding:60px 19px 0 19px}
}
.fiche .simulatorsection_title{position: relative;font-weight:500;}

/*list2*/
.list2{margin:0 0 30px 0;padding:0;position:relative;}
.listli2{width:30%;list-style-type:none;padding:0;margin:0; text-align:center;}
@media screen and (max-width: 550px){
	.listli2{width:50%; height:160px}
}

/*
.listli2:nth-child(odd){padding:0 23px 0 0;}
.listli2:nth-child(even){padding:0 0 0 23px;}
*/
.listli2 img.list2_img{margin-bottom:5px;}
.list2_span{display:block}
/*.listli2.selected img{border:4px solid #FDC337;}*/
/*.listli2.selected span{position:absolute;display:block;height:96px;width:96px;background:url(/images/simulateur/arrow.png) center center no-repeat;}*/

.simulatorsection_title2{margin-top: 5px;font-size: 14px;text-align: center;}
.simulatorsection_title3{font-size:15px;font-weight:500;}

/*list3*/
.list3{border-top:1px solid #DCDCDC;padding:0;margin:0 0;}
.listli3{list-style-type:none;margin:0;padding:5px 0;border-bottom:1px solid #DCDCDC;width:100%;align-items: center;}
.list3_txt{font-size:14px;margin:0;}




/*Checkbox2*/
/*input[type=checkbox].css-checkbox2 {position:absolute; z-index:-1000; left:-1000px; overflow: hidden; clip: rect(0 0 0 0); height:1px; width:1px; margin:-1px; padding:0; border:0;}
label.css-label2{width:100%;}*/
input[type=radio].css-checkbox2 {position:absolute; z-index:-1000; left:-1000px; overflow: hidden; clip: rect(0 0 0 0); height:1px; width:1px; margin:-1px; padding:0; border:0;}
input[type=radio].css-checkbox2 + label.css-label2 {font-weight:600;text-align:center;padding-left:0;height:145px; display:inline-block;background-repeat:no-repeat;background-position: right 0;font-size:12px;vertical-align:middle;cursor:pointer;}
	.de input[type=radio].css-checkbox2 + label.css-label2 {height:165px;}
input[type=radio].css-checkbox2:checked + label.css-label2 img.list2_img {/*background-position: right -35px;*/border:4px solid #FDC337;}

input[type="radio"].css-checkbox2:checked + label.radGroup1:before{width: 96px;height: 96px;background: url(/images/simulateur/arrow.png) center center no-repeat;top: 4px;left:13px}
@media screen and (max-width: 550px){
	input[type="radio"].css-checkbox2:checked + label.radGroup1:before{left: 0px;}
}




/*Checkbox*/
/*input[type=checkbox].css-checkbox {position:absolute; z-index:-1000; left:-1000px; overflow: hidden; clip: rect(0 0 0 0); height:1px; width:1px; margin:-1px; padding:0; border:0;}
label.css-label{width:100%;}*/
input[type=radio].css-checkbox {position:absolute; z-index:-1000; left:-1000px; overflow: hidden; clip: rect(0 0 0 0); height:1px; width:1px; margin:-1px; padding:0; border:0;}
input[type=radio].css-checkbox + label.css-label {padding-left:0;height:35px; display:inline-block;line-height:35px;background-repeat:no-repeat;background-position: right 0;font-size:14px;vertical-align:middle;cursor:pointer;}
input[type=radio].css-checkbox:checked + label.css-label {background-position: right -35px;}
label.css-label {width:100%;background-image:url(/images/simulateur/css_checkbox.png);-webkit-touch-callout: none;-webkit-user-select: none;-khtml-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;}

/*simulez button*/
#newsimulezbutton, #simulezbutton{padding: 30px 16px 31px;width: calc(100% + 80px);margin-top: 30px;margin: 30px -40px 0 -40px;}

.intro{padding-top: 35px;z-index: 2;position: absolute;}
@media screen and (max-width: 1100px){
	.intro{margin-bottom: -125px;position: relative;}
}

/*fiche detail*/
.fichedescription{overflow: hidden;margin-bottom: 12px;}
.fichedescription_img{float:left;}
.fichedescription .simulatorsection_title3{padding-left: 135px;}
.fiches-hide-detail .list3_versionb .listli3{padding:18px 0 16px 0;line-height:14px;}
.fiches-hide-detail .list3item_title{width:38%;}
.fiches-hide-detail .list3item_txt{font-weight:500;width:62%;}
.fichedetailsection_title3{padding-top:20px;position:relative;font-size:15px;font-weight:500;}
.fichedetailsection_title3:before{content: "";display: block;background-color: #fdc337;position:absolute;width: 53px;height: 6px;top:0;}
.fichedetailsection_title3.col_84329B:before{background-color: #84329B; width:100%}
h3.col_84329B{color: #84329B}
.fichebox.col_84329B p {color: #fff}
.fichebox.col_84329B{border-color: #84329B; background: #84329B}

.fichebox{border:1px solid #DCDCDC;min-height:77px;justify-content:center;align-items:center;}
.fichebox p{text-align:center;margin:0;font-size:20px;font-weight:600;color:#84329B;}

.list3_versionc{border:none;}
.list3_versionc .listli3{padding: 18px 0 14px 0;border-top: 1px solid #DCDCDC;border-bottom:0;}
.list3_versionc{margin-bottom:16px;}
.fichebox_ico{margin-right:20px;}
.list3 .icon-open{background: url(/images/simulateur/checkbox-on.png) right center no-repeat;}
.list3 .icon{background: url(/images/simulateur/checkbox-off.png) right center no-repeat;}

.rendezvous{margin:30px -20px 0 -20px;padding-top:30px;border-top:1px solid #dcdcdc;}
.rendezvous_link{overflow:hidden;align-items:center;text-decoration:none;justify-content:center;}
.rendezvous_link img{width:48px;} 
.rendezvous_link .rendezvous_txt{width:250px;margin:7px 0 0 10px;}
.txt1{font-size:15px;font-weight:600;display:block;}
.txt2{display:block;font-size:20px;color:#7F888F;font-weight:600;}
.rendezvous_link:hover .txt1, .rendezvous_link:focus .txt1, .rendezvous_link:active .txt1, 
.rendezvous_link:hover .txt2, .rendezvous_link:focus .txt2, .rendezvous_link:active .txt2 {color: #fdc337;}
.popover{margin-left:5px;}
.back-home, .back{position: absolute;top: 23px;}

.tooltip{position:relative;margin-left:5px;}
.tooltiptext{
    visibility: hidden;
    font-size:10px;
    width:150px;
    background:#fff;
    border:2px solid #FDC337;
    font-weight:400;
    padding:7px 10px;
    border-radius:4px;
    position:absolute;
    z-index: 1;
    left:-20px;
    bottom:30px;
    margin-left:-50px;
    /* Fade in tooltip */
    opacity: 0;
    -moz-transition: opacity 0.3s;
    -webkit-transition: opacity 0.3s;
    transition: opacity 0.3s;
}
/* Tooltip arrow */
.tooltip .tooltiptext::before {
    content: "";
    position: absolute;
    top: 100%;
    margin-top:-3px;
    left: 50%;
    margin-left: -10px;
    border-width: 10px;
    border-style: solid;
    border-color: #fff transparent transparent transparent;
    z-index:1;
}
.tooltip .tooltiptext::after {
    content: "";
    position: absolute;
    top: 100%;
    left: 50%;
    margin-left: -10px;
    border-width: 10px;
    border-style: solid;
    border-color: #FDC337 transparent transparent transparent;
}


/* Show the tooltip text when you mouse over the tooltip container */
.tooltip:hover .tooltiptext {
    visibility: visible;
    opacity: 1;
} 
@media screen and (max-width: 2560px){
    .list .listli:nth-child(1){top:24%;left:25.5%;}
    .list .listli:nth-child(2){top:34%;left:10%;}
    .list .listli:nth-child(3){top:47%;left:11%;}
    .list .listli:nth-child(4){top:22%;left:67%;}
    .list .listli:nth-child(5){top:60%;left:75%;}
}

@media screen and (max-width: 1600px){
    .list .listli:nth-child(1){top:22%;left:21.5%;}
    .list .listli:nth-child(2){top:33%;left:6%;}
    .list .listli:nth-child(3){top:45%;left:6%;}
    .list .listli:nth-child(4){top:20%;left:67%;}
    .list .listli:nth-child(5){left:76%;}
}
@media screen and (max-width: 1100px){
    .list .listli:nth-child(1){top:18%;}
    .list .listli:nth-child(2){top:30%;left:0;}
    .list .listli:nth-child(3){left:0;}
   
    .list .listli:nth-child(5){left:73%;}
}
 @media screen and (max-width: 760px){
    .simulatorhouse_svg{display:none;}
    .simulatorhouse_png{margin: 50px 0;}
    /*list*/
    .list {margin-top:40px;position:relative;padding:0;margin:0;}
    .list .listli{padding:0;margin:0;position:relative;}
    .listtitle{ flex-grow: 2;margin-bottom:6px;}
    .list .listli:nth-child(1), .list .listli:nth-child(2), .list .listli:nth-child(3), .list .listli:nth-child(4), .list .listli:nth-child(5){top:auto;left:auto;}
    .list .listli:nth-child(4) .listtitle, .list .listli:nth-child(5) .listtitle{order:1;}
    .list .listli:nth-child(4) .listnumber, .list .listli:nth-child(5) .listnumber{order:2;}
}