#sub-page-banner{ margin: 0px 0px; padding: 0px 0px; position: relative; z-index: 1;}
#sub-page-banner:before { content: ''; display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.35); z-index: 2;}
#sub-page-banner img{width: 100%;min-height: 280px;object-fit: cover;object-position: center;}
#sub-page-banner .page-ttl{ position: absolute; bottom: 20%; left: 0; right: 0; margin: 0px 0px; padding: 0px 0px; text-align: center; z-index: 5;}
#sub-page-banner .page-ttl h1{ font-size: 35px; font-weight: 600; color: #fff;}
.page-breadcrumbs{ margin: 0px 0px; padding: 0px 0px; position: relative;}
.page-breadcrumbs li{display: inline-block;list-style: none;font-size: 15px;color: #fff;padding: 0px 15px;position: relative;} 
.page-breadcrumbs li::before{content: '';display: block;position: absolute;right: 0;width: 1px;height: 100%;background: #fff;transform: rotate3d(1, 1, 1, 45deg);}
.page-breadcrumbs li:last-child::before{ display: none;}
.page-breadcrumbs li a{ color: #fff;}

.sticky-nav { position: fixed !important; top: 75px !important; width: 100%; margin: auto !important; left: 0; right: 0; box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.25); transition: all ease 0.5s;}
.sticky-nav .nav-item span img{ min-height: 40px !important; max-height: 40px !important;}
.sticky-nav .nav-item span{ margin: 0px 0px 10px 0px !important;}
.sticky-nav .nav-item h3{ font-size: 22px !important;}
.mission-tabs .sticky-nav .nav-link {
    padding: 10px 50px;
}


#mission-vision{ padding: 75px 0px; margin: 0px 0px 0px 0px; position: relative;}
#about-page{ margin: 0px 0px 0px 0px; padding: 75px 0px; position: relative; background: #fff; z-index: 1;}
#about-page::before{content: '';display: block;position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: url(../img/welcome-bg.jpg) no-repeat;background-size: cover;opacity: .17;z-index: -1;border-radius: 15px;mix-blend-mode: multiply;}
.overview-main{ margin: 0px 0px 50px 0px; padding: 0px 0px;}
.about-left{ padding: 0px 50px 50px 0px; margin: 0px 0px; position: relative;}

#mission-section{ padding: 25px 0px 75px 0px; margin: 0px 0px; position: relative;}
.tab-content{ padding: 75px 0px; border-top: 1px solid #e3e3e3;}
.mission-tabs{ margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; position: relative;}
.mission-tabs ul#pills-tab {margin: auto;text-align: center;display: flex;align-items: center;justify-content: center;position: relative;top: 0px;background: #fff;z-index: 1;}
.mission-tabs .nav-item{ padding: 0px 0px; margin: 0px 0px 0px 0px; position: relative; border-right: 1px solid #e3e3e3;}
.mission-tabs .nav-link{ padding: 35px 50px;}
.mission-tabs .nav-item .nav-link.active{ background: transparent;}
.mission-tabs .nav-item span{ display: block; margin: 0px 0px 30px 0px; padding: 0px 0px;}
.mission-tabs .nav-item span img { min-height: 80px; max-height: 80px; object-fit: cover; transition: all ease 0.5s;}
.mission-tabs .nav-item h3{ font-size: 35px; color: #444; font-weight: 600;}
.mission-tabs .nav-item:last-child{ border: none;}
.mission-tabs .nav-item:hover img{ transform: scale(1.075);}
.mission-tab-content { padding:0px 0px; }
.mission-info {margin: 0px 0px 30px 0px;}
.mission-img {padding: 0px 50px; margin: 0px 0px 0px 0px; position: relative;}
.mission-data{ margin: 0px 0px 0px 0px; padding: 75px 0px; position: relative; border-bottom: 1px solid #f5f5f5;}
.mission-point{ margin: 0px 0px; padding: 0px 0px; position: relative;}
.mission-point li{display: block;list-style: none;font-size: 16px;color: #444;padding: 8px 20px;position: relative;background: #F2ECE0;margin: 0px 0px 5px 0px;}
.mission-point li::before{content: '';display: block;position: absolute;left: 0;width: 3px;height: 20px;background: var(--blue);top: 10px;}

#milestone-page{ margin: 0px 0px 0px 0px; padding: 75px 0px; position: relative;}
.timeline-main { margin: 50px auto; padding: 0px 0px; position: relative; max-width: 1100px;}
.timeline-data { display: flex; margin: 0px 0px; padding: 0px 0px; position: relative;}
.timeline-year { margin: 0px 0px 0px 0px; padding: 50px 120px 50px 0px; position: relative; min-width: 230px;}
.timeline-year h3{color: #444;font-size: 35px;font-weight: 600;}
.timeline-content {padding: 50px 0px 50px 50px;margin: 0px 0px 0px 0px;position: relative;width: 100%;}
.timeline-content::before{ content: ''; display: block; position: absolute; top: 0; left: 0; width: 2px; height: 100%; background: var(--blue);}
.timeline-content::after{content: '';display: block;position: absolute;left: -9px;top: 55px;width: 20px;height: 20px;background: #fff;border: 2px solid var(--blue);border-radius: 30px; transition: all ease 0.5s;}
.timeline-content:hover::after{ border-color: #209300; transform: scale(1.1);}

.milesone-points{margin: 0px 0px 0px 0px;padding:5px 0px 50px 50px;position: relative;border-bottom: 1px dashed #c5c5c5;}
.milesone-points li{font-size: 16px;color: #444;list-style: none;padding: 0px 0px 0px 30px;margin: 0px 0px 15px 0px;position: relative;line-height: 1.6;}
.milesone-points li::before{ content: ''; display: block; position: absolute; left: 0; top: 3px; background: url(../sub-images/right.svg) no-repeat; width: 18px; height: 18px; background-size: contain; filter: brightness(0) saturate(100%) invert(35%) sepia(90%) saturate(1632%) hue-rotate(75deg) brightness(92%) contrast(104%);}

#manufacturing-facility{ margin: 0px 0px 0px 0px; padding: 75px 0px; position: relative;}
#manufacturing-facility::before{content: '';display: block;position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: url(../img/welcome-bg.jpg) no-repeat;background-size: cover;opacity: .17;z-index: -1;border-radius: 15px;mix-blend-mode: multiply;}
.facility-text{ margin: 0px 0px 0px 0px; padding: 0px 50px 0px 0px; position: relative;}
#facility-boaster{ margin: 0px 0px 0px 0px; padding: 75px 0px; position: relative;}
.facility-points{ margin: 0px 0px 50px 0px; padding: 0px 0px; position: relative;}
.facility-points li{display: block;list-style: none;font-size: 16px;color: #444;padding: 8px 20px;position: relative;background: #F2ECE0;margin: 0px 0px 5px 0px;}
.facility-points li::before{content: '';display: block;position: absolute;left: 0;width: 3px;height: 20px;background: var(--blue);top: 10px;}

.facility-gallery { margin: 90px 0px 0px 0px;}
.facility-img{ margin: 0px 0px; padding: 0px 0px 0px 0px; position: relative; overflow: hidden;}
.facility-img img{ max-height: 310px; min-height: 310px; width: 100%; height: 100%; object-fit: cover; object-position: center; transition: all ease 0.5s;}

.facility-img a{position: relative;margin: 0px 0px;padding: 0px 0px;z-index: 1;display: block;}
.facility-img a::before{content: ''; display: block; position: absolute; top: 0; left: 0; width: 100%; height: 50%; background: linear-gradient(0deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.75) 100%); transition: all ease 0.5s; z-index: 1;}
.facility-img a:hover img{transform: scale(1.1);}

#product-page{ margin: 0px 0px 0px 0px; padding: 75px 0px; position: relative;}
#product-page::before{content: '';display: block;position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: url(../img/welcome-bg.jpg) no-repeat;background-size: cover;opacity: .17;z-index: -1;border-radius: 15px;mix-blend-mode: multiply;}
.product-content{ padding: 0px 50px 0px 0px;}
.product-img{ margin: 0px 0px 0px 0px; padding: 0px 0px 0px 70px; position: relative;}
.product-img::before{content: '';display: block;position: absolute;left: 0px;bottom: 0;background: url(../sub-images/clean-bottle.png) no-repeat;width: 160px;height: 310px;background-size: contain;filter: drop-shadow(5px -5px 0px white);}
#product-page .product-img img{ max-height:inherit;}


#product-step2{ padding: 75px 0px; margin: 0px 0px; position: relative;}
.step2-data{ padding: 0px 0px 0px 50px;}
.product-specification{ padding: 75px 0px; margin: 0px 0px 0px 0px; position: relative;}
.product-specification h2::before{ left: 0; right: 0; margin: auto;}
.specification-table{ padding: 20px; border: 1px solid #ededed;}
.specification-table tr:nth-child(even){ background: #f5f5f5;}
.specification-table th{padding: 10px 15px;font-size: 16px;color: #ffffff;font-weight: 600;background: #0063ae; text-transform: uppercase;}
.specification-table td{padding: 10px 15px;font-size: 16px;color: #444;font-weight: 500;}

#other-product{ margin: 0px 0px 0px 0px; padding: 75px 0px; position: relative;}
#other-product::before{ content: ''; display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: var(--blue); z-index: -1;}
#other-product::after{content: '';display: block;position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: url(../img/welcome-bg.jpg) no-repeat;background-size: cover;opacity: .17;z-index: -1;border-radius: 15px;mix-blend-mode: multiply;}
.other-info{ max-width: 1170px; margin: 0px 0px 50px 0px; position: relative;}
.other-info h2{ color: #fff;}
.other-info p{ color: #ffffffb0;}
.other-product-slider { position: relative; margin: 0px 0px; padding: 0px 0px;}
.other-slider{ margin: 0px 0px; padding: 0px 0px; position: relative;}
.other-slider .item{ margin: 0px 0px; padding: 0px 0px; position: relative; overflow: hidden;}
.other-slider .item::before{ content: ''; display: block; position: absolute; top: 0; left: 0; width: 100%; height: 50%; background: linear-gradient(0deg,rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.75) 100%); transition: all ease 0.5s; z-index: 1;}
.other-slider .item a{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 5;}
.pro-slider-img{ margin: 0px 0px 0px 0px; padding: 0px 0px; position: relative; overflow: hidden;}
.pro-slider-img h3{position: absolute;top: 30px;left: 30px;z-index: 1;color: #fff;font-size: 19px;}
.pro-slider-img img{ transition: all ease 1s;}
.other-slider .item:hover .pro-slider-img img{ transform: scale(1.1);}

#application-part{ padding: 75px 0px; margin: 0px 0px; position: relative;}

.app-info{ margin: 50px 0px 0px 0px; display: block; position: relative;}
.application-data{padding: 50px 50px;margin: 0px 0px 30px 0px;position: relative;height: 100%;border:1px solid #dfdfdf;}
.application-data span{margin: 0px 0px 25px 0px;display: block;font-weight: 600;}
.application-data h3{ font-size: 26px; color: #444; font-weight: 600; margin: 0px 0px 20px 0px;}

#sustainability-page{ padding: 75px 0px; margin: 0px 0px; position: relative; z-index: 1;}
.sustainable-points{ margin: 0px 0px 0px 0px; padding: 75px 0px 80px 0px; position: relative; background: var(--blue); z-index: 1; }
.sustainable-left{ padding: 0px 50px 0px 0px; margin: 0px 0px 0px 0px; position: relative;}

.sustainable-data-info{ margin: 0px 0px; padding: 0px 0px; position: relative;}
.sustainable-content{ margin: 0px 0px 35px 0px; padding: 30px 0px; position: relative; border-bottom:1px solid #ffffff30;}
.sustainable-content:last-child{ border: none; margin: 0px 0px;}
.sustainable-content span{max-width: 80px;margin: 10px 0px 10px 0px;position: relative;display: block;}
.sustainable-content span img{filter: invert(1) brightness(1);}
.sustainable-title{ position: relative; max-width: 1150px;}
.white-text{ font-size: 25px; color: #fff; font-weight: 600; line-height: 1.3;}
.recycle-data{margin: 0px 0px 0px 0px;padding: 10px 0px;}
.recycle-data h3{font-size: 22px;color: #ffffff;font-weight: 600;}
.recycle-data p{ color: #ffffffbd;}


#solutions-top{ padding: 75px 0px; margin: 0px 0px; position: relative;}
.solution-inner{ max-width: 950px; margin: 0 auto; text-align: center;}
.solution-inner h2::before{ left: 0; right: 0; margin: auto;}

#solution-bottom{ background: var(--blue); padding: 75px 0px 0px 0px; margin: 0px 0px; position: relative;}
.bottom-step{max-width: 1000px; text-align: center; margin: 0px auto 0px auto; padding: 0px 0px; position: relative;}
.bottom-step h2{ color: #fff;}
.bottom-step h2::before{ left: 0; right: 0; margin: auto;}
.bottom-step p{ color: #fff; margin: 0px 0px 0px 0px;}

#export-page{ padding: 75px 0px; margin: 0px 0px; position: relative;}
.export-data{ text-align: center; margin: 0px auto 100px auto; position: relative;}
.export-data h2::before{ left: 0; right: 0; margin: auto;}
.animated_taglines{ margin: 0px 0px 0px 0px; padding: 0px 0px; position: relative;}
.animated_taglines p.blue-text{ font-size: clamp(1.5rem, 2vw + 1rem, 2rem);color: #006FC0;font-weight: 600;white-space: pre-line;line-height: 1.3;}

.map-content{overflow: auto; margin: 0px 0px; padding: 0px 0px;}

.export-map{ margin: 0 auto 75px auto; padding: 0px 0px; position: relative; }
.export-map img{ opacity: .35;}
.export-map .map-locations{position: absolute;bottom: 35%;right: 0%;width: 100%;}
.export-map .map-locations li {position: absolute;left: 0;bottom: 0;text-align: center;width: 15px;height: 15px;background: #209300;border-radius: 50%;transition: 0.5s all;cursor: pointer;list-style: none; }
.export-map .map-locations li span {position: absolute;left: -23px;top: -61px;background: #209300;padding: 3px 14px;font-size: 13px;color: #ffffff;font-weight: 500;letter-spacing: 0.2px;z-index: 0;transition: 0.5s all;opacity:0;visibility:hidden;transform: translateY(5px);}
.export-map .map-locations li span:before {content: ''; position: absolute; left: 50%; transform: translateX(-50%) rotate(45deg); bottom: -5px; border-top: 6px solid transparent; border-right: 6px solid #209300; border-left: 6px solid transparent; border-bottom: 6px solid #209300; }
.export-map .map-locations li span:after {content: ''; position: absolute; left: 50%; transform: translateX(-50%); top: 0; width: 1px; height: 75px; background: #209300; z-index: -1; }
.export-map .map-locations li:hover span {opacity: 1;visibility: visible;transform: translateY(0);}
.export-map .map-locations li.india {bottom: 58px;left: 67.5%;right: 0;width: 25px;height: 25px;background: #209300;}
.export-map .map-locations li.india span {left: -18px; }
.export-map .map-locations li.usa {left: 18%;width: 35px;height: 35px;bottom: 140px;}
.export-map .map-locations li.usa span {left: -10px; top: -60px; }
.export-map .map-locations li.uae { left: 62%; bottom: 60px;}
.export-map .map-locations li.uae span {left: -20px; top: -60px;}
.export-map .map-locations li.south-africa { left: 53%; bottom: -110px;}
.export-map .map-locations li.south-africa span{left: -25px; top: -60px;}
.export-map .map-locations li.europe { left: 50%; bottom: 180px;}
.export-map .map-locations li.europe span{left: -28px; top: -60px;}
.export-map .map-locations li.canada {left: 8%; bottom: 255px;}
.export-map .map-locations li.canada span{left: -30px; top: -60px;}


.export-bottom{ margin: 0px 0px 0px 0px; padding: 0px 0px; position: relative; text-align: center;}


#career-page{ padding: 75px 0px 30px 0px; margin: 0px 0px 0px 0px; position: relative;}
#career-page h2::before{ left: 0; right:0; margin: auto;}
.career-data{ max-width: 1100px; margin: 0px auto 0px auto; text-align: center;}
.career-data h3{ margin: 0px 0px 30px 0px;}

.job-section{padding: 75px 0px;background: #ffffff;margin: 0px 0px;position: relative;z-index: 1;}
.job-section::before{ content: '';display: block;position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: url(../img/welcome-bg.jpg) no-repeat;background-size: cover;opacity: .17;z-index: -1;border-radius: 15px;mix-blend-mode: multiply;}
.job-openings{ max-width: 1300px; margin: 0px auto 0px auto; padding: 0px 0px; position: relative;}
.job-openings h2{ font-size:38px; font-weight: 600; color: #444; text-align: center; margin: 0px 0px 30px 0px;}

.openings{position: relative;margin: 0px 0px;padding: 25px 25px 50px 25px;background: #fff;border: 1px solid #e7e7e7;}
.openings a{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 11;}
.openings::after{content: 'Apply Now';display: block;position: absolute;bottom: 25px;font-size: 14px;color: #209300;font-weight: 600;text-transform: uppercase;}
.openings h4{font-size: 22px;color: #444;font-weight: 600;margin: 0px 0px 5px 0px;display: flex;flex-wrap: wrap;justify-content: space-between;align-items: center;}
.openings h4 span{font-size: 12px;color: #fff;padding: 6px 8px;background: #209300;border-radius: 5px;font-weight: 500;}
.openings h6{font-size: 16px;color: #444;font-weight: 400;margin: 0px 0px 20px 0px;}
.openings p{font-size: 17px;color: #444;line-height: 1.4;}

#career-inquiry{ padding: 75px 0px; margin: 0px 0px 0px 0px; position: relative;}
.career-form-section{ max-width: 1300px; margin: 0px auto; padding: 0px 0px; position: relative;}
.career-form-section h2{ font-size: 38px; color: #444; text-align: center; margin: 0px 0px 20px 0px;}

.career-form-section .form-group{ margin: 0px 0px 30px 0px; padding: 0px 0px; position: relative;}
.career-form-section .form-group label{display: block; font-size: 15px; color: #555; font-weight: 500; margin: 0px 0px 5px 20px;}
.career-form-section .form-group input{font-size: 15px;color: #444;width: 100%;padding: 15px 20px;background: #fff;border: 1px solid #ccc;border-radius: 10px !important}
.career-form-section .form-group textarea{ width: 100%; height: 150px; margin: 0px 0px; padding: 15px 20px; background: #eaeef538; position: relative; border: 1px solid #ccc;  outline: none; resize: none; border-radius: 10px !important}
.career-form-section .form-group .submit { display: inline-block; background: #e75d21; color: #fff; font-size: 15px; padding: 13px 50px; border: none; border-radius: 10px;}
.career-form-section .form-group textarea{width: 100%;height: 115px;margin: 0px 0px;padding: 15px 20px;background: #fff;position: relative;border: 1px solid #ccc;outline: none;resize: none;border-radius: 10px !important}
.career-form-section .form-group input::placeholder, .career-form-section .form-group textarea::placeholder{ font-size: 15px; color: #999; }
.career-form-section .form-group .file-drop-area {margin-top: 15px;padding:10px 15px;width: 100%;height: 127px;border: 1px dashed #adadad;border-radius: 10px;position: relative;display: flex;flex-direction: column;justify-content: center;align-items: center;transition: 0.2s;}
.career-form-section .form-group .file-drop-area.is-active {background: rgb(245 123 41 / 5%); }
.career-form-section .form-group .file-drop-area .fake-btn {margin: 0 0 10px 0;padding: 8px 25px;background: var(--green);border-radius: 26px;font-size: 12px;color: #fff;letter-spacing: 1.5px;text-transform: uppercase;flex-shrink: 0;}
.career-form-section .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-section .form-group .file-drop-area .file-input {position: absolute; top: 0; left: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; }
.career-form-section .form-group .file-drop-area .file-input:focus {outline: none; }
.career-form-section .form-group .submit{display: block;font-size: 17px;text-transform: uppercase;color: #fff;background: var(--green);margin: 0px auto 0px auto;padding: 15px 70px;position: relative;text-align: center;min-width: 335px;}

#blog-page{ margin: 0px 0px; padding: 75px 0px; position: relative;}
.blog-content{ margin: 0px 0px; padding: 0px 0px; position: relative;}
.blog-info{margin: 0px 0px 0px 0px;padding: 0px 0px;position: relative;border: 1px solid #e7e7e7;}
.blog-data{padding: 0px 20px 20px 20px;margin: 0px 0px;position: relative;}
.blog-date{margin: 0px 0px 20px 0px;padding: 0px 0px 0px 0px;border-bottom: 1px solid #e7e7e7;position: relative;}
.blog-date li{font-size: 15px;color: #444;font-weight: 500;list-style: none;display: inline-block;margin: 0px 0px 0px 0px;padding: 13px 20px 13px 0px;}
.blog-text { margin: 0px 0px 0px 0px; padding: 0px 0px; position: relative;}
.blog-text h3{font-size: 20px;font-weight: 600;color: var(--blue);margin: 0px 0px 15px 0px;line-height: 1.5;}
.blog-text p{font-size: 16px;margin: 0px 0px 20px 0px;}

.blog-details-page{ margin: 0px 0px 0px 0px; padding: 0px 0px; position: relative;}
.blog-inner-data{ margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; position: relative;}
.date-section{ display: flex; justify-content: space-between; padding: 0px 0px 15px 0px; margin: 15px 0px 35px 0px; position: relative; border-bottom: 1px solid #ccc;}
.inner-date{ margin: 0px 0px; padding: 0px 0px; position: relative;}
.inner-date li{ list-style: none; display: inline-block; padding: 0px 20px 0px 0px;}
.inner-date li a{ font-size: 15px; color: #444; font-weight: 500;}

.share-option{ margin: 0px 0px; padding: 0px 0px; position: relative;}
.share-option li{ list-style: none; display: inline-block; padding: 0px 5px 0px 0px;}
.share-option li:first-child{ padding-right: 10px;}
.share-option li a{ font-size: 15px; color: #444; font-weight: 500;}
.share-option li img {max-height: 17px; opacity: .5;}

.blog-inner-details{ margin: 0px 0px 0px 0px; padding: 0px 0px; position: relative;}
.blog-inner-details h3{font-size:clamp(1.5rem, 2vw + 1rem, 2rem);font-weight: 600;color: var(--blue);margin: 0px 0px 15px 0px;line-height: 1.5;}
.blog-inner-details h4{font-size: 20px;font-weight: 600;color: var(--blue);margin: 0px 0px 15px 0px;line-height: 1.5;}
.blog-points{ margin: 0px 0px 30px 0px; padding: 0px 0px; position: relative;}
.blog-points li{ padding: 8px 20px; margin: 0px 0px 5px 0px; font-size: 16px; color: #444; position: relative; background: #f9f9f9; list-style: none;}
.blog-points li::before{ content: ''; display: block; position: absolute; left: 0; top: 0; bottom: 0; margin: auto; width: 3px; height: 20px; background: var(--blue);}

.blog-right{padding: 35px;border: 1px solid #e1e1e1;position: sticky;top:85px;}
.blog-right h2{font-size: clamp(1.5rem, 2vw + 1rem, 1.6rem);font-weight: 600;color: var(--blue);margin: 0px 0px 20px 0px;padding: 0px 0px 15px 0px;border-bottom: 1px solid #dbdbdb;}
.blog-links{ margin: 0px 0px 50px 0px; padding: 0px 0px; position: relative;}
.blog-links li{ padding: 0px 20px; margin: 0px 0px 25px 0px; list-style: none; position: relative;}
.blog-links li::before{content: '';display: block;position: absolute;left: 0;top: 8px;width: 7px;height: 7px;background: #006fba;border-radius: 30px; transition: all ease 0.5s;}
.blog-links li a{color: #444;font-size: 16px;font-weight: 500;}
.blog-links li a span{ font-size: 14px; color: #444; font-weight: 400; display: block; margin: 10px 0px 0px 0px;}
.blog-links li:hover::before{ background: #209300;}

.categories-list{ margin: 0px 0px; padding: 0px 0px; position: relative;}
.categories-list li{display: inline-block;margin: 0px 2px 5px 0px;}
.categories-list li a{padding: 5px 15px;border: 1px solid #e5e5e5;display: block;font-size: 15px;color: #898989;font-weight: 500;}
 
#contact-page{ padding: 75px 0px; margin: 0px 0px 0px 0px; position: relative;}
.contact-info { margin: 0px 0px 50px 0px; padding: 0px 50px 0px 0px; position: sticky; top: 100px;}
.contact-info p{ font-size: 16px; color: #444; line-height: 1.6;}
.contact-info p.blue-text{font-size: clamp(1.5rem, 2vw + 1rem, 2.5rem);color: #006FC0;font-weight: 600;white-space: pre-line;line-height: 1.3;}
.contact-address{margin: 30px 0px 15px 0px;padding: 35px 25px 35px 100px;border: 1px solid #e3e3e3;border-radius: 15px;}
.contact-address h3{font-size: 20px;font-weight: 600;color: #444;margin: 0px 0px 10px 0px;}
.contact-address p{ font-size: 16px; margin: 0px 0px 0px 0px;}
.contact-address span { max-width: 55px; position: absolute; left: 30px; object-fit: contain;}
.contact-address span img{ max-width: 100%;}
.connect{ margin: 0px 0px 0px 0px; padding: 0px 0px; position: relative;}
.connect li{ list-style: none; position: relative; margin: 0px 0px 7px 0px;}
.connect li a{ color: #444; font-size: 16px;}

.contact-form{padding:50px 50px;margin: 0px 0px 0px 0px;background: #006fba;position: relative;z-index: 1;border-radius: 15px;}
.contact-form::before{content: '';display: block;position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: url(../img/welcome-bg.jpg) no-repeat;background-size: cover;opacity: .17;z-index: -1;border-radius: 15px;mix-blend-mode: multiply;}
.contact-form h2{font-size: clamp(1.5rem, 2vw + 1rem, 2.5rem);font-weight: 600;margin: 0px 0px 25px 0px;color: #fff;}
.contact-form .form-group{margin: 0px 0px 25px 0px;padding: 0px 0px;position: relative;}
.contact-form .form-group input{width: 100%;padding: 10px 20px;height: 55px;font-size: 16px;background: #ffffff;border:none;border-radius: 10px;transition: all ease 0.5s;} 
.contact-form .form-group textarea{width: 100%;padding: 10px 20px;height: 185px;font-size: 16px;background: #ffffff;border:none;border-radius: 10px;transition: all ease 0.5s; resize: none;} 
.contact-form .form-group input::placeholder, .contact-form .form-group textarea::placeholder{ font-size: 15px; color: #444; font-weight: 500;}
.submit{ display: inline-block; background: transparent; border: 2px solid #fff; color: #fff; padding: 15px 50px; border-radius: 10px;}

#sustainable-packaging.innerpage-package{ margin: -190px 0px 0px 0px; padding: 0px 0px 0px 0px; position: relative;}

:root {
    --theme_orange: #ffffff;
    --theme_green: #75b843;
    --theme_elgreen: #f5fff1;
    --theme_dgreen: #2a4715;
    --text_color: #6E6E6E
}


#animateHomeSection .steps-wrapper, #tech-introduction .pos-rel, .blog-page-header, .branding-slider .swiper-slide, .menu-item.menu-item-has-children, .pos-rel, .product-application-grid .grid-content, .rc-process-wrap, .safeguarding-wrap, .timeline-slider .swiper-slide{
    position: relative; z-index: 11;
}
#animateHomeSection {padding-top: 100px; padding-bottom: 120px; display: block; position: relative; background-color: var(--blue); overflow-y: hidden}
#animateHomeSection .steps-wrapper .line-wrapper { position: absolute; top: 149px; left: -3%; height: 312px}
@media screen and (min-width: 1400px) {
#animateHomeSection .steps-wrapper .line-wrapper { top:140px; left: 7%}
}
#animateHomeSection .steps-wrapper .step .icon-wrapper span.icon svg * { -webkit-transition: 350ms; -moz-transition: 350ms; -o-transition: 350ms; transition: 350ms; fill: #ffffff30}
ul.footer-soc li,ul.footer-soc li a {transition: .3s ease-in-out}
#animateHomeSection .steps-wrapper .step .icon-wrapper span.icon svg.inactive * { fill: #ffffff30}
#animateHomeSection .steps-wrapper .step .icon-wrapper span.icon svg.active * { fill: var(--theme_orange)!important}
#animateHomeSection .steps-wrapper .step .icon-wrapper span.icon svg { height: 72px; width: auto;max-width: 100px}
#animateHomeSection .line-wrapper .line-desktop .icon-active { position: relative; top: -305px}
#animateHomeSection .line-wrapper .line-desktop .icon-active svg { display: block; stroke-dasharray: 2653px; stroke-dashoffset: 2653px}
#animateHomeSection .line-wrapper .line-mobile,#animateHomeSection .line-wrapper .line-tablet,#office-images,#product-application .mason-mobile-wrap,#sus_grid .sus-slider-mobile,.mng-wrap .mng-img .linkd,.rc-road-wrap-mobile,.show-on-mobile-only { display: none}
#animateHomeSection .steps-wrapper .step { padding: 0 40px; width: 25%!important; float: left; text-align: center}
#animateHomeSection .steps-wrapper .flex-row-reverse { margin-top: 60px; display: flex; flex-direction: row-reverse}
#animateHomeSection .steps-wrapper .step .icon-wrapper { position: relative; display: inline-block; vertical-align: middle; font-size: 0}
#animateHomeSection .steps-wrapper .step .icon-wrapper span.icon { display: block; height: 120px; margin-bottom: 30px; margin-top: 30px; position: relative; text-align: center}
#animateHomeSection .steps-wrapper .step .icon-wrapper p { font-size: 16px; color: #fff; margin: 0 0 0 -5px}
@media screen and (min-width: 991px) and (max-width:1366px) { #animateHomeSection { padding-top:60px }
 #animateHomeSection .steps-wrapper .step .icon-wrapper span.icon { height: 110px; margin-top: 65px; margin-bottom: 10px }
 #animateHomeSection .steps-wrapper .step .icon-wrapper span.icon svg { height: 60px }
 #animateHomeSection .line-wrapper .line-desktop svg { max-width: 100% }
 #animateHomeSection .steps-wrapper .line-wrapper { top: 140px; left: 0 }
 #animateHomeSection .steps-wrapper .flex-row-reverse { margin-top: 40px }
 #animateHomeSection .steps-wrapper .step .icon-wrapper p { font-size: 16px }
}