@font-face {
	font-family: 'Roboto';
	src: url('../fonts/Roboto-Bold.eot?#iefix') format('embedded-opentype'),  
		 url('../fonts/Roboto-Bold.woff') format('woff'), 
		 url('../fonts/Roboto-Bold.ttf')  format('truetype'), 
		 url('../fonts/Roboto-Bold.svg#Roboto-Bold') format('svg');
	font-weight: 700;
	font-style: normal;
}
@font-face {
	font-family: 'Roboto';
	src: url('../fonts/Roboto-Regular.eot?#iefix') format('embedded-opentype'),  
		 url('../fonts/Roboto-Regular.woff') format('woff'), 
		 url('../fonts/Roboto-Regular.ttf')  format('truetype'), 
		 url('../fonts/Roboto-Regular.svg#Roboto-Regular') format('svg');
	font-weight: 400;
	font-style: normal;
}
@font-face {
	font-family: 'Roboto';
	src: url('../fonts/Roboto-Light.eot?#iefix') format('embedded-opentype'),  
		 url('../fonts/Roboto-Light.woff') format('woff'), 
		 url('../fonts/Roboto-Light.ttf')  format('truetype'), 
		 url('../fonts/Roboto-Light.svg#Roboto-Light') format('svg');
	font-weight: 300;
	font-style: normal;
}



body{
	font-size: 14px;
	font-family: 'Roboto', 'Segoe UI', Arial, Helvetica, sans-serif;
	background:#ffffff;
	color:#414650;
	font-size: 16px;
	font-weight: 400;
}
a{
	color:#000000;
	text-decoration:none;
}
#list{
	max-width:100%;
	overflow:hidden;
	min-height:100%;
	min-width: 980px;
}
.list{
	width:1000px;
	margin: 0 auto;
	max-width:100%;
	position:relative;
}
.col2{
	float:left;
	width: 50%;
}

#screen0{
	background:#20bef2;
	color:#ffffff;
}
.main_title{
	font-weight: 300;
	font-size: 43px;
}
.main_title b{
	font-weight: 700;
}
#screen0 .text{
	font-size: 20px;
	padding-top: 70px;
	max-width: 90%;
}
#screen0 .list{
	padding: 0px;
}
#screen0 .row{
	padding: 0px 70px;
}
.grey{
	background:#f2f5f8;
}


.title{
	font-size: 32px;
	color:#414650;
	font-weight: 300;
	padding: 44px 0px 25px 0px;
}
.description{
	font-weight: 300;
	max-width: 760px;
	margin: 0 auto;
}
.screen{
	text-align:center;
}
.buttons{
	padding-top: 40px;
	font-size: 0px;
}
.buttons a, .btn{
	display:inline-block;
	width: 240px;
	height: 38px;
	line-height: 38px;
	text-align:center;
	color:#414650;
	font-size: 14px;
	border: 1px solid #414650;
	background:#f2f5f8;
	margin: 5px;
	
	-webkit-border-radius: 19px;
	-moz-border-radius: 19px;
	border-radius: 19px;
	
	-webkit-transition: background 0.5s;
	-moz-transition: background 0.5s;
	transition: background 0.5s;
}
.buttons a:hover{
	background:#dee2eb;
}
.buttons a.dark, .btn{
	background:#414650;
	color:#ffffff;
}
.buttons a.dark:hover, .btn:hover{
	background:#6f7787;
}
.btn{
	width: auto;
	padding: 0px 40px;
}
.image{
	position:relative;
}
.image img{
	display:block;
	max-width: 100%;
}

.col3{
	float:left;
	width: 33%;
	text-align:center;
}
.col3 + .col3{
	width: 34%;
}
.col3 + .col3 + .col3{
	width:33%;
}

.col3 .item .ico{
	display:block;
	width: 142px;
	height: 141px;
	background: url(../img/imgs.png) no-repeat 0px 0px;
	margin: 0px auto 30px auto;
}
.col3 .item{
	font-weight: 300;
}
.col3 .item .ico.ico2{
	background-position: -142px 0px;
}
.col3 .item .ico.ico3{
	background-position: -284px 0px;
}
.col3 .item a{
	color:#20bef2;
	text-decoration:underline;
}
.col3 .item a:hover{
	text-decoration:none;	
}
.col3 .item{
	padding-bottom: 35px;
}
#screen6 .list{
	padding-bottom: 40px;
}
.down{
	display:block;
	position:absolute;
	left: 50%;
	bottom: 30px;
	width: 34px;
	height: 34px;
	margin-left: -17px;
	background: url(../img/imgs.png) no-repeat -426px 0px;
	
	-webkit-transition: opacity 0.5s;
	-moz-transition: opacity 0.5s;
	transition: opacity 0.5s;
}
.down:hover{
	opacity: 0.8;
}
.trees{
	position:absolute;
	width: 129px;
	height: 40px;
	left: 50%;
	background: url(../img/imgs.png) no-repeat -119px -144px;
	margin-left:-152px;
	bottom: 8px;
	z-index: 10;
}
.koleso{
	position:absolute;
	width: 117px;
	height: 117px;
	left: 50%;
	bottom: 9px;
	margin-left: -155px;
	background: url(../img/imgs.png) no-repeat 0px -141px;
	
	-webkit-animation: circle 10s infinite linear;
    -moz-animation: circle 10s infinite linear;
    -ms-animation: circle 10s infinite linear;
    -o-animation: circle 10s infinite linear;
    animation: circle 10s infinite linear;	
}

@-webkit-keyframes circle {to { -webkit-transform: rotate(360deg); }}
@-moz-keyframes circle {to { -moz-transform: rotate(360deg); }}
@-ms-keyframes circle {to { -ms-transform: rotate(360deg); }}
@-o-keyframes circle {to { -o-transform: rotate(360deg); }}
@keyframes circle { to { transform: rotate(360deg); }}

/*
.screen .bottom .image{
	position:absolute;
	bottom: 0px;
	left: 0px;
}*/