
/*azul petroleo: #0c455a*/
/*turquesa: #46a2a4*/
/*mostaza: #e9a539 */

html {
	font-size: 18px;
	scroll-behavior: smooth;
}

body {
	padding: 0;
	font-family: Lato;
}

a {
	text-decoration: none;
}

h1,
h2,
header {
	font-family: amatic_regular;
}

h1 {
	font-size: 60px;
	margin: 50px 0;
	text-align: center;
}

h2 {
	font-size: 35px;
}

input[type="submit"],
button {
	padding: 10px 25px;
	background-color: #0c455a;
	color: white;
	text-transform: uppercase;
	font-size: 18px;
	border: none;
	border-radius: 15px;
	font-family: Lato;
	font-weight: 600;
}

textarea,
input {
	font-size: 1rem;
}

iframe {
	/*box-shadow: 10px 10px 10px rgba(0,0,0,.3);*/
	z-index: 100;
	margin: 10px;
}



/* SECTION */

section {
	padding: 0 50px;
}

	section h2 {
		text-align: center;
	}

/* HEADER */

header {
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	align-items: center;
	padding: 20px 0 25px 0;
	margin-top: 0px;
	/*background: linear-gradient(#46a2a455, white);*/
	background-image: url("../img/header2.jpeg");
	background-size: cover;
	color: white;
	position: relative;
	text-shadow: 1px 1px 3px black;
}

	.photo-credit,
	.doodad {
		position: absolute;
		z-index: 100;
	}

		.photo-credit {
			bottom: 5px;
			right: 10px;
			font-size: 1.1em;
		}

		.cloud1 {
			top: 8%;
			left: 11%;
			width: 600px;
			filter: blur(3px);
		}

		.cloud2 {
			top: 30%;
			right: 8%;
			width: 400px;
			filter: blur(3px);
		}

		.bird {
			top: 100px;
			right: 100px;
			width: 100px;
			filter: blur(2px);
			transform: scaleX(-1);
		}

		.beach {
			bottom: 0;
			width: 100%;
			/*filter: blur(2px);*/
		}

	header h2 {
		margin: 0;
		margin-top: 15px;
		margin-bottom: 10px;
		line-height: .6;
		z-index: 100;
	}

	header iframe {
		width: 50%;
		margin-bottom: 40px;
	}


	header button {
		margin: 10px 0;
		z-index: 100;
		font-family: "Lato";
	}

		button img {
			width: 30px;
			margin-right: 10px;
		}

		.podcast-links {
			display: flex;
			justify-content: space-around;
			z-index: 100;
			column-gap: 25px;
			row-gap: 25px;
			padding: 20px;
			flex-wrap: wrap;
			/*margin-top: 15px;*/
			margin-bottom: 20px;
		}

			.podcast-links img {
				width: 50px;
				transition: scale .3s;
			}

				.podcast-links img:hover {
					scale: 1.3;
				}



/* SUBTITLE */

.subtitle {
	display: flex;
	flex-direction: column;
	align-items: center;
	background-color: #0c455a;
	color: white;
	padding: 20px 0 20px 0;
	margin-top: 0px;
}

/* VIDEO */

.video {
	display: flex;
	flex-direction: column;
	align-items: center;
	padding-bottom: 20px;
}


/* DESCRIPTION */

.description p {
	width: 80%;
	max-width: 900px;
	margin: 50px auto;
	line-height: 1.5;

}

	.description-images {
		display: flex;
		justify-content: center;
		column-gap: 2px;
		max-width: 100%;
	}

		.description-images img {
			max-width: 25%;
			height: auto;
		}

/* EPISODES */

.episodes {
	background-color: #e8f4f4;
	padding-top: 40px;
	padding-bottom: 140px;
}

	.episodes article {
		width: 80%;
		margin: 50px auto;
		max-width: 900px;
		box-shadow: 10px 10px 20px rgba(0,0,0,.1);
	}

		.episodes article p {
			padding: 10px;
		}

		.episodes article iframe {
			width: 100%;
			margin: 0;
			box-shadow: none;
		}

		.episodes article > div {
			display: flex;
			column-gap: 20px;
			align-items: flex-end;
			background-color: white;
		}

			.episodes article div img {
				width: 300px;
				height: auto;
			}

/* CONTACT */

.contact {
	padding-top: 40px;
	padding-bottom: 60px;
}

	.contact p, .contact form {
		width: 50%;
		margin: 0 auto;
		text-align: center;
	}

		.contact form {
			margin-top: 30px;
		}

		.contact form,
		.contact form > div {
			display: flex;
			flex-direction: column;
			align-items: center;
		}

		.contact input {
			display: block;
			margin: 20px 0;
		}

			.contact input[type="email"] {
				width: 400px;
			} 

			.contact textarea {
				margin-top: 20px;
			}





/* SOCIAL MEDIA */

	.social-media h2 {
		margin-top: 0px;
		margin-bottom: 15px;
	}

	.social-media * {
		opacity: .9;
	}

	.social-media-icons {
		display: flex;
		flex-direction: row;
		justify-content: center;
	}

		.social-media-icons img {
			width: 55px;
			/*filter: invert(1);*/
			opacity: .6;
		}

/* FOOTER */

footer {
	background-color: #0c455a;
	color: white;
	display: flex;
	justify-content: space-around;
	padding-bottom: 50px;
}

	footer h2 {
		text-align: center;
	}

	footer .sc_logo {
		width: 177px;
		height: 59px;
	}

	footer .cem_logo {
		width: 161px;
		height: 74px;
	}

	footer > div > div {
		display: flex;
	}

		footer .partnership {
			width: 34%;
		}

		footer .partnership div {
			justify-content: center;
			column-gap: 50px;
		}

		footer .sponsorship div {
			justify-content: center;
		}

		footer .spaw_logo {
			width: 86px;
		}


@media(max-width:1024px){

	html {
		font-size: 16px;
	}

	.cloud1 {
		left: -5%;
	}

	.cloud2 {
		right: 2%;
	}
}

@media(max-width: 768px){
	.doodad {
		display:none;
	}

	header iframe {
		width: 85%;
		box-shadow: none;
	}

	.episodes article {
		width: 95%;
	}

		.episodes article div {
			flex-direction: column;
			align-items: center;
		}

			.episodes article h3 {
				text-align: center;
			}

	.contact p,
	.contact form {
		width: 100%;
	}



	.video iframe {
		width: 400px;
		box-shadow: none;
	}

	footer .partnership div {
		justify-content: center;
		column-gap: 50px;
		flex-direction: column;
		align-items: center;
		row-gap: 20px;
	}

		.podcast-links {
			column-gap: 5px;
		}

			.podcast-links img {
				width: 45px;
			}

}

@media(max-width: 480px){
	h1 {
		font-size: 35px;
	}

	h2 {
		font-size: 22px;
	}

	header {
		padding: 30px;
	}

		header iframe {
			height: 240px;
		}

	section {
		padding: 0px;
	}

			.podcast-links img {
				width: 40px;
			}


	.episodes {
		padding: 10px 0 50px 0 ;
	}

		.episodes h2 {
			font-size: 30px;
		}

	.contact {
		padding: 10px 0 50px 0;
	}

		.contact h2 {
			font-size: 30px;
		}

		.social-media {
			margin-top: 0;
		}

	footer {
		flex-direction: column;
	}

		footer .partnership {
			width: 100%;
		}
}


