@import url('https://fonts.googleapis.com/css?family=Varela+Round');


*{
  margin: 0;
  padding: 0;
  text-decoration: none;
  outline: none;
  scroll-behavior:smooth;
}
.container {
  width: 100vw;
  height: 100vh;
  position: fixed;
  top: 0;
  left: 0;
  background: rgb(255,255,255);
  display: flex;
  flex-direction: column;
  align-items: stretch;
  justify-content: center;
  align-content: center;
  z-index: 200000;
}

.flex {
  min-height: 60pt;
}

@keyframes loading {
  0% {
    width: 50pt;
    height: 50pt;
    margin-top: 0;
  }
  25% {
    height: 4pt;
    margin-top: 23pt;
  }
  50% {
    width: 4pt;
  }
  75% {
    width: 50pt;
  }
  100% {
    width: 50pt;
    height: 50pt;
    margin-top: 0;
  }
}

.loader {
  width: 50pt;
  height: 50pt;
  border-radius: 100%;
  border: rgb(248,50,153) 4pt solid;
  margin-left: auto;
  margin-right: auto;
  background-color: transparent;
  animation: loading 1s infinite;
}

.load-text {
  padding-top: 15px;
  text-align: center;
  font: 14pt "Helvetica Neue", Helvetica, Arial, sans-serif;
  color: lighten(#6767fa, 75%);
}

.container-1{
  padding:0 102px;
  min-height:100vh;
}

.container-1:after{
  content:'Fresh!';
  position:absolute;
  top:559px;
  bottom:0;
  right:0;
  font-size:13vw;   
  z-indez:-2;
  font-weight:700;
  color:#000;
  opacity:0.07;
}

.navbar{
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:30px 0;
}

#check{
  display:none;
}

.check-btn{
  position:absolute;
  height:40px;
  width:24px;
  right:40px;
  top:80px;
  margin-top:-64px;
  display:none;
}
 
.check-item{
  position:relative;
  border-radius:3px;
  background-color:#f8982b;
  margin-top:8px;
  -webkit-transition:all 0.3s ease-in-out;
  transition:all 0.3s ease-in-out;
  height:3.5px;
  width:24px;
  background:#f6052a;
}
 
.navbar__brand{
  font-weight:700;
  text-transform:uppercase;
  text-decoration:none;
  font-size:30px;
}

.navbar__brand-link{
  color:#f6052a; 
  text-decoration:none;
}

.nav-wrapper{
  position:relative;
  display:flex;
}

.nav-wrapper__item{
  list-style:none;
  margin:0;
}

.nav-wrapper__link{
  position:relative;
  text-decoration:none;
  font-size:18px;
  font-weight:400;
  padding:4px 15px;
  color:#333;
  text-decoration:none;
  margin:0 20px;
}

.nav-wrapper__link:hover{
  color:#f6052a;   
}
@media (max-width: 450px){
  .navbar{
    height:9px;
  }
 
  .check-btn{
    right:20px;
    top:63px;
    margin-top:-50px;
  }
 
  .navbar__brand{
    font-size:25px;
    padding:0 15px;
    margin-left:2.5px;
    line-height:9px;
  }
 
  .nav-wrapper{
    height:26vh;
    top:53px;
  }

  .nav-wrapper__item{
    margin:15px 0;
    line-height:15px;
  }
}

@media (max-width: 1000px){
  .container-1{
    width:100%;
    padding:0;
    display:block;
    min-height:0;
  }

  .container-1:after{
    display:none;
  }

  .navbar{
    width:100%;
    display:block;
    height:16px;
    background:#161616;
  }
 
  .check-btn{
    display:block;
  }
 
  #check:checked + .check-btn .check-top{
    -webkit-transform:rotate(-45deg);
    transform:rotate(-45deg);
    margin-top:20px;
  }
  #check:checked + .check-btn  .check-bottom{
    opacity:0;
    -webkit-transform:rotate(45deg);
    transform:rotate(45deg);
  }
  #check:checked + .check-btn .check-meat{
   -webkit-transform:rotate(45deg);
   transform:rotate(45deg);
   margin-top:-3.5px;
  }

  #check:checked ~ .nav-wrapper{
    left:0;
  }
 
  .navbar__brand{
    padding:0 30px;
    margin-left:5px;
    line-height:16px;
  }
 
  .nav-wrapper{
    position:absolute;
    width:100%;
    background:#0b0b0b;
    left:-100%;
    text-align:center;
    transition:all .5s;
    top:60px;
    height:60vh;
    padding:0;
    display:block;
    z-index:2;
  }
 
  .nav-wrapper__item{
    margin:30px 0;
    line-height:30px;
  }
 
  .nav-wrapper__link{
    color:#595959;
  }
}
@media (max-height: 450px){
  .nav-wrapper{
    height:100vh;
  }
  
  .nav-wrapper__item{
    margin:15px 0;
    line-height:15px;
  }
}

 
 .shri{
  background:url('k1.jpg');
  width: 100%;
  height: 100vh;
 }
  .banner-text{
   position:absolute;
   top:50%;
   left: 50%;
   transform: translate(-50%,-50%);
   color: #fff;
   text-align: center;
  
 }
 .banner-text h1{
   font-family: 'Lato',Sans-Serif;
   font-size: 55px;
   color: #b0c1c5;
   margin: 0;
  
 }
  .banner-text p{
   display:inline-block;
   font-family:cursive;
   margin: 0;
   font-size: 22px;
   animation:BackInOutLeft;
   animation-duration:2s;
   
 }


 .banner-text a{
   font-family: Poppins;
   text-transform: uppercase;
   text-decoration: none;
   border:1px solid #fff;
   color:fff;
   padding: 10px 35px;
   margin-top: 5%;
   display: inline-block;
   font-size: 17px;
 }
  .banner-text a:hover{
   background:#b0c1c5;
   transition: .9s;
   color:#566062;
 }
 
 
 .about_a{
   width: 100%;
   background: rgb(121,162,157);
   padding: 30px 0;
 }
 .about_b{
   max-width: 1000px;
   overflow: hidden;
   margin: auto;
   padding: 0px 20px;
 }
 .about_b h1{
   text-align:center;
 }
 .about_c{
   width:100px ;
   height: 3px;
   margin: 40px auto;
   background: rgb(155,217,211);
 }
 .about_d{
   display:flex;
   flex-wrap:wrap ;
 }
 .about_e{
   flex:50%;
 }
 .about_f{
   padding-right:30px ;
 }
 .about_f p{
   text-align: justify;
   margin-bottom: 20px;
   
 }
 .about_f a{
   display: inline-block;
   text-decoration: none;
   color:rgb(158,221,216);
      padding: 10px 35px;
   border:2px solid rgb(252,251,252);
   border-radius:0px;
 }
 .about_f a:hover{

   background: #b0c1c5;
   color: #000;
   transition:all ease 0.7s ;
 }
 .progress{
   width: 100%;
   height: 12px;
   background: #ddd;
   border-radius: 12px;
   
 }
 .progress_bar_a{
   width: 80%;
   height: 12px;
   background:#5e5d5d;
 }
 .progress_bar_b{
   width: 70%;
   height: 12px;
   background: #5e5d5d;
 }
  .progress_bar_c{
   width: 60%;
   height: 12px;
   background: #5e5d5d;
 }
 
 .progress span{
   float: right;
   margin-right: 6px;
   line-height:13px;
   font-size: 14px ;
   color: #fff;
 }
 .contactform{
   background:#313840 ;
   box-sizing: border-box;
   
 }
 .contact_a{
   padding: 80px 0;
   text-align:center;
   
 }
 .contact_b{
   max-width: 600px;
   margin: auto;
   padding: 0 20px;
 }
 .contact_b h1{
   margin-bottom: 20px;
   color: #888;
   font-size: 20px;
   font-weight: 400;
   letter-spacing: 4px;
   text-transform: uppercase;
 }
 .name_a,.name_b,.name_c{
   outline: none;
   background: none;
   border: none;
   text-decoration: none;
   border-bottom: 1px solid;
   color: #888;
   padding:6px 10px;
   font-size: 14px;
   margin-bottom:40px;
   
 }
 .name_a{
   float: left;
   width: 200px;
 }
 .name_b{
   float: right;
   width: 200px;
 }
 .name_c{
   width: 100%;
   max-width: 100%;
 }
 .contact_b button{
   background: none;
   color:#70a1ff;
   border: 1px solid #70a1ff;
   padding:12px 40px;
   text-transform:uppercase;
   transition:0.4s linear;
 }
   .contact_b button:hover{
     background:#70a1ff;
     color:#fff;
   }
 .services_1{
   box-sizing: border-box;
   background: #70a1ff;
 }
 .services_2{
   text-align: center;
   justify-content: center;
   display: flex;
   align-items: center;
   min-height: 100vh;
   animation: BackInOutLeft;
   animation-duration: 1s;
 }
 .services_2{
   width:80%;
   height: auto;
   margin: 0 auto;
   display: grid;
   grid-template-rows:auto;
   grid-auto-columns:repeat(auto-fit,minmax(320px,1fr));
   grid-gap: 40px;
   padding: 20px;
 }
 .services_2::before{
   content: '';
   z-index: 2;
   position: absolute;
   top: 0;
   left:-120%;
   width:100%;
   background-color:rgb(255,255,255,0.5);
   transform:skew(20deg);
   opacity: 0.2;
   color:#fff;
   transition: ease-in-out .5s;
 }
 .services_3:hover::before{
   left:120%;
 
 }
 .services_3{
   position:relative;
   background:#000;
   padding:40px ;
   color: #fff;
   text-align:left;
   border-radius:10px;
  box-shadow:0 19px 38px rgba(0,0,0 0.3) 0 15px 12px rgba(0,0,0,0.2);
   
   
 }
 .services_3 i{
   margin-bottom:1.5rem;
   font-size: 29px;
 }
 .services_3 h4{
   font-size: 20px;
   margin-bottom:1.5rem;
   color: #fff;
 }
 .services_3 p{
   letter-spacing: 0.025rem;
   line-height:24px;
   margin-bottom:20px ;
   color:#f2f3f4 ;
 }
 .service_4{
   text-decoration:none;
   text-transform:uppercase;
   font-size: 0.75rem;
   font-weight: 700;
   color:#dce5e7;
 }
 .service_4:after{
   content: '';
   position:absolute;
   top: 0;
   left: 80px;
   height:.125rem;
   bottom: 0;
   margin:200px;
   width:20px;
   background-color:#ff00a0;
 }
 
 .services_3:hover,.services_2 i:hover,.services_2 p:hover,.service_2 h4:hover{
   transform:translateY(-0.5rem);
 }
 footer{
   padding: 90px 0;
   background:#888 ;
 }
 .footer_1{
   max-width:1200px;
   margin: auto;
   padding:0 20px ;
   background:rgb(136,136,136);
   justify-content: space-between;
   align-items: center;
   display: flex;
   flex-wrap:wrap-reverse;
 }
 .footer_4{
   margin: 20px 0;
 }
 .footer_4 a{
   font-size: 30px;
   color:#fff;
   margin-right: 20px;
   text-decoration: none;
   transition: .4s linear;
 }
 .footer_4 a:hover{
   color: rgb(143,126,131);
 }
 .footer_5{
   font-size: 20px;
   margin-top: 10px;
 }
 .footer_7{
   width:100px;
   height: 4px;
   background: rgb(255,255,255);
 }
 .footer_8{
   display: flex;
   flex-wrap: wrap;
   justify-content: center;
   align-items: center;
   
 }
 .footer_9{
   flex: 1;
   padding: 18px 40px;
   font-size: 18px;
   color: #000;
   background: #ddd;
   border: none;
   outline: none;
   border-radius: 30px;
   font-weight: 700;
   min-width: 260px;
   margin-bottom: 20px;
 }
 .footer_10{
   padding: 18px 40px;
   font-size: 18px;
   color: #fff;
   background:rgb(237,144,5);
   border: none;
   outline: none;
   border-radius: 30px;
   font-weight: 700;
   margin-left:17px;
   cursor:pointer;
   transition:opacity .4s linear;
   
 }
 .footer_10:hover{
   opacity:.7;
 }
 .backtotop{
   display:none;
 }
 .ourteam_1{
   background:#eef ;
   overflow-x: hidden;

 display: flex;
 flex-wrap: wrap;
 justify-content:center;
   font-family:'Poppins',Sans-Serif;
 }
 .ourteam_3{
   width:360px;
   height: 360px;
   margin:10px;
   background-color:#262a2b;
   padding: 2% 0;
   box-shadow: 0 2px 12px #0abfbc;
 }
 
 .ourteam_3 img{
   position: relative;
  width:230px;
  height: 230px;
  border-radius:100%;
  margin: 0 auto;
 }
 .ourteam_3 img,h2,p,ul{
   display: flex;
   justify-content:center;
 }
 .ourteam_3 ul{
   list-style-type: none;
   list-style:none;
   margin-top: 30px;
 }
 .ourteam_3 ul li a{
   letter-spacing: 37px;
   color: #ff0060;
   font-size: 30px;
   transition:ease-in-out .7s linear;
   
 }
 .ourteam_3 ul li a:hover{
   color: #68dfd9;
 }
 .ourteam_4 h2{
   font-size: 30px;
   font-weight: bold;
   color: #fff;
   text-transform:uppercase;
 }
 .ourteam_4 p{
   margin-top: 10px;
   font-size: 19px;
   color: #c0c8ca;
 }
 .ourteam_1 h1{
   justify-content:center;
   text-align:center;
   color: #384447;
   font-size: 30px;
   align-items:center
   
 }
 
 h1.our_1{
   font-size: 54px;
   font-weight: 700;
   margin-top: 50px;
   margin-bottom: 30px;
   margin: 20px;
   
 }

 
@media (max-width:700px){
  

 .name_a,.name_b,.name_c{
   width:100%;
 }
  .footer_10{
    width: 100%;
    
    margin-top:10%;
    text-align: center;
    margin:0;
  }
  .footer_6{
    width: 100%;
    margin-bottom: 60px;
  }
  .footer_2{
    
  }
  .footer_1{
    max-width:600px;
    
  }
  .footer_6 p{
    margin-top: 10px;
    margin-bottom:10px;
  }
  .backtotop{
    position: fixed;
    bottom: 20px;
    right: 20px;
    width: 50px;
    height: 50px;
    font-size: 2rem;
    background-color: black;
    color:rgb(254,120,136);
    border-radius: 50px;
    border: none;
    cursor: pointer;
    z-index: 1000;
    outline: none;
    transition:all 0.4s;
    display:block;
}
.backtotop:hover{
    height: 80px;
}
.logo{
  display: none;
  
}
}
