/* BODY 
font-family: 'Roboto', sans-serif;
*/

body{ 
	margin: 0px;
	padding: 0px;
	background: #eae3d9;
}

html, body {
	height: 100%;
	margin: 0px;
	padding: 0px;
}

/**/

a{
	outline: none;
}

.radius{
	-webkit-border-radius:  18px; /* Safari, Chrome */
	-khtml-border-radius:  18px;    /* Konqueror */
	-moz-border-radius:  18px; /* Firefox */
	border-radius: 18px;
} 

.cl{
	clear: both;
}

/* LAYOUT */

@media only screen and (min-width: 1000px)
{
	.dog{
	background: url('../images/top.jpg') center top no-repeat;
	background-size: auto;
	min-height: 547px;
	z-index: 20;
}
	
	.name{
		padding: 460px 0 100px 0;
		margin: 0px auto;
	}
	
	#content{
		width: 1000px;
	}
	
	.name{
	width: 750px;
	text-align: right;
	}
	
	.top-icon{
			float: left;
		}
}

@media only screen and (min-width: 530px) and (max-width: 999px)
{

.dog{
	background: url('../images/top.jpg') center top no-repeat;
	background-size: 1000px;
	min-height: 547px;
	z-index: 20;
}
	
	.name{
		padding: 250px 0 100px 0;
		margin: 0px auto;
	}
	
	#content{
		width: 100%;
	}

	.pad{
		padding: 10px;
	}
	
	.name{
	width: 100%;
	text-align: center;
	}
	
	.top-icon{
			float: left;
		}
}

@media only screen and (max-width: 529px)
{

	.dog{
		background: url('../images/top.jpg') center top no-repeat;
		background-size: 700px;
		min-height: 547px;
		z-index: 20;
	}
	
	.name{
		padding: 50px 0 20px 0;
		margin: 0px auto;
	}
	
	#content{
		width: 100%;
	}
	
	.pad{
		padding: 10px;
	}
	
	.name{
	width: 100%;
	text-align: center;
	}
	
	.top-icon{
			margin: 0px auto;
		}
	
}




.top{
	background: url('../images/top.png') center bottom no-repeat;
	z-index: 2;
}


	
.menu{
	margin: 0 auto 0 auto;
	height: 60px;
	background: #dab0ae;
	-webkit-transition: background 500ms ease;
	-moz-transition: background 500ms ease;
	-o-transition: background 500ms ease;
	-ms-transition: background 500ms ease;
	transition: background 500ms ease; 
}

	.menu ul{
		padding: 0;
		margin: 0;
		text-align: center;
	}

	.menu li{
		display: inline;
		margin-right: 10px;
		font-family: 'Roboto', sans-serif;
		font-weight: 900;
		text-decoration: none;
		margin: 0 40px 0 0;
		padding: 0;
		
	}
	
	.menu li:last-child{
		margin: 0 0 0 0;
		padding: 0;
		
	}
	
		.menu a:link, .menu a:visited{
			text-decoration: none;
			color: #936a6a;
			line-height: 60px;
		}
	




.content{
	min-height: 700px;
	background: #eae3d9;
	z-index: 2;
	padding-bottom: 50px;
}

	#content{
		margin: 0px auto;
		text-align: justify;
	}
	
	#toplists{
		min-height:600px;
		padding: 50px;
		background: url('../images/tops-bg.jpg') fixed no-repeat #25144b;
	}
	
		#toplists h1{
			color: #fff;
			margin-bottom: 20px;
			
		}
	
		.top-icon{
			width: 250px;
			height: 250px;
			text-align: center;
			margin-bottom: 30px;
		}
		
			.top-icon h2{
				font-family: 'Roboto', sans-serif;
				color: #fff;
				font-size: 25px;
				line-height: 37px;
				margin: 0;
				padding: 20px;
				text-align: center;
				
			}
			
			.top-icon a:link{
				text-decoration: none;
			}
			
			.icon{
				height:140px;
				text-indent: -200000px;
				width: 140px;
				display: block;
				margin: 0px auto;
				border-radius: 50%;
				background: url('../images/paw.jpg') center no-repeat;
				background-size: contain;
				border: #d2c4ba solid 9px;

			}
			
			.icon:hover{
				height:140px;
				text-indent: -200000px;
				width: 140px;
				display: block;
				margin: 0px auto;
				border-radius: 50%;
				background: url('../images/paw.jpg') center no-repeat;
				background-size: contain;
				border: #a55173 solid 9px;

			}
	
	.content h1{
		font-family: 'Roboto', sans-serif;
		color: #975f73;
		font-size: 40px;
		line-height: 37px;
		margin: 0;
		padding: 20px;
		text-align: center;
	}
	
#info{
	max-width: 950px;
	padding: 15px;
	margin: 0px auto;
}

	#info p{
		font-family: 'Roboto', sans-serif;
		font-size: 16px;
		font-weight: 300;
	}
	
	#info h2{
		font-family: 'Roboto', sans-serif;
	}
	
#yearbooks{
	background: #fffbf6;
	padding: 30px;
}

#yearbooks ul{
	text-align: center;
	margin: 0;
	padding: 0;
}

#yearbooks li{
	list-style-type: none;
	text-align: center;
	display: inline-block;
	margin: 20px;
}
	
	#yearbooks li a:link{
			font-family: 'Roboto', sans-serif;
			font-weight: 900;
			text-transform: uppercase;
			color: #fffbf6;
			text-decoration: none;
			display: inline-block;
			background: #915154;
			font-size: 15px;
			line-height: 30px;
			margin: 0 10px 20px 10px;
			padding: 20px 20px 10px 20px;
			text-align: center;
			-webkit-border-radius:  30px; /* Safari, Chrome */
			-khtml-border-radius:  30px;    /* Konqueror */
			-moz-border-radius:  30px; /* Firefox */
			border-radius: 30px;
	}
	
	#yearbooks a{
		color: #fffbf6;
	}
	
	#yearbooks a:hover{
		color: #ffc0c3;
	}
	
	#yearbooks img{
-webkit-border-radius:  30px; /* Safari, Chrome */
			-khtml-border-radius:  30px;    /* Konqueror */
			-moz-border-radius:  30px; /* Firefox */
			border-radius: 30px;	
	}
	
#informations{
	text-align: center;
	margin: 100px 0px 100px 0px;
}
	
	#informations h1{
		font-family: 'Roboto', sans-serif;
		color: #975f73;
		font-size: 50px;
		line-height: 37px;
		margin: 20px;
		padding: 20px;
		text-align: center;
	}
	
		#informations a:link,.button a:link{
			font-family: 'Roboto', sans-serif;
			font-weight: 900;
			text-transform: uppercase;
			color: #fffbf6;
			text-decoration: none;
			display: inline-block;
			background: #915154;
			font-size: 28px;
			line-height: 40px;
			margin: 0 10px 20px 10px;
			padding: 15px 30px 15px 30px;
			text-align: center;
			-webkit-border-radius:  30px; /* Safari, Chrome */
			-khtml-border-radius:  30px;    /* Konqueror */
			-moz-border-radius:  30px; /* Firefox */
			border-radius: 30px;
		}
		
			#informations a, .button a, .button{
		color: #fffbf6 !important;
	}
	
	#informations a:hover, .button a:hover{
		color: #ffc0c3;
	}
	
#counter{
	background: #c3576b;
	min-height: 300px;
	margin-bottom: 80px;
	text-align: center;
	padding: 30px;
}

#counter h1{
		font-family: 'Roboto', sans-serif;
		font-weight: 300;
		font-size: 25px;
		display: inline-block;
		padding: 0 0 10px 0;
		color: #eae3d9;
		margin: 0 0 10px 0;
}	


	ul.countdown {
		list-style: none;
		font-family: 'Roboto', sans-serif;
		color: #fff;
		margin: 50px 0;
		padding: 0;
		display: block;
		text-align: center;
	}
	
	ul.countdown li {
		display: inline-block;
		margin: 0 20px 0px 20px;
	}
	
	
	ul.countdown li span {
		font-size: 80px;
		font-weight: 300;
		line-height: 80px;
		font-weight: 900;
	}
	
	ul.countdown li.seperator {
		font-size: 80px;
		line-height: 100px;
		vertical-align: top;
	}
	
	ul.countdown li p {
		color: #fff;
		font-size: 14px;
	}

#order{
	text-align: center;
	font-family: 'Roboto', sans-serif;
	font-weight: 900;
	color: #915154;
	font-size: 20px;
}

#order a:link{
	color: #915154;
}

#footer{
	background: #915154 center top no-repeat;

}

	.up{
		background: url('../images/bottom.png') center top no-repeat;
		height: 300px;
		padding-top: 30px;
		border-bottom: 1px solid #493728;
	}
	
		.up-link{
			text-indent: -3000px;
			background: url('../images/up.png') center top no-repeat;
			width: 100px;
			height: 70px;
			display: block;
			margin: 0px auto;
		}
	


/*  TYPO */

.content{
	font-family: 'Open Sans', sans-serif;
	color: #524438;
	font-size: 13px;
	line-height: 23px;
}

	.content a{
		color: #762424;
	}
	
	.content a:hover{
		color: #ca0909;
	}

	.name h1{
		font-family: 'Roboto', sans-serif;
		text-transform: uppercase;
		font-size: 45px;
		text-shadow: 0px 0px 35px #431a1b;
		display: inline-block;
		border-bottom: 2px solid #eae3d9;
		padding: 0 0 10px 0;
		color: #eae3d9;
		margin: 0 0 10px 0;
	}

	.name h2{
		text-shadow: 0px 0px 25px #000;
		font-family: 'Roboto', sans-serif;
		text-transform: uppercase;
		font-size: 45px;
		font-weight: 100;
		margin: 0 0 20px 0;
		color: #eae3d9;
	}
	
	.up{ text-align: center; }
	
	.up h1{
		font-family: 'Roboto', sans-serif;
		text-transform: uppercase;
		font-size: 45px;
		display: inline-block;
		padding: 0 0 10px 0;
		color: #eae3d9;
		margin: 0 0 10px 0;
	}
	
	.up a:link{
		font-family: 'Roboto', sans-serif;
		text-transform: uppercase;
		font-size: 25px;
		font-weight: 900;
		text-decoration: none;
		display: inline-block;
		padding: 0 0 10px 0;
		color: #eae3d9;
		margin: 0 0 10px 0;
	}