@import url('https://fonts.googleapis.com/css2?family=Ubuntu+Condensed&display=swap');
@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css");

/* @import url('https://fonts.googleapis.com/css2?family=Black+And+White+Picture&family=Viaoda+Libre&display=swap'); */
@import url('https://fonts.googleapis.com/css2?family=Black+And+White+Picture&family=Gentium+Plus:ital,wght@0,400;0,700;1,400;1,700&family=Viaoda+Libre&display=swap');

body {
	/*font-family: "Ubuntu Condensed", sans-serif;*/
  font-family: "Gentium Plus", serif;
  font-weight: 400;
  font-style: normal;
}

header {
	position	: fixed;
	top		: 0;
	z-index		: 99;
	width		: 100%;
	background	: var(--bg-header);
	box-sizing	: border-box;
	backdrop-filter	: blur(5px);
	height		: 75px;
}
	header + div {
		margin-top	: 75px;
	}

/*header nav {
	background	: var(--bg-header);
}*/
	/*header nav li {
		display		: flex;
		height		: 100%;
	}*/
	header nav li:hover {
		background	: rgba(255,255,255,.25);
	}
	header nav ul > li > ul {
		background	: var(--bg-header);
		backdrop-filter	: blur(5px);
	}

header a {
	opacity		: .85;
	padding		: 10px;
	text-decoration	: none;
	font-weight	: bold;
	font-size	: 16px;
}
	header a:hover {
		opacity		: 1;
	}

header nav.social-icons {
	font-size	: 1.25rem;
}

.banner-homepage {
	position	: relative;
	/*width		: 100vw;
	height		: 100vh;*/
	max-width	: 100%;
	/*background	: url(../images/hero-bg.jpg) left top;*/
	/*background	: #f0fbfd url(../images/lighthouse-inna.jpg) left top no-repeat;*/
	background	: #f0fbfd url(../images/lighthouse-light-bg-gradient.png) left top no-repeat;
	background-size	: contain;
	/*padding-top	: 75px;*/
}
	.banner-homepage > .banner-container {
		position	: relative;
		height		: 100%;
		display		: flex;
		flex-direction	: row;
		align-items	: center;
		justify-content	: center;
		/*margin-left	: 50%;*/
		padding		: 0px;
	}

	.banner-homepage-content {
		display		: flex;
		flex-direction	: column;
		height		: 100%;
		justify-content	: center;
		text-align	: center;
		/*padding		: 0 10% 10% 0;*/
		font-size	: 2rem;
		box-sizing	: border-box;
		/*color		: #0674ac;*/
	}
		.banner-homepage-content > h1 {	
			/*color		: #0674ac;*/
			/*border-bottom	: 3px solid #0674ac;*/
			padding		: 0 0 20px 0;
			display		: inline-block;
			margin-bottom	: 10px;
		}
		.banner-homepage-content > p {
			color		: #599296;
			font-weight	: bold;
			line-height	: 150%;
		}
	.banner-homepage .banner-image {
		margin-top	: 2rem;
		/*position	: absolute;
		left		: 20px;
		bottom		: -2px;
		height		: 100%;*/
	}

@media (max-width: 600px) {
	.banner-homepage {
		background-size	: cover;
		background-position: -100px top;
	}
	.banner-homepage > .banner-container {
		padding		: 0;
		height		: auto;
		flex-direction	: column;
	}
	.banner-homepage > .banner-container > .banner-homepage-content {
		/*margin-left	: 150px;*/
		font-size	: 1rem;
		margin-top	: 30px;
		padding		: 10px;
		justify-content	: flex-start;
	}
	.banner-homepage-content > h1 {
		font-size	: 1.25rem;
		border		: none;
		margin		: 0;
		padding		: 0;
		margin-bottom	: 10px;
	}
	.banner-homepage-content > p {
		margin		: 0;
		margin-bottom	: 10px;
		line-height	: 125%;
	}
	.banner-image {
		max-width	: 50%;
	}
}

@media (max-width: 600px) {
	.item-list-circles .items_list {
		grid-template-columns: repeat(1, 1fr);
	}
	.items_list_faq {
		grid-template-columns: repeat(1, 1fr);
	}
	.items_list {
		grid-template-columns: repeat(1, 1fr);
	}
}

@media (max-width: 1200px) {
	/*.banner-homepage > .banner-container {
		justify-content	: center;
		align-items	: flex-end;
		margin		: auto;
	}
	.banner-homepage-content {
		font-size	: 2rem;
		justify-content	: flex-start;
		align-items	: center;
		padding		: 15% 10% 0 0;
	}*/
}

@media (max-width: 1024px) {
	/*.banner-homepage {
		background-position	: -200px top;
	}
	.banner-homepage > .banner-container {
		margin		: auto;
		align-items	: center;
	}
	.banner-homepage-content {
		font-size	: 1.75rem;
		justify-content	: flex-start;
		align-items	: center;
		padding		: 25% 10px 0 35%;
		margin-left	: 10px;
	}*/
}

@media (max-width: 400px) {
	/*.banner-homepage-content {
		height		: auto;
		text-align	: center;
		background	: rgba(255,255,255,.85);
		padding		: 40px;
		text-align	: center;
		border-radius	: 10px;
		box-sizing	: border-box;
		box-shadow	: 0 0 25px -5px rgba(0,0,0,.25);
		border		: 1px solid rgba(255,255,255,.5);
		margin		: 20px;
	}*/
}

@media (min-width: 400px) {
	/*.banner-homepage-content > h1 {
		font-size	: 3rem;
	}*/
}


.contactForm {
	background	: #a3c6c8;
	color		: white;
	padding		: 0 20px;
	/*text-align	: center;*/
}
	.contactForm > .container {
		padding		: 40px;
	}
	.contactForm .btn {
		background	: #599296;
		margin		: 20px;
		padding		: 20px 40px;
	}
	.contactForm h2 {
		font-size	: 3rem;
	}


.styled_Form {
    max-width: 38.75rem;
    margin: 2.9375rem auto 0;
}
@media (min-width: 576px) {
    .styled_Form .form_row {
        display: flex;
        justify-content: space-between;
    }
}
.styled_Form .form_row .form_item {
    flex: 0 0 48%;
    margin-bottom: .75rem;
}
.styled_Form label {
    color: #fefbec;
    display: block;
    font-weight: 700;
    font-size: 1rem;
    margin-bottom: .75rem;
}
.styled_Form input[type=text],
.styled_Form input[type=tel],
.styled_Form input[type=email],
.styled_Form input[type=time],
.styled_Form input[type=datetime-local],
.styled_Form textarea,
.styled_Form select {
    width: 100%;
    border: 1px #127064 solid;
    border-radius: 5px;
    padding: 12px 15px;
    font-size: 1rem;
    outline: 0;
    /*margin: 10px;*/
    box-sizing: border-box;
}

.contactMap > .container {
	width		: 100%;
	max-width	: 100%;
	margin		: 0;
	padding		: 0;
}

footer {
	padding		: 40px;
	background	: #599296;
	color		: white;
}

.bg-custom-dark {
	background	: var(--bg-custom-dark);
	color		: var(--text-custom-light);
}
	.bg-custom-dark h2,
	.bg-custom-dark h3,
	.bg-custom-dark h4,
	.bg-custom-dark h5 {
		color		: var(--text-custom-light);
	}

.h1-big-center {
	text-align	: center;
}

.items_list--left_right {
	display		: flex;
	flex-direction	: column;
	align-items	: center;
	gap		: 40px;
	margin		: 40px;
	position	: relative;
}
.items_list--left_right > .item {
	display		: flex;
	gap		: 20px;
	/*max-width	: 600px;*/
	z-index		: 2;
}
	.items_list--left_right > .item--reverse {
		flex-direction	: row-reverse;
	}
.items_list--left_right .item__image {
	width		: 128px;
	height		: 128px;
	border		: 2px solid #a3c6c8;
	/*padding		: 3px;*/
	border-radius	: 50%;
	flex		: 0 0 auto;
	overflow	: hidden;
	display		: flex;
	justify-content	: center;
}
	.items_list--left_right .item__image > svg {
		width		: 100%;
		height		: 100%;
		fill		: #a3c6c8;
	}
	.items_list--left_right .item__image > img {
		max-width	: 100%;
		max-height	: 100%;
		object-fit	: cover;
	}
.items_list--left_right .item__content {
	border		: 1px solid #a3c6c8;
	border-radius	: 20px;
	padding		: 20px;
	max-width	: 600px;
	background	: #f1f7f7;
	color		: initial;
}
	.items_list--left_right .item__content h3 {
		margin-bottom	: .75rem;
		color		: #72a2a6;
	}
.items_list--left_right:before {
	content		: '';
	position	: absolute;
	left		: 50%;
	top		: 0;
	bottom		: 0;
	border-left	: 1px dotted rgba(89, 146, 150, .85);
	z-index		: 1;
}

@media (max-width: 576px) {
	.items_list--left_right {
		margin		: 0;
	}
	.items_list--left_right > .item {
		flex-direction: column-reverse;
		align-items: center;
	}
	.items_list--left_right .item__image {
		background: white;
	}
}

@media (max-width: 576px) {
	.content--image {
		display		: flex;
		flex-direction: column-reverse;
		margin: auto;
	}
	.content--image.content--image-right {
		flex-direction: column;
	}
	.grid-2 .items_list,
	.grid-3 .items_list,
	.grid-4 .items_list {
		grid-template-columns: repeat(1, 1fr);
	}
}

article .container > .content {
	margin-bottom		: 3rem;
}

.items_list .item > iframe {
	width		: 100%;
	height		: 100%;
	min-width	: 300px;
	min-height	: 300px;
}
	.items_list.items_list--single .item > iframe {
		aspect-ratio: 1 / 1;
		max-height: 70vh;
	}

.btn-primary {
	background	: rgba(89, 146, 150, .75);
	color		: white;
}
	.btn-primary:hover {
		background	: rgba(89, 146, 150, 1);
	}