@import url('https://fonts.googleapis.com/css?family=Roboto:300,400,500,700,900');

@font-face {
    font-family: 'SilentReaction';
    src: url('fonts/SilentReaction.eot?#iefix') format('embedded-opentype'),  url('fonts/SilentReaction.woff') format('woff'), url('fonts/SilentReaction.ttf')  format('truetype'), url('fonts/SilentReaction.svg#SilentReaction') format('svg');
    font-weight: normal;
    font-style: normal;
}
/*____K____ */
.tfa{padding:6px;background-color:#ccc;border-radius:50%;color:#fff;}
.navbar-brand{
  padding-right: 0rem!important;
}
.navbar-brand >img{
  width:60%;
}
.navbar-nav{
    font-size: 12px;
    margin-right: 5rem;
}

.mart{
    margin-top: 10%;
}
.navbar{
  background-color: #f2f8fa;
}
.navbar-nav> .nav-item{
  padding-left: 0rem;
    font-size: 11px;
}
.nav-item.active a, .nav-item:hover a{
    border-bottom: 2px solid #fcea10;
}
.fixed-top-1{
    background-color: #fff;
    z-index: 1031!important;
}
.fixed-top-2{
    margin-top: 32px;
    z-index: 1035!important;
}
.navbar-right {
  float: right !important;
  margin-right: 0;
  }
  .enl{
      flex-grow: 0!important;
  }
  .icon-btn { padding: 1px 15px 3px 2px; border-radius:50px;}
 .btn-lg {
    padding: .5rem 3rem!important;
    border-radius: 2.3rem!important;
}
.btn-y{
  background-color: #fcea10;
  color: #7b3200!important;
}
.prp{
  padding-right: 0%!important;
}
.pml{
  margin-left: -95px;
}
/**button slider**/
.switch {
  position: relative;
  display: inline-block;
  width: 405px;
  height: 44px;
}

.switch input {display:none;}

.slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  -webkit-transition: .4s;
  transition: .4s;
}

.slider:before {
  position: absolute;
  content: "AGIR";
  padding: 6px 1px 0 7px;
  height: 36px;
  width: 46px;
  left: 4px;
  bottom: 2px;
  background-color: yellow;
  -webkit-transition: .4s;
  transition: .4s;
}

input:checked + .slider {
  background-color: #FFF;
}

input:focus + .slider {
  box-shadow: 0 0 1px #FFF;
}

input:checked + .slider:before {
  -webkit-transform: translateX(26px);
  -ms-transform: translateX(26px);
  transform: translateX(353px);
}

/* Rounded sliders */
.slider.round {
  border-radius: 34px;
}

.slider.round:before {
  border-radius: 50%;
}
/**button slider**/
.col-md-4>.text-center>.btn{
  border-radius: 50px;
}
.apropos{
  font-size:27px;
  margin-top:47%;
}
.roboto_black{
    font-family: 'Roboto', sans-serif !important;
    font-weight: 900;
}
.roboto_regular{
    font-family: 'Roboto', sans-serif !important;
    font-weight: 400;
}
/*____K____ */
.beige{
    background: #fff;
}

.silent{
    font-family: 'SilentReaction', sans-serif !important;
}
.roboto{
    font-family: 'Roboto', sans-serif !important;
    font-weight: 500;
}
.h1.silent{
    font-size: 3rem !important;
}
#home{
    padding-top: 98px;
}
.nav-link{
    padding: 0.3rem 1rem !important;
}
.nav-item.active{
    /*background: #fff;*/
}
.ag .nav-item.active{
    background: transparent !important;
}

.nav-item:hover{
    /*background: #fff;*/
}
.ag .nav-item:hover{
    background: transparent;
}
.ag .nav-item:hover a{
    color: #7b3200 !important;
}
.mar{
    color: #7b3200 !important;
}
.sepa{
    border-bottom: 2px solid #7b3200;
    padding-bottom: 40px ;
}
.grey{
    color: #333333 !important;
}
.ht{
    font-size: 3rem !important;
    line-height: 45px !important;
}
.h1, h1 {
    font-size: 1.5rem !important;
}
.gris{
    color: #494949 !important;
}
.larger{
    font-size: larger;
}
.carousel-indicators .active{
    background-color: #7b3200 !important;
}

.carousel-indicators li{
    background-color: #c6c6c6 !important;
}
.fixed-top{
  /*  border-bottom: 1px solid #ffffffd6;*/
}

.navbar{
    padding: 0 !important;
}

.navbar-nav{
    padding-bottom: 1rem;
    padding-top: 1rem;
}


.navbar-brand {
    padding-bottom: .8rem !important;
    padding-top: .8rem !important;
/*    border-right: 1px solid #ffffffd6;;*/
    padding-left: 1rem;
    padding-right: 1rem;
}
.ag{
    background: #50be87;
    margin-left: 10px;
    border-left: 1px solid #ffffffd6;
}
.ag a{
    color: #fff !important;
}
.btn-primary {
    color: #fff;
    background-color: #7b3200 !important;
    border-color: #7b3200 !important;
}

.logobas{
    margin-top:6%;
    margin-bottom:17px;
}
._2p3a {
    margin: auto;
}
.multi{
    position: absolute;
    width: 100%;
    height: 264vh;
    z-index: -999999;
}
.navbar-light .navbar-toggler{
    color: #7b3200 !important;
    border-color: transparent !important;
}
.navbar-toggler{
    /*font-size: 40px !important;
    padding-right: 26px !important;*/
}
@media (min-width: 992px){
    .navbar-expand-lg .navbar-nav .nav-link{
        padding-right: 1rem !important;
        padding-left: 1rem !important;
    }
    .pkah{
      height: 81vh;
    }
}

@media (max-width: 989px){
    .navbar-nav{
        margin-right: 0 !important;
    }
    .navbar-nav> .nav-item{
        text-align: center;
        font-size: 19px;
    }
    .fixed-top-2{
        margin-top: 0;
    }
}

@media (max-width: 767px ) {
    .mart{
        margin-top: 23.5%;
        font-size: 12px;
    }
    .dim{
        font-size: 16px;
        line-height: 20px !important;
    }
    .dim2{
        font-size: 16px !important;
        line-height: 20px !important;
    }


}

@media (max-width: 570px ) {
    .pml{
      margin-left: 0px!important;
    }
    .mart{
        margin-top: 2%;
        font-size: 12px;
    }
    .mart p{
        text-align: center !important;
    }
    .logobas{
        /*margin-top: 0;*/
        margin-bottom:-3px;
    }
    .ivid{
        height: 256px !important;
    }
    .titre1{
        margin-top: 1rem !important;
        margin-bottom: 10rem !important;
    }
    .multi{
        height: 280vh;
    }

}
@media (max-width:414px) {
    .pml{
      margin-left: 0px!important;
    }
    .apropos {
      font-size: 13px;
      margin-top: 50%;
    }
    #home{
        background-position-x: right;
    }
    #pka >.container > .row{
        margin-top: 0 !important;
    }
    #pka img{
        margin-top: 7% !important;
    }
    .navbar-brand >img {
      /*width: 100%;*/
      }
      .fixed-top-2 {
          margin-top: 0px!important;
      }
      #home>.container>.row>.col-md-auto>p{
        font-size: 1.5rem!important;
        font-weight: 700!important;
      }
      input:checked + .slider:before {
        -webkit-transform: translateX(26px);
        -ms-transform: translateX(26px);
        transform: translateX(253px);
      }
      #pka>.container>.row>.col-md-6>img{
        margin-left: 18%;
      }
      .img-p{
        background-position-x:center!important;
        background-size: cover!important;
      }
      #sign>.container>.row>.col-md-7>.row>.col>p{
        font-size: 2.5rem !important;
      }
      #sign>.container>.row>.col-md-7>.row>.col-md-10>p{
        font-size: 12px !important;
      }
      footer>.row>.col-md-4>.row>.col-md-10>img{
        width: 58%;
      }
      footer>.row>.col-md-4{
        font-size: 14px;
      }
      .dvl{
        margin-top:-78%!important;
        margin-left: 50%;
      }
      .dvr{
        margin-left: -59%;
      }
      .ml{
        margin-left: 30%;
      }
    .pka{
      margin-left: 8%!important;
        width: 84%;
    }
}
@media (max-width:320px) {
  .pml{
    margin-left: 0px!important;
  }
  .navbar-brand{
    margin-right: 0rem!important;
  }
  .apropos {
    font-size: 13px!important;
    margin-top: 50%!important;
  }
}
@media (max-width:360px) {
  .pml{
    margin-left: 0px!important;
  }
  .apropos {
    font-size: 16px;
    margin-top: 50%;
  }
}
@media (max-width:375px) {
  .pml{
    margin-left: 0px!important;
  }
  .apropos {
      font-size: 16px!important;
      margin-top: 50%!important;
  }
}
@media (max-width:414px) {
  .apropos {
    font-size: 18px;
    margin-top: 50%;
  }
}
@media (max-width:411px) {
  .pml{
    margin-left: 0px!important;
  }
  .apropos {
    font-size: 18px;
    margin-top: 50%;
  }
}
@media (max-width:768px) {
  .fixed-top-2 {
      margin-top: 0px!important;
  }
  .pml{
    margin-left: -60px;
  }
}


.onoffswitch {
    position: relative; width: 200px;
    margin: auto;
    -webkit-user-select:none; -moz-user-select:none; -ms-user-select: none;
}
.onoffswitch-checkbox {
    display: none;
}
.onoffswitch-label {
    display: block; overflow: hidden; cursor: pointer;
    border: 2px solid #FFFFFF; border-radius: 42px;
}
.onoffswitch-inner {
    display: block; width: 200%; margin-left: -100%;
    transition: margin 0.3s ease-in 0s;
}
.onoffswitch-inner:before, .onoffswitch-inner:after {
    display: block; float: left; width: 50%; height: 52px; padding: 0; line-height: 52px;
    font-size: 16px; color: white; font-family: Trebuchet, Arial, sans-serif; font-weight: bold;
    box-sizing: border-box;
}
.onoffswitch-inner:before {
    content: "MERCI";
    padding-left: 16px;
    background-color: #FFFFFF; color: #7B3200;
}
.onoffswitch-inner:after {
    content: "AGIR";
    padding-right: 16px;
    background-color: #9E9E9E; color: #FFFFFF;
    text-align: right;
}
.onoffswitch-switch {
    display: block; width: 45px; margin: 3.5px;
    background: #FCEA10;
    position: absolute; top: 0; bottom: 0;
    right: 144px;
    border: 2px solid #FFFFFF; border-radius: 42px;
    transition: all 0.3s ease-in 0s;
}
.onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-inner {
    margin-left: 0;
}
.onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-switch {
    right: 0px;
}


.agir{
    color: #fff;
    font-weight: 900;
    background: #6e2b00;
    font-size: 18px;
    padding: 2px 60px 2px 60px;
    border-radius: 21px;
    text-transform: uppercase;
    transition: all 1ms ease-out ;
}

.don{
    color: #fff;
    font-weight: 900;
    background: #6e2b00;
    font-size: 18px;
    padding: 2px 17px 2px 17px;
    border-radius: 21px;
    text-transform: uppercase;
    transition: all 1ms ease-out ;
}

.agir:hover,.don:hover{
    text-decoration: none;
    color: #fff;
    background: rgba(110, 43, 0, 0.72);
}