@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Roboto+Condensed:ital,wght@0,300;0,400;0,700;1,300;1,400;1,700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Raleway:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Reenie+Beanie&display=swap');


#about{}
#services{}
#contact{}

.top_bar{ background:#eeb335; }
.top_text{ font-family: 'Montserrat', sans-serif; font-size:13px; font-weight: 400; color: #000; padding:10px 0;}
.top_text a{ color:#000; }
.top_text a:hover{ color:#fff; }

.header_bg{ background:#121314;}
.logo{ padding:0; position: absolute; width: 100%; z-index: 999;}
.nav_bar{ margin-top:35px; margin-bottom: 25px;}

.services_head{ font-family: 'Montserrat', sans-serif; font-size:32px; font-weight: 600; color: #fff; text-transform:uppercase; text-align:center; padding:25px 0; }
.services_box{ background:#1e1f23; text-align:center;  margin-bottom:35px; padding:20px; border-radius: 25px; box-shadow: 0px 0px 15px #000;}
.services_box img{ width:100px; }
.services_box h3{ font-family: 'Montserrat', sans-serif; font-size:20px; font-weight: 600; color: #d2d4d5; }
.services_box h3 span{ color:#eeb335; }
.services_box p{ font-family: 'Montserrat', sans-serif; font-size:15px; font-weight: 500; color: #d2d4d5; margin-bottom: 25px; line-height: 25px;}
.services_box a{ background:#115393; font-family: 'Montserrat', sans-serif; font-size:14px; font-weight: 400; color: #fff; padding: 8px 25px; transition:all 0.3s;}
.services_box a:hover{ background:#000; color:#fff; transition:all 0.3s;}

.menpower_bg{ background:#fff url('../img/menpower_bg.jpg'); center top no-repeat; padding:50px 0;}
.parallax{ background-attachment:fixed; background-position:center; background-repeat:no-repeat; background-size:cover;}

.form_bg{ background:url(../img/form_bg.png); border-radius: 25px; padding: 30px;}
.input_form{  font-family: 'Montserrat', sans-serif !important; font-size:14px !important; font-weight: 400 !important; color: #000 !important; padding: 12px 12px !important; margin-bottom: 17px !important;}
.input_btn{ font-family: 'Montserrat', sans-serif !important; font-size:14px !important; font-weight: 400 !important; color: #fff !important; background:#000 !important; border: solid 1px #000 !important; padding: 5px 25px; transition:all 0.5s;}
.input_btn:hover{ background:#fff !important; color:#000 !important; border: solid 1px #fff !important; transition:all 0.5s;}

.footer_bg{ background:#1e1f23; }
.footer_head{  font-family: 'Montserrat', sans-serif; font-size:24px; font-weight: 600; color: #fff; padding:20px 0; }
.footer_head span{ color:#eeb335; }
.footer{ margin-bottom:25px; }
.footer a{ font-family: 'Montserrat', sans-serif; font-size:14px; font-weight: 500; color: #fff; padding-bottom:10px; display:block; transition:all 0.3s;}
.footer a:hover{ color:#eeb335; padding-left:8px; transition:all 0.3s;}
.footer_text{ font-family: 'Montserrat', sans-serif; font-size:14px; font-weight: 500; color: #fff; padding-bottom:5px; margin-bottom:25px; }
.footer_text a{ color:#fff; transition:all 0.3s; }
.footer_text a:hover{ color:#eeb335; padding-left:8px; transition:all 0.3s;}

.copy_bg{ background:#eeb335; }
.copy_text{ font-family: 'Montserrat', sans-serif; font-size:14px; font-weight: 400; color: #000; padding:10px 0; text-align:center; }
.copy_text a{ color:#000; font-weight:600; }
.copy_text a:hover{ color:#000; text-decoration:underline; }


.main_bg{ background:#1e1f23;}
.welcome_head{ font-family: 'Montserrat', sans-serif; font-size:28px; font-weight: 600; color: #fff; text-transform:uppercase;  padding:50px 0 25px 0; }
.welcome_head span{ color:#eeb335; }
.welcome_text{ font-family: 'Montserrat', sans-serif; font-size:16px; font-weight: 400; color: #fff; line-height: 27px;  padding-bottom: 30px;}
.welcome_img{ padding:35px 0; }

.services_bg{ background:#1e1f23 url(../img/services_bg.png) center top no-repeat; padding: 20px 0;}
.banner_texts{  }
.banner_left_text{ text-align:left !important; padding-left: 80px; padding-top: 100px;}
.banner_left_text h3{ font-family: 'Montserrat', sans-serif; font-size:36px; font-weight:600; color:#fff; line-height: 45px;}
.banner_left_text p{ font-family: 'Montserrat', sans-serif; font-size:16px; font-weight: 400; color: #fff; line-height: 25px; margin-bottom: 25px;}
.banner_left_text a{ background:#eeb335; font-family: 'Montserrat', sans-serif; font-size:16px; font-weight: 400; color: #fff; padding: 10px 25px; border-radius: 25px; transition: .3s ease;}
.banner_left_text a:hover{ background:#000; color: #fff; transition: .3s ease;}

.banner_form{ margin:60px 80px 20px 20px; background:url('../img/form_bg.png'); border-radius: 25px; padding: 30px;}

.client_box{ border:solid 1px #fff; background:#fff; border-radius:25px; box-shadow:0px 0px 15px #ccc; margin-bottom: 35px;}
.client_box img{ border-radius:25px; }

.sub_banner{ text-align:center; }
.content_head{ font-family: 'Montserrat', sans-serif; font-size:24px; font-weight:600; color:#fff; background:url(../img/line.jpg) left bottom no-repeat; padding:20px 0; margin-bottom:20px;}
.gallery_box{ border:solid 1px #fff; background:#fff; border-radius:25px; box-shadow:0px 0px 15px #ccc; margin-bottom:35px; padding:15px; text-align: center;}



.navbar-default .navbar-nav>li>a{font-family: 'Roboto Condensed', sans-serif; font-size: 18px; color: #fff; font-weight: 400; margin-left: 50px; padding-bottom: 10px;}
.navbar-default .navbar-nav>li>a:hover, .navbar-default .navbar-nav>li>a:focus{ color: #eeb335; padding-bottom: 10px;}

.carousel-caption{ left: 0px !important; right: 0px !important; top: 1%;}
.carousel-caption img{ max-width: 100%; }
.carousel-control{ bottom: 50% !important; }

.offcanvas-header{ display:none; }
.btn-close{background: #eeb335;margin: 0px 0px 20px 0px; outline: none !important;}
.btn-close:hover{background: #eeb335; outline: none !important;}
.btn{padding: 8px 12px; border-radius: 0px;}
.btn img{ width: 30px; }

.mobile-menu{ display: none !important; }

.menu_1{ font-family: 'Roboto Condensed', sans-serif; font-weight: 700; font-size: 17px; color: #1A1A1A;}
.menu_1 a{ font-family: 'Roboto Condensed', sans-serif; font-weight: 700; font-size: 17px; color: #1A1A1A; }

.mobile-menu-new{ display: none; }
.mobile-menu-new ul li{ padding: 10px 0; }
.mobile-menu-new ul li a{ font-family: 'Roboto Condensed', sans-serif; font-size: 18px; font-weight: 700; color: #fff; cursor: pointer; display: block;}
.mobile-menu-new ul li a:hover{ color: #9B9B9B; text-decoration: none;}
.mobile-menu-new ul li i{ font-size: 11px; float: right; }

.mobile-menu-new-sub li{ padding: 0 !important; }
.mobile-menu-new-sub li a{ font-family: 'Roboto Condensed', sans-serif; font-size: 16px !important; font-weight: 400 !important; color: #fff; border-bottom: solid 1px #fff; padding: 8px 0;}

.form_headingg{ font-family: 'Montserrat', sans-serif; font-size:18px; font-weight:500; color:#fff; padding-bottom: 15px;}
.brands_box{ background:#fff; border:solid 1px #fff; padding:10px; border-radius:25px; margin-bottom: 25px; box-shadow: 0px 0px 15px #ccc;}
.brands_box img{ border-radius:25px; }

.gallery_name{ font-family: 'Montserrat', sans-serif; font-size:14px; font-weight:500; color:#000; }

@media (max-width: 768px){
  .menpower{ padding-bottom:25px; }
  .logo{ position:relative; }
  .banner_form{ display:none; }
  .banner_left_text{ padding-top:0px; padding-left:20px; }
  .banner_left_text h3{ font-size:18px; line-height:20px; }
  .banner_left_text p{ line-height:16px !important; font-size:12px; margin-bottom: 10px; display: none;}
  .banner_left_text a{ font-size:10px; }
  .top_bar{ display:none; }
  .nav>li{ display: none; }
  .navbar-nav{ padding: 0px 20px 0px 15px !important; }
  .mobile-menu{ display: block !important; margin: 0 30px;}
  .menu_1{ padding-bottom: 20px; font-family: 'Roboto Condensed', sans-serif; font-weight: 700; font-size: 17px; color: #1A1A1A;}
  .menu_1 a{ color: #fff; }
  .menu_1 a:hover{ color: #9B9B9B; }
  .mobile-menu-new{ display: block; margin: 0 30px;}


  .offcanvas-header{ display:block; text-align: right;}
  .navbar-collapse {
    position: fixed;
    z-index: 99999;
    top:0; 
    bottom: 0;
    left: 100%;
    width: 90%;
    padding-right: 0;
    padding-left: 0;
    overflow-y: auto;
    visibility: hidden;
    background-color: white;
    transition: visibility .2s ease-in-out, transform .2s ease-in-out;
    transform: translateX(-100%);
  }
  .navbar-collapse.show {
    visibility: visible;
    transform: translateX(-100%);
    background: black;
    overflow-x: hidden;
  }
}


/* join chat */
.joinchat_button{
  background-image: url('../img/whatsapp-support.png');
  background-size: auto;
  background-repeat: no-repeat;
  background-position: center;
  width: 55px;
  height: 55px;
  background-color: transparent;
  /*box-shadow: 1px 6px 24px 0 rgb(7 94 84 / 24%);*/
  box-shadow: 0px 0px 13px 1px rgb(255 255 255 / 3%);
  position: fixed;
  bottom: 36px;
  left: 25px;
  border-radius: 60px;
  cursor: pointer;
}
.joinchat_button:hover{
  background-color: var(--primary-color);
  transition: background 1.5s linear;
}
.sonar-wave {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: 9999px;
  background-image: linear-gradient(to right, #579544 0%, #29ac00 100%);
  opacity: 0;
  z-index: -1;
  pointer-events: none;
}
.sonar-wave {
  animation: sonarWave 2s linear infinite;
}

@keyframes sonarWave {
  from {
    opacity: 0.4;
  }
  to {
    transform: scale(3);
    opacity: 0;
  }
}

/* Underline From Left */
.hvr-underline-from-left {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
  position: relative;
  overflow: hidden;
}
.hvr-underline-from-left:before {
  content: "";
  position: absolute;
  z-index: -1;
  left: 0;
  right: 100%;
  bottom: 0;
  background: #eeb335;
  height: 4px;
  -webkit-transition-property: right;
  transition-property: right;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-timing-function: ease-out;
  transition-timing-function: ease-out;
}
.hvr-underline-from-left:hover:before, .hvr-underline-from-left:focus:before, .hvr-underline-from-left:active:before {
  right: 0;
}