article, aside, section {display:block;}

html{
	font: 300 1.2em/1.7 "omnes-pro", sans-serif;
	background-color: #f9f9f9;
	color: #262626;
}

body{
	padding: 0 5%;
}


/* Anti-FOUT CSS */
h1, h2, h3, h4, h5, p, ul, dl, form, a{
	transition: opacity 1s;
}

.wf-loading h1,
.wf-loading h2,
.wf-loading h3,
.wf-loading h4,
.wf-loading h5,
.wf-loading p,
.wf-loading ul,
.wf-loading dl,
.wf-loading form,
.wf-loading a{
	opacity: 0;
}

.wf-active h1,
.wf-active h2,
.wf-active h3,
.wf-active h4,
.wf-active h5,
.wf-active p,
.wf-active ul,
.wf-active dl,
.wf-active form,
.wf-active a,
.wf-inactive h1,
.wf-inactive h2,
.wf-inactive h3,
.wf-inactive h4,
.wf-inactive h5,
.wf-inactive p,
.wf-inactive ul,
.wf-inactive dl,
.wf-inactive form,
.wf-inactive a{
	opacity: 1;
}

/* General */
h1{
	font-weight: 200;
	font-size: 3em;
	line-height: 1;
	margin: .3em 0 .5em;
}

h2{
	margin-top: 0;
}

h3{
	font-weight: 300;
	font-size: 1em;
}

a{
	color: #ff6067;
	border-bottom: 1px dotted;
	text-decoration: none;
	transition: .5s;
}

a:hover{
	border-bottom-color: transparent;
	color: #fa000c;
}

body{
	margin:0 auto;
	max-width: 36em;
}

.hello{
	font-size: 1.5em;
	margin: 0;
	font-weight: bold;
	display: flex;
	align-items: center;
}

.logo{
	width: 40px;
	margin-right: .5rem;
}
@media (min-width: 600px){
	.logo{
		width: 60px;
		margin-right: 1rem;
	}
}

body > article{
	padding-top: 2em;
}

article > header{
	padding-bottom: 1.5em;
	margin-bottom: .2em;
	border-bottom: 1px dotted #c5c5c5;
}


article > section{
	border-top: 1px dotted #c5c5c5;
	border-bottom: 1px dotted #c5c5c5;
	padding: 2em 0;
	margin-bottom: .2em;
}

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

li{
	margin: 0 1em 1em 0;
	display: inline-block;
}

section > article{
	display: inline-block;
	margin-right: 2em;
}

section > article h3{
	display: block;
	margin-bottom: 0;
}

section > article li{
	display: inline-block;
	margin-right: .8em;
	margin-bottom: 0;
}

section > article a{
	border: none;
	display: block;
}

aside{
	border-top: 1px dotted #c5c5c5;
	font-size: .9em;
	text-align: center;
	padding: 1.5em 0 1.5em;
}

aside li{
	display: block;
	margin: 0 0em .5em 0;
}

aside li:first-child{
	margin-left: 0;
}

aside a{
	border: none;
}

@media screen and (min-width:1px){
	@font-face {
		font-family: 'icomoon';
		src:url('/assets/icomoon.eot');
		src:url('/assets/icomoon.eot?#iefix') format('embedded-opentype'),
			url('/assets/icomoon.woff') format('woff'),
			url('/assets/icomoon.ttf') format('truetype');
		font-weight: normal;
		font-style: normal;
	}

	[data-icon]:before {
		font-family: 'icomoon';
		content: attr(data-icon);
		speak: none;
		font-weight: normal;
		-webkit-font-smoothing: antialiased;
	}

	i[data-icon]{
		font-style: normal;
		vertical-align: middle;
		font-size: 150%;
	}

	.fontface .icon-only span{
		display: inline-block;
		width: 0;
		height: 0;
		line-height: 0;
		overflow: hidden;
	}

}

/*Media queries */

@media screen and (min-width:600px){
	html{
		font-size: 1.5em;
	}

	body > article{
		padding-top: 2em;
	}

	h1{
		font-size: 5em;
	}

	section > article h3{
		display: inline-block;
		min-width: 170px;
		margin-bottom: 1em;
	}

	section > article ul{
		display: inline;
		margin-left: 1em;
	}

	aside{
		font-size: .8em;
	}

	aside li{
		display: inline;
		margin-left: 2em;
	}

}