@font-face{
	font-family: 'FuturaBold';
	 src: url("../fonts/FtraBd-IvrqPwe.ttf");
  }
@font-face{
	font-family: 'FuturaBook';
	src: url("../fonts/FtraBk-UWUQCJ0.ttf");
}




.navbar-brand img {
    max-width: 100%;
    max-height:30px;
    height:auto;
    width:auto;
 }
 .navbar-light .navbar-nav .nav-link  {
    color:#032155;
    margin-top: 15px;
    font-size: 16px;
    text-transform: uppercase;
    font-family: "arslight" !important;
    font-weight: bold;
 }

 .margin20 {
    margin: 20px;
}



/* Differents Font*/

.titlepage {
    margin-bottom: 5%;
    font-size: 1.4rem;
 }
.card-title{
    font-size: 1.2rem;
   
}
.list{
    font-size: 0.9rem;
}

/* home */
.calculNouveaute .card {
    min-height: 200px;
}
.accueil{
    background-image: url("../images/piscineHome-JAijKLJ.jpg");
    min-height: 300px;
    background-repeat: no-repeat;
    background-attachment: fixed;
}

.cardlogo img {
    max-width: 80px;
}

.connectionProfile,
.calculNouveaute {
 justify-content:center;
 align-items:center;
 margin: 15px;
}
.bandeau{
    width:100%;
    height:auto;
    max-height: 390px;
}
.card {
    font-size: 1rem;
    overflow: hidden;
    padding: 10px;
    border: none;
    border-radius: 10px;
    box-shadow: 0 1rem 3rem 0 rgba(0, 0, 0, 0.1);
    margin-top:20px;
    text-align: center;
    justify-content: center;
}
.btn-card {
    background:  linear-gradient(#1665a3, #408cc5);
    border-radius: 20px;
    border: none;
    padding: 15px 20px;
    min-width: 150px;
}
.card-block {
    font-size: 1em;
    position: relative;
    margin: 0;
    padding: 1em;
    border: none;
    border-top: 1px solid rgba(34, 36, 38, .1);
    box-shadow: none;
     
}

.carousel-indicators li {
    border-radius: 12px;
    width: 12px;
    height: 12px;
    background-color: #404040;
}
.carousel-indicators .active {
    background-color: white;
    max-width: 12px;
    margin: 0 3px;
    height: 12px;
}
.carousel-control-prev-icon {
 background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' viewBox='0 0 8 8'%3E%3Cpath d='M5.25 0l-4 4 4 4 1.5-1.5-2.5-2.5 2.5-2.5-1.5-1.5z'/%3E%3C/svg%3E") !important;
}

.carousel-control-next-icon {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' viewBox='0 0 8 8'%3E%3Cpath d='M2.75 0l-1.5 1.5 2.5 2.5-2.5 2.5 1.5 1.5 4-4-4-4z'/%3E%3C/svg%3E") !important;
}

.techno{
    margin-top : 5%;
}
.d-block {
    max-width: 100%;
    height:200px;
}

.list {
    list-style-type: none;
}



.icon{
    max-width: 80px;
}

.size07{
    font-size: 0.7rem;
}

/*login page*/

.card-signin {
    border: 0;
    border-radius: 1rem;
    box-shadow: 0 1rem 3rem 0 rgba(0, 0, 0, 0.1);
  }
.card-signin .card-title {
    
    font-size: 1.4rem;
    margin-bottom: 25px;
  }  
.card-signin .card-body {
    padding: 2rem;
  }  
.form-signin {
    width: 100%;
}  
.form-signin .btn {
    font-size: 80%;
    border-radius: 5rem;
    letter-spacing: .1rem;
    font-weight: bold;
    border: none;
    padding: 1rem;
    transition: all 0.2s;
    background:linear-gradient(#001b56, #408cc5);
}
.form-label-group {
    position: relative;
    margin-bottom: 1rem;
    margin-top: 30px;
   
}
.form-label-group>input,
.form-label-group>label {
  padding: var(--input-padding-y) var(--input-padding-x);
  margin: 10px;
}
@supports (-ms-ime-align: auto) {
    .form-label-group>label {
      display: none;
    }
    .form-label-group input::-ms-input-placeholder {
      color: #777;
    }
  }
  @media all and (-ms-high-contrast: none),
  (-ms-high-contrast: active) {
    .form-label-group>label {
      display: none;
    }
    .form-label-group input:-ms-input-placeholder {
      color: #777;
    }
  }

  /* InfosBassin*/

.infosBassin{
    justify-content: center;
    align-items: center;
    margin: 30px auto;
}

.content-1{
    background-color: #69d8ff;
    min-height: 300px;
    display:flex;
    align-items: center;
    justify-content: center;
}
.content-12 {
    /*background: linear-gradient(#b9dfe5, #cfeaef);*/
    background: linear-gradient(#f0f0f0, #88b5cc);
    display:flex;
    align-items: center;
    justify-content: center;
    min-height: 200px;
    border-radius: 30px;
    padding-top: 4vh;
}
.image-circle img {
    width: 170px;
    margin: 5px;
}
.content-2{
    background-color: #3d9ddf;
    min-height: 300px;
    flex-direction: column;
    align-items: center;
    justify-content: center;

}
#couvertureCap {
    margin-bottom: 10px;
}
#couvertureCap img {
    width: 300px;
    transform: translate(10px,-40px);
}
.rowContent2{
    justify-content: center;
    align-items: center;
}

.equipement img {
    margin: 15px;
    width: 100px;
}
.equipement center {
    transform:translate(-2px,-74px);
    text-transform: uppercase;
}
.valeurParam{
    transform: translate(25px,-111px);
    text-align: center;
    z-index: 10;
    font-size: 1.8rem;
}
.valeurParam2{
    transform: translate(25px,-101px);
    text-align: center;
    z-index: 10;
    font-size: 1.4rem;    
}

/* class test juste pour essai*/

.test{
    text-align: center;
    align-items: center;
    margin: 10%;
    width: 80%;
    min-height: 200px;
    background-color: #e7f6f7;
    align-items: center;

}
.test h2{
    text-align: center;
    margin: 50px;
    text-shadow: 0 -2px 0 #1e6148;
}
ul {
    list-style: none
}
/*
class display none
*/

.inactive{
    display: none;
}

.active{
    display: block;
}

.btnCenter {
    justify-content: center;
    align-items: center;
    text-align: center;
    margin:5%;
}

/* Page Klereo Calcul*/
.calculButton {
    margin: 5%;
}

.valueSlider {
    background-color: #fff;
    max-width: 40px;
    max-height: 40px;
    font-size: 1rem;
    color: #333;
    text-shadow: 0 1px 0 #f3f3f3;
    margin-right: 10px;
    text-align: center;
}
.formBassin {
    margin-bottom: 10px;
}
.formBassin,
.sliderCalcul,
.klereoCalcul,
.elementcenter{
    justify-content: center;
    text-align: center;
    align-items: center;
}
.slider {
    -webkit-appearance: none;
    width: 40vh;
    height: 25px;
    background: #9e9e9e80;
    outline: none;
    opacity: 0.7;
    -webkit-transition: .2s;
    transition: opacity .2s;
  }
  .slider:hover{
      opacity: 1;
  }

.slider::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 25px;
    height: 25px;
    background: #17a2b8;
    cursor: pointer;
  }
  
  .slider::-moz-range-thumb {
    width: 25px;
    height: 25px;
    background: #17a2b8;
    cursor: pointer;
  }

  /* Equilibre Id*/

  
  #equilibreId h5{
      margin-top: 20px;
  }

  .listenone {
      list-style-type:none;
  }
  .pklereocalcul {
      font-size: 0.9rem;
  }
  .attention {
      font-size: 0.9rem;
      font-weight: bold;
  }
  .klereoCalcul h5 {
      margin-top: 20px;
  }
  
  .btn-link {
      color: #17a2b8
  }
  .btn-link:hover {
   color:#17a2b8;
   zoom: 1.5;      

  }
  /* form */
  .d-block {
      height: 20px;
  }
  .carouselimage {
      height: 200px
  }

  

/* Page Notes */

.note {
    max-height: 200px;
    background-color: #57ace71a;
    margin: 15px 0;
    box-shadow: 0 1rem 3rem 0 rgba(218, 232, 234, 27%);
    overflow-x:hidden;
    overflow-y: auto;
}

.actionmessage {
    text-align: end;
}

.fa-pencil-alt{
    color: #407da7;
}
.titlepageCenter {
   
    font-size: 1.5rem;
    text-align: center;
    padding: 1em;
}
.nombassin {
   font-size: 1.3rem;
   text-align: center;
   font-weight: bold;
}
.padd {
    font-size: 0.9rem;
}
/* Contact */
#contact_message {
    min-height: 200px;
}
.dataTables_wrapper {
    margin: 20px 30px 70px;
}
.error{
    color: red;
    font-size: 0.9rem;
}

.alertgreen{
color: #69e469;
background-color: #69e469;
}
.alertwarning{
color: #ff9800c7;
background-color: #ff9800c7;
}

.alertbleu {
   color: #6ca7f3c7;
   background-color: #6ca7f3c7;
}
.alerthiverne {
    color: #0041f3c7;
    background-color: #0041f3c7;
 }
.alertdanger{
color: #ff0000;
background-color: #ff0000;
}
.fa-trash-alt {
    color:red;
}

.btnalerts {
    color: #fff;
    border-radius: 50px;
}
.alertgris {
    background-color: rgb(117, 111, 111);
}
.alertjaune {
    background-color: rgb(245, 223, 23);
    border-radius: 50px;   
}
#langklereo{
    justify-content: end;
    text-align: end;
    margin-top: -30px;
}
.transposelogin{
    transform: translate(0px, -30%);
}


.cardinfoBassin {
    background: linear-gradient(#e8f8fb, #cfeaef);
    text-align: start;
    max-height: 160px;
    padding: 0;
}
.imgNageur {
  width: 57px;
  height: 29px;
}

.barreBleuklereo i {
    padding-top: 10px;
    margin-right: 10px;
    margin-left: 10px;
}
.barreBleuklereo {
    min-height: 20px;
    background-color: #001b56;
    color: #fff;
    max-height: 50px;
}
.barreBleuklereo a {
    color: #fff;
}

.paramRegul,
.titleNameBassin,
.info,
.textBarreBleu{
    font-size: 1rem;
}



.colNageur {
    align-items: center;
    text-align:center;
    justify-content: center;
    padding-top: 2vh;
}
.sectionbassin{
    margin-right: 10%;
    margin-left: 10%;
}
.btn-paginate {
    width: 25px;
    height: 25px;
}

.arrowlg {
    font-size: 1.66em;
}
.pictonote {
    width: 30px;
}

a:hover {
    text-decoration: none;
}
.paramRegul2 {
    justify-content: center;
    text-align: center;
    align-items: center;
    background: linear-gradient(#f6fdff, #e7f0f7bd);
    margin-bottom: 2vh;
    font-family: Georgia, "Times New Roman", Times, serif;
    border-radius: 40px;
}

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

    .transposelogin {
        transform: translate(0px, -15%);
    }

    .paramRegul,
    .titleNameBassin {
        font-size: 0.8rem;
    }
    .imgNageur {
        width: 35px;
        height: 25px;
    }
    .info{
        font-size: 0.6rem;
    }
    .textBarreBleu{
        font-size: 0.6rem;
    }
    
    #linevertivcal {
        display: none;
    }
    .rowgridvertical {
        text-align: center;
        align-items: center;
    }
    .coltest,
    .sectionbassin {
        padding-left: 0px;
        padding-right: 0px;
    }
    .sectionbassin{
        margin-left:0px;
        margin-right:0px;
    }
    .card-body {
        padding: 1.0rem;
    }
    
    .arrowlg {
        font-size: 1.33em;
    }
   
    .titlepageCenter{
        font-size: 1.3rem;
    }
    .image-circle img {
        width: 150px;
    }
    .valeurParam2{
        transform: translate(20px,-95px);
        text-align: center;
        z-index: 10;
        font-size: 1.2rem;    
    }
    .imagegamme{
        padding: 1vh;
    }
}

.btn-outline-primary {
    color: #001b56;
    border-color: #001b56;
} 
.btn-outline-primary:hover {
 color: #fff;
 background-color: #001b56;
}
.titleInfodiv {
 background-color: #001b56;
 max-width: 260px;
 height: 35px;
 color: #fff;
 padding: 0.5vh;
}
@media screen and (max-width: 991px) {
    .nonephone {
        display: none;
    }
   
}