/** all */
.pages.locked{
  height: 100vh;
  overflow: hidden;
}
::selection {
    background-color: #b3d4fc;
    color: #000;
    text-shadow: none;
}

.video-youtube {
    height:500px !important;
}

          .valueButton{
            background-color: #00aeef !important;
    border: 1px solid #00aeef !important;
    height: 45px;
    width: fit-content;
    display: flex;
    align-items: center;
    border-radius: 5px;
    font-size: 14px;
    margin: auto;
    color: white;
    text-decoration: none;
    white-space: nowrap;
          }
          .valueButton:hover{
            color: white;
          }

          @media (min-width: 1100px){
            .container {
    max-width: 1050px ;
}
.valueButton{
  padding: 0px 40px;

}
          }




@media (min-width: 1264px){
  .container {
    max-width: 1185px;
}
.valueButton{
  padding: 0px 40px;

}
}

@media (min-width: 960px){
  .container {
    max-width: 1000px;
}
.valueButton{
  padding: 0px 40px;

}

.video-youtube {
    height:200px !important;
}
}

@media (max-width: 800px){
 
.valueButton{
  padding: 0px 15px;

}
}


          /** navbar */
        
          .navbar{
            background-color: white;
            padding: 10px 20px;
            border-bottom: 1px solid #e3e3e3;
          }
          .navbar-brand{
            margin-right: 50px;
          }
          .navbar-brand img{
            width: 120px;
          }
          .nav-item{
            font-size: 14px;
            margin-right: 15px;
          }
          .navbar-light .navbar-nav .nav-link.active, .navbar-light .navbar-nav .show>.nav-link{
            color: #00aeef;
          }
          .navbar .auth a{
            padding-left: 20px !important;
    padding-right: 20px !important;
    border-radius: 5px;
    font-weight: bold;
          }
          .navbar .signUp{
            color: #00aeef !important;
    background: #00aeef08 !important;
 
          }
          .navbar .login{
            color: #000000 !important;
    background: #bdbdbd2e !important;

          }
          

          
        /** header slider */
        
        .headerSlider .owl-dots{
          position: absolute;
  bottom: 20px;
  width: 100%;
  justify-content: center;
  display: flex;
        }
        .headerSlider .owl-dot{
          width: 20px;
  height: 20px;
  border-radius: 50%;
  background: #ccc !important;
  margin-right: 15px
        }
        .headerSlider .owl-dot.active{
          background-color: #00aeef !important;
        }
        .headerSlider .owl-dot:last-of-type{
          margin-right: 0px
        }
      

      /** vendors */  
        
          .vendors{
            position: relative;
          }
          .vendors .header{
            margin-bottom: 50px;
          }
          .vendors .header h3{
            font-size: 33px;
          }
          .vendors .header p{
            color: rgba(0,0,0,.7);
          }
          .vendors .owl-carousel{
            position: initial;
            width: 90%;
            margin: auto;
            margin-bottom: 30px;
          }
          .vendors .owl-nav{
            position: absolute;
            top: 0px;
            right: 0px;
          }
          .vendors .owl-nav .owl-prev{
            margin-right: 15px;
          }
          .vendors .owl-nav span{
            border: 1px solid #ddd!important;
    height: 45px;
    width: 45px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: white;
    border-radius: 50%;
    font-size: 30px;
    padding-bottom: 7px;
          }
          @media(max-width: 700px){
            .vendors .owl-nav{
              display: none;
            }
          }

          @media (min-width: 992px){
            .vendors .owl-nav{
              display: initial;
            }
          }

         
          /** newsletter */
        
          .newsLetter{
            background-color: #00aeef08;
          }
          .newsLetter .form-group{
            display: flex;
          }
          .newsLetter input{
            background-color: transparent !important;
          }
          .newsLetter h4{
            font-size: 14px!important;
    margin-bottom: 10px;
    color: #00aeef;
          }
          
          @media (max-width: 800px){
            .newsLetter{
            padding: 30px;
          }
            .newsLetter .container{
            width: 100%;
          }
 }
          @media (min-width: 1100px){
            .newsLetter .container{
            width: 50%;
          }
          }

@media (min-width: 1264px){
  .newsLetter{
            padding: 40px;
          }
  .newsLetter .container{
            width: 50%;
          }
}

@media (min-width: 960px){
  .newsLetter{
            padding: 40px;
          }
  .newsLetter .container{
            width: 50%;
          }
}
        
        /** video section */
          .videoSec{
            text-align: center;
            padding-top: 80px;
            padding-bottom: 80px;
          }
          .videoSec .header h3{
            margin-bottom: 10px;
          }
          .videoSec .header p{
            color: rgba(0,0,0,.7);
            margin-bottom: 50px;
          }
          @media (max-width: 800px){
           
            .videoSec.container{
            width: 100%;
          }
          .videoSec .header h3{
            font-size: 28px;
          }
 }
          @media (min-width: 1100px){
            .videoSec.container{
            width: 60%;
          }
          .videoSec .header h3{
            font-size: 30px;
          }
          }

@media (min-width: 1264px){

  .videoSec.container{
            width: 60%;
          }
          .videoSec .header h3{
            font-size: 33px;
          }
}

@media (min-width: 960px){

  .videoSec.container{
            width: 60%;
          }
}
        
        /** phone slider */
          .phoneSec{
            background-color: #00aeef08;
            padding: 70px 0px;
            margin-bottom: 80px;
          }
          .phoneSec .header h3{
            margin-bottom: 10px;
            font-size: 37px;
          }
          .phoneSec .header p{
            color: rgba(0,0,0,.7);
            margin-bottom: 0px;
          }
          .phoneSec .steps{
            padding-right: 30px;
          }
          .phoneSec .step{
            display: flex;
            cursor: pointer;
            margin-top: 30px;
          }
          .phoneSec .step .num{
            display: flex;
    justify-content: center;
    align-items: center;
    color: white;
    font-size: 16px;
    border-radius: 50%;
    margin-right: 15px;
    background-color: #585858 !important;
    height: 56px;
    width: 56px;
          }
          .phoneSec .step.active .num{
            background-color: #00aeef !important;
          }
          .phoneSec .step > div{
            width: calc(100% - 71px);
          }
          .phoneSec .step h3{
            font-size: 20px;
          }
          .phoneSec .step p{
            line-height: 30px;
            margin-bottom: 0px;
            color: rgba(0,0,0,.7);
          }
          .phoneSec .slider{
            display: flex;
            align-items: center;
            position: relative;
          }
          .phoneSec .slider .phone{
            text-align: center;
          }
          .phoneSec .slider .phone img{
            width: 90%;
            display: none;
          }
          .phoneSec .slider .phone img.active{
            display: initial;
          }
          .phoneSec .slider .controls{
            position: absolute;
    left: 100%;
    transform: translateX(100%);
          }
          .phoneSec .slider .controls span
            {
    border: 1px solid #ddd!important;
    height: 55px;
    width: 55px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    margin-bottom: 10px;
    cursor: pointer;
}
.phoneSec .slider .controls span.disabled{
  opacity: .4;
}
@media (max-width: 800px){
           
  .phoneSec .slider .controls{
    display: none;
  }
}
         @media (min-width: 1100px){
          .phoneSec .slider .controls{
    display: block;
  }
         }

@media (min-width: 1264px){

  .phoneSec .slider .controls{
    display: block;
  }
}

@media (min-width: 960px){
  .phoneSec .slider .controls{
    display: block;
  }
}
        
        /** mov add */
          .mobAdd {
            width: 100%;
            background-color: #00aeef !important;
            margin-top: 60px;
          }
          .mobAdd .row{
            width: 100%;
          }
          .mobAdd .bg img{
            width: 100%;
          }
          .mobAdd .content{
            display: flex;
    align-content: center;
    flex-wrap: wrap;
    justify-content: center;
          }
          .mobAdd .content h3{
            color: white;
    text-align: center;
    width: 50%;
    font-size: 33px;
    margin-bottom: 20px;
    line-height: 45px;
          }
          .mobAdd .content .adds{
            display: flex;
    justify-content: center;
          }
          .mobAdd .content .adds a:first-of-type{
            margin-right: 15px;
          }
          .mobAdd .content .adds a img{
            width: 120px;
          }
        
        /** phoneNumber */

        .phoneNumber{
          padding-top: 40px;
          padding-bottom: 40px;
        }
        .phoneNumber .icon{
          display: flex;
          justify-content: end;
        }
        .phoneNumber i{
          font-size: 37px;
          color: #f26522;
        }
        .phoneNumber h3{
          font-size: 32px;
        }
        .phoneNumber p{
          font-size: 15px;
          color: #8d8d8de6;
        }
          /** contact */
          .contact{
            background-color: #00aeef08;
            padding: 60px;
          }
          .contact h3{
            text-align: center;
            margin-bottom: 80px;
            font-size: 25px;
          }
          .contact p{
            font-size: 15px;
            color: #8d8d8de6;
            text-align: center;
            margin-top: -60px;
            margin-bottom: 20px;
          }
          .contact .forms{
            margin: auto;
            margin-top: 20px;
          }
          .contact .forms .form-group{
            margin-bottom: 20px;
          }
          .contact .forms .form-group label{
            margin-bottom: 5px;
          }
          .contact input,
          .contact textarea{
            background-color: transparent;
            outline: 0px;
          }
          .contact textarea{
            height: 105px;
            resize: none;
          }
          .contact .owl-dots{
            display: flex;
            justify-content: center;
          }
         
          .contact a{
            margin-top: 30px;
          }
          .contact .owl-dots{
            position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 105%;
          }
          .contact .owl-dot{
    border-bottom: 1px solid transparent;
    position: relative;
    
          }
          .contact .owl-dots button{
            width: 120px;
    height: 45px;
    margin: 0px;
    border: 0px;
    background: none;
    color: #a1a1a1;
          }
          .contact .owl-dot.active button{
            color: #00aeef !important;
          }
          .contact .owl-dot span{
            position: absolute;
    width: 100%;
    bottom: 0px;
    height: 2px;
    background: #00aeef;
    left: 0px;
          }

          @media (max-width: 800px){
            .contact .forms{
            width: 100%;
          }
          
}
         @media (min-width: 1100px){
          .contact .forms{
            width: 60%;
          }
         }

@media (min-width: 1264px){
  .contact .forms{
            width: 50%;
          }
 
}

@media (min-width: 960px){
  .contact .forms{
            width: 50%;
          }
}
        

/** offers */
        
          .offers{
            position: relative;
            margin-bottom: 80px;
          }
          .offers .header{
            margin-bottom: 30px;
          }
          .offers .header h3{
            font-size: 33px;
          }
          .offers .header p{
            color: rgba(0,0,0,.7);
          }
          .offers .owl-carousel{
            position: initial;
            margin-bottom: 30px;
          }
          .offers .owl-nav{
            position: absolute;
            top: 0px;
            right: 0px;
          }
          .offers .owl-nav .owl-prev{
            margin-right: 15px;
          }
          .offers .owl-nav span{
            border: 1px solid #ddd!important;
    height: 45px;
    width: 45px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: white;
    border-radius: 50%;
    font-size: 30px;
    padding-bottom: 7px;
          }
          @media(max-width: 700px){
            .offers .owl-nav{
              display: none;
            }
          }

          @media (min-width: 992px){
            .offers .owl-nav{
              display: initial;
            }
          }
          .offers .offer{
            padding: 10px;
          }
          .offers .offer > div{
            box-shadow: 0px 0px 15px #cbcbcb91;
            border-radius: 7px;

          }

          .offers .offer img{
            margin-bottom: 15px;
            width: 100%;
          }
          .offers .offer .date{
            background: #d1eeed;
            width: fit-content;
            border-radius: 10px;
            display: flex;
            align-items: center;
            height: 30px;
            font-size: 14px;
            margin-bottom: 15px;
            justify-content: center;
            margin-left: 15px;
            padding-right: 15px;
            color: #20b9ad;
          }
          .offers .offer .date i{
            border-radius: 10px;
            background: #20b9ad;
            margin-right: 10px;
            color: white;
            height: 100%;
            display: flex;
            align-items: center;
            padding: 0px 10px;
          }
          .offers .offer .date span{
            padding-bottom: 3px;
          }
          .offers .offer .content{
            border-top: 1px solid #dfdfdfd1;
    padding: 15px;
          }
          .offers .offer .content a{
            text-decoration: none;
    width: 100%;
    color: #00aeef;
    font-size: 15px;
          }

          .offers .offer .content a i{
            margin-left: 10px;
          }
        
        
          /**  footer */
        
.footer{
  padding-top: 60px;
  padding-bottom: 60px;
}
.footer h5{
  font-size: 18px;
  margin-bottom: 15px;
}
.footer h5 span{
  color: #afafaf;
    font-weight: 100;
}
          .footer .title{
            margin-bottom: 30px;
          }
          .footer a{
            color: black;
    display: block;
          }
          .footer .social{
            display: flex;
          }
          .footer .social a{
            display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    color: #00aeef;
    background-color: #f9f9f9;
    font-size: 22px;
    margin-right: 15px;
    text-decoration: none;
          }
          .footer .social a:last-of-type{
            margin: 0px;
          }
          .copyrights{
            background-color: #00aeef;
            color: white;
            font-size: 15px;
            text-align: center;
            padding-top: 10px;
            padding-bottom: 10px;
          }
     


          
/** offers */
        
.stores{
  position: relative;
  margin: 80px auto;
}
.stores .header{
  margin-bottom: 30px;
}
.stores .header h3{
  font-size: 33px;
}
.stores .header p{
  color: rgba(0,0,0,.7);
}
.stores .header .buttonCon{
  display: flex;
  justify-content: flex-end;
  
}
.stores .header .valueButton{
  margin: 0px;
  background-color: white !important;
  color:  #00aeef;
}
.stores .form-group{
  display: flex;
}
.stores input{
  margin-right: 15px;
}
.categories{
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  margin-top: 50px;
  margin-bottom: 60px;
}
.categories a{
  padding: 5px 10px;
  border-radius: 10px;
  border: 1px solid #ced4da;
  background-color: white;
  color: #707070;
  text-decoration: none;
  margin-right: 10px;
  font-size: 13px;
  min-width: 90px;
  text-align: center;
  margin-bottom: 10px;
}
.categories a:hover{
  background-color: #d6d8db5e;
}
.categories a.active{
  background-color: #00aeef !important;
  color: white !important;
  border: 1px solid #00aeef;
}
.stores .side h4{
  height: 47px;
  border-left: 1px solid #999999;
  width: 100%;
  margin: 0px;
  color: #999999;
  font-size: 14px;
  display: flex;
  align-items: center;
  padding-left: 13px;
  font-weight: 500;
  cursor: pointer;
}
.stores .side h4.active{
  border-left: 3px solid #00aeef;
  color: #00aeef;

}
.stores .offer{
  padding: 5px;
  border-radius: 7px;
  margin-bottom: 45px;
}
.stores .offer > div{
  overflow: hidden;
  box-shadow: 0px 0px 20px #cbcbcb59;
}
.stores .offer .head{  
    height: 130px;
  border-bottom: 1px solid #e3e3e3;
  margin-bottom: 15px;
  width: 100%;
}
.stores .offer .head div{
  width: 65%;
  background-size: contain;
  background-color: white;
  background-position: center;
  background-repeat: no-repeat;
  margin: auto;
height: 100%;
}
.stores .offer .date{
  background: #d1eeed;
  width: fit-content;
  border-radius: 10px;
  display: flex;
  align-items: center;
  height: 30px;
  font-size: 14px;
  margin-bottom: 15px;
  justify-content: center;
  margin-left: 15px;
  padding-right: 15px;
  color: #20b9ad;
}
.stores .offer .date i{
  border-radius: 10px;
  background: #20b9ad;
  margin-right: 10px;
  color: white;
  height: 100%;
  display: flex;
  align-items: center;
  padding: 0px 10px;
}
.stores .offer .date span{
  padding-bottom: 3px;
}
.stores .offer .content{
  border-top: 1px solid #dfdfdfd1;
padding: 25px;
display: flex;
justify-content: space-between;
}
.stores .offer .content a{
  text-decoration: none;
width: 100%;
color: #00aeef;
font-size: 14px;
}
.stores .offer .content a i{
  margin-left: 10px;
}
.stores .offer .content img{
  width: 60px;
}

/**offersPage */
.offersPage .offer{
  padding: 17px !important;
}

 /** howItWorks */
 .howItWorks{
  margin-bottom: 80px;
  margin-top: 80px;
}
.howItWorks .header {
  text-align: center;
  margin-bottom: 60px;
}
.howItWorks .header h3{
  margin-bottom: 10px;
}
.howItWorks .header p{
  color: rgba(0,0,0,.7);
  margin-bottom: 0px;
}

.howItWorks .step{
  display: flex;
  cursor: pointer;
  padding: 30px 35px;
  transition: .5s all;
}
.howItWorks .step.active{
  background-color: #f5f9f9 !important;
}
.howItWorks .step .num{
  display: flex;
justify-content: center;
align-items: center;
color: white;
font-size: 16px;
border-radius: 50%;
margin-right: 15px;
background-color: #585858 !important;
height: 50px;
width: 50px;
}
.howItWorks .step:nth-of-type(2) .num{
  color: #20b9ad !important;
  background-color: #f4f4f4!important;
}
.howItWorks .step:nth-of-type(1) .num{
  color: #fb8c00 !important;
  background-color: #00aeef08!important;
}
.howItWorks .step:nth-of-type(3) .num{
  background-color: #defbc0!important;
  color: #4caf50 !important;
}
.howItWorks .step > div{
  width: calc(100% - 71px);
}
.howItWorks .step h3{
  font-size: 19px;
}
.howItWorks .step p{
  line-height: 30px;
  margin-bottom: 0px;
  color: rgba(0,0,0,.7);
  font-size: 15px;
}
.howItWorks .slider{
  display: flex;
  align-items: center;
  position: relative;
}
.howItWorks .slider .phone{
  text-align: center;
  padding: 20px;
}
.howItWorks .slider .phone img{
  width: 90%;
  display: none;
}
.howItWorks .slider .phone img.active{
  display: initial;
}
.howItWorks .slider .controls{
  position: absolute;
left: 100%;
transform: translateX(100%);
}
.howItWorks .slider .controls span
  {
border: 1px solid #ddd!important;
height: 55px;
width: 55px;
display: flex;
align-items: center;
justify-content: center;
border-radius: 50%;
padding-bottom: 7px;
margin-bottom: 10px;
cursor: pointer;
}
.howItWorks .slider .controls span.disabled{
opacity: .4;
}
@media (max-width: 800px){
 
.howItWorks .slider{
display: none;
}.howItWorks .steps{
  padding-left: 0px;
}
}
@media (min-width: 1100px){
.howItWorks .slider{
display: block;
}.howItWorks .steps{
  padding-left: 80px;
}
}

@media (min-width: 1264px){

.howItWorks .slider{
display: block;
}.howItWorks .steps{
  padding-left: 80px;
}
}

@media (min-width: 960px){
.howItWorks .slider{
display: block;
}.howItWorks .steps{
  padding-left: 80px;
}
}

/** signin */

.authModal{
  width: 100%;
  height: 100%;
  background-color: white;
  position: fixed;
  top: 100%;
  left: 0px;
  z-index: 99;
  padding-top: 50px;
  overflow: auto;
  padding-bottom: 70px;
}
.authModal::after{
  content: "";
}
.authModal .topBar{
  width: 70%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin: 0px auto 30px auto;
}
.authModal .topBar img{
  width: 140px;
}
.authModal .topBar i{
  cursor: pointer;
  font-size: 20px;
}
.authModal .header{
  text-align: center;
  margin-bottom: 30px;
}
.authModal .content{
  margin: auto;
  padding: 0px 15px;
}
.authModal .form-group{
  margin-bottom: 20px;
}
.authModal input,.authModal select{
  font-size: 15px !important;
}
.authModal .form-group .input-group-text{
  height: 100%;
  padding-left: 15px;
  padding-right: 20px;
  background: none;
  cursor: pointer;
}
.authModal .phoneInput .input-group-text{
    color: #00aeef;
}
.authModal .passInput input{
  border-right: 0px;
}
.authModal .form-group label{
  margin-bottom: 5px;
}
.authModal .link {
  display: flex;
  justify-content: flex-end;
  width: 100%;
  margin-top: 35px;
  margin-bottom: 35px;
}
.authModal .link a{
  display: block;
  color: black;
  font-size: 14px;
}
.authModal .valueButton{
  margin-top: 50px;
}
@media (max-width: 800px){
  .authModal .content{
  width: 100%;
}

}
@media (min-width: 1100px){
.authModal .content{
  width: 60%;
}
}

@media (min-width: 1264px){
.authModal .content{
  width: 50%;
}

}

@media (min-width: 960px){
.authModal .content{
  width: 50%;
}
}

/** about */

.about{
  width: 100%;
}
.about .head{
  width: 100%;
  display: block;
  margin-bottom: 20px;
}
.about .head img{
  width: 250px;
}
.about p{
  font-size: 15px;
  margin-bottom: 30px;
  color: rgba(0,0,0,.5);
}
.about span{
  display: block;
  font-weight: bold;
  margin-bottom: 30px;
}


          /** locations */
        
        
          .locations .form-group{
            display: flex;
            padding: 0px;
          }
          .locations .input-group{
            box-shadow: 3px 5px 10px #dfdada;
            margin-right: 15px;
          }
          .locations input{
            background-color: transparent !important;
            font-size: 13px;
            border-left: 0px;
          }
         
          .locations .input-group-text{
            height: 100%;
            border-right: 0px;
            background: none;
            color: #00aeef ;
          }
          .locations .valueButton i{
            margin-right: 5px;
          }
          
          @media (max-width: 800px){
            .locations{
              padding: 20px 30px;
              margin-bottom: 40px;
          }
            .locations .container{
            width: 100%;
          }
          .locations .form-group{
            flex-wrap: wrap;
          }
 }
          @media (min-width: 1100px){
            .locations{
              padding: 20px 50px;
              margin-bottom: 60px;
            }
            .locations .container{
            width: 70%;
          }
          .locations .form-group{
            flex-wrap: initial;
          }
          }

@media (min-width: 1264px){
  .locations{
    padding: 20px 50px;
    margin-bottom: 60px;
          }
  .locations .container{
            width: 60%;
          }
          .locations .form-group{
            flex-wrap: initial;
          }
}

@media (min-width: 960px){
  .locations{
    padding: 20px 50px;
    margin-bottom: 60px;
          }
  .locations .container{
            width: 60%;
          }
          .locations .form-group{
            flex-wrap: initial;
          }
}