@import url('https://fonts.googleapis.com/css2?family=Albert+Sans:ital,wght@0,100..900;1,100..900&family=PT+Sans:ital,wght@0,400;0,700;1,400;1,700&display=swap');


@font-face {                    
    font-family: 'Area';
    src: url('../fonts/Area_Normal_SemiBold.woff') format('woff');
    font-weight: 600;
    font-style: normal;
}
@font-face {                    
    font-family: 'Area';
    src: url('../fonts/Area_Normal_Black.woff') format('woff');
    font-weight: 900;
    font-style: normal;
}
@font-face {                    
    font-family: 'Area';
    src: url('../fonts/Area_Normal_Bold.woff') format('woff');
    font-weight: 700;
    font-style: normal;
}
@font-face {                    
    font-family: 'Area';
    src: url('../fonts/Area_Normal_Regular.woff') format('woff');
    font-weight: 400;
    font-style: normal;
}
@font-face {                    
    font-family: 'Area';
    src: url('../fonts/Area_Normal_Thin.woff') format('woff');
    font-weight: 100;
    font-style: normal;
}
@font-face {                    
    font-family: 'Area-Inktrap';
    src: url('../fonts/Area_Inktrap_Bold.woff') format('woff');
    font-weight: 700;
    font-style: normal;
}
@font-face {                    
    font-family: 'Area-Inktrap';
    src: url('../fonts/Area_Inktrap_Regular.woff') format('woff');
    font-weight: 400;
    font-style: normal;
}
html, body, div, span, applet, object, iframe,  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; vertical-align: baseline;}
 html {
    -ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
 }
 img, fieldset, a img {border: none; vertical-align: middle; max-width: 100%; height: auto; width: auto;}
 input[type="text"], input[type="email"], input[type="tel"], textarea {-webkit-appearance: none;}
 input[type="submit"], button {cursor: pointer;background: none;}
 input[type="submit"]::-moz-focus-inner, button::-moz-focus-inner {padding: 0; border: 0;}
 textarea {overflow: auto;}
 input {-webkit-appearance: none; -moz-appearance: none; appearance: none;}
 input, button {margin: 0; padding: 0;	border: 0;}
 div, input, textarea, select, button, h1, h2, h3, h4, h5, h6, a, span, a:focus {outline: none;}
 select:-moz-focusring {color: transparent; text-shadow: 0 0 0 #000;}
 ul, ol {list-style-type: none;}
 table {border-spacing: 0; border-collapse: collapse; width: 100%;}
 html {-webkit-box-sizing: border-box; box-sizing: border-box;}
 *, *:before, *:after {-webkit-box-sizing: inherit; box-sizing: inherit;}
 a {
    transition: ease-in-out all 0.5s;
    -moz-transition: ease-in-out all 0.5s;
    -ms-transition: ease-in-out all 0.5s;
    -o-transition: ease-in-out all 0.5s;
    -webkit-transition: ease-in-out all 0.5s;
    text-decoration: none;
 }
 a:hover{color: #45BEDB; }
 a, button {
    transition: ease-in-out all 0.5s;
    -moz-transition: ease-in-out all 0.5s;
    -ms-transition: ease-in-out all 0.5s;
    -o-transition: ease-in-out all 0.5s;
    -webkit-transition: ease-in-out all 0.5s;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
 }

 section {clear: both; width: 100%; overflow: hidden;}
 
 body{ font-family: "Area"; font-size: 16px; ; line-height: 30px; font-weight: 400; color: #7A7776;}

p{padding-bottom: 30px; }
p:last-child{padding-bottom: 0;}
p a{color: #7A7776; text-decoration: underline;}

h2{font-size: 40px; font-weight: 600;}
h3{font-size: 30px; font-weight: 600;}
h4{font-size: 25px; font-weight: 600;}
h5{font-size: 20px; font-weight: 600;}
h6{font-size: 18px; font-weight: 600;}

.ptb-60{padding-top: 60px; padding-bottom: 60px;}
.pt-60{padding-top: 60px;}
.pb-60{padding-bottom: 60px;}

.common-btn{color: #45BEDB !important; line-height: normal; border: 1px solid #45BEDB !important; font-weight: 900 !important; transition: 0.5s all; min-width: 241px; text-align: center; padding: 19px 51px 20px !important; border-radius: 50px !important; }
.common-btn:hover{ background-color: #45BEDB; color: #fff !important; }

.common-heading h2{font-size: 40px; color:var(--heading-color); font-weight: 600; margin-bottom: 30px; line-height: 50px;}

:root {
  --heading-color: #45BEDB;
  }
/**************** header start  ****************/
.top-bar-main{background-color: #1D1D1B;}
.top-bar-main ul{display: flex; align-items: center; justify-content: center; padding: 13px 0; transition: 0.5s  all;}
.top-bar-main ul li{color: #fff; margin-right: 47px; font-size: 12px; font-weight: 600;}
.top-bar-main ul li:last-child{margin-right: 0px;}
.top-bar-main ul li a{color: #fff; text-decoration: underline; font-size: 12px; font-weight: 600;}
.top-bar-main ul li a:hover{color: #45BEDB; text-decoration: none;}


.navbar .row.header-row{width: 100%; justify-content: center;}
.navbar .row.header-row .col-12{ display: flex; justify-content: space-between; align-items: center;}

/* droup down css start  */
.navbar-expand-lg {padding: 0;}
.lower-header  .navbar-collapse{display: flex; justify-content: end;}
.lower-header .logo{padding: 10px 0;}
.lower-header .logo img{height: 69px ;transition: 0.5s  all;}
.lower-header  .navbar-nav .nav-link {color: #1D1D1B; transition: 0.3s all; font-size: 15px; font-family: "Area", sans-serif; font-weight: 600;}
.lower-header  .dropend .dropdown-toggle {display: flex;justify-content: space-between;}
.lower-header .dropdown-toggle i{font-size: 14px;}
.lower-header  .dropend .dropdown-toggle i{display: flex;align-items: center;}
.lower-header  .dropdown-item:hover { color: #000;}
.lower-header  .dropdown .dropdown-menu {display: none; background-color: #fff; border-radius: 0;}
.lower-header  .dropdown-menu {padding: 0;}
.lower-header   .dropdown-menu.show,
.lower-header   .dropdown-menu.show {margin: 0;}
.lower-header  .navbar-toggler {padding: 0;}
.lower-header .dropdown-toggle::after{content: inherit;}
/* droup down css end  */


.lower-header .main-sub-menu > li > a{font-weight: 700;}
.lower-header .main-sub-menu li{list-style: none;}
.lower-header .main-sub-menu ul{padding: 0;}
.lower-header .main-sub-menu {right: 0;}

/* lower header start  */
.lower-header .navbar-nav .nav-link.active{color: #45BEDB;}
.lower-header .navbar-nav .nav-link:hover{color: #45BEDB;}
.lower-header  ul.navbar-nav > li{padding: 24px 0; transition: 0.5s  all;}
.lower-header  ul.navbar-nav > li:not(:last-of-type) {margin-right: 129px; transition: 0.5s  all;}
/* header right area start  */

/* sticky header start  */
.lower-header.sticky-header { background-color: #fff; box-shadow: 0px -1px 11px -1px rgba(0,0,0,0.25);  position: fixed;width: 100%;top: 0; animation: sticky-header 1s;transition: .5s; z-index: 99;}
@keyframes sticky-header {0%{transform: translateY(-50px);}100%{transform: translateY(0px)}}
.lower-header.sticky-header .header-right-aria ul li a { font-size: 16px;}

.lower-header.sticky-header .top-bar-main ul {padding: 7px 0;}
.lower-header.sticky-header .logo {padding: 11px 0;}
.lower-header.sticky-header .logo img{height: 50px;}
.lower-header.sticky-header ul.navbar-nav > li {padding: 13px 0; margin-right: 99px;}
.lower-header.sticky-header ul.navbar-nav > li:last-child {margin-right: 0px;}
.lower-header.sticky-header .top-bar ul {padding: 11px 48px; transition: 0.3s all;}
.lower-header.sticky-header .top-bar .free-quat {padding: 10px 100px 11px;}
/* sticky header end  */

/**************** header end  ****************/

/* home page banner start */
.banner-main{position: relative;}
.banner-main .bg-video{min-height: 520px; position: relative;}
.banner-main video{height: 100%; width: 100%; position: absolute; object-fit: cover; display: block;}
.banner-main .banner-contant{position: absolute; width: 100%; top: 50%; left: 0; transform: translateY(-50%);}
.banner-main .banner-contant .contant-box{background-color: #000000BF; color: #fff; width: fit-content; padding: 85px 24px; border-radius: 12px;}
.banner-main .banner-contant h1{font-size: 40px; font-family: 'Area-Inktrap'; margin-bottom: 18px;}
.banner-main .banner-contant p{font-size: 12px;}
/* home page banner end */

.about-contant{display: flex; flex-direction: column; height: 100%; justify-content: center;}


/* home offer section start */
.home-offer{background-color: #F4F4F4;}
.offer-contant ul{margin-bottom: 25px;}
.offer-contant ul li{margin-bottom: 6px; color: #7A7776; position: relative; font-weight: 600; padding-left: 20px;}
.offer-contant ul li:last-child{margin-bottom: 0;}
.offer-contant ul li::before{position: absolute; content: ''; width: 5px; height: 2px; background-color: #7A7776; top: 15px; left: 0;}
.offer-contant a{ display: inline-block;}
.offers-list{height: 100%; display: flex; align-items: center;}
.offers-list .col{margin-bottom: 20px; padding-left: 10px; padding-right: 10px;}
.offers-list .offer-box{background-color: #fff; padding: 26px 11px; border-radius: 12px;}
.offers-list .offer-box h5{font-size: 13px;   color:var(--heading-color); color: #45BEDB; font-weight: 700; font-family: 'Area-Inktrap';}
.offers-list .offer-box a{font-size: 12px; color: #1D1D1B; font-weight: 100; text-decoration: underline;}
.offers-list .offer-box a:hover{color: #45BEDB; text-decoration: none;}
/* home offer section end */

/* we cover sec. start */
.we-cover-sec{background-color: #1D1D1B;}
.we-cover-sec .we-cover-contant{display: flex;flex-direction: column;height: 100%;justify-content: center;}
.we-cover-sec .we-cover-contant p{color: #C7C7C7;}
.we-cover-sec .we-cover-contant a{/*margin-top: 30px;*/ display: inline-block; width: fit-content;}
/* we cover sec. end */

/* footer start */
footer{background-color: #34343B; padding: 21px 0;}
.footer-left p{padding-bottom: 10px; line-height: 17px; }
.footer-left p{font-family: "Albert Sans", sans-serif; font-weight: 500; font-size: 14px; color: #F4F4F4;}
.footer-left  ul li{color: #F4F4F4; margin-bottom: 7px;  font-weight: 700; font-size: 14px;}
.footer-left  ul li:last-child{margin-bottom: 0px;}
.footer-left ul li a{color: #F4F4F4; font-weight: 400; font-family: 'Area-Inktrap';}
.footer-left ul li a:hover{color: #45BEDB;}
.footer-right ul{display: flex; justify-content: end; margin-bottom: 17px;}
.footer-right ul li{ position: relative; font-size: 14px; margin-right: 15px; font-family: 'Area-Inktrap'; color: #F4F4F4;}
.footer-right ul li a{color: #F4F4F4;}
.footer-right ul li a:hover{color: #45BEDB;}
.footer-right ul li:last-child{margin: 0;}
.footer-right ul li:not(:last-child)::before{content: ''; position: absolute; height: 15px; width: 1px; background-color: #F4F4F4; right: -9px; top: 7px;}
.footer-right p{color: #f4f4f4; font-family: 'Area-Inktrap'; font-size: 14px; text-align: end;}
.footer-right p a{color: #f4f4f4; }
.footer-right p a:hover{color: #45BEDB; }
/* footer end */

/* inner page css start */

/* hero banner start */
.about-us-bg{background-image: url('../images/about-us-header-image.jpg');}
.hero-banner{min-height: 522px; display: flex; align-items: center;  background-position: center; background-size: cover; background-repeat: no-repeat;}
.hero-contant{max-width: 462px; border-radius: 12px; background-color: #000000BF; padding: 69px 20px; }
.hero-contant h1{color: #FFFFFF; font-size: 40px; font-family: 'Area-Inktrap'; line-height: 53px; margin-bottom: 18px;}
.hero-contant p{color: #fff; font-size: 12px; line-height: 25px; font-weight: 400;}
/* hero banner end */

/* product page start */
.our-product-bg{background-image: url('../images/our-products-header-image.jpg');}
.ceiling-systems{padding-bottom: 14px;}
.ceiling-systems .row .col{margin-bottom: 20px;}
.ceiling-system-box{display: flex; flex-direction: column; height: 100%;}
.ceiling-system-box .system-img{border-radius: 12px; overflow: hidden; height: 289px; flex-shrink: 0; border: 0.5px solid #220E24;}
.ceiling-system-box .system-img img{height: 100%; width: 100%;}
.ceiling-system-box .system-name{padding-top: 17px; height: 100%; display: flex; flex-direction: column;}
.ceiling-system-box .system-name h5{font-size: 14px; font-family: 'Area-Inktrap'; margin-bottom: 16px; color: #1D1D1B; text-transform: capitalize; }
.ceiling-system-box .system-name a{font-size: 12px; font-weight: 700; padding: 8px 22px 7px; border: 1px solid #45BEDB; color: #45BEDB; border-radius: 50px; line-height: normal;width: max-content;margin-top: auto;}
.ceiling-system-box .system-name a:hover{background-color: #45BEDB; color: #fff;}
/* product page end */

/* contact us page start */
.contact-us-bg{background-image: url('../images/contact-us-header.jpg');}
.contact-desc{margin-bottom: 28px;}
.mail-contact{margin-bottom: 26px;}
.mail-contact ul{display: flex;}
.mail-contact ul li{position: relative; padding-left: 19px; padding-bottom: 50px; margin-right: 51px;}
.mail-contact ul li:last-child{margin: 0;}
.mail-contact ul li::before{position: absolute; content: ""; left: 0; top: 0; height: 100%; width: 2px; background-color: #45BEDB;}
.mail-contact ul li h4{margin-bottom: 14px; font-size: 25px; color: #45BEDB; font-weight: 700; font-family: 'Area-Inktrap';}
.mail-contact ul li a{font-size: 14px; color: #2C2C34; display: block; line-height: normal;}
.mail-contact ul li a:hover{color: var(--heading-color);}
.address{background-color: var(--heading-color); padding: 27px 37px; border-radius: 6px;}
.address h3{font-size: 32px; color: #F4F4F4; font-weight: 700; line-height: 43px; margin-bottom: 9px;}
.address address{color: #F4F4F4; line-height: 24px; margin-bottom: 9px; max-width: 345px;}
.address a{color: #F4F4F4; font-size: 14px; font-weight: 600; text-decoration: underline; line-height: normal; display: block;}
.address a:hover{color: #fff; text-decoration: none;}
/* contact form start */
.right-side.contact-form{padding-left: 30px; padding-right: 30px;}
.right-side.contact-form form{padding: 28px; border: 1px solid #B2B2B273;border-radius: 6px;}
.contact-form form .input-group{display: grid;}
.contact-form form label{color: #2C2C34; font-size: 12px; font-weight: 600; line-height: 16px; margin-bottom: 8px; }
.contact-form form input,.contact-form form textarea,.contact-form form select{ width: 100%; border: 1px solid #B2B2B2; border-radius: 6px !important; padding:  5px 8px; }
.contact-form form select{height: 42px;}
.contact-form form textarea{ min-height: 138px; resize: none;}
.contact-form form input[type='submit']{line-height: normal; width: fit-content; border-radius: 50px !important;}
.contact-form form .col{margin-bottom: 28px;}
.contact-form .input-group .submit-btn{ position: relative; display: inline-block; width: fit-content;}
.contact-form .input-group .wpcf7-spinner{position: absolute; top: 50%; transform: translateY(-50%); right: -60px; border-radius: 50px !important; }
.contact-form .input-group .wpcf7-not-valid-tip{line-height: normal; font-size: 14px; margin-top: 5px;}
.contact-form form input.wpcf7-not-valid{border-color: #dc3232;}

.contact-form form.invalid .wpcf7-response-output{font-size: 14px;border-color: #dc3232 !important;}
.contact-form form.sent .wpcf7-response-output{border-color: green;}
/* contact form end */
/* contact us page end */

.enquire-popup{/*max-width: 729px;*/ position: relative;}
.enquire-popup h5{font-size: 30px; font-weight: 600; text-align: center; color: var(--heading-color);}
.enquire-popup button.btn-close{position: absolute; top: 30px; right: 30px; opacity: 1;}
.enquire-popup .modal-header{justify-content: center; padding: 23px 25px 25px; border-bottom: 0;}
.modal-body.contact-form{padding: 30px; padding-top: 0;}
.modal-body.contact-form .col-12:last-child .input-group{justify-content: center;}



/* thank you page start */
.thank-you-section .thankyou{display: flex;justify-content: center;flex-direction: column;align-items: center;text-align: center;}
.thank-you-section .thankyou img{height: 120px;margin-bottom: 20px;}
.thank-you-section .thankyou h2{font-size: 80px; line-height: 80px; font-weight: 700; /*color: #34343B;*/}
.thank-you-section .thankyou p{font-size: 22px;line-height: 30px;}
/* thank you page end */

.cms-details .wp-block-heading{color: var(--heading-color);}

.cms-details ol{list-style-type: lower-alpha; padding-left: 15px;}
.cms-details ul,.cms-details ol{margin-bottom: 25px;}
.cms-details ul li{position: relative; margin-bottom: 17px; line-height: normal; padding-left: 15px;}
.cms-details ol li{margin-bottom: 17px; line-height: normal;}
.cms-details ul li:last-child,.cms-details ol li:last-child{margin-bottom: 0;}
.cms-details ul li::before{position: absolute; content: " "; height: 5px; width: 5px; background-color: var(--heading-color); border-radius: 50px; top: 8px; left: 0;}
.cms-details ol li a,.cms-details ul li a{color: #7A7776; text-decoration: underline;}