.z-2 {
    z-index: 2
}

.h-auto {
    height: auto;
}

/* 
.w-full {
    width: 100%
}

.col-span-2 {
    grid-column: span 2/span 2;
} */

.text-gray {
    color: gray;
}

.flex {
    display: flex;
}

.flex-col {
    flex-direction: column;
}

.flex-row {
    flex-direction: row;
}

.item {
    padding: 10px;
}

.items-center {
    align-items: center
}

.justify-end {
    justify-content: flex-end;
}

.relative {
    position: relative
}

.absolute {
    position: absolute;
}

.fill-current {
    fill: black;
}

.rounded-default {
    border-radius: 0.75rem;
}

.orange-icon {
    filter: invert(31%) sepia(95%) saturate(2288%) hue-rotate(-1deg) brightness(96%) contrast(100%);
}

.blue-icon {
    filter: invert(15%) sepia(93%) saturate(4827%) hue-rotate(228deg) brightness(84%) contrast(107%);
}

.article-hover {
    position: relative;
    display: block;
    width: 100%;
    height: auto;
}

.article-hover::before {
    content: "";
    position: absolute;
    bottom: -100%;
    right: -100%;
    width: 100%;
    height: 100%;
    background-color: rgba(153, 153, 153, 0.3);
    transition: bottom 0.5s ease, right 0.5s ease;
    z-index: 1; /* Ensure it overlays the image */
}

.article-hover:hover::before {
    bottom: 0;
    right: 0;
}

.site-grid {
    grid-column-gap: 0.7rem; 
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
}

.exhibition-section {
    padding:0px 0px;
    padding-top:120px;
}

@media screen and (min-width: 650px) {
    .site-grid {
        grid-column-gap: 4.5rem;
        grid-template-columns: repeat(12,minmax(0,1fr));
        padding: 3rem 0;
    }
}


/* navigation bar start */
@media screen and (max-width: 991px){
    /*---------------------------------------
    Navigation bar        
    -----------------------------------------*/
    .header-style1 .navbar-toggler{ background: transparent;  }
    .header-style1 .navbar-toggler:after{ border-top: 2px solid white; border-bottom: 2px solid white; }
    .header-style1 .navbar-toggler:before{ background: white; }
    .header-style1 .navbar-toggler.menu-opened:after{  background: white; border-bottom: none;  }
    .header-style1 .navbar-toggler.menu-opened:before{ background: white; }

    #nav li a { color: white; }

    .navbar-nav { background: #000000f5; }
    /*.navbar-nav li{ border-top: 1px solid #e6e6e6; }*/
    .navbar .sub-title { color: white; }

    .navbar-nav .submenu-button:after{ background: white; }
    .navbar-nav .submenu-button:before{ background: white; }

    .navbar-nav .has-sub ul { background: transparent; }
}
/* navigation bar end */


/* changing solution start */
.flexible_solution_for article {
    z-index: 1;
    border-bottom: 1px solid #dfe6ea;
    /* border-top: 1px solid #dfe6ea; */
    padding: 3rem 0;
    /* margin: 10px 10px; */
}

.flexible_solution_for article h2 {
    font-family: 'Montserrat-Regular';
    font-size: 50px;
    grid-column: span 10 / span 10;
}

.flexible_solution_for article .item__numb {
    font-family: 'Montserrat-Regular';
    font-size: 50px;
}

@media (hover:hover) and (pointer:fine) {
    .item:before {
        background-color: #fff555;
        /* background-color:#ee3432; */
        content: "";
        height: 100%;
        left: 0;
        position: absolute;
        top: 0;
        transform: scaleY(0);
        transform-origin: bottom;
        transition: transform .75s cubic-bezier(.19, 1, .22, 1);
        width: 100%;
        z-index: -1
    }

    .item:hover:before {
        transform: scaleY(1);
    }

    .item__numb {
        transition: transform .75s cubic-bezier(.19, 1, .22, 1);
    }

    .item:hover .item__numb {
        transform: translateX(1rem);
    }

    .item__icon {
        transition: transform .75s cubic-bezier(.19, 1, .22, 1);
        width: 50px;
    }

    .item:hover .item__icon {
        transform: translateX(-1rem);
    }
}

@media (hover:hover) and (pointer:fine) {
    .mask-icon {
        transition: transform .75s cubic-bezier(.19, 1, .22, 1);
    }

    .mask-icon:first-child {
        transition-delay: .1s;
    }

    .mask-icon-trig:hover .mask-icon:first-child {
        transform: translateX(100%);
        transition-delay: 0s;
    }

    .mask-icon:last-child {
        transform: translateX(-100%);
        transition-delay: 0s;
    }

    .mask-icon-trig:hover .mask-icon:last-child {
        transform: translateX(0);
        transition-delay: .1s;
    }
}
/* changing solution end */


/* Curious about the benefits of
working with Energy Park? start */
.whitespace-pre-line {
    white-space: pre-line;
}

.items-start {
    align-items: flex-start;
}

.inline-flex {
    display: inline-flex;
}

.button-selection {
    background-color: transparent!important;
    border: none!important;
}

.bg-black {
    --tw-bg-opacity: 1;
    background-color: #000;
    background-color: rgba(0, 0, 0, var(--tw-bg-opacity));
}

.bg-gray-4 {
    --tw-bg-opacity: 1;
    background-color: #acb3b7;
    background-color: rgba(172, 179, 183, var(--tw-bg-opacity));
}
/* 
.duration-500 {
    transition-duration: .5s;
}

.transition-colors {
    transition-duration: .15s;
    transition-property: background-color, border-color, color, fill, stroke;
    transition-timing-function: cubic-bezier(.23, 1, .32, 1);
} */

.item__line {
    transform: scaleX(0);
    transform-origin: right;
    transition: transform 1s cubic-bezier(.19, 1, .22, 1);
}

.item:hover .item__line {
    transform: scaleX(1);
    transform-origin: left;
}

.item__progress {
    transform-origin: right;
}

.is-loop .item.is-active .item__progress {
    animation: progress-color 5s linear forwards;
    transform-origin: left;
}

@keyframes progress-color {
    0% { transform: scaleX(0); }
    to { transform: scaleX(1); }
}
/*  Curious about the benefits of
working with Energy Park? end */


/* parallax slider 1, 2 in home page start */
figure { margin: 0; }
.items-center { align-items: center; }
.justify-center { justify-content: center; }
.fancybox__container { z-index: 99999 !important; }

.image-box {
    /* aspect-ratio: 21/9; */
    width: 65%;
}

.bottom-left {
    position: absolute;
    bottom: 16px;
    left: 16px;
    width: 160px;
    height: 60px;
    background: white;
}

@media screen and (max-width: 1199px) {
    .bottom-left {
        width: 120px;
        height: 50px;
    }
}
/* parallax slider 1, 2 in home page end */


/* service in home page start */
.owl-prev {
    width: 26px;
    height: 80px;
    position: absolute;
    top: 40%;
    margin-left: -25px !important;
    display: block !important;
    border:0px solid black;
}

.owl-next {
    width: 26px;
    height: 80px;
    position: absolute;
    top: 40%;
    right: -28px;
    display: block !important;
    border:0px solid black;
}
.owl-prev i, .owl-next i { transform : scale(1,5); color: #6d6d6d; }
.owl-theme .owl-nav [class*='owl-']:hover { background: none; }

@media screen and (max-width: 575px) {
    .owl-prev { display: none !important; }
    .owl-next { display: none !important; }
}
/* service in home page end */


/* contact partner start */
.columns-3 {
    width: 100%;
    height: 100%;
    display:flex;
    flex-wrap: wrap;
    align-items: center;

}
/* columns */
.columns-3 > * {
    width: calc(100% / 3);
    height: 160px;
    display: flex;
    align-items: center;
}

.columns-3 > article > figure {
    padding: 30px;
}

.partners-div {
    animation: fade 2s linear;
}

.partner figure {
    opacity: .25;
    transition: opacity .35s ease-out;
}

/* .partner figure img {
    object-fit: contain;
    object-position: center;
    max-height: 180px;
} */

.media-contain img {
    height: 100%;
    width: 100%;
    /* left: 0; */
    -o-object-fit: contain;
    object-fit: contain;
    /* top: 0; */
}

.contact-partner {
    padding: 70px 0 20px;
}

@keyframes fade {
    0% { opacity: 0 }
    50%,100% { opacity: 1 }
}

@media screen and (max-width: 991px) {
    .columns-3 > * {
        height: 120px;
    }

    .columns-3 > article > figure {
        padding: 20px;
    }

    .contact-partner {
        padding: 50px 0 20px;
    }

    /* .partner figure img {
        max-height: 120px;
    } */
    
}

@media screen and (max-width: 425px) {
    .columns-3 > * {
        height: 100px;
    }

    .columns-3 > article > figure {
        padding: 10px;
    }
}
/* contact partner end */