.clb-color-card-wrapper {
     display: grid;
     grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
     gap: 15px;
     margin-bottom: 60px;
}

.clb-color-card-wrapper.photo-top {
     gap: 0;
}

.clb-color-card-wrapper.photo-right {
     grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
}

.clb-color-card-wrapper.photo-top {
     grid-template-columns: minmax(0, 1fr);
}

.clb-color-card-wrapper.photo-top .clb-color-card-image-wrapper {
     max-height: 400px;
}

.clb-color-card-wrapper.photo-right .clb-color-card-body-wrapper {
     grid-column: 1 / span 1;
     grid-row: 1 / 1;
}

.clb-color-card-wrapper.photo-right .clb-color-card-image-wrapper {
     grid-column: 2 / span 1;
     grid-row: 1 / 1;
}

.clb-color-card-body-wrapper {
     padding: 30px;
     background: var(--gray);
     z-index: 10;

     display: flex;
     flex-direction: column;
     justify-content: center;
}

.clb-color-card-body-wrapper a {
     color: var(--white);
     text-decoration: none;
}

h4.clb-color-card-headline {
     font-size: 32px;
     line-height: 0.9;
     text-transform: uppercase;
     margin: 0;

     display: flex;
    align-items: center;
}

.clb-color-card-headline-wrapper {
     display: grid;
     grid-template-columns: 4fr 1fr;
     gap: 12px;
     margin-bottom: 30px;
}

.clb-color-card-headline-wrapper .clb-arrow-icon-with-link {
     text-align: right;
     display: flex;
     flex-direction: column;
     justify-content: center;
     align-items: flex-end;
}

.clb-color-card-image-wrapper {
     height: 100%;
     position: relative;
     aspect-ratio: 1024 / 580;
}

.clb-background-color-alignment-full .clb-color-card-image-wrapper {
     aspect-ratio: inherit;
}

.clb-color-card-image-wrapper img {
     position: relative;
     height: 100%;
     object-fit: cover;
}

.clb-color-card-custom-overlay {
     position: absolute;
     height: 10%;
     width: 100%;
     bottom: 0;
     mix-blend-mode: multiply;
}


.clb-background-color-alignment-full {
     width: 100vw;
     display: flex;
     justify-content: center;
     margin-left: calc(-100vw / 2 + 100% / 2);
     margin-right: calc(-100vw / 2 + 100% / 2);
     max-width: 100vw;
     max-height: 100%;
     height: fit-content;
}

.clb-background-color-alignment-full .clb-color-card-wrapper {
     max-width: 1280px;
     margin-bottom: 0;
}

.clb-background-color-alignment-full .clb-color-card-image-wrapper {
     border-left: 15px solid var(--white);
     border-right: 15px solid var(--white);
}

.clb-color-card-tag {
     text-transform: uppercase;
     font-weight: 700;
     font-size: 24px;
}

.clb-color-card-body-text {
     font-size: 20px;
     line-height: 1.5;
}

/* --- Set homepage max heights --- */
.home .entry-content .color_card,
.home .entry-content .clb-color-card-image-wrapper img {
     max-height: 530px;
}

.home h4.clb-color-card-headline {
     font-size: 42px;
     line-height: 0.8;
}

.clb-color-card-custom-overlay.cool-gradient {
     background: linear-gradient(to right, var(--green), var(--blue));
}

.clb-color-card-custom-overlay.warm-gradient {
     background: linear-gradient(to right, var(--orange), var(--yellow));
}

.clb-color-card-bottom-link-wrapper {
     margin-top: 20px;
     display: flex;
     gap: 12px;
     justify-content: flex-start;
     align-items: center;
}

.clb-color-card-bottom-link-text {
     font-size: 20px;
     line-height: 1.5;
     text-transform: uppercase;
     font-weight: 600;
}

.clb-color-card-bottom-link-wrapper .clb-arrow-right-icon-wrapper {
     font-size: 14px;
}


@media only screen and (max-width: 1600px) {

     .clb-color-card-image-wrapper {
         aspect-ratio: auto;
     }

}



@media only screen and (min-width: 800px) {

     .photo-left .clb-color-card-body-wrapper {
          border-left: solid var(--white) 15px;
     }

     .photo-right .clb-color-card-body-wrapper {
          border-right: solid var(--white) 15px;
     }

}

@media only screen and (min-width: 1260px) {

     .notice .clb-notice-mobile-icon-wrapper {
          display: none;
     }

     .notice .clb-notice-icon-wrapper {
          display: block;
          float: left;
          margin-left: -100px;
     }

}