* {
    margin: 0;
    padding: 0;
}

body {
    margin: 0;
    padding: 0;
    font-family: "Epilogue", sans-serif;
    color: #5B6770;
}

ul {
    margin: 0;
    padding: 0;
}

ul li {
    margin: 0;
    padding: 0;
    list-style-type: none;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    margin: 0;
    padding: 0;
}

p {
    margin: 0;
    padding: 0;
}

a {
    text-decoration: none;
}

.w-14 {
    width: 14%;
}

.w-26 {
    width: 26%;
}

.w-32 {
    width: 32%;
}

.w-34 {
    width: 34%;
}

.w-38 {
    width: 38%;
}

.w-40 {
    width: 40%;
}

.w-42 {
    width: 42%;
}

.w-44 {
    width: 44%;
}

.w-47 {
    width: 47%;
}

.w-60 {
    width: 60%;
}

.w-70 {
    width: 70%;
}

.w-80 {
    width: 80%;
}

.w-90 {
    width: 90%;
}

.padding-10 {
    padding: 10px;
}

.spacing-top-10 {
    padding-top: 10px;
}

.spacing-bottom-10 {
    padding-bottom: 10px;
}

.spacing-top-20 {
    padding-top: 20px;
}

.spacing-bottom-20 {
    padding-bottom: 20px;
}

.spacing-top-30 {
    padding-top: 30px;
}

.spacing-bottom-30 {
    padding-bottom: 30px;
}

.spacing-top-50 {
    padding-top: 50px;
}

.spacing-bottom-50 {
    padding-bottom: 50px;
}

.spacing-top-60 {
    padding-top: 60px;
}

.spacing-bottom-60 {
    padding-bottom: 60px;
}

.spacing-top-40 {
    padding-top: 40px;
}

.spacing-bottom-40 {
    padding-bottom: 40px;
}

.spacing-top-80 {
    padding-top: 80px;
}

.spacing-bottom-80 {
    padding-bottom: 80px;
}

.spacing-top-100 {
    padding-top: 100px;
}

.spacing-bottom-100 {
    padding-bottom: 100px;
}

.spacing-top-110 {
    padding-top: 110px;
}

.spacing-bottom-110 {
    padding-bottom: 110px;
}

.spacing-bottom-130 {
    padding-bottom: 130px;
}

.spacing-top-130 {
    padding-top: 130px;
}

.spacing-left-30 {
    padding-left: 30px;
}

.spacing-right-30 {
    padding-right: 30px;
}

.spacing-left-50 {
    padding-left: 50px;
}

.spacing-right-50 {
    padding-right: 50px;
}

.blue-color {
    color: #008FC6;
}

.fw-600 {
    font-weight: 600;
}

.blue-title-16 {
    color: #008FC6;
    font-weight: 600;
    font-size: 16px;
}

.blue-title-18 {
    color: #008FC6;
    font-weight: 600;
    font-size: 18px;
}

.margin-top-10 {
    margin-top: 10px;
}

.margin-top-20 {
    margin-top: 20px;
}

.margin-top-30 {
    margin-top: 30px;
}

.margin-top-50 {
    margin-top: 50px;
}

.margin-bottom-50 {
    margin-bottom: 50px;
}

.margin-top-80 {
    margin-top: 80px;
}

.margin-bottom-80 {
    margin-bottom: 80px;
}

.blue-title-20 {
    color: #008FC6;
    font-weight: 700;
    font-size: 20px;
}

.blue-title-24 {
    color: #008FC6;
    font-weight: 700;
    font-size: 24px;
}

.blue-title-32 {
    color: #008FC6;
    font-weight: 700;
    font-size: 32px;
}

.blue-title-42 {
    color: #008FC6;
    font-weight: 700;
    font-size: 42px;
}

.white-p {
    color: #fff;
}

.gradient-background {
    background: linear-gradient(150deg, #008FC6 10%, #E2262B 90%);
}

.epilogue-uniquifier {
    font-family: "Epilogue", sans-serif;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
}

.linear-text-gradient {
    font-weight: 900;
    /* max-width: 26%; */
    color: #444;
    font-size: 62px;
    font-family: "Epilogue", sans-serif;
    text-transform: uppercase;
    background-image: linear-gradient(to right, #008FC6, #E2262B);
    color: rgba(0, 0, 0, 0);
    -webkit-background-clip: text;
    background-clip: text;
    position: relative;
    margin-bottom: 30px;
    line-height: 60px;
    margin-top: 10px;
    width: fit-content;
}

.gradient_button_design {
    color: #fff;
    padding: 20px 20px;
    border: none;
    display: flex;
    align-items: center;
    background-image: linear-gradient(to right, #008FC6, #E2262B);
}

.gradient_button_design p {
    font-size: 14px;
    color: #fff;
}

.spacing-top {
    padding-top: 130px;
}

.spacing-bottom {
    padding-bottom: 130px;
}

.navbar-brand img {
    width: 118px;
}

.navbar-nav {
    margin-left: auto;
    margin-right: 0 !important;
}

.navbar-light .navbar-nav .nav-link.active,
.navbar-light .navbar-nav .show>.nav-link {
    color: #00648B;
    font-weight: 600;
    font-size: 14px;
}

.navbar-light .navbar-nav .nav-link {
    color: #5B6770;
    margin: 0 14px;
    font-weight: 600;
    white-space: nowrap;
    font-size: 14px;
}

.banner_section {
    background: url('../images/metafold-banner.jpg') no-repeat center center;
    background-size: cover;
    height: 600px;
    display: flex;
    align-items: end;
    justify-content: center;
}

.sub_banner_section {
    background-size: cover;
    height: 300px;
    display: flex;
    align-items: end;
    justify-content: center;
    background-repeat: no-repeat;
    background-position: center center;
}

.white-text-heading {
    color: #fff;
    font-size: 42px;
    font-weight: 600;
}

.banner-text {
    color: #fff;
    font-size: 62px;
    font-weight: 600;
    display: flex;
    align-items: end;
}

.sub-banner-text {
    color: #fff;
    font-size: 62px;
    font-weight: 600;
    display: flex;
    align-items: end;
    text-transform: uppercase;
}

.footer_section {
    background: #00648B;
}

.footer_section h3 {
    color: #fff;
    font-size: 16px;
    font-weight: 500;
    margin-bottom: 8px;
    font-family: 'Epilogue', sans-serif;
}

.footer_section p {
    color: #fff;
    font-size: 14px;
    line-height: 28px;
    font-family: 'Epilogue', sans-serif;
    font-weight: 300;
}

.footer_section a {
    color: #fff;
    font-size: 14px;
    line-height: 28px;
    font-family: 'Epilogue', sans-serif;
    font-weight: 300;
}

.footer_section ul img {
    width: 24px;
    margin-right: 10px;
}

.footer_section hr {
    color: #fff;
}

.copy_right {
    display: flex;
    justify-content: space-between;
}

.copy_right ul {
    display: flex;
    gap: 20px;
}

.footer-city {
    display: flex;
}

.footer-city ul {
    display: flex;
    margin-top: 40px;
    margin-bottom: 10px;
    margin-left: 10px;
}

.footer-city ul li {
    margin-bottom: 10px;
    font-size: 14px;
    color: #fff;
    /* text stays white */
    font-family: 'Epilogue', sans-serif;
    margin-right: 30px;
    list-style-type: disc;
    text-transform: capitalize;
}

.footer-city ul li::marker {
    color: #E2262B;
    /* bullet color */
}

.footer-icons li {
    margin-top: 12px;
}

.footer-outline-icon li {
    margin-bottom: 10px;
}

.overview-card {
    border: 1px solid #E5E5E5;
    border-radius: 8px;
    padding: 36px;
    height: 100%;
}

.overview-title {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 24px;
}

.overview-title img {
    width: 32px;
}

.overview-title h3 {
    color: #008FC6;
    font-size: 20px;
    font-weight: 600;
}

.border-gradient {
    border: 2px solid;
    border-image-slice: 1;
    border-width: 2px;
}

.border-gradient-purple:hover {
    background: linear-gradient(90deg, #008FC6 0%, #E2262B 100%);
}

.border-gradient-purple:hover h3 {
    color: #fff;
}

.border-gradient-purple:hover p {
    color: #fff;
}

.border-gradient-purple {
    border-image-source: linear-gradient(to left, #E2262B, #008FC6);
}

.business-vertical-gardient {
    background: linear-gradient(90deg, #008FC6 0%, #E2262B 100%);
    padding: 20px;
    width: 86%;
    height: 36%;
    position: relative;
}

.business-vertical-gardient img {
    width: 28px;
    float: right;
    margin-bottom: 20px;
    bottom: 0;
    position: absolute;
    right: 20px;
}

.business-vertical-gardient h3 {
    color: #fff;
    font-size: 24px;
    font-weight: 400;
    text-align: right;
}

.business-vertical-card {
    background-size: cover;
    height: 450px;
    align-items: end;
    display: flex;
    justify-content: end;
}

.iso-img {
    width: 52px;
}

.white-heading {
    font-weight: 800;
    color: #fff;
    font-size: 62px;
    font-family: "Epilogue", sans-serif;
    text-transform: uppercase;
    margin-bottom: 30px;
}

.iit-section {
    background: linear-gradient(150deg, #008FC6 10%, #E2262B 90%);
    padding: 86px 0;
    border-radius: 10px;
}

.iit-section h3 {
    color: #fff;
    font-size: 32px;
    font-weight: 600;
}

.iis-title p {
    color: #fff;
    font-size: 16px;
    font-weight: 300;
    margin-top: 20px;
}

.iis-title p span {
    font-weight: 600;
}

.iis-border {
    border-left: 1px solid #fff;
    border-right: 1px solid #fff;
    padding: 0 20px 0 30px;
    margin-left: -60px;
}


.count {
    font-size: 40px;
    font-weight: bold;
}

.counter-wrapper {
    position: relative;
}

.counter-wrapper:after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
}

.counter-inner {
    position: relative;
    z-index: 2;
}

.count-icon {
    font-size: 48px;
}

.counter-box {
    display: flex;
    align-items: center;
}

.counter-box h3 {
    font-size: 48px;
    font-weight: 800;
    font-family: "Epilogue", sans-serif;
    text-transform: uppercase;
    background-image: linear-gradient(to right, #008FC6, #E2262B);
    color: rgba(0, 0, 0, 0);
    -webkit-background-clip: text;
    background-clip: text;
    position: relative;
}

.counter-box p {
    font-size: 16px;
    font-weight: 400;
    color: #008FC6;
    text-align: left;
    font-weight: 700;
}

.counter-box img {
    width: 65px;
    margin-right: 20px;
}

.metafold-item {
    display: flex;
    align-items: center;
    margin-bottom: 20px;
}

.metafold-item img {
    width: 46px;
}

.metafold-item p {
    font-size: 20px;
    font-weight: 300;
    color: #fff;
    text-align: left;
    margin-left: 20px;
}

.why-metafold {
    position: relative;
}

.why-metafold-img {
    position: absolute;
    bottom: 0;
    width: 400px;
    right: 10%;
}

.why-metafold {
    background: linear-gradient(150deg, #008FC6 10%, #E2262B 90%);
    border-radius: 10px;

}

.why-metafold h3 {
    color: #fff;
    font-size: 32px;
    font-weight: 600;
}

.applied-industries-img {
    background-size: contain;
    height: 162px;
    align-items: end;
    display: flex;
    justify-content: center;
    margin-bottom: 10px;
    object-fit: contain;
}

.applied-industries-img h2 {
    color: #fff;
    font-size: 20px;
    font-weight: 400;
    text-align: center;
    padding: 10px 20px;
}

.applied-industries-section .owl-theme .owl-nav.disabled+.owl-dots {
    display: flex;
    justify-content: center;
}

.home-demo .owl-theme .owl-dots .owl-dot.active span,
.owl-theme .owl-dots .owl-dot:hover span {
    background: linear-gradient(150deg, #00648B 10%, #E2262B 90%);
    border: none;
    float: right;
}

.home-demo .owl-theme .owl-dots .owl-dot span {

    border: 1px solid transparent;
    background: linear-gradient(#fff, #fff) padding-box,
        linear-gradient(to left, #E2262B, #00648B) border-box;
}

.home-demo .owl-theme .owl-dots .owl-dot span:hover {
    width: 10px;
    height: 10px;
    margin: 5px 7px;
    display: block;
    border-radius: 50%;
    border: 1px solid transparent;
    background: linear-gradient(#fff, #fff) padding-box,
        linear-gradient(to left, #E2262B, #00648B) border-box;
}

.owl-theme .owl-dots .owl-dot:hover span {
    width: 10px;
    height: 10px;
    margin: 5px 7px;
    display: block;
    border-radius: 50%;
    border: 1px solid transparent;
    background: linear-gradient(#fff, #fff) padding-box,
        linear-gradient(to left, #E2262B, #00648B) border-box;
}

.process-divs {
    display: flex;
    gap: 40px;
}

.process-item {
    display: flex;
    align-items: center;
}

.process-item img {
    width: 46px;
}

.process-item p {
    font-size: 20px;
    font-weight: 300;
    color: #fff;
    text-align: left;
    margin-left: 10px;
}

.process-item-arrow {
    display: flex;
    align-items: center;
}

.process-item-arrow img {
    width: 24px;
}

.updates-arrows {
    display: flex;
    justify-content: space-between;
    margin-top: 30px;
}

.updates-arrows h3 {
    font-size: 24px;
    font-weight: 400;
    color: #fff;
}

.updates-arrows img {
    width: 28px;
}

.map-list {
    display: flex;
}

.map-list ul {
    display: flex;
}

.map-list ul li .map-gradient-tab {
    border: 2px solid transparent;
    background: linear-gradient(#fff, #fff) padding-box, linear-gradient(to left, #E2262B, #008FC6) border-box;
    padding: 10px 20px;
    font-size: 14px;
    font-weight: 600;
    margin-right: 10px;
    -webkit-backface-visibility: visible;
    transition: opacity .2s ease;
    color: #008FC6;
    display: flex;
    align-items: center;
    text-align: center;
    justify-content: center;
    width: 140px;
}

.map-list ul li .map-gradient-tab p {
    color: #008FC6;
    font-size: 14px;
    font-weight: 500;
}

.map-img img {
    width: 179px;
}

.overview-hover-img {
    width: 32px;
    height: 32px;
    background-image: url(../images/icons/established-legacy.svg);
    background-size: contain;
    background-repeat: no-repeat;
}

.overview-card:hover .overview-hover-img {
    background-image: url(../images/icons/established-legacy-white.svg);
}

.diverse-product-img {
    width: 32px;
    height: 32px;
    background-image: url(../images/icons/diverse-product-portfolio.svg);
    background-size: contain;
    background-repeat: no-repeat;
}

.overview-card:hover .diverse-product-img {
    background-image: url(../images/icons/diverse-product-portfolio-white.svg);
}

.remarkable-facilities-img {
    width: 32px;
    height: 32px;
    background-image: url(../images/icons/diverse-product-portfolio.svg);
    background-size: contain;
    background-repeat: no-repeat;
}

.overview-card:hover .remarkable-facilities-img {
    background-image: url(../images/icons/diverse-product-portfolio-white.svg);
}

.specialized-divisions-img {
    width: 32px;
    height: 32px;
    background-image: url(../images/icons/specialized-divisions.svg);
    background-size: contain;
    background-repeat: no-repeat;
}

.overview-card:hover .specialized-divisions-img {
    background-image: url(../images/icons/specialized-divisions-white.svg);
}

.reliable-partner-img {
    width: 32px;
    height: 32px;
    background-image: url(../images/icons/reliable-partner.svg);
    background-size: contain;
    background-repeat: no-repeat;
}

.overview-card:hover .reliable-partner-img {
    background-image: url(../images/icons/reliable-partner-white.svg);
}

.engineering-iIntegration-img {
    width: 32px;
    height: 32px;
    background-image: url(../images/icons/engineering-iIntegration.svg);
    background-size: contain;
    background-repeat: no-repeat;
}

.overview-card:hover .engineering-iIntegration-img {
    background-image: url(../images/icons/engineering-iIntegration-white.svg);
}

.contact_detail {
    margin-bottom: 30px;
}

.contact_detail img {
    width: 24px;
    margin-right: 10px;
}

.contact_detail a {
    color: #5B6770;
    font-size: 18px;
    line-height: 28px;
    font-family: 'Epilogue', sans-serif;
    font-weight: 600;
}

.contact_detail {
    color: #5B6770;
    font-size: 18px;
    line-height: 28px;
    font-family: 'Epilogue', sans-serif;
    font-weight: 600;
}

.contact-form form {
    width: 400px;
}

.contact-form form label {
    margin-bottom: 4px;
}

.contact-form form input,
.contact-form form textarea {
    width: 100%;
    border: 1px solid #5B6770;
    border-radius: 0;
    font-size: 16px;
    font-family: 'Epilogue', sans-serif;
    color: #5B6770;
    padding: 10px 0;
}

.contact-form .gradient_button_design {
    padding: 12px 18px;
    width: 120px;
    justify-content: center;
}


@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,600);



.button-wrapper {
    position: relative;
}

.button-wrapper span.label {
    background: #ddd;
    cursor: pointer;
    color: #5B6770;
    border: 1px solid #5B6770;
    padding: 10px 18px;
    font-size: 12px;
}

#upload {
    display: inline-block;
    position: absolute;
    z-index: 1;
    width: 100%;
    height: 50px;
    top: 0;
    left: 0;
    opacity: 0;
    cursor: pointer;
}

.career-info h3 {
    font-size: 24px;
    font-weight: 700;
    color: #008FC6;
}

.career-info p {
    font-size: 18px;
    font-weight: 400;
    color: #5B6770;
    line-height: 28px;
    margin-top: 10px;
    margin-bottom: 10px;
}

.career-info p span {
    font-weight: 600;
}

.career-info {
    width: 386px;
}

.contact-form {
    position: relative;
}

.candidate-img {
    position: absolute;
    bottom: 0;
    right: auto;
    left: 36%;
}

.candidate-img img {
    width: 360px;
}

.director-img h3 {
    color: #008FC6;
    font-size: 18px;
    line-height: 20px;
    font-weight: 600;
    margin-top: 20px;
}

.director-img img {
    width: 400px;
}

.director-img p {
    color: #5B6770;
    font-size: 16px;
    line-height: 20px;
    font-weight: 400;
}

.director-content {
    padding: 0 50px;
}

.director-content p {
    color: #5B6770;
    font-size: 16px;
    line-height: 26px;
    font-weight: 400;
    margin-bottom: 20px;
}

.vision-mission-title {
    display: flex;
    align-items: center;
    gap: 10px;
}

.vision-mission-title h2 {
    margin-bottom: 0;
}

.vision-mission-title img {
    width: 60px;
}

.vision-mission-content {
    width: 500px;
}

.vision-mission-content p {
    color: #fff;
    font-size: 16px;
    font-weight: 300;
    margin-top: 20px;
}

.vision-mission-content p span {
    font-weight: 600;
}

.testimonial-section {
    background: linear-gradient(129deg, #017baa 45%, #E2262B 100%);
    padding: 86px;
    position: relative;
}

.testimonial-content {
    width: 700px;
    margin: 0 auto;
    padding-bottom: 20px;
}

.testimonial-content img {
    width: 64px !important;
}

.testimonial-content p {
    font-size: 18px;
    font-weight: 300;
    color: #fff;
    text-align: left;
    margin: 20px 0;
    line-height: 30px;
    font-style: italic;
}

.testimonial-content h3 {
    font-size: 18px;
    font-weight: 600;
    color: #fff;
    margin-bottom: 4px;
}

.testimonial-info p {
    font-size: 16px;
    font-weight: 400;
    color: #fff;
    margin: 0;
    font-style: normal;
}

/* .testimonial-section .owl-theme .owl-dots .owl-dot.active span,
.owl-theme .owl-dots .owl-dot:hover span {
    background: #fff;
} */

.testimonial-section .owl-theme .owl-dots .owl-dot span {
    /* width: 10px;
    height: 10px;
    margin: 5px 7px;
    background: transparent;
    display: block;
    -webkit-backface-visibility: visible;
    transition: opacity .2s ease;
    border-radius: 30px;
    border: 1px solid #fff; */

    width: 10px;
    height: 10px;
    margin: 5px 7px;
    display: block;
    border-radius: 50%;
    border: 1px solid transparent;
    background: linear-gradient(#fff, #fff) padding-box,
        linear-gradient(to left, #E2262B, #00648B) border-box;
}

.core-values-height {
    height: 240px;
}

.core-values-img img {
    height: 510px;
    object-fit: contain;
}

.csr-card {
    padding: 20px;
}

.csr-card h3 {
    color: #008FC6;
    font-size: 18px;
    font-weight: 600;
    margin-top: 10px;
}

.border-gradient-csr {
    border-image-source: linear-gradient(to left, #E2262B, #008FC6);
}

.csr-content p {
    font-size: 16px;
    font-weight: 500;
    color: #5B6770;
    line-height: 26px;
    margin-top: 10px;
}

.csr-content h3 {
    font-size: 24px;
    font-weight: 600;
    color: #008FC6;
}

.culture-card-gradient {
    background: linear-gradient(110deg, #008FC6 0%, #E2262B 100%);
    padding: 20px;
    position: relative;
    height: 160px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.culture-card-gradient h3 {
    color: #fff;
    font-size: 18px;
    font-weight: 400;
    text-align: center;
    margin-top: 20px;
}

.culture-card-gradient img {
    width: 42px;
    margin: 0 auto;
    display: block;
    margin-bottom: 10px;
}

.manufacture_bg_img {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 280px;
}

.events_bg_img {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 230px;
}

.events-card {
    padding: 20px;
    height: 100%;
}

.events-card h3 {
    color: #008FC6;
    font-size: 18px;
    font-weight: 600;
    margin-top: 20px;
}

.blue-heading {
    color: #008FC6;
    font-size: 24px;
    font-weight: 600;
    margin-top: 20px;
}

.breadcrumb_section {
    background-color: #008FC6;
    padding: 4px 0;
}

.breadcrumb_section ul {
    display: flex;
}

.breadcrumb_section ul li {
    list-style-type: none;
    font-size: 16px;
    color: #fff;
    font-weight: 300;
    display: flex;
    align-items: center;
}

.breadcrumb_section ul li a {
    list-style-type: none;
    font-size: 16px;
    color: #fff;
    font-weight: 300;
    display: flex;
    align-items: center;
    text-transform: capitalize;
}

.breadcrumb_section ul li::after {
    content: ">";
    padding: 0 8px;
}

.breadcrumb_section ul li:last-child::after {
    content: none;
    padding: 0;
}

.products-banner h3 {
    font-size: 32px;
    font-weight: 700;
    color: #008FC6;
    text-transform: uppercase;
    font-size: 24px;
    font-weight: 500;
    color: #5B6770;
}

.products-banner .linear-text-gradient {
    margin-bottom: 0;
}

.advantages-section {
    background: linear-gradient(100deg, #008FC6 10%, #E2262B 100%);
    padding: 80px;
    position: relative;
}

.advantages-section ul li {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    margin-bottom: 20px;
}

.advantages-section img {
    width: 32px;
}

.advantages-section p {
    color: #fff;
    font-size: 20px;
    font-weight: 500;
    line-height: 24px;
    margin-top: 6px;
}

.shuttle-racking-advantages p {
    margin-top: 0;
}

.shelving-racking-advantages p {
    margin-top: 0;
}

.shelving-racking-advantages .advantage-img {
    right: 14%;
}

.mobile-racking-advantages .advantage-img {
    right: 12%;
}

.mobile-shelving-advantages .advantage-img {
    right: 8%;
}

.advantage-img {
    position: absolute;
    bottom: 0;
    right: 4%;
}

.multi-tier-advantage-img {
    position: absolute;
    bottom: 0;
    right: 0;
}

.multi-tier-advantage-img img {
    width: 100%;
}

.advantage-img img {
    width: 100%;
}

.applications-section hr {
    margin: 50px 0;
}

#gallery ul {
    columns: 3;
    gap: 10px;
}

#gallery li {
    margin-bottom: 10px;
    list-style: none;
}

.img-wrapper {
    position: relative;
    overflow: hidden;
    cursor: pointer;
}

.img-wrapper img {
    width: 100%;
    display: block;
    transition: transform 0.4s ease;
}

.overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: #008fc68f;
    display: flex;
    justify-content: center;
    align-items: center;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.img-wrapper:hover .overlay {
    opacity: 1;
}

#gallery img {
    width: 100%;
    cursor: pointer;
}

.popup {
    display: none;
    position: fixed;
    z-index: 9999;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.9);
    text-align: center;
}

.popup-content {
    /* display: inline-block;
    max-width: 80%;
    max-height: 80vh;
    position: relative;
    top: 10%; */
      display: inline-block;
  max-width: 80%;
  max-height: 80vh;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.close {
    position: absolute;
    top: 30px;
    right: 50px;
    color: #fff;
    font-size: 40px;
    font-weight: bold;
    cursor: pointer;
}

.close:hover {
    color: #008FC6;
}

.closepop {
    position: absolute;
    top: 30px;
    right: 50px;
    color: #fff;
    font-size: 40px;
    font-weight: bold;
    cursor: pointer;
}

.closepop:hover {
    color: #008FC6;
}

.close-pop {
    position: absolute;
    top: 30px;
    right: 50px;
    color: #fff;
    font-size: 40px;
    font-weight: bold;
    cursor: pointer;
}

.close-pop:hover {
    color: #008FC6;
}

.prev,
.next {
    cursor: pointer;
    position: absolute;
    top: 50%;
    padding: 16px;
    color: white;
    font-weight: bold;
    font-size: 40px;
    user-select: none;
}

/* .prev,
.next:hover {
    color: #008FC6;
} */

.prev {
    left: 20px;
        z-index: 9;
}

.next {
    right: 20px;
        z-index: 9;
}

.zoom-icon {
    width: 50px;
    height: 50px;
    background-image: url("assets/images/icons/zoom-in.svg");
    background-size: 35px;
    background-repeat: no-repeat;
    background-position: center;
    display: inline-block;
}

.combination-rack-info p {
    margin-bottom: 20px;
}

.combination-rack-info img {
    margin-top: 20px;
    width: 100%;
}

.deep-ranking-img {
    position: relative;
}

.golden-border {
    position: absolute;
    left: 46.8%;
    right: auto;
    height: 200px;
    border-left: 1px solid #D6C8AE;
    bottom: 0;
}

/*header*/

.desktop-none {
    display: none;
}

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

.main_header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: relative;
    z-index: 1000;
}

.logo_image img {
    width: 118px;
    object-fit: contain;
}

.logo-link {
    display: inline-flex;
    align-items: center;
    position: relative;
}

.logo-text {
    margin-left: 10px;
    opacity: 0;
    /* hidden by default */
    transition: opacity 0.3s ease-in-out;
    color: #008FC6;
}

.logo-text .since {
    font-weight: 300;
    text-transform: uppercase;
    /* light */
}

.logo-text .year {
    font-weight: 700;
    /* bold */
}

.logo-link:hover .logo-text {
    opacity: 1;
    /* fade in */
}


.navigation_mega ul {
    display: flex;
    align-items: center;
    justify-content: end;
}

.navigation_mega ul li a {

    color: #5B6770;
    font-weight: 400;
    white-space: nowrap;
    font-size: 14px;
    margin: 0 20px;
    padding: 0;
}

.custom-mega-dropdown .mega_dropdown_list li a {
    color: #5B6770;
}

.navigation_mega .gradient_button_design p {
    color: #fff;
}

.navigation_mega .active a {
    color: #008FC6;
}

/*dropdown*/

.dropdown,
.dropend,
.dropstart,
.dropup {
    position: relative;
    height: 100px;
    display: flex;
    align-items: center;
}

.dropdown-menu {
    position: absolute;
    top: 100%;
    left: 0;
    width: 100vw;
    z-index: 999;
}

.custom-mega-dropdown {
    transform: translateX(-59%);
    width: 100%;
    max-width: 1906px;
}

.dropdown-menu {
    position: absolute;
    top: 100%;
    left: 0;
    width: 100vw;
    z-index: 999;
}

.custom-mega-dropdown {
    transform: translateX(-60.5%);
    width: 100%;
    max-width: 1902px;
}

.dropdown-menu {
    z-index: 0;
}


@media only screen and (min-width: 992px) {
    .dropdown:hover .dropdown-menu {
        display: flex;
        background-color: #E6F8FF;
        width: 100vw;
        border-radius: 0;
        padding: 60px 0;
        border: 1px solid transparent;
        background: linear-gradient(#E6F8FF, #E6F8FF) padding-box, linear-gradient(to left, #E2262B, #00648B) border-box;
    }
}

.dropdown-menu {
    position: absolute;
    top: 100%;
    left: 0;
    width: 100vw;
    z-index: 999;
}

.custom-mega-dropdown-panchkarma {
    padding: 0 0 !important;
}

.custom-mega-dropdown-panchkarma {
    width: 100% !important;
}

.mega-sub-heading {
    font-size: 13px;
    font-weight: 700;
    color: #5B6770;
    margin-bottom: 10px;
}

.mega_dropdown_list ul li {
    font-size: 13px;
    font-weight: 500;
}

.custom-mega-dropdown h5 {
    color: #008FC6;
    text-transform: uppercase;
    font-size: 16px;
    font-weight: 600;
}

.mega-border-left-right {
    border-left: 1px solid #D2D2D2;
    border-right: 1px solid #D2D2D2;
}

.download-img img {
    height: 336px;
    object-fit: contain;
}

.download-menu {
    display: flex;
    background-color: #E6F8FF;
    width: 100vw;
    border-radius: 0;
    padding: 60px 0;
}

.download-btn .dropdown-toggle::after {
    content: none;
}

.download-btn .custom-mega-dropdown {
    transform: translateX(-76.3%);
    width: 100%;
    max-width: 1904px;
}

h2 {
    font-weight: 400;
    font-style: normal;
    margin: 0;
    padding: 0;
    color: #023D43;
    font-size: 49px;
}

.mega_dropdown_list {
    display: block !important;
}

.mega_dropdown_list li {
    font-size: 16px;
    margin: 10px 0;
}

ul li {
    margin: 0;
    padding: 0;
    list-style-type: none;
}

.mega_dropdown_list li a {
    margin: 0 !important;
}

a {
    text-decoration: none;
}

p {
    font-weight: 400;
    font-style: normal;
    margin: 0;
    padding: 0;
    color: #5B6770;
}

.consultation-link {
    display: flex;
    align-items: center;
    gap: 10px;
    text-decoration: none;
}

.consultation-img {
    width: 24px;
    height: 24px;
    background-image: url(../images/icons/consultation.svg);
    background-size: contain;
    /* transition: background-image 0.3s 
ease; */
    background-repeat: no-repeat;
}

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

.calendar-link {
    display: flex;
    align-items: center;
    gap: 10px;
    text-decoration: none;
}

.calendar-img {
    width: 24px;
    height: 24px;
    background-image: url(../images/icons/calendar.svg);
    background-size: contain;
    /* transition: background-image 0.3s 
ease; */
    background-repeat: no-repeat;
}

.top_header ul {
    display: flex;
    align-items: center;
    justify-content: end;
}

.gradient-border-img {
    border: 2px solid transparent;
    background: linear-gradient(#fff, #fff) padding-box, linear-gradient(to left, #E2262B, #00648B) border-box;
    font-size: 14px;
    font-weight: 600;
    margin-right: 10px;
    -webkit-backface-visibility: visible;
    transition: opacity .2s ease;
    color: #008FC6;
    display: flex;
    align-items: center;
    text-align: center;
    justify-content: center;
}

.certificate-img {
    box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
    width: 250px;
    object-fit: contain;
}

.certificate-img img {
    width: 250px;
}

.feature-points ul {
    padding-left: 20px;
}

.feature-points ul li {
    list-style-type: disc;
    margin: 10px 0;
}

.feature-title-div {
    justify-content: space-between;
    height: auto !important;
}

.gradient-tab-section .nav {
    justify-content: space-between;
}

.gradient-tab-section .nav-link.active {
    border: 2px solid transparent;
    background: linear-gradient(#fff, #fff) padding-box, linear-gradient(to left, #E2262B, #00648B) border-box;
    padding: 14px 20px;
    font-size: 14px;
    font-weight: 600;
    margin-right: 10px;
    -webkit-backface-visibility: visible;
    transition: opacity .2s ease;
    color: #008FC6;
    display: flex;
    align-items: center;
    text-align: center;
    justify-content: center;
}

.gradient-tab-section .nav-link {
    color: #fff;
    padding: 14px 20px;
    border: none;
    border-radius: 0;
    width: 314px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-image: linear-gradient(to right, #008FC6, #E2262B);
}

.tab-content-image img {
    border: 2px solid transparent;
    background: linear-gradient(#fff, #fff) padding-box, linear-gradient(to left, #E2262B, #00648B) border-box;
    font-size: 14px;
    font-weight: 600;
    margin-right: 10px;
    -webkit-backface-visibility: visible;
    transition: opacity .2s ease;
    color: #008FC6;
    display: flex;
    align-items: center;
    text-align: center;
    justify-content: center;
    padding: 40px 120px;
    width: 550px;
}

.tab-content-image-60 img {
    border: 2px solid transparent;
    background: linear-gradient(#fff, #fff) padding-box, linear-gradient(to left, #E2262B, #00648B) border-box;
    font-size: 14px;
    font-weight: 600;
    margin-right: 10px;
    -webkit-backface-visibility: visible;
    transition: opacity .2s ease;
    color: #008FC6;
    display: flex;
    align-items: center;
    text-align: center;
    justify-content: center;
    padding: 40px 60px;
    width: 550px;
}

.tab-content-storage-box-image img {
    border: 2px solid transparent;
    background: linear-gradient(#fff, #fff) padding-box, linear-gradient(to left, #E2262B, #00648B) border-box;
    font-size: 14px;
    font-weight: 600;
    margin-right: 10px;
    -webkit-backface-visibility: visible;
    transition: opacity .2s ease;
    color: #008FC6;
    display: flex;
    align-items: center;
    text-align: center;
    justify-content: center;
    padding: 88px 60px;
}

.tab-content-trolly-image img {
    border: 2px solid transparent;
    background: linear-gradient(#fff, #fff) padding-box, linear-gradient(to left, #E2262B, #00648B) border-box;
    font-size: 14px;
    font-weight: 600;
    margin-right: 10px;
    -webkit-backface-visibility: visible;
    transition: opacity .2s ease;
    color: #008FC6;
    display: flex;
    align-items: center;
    text-align: center;
    justify-content: center;
}

.tab-content-spring-balancer-image img {
    border: 2px solid transparent;
    background: linear-gradient(#fff, #fff) padding-box, linear-gradient(to left, #E2262B, #00648B) border-box;
    font-size: 14px;
    font-weight: 600;
    margin-right: 10px;
    -webkit-backface-visibility: visible;
    transition: opacity .2s ease;
    color: #008FC6;
    display: flex;
    align-items: center;
    text-align: center;
    justify-content: center;
    padding: 40px 120px;
    width: 450px;
}

.tab-content-hexagonal-image img {
    border: 2px solid transparent;
    background: linear-gradient(#fff, #fff) padding-box, linear-gradient(to left, #E2262B, #00648B) border-box;
    font-size: 14px;
    font-weight: 600;
    margin-right: 10px;
    -webkit-backface-visibility: visible;
    transition: opacity .2s ease;
    color: #008FC6;
    display: flex;
    align-items: center;
    text-align: center;
    justify-content: center;
    width: 450px;
}

.tab-content-list ul {
    padding-left: 14px;
}

.tab-content-list ul li {
    list-style-type: disc;
    margin: 8px 0;
}

.tab-content-list ul li span {
    font-weight: 700;
}

.tab-content table,
td {
    border: 1px solid #008FC6;
    border-collapse: collapse;
    font-size: 13px;
    padding: 12px 14px;
}

.tab-content table th {
    background: #008FC6;
    color: #fff;
    padding: 14px 14px;
    border: 1px solid #008FC6;
    font-size: 13px;
    font-weight: 500;
    text-transform: uppercase;
}

.tab-content table th {
    border-right: 1px solid #fff;
}

.tab-content table th:first-child {
    border-left: 1px solid #008FC6;
    border-right: 1px solid #fff;
}

.tab-content table th:last-child {
    border-right: 1px solid #008FC6;
}


.bullet-flex {
    display: flex;
    gap: 50px;
}

.check-box {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 20px;
}

.check-box label {
    font-size: 11px;
    color: #008FC6;
}

.sky-bg {
    background-color: #E9F9FF;
}

.feature-div-row {
    display: flex;
    gap: 10px;
}

.feature-div-col {
    width: 100%;
}

.feature-div-col div {
    height: 100%;
    display: flex;
    /* align-items: center; */
}

.note span {
    font-weight: 600;
}

.note p {
    color: #5B6770;
}

.mwb-img img {
    height: 250px;
    object-fit: contain;
    margin: 0 auto;
    display: block;
}

.utility-type-img img {
    height: 350px;
    object-fit: contain;
    margin: 0 auto;
    display: block;
}

.gradient-list {
    padding: 0 50px;
}

.gradient-list-item {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 20px;
}

.gradient-list-item img {
    width: 32px;
}

.gradient-list-item p {
    color: #008FC6;
    font-weight: 600;
    font-size: 20px;
}

.gradient-list-item h4 {
    color: #5B6770;
    font-size: 20px;
    font-weight: 500;
}

.normal-font-weight {
    font-weight: 400;
}

.asrs-white-text {
    font-weight: 400 !important;
    font-size: 16px !important;
}

.small-white-text {
    font-weight: 400 !important;
    font-size: 14px !important;
    margin-top: 8px;
}

.auto-store-table table {
    border: 1px solid #008FC6;
}

.auto-store-table table td {
    border-bottom: 1px solid #008FC6;
    border-top: 0;
    border-left: 0;
    border-right: 0;
}

.table-td-right {
    text-align: right;
}

.auto-store-list-section .advantages-section ul li {
    color: #fff;
    margin-bottom: 10px;
    list-style-type: disc;
}

.auto-store-list li {
    list-style-type: disc;
    display: list-item !important;
}

.auto-store-list-section .advantage-img img {
    width: 300px;
}

.wms-gradient {
    position: relative;
}

.wms-gradient-img {
    position: absolute;
    bottom: 0;
    right: 18%;
}

.iis-title-row {
    display: flex;
    align-items: center;
    gap: 20px;
}

.download-btn-pages .dropbtn {
    background-color: #3498DB;
    color: white;
    padding: 16px;
    font-size: 16px;
    border: none;
    cursor: pointer;
}

.download-btn-pages .dropbtn:hover,
.dropbtn:focus {
    background-color: #2980B9;
}

.download-btn-pages .dropdown {
    position: relative;
    display: inline-block;
}

.download-btn-pages .dropdown-content {
    display: none;
    position: absolute;
    background-color: #f1f1f1;
    min-width: 160px;
    overflow: auto;
    box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
    z-index: 1;
}

.download-btn-pages .dropdown-content a {
    color: black;
    padding: 12px 16px;
    text-decoration: none;
    display: block;
}

.download-btn-pages .dropdown a:hover {
    background-color: #ddd;
}

.download-btn-pages .show {
    display: block;
}

.banner_video_section {
    position: relative;
    width: 100%;
    height: 600px;
    /* Fixed height for banner */
    overflow: hidden;
}

.banner-video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    /* makes video cover like background */
    z-index: 1;
}

.banner-overlay {
    position: relative;
    z-index: 2;
    height: 100%;
    display: flex;
    justify-content: left;
    align-items: end;
}

.banner-text {
    color: #fff;
    font-size: 3rem;
    font-weight: bold;
    text-shadow: 2px 2px 8px rgba(0, 0, 0, 0.6);
    position: relative;
    left: 15%;
    bottom: 10%;
}

.warehousing-card {
    background-size: cover;
    height: 380px;
    align-items: end;
    display: flex;
    justify-content: left;
    position: relative;
}

.warehousing-gardient {
    background: linear-gradient(90deg, #008FC6 10%, #E2262B 100%);
    padding: 30px 20px;
    width: 56%;
    height: auto;
    position: absolute;
    bottom: -18%;
}

.warehousing-gardient h3 {
    color: #fff;
    font-size: 20px;
    font-weight: 600;
    text-align: left;
    text-transform: uppercase;
}

.warehousing-gardient ul li {
    display: flex;
    align-items: center;
    gap: 6px;
    margin: 8px 0;
}

.warehousing-gardient p {
    color: #fff;
}

.warehousing-gardient img {
    width: 20px;
}

.automated-storage-card {
    background-size: cover;
    height: 550px;
    align-items: end;
    display: flex;
    justify-content: end;
    position: relative;
}

.automated-storage-card .warehousing-gardient {
    right: -18%;
    height: 360px;
    bottom: 0;
}

.automated-storage-section {
    padding: 100px 0 200px 0;
}

.roll-out-storage-card {
    background-size: cover;
    height: 470px;
    align-items: end;
    display: flex;
    justify-content: end;
    position: relative;
}

.roll-out-storage-card .warehousing-gardient {
    right: -18%;
}

.industrial-storage-system .warehousing-gardient {
    width: 64%;
}

.warehousing-gardient ul li a {
    display: flex;
    align-items: center;
    gap: 6px;
}

.white-heading-42 {
    font-weight: 800;
    color: #fff;
    font-size: 42px;
    font-family: "Epilogue", sans-serif;
    text-transform: uppercase;
    margin-bottom: 30px;
}

.logo-text img {
    width: 55px;
}

/* Modal Background */
.download-section .modal {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.6);
    justify-content: center;
    align-items: center;
}

/* Modal Box */
.download-section .modal-content {
    background: #fff;
    padding: 20px;
    width: 300px;
    border-radius: 8px;
    box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.3);
    text-align: center;
}

.download-section input,
button {
    width: 100%;
    padding: 10px;
    margin: 8px 0;
}

.download-section button {
    background: #007BFF;
    color: #fff;
    border: none;
    cursor: pointer;
}

.download-section button:hover {
    background: #0056b3;
}

.download-img img {
    cursor: pointer;
}


.modal {
    display: none;
    position: fixed;
    z-index: 9999;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.6);
    justify-content: center;
    align-items: center;
}

.modal-content {
    background: #fff;
    padding: 50px;
    max-width: 600px;
    width: 100%;
    border-radius: 10px;
    position: relative;
}

.close-btn {
    position: absolute;
    top: 0;
    right: 15px;
    font-size: 40px;
    cursor: pointer;
}

.close-btn-one {
    position: absolute;
    top: 0;
    right: 15px;
    font-size: 40px;
    cursor: pointer;
}

.close-btn-two {
    position: absolute;
    top: 0;
    right: 15px;
    font-size: 40px;
    cursor: pointer;
}

.close-btn-three {
    position: absolute;
    top: 0;
    right: 15px;
    font-size: 40px;
    cursor: pointer;
}

#appointmentFormElement button,
input,
optgroup,
select,
textarea {
    width: 100%;
    padding: 8px 10px;
}

.download-btn button {
    padding: 14px 18px;
    display: block;
}

.vid_image img{
    width: 42px;
}