@import url("https://use.typekit.net/zev8jlv.css");


@CHARSET "ISO-8859-1";
/* Reset CSS
 * --------------------------------------- */
@charset "utf-8";
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; }
:focus { outline: 0; }
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }
body { line-height: 1; background-color: #d2b174;}
ol, ul { list-style: none; }
blockquote, q { quotes: none; }
blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }
table { border-collapse: collapse; border-spacing: 0; }
a { outline: none !important; }
a:hover{ color:#03002F ;}
 
* { margin: 0px; padding: 0px; box-sizing: border-box; }
body { font-family: "roc-grotesk-condensed", sans-serif; font-size: 14px; font-weight: 400; }

a, img, .logo, .smalln, #header, .btn, .btn::after, button, h1, h2, h3{ -webkit-transition: all .3s; -moz-transition: all .3s; -o-transition: all .3s; transition: all .3s; }
a:hover { text-decoration: none }
input:focus{ box-shadow: none !important; }

h1{ font-size: 36px; font-weight: 900; color: #333739;  border-bottom: solid 2px #D9D9D9; padding-bottom: 20px; }
 


.container { max-width: 1280px; padding-left: 15px; padding-right: 15px; }
.wapper { width: 100%; overflow: hidden; padding-bottom: 50px }
 ul { list-style: none; padding: 0px; margin: 0px; }
a, a:hover { text-decoration: none; }
p { margin-bottom: inherit; }
.FR{ float: right; }
.text-right{ text-align: right; }
.pa{ position: relative; }

h2{ font-size: 24px; color: #333739; }


.form-control::-webkit-input-placeholder { /* Chrome/Opera/Safari */
  font-size: 26px; font-weight: 300 !Important; color: #bf8743;
}
.form-control::-moz-placeholder { /* Firefox 19+ */
  font-size: 26px; font-weight: 300 !Important; color: #bf8743;
}
.form-control:-ms-input-placeholder { /* IE 10+ */
  font-size: 26px; font-weight: 300 !Important; color: #bf8743;
}
.form-control:-moz-placeholder { /* Firefox 18- */
  font-size: 26px; font-weight: 300 !Important; color: #bf8743;
}

.form-select:focus{ box-shadow: none; }

 
.topBanner{ background: url(../ghd/top_banner.jpg) no-repeat center top;  }
.topBanner .container{ position: relative; padding-bottom: 17px; }
.logo{ padding-top: 35px; }
.logo1{ display: none; }
.topBannerLeft{ padding-left: 106px; }
.topBannerRight{ padding-top: 340px; }
.goodHair{ padding-left: 1px; }
.goodHairimg{ width: 80%; padding-top: 10px;} 
.center { display: block; margin-left: auto; margin-right: auto; width: 50%;}
.upto-40 img{ width: 45%; }
.termCondition{color:#fff;}
.btnsubmiit{border: solid 1px #9f820b;  background: url(../images/tabBg.svg) no-repeat center center;  color: #fff;}
.logocenter{text-align: center;}

.selecttext{font-size:18px;}
.termcondi{text-align: left; font-size:17px;}
a:hover{color:#0b6af7;}
 

.topBannerRight2{    padding-top: 60px; padding-right: 70px; max-width: 594px; position: relative; z-index: 1; }
.topBannerRight2 h2{  text-shadow: 0 3px 6px rgba(0, 0, 0, 0.16); font-size: 42px; color: #fff; font-weight: 500; margin-bottom: 40px; }
.formBox { }
.formBox label{ width: 160px; font-size: 34px; font-weight: 500; color: #fff;text-shadow: 0 3px 6px rgba(0, 0, 0, 0.16);line-height: 0.85; }
.formBox li{ display: flex; margin-bottom: 25px; }
.formBox li .form-control{width: 100%;  border: solid 2px #bea170; background-color: #fff;  border-radius: 6px;  color: #bf8743; line-height: 1; font-size: 26px; padding-top: 0; padding-bottom: 0; height: 38px; }

.inputBox{ width: calc(100% - 160px); display: flex; gap:8px; align-items: flex-start;}

.form-select{width: 100%;  border: solid 2px #bea170 !important; background-color: #fff;  border-radius: 6px;  color: #bf8743; line-height: 1; font-size: 26px; padding-top: 0; padding-bottom: 0; height: 38px; background: #fff url(../images/ic_arrow.svg) no-repeat 98% center; }

.inputBox .btn{ border-radius: 7px; font-size: 44px; color: #fff; display: flex; line-height: 1; width: 162px; height: 56px; background-color: #bf8743; display: flex; align-items: center; justify-content: center; }


  
h2{  color: #000;  font-size: 44px; font-weight: 500; line-height: 1;}
.h2Heading{  margin-top: 50px;display: flex; align-items: center; gap: 40px; margin-bottom: 40px; margin-left: 100px;}
.h2Heading .nav-tabs{ border: 0; }
.h2Heading .nav-tabs .nav-link{ color: #000; font-size: 38px;  line-height: 0.87; font-weight: 300; border: 0; }

.formMainBox{ justify-content: flex-end; }

.footer{ background: url(../ghd/bot_banner.jpg) no-repeat center top; height: 720px;}
.footer .container{ padding: 135px 0 0 110px;  }
.footer .logo{ width: 250px; margin-bottom: 30px; padding-top: 0;}
.footer .logo img{ width: 100%; height: auto; }

.fotTxt2{ font-size: 50px;  color: #000; padding-left: 5px; font-weight: 600; font-stretch: condensed; padding-bottom: 30px; }

.fotTxt3{ text-shadow: 0 3px 6px rgba(0, 0, 0, 0.16);  font-size: 25px; font-weight: 0; font-stretch: condensed;  color: #000; padding-left: 0px; margin-bottom: 20px; }

.footerCont{ max-width: 620px; }


.fot3boxes{ padding-left: 10px; display: flex; column-gap: 37px; color: #000; padding-bottom: 30px;}

.fot3boxes li { text-align: center; }
.fot3boxes li strong{ font-size:70px;   font-weight: 500; font-stretch: condensed; display: block;  line-height: 1;}
.fot3boxes li span{ text-shadow: 0 3px 6px rgba(0, 0, 0, 0.16); font-size: 31px; font-weight: 500;}


.sliderBoxMain{ width: 226px; margin: auto;  }
.sliderBox li.slick-slide{ padding: 0 10px; padding-top: 65px; height: 550px; }
.sliderBoxIner{transition: all .3s; border: solid 1px #707070; border-radius: 10px;  background-color: #fff; height: 430px; position: relative;}
.sliderImg{ position: absolute; bottom: -1px; transition: all .3s; }
.sliderImg img{ display: block; width: 100%;}

.slidertxt{ padding: 22px 22px 0; position: relative; z-index: 3; }
.slidertxt h3{ font-size: 36px;color: #000; font-weight: 300; padding-bottom: 10px; }
.slidertxt h4{ font-size: 24px; color: #9d9d9d; font-weight: 300;}
.slidertxt2 strong { font-size: 35px;}
.slidertxt2{ font-size: 26px; font-weight: 300; padding: 20px;   color: #000; display: none; gap:00px }
.slidertxt2 .btn{ border: solid 2px #71583a; background-image: linear-gradient(to bottom, #fff6b8, #a47f54 46%, #b99061 75%, #edc38c); width: 48px; height: 48px; border-radius: 48px; display: flex; align-items: center; justify-content: center; }

.sliderBoxMain:hover .sliderBoxIner{ background: url(../ghd/servicesBg.jpg) no-repeat top left; width:100%; height: 420px; margin-top: -65px; border: solid 2px rgba(113, 88, 58, .5); }
.sliderBoxMain:hover .slidertxt2{ display: flex;  ; }
.sliderBoxMain:hover .sliderImg{ right: 0; }
.sliderBoxMain:hover{ width: 320px; }
.sliderBoxMain:hover .slidertxt h3,
.sliderBoxMain:hover .slidertxt h4{ color: #000; }

.slick-dots{ display: flex; justify-content: center; margin-bottom: 15px; }
.slick-dots li button{ background: #ccc8c8; font-size: 0; width: 40px; height: 4px; margin: 0 3px; border: 0; }
.slick-dots li.slick-active button{ background: #bf626b; width: 73px; }

.h2Heading .nav-tabs .nav-link{font-size: 30px; line-height: 1; border-radius: 7px; /*border: solid 1px #fff;*/ }
.h2Heading .nav-tabs .nav-link.active{   
  border: solid 1px #9f820b;
  background: url(../images/tabBg.svg) no-repeat center center; color: #fff; }

.sliderMainBox .container { padding: 0 0 0 100px;   }

.slick-list{ padding: 0 !important; }
.contfrm1{display: none;}

  /**/

@media (max-width: 990px) { 
   .topBannerLadi{ display: none; }
   .topBannerLeft{ padding-left: 0; }
   .formMainBox{ justify-content: center; }

   .goodHair{ width: 70%; padding-left: 0; }
   .footer .container{ padding-left: 20px; }
   .upto-40{ width: 70%; }
   .upto-40 img{ width:100%; }
   .center1 { display: block; margin-left: auto; margin-right: auto; width: 50%;}


   .sliderMainBox .container{ padding-left: 20px; }
   .h2Heading{ margin-left: 0; }

   .footerCont{ max-width: 65%; }

    .footer{ background: url(../ghd/bot_banner.jpg) top center; background-size: cover; height: auto;  }

    .fotTxt2{ font-size: 40px; }
    .fotTxt3{ font-size: 30px; }
    .fot3boxes li strong{ font-size: 50px; }
    .fot3boxes li span{ font-size: 24px; }

    .contfrm{display: none;}
    .contfrm1{display: block;background-color: #000;}
  }
@media (max-width: 850px) { 
  .topBannerRight{ margin-left: -60px; }

    .topBanner{background: url(../ghd/mobile_top_banner.jpg) no-repeat center; background-size: cover;}
    /*.topBanner{background: url(../images/mobile_banner_trendy1.jpg) no-repeat center top; background-size: cover;} */
    .topBannerRight2{ padding-right: 0; }
    .fot3boxes{ gap:20px }
    .footer .inputBox{ padding-left: 10px; }

    .container{ padding-left: 24px; }
    .inputBox .btn{ border-radius: 13px; }
    .center { display: block; }
    .logocenter{text-align: left;}
    .goodHairimg{ width: 75%; padding-top: 50px; margin-left: -10px; display: none;} 

    .contfrm{display: none;}
    .contfrm1{display: block;background-color: #000;}
}

@media (max-width: 768px) {
  .logo{ padding-top: 30px; }
  .upto-40{ width: 50%; }
  .topBannerRight{ width: 50%; }
  .topBannerRight img{ width: 100%; }


  .fotTxt3{ font-size: 21px; }
  .fotTxt2{ font-size: 30px; }
  .fot3boxes li strong{ font-size: 30px; }
  .fot3boxes li span{ font-size: 20px; }
  .inputBox .btn{ font-size: 30px; }
  /*.h2Heading{  flex-direction: column; margin-bottom: 20px; }*/
  .h2Heading .nav-tabs .nav-link{ font-size: 16px; }
  h2{ font-size: 16px; }

  .slidertxt h3{ font-size: 24px; font-weight: 300; }
  .slidertxt h4{ font-size: 18px; }
 .logo{ width: 200px; }
 /*.logo img{ width: 85%; }*/
 .logo img{ width: 175px;}

 .topBanner .container{ padding-left: 28px; padding-right: 28px;}
 .topBannerRight2{ padding-right: 0; }

 .topBannerRight2 h2{ font-size: 21px; color: #fff; }
 .formBox label{ font-size: 17px; width: 90px; color:#fff}

 .inputBox{ width: calc(100% - 90px); }
 
.logo1{ width: 106px; display: block;}
 .footer .logo{ width: 150px; margin-bottom: 20px; }
 .fotTxt2{ padding-bottom: 0; }

 .contfrm{display: none;}
 .contfrm1{display: block;background-color: #000;}

}
  @media (max-width: 640px) {
    
    .topBanner{ height: 382px; }
    .topBannerRight{ padding-top: 160px; }
    .upto-40{ width: 130px; }
    .topBannerRight{ width: 180px; }

    .formBox li .form-control{ height: 20px; font-size: 14px; }


    .form-control::-webkit-input-placeholder { /* Chrome/Opera/Safari */
      font-size: 14px; font-weight: 300 !Important; color: #bf8743;
    }
    .form-control::-moz-placeholder { /* Firefox 19+ */
      font-size: 14px; font-weight: 300 !Important; color: #bf8743;
    }
    .form-control:-ms-input-placeholder { /* IE 10+ */
      font-size: 14px; font-weight: 300 !Important; color: #bf8743;
    }
    .form-control:-moz-placeholder { /* Firefox 18- */
      font-size: 14px; font-weight: 300 !Important; color: #bf8743;
    }

    .form-select{ font-size: 14px; height: 20px; background-size: 10px; }

    .formBox li{ margin-bottom: 15px; }
    .inputBox .btn{ height: 25px; font-size: 20px; width: 75px; }

    .bannerIn{ justify-content: space-between; }
    .topBannerRight2 h2{ margin-bottom: 10px; }
    .inputBox .btn{ border-radius: 8px; }

    .h2Heading{ margin: 25px 0 10px; }

    .slidertxt h3{ font-size: 14px; }
    .slidertxt h4{ font-size: 10px; }

    .sliderBoxIner{ height: 160px; width: 84px; }

    .slidertxt{ padding: 8px 8px 0; }

    .sliderBoxMain:hover{ width: 112px; }
    .slidertxt h3{ font-size: 17px; }
    .sliderBoxMain:hover .sliderBoxIner{ height: 154px; }
    .slidertxt2{ font-size: 10px; padding: 5px 0 0 0; }
    .slidertxt2 strong { font-size: 15px;}
    .sliderBoxMain{ width: 84px; }
    .slidertxt2 .btn{ width: 18px; height: 18px; border-radius: 18px; padding: 10px;}
    .slidertxt2 .btn img{ width: 6px; height: 6px; }

    .slidertxt h3{ padding-bottom: 5px; }

    .sliderBox li.slick-slide{ height: 210px; }

    .sliderBox li.slick-slide{ padding-top: 35px; }
    .sliderBoxMain:hover .sliderBoxIner{ margin-top: -35px; }
    .sliderBox li.slick-slide{ padding-left: 5px; padding-right: 5px; }

    .footer .inputBox .btn{ width: 85px; }

    .fotTxt2{ font-size: 16px; margin-bottom: 13px; }
    .fotTxt3{ font-size: 12px; text-shadow: none; margin-bottom: 20px; }

    .fot3boxes li span{ font-size: 12px; }

    .footer .container{ padding-top: 60px; }

    .h2Heading{ gap:20px }

    .h2Heading .nav-tabs .nav-link{ padding: 5px; }

    .logo{ width: 136px; display: none;}
    .logo1{ width: 106px; display: block;}
    .footer .logo{ width: 110px; }

    .contfrm{display: none;}
    .contfrm1{display: block;background-color: #000;}
}