*, *::before, *::after {
	box-sizing: border-box;
}

html, body{
font-family: 'Open Sans', sans-serif;
height: 100%;
background-color: #031d2f;
color:#fff;
min-width: 320px;
-webkit-font-smoothing: antialiased;
}

body{
overflow-y:scroll;	
}
	
body.not-scroll{
overflow-y: hidden;
}
	
p, li{
font-size: 15px;
line-height: 1.4;
margin-top: 16px;
margin-bottom: 16px;
}

a{
color:#0191e0;
}

a:focus { 
outline: none; 
}

img {
	max-width: 100%;
	height: auto;
}


.clear{
clear: both;
display: block;
}

h1{
font-size: 40px;
font-weight: 600;
margin-bottom: 25px;
line-height: 1;
color:#4a5354;
}

h2{
font-size: 32px;
font-weight: 700;
margin-bottom: 30px;
margin-top: 0px;
line-height: 1.2;
}

h3{
font-size: 20px;
margin-bottom: 25px;
margin-top: 0px;
line-height: 1.2;
font-weight: 600;
/* color:#4a5354; */
}

p+h3 {
	margin-top: 25px;	
}

h4{
font-size: 22px;
color:#4a5354;
}

small{
font-size: 70%;
}

strong{
font-weight: 600;
}









/*layout*/

.container {
	/* width: 980px; */
	margin: 0 auto;
	position: relative;
	max-width: 980px;
	width: 100%;
	padding: 0 10px;
}

.topbar{
width: 100%;
background:#cc0000;
/* height: 52px; */
font-family: 'Lobster', cursive;
position: fixed;
left: 0px;
top:0px;
right: 0px;
z-index: 2;
padding: 10px 0;
}

.topbar-wrapper {
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.topbar-right{
color:#ffffff;
/* float: right; */
font-size: 25px;
/* top: 12px; */
/* position: relative; */
	margin: 8px;
	text-align: right;
}

.topbar-right a {
	color: #fff;
	text-decoration: none;
	transition: color 0.5s ease;
}

.topbar-right a:hover {
	color:#0191e0;
}

.topbar-btn{
color:#FFF;
background: #fff;
/* float: left; */
font-size: 22px;
/* height: 36px; */
width: 194px;
text-align: center;
/* position: relative; */
line-height: 36px;
/* top: 8px; */
}

.topbar-btn a{
color:#cc0000;
text-decoration: none;
}


.header{
width: 100%;
height: 700px;
background: url(../images/main.jpg);	
background-size: cover;
background-position: center center;
text-align: center;
position: relative;
}

.header-yt {
	position: absolute;
	right: 0;
	bottom: 50px;
}

.header-text{
position: relative;
/* top: 85px; */
top: 140px;
color:#FFF;	
}


.header-t1, .header-t2{
font-family: 'Lobster', cursive;
}

.header-t1{
font-size: 70px;
margin-bottom: 5px;
}

.header-t2{
font-size: 30px;
margin-bottom: 30px;
letter-spacing: 1px;
}

.header-t3{
font-size: 20px;
line-height: 1.3;
}

.header-works-head{
background:#cc0000;
height: 60px;
width: 280px;	
font-family: 'Lobster', cursive;
text-align: center;
line-height: 60px;
font-size: 24px;
letter-spacing:2px;
position: absolute;
margin: auto;
left: 0px;
right:0px;
bottom: -28px;
z-index: 1;
}

.header-works-head i{
 background: url(../images/arr.png) center center no-repeat;
 width: 30px;
 height: 14px;
 position: absolute;
 margin: auto;
 left: 0;
 right: 0;
 border-bottom: -40px;
 display: block;
}

.works{
position: relative;
display: flex;
justify-content: center;
flex-wrap: wrap;
}

.work{
display: block;
/* float: left; */
/* width: 25%; */
width: 25%;
}


.work img{
display: block;
width: 100%;
}

/* about */

.about-head{
background:#cc0000;
height: 60px;
font-family: 'Lobster', cursive;
text-align: center;
line-height: 60px;
font-size: 24px;
letter-spacing:2px;
position: relative;
}

.about-head i{
 background: url(../images/arr.png) center center no-repeat;
 width: 30px;
 height: 14px;
 position: absolute;
 margin: auto;
 left: 0;
 right: 0;
 border-bottom: -40px;
 display: block;
}


.about{
background: #031d2f;
color:#FFF;
padding: 35px 0px;
}


.about h1{
font-size: 34px;
text-align: center;	
color:#FFF;
margin-bottom: 30px;

}

.about h2{
font-size: 20px;
/* color:#ed1566; */
margin-top: 24px;
margin-bottom: 24px;
text-align: center;
}

.about p, .about li{
font-size: 16px;
line-height:1.5;
text-align: justify;
}

.about ul, .page-contacts ul {
	padding-left: 0;
	list-style-position: inside;
}

.page-contacts .header-t2, 
.page-contacts .header-t3 {
	text-align: center;
}

.contacts-info {
	padding: 10px 20px;
}

.footer {
	text-align: center;
	color:#FFF;
	background: #042642;
	/* height: 60px; */
	line-height: 60px;
	letter-spacing: 1px;
}

.footer-content {
	display: flex;
	justify-content: center;
	align-items: center;
	flex-wrap: wrap;
}

.footer-content * {
	margin: 0 5px;
}

.footer a {
	text-decoration: none;
	color: inherit;
	transition: color 0.5s ease;
}

.footer a:hover{
	color:#0191e0;
}

.footer.fixed{
position: fixed;
bottom:0px;
left:0px;
right:0px;
}	

.contacts{
min-height: 100%;
background: url(../images/main2.jpg);
background-size: cover;
background-attachment: fixed;

}

.contacts .container{
}

.contacts-t1, .contacts-t2, .contacts-t3{
text-align: center;
}

.contacts-t1{
font-size: 40px;
margin-bottom: 10px;
color:#FFF;
}

.contacts-t2{
font-size: 20px;
color:#FFF;
margin-bottom: 20px;
}

.contacts-t3{
font-family: 'Lobster', cursive;
font-size: 30px;
color:#ed1566;
display: block;
text-align: center;	
margin-bottom: 20px;
}

.contact-form{
width:450px;
margin: auto;
padding-bottom: 80px;
}

.contact-form input{
box-shadow: none;
width: 450px;
display: block;
padding: 6px;
margin-bottom: 10px;
border: solid 1px #CCC;
}

.contact-form textarea{
box-shadow: none;
width: 450px;
display: block;
padding: 6px;
margin-bottom: 10px;
border: solid 1px #CCC;
}

.contact-form button{
font-family: 'Lobster', cursive;
font-size: 23px;
background:#ed1566;
color:#FFF;
height: 50px;
border: none;
position: relative;
right: -12px;
cursor: pointer;
padding-left: 12px;
padding-right: 12px;
}

.contact-form-btn{
text-align: right;	
}

.success{
text-align: center;
color:#FFF;
font-size: 24px;
line-height: 1.3;
margin-top: 50px;	
}


@media screen and (max-width:768px){
	.topbar-right {
		font-size: 20px;
	}
	.work {
		width: 50%;
	}
}

@media screen and (max-width:576px){
	.topbar-right {
		font-size: 14px;
	}
	.work {
		width: 100%;
	}
}