@charset "UTF-8";
@import url(http://fonts.googleapis.com/css?family=Roboto+Slab:400,700,300);
@import url(http://fonts.googleapis.com/css?family=Average|Sorts+Mill+Goudy|Lusitana:400,700);

html,body,section,div,span,a,p,h1,h2,h3,h4,h5,h6,ul,ol,dl,dd,li,address,table,tr,th,td,img,form,strong,input {
	font-weight: normal;
	font-style:normal;
}

html,body {
    height: 100%;
}

body > #wrapper {
    height: auto;
}

*, *:after, *:before { -webkit-box-sizing: border-box; box-sizing: border-box; }
.clearfix:before, .clearfix:after { content: ''; display: table; }
.clearfix:after { clear: both; }

body {
	color: #000;
	font-weight: 400;
	font-size: 14px !important;
	font-family: 'Roboto Slab', 'YuGothic', 'Yu Gothic', '游ゴシック', '游ゴシック体', sans-serif;
}

a {
	color:#696d6b;
	text-decoration: none;
	outline: none;
}

a:hover, a:focus {
	color:#6ca0f3;
	outline: none;
}

button:focus {
	outline: none;
}

#wrapper a { color: #6ca0f3 !important; }
#wrapper a:hover { color: #333 !important; text-decoration:underline; }

.content-wrap {
	overflow-y: scroll;
	-webkit-overflow-scrolling: touch;
}


header {
	width:100%;
	position:absolute;
	z-index:10;
	text-align:center;
	top:65px;
}

header img {
	width:60%;
	max-width:300px;
	margin:0 auto;
}

#menuicons {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	z-index:10;
}

#menuicons .fa-bars {position:absolute; top: 15px; left:15px; color:#696d6b;}
#menuicons .fa-home {position:absolute; top: 15px; right:15px; color:#696d6b;}
#menuicons a:hover .fa { color:#333 !important;}

body.show-menu #menuicons .fa-bars { color:#fff !important;}

footer {
	text-align:center;	
}

footer a {
	width:100%;
	padding:7px 0 10px;
	background:#ddd;
	display:block;
	margin-top:35px;	
}


@media screen and (max-width: 40em) {
	body {
		font-size: 80%;
	}
}

@media screen and (max-width: 25em) {

	.codrops-icon {
		font-size: 250%;
	}

	.codrops-icon span {
		display: none;
	}

}