*, ::before, ::after {
	box-sizing: border-box;
}

html, body {
	margin: 0;
	padding: 0;
}

body {
	font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
	font-size: 1.5rem;
	color: #333;
}

header {
	text-align: center;
	padding: 5rem 0;
	background-color: #FFD3D5;
	background-image: repeating-linear-gradient(45deg, #f7CACA, #f7CACA 20px, transparent 20px, transparent 40px);
}

h1 {
	font-family: 'Fredericka the Great', sans-serif;
	font-size: 5rem;
	font-weight: normal;
	margin-top: 0;
}

h2 {
	font-size: 2rem;
	font-weight: normal;
	color: #A6D63D;
}

header p {
	max-width: 900px;
	margin: 0 auto;
	padding: 10px;
}

section {
	padding: 5rem;
}

.container {
	max-width: 1400px;
	margin: 0 auto;
}

.container p {
	text-align: justify;
}

img {
	width: 34%;
	border-radius: 10px;
	-webkit-transition: all 0.7s ease;
	   -moz-transition: all 0.7s ease;
		-ms-transition: all 0.7s ease;
		 -o-transition: all 0.7s ease;
		    transition: all 0.7s ease;
}

img:hover {
	-webkit-transform: scale(1.15);
	   -moz-transform: scale(1.15);
		-ms-transform: scale(1.15);
		 -o-transform: scale(1.15);
		 	transform: scale(1.15);
}

section:nth-child(odd) {
	background-color: #CAF4F1;
	background-image: linear-gradient(to bottom, #CAF4F1, #95E0DA)
}

section:nth-child(odd) img {
	float: left;
	margin-right: 5rem;
}

section:nth-child(odd) img:hover {
	-webkit-box-shadow: 0px 0px 10px #288C85;
	   -moz-box-shadow: 0px 0px 10px #288C85;
			box-shadow: 0px 0px 10px #288C85;
}

section:nth-child(odd) h2 {
	color: #288C85;
}

section:nth-child(even) {
	background-color: #F0FDD1;
	background-image: linear-gradient(to bottom, #F0FDD1, #E0FAA7)
}

section:nth-child(even) img {
	float: right;
	margin-left: 5rem;
}

section:nth-child(even) img:hover {
	-webkit-box-shadow: 0px 0px 10px #A6D63D;
	   -moz-box-shadow: 0px 0px 10px #A6D63D;
			box-shadow: 0px 0px 10px #A6D63D;
}

section:nth-child(even) h2 {
	color: #288C85;
}

.clearfix {
	clear: both;
}

@media (max-width: 1100px){
	section {
		text-align: center;
	}

	img {
		float: none !important;
		width: auto;
		max-width: 100%;
		margin-left: 0 !important;
		margin-right: 0 !important;
		-webkit-transition: none;
		   -moz-transition: none;
			-ms-transition: none;
			 -o-transition: none;
				transition: none;
	}

	img:hover {
		-webkit-transform: none;
		   -moz-transform: none;
			-ms-transform: none;
			 -o-transform: none;
			 	transform: none;
	}
}

@media (max-width: 700px){
	body {
		font-size: 1.25rem;
	}

	h1 {
		font-size: 3rem;
	}

	h2 {
		font-size: 1.5rem;
	}

	section {
		padding: 2rem 0.75rem;
	}
}