/* @import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;600;700&display=swap'); */
/* @import url('https://fonts.googleapis.com/css2?family=Arvo:wght@400;700&display=swap'); */

@font-face {
	font-family: 'arvoregular';
	src: url('/css/fonts/arvo-regular-webfont.woff2') format('woff2'),
		url('/css/fonts/arvo-regular-webfont.woff') format('woff'), url('/css/fonts/arvo-regular-webfont.eot') format('eot'),
		url('/css/fonts/arvo-regular-webfont.ttf') format('ttf');
	font-weight: 400;
	font-style: normal;
}

@font-face {
	font-family: 'arvobold';
	src: url('/css/fonts/arvo-bold-webfont.woff2') format('woff2'),
		url('/css/fonts/arvo-bold-webfont.woff') format('woff'), url('/css/fonts/arvo-bold-webfont.eot') format('eot'),
		url('/css/fonts/arvo-bold-webfont.ttf') format('ttf');
	font-weight: 700;
	font-style: normal;
}

@font-face {
	font-family: 'opensansregular';
	src: url('/css/fonts/opensans-regular-webfont.woff2') format('woff2'),
		url('/css/fonts/opensans-regular-webfont.woff') format('woff'),
		url('/css/fonts/opensans-regular-webfont.eot') format('eot'),
		url('/css/fonts/opensans-regular-webfont.ttf') format('ttf');
	font-weight: 400;
	font-style: normal;
}

@font-face {
	font-family: 'opensansitalic';
	src: url('/css/fonts/opensans-italic-webfont.woff2') format('woff2'),
		url('/css/fonts/opensans-italic-webfont.woff') format('woff'),
		url('/css/fonts/opensans-italic-webfont.eot') format('eot'),
		url('/css/fonts/opensans-italic-webfont.ttf') format('ttf');
	font-weight: 400;
	font-style: normal;
}

@font-face {
	font-family: 'opensanslight';
	src: url('/css/fonts/opensans-light-webfont.woff2') format('woff2'),
		url('/css/fonts/opensans-light-webfont.woff') format('woff'),
		url('/css/fonts/opensans-light-webfont.eot') format('eot'),
		url('/css/fonts/opensans-light-webfont.ttf') format('ttf');
	font-weight: 400;
	font-style: normal;
}

@font-face {
	font-family: 'opensanssemibold';
	src: url('/css/fonts/opensans-semibold-webfont.woff2') format('woff2'),
		url('/css/fonts/opensans-semibold-webfont.woff') format('woff'),
		url('/css/fonts/opensans-semibold-webfont.eot') format('eot'),
		url('/css/fonts/opensans-semibold-webfont.ttf') format('ttf');
	font-weight: 600;
	font-style: normal;
}

html {
	font-size: 18px;
}

body {
	/* From Andy Bell's modern css reset */
	min-height: 100vh;
	scroll-behavior: smooth;
	text-rendering: optimizeSpeed;
	line-height: 1.5;
	margin: 0;
	/* overflow-x: hidden; */
}

* {
	font-family: 'opensansregular', serif;
	font-weight: 400;
	color: #303030;
	box-sizing: border-box;
}

strong {
	font-family: 'opensanssemibold', serif;
	font-weight: 600;
}

em {
	font-family: 'opensansitalic', serif;
}

a {
	text-decoration: none;
}

/* fontawesome icons */
main i {
	font-size: 0.5em !important;
	color: #a3a3a3 !important;
	vertical-align: super;
}

main a {
	color: #5a5a5a;
	-webkit-text-decoration: #088b60 solid underline;
	text-decoration: #088b60 solid underline;
	-webkit-text-decoration-skip: ink;
	text-decoration-skip: ink;
}

.center-element {
	display: flex;
	justify-content: center;
}

/* Put all the header and nav sections in @media desktop */
header {
	max-width: min(1200px, 75vw);
	max-height: min(300px, 30vh);
	margin: 0 auto;
	margin-top: 0.75em;
	display: flex;
	justify-content: space-between;
	z-index: 1000;
}

section {
	position: relative;
	overflow: hidden;
}

.overlay {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	background-color: rgba(8, 139, 96, 0.5);
}

.nav_section {
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	align-items: flex-end;
}

/* same as nav-btn in example */
.main_nav {
	flex: 3;
	display: flex;
	margin-top: 0.3em;
}

/* .nav-links {
    flex: 2;
} */

.nav-link {
	position: relative;
	width: max-content;
	font-size: calc(0.9em);
}

.nav-links > ul {
	display: flex;
	justify-content: flex-end;
	flex-wrap: wrap;
	align-items: center;
	list-style: none;
	margin: 0;
	padding: 0;
}

.nav-link > a {
	line-height: 3rem;
	color: #272727;
	padding: 0;
	padding-left: 1.2rem;
	letter-spacing: 1px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	transition: 0.5s;
}

.nav-link > a > i {
	margin-left: 0.2rem;
}

.dropdown {
	position: absolute;
	top: 100%;
	left: 0;
	width: 10rem;
	transform: translateY(10px);
	opacity: 0;
	pointer-events: none;
	transition: 0.5s;
	z-index: 1000;
}

.dropdown ul {
	position: relative;
	list-style: none;
	margin: 0;
	padding: 0;
}

.dropdown-link > a {
	display: flex;
	background-color: #bdbdbd;
	color: #222;
	padding: 0.5rem 1rem;
	font-size: 0.9rem;
	align-items: center;
	justify-content: space-between;
	transition: 0.3s;
}

.dropdown-link:hover > a {
	background-color: #5a5a5a;
	color: #fff;
}

.dropdown-link:not(:nth-last-child(2)) {
	border-bottom: 1px solid #efefef;
}

.dropdown-link i {
	transform: rotate(-90deg);
}

.arrow {
	position: absolute;
	width: 11px;
	height: 11px;
	top: -5.5px;
	left: 32px;
	background-color: #bdbdbd;
	transform: rotate(45deg);
	cursor: pointer;
	transition: 0.3s;
	z-index: -1;
}

.dropdown-link:first-child:hover ~ .arrow {
	background-color: #5a5a5a;
}

.dropdown-link {
	position: relative;
}

.dropdown-link .show-dropdown {
	opacity: 1;
}

.support_nav {
	display: flex;
	margin-top: 0;
	align-content: flex-start;
}

.nav-link:hover > .dropdown,
.dropdown-link:hover > .dropdown {
	transform: translate(0, 0);
	opacity: 1;
	pointer-events: auto;
}

.hamburger-menu-container {
	flex: 1;
	display: none;
	align-items: center;
	justify-content: flex-end;
}

.hamburger-menu {
	width: 2.5rem;
	height: 2.5rem;
	display: flex;
	align-items: center;
	justify-content: flex-end;
}

.hamburger-menu div {
	width: 1.6rem;
	height: 3px;
	border-radius: 3px;
	background-color: #2b2b2b;
	position: relative;
	z-index: 1001;
	transition: 0.5s;
}

.hamburger-menu div:before,
.hamburger-menu div:after {
	content: '';
	position: absolute;
	width: inherit;
	height: inherit;
	background-color: #2b2b2b;
	border-radius: 3px;
	transition: 0.5s;
}

.hamburger-menu div:before {
	transform: translateY(-7px);
}

.hamburger-menu div:after {
	transform: translateY(7px);
}

#check {
	position: absolute;
	top: 38px;
	right: 10vw;
	width: 2.5rem;
	height: 2.5rem;
	z-index: 90000;
	cursor: pointer;
	opacity: 0;
	display: none;
}

#check:checked ~ .hamburger-menu-container .hamburger-menu div {
	background-color: transparent;
}

#check:checked ~ .hamburger-menu-container .hamburger-menu div:before {
	transform: translateY(0) rotate(-45deg);
}

#check:checked ~ .hamburger-menu-container .hamburger-menu div:after {
	transform: translateY(0) rotate(45deg);
}

@keyframes animation {
	from {
		opacity: 0;
		transform: translateY(15px);
	}

	to {
		opacity: 1;
		transform: translateY(0px);
	}
}

.support_nav > * {
	margin-left: 6px;
}

.support_nav button {
	background-color: #8a1827;
	padding: 0.6em 1em;
	border: none;
}

.support_nav button > a {
	color: white;
	font-size: 0.95em;
	text-decoration: none;
}

.support_nav button.maroon_invert {
	background-color: #fff;
	padding: 0.6em 1em;
	border: 2px solid #8a1827;
}

.support_nav button.maroon_invert > a {
	color: #8a1827;
	text-transform: uppercase;
	font-family: 'opensanssemibold', serif;
	font-weight: 600;
}

/* Put all the footer sections in @media desktop */
footer {
	background-color: #253658;
	border-top: 15px solid #c1c1c1;
	min-height: 150px;
	max-width: 100vw;
	color: white;
	margin-top: 3em;
}

.footer-container {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	max-width: min(1200px, 75vw);
	padding-top: 2em;
	margin: 0 auto;
}

.footer-contact-section {
	display: flex;
	flex-direction: column;
}

.footer-contact-section a {
	color: #bababa;
	font-size: 0.9em;
	padding: 0 0 0.9em;
}

.footer-socialmedia-section {
	display: flex;
	justify-content: flex-end;
	/* align-items: flex-end; */
	/* align-content: flex-end; */
	padding: 0 5px;
	padding-right: 0;
}

/* To get gap between the flex items */
.footer-socialmedia-section a {
	margin: 0 5px;
}

.footer-socialmedia-section a:last-child {
	margin-right: 0;
}

.footer-right-block {
	display: flex;
	flex-direction: column;
}

.footer-right-block h3 {
	margin-block-end: 0;
	text-align: right;
	margin: 0;
	padding: 0.3em 0;
}

.footer-right-block h3 a {
	color: #088b60;
	font-size: 1.2em;
}

main {
	min-height: 67vh;
}

.container_1200px {
	max-width: min(1200px, 75vw);
	margin: 0 auto;
	margin-top: 2em;
	padding: 0;
}

.container_1200px_slider {
	max-width: min(1200px, 75vw);
	margin: 0 auto;
	padding: 0;
}

/**
 * FULL BLEED
 *
 * Add this class to an element to make it fill the width of the screen 
 * and sit horizontally central
 */
.container_full_bleed {
	max-width: 100%;
	margin: 0 auto;
	/* padding: 0 22vw; */
	padding: 0;
	background-color: #e5e5e5;
}

.swiper-container {
	width: 100%;
	height: 100%;
	background: #000;
}

.swiper-pagination-bullet-active {
	background-color: #8a1827;
}

/* Display Captions */
.swiper-slide {
	color: #fff;
	background-color: #3b3b3b;
	font-size: calc(0.5em + 0.5vw);
	line-height: 2;
	text-align: center;
	min-height: fit-content;
}

.news-updates-container {
	background-color: #c4dad2;
	width: 100%;
}

.news-updates-container h4 {
	display: inline-block;
}

.news-updates-header {
	background-color: #088b60;
	border-bottom: 2px solid #1e805f;
}

.news-updates-header h2 {
	color: #fff;
	padding: 0.2em 0;
	margin: 0;
}

.news-item {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 0.1em 1em;
	border-bottom: 1px solid #bbc7c3;
}

.news-item a {
	display: inline-block;
	padding: 0;
	margin: 0;
	font-family: 'arvoregular', serif;
	font-weight: 400;
	text-decoration: none;
}

.news-item .link {
	font-size: 0.7em;
	color: #3f6dcf;
	display: inline-block;
}

.news-item tiny {
	font-size: 0.6em;
	color: #7c7c7c;
}

h1,
h1 span,
h2,
h2 span,
h3,
h3 span,
h4,
h4 span {
	font-family: 'arvoregular', serif;
	font-weight: 400;
	color: black;
	display: block;
	text-align: center;
}

i,
em {
	font-family: 'opensansitalic', serif;
	font-weight: 400;
	color: #333;
}

.columns-section {
	margin: 0.12em 0;
}

.column.large {
	min-width: 25vw;
	max-width: 60vw;
}
.column.medium {
	min-width: 20vw;
	max-width: 30vw;
}
.column.narrow {
	min-width: 16vw;
	max-width: 22vw;
}

.columns-section .column h1,
.columns-section .column h2,
.columns-section .column h3,
.columns-section .column h4 {
	text-align: left;
	margin: 0.3em 0;
}

.columns-section .column p {
	margin: 0.6em 0;
}

/* card layout for blog categories */
.card__collection {
	display: flex;
	gap: 40px;
	flex-wrap: wrap;
	justify-content: center;
	align-content: center;
}

.card {
	box-shadow: 0 2.8px 2.2px rgba(0, 0, 0, 0.034), 0 6.7px 5.3px rgba(0, 0, 0, 0.048), 0 12.5px 10px rgba(0, 0, 0, 0.06),
		0 22.3px 17.9px rgba(0, 0, 0, 0.072), 0 41.8px 33.4px rgba(0, 0, 0, 0.086), 0 100px 80px rgba(0, 0, 0, 0.12);
	max-height: 400px;
	width: clamp(380px, 12vw, 400px);
	min-width: 12vw;
	padding: 0;
	padding-bottom: 20px;
	background: white;
	border-radius: 12px;
	overflow: hidden;
}

.card__image-holder > img {
	height: 250px;
	width: 100%;
	object-fit: cover;
}

.card__title {
	padding: 4px 20px;
	padding-bottom: 0;
}

.card__title > a {
	text-decoration: none;
}

.card__link {
	padding: 0 20px;
}

.card__link > a {
	background-color: #088b60;
	color: #fff;
	font-size: 12px;
	text-decoration: none;
    text-transform: uppercase;
	padding: 4px 12px;
	border-radius: 4px;
}

.postcard {
    display: flex;
    gap: 40px;
    justify-content: flex-start;
    max-height: 350px;
    padding: 0;
    padding-bottom: 40px;
    border-radius: 12px 0 0 12px;
    overflow: hidden;
}

.postcard__image-holder {
    min-width: 250px;
    max-width: 250px;
    max-height: 250px;
    border: 1px solid rgba(0, 0, 0, 0.1);
    border-radius: 12px;
    overflow: hidden;
}

.postcard__image-holder>img {
    width: 100%;
    height: 250px;
    object-fit: cover;
}

.postcard__details {
    align-self: center;
}

.postcard__details>a {
    text-decoration: none;
}

.postcard__details>div {
    font-size: smaller;
}

.postcard__excerpt {
    display: block;
    padding-bottom: 8px;
}

.postcard__link {
    padding: 0;
    padding-top: 10px;
}

.postcard__link>a {
    background-color: #088b60;
    color: #fff;
    font-size: 12px;
    text-decoration: none;
    text-transform: uppercase;
    padding: 4px 12px;
    border-radius: 4px;
}

.banner-image {
	margin: 0;
	margin-bottom: 6em;
	padding: 0;
	position: relative;
    min-height: 120px;
}
.banner-image > img {
	width: 100%;
	max-height: 600px;
	object-fit: cover;
}
.banner-image .overlap-title {
	min-width: 55vw;
	background-color: #088b60;
	padding: 0 40px;
	position: absolute;
	top: 93%;
	left: 50%;
	transform: translateX(-50%);
	border-radius: 6px;
}
.banner-image .overlap-title > h1 {
	color: #fff;
}
.banner-image .overlap-title.no-banner-img {
    top: 30px;
}


.breadcrumbs {
    padding-bottom: 20px;
}
.breadcrumbs>a {
    text-decoration: none;
    color: #088b60;
    text-transform: uppercase;
    font-size: 14px;
    font-weight: bold;
}

.breadcrumbs a i {
    font-size: 16px !important;
    color: #088b60 !important;
    vertical-align: middle;
}

.category__container {
    display: flex;
    justify-content: space-between;
    padding-bottom: 20px;
}
.category__container-text>a {
    text-decoration: none;
    color: #8a1827;
    text-transform: uppercase;
    font-size: 14px;
}
.category__container-text {
    max-width: 75%;
}
.category__container-count {
    font-size: 14px;
    background-color: #8a1827;
    color: #fff;
    width: 35px;
    height: fit-content;
    padding: 0;
    border-radius: 4px;
    text-align: center;
    align-self: center;
}

.category__list {
    color: #8a1827;
    text-transform: uppercase;
    font-size: 14px;
    padding-bottom: 8px;
}
.category__list>a {
    text-decoration-color: #8a1827;
    text-decoration-style: dotted;
    text-underline-offset: 2px;
    color: #8a1827;
    text-transform: uppercase;
    font-size: 14px;
    padding-right: 4px;
}

.post-date {
    text-transform: uppercase;
    font-size: 14px;
}

.author__container {
    display: flex;
    gap: 20px;
    padding-bottom: 10px;
}

.author__name {
    align-self: center;
}

.author__image-holder {
    width: 100px;
    height: 100px;
    border-radius: 50%;
    overflow: hidden;
}
.author__image-holder>img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}



/* We need to tweak img properties because the eleventy-plugin-lazyimages 
will automatically set the width and height attributes for each image 
based on the source image dimensions. */
main img {
	display: block;
	/* width: 100%; */
	/* max-width: 100%; */
	/* height: auto; */
	/* centers all images */
	margin: 0 auto;
}

.page_title_black_band {
	position: relative;
	background-color: black;
	min-height: fit-content;
	/* height: calc(50px + 1.25vw); */
	width: 100vw;
}

.page_title {
	color: #1cb193;
	font-family: 'arvoregular', serif;
	font-weight: 400;
	font-size: calc(1.3em + 1.25vw);
	width: min(1200px, 75vw);
	margin: 0 auto;
}

.tagline1 {
	display: flex;
	justify-content: center;
	align-items: center;
	padding: 0;
	margin: 0.2em auto;
}

.tagline2 {
	display: flex;
	justify-content: center;
	align-items: center;
	color: #aaaaaa !important;
	padding: 0;
	margin: 0.1em auto;
	font-size: 1.2em;
}

.pageReference__button {
	background-color: #feb;
	border: 0;
	padding: 0.35em 0.75em;
	border-bottom: 1px solid #c4c4c4;
}

.pageReference__button a {
	text-decoration: none;
	color: black;
	font-size: o.75em;
}

.donateSection {
	position: relative;
	padding-top: 3em;
}

.donateButton {
	background-color: #088b60;
	width: fit-content;
	padding: 0.3em 5em;
	position: absolute;
	top: 0;
	left: 0;
}

.donateButton a {
	color: #fff;
	font-family: 'arvoregular', serif;
	font-weight: 400;
	font-size: 1.3em;
	text-decoration: none;
}

.greenButton {
	background-color: #088b60;
	width: fit-content;
	padding: 0.3em 3em;
	color: #fff;
	font-family: 'arvoregular', serif;
	font-weight: 400;
	font-size: 1em;
	border: none;
	cursor: pointer;
	align-items: center;
}

.contactForm {
	/* width: min(500px, 75vw); */
	width: 100%;
	border: 1px #868686 solid;
	border-radius: 4px;
	padding: 1em;
}

input[type='text'],
input[type='email'],
select,
textarea {
	width: 100%;
	padding: 12px 20px;
	margin: 2px 0 10px;
	display: block;
	border: 1px solid #ccc;
	border-radius: 4px;
	box-sizing: border-box;
}

/* Embed Youtube iframe responsively */
.embed-container {
	position: relative;
	padding-bottom: 56.25%;
	height: 0;
	overflow: hidden;
	max-width: 100%;
}

.embed-container iframe,
.embed-container object,
.embed-container embed {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.responsive_img {
	margin: 0 auto;
	/* display: flex;
    justify-content: center;
    align-content: center; */
}

.responsive_img img {
	max-width: 100%;
}

/* For Mobile */
@media (max-width: 1200px) {
	.logo > img {
		width: min(50vw, 280px);
		height: auto;
		margin: 0;
		padding: 0;
	}

	.hamburger-menu-container {
		display: flex;
	}

	#check {
		display: block;
	}

	.main_nav {
		position: fixed;
		height: 100vh;
		top: 0;
		left: 0;
		width: 100%;
		margin: 0;
		background-color: #088b60;
		flex-direction: column;
		align-items: center;
		justify-content: space-between;
		overflow-x: hidden;
		/* overflow-y: auto; */
		overflow-y: hidden;
		transform: translateX(100%);
		transition: 0.65s;
	}

	.support_nav {
		position: fixed;
		bottom: 2em;
		left: 1em;
		transform: translateX(-150%);
		transition: 0.95s;
	}

	#check:checked ~ .nav_section .main_nav {
		transform: translateX(0);
		z-index: 1000;
	}

	#check:checked ~ .nav_section .support_nav {
		transform: translateX(0);
		z-index: 1001;
	}

	#check:checked ~ .nav_section .main_nav .nav-links ~ .nav-link,
	#check:checked ~ .nav_section .main_nav .nav-links ~ .nav-link > a {
		animation: animation 0.5s ease forwards var(--i);
		color: #222;
	}

	.nav-links {
		flex: initial;
		width: 100%;
		margin-top: 4em;
	}

	.nav-links > ul {
		flex-direction: column;
	}

	.nav-link {
		width: 100%;
		/* opacity: 0; */
		transform: translateY(15px);
	}

	.nav-link > a {
		line-height: 1;
		padding: 1.6rem 2rem;
		color: #000;
	}

	.nav-link:hover > a {
		transform: scale(1);
		background-color: #088b60;
		color: #fff;
	}

	.dropdown {
		position: initial;
		top: initial;
		left: initial;
		transform: initial;
		opacity: 1;
		pointer-events: auto;
		width: 100%;
		padding: 0;
		padding-left: 1.5em;
		background-color: #bae0d2;
		display: none;
	}

	.nav-link:hover > .dropdown,
	.dropdown-link:hover > .dropdown,
	.dropdown-link:hover > .show-dropdown {
		display: block;
	}

	/* .dropdown-link:hover>a>i, */
	.nav-link:hover > a > i {
		transform: rotate(360deg);
	}

	.dropdown-link > a {
		background-color: transparent;
		color: #000;
		padding: 1.2rem 2rem;
		line-height: 1;
	}

	.show-dropdown .dropdown-link > a {
		padding: 1.2rem 2rem 1.2rem 3rem;
	}

	.dropdown.second .dropdown-link > a {
		padding: 1.2rem 2rem 1.2rem 3rem;
	}

	.dropdown.second .dropdown.second .dropdown-link > a {
		padding: 1.2rem 2rem 1.2rem 4rem;
	}

	.dropdown-link:not(:nth-last-child(2)) {
		border-bottom: none;
	}

	.arrow {
		z-index: 1;
		background-color: #088b60;
		left: 10%;
		transform: scale(1.1) rotate(45deg);
		transition: 0.5s;
	}

	.nav-link:hover .arrow {
		background-color: #088b60;
	}

	.dropdown .dropdown .arrow {
		display: none;
	}

	.dropdown .show-dropdown .arrow {
		display: none;
	}

	.dropdown-link:hover > a {
		background-color: #bae0d2;
		color: #222;
		text-decoration: underline;
	}

	.dropdown-link:first-child:hover ~ .arrow {
		background-color: #088b60;
	}

	.nav-link > a > i {
		font-size: 1.1rem;
		transform: rotate(-90deg);
		transition: 0.7s;
	}

	.dropdown i {
		font-size: 1rem;
		transition: 0.7s;
	}

	.donateButton {
		background-color: #088b60;
		width: fit-content;
		padding: 0.3em 2em;
		position: absolute;
		top: 0;
		left: 0;
	}

	.footer-socialmedia-section {
		display: flex;
		justify-content: flex-end;
		/* align-items: flex-end; */
		/* align-content: flex-end; */
		padding: 0;
		padding-right: 0;
	}

	.footer-socialmedia-section a:first-child {
		margin-left: 0;
	}

	.container_1200px_slider {
		max-width: 100vw;
		margin: 0 auto;
		padding: 0;
	}

    .banner-image .overlap-title {
        top: 90%;
    }

    .postcard__excerpt {
        display: none;
    }

    .postcard__details {
        align-self: flex-start;
    }

    .postcard__image-holder {
        min-width: 180px;
        max-width: 180px;
        max-height: 180px;
        border: 1px solid rgba(0, 0, 0, 0.1);
        border-radius: 12px;
        overflow: hidden;
    }

    .postcard__image-holder>img {
        width: 100%;
        height: 180px;
        object-fit: cover;
    }

    .category__container {
        justify-content: flex-start;
        gap: 18px;
    }

}

@media (max-width: 660px) {
    .banner-image .overlap-title {
        top: 85%;
        min-width: 85vw;
    }

    .postcard__image-holder {
        min-width: 100px;
        max-width: 100px;
        max-height: 100px;
        border: 1px solid rgba(0, 0, 0, 0.1);
        border-radius: 12px;
        overflow: hidden;
        align-self: center;
    }

    .postcard__image-holder>img {
        width: 100%;
        height: 100px;
        object-fit: cover;
    }
}

/* tablet, mobile */
@media (max-width: 1200px) {
	.columns-section {
		display: flex;
		flex-direction: column;
		flex-wrap: nowrap;
		gap: 2em;
	}

	/* .columns-section:nth-child(n+1) {
        flex-direction: column-reverse;
    } */

	.columns-section .column {
		padding: 0.5em 0;
	}

	.column.large {
		min-width: 50vw;
		max-width: 100%;
	}

	.column.medium {
		min-width: 50vw;
		max-width: 100%;
	}

	.column.narrow {
		min-width: 50vw;
		max-width: 100%;
	}

	.news-item {
		flex-direction: column;
		gap: 0.1em;
		padding: 0.3em 0.75em;
	}

	.news-item a {
		margin: 0.1em 0;
	}

	.donateButton {
		background-color: #088b60;
		width: fit-content;
		padding: 0.3em 2em;
		position: absolute;
		top: 0;
		left: 0;
	}

	.footer-socialmedia-section {
		display: flex;
		justify-content: flex-end;
		/* align-items: flex-end; */
		/* align-content: flex-end; */
		padding: 0;
		padding-right: 0;
	}

	.footer-socialmedia-section a:first-child {
		margin-left: 0;
	}

	.container_1200px_slider {
		max-width: 100vw;
		margin: 0 auto;
		padding: 0;
	}
}

/* desktop */
@media (min-width: 1199px) {
	.columns-section {
		display: flex;
		flex-direction: row;
		justify-content: space-between;
		padding: 1em 0;
		flex-wrap: nowrap;
		gap: 2em;
	}

	/* .columns-section .column { */
	/* padding-right: 3vw; */
	/* } */

	.columns-section .column:last-child {
		padding-right: 0;
	}

	.equal-width {
		flex: 1;
		/* padding-right: 2em; */
	}

	.equal-width:last-child {
		padding-right: 0;
	}

	.news-item {
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding: 0.75em 2em;
		border-bottom: 1px solid #bbc7c3;
	}

	.news-item a {
		display: inline-block;
		padding: 0;
		margin: 0;
		font-family: 'arvoregular', serif;
		font-weight: 400;
		text-decoration: none;
	}
}
