/* CARD */
.cs-card{font-size:14px;width:21em;height:35em;position:relative;display:inline-block;background-color:#fff;border-radius:0.3em;box-shadow:0 10px 15px 2px rgba(0,0,0,0.2);overflow:hidden;padding:0 !important;margin:0 1.5em 1.5em 1.5em;overflow:hidden;transition:all 0.5s ease}
.cs-card a{text-decoration:none!important;font-size:1em!important;cursor:pointer;display:flex;flex-direction:column;width:100%;height:100%}
.cs-card a>*{flex-grow:0;flex-shrink:0}

/* -- card elements -- */
.cs-card .thumbnail{transition:all 1s 0.05s ease;padding:0 1.5em;position:relative;overflow:hidden;background:none;border:0;margin:0;border-radius:0;height:45%}
.cs-card .thumbnail img{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;z-index:0;transition:all 1s 0.05s ease;object-position:50% 10%;margin:0}
.cs-card .entry-info{width:100%;z-index:2;position:relative;text-align:left;margin-top:1.5em}
.cs-card .category{text-transform:uppercase;color:#fff;letter-spacing:2px;z-index:2;text-shadow:0 0 4px rgba(0,50,71,0.8)}
.cs-card .dimmer{position:absolute;top:0;left:0;width:100%;height:100%;background-image:linear-gradient(0deg,rgba(0,50,70,0.5) 0%,rgba(0,50,70,0) 60%,rgba(0,50,70,0.15) 100%);background-color:transparent;z-index:1}
.cs-card.sticky-post .thumbnail::after{content:"\f08d";font-family:'FontAwesome';z-index:1;font-size:2em;color:#ffd400;transform:rotate(20deg);text-shadow:2px 1px 1px rgb(0 0 0/80%);position:absolute;right:0.7em;top:0.35em}

.cs-card .entry{display:flex;flex-direction:column;flex-grow:1;justify-content:flex-end;height:0%;padding:0 1.5em;width:100%;position:relative;z-index:2}
.cs-card .entry>*{flex-grow:0;flex-shrink:0}
.cs-card .entry>*+*{margin-top:0.6em}
.cs-card .pillar{width:max-content;max-width:100%;text-align:center;font-family:NotesEsa;color:#fff;background-color:rgba(0,50,70,0.7);text-transform:uppercase;padding:0.2em 0.8em;margin:0;letter-spacing:0.1em;transform:translateX(-50%) translateY(-50%);position:absolute;top:0;left:50%;border-top:2px solid var(--cs-esa-color);border-bottom:2px solid transparent}
.cs-card .heading{font-size:1.6em;font-weight:400;color:#335e6f;line-height:1.1em;padding:0;text-align:left;overflow:hidden;margin-top:1.5em;letter-spacing:-0.5px;max-height:calc(100% - 3em)}
.cs-card .details{line-height:1.3em;color:#8197A6;font-size:1em;overflow:hidden;flex-grow:1;margin-top:auto;margin-bottom:auto;display:flex;flex-direction:column;justify-content:flex-start;text-align:left;max-height:7.8em;flex-shrink:1}
.cs-card .heading.smaller{font-size:1.4em}

.cs-card .metainfo{display:flex;flex-direction:row;color:#8197A6;font-size:1em;text-transform:uppercase;line-height:1.8em;padding:0;border-bottom:1px dashed #c8d4dc;border-top:1px dashed #c8d4dc}
.cs-card .metainfo span{text-align:left}
.cs-card .metainfo span+span{margin-left:1em}

.cs-card .cta{display:flex;flex-direction:row;align-items:center;justify-content:space-between;padding:1.2em 1.5em;transition:all 0.25s ease;width:100%;font-family:NotesEsa;color:#335e6f}
.cs-card .cta label{font-weight:400;text-transform:uppercase;letter-spacing:0.18em;cursor:pointer;margin:0}
.cs-card .cta .arrow{display:inline-block;width:1.6em;height:0.85em;background-image:url(../img/arrow.svg);background-repeat:no-repeat}

/* -- HOVERING -- */
.cs-card:hover{transform:scale(1.03);box-shadow:0 20px 30px 0 rgba(0,0,0,0.1)}
.cs-card:hover .thumbnail img{transform:scale(1.1)}
.cs-card:hover .cta .arrow{animation:cta-arrow 1s ease-in-out infinite}

.square-cards .cs-card{font-size:12px;width:21em;height:21em}
.square-cards .cs-card .thumbnail{height:73%}
.square-cards .cs-card .sub-heading{display:none}
.square-cards .cs-card .metainfo{display:none}
.square-cards .cs-card .details{display:none}
.square-cards .cs-card .heading{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

.quickview-cards .cs-card{font-size:16px;width:23em;height:23em}
.quickview-cards .cs-card .thumbnail{height:60%}
.quickview-cards .cs-card .sub-heading{display:none}
.quickview-cards .cs-card .details{display:none}

/* -- VIDEO CARD -- */
.cs-card.video{background-color:#003246}
.cs-card.video .heading{color:white}
.cs-card.video .metainfo{border-color:#8197A6}
/* -- IMAGE CARD -- */
.cs-card.image{background-color:#003246}
.cs-card.image .thumbnail{height:90%}
.cs-card.image .thumbnail img{object-position:unset}
.cs-card.image .entry{position:absolute;bottom:10%;background-image:linear-gradient(0deg,rgba(0,50,70,1) 0%,rgba(0,50,70,0) 70%,rgba(0,50,70,0) 100%);background-color:transparent}
.cs-card.image .heading{color:white}
.cs-card.image .tag,.cs-card.image .pillar{display:none}
.cs-card.image .details{display:none}
.cs-card.image .metainfo{border-color:#8197A6}
/* SMALL */
.cs-cards-sm .cs-card{width:15em;height:23em;background-color:#003246;background-image:linear-gradient(180deg,#003246 0%,#003246 70%);border-radius:0.5em}
.cs-cards-sm .cs-card .thumbnail{height:90%}
.cs-cards-sm .cs-card .entry{position:absolute;bottom:0;height:7em;font-size:1.2em;}
.cs-cards-sm .cs-card .heading{color:white;height:3em;text-align:center;text-shadow:0 -1px 3px rgba(0,0,0,0.5);margin:0.7em 0 0.3em 0}
.cs-cards-sm .cs-card .tag,.cs-cards-sm .cs-card .pillar,
.cs-cards-sm .cs-card .details,
.cs-cards-sm .cs-card .cta,
.cs-cards-sm .cs-card .metainfo{display:none}

/* IN CONTAINER */
.cs-cards-container{display:flex;flex-direction:row;flex-wrap:wrap;justify-content:flex-start;margin-left:-2rem;margin-right:-2rem}

/* CUSTOM FRONT PAGE */
.home .cs-cards-sm .cs-card .thumbnail{overflow:visible}
.home .cs-cards-sm .cs-card .thumbnail img{width:80%;margin:2em 10% 0 10%;object-fit:contain}

@media screen and (max-width: 782px) and (min-width: 320px) {
	.cs-card{width:100%;height:15em}
	.cs-card a{flex-direction:row}
	.cs-card a>*{height:100%;width:unset;height:100%}
	.cs-card .heading{margin-top:1em}
	.cs-card .thumbnail{width:15em;height:100%}
	.cs-card .entry{flex-shrink:1;height:100%}
	.cs-card .metainfo{padding:0.5em 0;border-bottom:0;margin:0}
	.cs-card .details{max-height:unset;justify-content:flex-start;margin-top:0}
	.cs-card .pillar{left:-7.5em;transform:translateX(-50%);top:unset;bottom:1em}
	.cs-card .cta{position:absolute;bottom:0;right:0;display:block;width:fit-content;height:unset;padding:0.5em 1.5em;line-height:1.8em;background-color:#fff;z-index:2}
	.cs-card:hover{transform:none;box-shadow:0 10px 15px 2px rgba(0,0,0,0.2)}
	.cs-card:active .entry{background-color:rgb(0 177 157 / 15%)}
}

@media screen and (max-width: 600px) {
	.home .cs-cards-sm .cs-card{height:22em;font-size:8px;margin:1.5em 0.6em}
	.home .cs-cards-sm .cs-card .thumbnail img{margin-top:1.25em}
	.home .cs-cards-sm .cs-card .heading{font-size:2em;height:3em}
	.home .cs-cards-sm .cs-card .thumbnail{height:100%}
	.home .cs-cards-sm .cs-card .entry-info{display:none}
}

@media screen and (max-width: 450px) and (min-width: 320px) {
	.cs-card .thumbnail{width:50%}
	.cs-card .metainfo{border:0}
	.cs-card .metainfo>*,.cs-card .cta .arrow{display:none}
	.cs-card .entry{padding:0 0.7em}
	.cs-card .details{opacity:0}
	.cs-card .pillar{left:-50%}
}