*{
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

html {
	min-height: 100%;
	position: relative;
}

body {
	font-family: sans-serif;
	font-size: 18px;
	font-weight: 100;
}

a {
	color: black;
	text-decoration: none;
}


header{
	background: url('../../assets/img/home-top.jpg') no-repeat center;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	height: 250px;
}

.logo {
	display: block;
	font-size: 32px;
	margin: 0 auto;
	font-weight: normal;
	padding: 30px;
	text-align: center;
}

.logo img{
	width: 75px;
}




#wrapper {
	color: #444;
	margin: 30px auto 80px;
	max-width: 800px;
	padding: 30px;
	width: 100%;
	
}


.profile-pic{
	border-radius: 50%;
	display: block;
	margin: -165px auto 0;
	position: relative;
	width: 175px;
}


/* social links */
.links{
	text-align: center;
}

.links a{
	color: DarkGrey;
	font-size: 55px;
	margin: 0 5px;
}
.links a:hover{
	color: CadetBlue;
}

/* modal */
.page{ 
    background: WhiteSmoke;
    position: absolute;
    width: 100%;
    visibility: hidden; 
}

.modal-wrap{
    position: relative;
}

.modal-content{
    background: White;
    padding: 30px;
}

form input, form textarea{
    border: 1px solid Gainsboro;
    border-radius: 3px;
    font-size: 18px;
    margin: 5px 0;
    padding: 15px;
    max-width: 100%;
    width: 100%;
}

form button{
    background: MediumSeaGreen;
    border-radius: 3px;
    border: none;
    color: White;
    font-size: 18px;
    padding: 15px;
}

/* check human */

#check-hum{
    display: inline-block;
    width: 25px;
}


footer {
	left: 0;
	bottom: 0;
	width: 100%;
	min-height: 60px;
	position: absolute;
	text-align: center;
	background: White;
}

footer p {
	color: LightGrey;
	padding: 20px;
	font-size: 13px;
}

footer a{
	color: White;
	cursor:default;
}



@media screen and (min-width: 550px) {

	.logo {
		float: left;
		display: inline;
		margin: 0 0 0 11%;
		padding: 13px 0 0 0;
	}

}