

@font-face{
    font-family: gronueregular;
    src: url('fonts/NeueHaasDisplayLight.ttf');
}
@font-face{
    font-family: gronuebold;
    src: url('fonts/NeueHaasDisplayThin.ttf');
}
@font-face{
    font-family: gronuemd;
    src: url('font2/groMd.ttf');
}

@font-face{
    font-family: song;
    src: url('fonts/SangBleuKingdomTrial-Light.ttf');
}
@font-face {
  font-family: naasroman;
  src: url('fonts/NeueHaasDisplayRoman.ttf');
}

@font-face {
  font-family: naathinner;
  src: url('fonts/NeueHaasDisplayThin.ttf');
}

/* @font-face{
  font-family: song;
  src: url('fonts/NeueHaasDisplayLight.ttf');
} */

/* body{
  top: 0px !important;
  left: 0px !important;
  width: 5757px !important;
  height: 900px !important;
  background: var(--unnamed-color-121212) 0% 0% no-repeat padding-box !important;
  background: #121212 0% 0% no-repeat padding-box !important;
  opacity: 1 !important;
} */


  
  .logo {
    flex: 1;
  }
  
  .menu {
    flex: 2;
    text-align: center;
  }
  
  .menu ul {
    list-style-type: none;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  
  .menu li {
    margin: 0 0.625rem;
  }
  
  .menu a {
    font-family: gronueregular;
    font-size: 14px;
    text-decoration: none;
    color: rgb(49, 66, 58);
  }
  
 /* Extra large devices (large laptops and desktops, 1200px and up) */

 @media only screen and (min-width: 1440px) {
  /* .el{
    position: absolute;
    background-color: transparent;
    height: 50px;
    width: 50px;
    border-radius: 50%;
    border-color: black;
    border-width: 0.625rem;
  } */
  .welcome{
    /* position: relative !important;
    right: 39rem !important;
    bottom: 55rem !important; */
    /* position: absolute;
    top: 108px;
    left: 60px;
    transform: rotate(270deg);
    color: var(--unnamed-color-f7f5f2);
    text-align: center;
    font: normal normal normal 1.25rem/1.875rem;
    font-family: naasroman;
    letter-spacing: 1.6px;
    color: #F7F5F2;
    text-transform: uppercase;
    opacity: 1; */
  }
  .business{
      /* position: relative !important;
      left: 25rem !important;
      top: 9rem !important;
      font-size: 11.5rem !important;
      line-height: 10rem !important; */
  }
  .brand{
      /* position: relative !important;
      right: 75rem !important;
      top: 9rem !important;
      font-size: 11rem !important;
      line-height: 10rem !important; */
  }
  .about{
      /* position: relative !important;
      left: 51rem !important;
      top: 6rem !important;
      font-size: 1.2rem !important; */
  }
  .man{
      /* position: relative !important;
      left: 72rem !important;
      height: 480px !important;
      width: 350px !important;
      top: -18rem !important; */
  }
  .secslidtext{
    /* position: relative !important;
    font-size: 2.5rem !important;
    top: 19rem !important; */
  }

  .bot{
    /* position: relative !important;
    right: -40rem !important;
    top: 36rem !important;
    height: 600px !important;
    width: 400px !important; */
  }
  /* .creative{
    font-size: 1.5rem !important;
  }
  .creativespan{
    font-size: 1.6rem !important;
  }
  .filfood{
    font-size: 1.5rem !important;
  }
  .filfoodspan{
    font-size: 1.6rem !important;
  }
  .som{
    width: 43rem !important;
    height: 21rem !important;
  }
  .som2{
    width: 43rem !important;
    height: 21rem !important;
  }

  .build{
    position: relative !important;
    font-size: 10rem !important;
  }
  .brservice{
    
  } */
}

#frutybg{
  background-size: cover;
	background-attachment: fixed;
  background-image: url(images/serv/shoes.jpg);
  width: 100%;
  height: auto;
  background-position: center center;
}

#lappy{
  background-size: cover;
	background-attachment: fixed;
  background-image: url(images/serv/animal.jpg);
  width: 100%;
  height: auto;
  background-position: center center;
}



@media (max-width: 1440px) and (max-height: 800px) {
  .intobrand {
    font-size: 10rem !important;
    line-height: 9rem !important;
    top: 480px !important;
  }
  .abt {
    position: absolute !important;
    top: 45rem !important;
    
  }
  .recentworks{
    position: absolute !important;
    top: 18rem !important;
    left: 15rem!important;
    font-size: 1.875rem !important;

  }
  .chill {
    height: 17.5rem !important;
    width: 40.75rem !important;
  }
  .food {
    height: 17.5rem !important;
    width: 40.75rem !important;
  }
  .ind {
    height: 17.5rem !important;
    width: 40.75rem !important;
  }
  .grand {
    height: 17.5rem !important;
    width: 40.75rem !important;
  }
  .mam {
    height: 17.5rem !important;
    width: 40.75rem !important;
  }
  .ren {
    height: 17.5rem !important;
    width: 40.75rem !important;
  }
  .bots{
    height: 600px !important;
    width: 464px !important;
  }

  .equity{
    position: absolute !important;
    bottom: 0.625rem !important;
  }

  .itsabout{
    position: absolute !important;
    top: 37rem !important;

  }
  .hd-1{
    font-size: 5.625rem !important;
  }
  .pd-1{
    font-size: 1.125rem !important;
    padding-left: 0.625rem !important;
  }
  .hd-2{
    font-size: 5.625rem !important;
  }
  .pd-2{
    font-size: 1.125rem !important;
  }
  .hd-3{
    font-size: 5.625rem !important;
  }
  .pd-3{
    font-size: 1.125rem !important;
  }
  .hd-4{
    font-size: 5.625rem !important;
  }
  .pd-4{
    font-size: 1.125rem !important;
  }
  .hd-5{
    font-size: 5.625rem !important;
  }
  .pd-5{
    font-size: 1.125rem !important;
    padding-left: 1.25rem !important;
  }
  .camptext{
    position: absolute !important;
    font-size: 1.25rem !important;
    top: 48.2rem !important;
    left: 17rem !important;
  }
  .reviewheading{
    font-size: 10rem !important;
  }
  
}

@media screen and (min-width: 768px) {
  .footer-word{
    font-size: 6rem !important;
  }
  }

  /* large devices (laptops and desktops, 1024px and up) */
  @media screen and (min-width: 1024px) {
    .footer-word{
      font-size: 6rem !important;
    }
    .brdpadding{
      padding-top: 8rem !important;
    }
    .brfontsize{
      font-size: 5rem !important;
    }
    .relentless{
      font-size: 80px !important;
    }

    .reviewpadding{
      padding-top: 5rem !important;
    }
    .reviewheading{
      font-size: 4.2rem !important;
    }
    .weheading{
      top: 10rem !important;
      font-size: 4.5rem !important;
  }
  .weparagraph{
    left: 20rem !important;
    top: 30rem !important;
  }
  .servhover{
    left: 9rem !important;
  }
  .specialize{
    font-size: 7rem !important;
    top: 15rem !important;
  }
  .passionate{
    left: 40rem !important;
    top: 30rem !important;
  }

  .succesfully{
    font-size: 5rem !important;
  }
  .webuild{
    font-size: 7rem !important;
  }
  .brandequity{
    font-size: 7rem !important;
    left: 35rem !important;
  }
 .bde{
  bottom: 6rem !important;
 }
 
 .homereview-1{
  font-size: 5rem !important;
 }
 .homereview-2{
  line-height: 8rem !important;
 }
 .homereview-3{
  font-size: 2.2rem !important;
 }
 .homereview-34{
  font-size: 2.2rem !important;
 }

 .donttake{
  font-size: 4.5rem !important;
 }
 .letus{
  font-size: 3rem !important;
 }
 .humanize{
  font-size: 8rem !important;
 }

 .translatesales{
  font-size: 8rem !important;
 }
 .saless{
  font-size: 7rem !important;
 }
 .rec-work{
   font-size: 1.5rem !important;
   top: 20rem !important;
 }
 .create{
  font-size: 7.5rem !important;
  margin-left: 12rem !important;
 }
 .emotional{
   font-size: 7.5rem !important;
 }
 .connection{
   font-size: 7.5rem !important;
 }

 .identity{
   left: 1500px !important;
   top: 100px;
   font-size: 2rem !important;
 }
 .man1024{
  height: 500px !important;
  width: 300px !important;
  left: 700px !important;
 }
 .bottle1024{
   /* height: 600px !important;
   width: 400px !important;
   right: -400px !important;
   top: 50rem !important; */
 }

}

  /* extra large devices (large laptops and desktops, 1280px and up) */
  @media screen and (min-width: 1280px) {
    .footer-word{
      font-size: 10rem !important;
    }
    .brdpadding{
      padding-top: 8rem !important;
    }
    .brfontsize{
      font-size: 6.25rem !important;
    }
    .relentless{
      font-size: 6.25rem !important;
    }
    .reviewpadding{
      padding-top: 9rem !important;
    }
    .reviewheading{
      font-size: 6.25rem !important;
    }
    .weheading{
      top: 17rem !important;
      font-size: 6.25rem !important;
    }
    .weparagraph{
      left: 30rem !important;
      top: 40rem !important;
    }
    .servhover{
      left: 17rem !important; 
  }
  .specialize{
   font-size: 10rem !important;
   top: 20rem !important; 
  }

  .passionate{
   left: 60rem !important;
   top: 40rem !important;
  }
  .succesfully{
    font-size: 6.25rem !important;
  }
  .webuild{
    font-size: 10rem !important;
  }
  .brandequity{
    font-size: 10rem !important;
    left: 43.75rem !important;
  }
  .bde{
    bottom: 0.5rem !important;
  }
  .homereview-1{
    font-size: 10rem !important;
  }
  .homereview-2{
    line-height: 11rem !important;
   }
   .homereview-3{
    font-size: 2.5rem !important;
   }
   .homereview-34{
  font-size: 2.2rem !important;
 }

   .donttake{
    font-size: 6.25rem !important;
   }

   .letus{
    font-size: 2.5rem !important;
   }
   .humanize{
    font-size: 10rem !important;
   }

 .translatesales{
  font-size: 10rem !important;
 }
 
 .saless{
  font-size: 10rem !important;
 }

 .rec-work{
   font-size: 1.25rem !important;
   top: 21rem !important;
 }

 .create{
  font-size: 10rem !important;
  margin-left: 28.125rem !important;
 }
 .emotional{
   font-size: 10rem !important;
 }
 .connection{
   font-size: 10rem !important;
 }

 .identity{
  top: 450px !important;
  left: 2160px !important;
   width: 660px !important;
   height: 190px !important;
   font-size: 2.5rem !important;
 }

 .man1024{
  height: 543px !important;
  width: 362px !important;
  left: 1199px !important;
  mix-blend-mode: exclusion !important;
  top: 410px !important;
 }

 .bottle1024{
   /* height: 700px !important;
   width: 464px !important;
   right: 560px !important;
   top: 54rem !important; */
 }

  }

  @media screen and (min-width: 1920px){
    .identity{
      top: 450px !important;
      left: 2960px !important;
       width: 660px !important;
       height: 190px !important;
       font-size: 2.5rem !important;
     }
     .chill {
      height: 100% !important;
      width: 100% !important;
    }
    .food {
      height: 100% !important;
      width: 100% !important;
    }
    .ind {
      height: 100% !important;
      width: 100% !important;
    }
    .grand {
      height: 100% !important;
      width: 100% !important;
    }
    .mam {
      height: 100% !important;
      width: 100% !important;
    }
    .ren {
      height: 100% !important;
      width: 100% !important;
    }
    .brfontsize{
      font-size: 8rem !important;
      line-height: normal !important;
    }
    .contus{
      font-size: 2.5rem !important;
    }
    .stdbold{
      font-size: 3rem !important;
    }
    .stdlight{
      font-size: 2.4rem !important;
    }
    .humanize{
      font-size: 12rem !important;
     }
    .camptext{
      top: 57rem !important;
      left: 25rem !important;
    }
   

  }

  /* 2880 by 1800  viewport  */
  @media (min-width: 2880px) {
    /* footer */
    .foot-pd{
      padding-top: 30rem !important;
    }
    .stdbold{
      font-size: 6rem !important;
    }
    .stdlight{
      font-size: 3.5rem !important;
    }

    /* ready? */
    .brfontsize{
      font-size: 12rem !important;
    }
    .contus{
      font-size: 4rem !important;
    }
    .brdpadding{
      padding-top: 15rem !important;
    }
    .homereview-2{
      line-height: normal !important;
    }
    .homereview-1{
      font-size: 20rem !important;
    }
    .homereview-3{
      font-size: 7rem !important;
    }
    .homereview-34{
  font-size: 2.2rem !important;
 }
    .botto{
      bottom: 7rem !important;
    }
  .donttake{
    font-size: 11em !important;
  }
  .letus{
    font-size: 5rem !important;
  }
    .humanize{
      font-size: 20rem !important;
    }
    .pdt-brand{
      padding-top: 10rem !important;
    }
    .creative{
      font-size: 3rem !important; 
    }
    .ind{
      height: auto !important;
    }
    .creativespan{
      font-size: 3rem !important; 
    }
    .grand{
      height: auto !important;
    }
    .mam{
      height: auto !important;
    }
    .ren{
      height: auto !important;
    }
    .translatesales{
      font-size: 18rem !important;
      padding-bottom: 10rem !important;
    }
    .saless{
      position: absolute !important;
      font-size: 15rem !important;
      left:70rem !important;
      top: 20rem !important;
    }
    .rec-work{
      font-size: 3rem !important;
      top: 38rem !important;
      left: 30rem !important;
    }
    .create{
      font-size: 25rem !important;
      padding-bottom: 12rem !important;
    }
    .emotional{
     font-size: 25rem !important;
     padding-bottom: 13rem !important;
    }
    .connection{
      font-size: 25rem !important;
    }
    .intobrand{
      font-size: 18rem !important;
      top: 65rem !important;
      line-height: 19rem !important;
      left: 20rem !important;
    }
    .busis{
      font-size: 18rem !important;
      top: 20rem !important;
      line-height: 19rem !important;
      left: 50rem !important;
    }
    .abt{
      font-size: 3rem !important;
      top: 97rem !important;
      left: 105rem !important;
    }
    .man2880{
      height: 1000px !important;
      width: 700px !important;
      left: 2100px !important;
      top: 50rem !important;
    }
    .ideatetext{
      font-size: 2.5rem !important;
      top: 50rem !important;
      left: -10.7rem !important;
    }
    .header-pd{
      padding-left: 120px !important;
      padding-right: 120px !important;
      padding-top: 120px !important;
      padding-bottom: 120px !important;
    }
    .menu-size-logo{
      width: 10rem !important;
    }
    .menu-size{
      font-size: 3rem !important;
    }
    .identity{
      font-size: 50px !important;
      top: 40rem !important;
      left: 300rem !important;
      display: none;
    }
    .newidentity{
      font-size: 80px !important;
      color: white !important;
      position: relative !important;
      left: 70rem !important;
      top: 40rem !important;
      display: block !important;
    }
    .webuild{ 
      font-size: 22rem !important;
      top: 16rem !important;
      left: 35rem !important;
    }
  .brandequity{
    font-size: 22rem !important;
    top: 45rem !important;
    left: 100rem !important;
  }
  .bde-2{
    font-size: 22rem !important;
    top: 70rem !important;
    left: 100rem !important;
  }
  .ideatetext-2{
    font-size: 3rem !important;
    top: 50rem !important;
    left: -2rem !important;
  }
  .succesfully{
    font-size: 11rem !important;
    line-height: normal !important;
    text-align: center;
    top: 20rem !important;
    left: 20rem !important;
  }
  .itsabout{
    font-size: 3rem !important;
    top: 75rem !important;
  }
  .specialize{
    font-size: 22rem !important;
    top: 20rem !important;
  }
  .passionate{
    font-size: 5rem !important;
    top: 60rem !important;
    left: 120rem !important;
  }
  .it-center{
   position: absolute !important;
   left: 25rem !important;
    top: 2rem !important;
  }
  .hd-1{
    font-size: 8rem !important;
  }
  .hd-2{
    font-size: 8rem !important;
  }
  .hd-3{
    font-size: 8rem !important;
  }
  .hd-4{
    font-size: 8rem !important;
  }
  .hd-5{
    font-size: 8rem !important;
  }
  .pd-1{  
    font-size: 3rem !important;
    padding-left: 15rem !important;
  }
  .pd-2{
    font-size: 3rem !important;
    padding-left: 18rem !important;
  }
  .pd-3{
    font-size: 3rem !important;
    padding-left: 18rem !important;
  }
  .pd-4{
    font-size: 3rem !important;
    padding-left: 18rem !important;
  }
  .pd-5{
    font-size: 3rem !important;
    padding-left: 14rem !important;
  }

  .weheading{
    font-size: 12rem !important;
    left: 25rem !important;
    top: 25rem !important;
  }
  .weparagraph{
    font-size: 5rem !important;
    left: 55rem !important;
    top: 70rem !important;
  }
  .reviewheading{
    font-size: 15rem !important;
    line-height: normal !important;
  }
  .reviewtext{
    font-size: 6rem !important;
  }
  .reviewstxtpadding{
   bottom: 22rem !important;
  }
  .relentless{
    font-size: 13rem !important;
    line-height: normal !important;
  }
  .relentte{
    font-size: 3rem !important;
    padding-top: 2rem !important;
  }
  .rlpd{
    padding-top: 10rem !important;
  }
  .mgspace-x{
    margin-left: 10rem !important;
    margin-right: 0rem !important;
  }
  .mgspace-x-1{
    margin-left: 12rem !important;
    margin-right: 0rem !important;
  }
  .mgspace-x-2{
    margin-left: 5rem !important;
    margin-right: -4rem !important;
  }
  .strspace{
    padding-left: 5rem !important;
  }
  .camptext{
    font-size: 2rem !important;
    top: 77rem !important;
    left: 17rem !important;
  }
  .mgspace-y{
    margin-bottom: 3rem !important;
  }
  .mgspace-y-1{
    margin-top: 5rem !important;
  }
  .bottle2880{
    top: 100rem !important;
    left: 1300px !important;
    height: 1000px !important;
    width: 900px !important;
  }
  .homereview-2{
    line-height: normal !important;
  }
  .homereview-1{
    font-size: 20rem !important;
  }
  .homereview-3{
    font-size: 7rem !important;
  }
  .homereview-34{
font-size: 5rem !important;
}
  }