.calculateur h2{font-size:1.5em; background:#efefef;  margin:1px 0;padding:5px;}
.calculateur h2:after{display:none} h3:after{margin:20px 0 0 0 }
/*.calculateur .choixoption h2:after{display:none}*/
.calculateur h4{background:#efefef; padding:5px}
.calculateur h6{margin:0; font-size:0.8rem}
.calculateur h6 small{margin:0; font-size:0.6rem}


/*boutons*/
.btn {
  background: #1b89a6;
  border: none;
  white-space: nowrap;
  padding: 6px 12px;
  font-size: 16px;
}
.btn,.btn a {
  color: white
}

.btn-primary:hover {background: #3b3b3a}
.btn-primary.disabled, .btn-primary:disabled{background: #b3b3b3}
.btn-primary:focus {background: #0a5a6f}
/*chemin de fer */
.chemindefer{width:100%; clear:both; background:#efefef}
.calculateur .waveNumber  {
  color: white;
  display:inline-block; height:75px;width:130px;
  font-weight:bold;
  font-size:16px;
  text-align:center;
  background:#efefef url(img/losange-klosup-chemin-de-fer.png) no-repeat   center 10px;
  background-size: 40px 40px;
  padding:16px 1px 0 1px;
  vertical-align:top;
  position:relative;
}
.calculateur .step7.waveNumber {padding-top: 14px}
.waveNumber .status {font-size:11px; position:absolute; top:25px; left:74px }
.waveStepInfo{ background:#1b89a6; color:white; padding:5px;clear:both }
.chemindefer{background:#efefef; }

.chemindefer .waveNumber small{background:#efefef;
  font-size:14px; text-shadow:none; color:#3b3b3a; display:block; margin:10px 0 5px 0}
.chemindefer .waveNumber.active small, .chemindefer .waveNumber:hover small{color:WHITE;  background:#1b89a6;}
.chemindefer .waveNumber.disabled small {color:WHITE;  background:#ccc;}
.chemindefer .waveNumber.active,.chemindefer .waveNumber.disabled,
.chemindefer .waveNumber:hover {
  cursor:pointer;
  color: #3b3b3a;
  background-color:#1b89a6;
  background-image:url(img/losange-klosup-chemin-de-fer-active.png)   ;
}
.chemindefer .waveNumber.disabled{background-color:#ccc}
#c {
  width: 100%;

  display: block;
  background:white; outline: none; border: none;
  cursor:grab;
  /*border:1px dashed #bbb;*/
}
#c,.formulaire{min-height:400px}
.recap{display:none}
select {padding:4px}
/*.step .waveNumber{display:none}*/
.formulaire{background:#efefef;   }
.formulaire .step {display:none}
.formulaire .step1 {display:block}
.formulaire .step1  h5{height:1em}
.formulaire .step3   h6{height:1.5em;  margin:1px 0}
.resultats{font-size:12px; border:1px solid white}
.resultats {background:white; }
.resultats tr{border-bottom:1px solid #999 }
.divChoixOptionsPoteaux{display:none}
.divChoixColorisPoteaux{display:none}
.divChoixPoteaux{display:none}
.rangeslider__fill {
  background:#ed4b1a;/*#0088a6;/*#ed4b1a;*/
}.rangeslider--horizontal{max-width:300px}



/*loader*/
#loading-screen {
  position: absolute;
  z-index: 2;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #000000;
  opacity: 1;
  transition: 1s opacity;
}

#loading-screen.fade-out {
  opacity: 0;
}
.wave3DActions{position:absolute; top:0; right:0px;}
.loader  {
  display: block;
  position: relative;
  left: 50%;
  top: 50%;
  width: 150px;
  height: 150px;
  margin: -75px 0 0 -75px;
  border-radius: 50%;
  border: 3px solid transparent;
  border-top-color: #3b3b3a;
  -webkit-animation: spin 2s linear infinite;
  animation: spin 2s linear infinite;
}
.hint3D{display: block;
  position: absolute;
  left: 40%;
  bottom:5%;
  width:300px;
  height: 300px;
  margin: -150px 0 0 -150px;
  background:transparent url(https://www.klosea.fr/wp-domains/devklosea/uploads/2021/01/360-1.png) no-repeat center;
  background-size:100px;

}
@media (max-width: 960px) {
  .hint3D{width:1px; height:1px ; top:0; left:-960px}
.step4.dimensions{font-size:12px}

}
.loader:before {
  content: "";
  position: absolute;
  top: 5px;
  left: 5px;
  right: 5px;
  bottom: 5px;
  border-radius: 50%;
  border: 3px solid transparent;
  border-top-color: #3b3b3a;
  -webkit-animation: spin 3s linear infinite;
  animation: spin 3s linear infinite;
}
.loader:after {
  content: "";
  position: absolute;
  top: 15px;
  left: 15px;
  right: 15px;
  bottom: 15px;
  border-radius: 50%;
  border: 3px solid transparent;
  border-top-color: #3b3b3a;
  -webkit-animation: spin 1.5s linear infinite;
  animation: spin 1.5s linear infinite;
}
@-webkit-keyframes spin {
  0%   {
    -webkit-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@keyframes spin {
  0%   {
    -webkit-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}