@font-face {
	font-family: 'Titillium Web';
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url(../fonts/TitilliumWeb-Regular.ttf) format('truetype');
}
@font-face {
	font-family: 'Titillium Web';
	font-style: normal;
	font-weight: 600;
	font-display: swap;
	src: url(../fonts/TitilliumWeb-SemiBold.ttf) format('truetype');
}

* {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}

html {
	height: 100%;
}

body {
	max-width: 100vw;
	min-height: 100%;
	background-color: #2e2d2c;
	color: #FFF;
	display: flex;
	flex-direction: column;
	font-family: Tahoma, Arial, sans-serif;
}

.clearfix:after {
	content: "";
	display: table;
	clear: both;
}

header {
	padding: 0 .625em;
/*	background: #002d2c;*/
	background: #159eda;
	color: #FFF;
	line-height: 1em;
	vertical-align: middle;
/*	height: calc(1.6em + 1.25rem);*/
	background: linear-gradient(0deg, rgba(21,158,218,1) 0%, rgba(0,92,169,1) 100%);
}

header a {
	color: #FFF;
	text-decoration: none;
}

.logo {
	display:inline-block;
	float: left;
	font-size: 1.6em;
	vertical-align: middle;
	margin: 0 .625rem 0 0;
	padding: .625rem 0;
}
.logo:before {
	background: transparent url(../img/head-logo.svg) center center no-repeat;
	background-size: contain;
	width: 1em;
	height: 1em;
	content: '';
	display: inline-block;
	vertical-align: middle;
	line-height: 1em;
	margin: 0 .2em 0 0;
}
.head-menu {
	float: left;
	display: inline-block;
	vertical-align: middle;
}

.head-menu > a {
	padding: 0;
	display: block;
	float: left;
	line-height: 1.6rem;
	padding: .625rem .625rem;
}

.head-menu > a.active {
	background: #fff;
	color: #159eda;
}

content {
	min-width: 100%;
	min-height: 100%;
	flex-grow: 1;
/*	background: #FFF;*/
/*	color: #333;*/
}

content.wimg {
	padding: 0;
	background-color: transparent;
	background-image: url(../img/back.jpg);
	background-position: left top;
	background-repeat: no-repeat;
	background-size: contain;
	position: relative;
	flex-direction: column-reverse;
	display: flex;
	color: inherit;
}

content a{
	color: #DDD;
	text-decoration: none;
	border-bottom: dashed 1px transparent;
	display: inline-block;
}
content a:hover{
	color: #FFF;
	border-bottom: dashed 1px currentColor;
}

.content {
	position: relative;
	left: 0;
	top: 0;
	padding: .625em;
}

content.wimg .content {
	padding: 0;
	background: transparent;
}

.wimg .bg-img {
	display: none;
	width: auto;
	height: auto;
	max-width: 100%;
	max-height: 100%;
}

.content-info {
	text-align: center;
	position: relative;
	margin: auto;
	margin-left: clamp(20%,200px,53%);
	margin-bottom: clamp(5%,20px,20%);
	display: flex;
	flex-direction: column;
}

.content-info > * {
	margin-top: 10px;
}

.brand {
	font-weight: bold;
	font-size: 48px;
	text-transform: uppercase;
}

.text-in-work {
	color: #009fe3;
	font-weight: bold;
	font-size: 32px;
	text-transform: uppercase;
	margin-top: 20px;
}

.text-contacts {
	margin-top: 20px;
	font-size: 23px;
	font-family: 'Titillium Web', sans-serif;
}

.content-info a {
	text-decoration: none;
	color: #FFF;
}

.\.dog {
	color: #009fe3;
}

.img-logo {
	display: block;
	width: auto;
	height: auto;
	margin: 0 auto;
}

footer {
	padding: 10px;
	color: rgba(255,255,255,.5);
	font-size: .7em;
}

.fr {
	float: right;
}

footer .logo {
	font-size: 4em;
	text-decoration: none;
	color: #FFF;
	padding: 0;
	line-height: 1em;
}

.tbl {
	display: table;
}
.tbl > .cell {
	display: table-cell;
	vertical-align: top;
}

footer .tbl {
	width: 100%;
}

.ta-right {
	text-align: right;
}
.ta-center {
	text-align: center;
}

.va-btm {
	vertical-align: bottom;
}

.about-info {
	display: inline-block;
	white-space: pre-line;
	text-align: left;
	max-width: 600px;
}

address {
	padding: inherit;
	text-decoration: none;
	font-style: normal;
}

address a {
	color: inherit;
	text-decoration: inherit;
}

address .ymaps-geolink,
address .ymaps-geolink:hover {
	color: inherit;
	text-decoration: inherit;
	margin: 0;
	white-space: normal;
}

address .ymaps-geolink[class*="-geolink-processed"] {
	cursor: pointer;
}

address .ymaps-geolink:before,
address .ymaps-geolink:after {
	display: none;
}

h2{
	padding: .625rem 0;
}

@media (orientation: portrait) {
	content.wimg {
		background-image: none;
		flex-grow: 1;
	}
	content.wimg .content {
/*		position: absolute;*/
		bottom: 0;
		width: 100%;
	}
	.bg-img {
		display: block;
	}
	.content-info {
/*		position: absolute;*/
		margin: 0;
		display: block;
		padding: 10px;
		width: 100%;
		height: 100%;
	}

	.brand {
		font-size: 10vw;
	}
	.text-in-work {
		font-size: 6vw;
	}
	.text-contacts {
/*		position: absolute;*/
		right: 0;
		bottom: 0;
		text-align: right;
		padding: 10px;
	}
	.tbl > .cell-small-w {
		display: block;
	}
}
