html, body{
	margin: 0;
	padding: 0;
	position: relative;
	overflow-x: hidden;
	font-family: 'Open Sans', sans-serif;
	font-size: 20px;
    font-weight: 400;
    line-height: 1.3em;
	color: #fff;
}
body{background: #222;}
body img{border: none;}
.wrap{
	margin: 0 auto 0 auto;
	position: relative;
	width: 90%;
	max-width: 800px;
	text-align: center;
}
	
/*---------------FONT STYLES--------------*/
h1, h2, h3, h4, p, a, ol, ul, li{margin: 0; padding: 0;}
h1{
	margin: 0 0 25px 0;
	font-size: 30px;
	font-weight: 700;
    line-height: 1.3em;
}
h2{
	margin: 0 0 20px 0;
	padding: 15px 0 0 0;
	font-size: 20px;
	font-weight: 500;
    line-height: 1.3em;
}
h2:first-child, h1 + h2{padding-top: 0;}
p{margin-bottom: 20px;}
a{
	text-decoration: underline;
    text-decoration-thickness: 2px;
    text-decoration-color: #00C3FF;
	color: #00C3FF;
	color: #fff;
	-webkit-transition: color 300ms ease;
	-moz-transition: color 300ms ease;
	-o-transition: color 300ms ease;
	transition: color 300ms ease;
}
a:hover{color: #00C3FF;}
a:focus{outline: none;}
ul{margin-bottom: 20px;}
ul li{list-style: none;}
	
/*---------------CONTENT--------------*/
#header{padding-top: 60px;}
#logo{
	margin: 0 auto;
	display: block;
	width: 350px;
	max-width: 80%;
}
#logo img{width: 100%;}
#profile{margin: 0 auto; width: 75%; max-width: 300px;}
#profile img{width: 100%; border-radius: 50%;}
.content{margin-bottom: -20px; padding: 50px 0;}
.content + .content{padding-top: 0;}
.section + .section{padding-top: 20px;}
.short-paragraphs{margin-bottom: 20px;}
.short-paragraphs p{margin: 0;}
.short-paragraphs p + p{margin-top: 5px;}
.social{margin: 35px -10px 20px -10px;}
.social a{margin: 0 10px; display: inline-block;}
.social img{display: block; width: 44px; image-rendering: -webkit-optimize-contrast;}
#footer{
    padding-top: 20px;
	padding-bottom: 30px;
	font-size: 12px;
    line-height: 1.3em;
	color: #9b9b9b;
}
#footer a{text-decoration: none; color: inherit;}
#footer a:hover{color: #fff;}
#footer img{margin: 0 0 5px 0; width: 25px;}
@media screen and (max-width: 720px){
    #header{padding-top: 50px;}
	.content{padding: 40px 0;}
    .section + .section{padding-top: 10px;}
}
@media screen and (max-width: 480px){
    #header{padding-top: 40px;}
	.content{padding: 30px 0;}
}