/* Обнуление стелей CSS */
* {
	border: 0;
	margin: 0;
	padding: 0;
}
/* Пересчет ширины контентной области */
* {
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
}
/* Дополнительные свойства обнуления */
html, body{
	width: 100%;
	height: 100%;
	font-size: 14px;
	font-family: 'Roboto', sans-serif;
}
a, a:visited {
	text-decoration: none;
}
a:hover {
	text-decoration: none;
}
img {
	vertical-align: top;
}

body{
	color:#000;
	line-height:2;
	letter-spacing:.2em;
	font-family:sans-serif;
	background:#fbfbfb;
}
.logo{
	text-align:center;
	margin:0 0 0 10px;
}

.logo img{
	width:15%;
}

#main{
	position:relative;
	max-width:100%;
	padding:0 2em 3em;
	background:#fbfbfb;
	border-radius:4px;
	cursor:default;
	text-align:center;
}

#main .avatar img{
	width:20%;
	display:block;
	margin:0 auto;
	border-radius:100%;
	box-shadow: 1px 6px 0 #4bf6f1, -2px -6px 0 #ff0753;
}

button{
	box-shadow: 2px 5px 0 #00F2EA, -1px -4px 0 #FF0250;
	line-height:2.75em;
	margin-top: 5px;
	padding:0 1.5em;
	font-weight: 700;
	font-size:15px;
	background-color:transparent;
	border-radius:30px;
	border:solid 3px #fff;
	color:#000!important;
	cursor:pointer;
	text-align:center;
}

h1{
	letter-spacing:.22em;
	color:#000;
	line-height:1.5;
	font-size:14pt;
	margin:20px 0 0;
}

p{
	font-size:13px;
}
.title {
	font-weight: 700;
}
@media screen and (min-width:300px){
	.logo img{
		width:200px;
		margin:15px 0;
	}
	#main .avatar img{
		width:120px;
	}
	button{
		font-size:13px;
	}
}

@media screen and (min-width:400px) and (min-height:800px){
	#main .avatar img{
		width:100%;
	}
}

@media screen and (min-height:800px){
	.logo img{
		width:70px;
	}
	#main .avatar img{
		width:140px;
	}
	h1{
		font-size:15pt;
	}
	p{
		font-size:15px;
	}
	button{
		font-size:15px;
	}
}
@media screen and (min-width:700px){
	.logo img{
			width:50%;
	}
	#main .avatar img{
		width:130px;
	}
	h1{
		font-size:20pt;
	}
	p{
		font-size:25px;
	}
	button{
		font-size:20px;
	}
}

@media screen and (min-width:1000px){
	h1{
		font-size:30pt;
	}
	p
	{
		font-size:25pt;
	}
	button{
		font-size:25pt;
	}
}

@media screen and (min-width:1200px){
	#main .avatar img{
		width:150px;
	}
	h1{
		font-size:15pt;
	}
	p{
		font-size:15pt;
		margin:0;
	}
	button{
		font-size:15pt;
	}
	.logo img{
		width:20%;
	}
}