#sub-banner{ margin: 0px 0px 0px 0px; padding: 0px 0px; position: relative; background: #004c97;}
.sub-page-title{padding: 50px 35px;margin: 0px 0px;}
.sub-page-title h1{ font-size: 47px; color: #fff;}
.sub-banner-img{ margin: 0px 0px 0px 0px; padding: 0px 0px; position: relative;}
.sub-banner-img::before{content: ''; display: block; position: absolute; right: 0; bottom: 0; width: 100%; max-width: 475px; height: 100%; background: url(../img/slider-shape.png) no-repeat; background-size: contain; background-position: right bottom;}
.sub-banner-img img{width: 100%;max-height: 200px;object-fit: cover;object-position: center;}

#product-main{padding: 40px 0px;margin: 0px 0px;position: relative;overflow: hidden;z-index: 1;}
/* #product-main::before{content: '';display: block;position: absolute;left: 0;top: 0;bottom: 0;width: 42%;height: 100%;border: 70px solid #f5f5f5ad;transform: rotate(45deg);z-index: -1;} */
.product-img-slider{ padding: 50px 50px; perspective: 1000px;}
.product-data{ margin: 0px 0px; padding: 50px 50px 50px 50px; position: relative;}
.product-data small{ color: #444; font-size: 20px; font-weight: 500;}
.product-data h2{ font-size: 47px; color: #004c97; font-weight: 600; margin: 0px 0px 30px 0px;}
.product-highlight{ margin: 0px 0px 30px 0px; padding: 0px 0px 0px 0px; position: relative;}
.product-highlight li{padding: 3px 22px;font-size: 17px;color: #444;list-style: none;position: relative;}
.product-highlight li::before{content: '';display: block;position: absolute;left: 0;top: 11px;width: 9px;height: 9px;background: #EF811E;border-radius: 15px;}
.product-img-slider img{width: 100%; transition: transform 0.2s ease; transform-style: preserve-3d;}

.product-buttons{margin: 0px 0px 0px 0px;padding: 0px 0px 0px 0px;position: relative;display: flex;flex-wrap: wrap;}
.product-buttons li{list-style: none;display: flex;flex-wrap: wrap;margin: 5px 5px 5px 0px;}
.product-buttons li a{ padding: 10px 15px; color: #444; border: 2px solid #004c97; position: relative; overflow: hidden; transition: all ease 0.5s; z-index: 1; border-radius: 5px;}
.product-buttons li a::before{ content: ''; display: block; width: 0px; height: 100%; background: #004c97; transition: all ease 0.5s; position: absolute; left: 0; top: 0; z-index: -1;}
.product-buttons li a:hover::before{ width: 100%;}
.product-buttons li a:hover{ color: #fff;}
.product-buttons li:first-child a::before{ width: 100%; }
.product-buttons li:first-child a:hover{ color: #444;}
.product-buttons li:first-child a:hover::before{ width: 0;}
/* .product-buttons:has(li a:hover) li:first-child a::before {width: 0;}
.product-buttons:has(li a:hover) li:first-child a{ color: #004C97;} */
.product-buttons li:first-child a{color: #fff;}

#key-features{ margin: 0px 0px 0px 0px; padding: 80px 0px; background: #004c97; position: relative;}
.feature-information{ margin: 0px 0px 0px 0px; padding: 0px 0px; position: relative;}
.feature-information h2{ margin: 0px 0px 0px 0px; color:#a2d9f7;}
.feature-information h3{color: #fff;font-size: 47px;font-weight: 600;margin: 0px 0px 30px 0px;}

.product-slider-section{ padding: 0px 15px;}
.product-slider-section .owl-stage{ display: flex;}
.product-slider-section .owl-item{ display: flex;}
.product-feature{padding: 35px 35px;background: #D4EDFC;border-radius: 10px;height: 100%;transition:all ease 0.5s;display: flex;align-items: center;flex-wrap: wrap;}
.product-feature span{display: block;margin: 0px 0px 0px 0px;position: relative;}
.product-feature span img{max-width: 150px;display: block;object-fit: cover;margin: 0px 35px 15px 0px;}
.product-feature h4{ color: #004c97; font-size: 20px; font-weight: 600; transition: color ease 0.5s;}
.product-feature p{font-size: 17px;color: #444;margin: 0px 0px 10px 0px;transition: color ease 0.5s;}
.product-feature p img{margin:3px 5px 0px 0px;width: fit-content !important;float: left;}
.product-feature:hover{ background: #fff;}


#product-range { margin: 0px 0px 0px 0px; padding: 80px 0px; position: relative;}
.product-range-top{ margin: 0px 0px 0px 0px; padding: 0px 0px; position: relative;}
.product-range-top small{/* text-align: center; */margin: 0px 0px 0px 0px;font-size: 20px;color: #444;font-weight: 500;display: block;}
.product-range-top h2{display: block;color: #004c97;font-size: 37px;font-weight: 700;margin: 0px 0px 35px 0px;/* text-align: center; */}

.product-range-information{margin: 0px 0px 0px 0px;padding: 30px 0px 0px 30px;position: relative;}
.option-tabs{margin: 0px 0px 50px 0px; position: sticky; top: 100px;}
.option-tabs .pro-tab{margin: 0px 0px 25px 0px;padding: 50px 35px 35px 35px;text-align: center;display: flex;flex-wrap: wrap;justify-content: center;align-items: center;flex-direction: column;background: #f4f4f4;border-radius: 10px;position: relative; z-index: 1;}
.option-tabs .pro-tab::before{    content: ''; display: block; background: url(../img/product-shape.png) no-repeat; background-size: cover; position: absolute; right: 0; bottom: 0; width: 100%; height: 100%; z-index: -1; border-radius: 10px; mix-blend-mode: multiply; opacity: .35;}
.option-tabs .pro-tab span{max-width: 250px;display: block;margin: 0px 0px 30px 0px;}
.option-tabs .pro-tab span img{max-width: 170px;}
.option-tabs .pro-tab h3{font-size: 22px;color: #444;font-weight: 600;}


.salient-features{ margin: 0px 0px 0px 0px; padding: 0px 0px; position: relative;}
.salient-features h2{ color: #004C97; font-size: 22px; text-align: left; font-weight: 600; margin: 0px 0px 15px 0px;}

#product-ingredient .accordion-button::after {background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='currentColor' class='bi bi-plus' viewBox='0 0 16 16'%3E%3Cpath d='M8 4a.5.5 0 0 1 .5.5v3h3a.5.5 0 0 1 0 1h-3v3a.5.5 0 0 1-1 0v-3h-3a.5.5 0 0 1 0-1h3v-3A.5.5 0 0 1 8 4z'/%3E%3C/svg%3E");
    transition: all 0.5s; filter: grayscale(100%) sepia(100%) hue-rotate(90deg); mix-blend-mode: hard-light;}
#product-ingredient .accordion-button:not(.collapsed)::after {background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='currentColor' class='bi bi-dash' viewBox='0 0 16 16'%3E%3Cpath d='M4 8a.5.5 0 0 1 .5-.5h7a.5.5 0 0 1 0 1h-7A.5.5 0 0 1 4 8z'/%3E%3C/svg%3E");}    
#product-ingredient .accordion-button::after {transition: all 0.5s;}
#product-ingredient .accordion-button:focus{ box-shadow: none; background: transparent;}
#product-ingredient .accordion-item{border: 1px solid #004c97;margin: 0px 0px 15px 0px;padding: 0px 25px;border-radius: 10px;}
#product-ingredient .accordion-item:not(:first-of-type){/* border-top: 1px solid #d3d3d3; */}
#product-ingredient .accordion-button:not(.collapsed){background: transparent;box-shadow: none;/* border-bottom: 1px solid #004c97; */color: #004c97;}
#product-ingredient .accordion-button{font-size: 22px;font-weight: 600;color: #444;line-height: 1.5;padding:25px 0px 25px 35px;position: relative;z-index: 0;}
#product-ingredient .accordion-button span{position: absolute;left: 0;width: 35px;height: 35px;background: #f6b527;color: #ffffff;border-radius: 50px;text-align: center;line-height: 35px;font-size: 15px;font-weight: 600; display: none;}
#product-ingredient .accordion-body{padding: 0px 0px 0px 0px;}

#product-ingredient  .accordion-header{position: relative;z-index: 1;}
/* #product-ingredient  .accordion-header::before{content: '';display: block;position: absolute;top: 23px;left: 7px;width: 20px;height: 20px;background: #f6b527;border-radius: 25px;z-index: 1;} */
#product-ingredient  .accordion-header::after{content: '';display: block;position: absolute;top: 26px;left: 5px;width: 22px;height: 22px;background: url(../img/favicon.png) no-repeat;background-size: contain;transform: inherit;z-index: 1;}

.range-features { margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; position: relative; display: block;}
.range-features h3{font-size: 20px;color: #004c97;font-weight: 600;margin: 0px 0px 15px 0px;}
.r-feature-points { margin: 0px 0px 30px 0px; padding: 0px 0px 0px 0px; position: relative; display: block;}
.r-feature-points li{ list-style: none; padding: 2px 20px 2px 20px; font-size: 17px; color: #444; position: relative;}
.r-feature-points li::before{content: '';display: block;position: absolute;left: 0;top: 11px;width: 8px;height: 8px;background: #EF811E;border-radius: 15px;}

.product-table { margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; position: relative; display: block;}
.product-table h3{font-size: 22px;color: #004c97;font-weight: 600;margin: 0px 0px 15px 0px;}
.product-table tr{margin: 0px 0px 0px 0px;position: relative;background: #ffffff;}
.product-table thead th{padding: 10px 15px;font-size: 17px;color: #ffffff;font-weight: 600;background: #ef7f1a;}
.product-table thead th:nth-child(1){ background: #004C97; color: #fff; border: 1px solid #004C97;}
.product-table thead th:nth-child(2){ background: #51b7d0; color: #fff; border: 1px solid #42a1b9;}
.product-table thead th:nth-child(3){ background: #51b7d0; color: #fff; border: 1px solid #42a1b9;}
.product-table tbody{ padding: 30px 30px;}
.product-table tbody td{padding: 10px 15px;font-size: 16px;color: #444;border: 1px solid #e7e7e7;font-weight: 400;}
.product-table tbody td span{ max-width: 30px; display: block;}
.range-img {margin: 0px auto 35px auto;padding: 0px 0px 0px 0px;position: relative;max-width: 350px;}

#product-ingredient { padding: 80px 0px; background: #f4f4f4; margin: 0px 0px 0px 0px; position: relative;}
#product-ingredient h2{margin: 0px 0px 15px 0px;font-size: 37px;color: #004c97;font-weight: 600;}
#product-ingredient p{color: #444;margin: 0px 0px 25px 0px;font-size: 17px;font-weight: 400;line-height: 1.5;}
.product-parts{margin: 0px 0px 50px 0px;padding: 0px 0px 0px 0px;position: relative;background: #fff;border-radius: 15px; height: 100%;}
.parts-img{padding: 25px 25px;text-align: center;background: #f4f4f4;border-radius: 15px;height: 100%;}
.parts-img img{margin: 0px 0px 25px 0px;position: relative;max-height: 110px;object-fit: contain;}
.parts-img h4{ font-size: 16px; color: #444; font-weight: 600;}

#company-profile{padding: 80px 0px 80px 0px;margin: 0px 0px 0px 0px;position: relative;z-index: 1;}
#company-profile::before{content: '';display: block;position: absolute;left: 0;top: 0;width: 75%;height: 100%;background: #f4f4f4;}
.about-info{ margin: 0px 0px 0px 0px; padding: 0px 50px 30px 0px;}
.about-info h2{ color: #444; font-size: 20px; margin: 0px 0px 10px 0px;}
.about-info p.large-para{font-size: 47px; color: #004C97; font-weight: 600; line-height: 50px; margin: 0px 0px 30px 0px;}
.about-info p{ font-size: 17px; color: #444;}
.about-info h3{ color: #004C97; font-size: 20px; font-weight: 600; margin: 0px 0px 15px 0px;}
.about-info h6{ color: #444; font-size: 17px; font-weight: 500; margin: 0px 0px 15px 0px;}
.about-points{ margin: 0px 0px 20px 0px; padding: 0px 0px 0px 0px; position: relative;}
.about-points li{list-style: none;font-size: 17px;color: #444;padding: 3px 0px 3px 30px;position: relative;}
.about-points li::before{content: '';display: block;position: absolute;left: 0;top: 4px;width: 23px;height: 23px;background:url(../sub-img/true-sign.svg) no-repeat;background-size: contain;}

.company-img{ position: sticky; top: 160px; margin: 0px 0px 15px 0px;}
.company-img img{ border-radius: 10px 0px 0px 10px;}

#believe-part{ padding: 80px 0px; margin: 0px 0px 0px 0px; position: relative;}
.believe-top{ text-align: center; margin: 0px auto 35px auto; max-width: 900px;}
.believe-top small{ font-size: 18px; color: #444; font-weight: 500;}
.believe-top h2{ color: #004C97; font-size: 47px; margin: 0px 0px 15px 0px;}
.believe-top p{ color: #444; font-size: 17px;}

.believe-details{ margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; position: relative;}
.believe-details h6{ text-align: center; font-size: 22px; color: #004C97; margin: 0px 0px 50px 0px;}
.believe-details p{ text-align: center;}
.believe-data{text-align: center;padding: 35px 25px;border: 1px solid #ccc;border-radius: 10px;position: relative;margin: 0px 0px 50px 0px; min-height: 135px; transition: all ease 0.5s;}
.believe-data::before{content: '';display: block;position: absolute;top: -2px;left: 0;right: 0;margin: auto;width: 185px;height: 3px;background: #fff;}
.believe-data span{display: block;margin: -65px 0px 25px 0px;z-index: 1;position: relative;}
.believe-data span img{ transition: all ease 0.5s;}
.believe-data:hover{ border-color: #EF811E;}
.believe-data:hover span img{animation: shake 0.5s ease-in-out;}

#contact-information{ padding: 80px 0px 50px 0px; margin: 0px 0px 0px 0px; position: relative;}
#contact-information small{display: block;margin: 0px auto 10px auto;font-size: 20px;color: #444;text-align: center;}
#contact-information h2{text-align: center;margin: 0px 0px 60px 0px;}

.contact-details{ margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; position: relative;}
.contact-data{text-align: center;padding: 35px 25px;border: 1px solid #ccc;border-radius: 10px;position: relative;margin: 0px 0px 50px 0px; min-height: 175px; transition: all ease 0.5s;}
.contact-data::before{content: '';display: block;position: absolute;top: -2px;left: 0;right: 0;margin: auto;width: 185px;height: 3px;background: #fff;}
.contact-data span{display: block;margin: -65px 0px 25px 0px;z-index: 1;position: relative;}
.contact-data span img{ transition: all ease 0.5s; max-height: 65px;}
.contact-data:hover{ border-color: #EF811E;}
.contact-data:hover span img{animation: shake 0.5s ease-in-out;}
.contact-data h3{ font-size: 18px; color: #444; font-weight: 600;}
.contact-data p{ margin: 0px 0px 0px 0px; }
.contact-data a{ color: #444;}

@keyframes shake { 0%, 100% { transform: translateX(0); } 25% { transform: translateX(-5px); } 75% { transform: translateX(5px); }}

#contact-inquiry{ background: #F4F4F4; padding: 70px 0px 70px 0px; position: relative;}
.contact-form{margin: 0px 0px 0px 0px;padding: 50px 50px;position: relative;background: #004c97;border-radius: 10px;}
.contact-form h2{font-size: 30px;color: #ffffff;font-weight: 600;text-align: left !important;margin: 0px 0px 10px 0px !important;}
.contact-form p{ color: #fff; font-size: 17px; margin: 0px 0px 20px 0px;}
.contact-form .form-group{ margin: 0px 0px 25px 0px; padding: 0px 0px; position: relative;}
.contact-form .form-group label{padding: 0px 0px 0px 15px;font-size: 15px;color: #ffffffc2;font-weight: 400;}
.contact-form .form-group input{width: 100%;padding: 15px 15px;border: transparent;outline: none;border-radius: 0;border-bottom: 1px solid #ffffff36;background: transparent;color: #fff;transition: all ease 0.5s;}
.contact-form .form-group textarea{width: 100%;height: 100px;resize: none;padding: 15px 15px;border: transparent;outline: none;border-radius: 0;border-bottom: 1px solid #ffffff36;background: transparent;color: #fff;transition: all ease 0.5s;}
.contact-form .submit{padding: 12px 30px;color: #fff;background: #008ba8;border: 0;border-radius: 5px;overflow: hidden;position: relative;z-index: 1;}
.contact-form .submit::before{content: '';background: #ef811e;width: 106%;height: 0;padding-bottom: 100%;transform: translate3d(0, 0, 0);transition: transform 0.3s;transition-timing-function: cubic-bezier(0.7, 0, 0.2, 1);display: block;z-index: -1;position: absolute;left: 0;top: 0;}
.contact-form .submit:hover::before {transform: translate3d(0, 100%, 0);}
.contact-form .form-group input::placeholder, .contact-form .form-group textarea::placeholder{ font-size: 14px; color: #ffffff24;}
.contact-form .form-group input:focus, .contact-form .form-group textarea:focus{ border-bottom: 1px solid #ffffff;}

#contact-map{ width: 100%; height: 450px;}

#careers-page {padding: 80px 0px 20px 0px;margin: 0px 0px 0px 0px;position: relative;}
.career-top{ max-width: 1000px; margin: 0px auto 50px auto; padding: 0px 0px; position: relative; text-align: center;}
.career-top small { display: block; margin: 0px auto 10px auto; font-size: 20px; color: #444; text-align: center;}
.career-top h2{ margin: 0px 0px 20px 0px;}

#career-form-section{margin: 0px 0px;padding: 0px 0px 50px 0px;position: relative;} 
#career-form-section::before{content: '';display: block;position: absolute;left: 0;bottom: 0;width: 100%;height: 75%;background: #f4f4f4;z-index: -1;}
.career-form{margin:0px 0px 0px 0px;padding: 15px 15px;background: #fff;border: 12px solid #f5f5f5;}
.career-form h2{ color: #004C97; font-size: 18px; font-weight: 600; margin: 0px 0px 15px 0px;}
.career-form-inner{ background: #f4f4f4; padding: 35px 35px;}
.career-form-inner input {font-size: 16px;color: #444;width: 100%;padding: 12px 20px;width: 100%;border: 1px solid #c5c5c5;}
.career-form-inner select { font-size: 16px; color: #444; width: 100%; padding: 14px 20px; width: 100%; border: 1px solid #d9d9d9;}
.career-form-inner input::placeholder, .career-form-inner select::placeholder, .career-form-inner textarea::placeholder{ color: #8d8d8d; font-size: 15px;}
.form-personal{ margin: 0px 0px 30px 0px; padding: 0px 0px; position: relative;}
.career-form-inner .form-group .file-drop-area {margin-top: 0px;padding:10px 15px;width: 100%;height: 127px;border: 1px dashed rgb(157 157 157); background: #fff; position: relative;display: flex;flex-direction: column;justify-content: center;align-items: center;transition: 0.2s;}
.career-form-inner .form-group .file-drop-area.is-active {background: rgb(245 123 41 / 5%); }
.career-form-inner .form-group .file-drop-area .fake-btn {margin: 0 0 10px 0;padding: 8px 25px;background: #ef811e;border-radius: 26px;font-size: 12px;color: #fff;letter-spacing: 1.5px;text-transform: uppercase;flex-shrink: 0;}
.career-form-inner .form-group .file-drop-area .file-msg {width: 100%;font-size: 16px;font-weight: 400;color: #c1c0c0;text-align: center;text-overflow: ellipsis;white-space: nowrap;overflow: hidden;}
.career-form-inner .form-group .file-drop-area .file-input {position: absolute; top: 0; left: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; }
.career-form-inner .form-group .file-drop-area .file-input:focus {outline: none; }
.career-form-inner .submit{padding: 12px 50px;color: #fff;background: #ef811e;border: 0;border-radius: 5px;overflow: hidden;position: relative;z-index: 1;}
.career-form-inner .submit::before{content: ''; background: #004c97; width: 106%; height: 0; padding-bottom: 100%; transform: translate3d(0, 0, 0); transition: transform 0.3s; transition-timing-function: cubic-bezier(0.7, 0, 0.2, 1); display: block; z-index: -1; position: absolute; left: 0; top: 0;}
.career-form-inner .submit:hover::before {transform: translate3d(0, 100%, 0);}

#other-products {position: fixed;bottom: 0;width: 100%;background: #ef811e;z-index: 999;transform: translateY(100%);transition: transform 0.4s ease-in-out;}
/* Visible when scrolling */
#other-products.show { transform: translateY(calc(100% - 60px));}
#other-products a{text-align: center;color: #fff;display: block;padding: 20px 20px;font-size: 18px;text-transform: uppercase;font-weight: 600;}
/* When active (clicked open) */
#other-products.active { transform: translateY(0%);}
.product-list { padding: 15px 0px; background: #fff;}
.other-product-list{margin: 0px 0px 20px 0px;padding: 0px 0px;position: relative;display: flex;justify-content: center;flex-wrap: wrap;}
.other-product-list li{display: flex;flex-wrap: wrap;list-style: none;margin: 5px;border: 1px solid #d7d7d7;}
.other-product-list li a{display: flex !important;flex-direction: column;font-size: 14px !important;color: #444 !important;}
.other-product-list img{ max-width: 150px; text-align: center; margin: 0px 0px 0px 0px;}


