.d-flex.two-cols .eal-col,
.d-flex.two-cols--mobile .eal-col {
    width: 50%;
}

.d-flex.two-cols{
    justify-content: space-between!important;
}

#coredesc-gl,
#coredesc-gl2,
#coredesc-gl3,
#coredesc-gl4 {
    display: none;
}

.container.desc {
    background-color: #ffffff;
}

.splide .eal-col {
    background-size: cover;
    height: 100%;
}

.splide .eal-col.heat-free {
    background-image: url('/images/innovative-solutions/hf-bg.jpg');
}

.splide .eal-col.textile {
    background-image: url('/images/innovative-solutions/textile-bg.jpg');
    background-position-x: center;
}

.splide .eal-col.ecotank {
    background-image: url('/images/innovative-solutions/ecotank-bg.jpg');
}

.splide .eal-col.display {
    background-image: url('/images/innovative-solutions/display-bg.jpg');
}

.splide .eal-col .desc-container {
    padding: 30px;
    background-color: rgb(53 53 53 / 70%);
    color: #ffffff;
    height: 100%;
}

.splide .eal-col.ecotank .desc-container {
    background-color: rgb(53 53 53 / 85%);
}

.percentage {
    font-size: 50px;
}

.splide .eal-col .desc-container .d-flex {
    justify-content: center;
}

.splide .eal-col .desc-container .button-container,
.button-container {
    text-align: center;
}

.percentage+.bottom-caption {
    display: inline-block;
}

.image-container {
    margin: auto;
}

#introduction,
section#introduction div {
    color: #000;
    text-shadow: none;
}

.desc .image-container {
    width: 80%;
}

.desc#coredesc-gl2 .image-container,
.desc#coredesc-gl4 .image-container {
    width: 100%;
}

.eal-col .icon {
    width: 20%;
    margin: auto;
    margin-top: 20px;
}

.desc .d-flex .eal-col {
    /* padding: 30px 20px; */
    background-color: white;
    filter: drop-shadow(0px 3px 2px #0000001f);
    width: 100%;
}

.four-cols--desktop,
.three-cols--desktop{
    gap: 30px;
}

.desc .d-flex.no-shadow .eal-col {
    filter: none;
    background-color: transparent;
}

.desc .d-flex.no-shadow .eal-col:first-child {
    margin-bottom: 0;
    padding-bottom: 0;
}

.desc#coredesc-gl4 .d-flex.d-flex.three-cols--desktop .eal-col {
    padding: 0;
    filter: drop-shadow(0px 2px 4px #0000001f);
}

.desc#coredesc-gl4 .d-flex .eal-col .title {
    padding: 20px;
    margin-bottom: 0;
    margin-top: 20px;
    background-color: #0070d3;
    text-align: center;
    color: #ffffff;
}

.desc-container.d-flex {
    flex-direction: column;
    justify-content: center;
}

.blue-no-bg {
    background-color: transparent;
    display: inline-block;
    color: #0c4bbf;
    margin: 0;
    padding: 0;
    transition: all .15s;
    text-decoration: none;
}

.eal-col.ecotank .blue-no-bg,
.eal-col.heat-free .blue-no-bg {
    color: #6a9dfc;
}

.desc#coredesc-gl3 .eal-col .icon {
    width: 35%;
}

.desc#coredesc-gl4 .eal-col .icon {
    width: 70%;
}

.table-title {
    color: #0c4da2;
    margin-top: 20px;
}

#introduction {
    background: #fff;
}

.slide-up .tile-container:hover {
    cursor: default;
}

main .blue-no-bg:hover,
.eal-col.ecotank .blue-no-bg:hover,
.eal-col.heat-free .blue-no-bg:hover {
    text-decoration: underline;
    color: #b7d0ff;
}

main .desc .blue-no-bg:hover {
    color: #4687ff;
}

#coredesc-gl>div.disclaimer>div>a:hover {
    background-color: transparent;
    text-decoration: underline;
    color: #337ab7;
}

#coredesc-gl>div.disclaimer>div>a:focus {
    color: #337ab7;
}

.desc .d-flex .title {
    color: #10218b;
}

.desc .percentage{
    font-weight: bold;
}

.disclaimer{
    text-align: center;
}

footer .disclaimer{
    text-align: left;
}

.slide-up .tile-container {
    min-height: 700px;
}

.column-with-gap{
    padding-left: 30px;
    padding-right: 30px;
}

#solutions .splide__arrows svg{
    fill: #ffffff;
}

.slide-up .desc-container .desc-inner-container {
    height: 100%;
    display: flex;
    display: -ms-flexbox;
    flex-direction: column;
    justify-content: center;
}

.slide-up .desc-inner-container {
    width: 100%;
}

.two-cols--desktop{
    flex-wrap: wrap;
}

.jumbotron{
    padding-top: 80px;
    padding-bottom: 80px;
}

.desc#coredesc-gl .d-flex .eal-col,
.desc#coredesc-gl3 .d-flex .eal-col {
    padding: 20px;
}

.w-25,
.w-75{
    width: 100%!important;
}

@media screen and (min-width: 768px) {
    h1 {
        text-align: center;
    }
    .w-25{
        width: 50%!important;
    }
    .w-75{
        width: 75%!important;
    }
    .image-container {
        width: 50%;
    }

    #solutions {
        padding-top: 0;
    }

    .splide .eal-col .desc-container>div,
    .tile-copy {
        text-align: center;
    }

    .splide .eal-col .desc-container {
        padding: 50px;
    }

    .percentage {
        font-size: 70px;
    }

    .desc .d-flex.two-cols .eal-col{
        width: 49%;
    }

    .desc .d-flex.two-cols--tablet .eal-col {
        width: 48%;
    }

    .desc .d-flex.two-cols--tablet {
        justify-content: space-between;
        flex-wrap: wrap;
    }

    .desc .image-container {
        width: 60%;
    }

    .desc .d-flex.two-cols--tablet .eal-col .caption {
        min-height: 64px;
    }

    .desc#coredesc-gl2 {
        text-align: center;
    }

    .desc#coredesc-gl2 .blue-no-bg {
        margin: auto;
    }

    .desc#coredesc-gl3 .d-flex .title {
        min-height: 162px;
        display: flex;
        flex-direction: column;
        justify-content: end;
        margin-bottom: 30px;
    }

    .desc#coredesc-gl3 .d-flex.two-cols--tablet .eal-col .caption {
        min-height: 126px;
    }

    .table-title {
        padding: 10px;
        background-color: #a4daf6;
        text-align: center;
    }

    .desc#coredesc-gl4 .disclaimer {
        text-align: center;
    }

    .display-projector {
        width: 80%;
        margin: auto;
    }

    .desc .d-flex.three-cols .eal-col,
    .desc .d-flex.three-cols--tablet .eal-col {
        width: 33%;
    }

    .desc#coredesc-gl4 .cards {
        justify-content: space-around;
    }

    .desc#coredesc-gl4 .eal-col .icon {
        width: 70%;
        min-height: 90px;
        display: flex;
        flex-direction: column;
        justify-content: flex-end;
    }

    .transport-efficiency img {
        width: 65%;
        margin: 0 auto;
    }

    .warehouse-space img {
        width: 51%;
        margin: 0 auto;
    }

}

@media screen and (min-width: 1024px) {
    .w-25{
        width: 25%!important;
    }
    .desc .d-flex.no-shadow.two-cols,
    .desc .d-flex.no-shadow.two-cols--desktop {
        justify-content: space-between;
    }

    .desc .d-flex.no-shadow.two-cols .eal-col,
    .desc .d-flex.no-shadow.two-cols--desktop .eal-col {
        width: 49%;
        margin-bottom: 0;
    }

    .desc#coredesc-gl .d-flex:first-child .eal-col,
    .desc#coredesc-gl3 .d-flex:first-child .eal-col,
    #coredesc-gl4>div.full-width-with-bg>div>div>div {
        padding: 0;
        margin-bottom: 0;
    }

    .desc .d-flex.two-cols--desktop .eal-col h2 {
        text-align: left;
    }

    .desc .d-flex.two-cols--desktop .eal-col .image-container {
        width: 100%;
        margin: 0;
    }

    .desc .d-flex.four-cols .eal-col,
    .desc .d-flex.four-cols--desktop .eal-col {
        width: 48%;
    }

    .desc .d-flex.three-cols .eal-col,
    .desc .d-flex.three-cols--desktop .eal-col {
        width: 33%;
    }

    .desc#coredesc-gl4 .d-flex.three-cols--desktop .eal-col {
        width: 48%;
    }

    #introduction .image-container {
        margin-bottom: 60px;
    }

    #innovativeSolsSlide .splide__list {
        display: flex;
        display: -ms-flexbox;
        flex-wrap: wrap;
    }

    #innovativeSolsSlide .splide__list .splide__slide {
        width: 50%;
        aspect-ratio: 1;
    }

    .splide .eal-col .desc-container {
        padding: 20px;
    }

    .splide .eal-col .desc-container .d-flex {
        width: 100%;
    }

    .splide .eal-col .desc-container .d-flex .eal-col {
        width: 45%;
    }

    #solutions .tile-container:hover .tile-title {
        /* transform: translateY(-140%); */
        /* margin-bottom: 0; */
        position: relative;
        transform: none;
        bottom: unset;
    }

    #solutions .tile-container:hover .tile-copy {
        /* transform: translateY(0%); */
        position: relative;
        transform: none;
        bottom: unset;
        min-height: unset;
        margin-bottom: 0;
    }

    #solutions .tile-container:hover .desc-inner-container,
    .desc#coredesc-gl .d-flex:first-child .eal-col:first-child,
    .desc#coredesc-gl3 .d-flex:first-child .eal-col:first-child,
    .desc#coredesc-gl4>.d-flex.no-shadow.two-cols--desktop .eal-col:first-child,
    #coredesc-gl4>div.full-width-with-bg>div>div>div:nth-child(1) {
        display: flex;
        display: -ms-flexbox;
        flex-direction: column;
    }

    .desc#coredesc-gl .d-flex:first-child .eal-col:first-child,
    .desc#coredesc-gl3 .d-flex:first-child .eal-col:first-child,
    .desc#coredesc-gl4>.d-flex:first-child .eal-col:first-child,
    #coredesc-gl4>div.full-width-with-bg>div>div>div:nth-child(1) {
        justify-content: center;
    }

    #solutions .tile-container:hover .desc-inner-container {
        height: 100%;
        justify-content: center;
    }

    .how-much-co2 {
        margin-bottom: 30px;
    }

    .percentage {
        font-size: 60px;
    }

    .eal-col.ecotank .blue-no-bg,
    .eal-col.heat-free .blue-no-bg {
        width: unset;
    }

    .desc {
        font-size: 20px;
    }
    
    .desc#coredesc-gl .d-flex.two-cols--tablet .eal-col .caption {
        min-height: 121px;
    }

    .eal-col .icon {
        width: 35%;
    }

    .desc#coredesc-gl3 .eal-col:nth-child(3) .icon {
        width: 50%;
    }

    .desc#coredesc-gl3 .eal-col:last-child .icon {
        width: 61%;
    }

    .display-projector {
        width: 100%;
    }

    .desc#coredesc-gl4>.d-flex.no-shadow.two-cols--desktop {
        margin-bottom: 50px;
    }

    .desc#coredesc-gl4 .cards {
        justify-content: space-between;
    }

    .desc#coredesc-gl4 .d-flex .eal-col .title {
        letter-spacing: 1px;
        margin-top: 0;
    }

    .desc#coredesc-gl4 .eal-col .icon {
        min-height: 82px;
        margin: 40px auto;
    }


}

@media screen and (min-width: 1200px) {
    .eal-section-spacing-bottom{
        padding-top: 0;
    }
    .desc .d-flex.two-cols--tablet {
        flex-wrap: nowrap;
    }
}

@media screen and (min-width: 1400px) {
    .splide .eal-col .desc-container,
    .splide .eal-col.ecotank .desc-container {
        background-color: rgb(53 53 53 / 40%);
    }

    .splide .eal-col .desc-container:hover {
        background-color: rgb(53 53 53 / 80%);
    }

    #coredesc-gl4>div.full-width-with-bg>div>div>div:nth-child(1)>div:nth-child(2) {
        margin-bottom: 20px;
    }

    #coredesc-gl4>div.full-width-with-bg>div>div>div:nth-child(1)>h2 {
        margin-bottom: 40px;
    }

    .slide-up .desc-inner-container {
        width: 70%;
    }
    .slide-up .tile-container {
        min-height: unset;
    }
    .column-with-gap{
        padding-left: 0;
        padding-right: 0;
    }
}

@media screen and (min-width: 1600px) {
    #introduction p {
        width: 100%;
        text-align: center;
    }

    #introduction .container {
        width: 78%;
    }

    #introduction .image-container {
        width: 28%;
    }

    .splide .eal-col .desc-container .d-flex .eal-col {
        width: 48%;
    }

    .desc .d-flex.no-shadow.two-cols--desktop {
        margin-bottom: 20px;
    }

    .full-width-with-bg,
    .full-width-with-bg .container,
    .full-width-with-bg .container .d-flex * {
        background-color: #f3f3f3;
    }

    .full-width-with-bg {
        margin-bottom: 70px;
    }

    .desc#coredesc-gl4 .eal-col .icon {
        min-height: 145px;
    }

    .desc#coredesc-gl4 .d-flex.no-shadow.two-cols--desktop {
        margin-bottom: 0;
    }

    #solutions .full-width-with-bg .container {
        padding: 50px 0;
    }

    #coredesc-gl4>div.full-width-with-bg>div>div>div:nth-child(2)>div {
        margin-top: 0;
    }

    .desc#coredesc-gl3 .d-flex.two-cols--tablet .eal-col .caption {
        min-height: 224px;
    }

    .desc#coredesc-gl3 .d-flex .title {
        min-height: 152px;
        margin-bottom: 20px;
    }

    .spacer {
        min-height: 27px;
    }

    .percentage {
        font-size: 80px;
    }
}

