@import url('https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700&subset=cyrillic');
/*@import url("https://netdna.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css");*/
*{
	margin:0;
	padding: 0;
	/* border: 1px solid red; */
}
a{
	text-decoration: none;
}
li{
	list-style: none;
}

body{
	font-family: 'Open sans', sans-serif;

}
header{
	width: 100%;
	background: #000;
	display: flex;
}
.header_logo{
	text-transform: uppercase;
	color: #0079FE;
	font-weight: 800;
	font-size: 30px;
	cursor: pointer;
	margin-top: 45px;
	margin-left: 5%;
	white-space: nowrap;
	border-bottom: 3px solid black;
}
nav{
	margin-top: 53px;
	margin-left: 18%;
}
.topnav a{
	color: #fff;
	text-align: center;
	padding: 12px 16px;
	font-size: 14px;
	font-weight: bold;
}
.topnav a:hover{
	border-bottom: 3px solid #fcac45;
}
.topnav .icon{
	display: none;
}
main{
	display: flex;
	flex-direction: column;
	width: 100%;
}
main .main_welcome{
	background: #000;
	text-align:center;
	padding: 200px 0 250px 0;
}
main .main_welcome p{
	color: #999;
	font-size: 20px;
}
main .main_welcome h1{
	color: #999;
	font-size: 44px;
	font-weight: normal;
}
main .main_welcome h1:after{
	display: none;
}
.mycompany{
	color: #fcac45;
	font-weight: bold;
}
.wrapper{
	width: 76%;
	margin:0 auto;
}
main .main_about{
	display: flex;
	padding: 100px 0 100px 0;
}
.about_right{
	margin-left: 0px;
}

.about_right h1{
	display: inline-block;
	border-bottom: 3px solid #fcac45;
	padding-bottom: 20px;
	font-weight: normal;
}
.about_right h1:after{
	display: none;
}
.about_right p{
	margin:30px 0 50px 0;
	color: #6a6a6a;
	text-align: left;
}
.about_right li{
	background: url('img/vector.png') no-repeat;
	padding-left: 25px;
	margin-top: 10px;
	color: #6a6a6a;
}
.about_left .mw-100{
	width: 80%;
	border: 1px solid lightgrey;
}
.main_team{
	background: #000;
	text-align:center;
	padding: 100px 0 165px 0;
	color: #fff;
}
.main_team h1{
	font-size: 44px;
	padding-bottom: 30px;
}
.photo{
	background: #fff;
	width: 125px;
	height: 125px;
	border-radius: 50%;
	margin:20px auto;
}
.photo1{
	background: url('img/ivan.png') no-repeat 0 -30px;
	background-size: cover;
}
.photo2{
	background: url('img/leha.png');
	background-size: cover;
}
.photo3{
	background: url('img/Andrey.png') no-repeat;
	background-size: cover;
}
.photo4{
	background: url('img/Andrey2.png') no-repeat;
	background-size: cover;
}
.team_cards{
	display: flex;
	justify-content: center;
}
.card{
	margin:0 40px;
	border: 2px solid #000;
	border-radius: 5px;
	padding: 0px 30px;
}
.card:hover{
	border: 2px solid #fcac45;
	box-shadow: 0 0 10px white;
}
.name{
	font-size: 20px;
	margin-bottom: 7px;
}
.position{
	font-size: 16px;
	margin-bottom: 35px;
}
.about_position{
	font-size: 14px;
}
.grid_services_cards{
	text-align: center;
	display:grid;
	grid-template-columns: auto auto auto auto;
	grid-column-gap: 30px;
	padding-bottom: 30px;
}
.services_cards{
	display: grid;
	grid-template-rows: 300px;
	grid-row-gap: 10%;
}
.main_services h1{
	text-align:center;
	padding: 100px 0 30px 0;
}
.main_services p{
	color: #6c6c6c;
	margin-bottom: 30px;
}
.services_cards{
	box-shadow: 0 0 10px grey;
	height: 400px;
	padding: 10px 10px;
	border-radius: 5px;
}
.services_card{
	box-sizing: border-box;
	padding-bottom: 10px;
}
.services_cards:hover{
	box-shadow: 0 0 10px black;
}

.services_card h4{
	margin-top: 20px;
	margin-bottom: 15px;
}
.services_card img{
	border-radius: 50%;
	border: 3px solid #fcac45;
}

.price{
	width: 80%;
	height: 30px;
	background: #fcac45;
	color: black;
	margin:0 auto;
	border-radius: 5px;
	box-sizing: border-box;
	padding-top: 3px;
}
.price:hover{
	background: tomato;
	color: #fff;
}
.main_clients{
	background: #000;
	padding: 100px 0 100px 0;
	color: #fff;
	text-align:center;
}
.main_clients h1{
	margin-bottom: 30px;
}
.main_clients img{
	margin-top: 10px;
}
.main_clients img:hover{
	opacity: .7;
}
.clients{
	display: grid;
	grid-template-columns: 1fr 1fr 1fr 1fr;
	align-items: center;
}
.main_testimonials{
	background: #000;
	text-align:center;
	color: #fff;
	padding-bottom: 100px;
}
.main_testimonials .testimonials{
	margin-bottom: 20px;
}
.testimonials-name{
	margin-bottom: 50px;
	color: #ffc;
}
.main_testimonials h1{
	text-transform: uppercase;
	margin-top: 100px;
	margin-bottom: 30px;
}
.main_work{
	text-align:center;
	padding: 80px 0 70px 0;
}
.main_work h1{
	margin-bottom: 30px;
}
.main_work p{
	margin-bottom: 70px;
	color: #6c6c6c;
}
.main_work img:hover{
	opacity: .9;
}
.main_work img{
	border-radius: 5px;
}
.about_left img{
	border-radius: 10px;
}
.gallery{
	position: relative;
}
.owl-nav{
	position: relative;
	display: none;
}
.owl-prev{
	width: 40px;
	height: 50px;
	position: absolute;
	left: -40px;
	top:-110px;
	opacity: .6;
}
.owl-next{
	width: 40px;
	height: 50px;
	position: absolute;
	right: -40px;
	top: -110px;
	opacity: .6;
}
.owl-prev:hover{
	opacity: .9;
}
.owl-prev:focus{
	outline: none;
}
.owl-nav .owl-next{
	opacity: .6;
}
.owl-next:hover{
	opacity: .9;
}
.owl-next:focus{
	outline: none;
}
.contact_form{
	padding: 100px 0 0px 0;
}
.contact_form h1,p{
	text-align:center;
}
.contact_wrapper{
	width: 50%;
	margin:0 auto;
	color: #636363;
}
.red{
	color: red;
}
.contact_form h1{
	color: #000;
	margin-bottom: 30px;
}
form p{
	text-align:left;
}
.form_inputs{
	width: 100%;
	margin-top: 100px;
	display: flex;
	
}

input{
	width: 100%;
	height: 40px;
	padding: 5px;
	background-size: 20px;
	margin-bottom: 30px;
	font-size: 20px;
	box-sizing: border-box;

}
.first-child{
	margin-left: 80px;
}
textarea{
	width: 100%;
	height: 163px;
	padding: 5px;
	box-sizing: border-box;
}
input, textarea{
	border:1px solid #999;
	margin-top: 5px;
}
.button_block{
	display: flex;
	justify-content: center;
}
input[type=submit]{
	width: 165px;
	color: #fff;
	height: 40px;
	background: linear-gradient(#F3AE0F, #E38916) #E38916;
	margin-right: 0;
	margin-top: 20px;
	border-radius: 5px;
}
input[type=submit]:hover{
background: linear-gradient(#f5ae00, #f59500) #f5ae00;
}
h1:after{
	content: '';
	display: block;
	margin: 0 auto;
	width: 100px;
	padding-top: 30px;
	border-bottom: 3px solid #fcac45;
}
footer{
	width: 100%;
	height: auto;
	background: #222;
	padding: 30px 0 30px 0;
}
.social{
	display: flex;
	justify-content: center;
}
.social img{
	margin-left: 12px;
}
.social img:hover{
	opacity: .6;
}

/*Кнопка вверх*/

#toTop {
width:100px;
border:1px solid grey;
border-radius: 5px;
background: linear-gradient(#F3AE0F, #E38916) #E38916;
text-align:center;
padding:5px;
position:fixed;
bottom:10px; /* отступ кнопки от нижнего края страницы*/
right:20px;
cursor:pointer;
display:none;
color:#3f471b;
font-weight: bold;
font-family:verdana;
font-size:13px;

}
#toTop:hover{
	filter: brightness(120%);
}
#toTop:active{
	filter: brightness(80%);
}	
.tel-number{
	display: block;
	margin: 0 auto;
	margin-bottom: 20px;
	font-size: 30px;
}

/*Прайс*/
.section{
	background: #333;
	color: #fff;
	padding-top: 20px;
	padding-bottom: 20px;

}
.row-price{
	display: flex;
	align-items: baseline;
	width: 90%;
	margin-bottom: 30px;
	border-bottom: 3px solid #fcac45;
	padding-bottom: 30px;
	padding-top: 10px;
	margin: 0 auto;
}
.section h2{
	display: inline-block;
	font-weight: normal;
	margin-left: 35%;
}
table{
	margin: 0 auto;
	margin-top: 30px;
	width: 90%;
}
table, td{
	border: 2px solid grey;
	border-collapse: collapse;
}
td{
	padding: 5px 20px;
}
tr:hover{
	background: rgba(0, 0, 0, 0.4);
}
tr td:nth-child(3){
	text-align: center;
}
.btn-back{
	color: #fff;
	padding: 3px 5px;
	display: inline-block;
	border-radius: 5px;
	background: linear-gradient(#F3AE0F, #E38916) #E38916;
	filter: brightness(0.8);
}
.btn-back:hover{
	filter: brightness(1);
}
@media screen and (max-width: 1250px){
	.header_logo{
		margin-left: 3%;
	}
	nav{
		margin-left: 8%;
	}
	.topnav a{
		padding: 10px 10px;
	}
	.line{
		left:44%;
	}
	.grid_services_cards{
		grid-template-columns:auto auto;
	}
	.services_cards{
		margin-bottom: 30px; 
	}
	.form_inputs{
		flex-direction: column;
	}
	.first-child{
	margin-left: 0px;
}
}
@media screen and (max-width: 1010px){
	nav{
		margin-left: 10%;
	}
	.topnav a{
		display: none;
	}
	.topnav a:hover{
	border-bottom: none;
	}
	.topnav a.icon{
		float: right;
		margin-top: -17px;
		display: block;
		color: #fff;
		font-size: 25px;
	}
	.line{
		left:43%;
	}
	nav{
		width: 100%;
	}
	.topnav.responsive{
		position: relative;
		top: 50px;
		left: -200px;
	}
	header .topnav.responsive {
		height: 340px;
	}
	.topnav.responsive a.icon{
		position: absolute;
		top: -50px;
		right: -200px;
	}
	.topnav.responsive a{
		float: none;
		display: block;
		text-align: left;
	}

	main .main_welcome{
		padding: 50px 0 50px 0;
	}
	main .main_welcome p{
	font-size: 14px;
	}	
	main .main_welcome h1{
	font-size: 25px;
	}
	.mw-100{
		max-width: 100%;
	}
	.about_left{
		text-align:center;
	}
	.main_about{
		flex-direction: column;
	}
	.about_right{
		text-align:center;
		margin-left: 0;
	}
	.about_right li{
		text-align:left;
	}
	.about_right h1{
		margin-top: 10px;
		font-size: 20px;
	}
	.team_cards{
	flex-direction: column;
	}
	.grid_services_cards{
		grid-template-columns: auto;
	}
	.clients{
		grid-template-columns: auto auto;
	}
	.grid_services_cards{
		grid-template-columns:auto auto;
	}
	.services_cards{
		margin-bottom: 30px; 
	}
	.header_logo{
	color: #0079FE;
	margin-top: 50px;
	margin-left: 0%;
	}
}	
@media (max-width: 600px){
	.header_logo{
	color: #0079FE;
	margin-top: 50px;
	margin-left: 0%;
	}
	.clients{
		grid-template-columns: auto;
		justify-content: center;
	}
	.grid_services_cards{
		grid-template-columns:auto;
	}
	.services_cards{
		margin-bottom: 30px; 
	}
	.topnav a{
		padding: 0;
		margin-bottom: 30px;
	}
	.topnav .icon{
		padding: 12px 16px;
	}
	.owl-prev,.owl-next{
	top:-160px;
	}
	table tr td:nth-child(3){
		display: none;
	}
}
@media (max-width: 440px){
	.header_logo{
	font-size: 20px;
	margin-top: 52px;
	}
	nav{
		margin-left: 0px;
	}
	
}