@font-face {
    font-family: "Montserrat-Regular";
    src: url("/wp-content/themes/service/fonts/Montserrat-Regular.ttf");
}

@font-face {
    font-family: "Montserrat-Bold";
    src: url("/wp-content/themes/service/fonts/Montserrat-Bold.ttf");
}

@font-face {
    font-family: "Montserrat-Medium";
    src: url("/wp-content/themes/service/fonts/Montserrat-Medium.ttf");
}

body
{
	font-family: 'Montserrat-Regular', sans-serif;
	background: #fff;
	font-size: 14px;
	line-height: 17px;
	color:#000;
	margin: 0;
}

#content
{
	max-width:1280px;
	margin-left: auto;
	margin-right: auto;
}

.page-content
{
	max-width:1280px;
	margin-left: auto;
	margin-right: auto;
}

/*-------------Header-------------*/
.page-header
{
	height: 60px;
	z-index: 99;
	position: relative;
}

.page-header #logo
{
	width:130px;
	height: 60px;
	display: inline-block;
}




 /* Add a black background color to the top navigation */
 .topnav {
	background-color: #fff;
	overflow: hidden;
	display: none;
	float: right;

	width: 190px;
	position: absolute;
	right: 0;
	top:0;
  }
  
  /* Style the links inside the navigation bar */
  .topnav a, 
  .topnav div {
	float: left;
	display: none;
	color: #000;
	text-align: center;
	padding: 14px 16px;
	text-decoration: none;
	font-size: 17px;
	border: 1px solid #ddd;
	margin-right: 10px;
  }

  .topnav div {
	  font-size: 12px;
	  width: 146px;
  }

  .topnav div a {
	  font-size: 12px;
	  border: none;
	  padding: 0;
  }
  
  .topnav div span {
	  display: block;
  }
  
  /* Change the color of links on hover */
  .topnav a:hover {
	background-color: #ddd;
	color: black;
  }
  
  /* Add an active class to highlight the current page */
  .topnav a.active {
	background-color: #4CAF50;
	color: white;
  }
  
  /* Hide the link that should open and close the topnav on small screens */
  .topnav .icon {
	display: none;
	font-size: 35px;
	border: none;
  } 

  .header-phone-title
  {
	  font-weight: bold;
	  margin: 7px 0 3px 0;
  }









.header-menu 
{
	display: inline-block;
	vertical-align: top;
	text-align: left;
}

.header-menu svg
{
	position: relative;
	top: -17px;
}

.header-menu a
{
	font-size: 14px;
	line-height: 17px;
	color:#000;
	padding: 15px 10px;
	margin: 0 10px;
	display: inline-block;
	height: 30px;
	width: auto;
	text-decoration: none;
}

.header-menu a:hover
{
	color:#2d387e;
}

.header-contacts
{
	width:610px;
	float: right;	
}

.header-contacts svg
{
	display: inline-block;
	width:13px;
	height: 13px;
	margin: 0 5px 5px 0;
}

.header-contacts .contacts-item
{
	display: inline-block;
	height: 40px;
	width: auto;
	margin: 0 0 0 30px;
	color:#fff;
	margin: 0px 10px 0 20px;
	padding: 10px 0 0 0;
}

.header-contacts .contacts-item div
{
	display: block;
	font-size: 12px;
	font-family: 'Montserrat-Medium', sans-serif;	
}

.header-contacts .contacts-item div:first-child
{
	font-family: 'Montserrat-Medium', sans-serif;
}

.header-contacts .contacts-item-group 
{
	width: 410px;
	float: right;
}

.header-contacts .contacts-item-group p
{
	margin: 0;
}

.header-contacts .contacts-item-group .contacts-item
{
	width: auto;
	margin: 0px 0px 0 20px;
	font-family: 'Montserrat-Medium', sans-serif;
}

.header-contacts .contacts-item-group .contacts-item div:nth-child(2)
{
	font-family: 'Montserrat-Regular', sans-serif;
}

.header-contacts .contacts-item-group .contacts-item div:nth-child(2) a
{
	text-decoration: none;
	color:#fff;
}

.header-contacts > .contacts-item:nth-child(2)
{
	color: #000;
	margin-left: 0;
	
}

/*---------- front top---------*/
.front-top-wraper
{
	height: 700px;
	width: 100%;
}

.front-top-left
{
	width:800px;
	float: left;
	height: 565px;
}

.front-top-left h1
{
	font-size: 36px;
	font-weight: bold;
	line-height: 42px;
	margin-top: 140px;
	width:470px;
	font-family: 'Montserrat-Bold';
}

.front-top-left .description
{
	font-size: 14px;
	width:470px;
}

.front-top-left .front-top-left-action
{
	height: 80px;
	width:170px;
}

.front-top-left .front-top-left-action svg
{
	position: relative;
	width:93px;
	height: 59px;
	z-index: 10;
	margin: -20px 0 0 0;
}

.front-top-left .front-top-left-action a
{
	background-color: #1F2035;
	z-index: 98;
	margin: 40px 0 0 40px;
	display: block;
	text-decoration: none;
	color:#fff;
	padding: 10px 30px;
	width:90px;
	position: relative;
	font-size: 12px;
	font-family: 'Montserrat-Medium';
}

.front-top-left .front-top-left-action a:hover
{
	background-color: #1F2035;
	text-decoration: unserline;
}

.front-top-right 
{
	float: right;
	width: 410px;
	height: 705px;
	margin-top: -68px;
	background: #1F2035;
}

.front-top-right img
{
	right: 240px;
	top:68px;
	position: relative;	
	margin-right: -240px;
}

.front-top-companies
{
	margin: -115px 0 80px 0;
	float: left;
}

.front-top-companies img
{
	margin: 10px 110px 0 0;
}

/*About*/
.front-about-wraper
{
	margin-left: 124px;
	background: url("/wp-content/themes/service/images/about-bg.jpg") no-repeat;
	width: 1158px;
	height: 478px;
}

.front-about-wraper img
{
	margin: -13px 0 0 -40px;
}

.front-about-text-wraper
{
	width: 640px;
	color:#fff;
	display: inline-block;
	vertical-align: top;
	padding: 80px 10px 60px 40px;
	max-height: 365px;
}

.front-about-title
{
	font-size: 18px;
	font-weight: bold;
	line-height: 22px;
	width: 200px;
	margin: 0 0 20px 0;
	font-family: 'Montserrat-Bold', sans-serif;
}

.front-about-text-wraper .front-about-text-column
{
	width:47%;
	display: inline-block;
	vertical-align: top;
}

.front-about-item
{
	padding: 0 0 18px 15px;
	font-size: 14px;
	color:#fff;
}

.front-about-item svg
{
	position: relative;
	margin-left: -20px;
}

.front-about-text p
{
	margin: 0;
	display: inline;
}

/*services*/

.front-services-wraper
{
	width:100%;
	margin: 60px 0;
	text-align: center;
}

.front-service-item
{
	width:405px;
	height: 230px;
	display: inline-block;
	margin: 0 5px 5px 0;
	vertical-align: top;
}

.front-service-item img
{
	width:405px;
	height: 230px;
}

.front-service-item .front-services-text span
{
	vertical-align: middle;
	display: inline-block;
	line-height: 18px;
}

.front-service-item .front-services-text
{
	padding: 5px 15px;
	color: #000;
	background: #fff;
	width:230px;
	position: relative;
	font-family: 'Montserrat-Medium', sans-serif;
	line-height: 35px;
	bottom: 58px;
	text-align: left;
}

/*features*/

.front-features-wraper
{
	margin: 0 0 60px 0;
	text-align: center;
}

.front-features-item-wraper
{
	width:197px;
	height: 157px;
	border:1px solid #ECECEC;
	padding: 2px;
	display: inline-block;
	vertical-align: top;
	cursor: pointer;
	margin-bottom: 3px;
}

.front-features-item-wraper:hover
{
	background-color: #272843;
	font-family: 'Montserrat-Medium', sans-serif;
}

.front-features-item-wraper:nth-child(1) .front-features-item
{
	background: url("/wp-content/themes/service/images/feature1.svg") no-repeat right top;
}

.front-features-item-wraper:nth-child(1):hover .front-features-item
{
	background: url("/wp-content/themes/service/images/feature1-hover.svg") no-repeat right top;
}

.front-features-item-wraper:nth-child(3) .front-features-item
{
	background: url("/wp-content/themes/service/images/feature3.svg") no-repeat right top;
}

.front-features-item-wraper:nth-child(3):hover .front-features-item
{
	background: url("/wp-content/themes/service/images/feature3-hover.svg") no-repeat right top;
}

.front-features-item-wraper:nth-child(5) .front-features-item
{
	background: url("/wp-content/themes/service/images/feature5.svg") no-repeat left top;
}

.front-features-item-wraper:nth-child(5):hover .front-features-item
{
	background: url("/wp-content/themes/service/images/feature5-hover.svg") no-repeat left top;
}

.front-features-item-wraper:nth-child(6) .front-features-item
{
	background: url("/wp-content/themes/service/images/feature6.svg") no-repeat right top;
}

.front-features-item-wraper:nth-child(6):hover .front-features-item
{
	background: url("/wp-content/themes/service/images/feature6-hover.svg") no-repeat right top;
}

.front-features-item-wraper:nth-child(7) .front-features-item
{
	background: url("/wp-content/themes/service/images/feature7.svg") no-repeat left bottom;
}

.front-features-item-wraper:nth-child(7):hover .front-features-item
{
	background: url("/wp-content/themes/service/images/feature7-hover.svg") no-repeat left bottom;
}

.front-features-item-wraper:nth-child(8) .front-features-item
{
	background: url("/wp-content/themes/service/images/feature8.svg") no-repeat right top;
}

.front-features-item-wraper:nth-child(8):hover .front-features-item
{
	background: url("/wp-content/themes/service/images/feature8-hover.svg") no-repeat right top;
}

.front-features-item-wraper:nth-child(10) .front-features-item
{
	background: url("/wp-content/themes/service/images/feature10.svg") no-repeat right bottom;
}

.front-features-item-wraper:nth-child(10):hover .front-features-item
{
	background: url("/wp-content/themes/service/images/feature10-hover.svg") no-repeat right bottom;
}

.front-features-item-wraper:nth-child(11) .front-features-item
{
	background: url("/wp-content/themes/service/images/feature11.svg") no-repeat right top;
}

.front-features-item-wraper:nth-child(11):hover .front-features-item
{
	background: url("/wp-content/themes/service/images/feature11-hover.svg") no-repeat right top;
}

.front-features-item
{
	text-align: center;
	padding: 40px 5px 0 5px;
	width:187px;
	height: 117px;
}

.front-features-item svg
{
	margin-bottom: 5px;
	height: 39px;
}

.front-features-item-wraper:hover svg path
{
	fill:#fff;
}

.front-features-item .front-features-text
{
	font-size: 14px;
	line-height: 17px;
}

.front-features-item-wraper:hover .front-features-text
{
	color:#fff;
}


/*-------footer-----------*/
footer
{
	max-width:1280px;
	margin-left: auto;
	margin-right: auto;
}

.footer-contacts
{
	background-image: url("/wp-content/themes/service/images/bg-dot.png");
	background-repeat: repeat-x repeat-y;
	width: 672px;
	height: 140px;
	padding: 23px 20px 10px 20px;
	font-size: 14px;
}

.footer-contacts p
{
	display: inline;
	margin: 0;
}

.footer-phones,
.footer-address
{
	height:auto;
	display: inline-block;
	vertical-align: top;
}

.footer-phones
{
	width: 60%;
}

.footer-address
{
	width:38%;
}

.footer-phones label,
.footer-address label
{
	font-size: 16px;
	font-family: 'Montserrat-Medium';
	display: block;
	margin-bottom: 14px;
}

.footer-phones span
{
	font-family: 'Montserrat-Medium';
}

.footer-phones div
{
	margin-bottom: 10px;
}

.footer-phones div a
{
	color:#000;
	text-decoration: none;
}

.footer-contact-form
{
	border: 1px solid rgba(39, 40, 67, 0.2);
	width:429px;
	height: 424px;
	float: right;
	margin: -515px 95px 0 0;
	position: relative;
}

.footer-contact-form form,
.footer-contact-form .submitted-message
{
	background: #1F2035;
	padding: 30px 25px;
	position: relative;
	width:402px;
	height: 442px;
	margin-top: -93px;
	margin-left: 15px;
	z-index: 100;
}

.footer-contact-form .submitted-message
{
	padding: 140px 60px;
	font-size: 16px;
	text-align: center;
	color:#fff;
	height: 222px;
	width:332px;
	margin-bottom: -502px;
	z-index: 90;
	opacity: 0;
}


.contact-form-header
{
	font-family: 'Montserrat-Bold';
	font-size: 16px;
	line-height: 20px;
	color:#fff;
	margin-bottom: 20px;
}

.form-item 
{
	width: 189px;
	height: 73px;
	display: inline-block;
	margin: 0 10px 14px 0;
	vertical-align: top;
}

.form-item label,
.contact-message label
{
	font-size: 12px;
	font-family: 'Montserrat-Medium';
	color:#fff;
	margin: 6px 0 7px 0;
	display: block;
}

.form-item input,
.form-item select
{
	width:172px;
	height: 19px;	
	color:#9A9A9A;
	border:1px solid #4D4F67;
	background: #1F2035;
	padding: 10px;
}

.form-item select
{
	height: 39px;
	width:196px;
	-moz-appearance: none;
	-webkit-appearance: none;
	appearance: none;
	background-color: #1F2035;
	background-image: url("data:image/svg+xml,%3Csvg width='10' height='6' viewBox='0 0 10 6' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M10 0.854991L5.82983 5.14501L4.99908 6L4.16834 5.14501L-5.03884e-07 0.854991L0.83074 1.52072e-07L4.99908 4.29002L9.16926 8.81049e-07L10 0.854991Z' fill='%238A8A8A'/%3E%3C/svg%3E");
	background-repeat: no-repeat, repeat;
    background-position: right .7em top 50%, 0 0;
}

.contact-message
{
	width: 100%;
}

.contact-message textarea
{
	max-width: 378px;
	width: 100%;
	height: 100px;
	color:#9A9A9A;
	background: #1F2035;
	border:1px solid #4D4F67;
	padding: 10px;
}

.form-item input:focus,
.form-item select:focus,
.contact-message textarea:focus
{
	color:#fff;
}

.error
{
	font-size: 10px;
	color:red;
	display: block;
	height: 13px;
}

.contact-action
{
	height: 50px;
	max-width: 400px;
	width: 100%;
	text-align: right;
	margin-top: 10px;
}

.contact-action input
{
	border:1px solid #fff;
	background: none;
	color:#fff;
	width:114px;
	height: 39px;
	font-size: 12px;
	font-family: 'Montserrat-Medium';
	cursor: pointer;
}

.footer-credentials
{
	padding: 15px 0;
	text-align: center;
	height: 14px;
	color:#706C6C;
	font-size: 12px;
	background: #0D0E1F;
	margin-top: 434px;
}

.footer-credentials p
{
	margin: 0;
}

@media (max-width: 1280px) 
{
	.page-header
	{
		width:718px;
	}

	#content 
	{
		width: 100%;
	}

	.page-content
	{
		padding: 0 15px;
	}

	.page-header
	{
		padding: 0 15px;
	}

	.page-header img
	{
		float: left;
	}

	.header-menu
	{
		float: left;
	}

	.header-contacts 
	{
		float: left;
		width:800px;
	}

	.header-contacts svg 
	{
		float: left;
	}

	.header-contacts .contacts-item
	{
		color:#000;
		float: left;
	}

	.header-contacts .contacts-item-group .contacts-item div:nth-child(2) a {
		color: #000;
	}

	.header-contacts .contacts-item-group
	{
		float: left;
	}

	.front-top-wraper {
		height: 435px;
	}

	.front-top-left h1 
	{
		margin-top: 30px;
	}

	.front-top-companies {
		margin: -55px 0 15px 0;
	}

	.front-top-left 
	{
		width: 500px;
		float: left;
		height: 355px;
	}

	.front-top-right 
	{
		float: right;
		margin-top: -120px;
		width: 310px;
		height: 452px;
	}

	.front-top-right img 
	{
		width: 401px;
		right:91px;
		margin-right: -91px;
	}

	.front-top-companies img {
		margin: 10px 70px 0 0;
		
	}

	.front-about-wraper
	{
		width:auto;
		background:#1F2035;
		height: auto;
		text-align: center;
		margin: 0;
	}

	.front-about-wraper img 
	{
		display: inline;
		margin: 30px 0 0 0;
	}

	.front-about-text-wraper
	{
		width:auto;
		display: block;
		padding: 50px 10px 60px 40px;
	}

	.front-about-title {
		width:100%;
	}

	.front-about-item {
		padding: 0 15px 18px 15px;
		text-align: left;
	}

	
	.front-services-wraper,
	.front-features-wraper
	{
		text-align: center;
	}

	.footer-contacts 
	{
		width:auto;
	}
	
	.footer-map
	{
		height: 434px;
	}

	.footer-contact-form 
	{
		width:auto;
		float: unset;
		margin: 0;
		height: 520px;
		border: none;
		background: #1F2035;
	}

	.footer-contact-form .submitted-message,
	.footer-contact-form form {
		margin: 0;
		width:auto;
		height: 300px;
		
	}

	.footer-contact-form form 
	{
		margin-top: -520px;
		height: 400px;
		padding: 50px 0;
		width:410px;
		margin-left: auto;
		margin-right: auto;
	}

	.footer-contact-form .submitted-message
	{
		height: 220px;
		width:100%;
		padding: 150px 0;
		margin-left: auto;
		margin-right: auto;
	}

	.footer-credentials
	{
		margin: 0;
	}

	.header-contacts svg {
		height: 55px;
	}

}

@media (max-width: 1267px) 
{
	.front-features-wraper
	{
		padding: 0 104px;
	}
}

@media (max-width: 1160px) 
{
	/*
		.front-top-wraper 
	{
		height: 360px;
	}
	
	.front-top-left 
	{
		max-height: 328px;
		float: none;
	}

	.front-top-right 
	{
		float: right;
		margin-top: 0;
	}*/

	.front-top-companies 
	{
		float: none;
		margin-top: 0;
		margin-bottom: 80px;
	}

	.front-top-companies img {
		margin: 10px 70px 0 20px;
	}
}

@media (max-width: 1060px) 
{
	.front-features-wraper
	{
		padding: 0 103px;
	}
}


@media (max-width: 1059px) 
{
	.front-features-wraper
	{
		padding: 0;
	}
}

@media (max-width: 900px) 
{

	.header-menu
	{
		display: none;
	}

	.header-contacts
	{
		display: none;
	}

	.topnav {
		display: block;
	}


	.topnav a:not(:first-child) {display: none;}
	.topnav a.icon {
	  float: right;
	  display: block;
	}

	.topnav.responsive {
		position: absolute;
		padding-top: 63px;
	}
	.topnav.responsive a.icon {
	  position: absolute;
	  right: 0;
	  top: 0;
	}
	.topnav.responsive a {
	  float: none;
	  display: block;
	  text-align: left;
	}

	.topnav.responsive div {
		display: block;
	}

	.page-header {
		width: auto;
	}

	.front-top-wraper {
		height: auto;
	}

	.front-top-left 
	{
		width:100%;
	}

	.front-top-right 
	{
		display: none;
	}

	.front-top-companies img {
		margin: 10px 30px 0 20px;
	}

	.header-menu svg 
	{
		display: none;
	}
}


@media (max-width: 680px) 
{
	.header-contacts
	{
		width: auto;
	}

	.header-contacts .contacts-item-group
	{
		width: auto;
	}

	.front-top-wraper 
	{
		/*height: 360px;*/
	}

	.front-top-left 
	{
		max-height: 417px;
	}

	.front-top-left h1 
	{
		width:100%;
	}

	.front-top-left .description 
	{
		width:100%;
	}

	.front-top-right 
	{
		width: 205px;
		height: 352px;
	}

	.front-top-right {
		width: 205px;
		height: 352px;
	}

	.front-top-right img {
		right: 120px;
		top: 40px;
		width: 325px;
		margin-right: -120px;
	}

	.footer-contacts
	{
		width:auto;
		height: auto;
	}
}

@media (max-width: 600px) 
{
	.page-header
	{
		height: auto;
	}

	.page-header img 
	{
		float: unset;
		display: block;
		margin: 0 auto;
	}

	/*.header-menu 
	{
		float: unset;
		display: block;
	}*/

	.header-contacts
	{
		width:100%;
	}

	.header-contacts svg 
	{
		display: none;
	}

	.header-contacts .contacts-item
	{
		margin: 0 15px 0 0;
	
	}

	.header-contacts .contacts-item-group 
	{
		float: none;
		display: inline;
	}

	.header-contacts .contacts-item-group .contacts-item
	{
		display: inline;
		margin: 0 15px 0 0;
	}

	.front-top-left 
	{
		max-height: unset;
		height: auto;
	}

	.front-about-text-wraper {
		padding: 50px 10px 60px 20px;
		max-height: unset;
	}

	.front-about-text-wraper .front-about-text-column {
		width: 100%;
	}

	.front-about-wraper img 
	{
		max-width:487px;
		width:100%;
	}

}

@media (max-width: 450px) 
{
	.front-top-wraper 
	{
	
	}

	.header-menu a {
		padding: 15px 0px;
		margin: 0 8px;
	}

	.front-features-item-wraper {
		width: 160px;
		height: 130px;
	}

	.front-features-item {
		text-align: center;
		padding: 30px 10px 0 10px;
		width: 140px;
		height: 100px;
	}

	.front-features-item .front-features-text {
		font-size: 13px;
	}

	.footer-contact-form
	{
		height: 780px;
	}

	.footer-contact-form form {
		height: 680px;
		margin-top: -780px;
		padding-left: 10px;
		padding-right: 10px;
		width: auto;
	}

	
	.footer-contact-form .form-item {
		width: 100%;
		display: block;
	}

	.footer-contact-form .form-item input
	{
		width:80%;
	}

	.footer-contact-form .form-item select
	{
		width:89%;
	}

	.contact-message
	{
		width:80%;
	}

	.contact-message textarea
	{
		width:100%;
	}

	.footer-contact-form .submitted-message
	{
		height: 480px;
		width: auto;
	}

	.contact-action 
	{
		text-align: left;
	}

}

@media (max-width: 415px) 
{
	.front-service-item 
	{
		max-width: 405px;
		width:100%;
		max-height: 230px;
		height: auto;
		margin-bottom: -10px;
	}

	.front-service-item img
	{
		width:100%;
		height: auto;
	}
}

@media (max-width: 375px) 
{
	.front-service-item 
	{
		margin-bottom: -30px;
	}

	.front-features-item-wraper {
		width: 130px;
		height: 130px;
	}

	.front-features-item {
		text-align: center;
		padding: 30px 10px 0 10px;
		width: 110px;
		height: 100px;
	}
}