@charset "utf-8";
/* CSS Document */

body {
	margin: 0;
	background: lightgray;
	font-family: sans-serif;
}

#container {
	width: 80%;
	min-width: 780px;
	max-width: 1280px;
	margin: 0 auto;
}

header {
	background: black;
	color: white;
	height: 200px;
	text-align: center;
	padding-top: 25px;
	padding-bottom: 225px;
	box-sizing: border-box;
	
}

header h1 {
	font-size: 90px;
	margin-top: 0;
}

header h2 {
	font-size: 22px;
	margin: 0;
}

nav {
	background: darkgrey;
}

nav ul {
	margin: 0;
	padding: 0;
	list-style: none;
	text-align: center;
}

nav ul l1 {
	display: inline;
}

nav a {
	color: white;
	text-decoration: none;
	text-transform: uppercase;
	background: #226699;
	display: block;
	width: 25%;
	height: 60px;
	line-height:60px;
	text-align: center;
	float: left;
	border:solid 5px darkgrey;
	box-sizing: border-box;
	border-radius: 12px;
}

nav a:hover {
	background: lightblue;
	color:black;
}

section {
	background: white;
	padding: 50px;
}

footer {
	padding: 25px;
	text-align: center;
	font-size: 18px;
	font-weight: bold;
	background: black;
	color: white;
	clear: both;
}

.clear {
	clear: both;
}

/* ----- Color ----- */

.colors {
	clear: both;
	margin: 12px 0;
}

.colors div {
	width: 100px;
	height: 100px;
	border: solid 1px black;
	text-align: center;
	float: left;
	margin-bottom: 20px;
}

.c1 {
	background: #1272DB;
}

.c2 {
	background: #DB7212;
}

.c3 {
	background: #61452C;
}

.c4 {
	background: #35485C;
}

.c5 {
	background: #355C57;
}

.b-c1 {
	background: #1C2559;
}

.b-c2 {
	background: #152040;
}

.b-c3 {
	background: #5D75A6;
}

.b-c4 {
	background: #BCBF5A;
}

.b-c5 {
	background: #F2DEA2;
}

/* ----- Type -----*/

.nothing-you could do-regular {
  font-family: "Nothing You Could Do", cursive;
  font-weight: 400;
  font-style: normal;
}

// <uniquifier>: Use a unique and descriptive class name
// <weight>: Use a value from 300 to 900

.merienda-<uniquifier> {
  font-family: "Merienda", cursive;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
}

.kaushan-script-regular {
  font-family: "Kaushan Script", cursive;
  font-weight: 400;
  font-style: normal;
}

.Type h4 {
	font-family: "Kaushan Script", cursive;
	font-size: 50px;
	letter-spacing: 4px;
	margin-bottom: -10px;
	color: #F2DEA2;
	text-shadow: 5px -2px 0 #61452C;
}

.Type h5 {
	font-family: "Nothing You Can Do", cursive;
	font-size: 32px;
	line-height: 36px;
	color: #BCBF5A;
	text-shadow: 2px 2px 0 #355C57;
}

.Type p {
	font-family: "Merienda", cursive;
	font-size: 18px;
	line-height: 32px
}

/* ----- Gallery ----- */

.Gallery img {
	max-width: 50%;
}

.Gallery h4 {
	margin-top: 50px;
}