@charset "utf-8";
/* CSS Document */

@font-face {
  font-family: Oswald-Bold;
  src:url(../font/Oswald-Bold.ttf);
}
@font-face {
  font-family: Rajdhani-Bold;
  src:url(../font/Rajdhani-Bold.ttf);
}
@font-face {
  font-family: Roboto-Bold;
  src:url(../font/Roboto-Bold.ttf);
}
@font-face {
  font-family: Roboto-Light;
  src:url(../font/Roboto-Light.ttf);
}
@font-face {
  font-family: Roboto-Regular;
  src:url(../font/Roboto-Regular.ttf);
}

*{margin: 0px; padding: 0px;} 
html, body {min-height:100%; font-family: Roboto-Light;  font-size: 16px; line-height: 24px; color: #222222; position: relative; scroll-behavior: smooth;}
h1, h2, h3, h4, h5, h6{ height: auto;}
p{ height: auto;}
div{ height: auto;}
h2{font-family: Rajdhani-Bold; color: #222222; font-size: 49pt; margin: 0;   margin-bottom: 0px; margin-bottom: 15px; text-transform: capitalize;}
.mtp-80{ margin-top: 80px;}
.mtp-25{ margin-top: 25px;}

.topbar{ background: #111; width: 100%; padding: 15px; text-align: center;}

.main-banner{ background-size: cover;height: 100vh;  background-image: url('../images/banner.jpg');   background-repeat:no-repeat; position: relative;  background-size: contain; }

.nopadding{ padding: 0 !important; }
.banner-caption-box { padding: 200px 0; text-align: left;}
.banner-caption-box h6{ color: #fff; font-family: Roboto-Bold; font-size: 15pt; position: relative;padding-left: 35px;}
.banner-caption-box h6:before{content: url("../images/bann-text-bar.png");position: absolute;bottom: 0;left: 0;right: 0;}
.banner-caption-box h1{font-size: 60pt;   font-family: Oswald-Bold; color: #000000; margin-top: 25px; text-transform: uppercase;}   
.banner-caption-box h1 span{ color: #BC1313; padding-left: 100px;}
.banner-caption-box p{font-family: Roboto-Regular; font-size: 20pt; padding-left: 80pt; color: #fff; line-height: 36px;
  margin-top: 40px;}

.main-banner-mobile{ background-size: 100% 100%;
    height: 400px;
    background-image: url(../images/banner-mobile.jpg);
    background-repeat: no-repeat;
    position: relative;
    margin-top: 80px;}
.main-banner-mobile h1{ font-size:36pt;}
.main-banner-mobile h1 span{ padding-left: 0;}
.main-banner-mobile p{ padding-left: 0; color: #fff; line-height: 26px; margin-top: 25px; font-size: 14pt;}


.flexirow { display: flex; justify-content: center;  align-items: center;  margin-bottom: 40px;} 

.welcome-sec{ padding: 80px 0; overflow: hidden;}
.welcome-content h2{ font-family: Rajdhani-Bold; color: #222222;  font-size: 39pt; }
.welcome-content p{  color: #626263; text-align: justify;}
.welcomeimg img{ width: 100%;}
.leftbox{ padding-right: 100px; }
.welcomebox { margin-bottom: 50px; }
p.machine-perform {border: 1px solid #dfdfdf; padding: 20px; border-left: 6px solid #ffd300;    background: #eee;margin-bottom: 15px;}
.section-160{ padding: 100px 0;}
.tahnkyou{ text-align: center;}
.tahnkyou p{ font-size: 32px; text-align: center;line-height: 48px;}


.service{border: 1px solid #e9e9e9; padding: 5%; text-align: center; margin: 25px 0;height: 160px;}
.service h4{ font-family: Roboto-Bold; font-size: 13pt; }

.whoweare{ padding: 15% 5%;}
.yellow-color{ color: #f8c10d !important;}
.whoweare p{ color: #fff;}

.advantage h4{font-family: Roboto-Bold; font-size: 20pt; }

.owl-dots { width: 100%; text-align: center; bottom: 15px;}
.owl-dots .owl-dot { background: #ccc !important; width: 10px; height: 10px; margin: 5px; border-radius: 50%;}
.owl-dots .active { background: #000 !important;}
.prdimgbox{ position: relative; height: 135px;    margin-top: 30px;}
.prdcaption { position: absolute; bottom: 10px; padding: 0 15px ;}
.prdcaption h3{ font-family: Rajdhani-Bold; font-size: 50pt; color: #f8c10d ; margin: 0;}
.prdcaption{ font-family: Rajdhani-Bold; font-size: 20pt; color: #fff ; line-height: 32px;}
.clinbx{border:1px solid #e9e9e9; padding: 15px;text-align: center;}


.form-sec{ background: #222222; padding:40px 25px;}
.form-sec h2{ color: #f8c10d; font-size: 28px; text-align: center; }
  .sidemenu{position: -webkit-sticky; /* Safari */
    position: sticky;
    top: 0;}


.contact-sec { display: flex;  align-items: center;  justify-content: center; margin-bottom: 45px;}
.contact-sec .fa { color: #fff; width: 40px; height: 32px; text-align: center; font-size: 20px;  padding-top:10px;}
.contact-sec input[type="text"], input[type="email"], input[type="tel"], select, textarea {
    border: 0 !important;  border-radius: 0 !important; border-bottom: 1px solid #fff !important;
    background: none;  outline: none; color: #fff; margin-left: 15px; box-shadow: none;}
.subbttn{ background: #f8c10d; border: none; padding: 10px 25px; color: #000;  margin-left: 45px;}
.subbttn:hover{ background: #ffc812;}



.footer-sec{ padding: 20px 0; background: #000; }
.copyright{ text-align: left; color: #fff; font-size: 12pt; font-family: Robot-Bold;}
.copyright a{ color: #ffc812;}

.clearfix{ clear: both;}

.footcnt br{ display: none;}
.modal-header{ position: relative; background: #ffe300;}
.modal-header h1{  color: #000;  font-size:26pt;}
.modal-header .close{ position: absolute;  right: -10px;  top: -10px;  background: red;  opacity: 1;  padding: 8px 12px;
  color: #fff; border-radius: 48%;}

.modal-body{ background: #1c2022;padding: 10%;}

.rqstcall{bottom: 0;right: 0%; left: 0%; width: 100%; background: #000; height: 60px; position: fixed;z-index: 999; color: #ffe300; 
  text-align: center; display: none; line-height:60px;
  font-family: Roboto-Bold;}
.rqstcall:hover{ background: #ffe300; color: #000; text-decoration: none;}
.hidden-xs{ display: block;}

.sticky {
  position: fixed;
  width: 100%;
  top: 0;
  z-index: 999;
  transition: all 1s ease 0s;
  background: rgba(0,0,0,0.8);
}

.sidemenu{top: 100px;}
.clinbx img {
  width: 100%;
}

.prdimgbox img
{
    width: 100%;
    height: 100%;
}
  .rightsidebarfixed {position: fixed;top: 230px; width: 325px; display: block;min-height: auto; right: 10%;}
  .theme-color{color: #ffd300;}
  .img-overlay { background: #1119;  position: absolute;  top: 0;  height: 100%;  width: 100%;}

.pointer{ display: none;}

  @media only screen and (max-width: 991px) {
   
    /* ----------------- Enquiry Button ------------------- */  
    .pointer { cursor: pointer !important;  background-color: #ffd300;  color: #000; display: block;  }
    .bar-en {  width: 100%;  position: fixed;  bottom: 0px;   z-index: 9999;   display: inline-block; background-color: #fff; }
    .moble-con-f {  float: left;  padding: 19px 10px; }
    .moble-con {  text-transform: uppercase; color: #ffd300;  font-size: 16px;font-weight: 600;  line-height: 1.1; width: 100%;
      text-align: center;  cursor: pointer !important;  background-color: #000; }
      .moble-con:hover{ background: #2f2f2f;}  
   /* ------------------------------------------------- End ------------------------------ */
    .rightsidebarfixed{ right: 0;}
    .hidden-xs{ display: none;}   
    .moblogobox { width: 100%; text-align: center;}
    .moblogobox img{ width: 40%;}
    .flexirow{ display: block;}
    .drainage {  padding: 0 15px;}
    .banner-caption-box-mobile{ display: block; margin-bottom: 40px;}
    .welcome-content{ padding: 0;}
    .welcome-content h5{ font-size: 20pt;}
    .welcome-content h2{ font-size: 40pt;}
    .welcome-content p{ padding-top: 25px;}
    .welcome-sec { padding: 80px 0 0 0;}
    .leftbox{ padding: 0;}
    .footcnt{ text-align: center;}
    .footcnt br{ display: block;}
    .row { margin-right: 0;    margin-left: 0; }
    .sidemenu{ margin: 40px 0; padding: 0;}
    .copyright{ font-size: 12pt;}
    .form-sec {  position: relative !important; top: 0 !important;   width: 100% !important; }
    .service img{  width: 40%; }
  
  @media (min-width: 768px) and (max-width: 1440px) {
  
      .rightsidebarfixed {
    top: 160px;
}
  }