@import url(http://fonts.googleapis.com/css?family=Amatic+SC:700); /* Amatic SC font rom google fonts */

body {
	font-family: "Avenir Next", "Helvetica Neue", Helvetica, Arial, sans-serif;
	background-color: #cbe9ff;
}

h1 {
	font-family: "Amatic SC", "Avenir Next", "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-weight: 100;
	text-align: center;
	font-size: 100pt;
	color: #052239;
	padding: 0;
}

h2 {
	font-family: "Avenir Next", "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-weight: 100;
	text-align: center;
	font-size: 20pt;
	color: #052239;
}

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

nav ul li {
	display: inline-block;
	margin-left: 10px;
	margin-right: 10px;
	margin-bottom: 19.5px;
	text-align: center;
	font-weight: 600;
}

nav ul a {
	color: white;
	text-decoration: none;
	font-size: x-large;
	width: 110px;
	display: block;
	padding-top: 39px;
	padding-bottom: 38px;
	background-color:  #12456a;
	transition: background-color 0.35s ease-out;
	border-radius: 8px;
}

nav ul a:hover {
	color: white;
	background-color: #2f8dcf;
}

nav .active {
	background-color: #2674ab;
}

.section-wrapper {
	display: block;
	position: relative;
	height: 370px;
	margin-top: 50px;
	margin-left: 50px;
	margin-right: 50px;
}

section {
	position: absolute;
	left: 0;
	top: 360px;
	opacity: 0;
	transition: opacity 0.3s linear;
}

section ul {
	list-style-type: none;
	padding: 0;
	margin-top: 0;
}

section li {
	margin-bottom: 15px;
}

.show {
	opacity: 1;
	transition-delay: 0.3s;
	z-index: 100;
}

.show-tv #tv {
	opacity: 1;
	transition-delay: 0.3s;
}
.show-movies #movies {
	opacity: 1;
	transition-delay: 0.3s;
}
.show-videos #videos {
	opacity: 1;
	transition-delay: 0.3s;
}
.show-music #music {
	opacity: 1;
	transition-delay: 0.3s;
}
.show-books #books {
	opacity: 1;
	transition-delay: 0.3s;
}
.show-other #other {
	opacity: 1;
	transition-delay: 0.3s;
}

.hide {
	display: none;
}

.buttons {
	text-color: white;
}

/* Unvisited Link */
article ul :link {
	color: #052239;
	text-decoration: none;
	font-size: 20px;
}

/* Hover Link */
article ul :hover {
	color: #2f8dcf;
	text-decoration: none;
	transition: 0.25s ease-out;
}

/* Selected Link */
article ul .active {
	color: #2674ab;
	text-decoration: none;
}

/* Visited Link */
article ul :visited {
	color: #052239;
	text-decoration: none;
}
	
screen {
	display: inline-block;
	padding-left: 1500px;
	margin-left: 1500px;
}

.video-preview {
	top: 0;
	right: 0;
}

/* 400px and up */
@media (min-width: 400px) {
	nav ul {
		width: 390px;
		margin-left: auto;
		margin-right: auto;
	}
}

/* 800px and up */
@media (min-width: 800px) {
	nav ul {
		width: auto;
	}
	section {
		width: 33.333333%;
		position: absolute;
		top: 0;
	}
	.video-preview {
		width: 66.666666%;
		position: absolute;
	}
}


/* Current Buttons:
	background-color: #177676;
	hovor-color: #22cec8;
	selected-color: #25afad
	
	#043f5b
*/