.clear{clear: both;}

#selectNet, #selectttc{display: none;}

.simulateur{
    font-style: normal; 
    max-width: 500px !important; 
    width: 100%;
    color: #3a3839; 
    font-family: 'Yantramanav', sans-serif; 
    font-size: 16px !important; 
    font-weight: 300 !important;
    margin: 50px 0;}

.simulateur span{display: inline-block; width: 100%; text-align: right;}
.simulateur .choix{text-align: left;}
.simulateur .resultLine span{color: white;}
.simulateur #brut, .simulateur #net{width: 50%; display: inline-block;}
.simulateur input#salaire, .simulateur input#montant, .simulateur input#taux_tva, .simulateur #montant_emprunt, .simulateur #taux, .simulateur #duree{text-align: center !important}

.simulateur tr td:first-child{width: 70%; padding: 10px;}
.simulateur tr td:nth-child(2){width: 30%; padding: 10px;}

.simulateur tr td{border-bottom: 1.5px solid #A19F9F !important; border-top: 1.5px solid #A19F9F !important;}

.simulateur.calculsalaire tr:first-child td, .simulateur.calcultva tr:first-child td, .simulateur.calculemprunt tr:first-child td{border-top: #D4CECE  1.5px solid !important;}


.simulateur .resultLine{background: #91278e;}
.simulateur .CotisationPatronale, .simulateur .tva, .simulateur .totalInterets, .simulateur .mensualiteAssu{background: #e2e2e2;}

.simulateur #salaire:focus, .simulateur #montant:focus, .simulateur #taux_tva:focus, .simulateur #montant_emprunt:focus, .simulateur #taux:focus, .simulateur #duree:focus{
    border-color: #257de9;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(37, 125, 233, 0.6);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(37, 125, 233, 0.6);
    outline: 0;}

.simulateur #afficheResultat, .simulateur #coti, .simulateur #montantTVA, .simulateur #total_interets, .simulateur #mensualite_Assu{width: 95%; margin: 0 2.5%; text-align: center;}

.simulateur #coti, .simulateur #montantTVA, .simulateur #total_interets, .simulateur #mensualite_Assu{background: #d5d5d5;}
.simulateur #afficheResultat{background: #5d245b; color: white; font-weight: 700;}


.choixSwitch span, .choixSwitch div{display: inline-block; width: 30% !important;}

.switch {
  position: relative;
  width: 40% !important;
}

.switch label {
  width: 55px;
  height: 23px;
  position: absolute;
  background-color: #2DBAD6;
      top: -17px;
    left: 8px;
  border-radius: 50px;
}

.switch input[type="checkbox"] {
  visibility: hidden;
}

.switch label:after {
  content: '';
  width: 19px;
  height: 19px;
  border-radius: 50px;
  position: absolute;
  top: 2px;
  left: 2px;
  transition: all 0.1s;
  background-color: white;
}

.switch input[type="checkbox"]:checked + label:after {
  left: 29px;
}

.switch input[type="checkbox"]:checked + label {
  background-color: #2DBAD6;
}


/**
 * Tooltip Styles
 */
td.tooltipSimulateurs {
  position: relative;
}
td.tooltipSimulateurs .tooltips {
 position: absolute;
  width:400px;
  color: #FFF;
  font-weight: 700;
  background: #91278e;
  height: auto;
  line-height: 30px;
  text-align: center;
  visibility: hidden;
  border-radius: 6px;
  padding: 5px;
}
td.tooltipSimulateurs .tooltips:after {
  content: '';
  position: absolute;
  bottom: 100%;
  left: 50%;
  margin-left: -8px;
  width: 0; height: 0;
  border-bottom: 8px solid #257de9;
  border-right: 8px solid transparent;
  border-left: 8px solid transparent;
}
td:hover.tooltipSimulateurs .tooltips {
  visibility: visible;
  opacity: 0.8;
  top: 50px;
  left: 50%;
  margin-left: -215px;
  z-index: 999;
}

/* 

BOUTONS

*/
.btn-simulateurs{
color: #257de9 !important;
background-color: #fff !important;
border: 1px solid #257de9 !important;
}

.btn-simulateurs:hover{
color: #333 !important;
background-color: #e6e6e6 !important;
border-color: #adadad !important}

.bg-alt-pmhref a{color: #ea252e !important}




@media screen and (max-width: 640px) {
    .simulateur{width: 90%; margin: 0 5%;}
    .simulateur tr td, .simulateur tr:last-child td{border-bottom: 0px !important; border-top: 0px !important} 
    .simulateur.calculsalaire tr:first-child td, .simulateur.calcultva tr:first-child td, .simulateur.calculemprunt tr:first-child td{border-top: 0px !important}
    
    .simulateur input#salaire, .simulateur input#montant, .simulateur input#taux_tva, .simulateur #montant_emprunt, .simulateur #taux, .simulateur #duree{text-align: center !important; width: 100%; background: #e8e8e8; border-color: #e8e8e8; height: 30px;}  
    .simulateur #afficheResultat, .simulateur #coti, .simulateur #montantTVA, .simulateur #total_interets, .simulateur #mensualite_Assu{width: 100%; margin: 0; text-align: center; line-height: 45px; padding: 2px}

    
    .simulateur tr td, .simulateur tr td span {display: block;  width: 100%;}
    .simulateur .choixSwitch span, .simulateur .choixSwitch div{float: left;} 
    .simulateur .choixSwitch .brut, .simulateur .choixSwitch .ht{width: 40% !important; padding-right: 10px !important; padding-bottom: 20px; box-sizing: border-box}
    .simulateur .choixSwitch .net, .simulateur .choixSwitch .ttc{width: 40% !important; padding-left: 10px !important; text-align: left !important; box-sizing: border-box}
    .simulateur .choixSwitch div{width: 20% !important;} 
    .switch label {left:45px;top:0;}
    .simulateur tr td:first-child{display: block;  width: 95%; padding: 0px}
    .simulateur tr td:first-child span{text-align: left; padding: 0px}
    .simulateur tr td:nth-child(2){display: block;  width: 95%; padding: 0 0 20px 0; text-align: center;}
    
    .simulateur .choixLibelle,  .simulateur .taux, .simulateur .duree{color: #257de9; font-weight: 700;}
    
    .simulateur .resultLine{background: none;}
    .simulateur .CotisationPatronale, .simulateur .tva, .simulateur .totalInterets, .simulateur .mensualiteAssu{background: none;}
    
    .simulateur .resultLine span{color: #757575}
    
    

        td.tooltip {
          position: relative !important;
        }
        td.tooltip .tooltips {
         position: relative !important;
          width: auto !important;
          opacity: 0.8!important;
          color: #3a3839!important;
          font-weight: 300 !important;
          background: none !important;
          height: auto !important;
          line-height: auto !important;
          text-align: center !important;
          visibility: visible !important;
          border-radius: none !important;
          padding: 0 !important;
          font-size: 0.8em !important;
        }
        td.tooltip .tooltips:after {
          content: none !important;
          position: relative !important;
          bottom: 0 !important;
          left: 0 !important;
          margin-left: 0 !important;
          width: none !important; height: none !important;
          border-bottom: none !important;
          border-right: none !important;
          border-left: none !important;
        }
        td:hover.tooltip .tooltips {
          visibility: visible !important;
          opacity: 0.8 !important;
          top: 0 !important;
          left: 0 !important;
          margin-left: 0 !important;
          z-index: 0 !important;
        }

}