/* Meyer's reset.css
---------------------------------------- */
/* http://meyerweb.com/eric/tools/css/reset/
   v2.0 | 20110126
   License: none (public domain)
*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
    display: block;
}
body {
    line-height: 1;
}
ol, ul {
    list-style: none;
}
blockquote, q {
    quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
    content: '';
    content: none;
}
table {
    border-collapse: collapse;
    border-spacing: 0;
}


/* Columns
---------------------------------------- */
.cols {display: flex; width: 100%; justify-content: space-between; gap: 20px;}
.three.cols .col {width: 33.33%;}
.two.cols .col {width: 50%;}


/* Fonts
---------------------------------------- */
@font-face {
	font-display: swap;
	font-family: 'Jost';
	font-style: normal;
	font-weight: 300;
	src: url('../fonts/jost-v20-cyrillic_latin-300.woff2') format('woff2'),
	     url('../fonts/jost-v20-cyrillic_latin-300.ttf') format('truetype');
}
/* @font-face {
	font-display: swap;
	font-family: 'Jost';
	font-style: italic;
	font-weight: 300;
	src: url('../fonts/jost-v20-cyrillic_latin-300italic.woff2') format('woff2'),
	     url('../fonts/jost-v20-cyrillic_latin-300italic.ttf') format('truetype');
} */
@font-face {
	font-display: swap;
	font-family: 'Jost';
	font-style: normal;
	font-weight: 400;
	src: url('../fonts/jost-v20-cyrillic_latin-regular.woff2') format('woff2'),
	     url('../fonts/jost-v20-cyrillic_latin-regular.ttf') format('truetype');
}
/* @font-face {
	font-display: swap;
	font-family: 'Jost';
	font-style: italic;
	font-weight: 400;
	src: url('../fonts/jost-v20-cyrillic_latin-italic.woff2') format('woff2'),
	     url('../fonts/jost-v20-cyrillic_latin-italic.ttf') format('truetype');
} */
@font-face {
	font-display: swap;
	font-family: 'Jost';
	font-style: normal;
	font-weight: 500;
	src: url('../fonts/jost-v20-cyrillic_latin-500.woff2') format('woff2'),
	     url('../fonts/jost-v20-cyrillic_latin-500.ttf') format('truetype');
}
/* @font-face {
	font-display: swap;
	font-family: 'Jost';
	font-style: italic;
	font-weight: 500;
	src: url('../fonts/jost-v20-cyrillic_latin-500italic.woff2') format('woff2'),
	     url('../fonts/jost-v20-cyrillic_latin-500italic.ttf') format('truetype');
} */


/* Basic
---------------------------------------- */
body {font: 17px/24px 'Jost', sans-serif; color: #000; background: #fff;}
a, button {cursor: pointer;}
b, strong {font-weight: 500;}
i, em {font-style: italic;}

a {color: #7C182D; text-decoration: underline;}
a:hover {color: #7C182D; text-decoration: none;}

h2 {margin: 1.1em 0 0.6em; font-weight: 500; font-size: 35px; line-height: 150%;}
article h2 {font-size: 45px; line-height: 120%;}
h3 {margin: 1em 0 0.5em; font-weight: 500; font-size: 25px; line-height: 140%;}
h4 {margin: 26px 0 13px; font-weight: 500; font-size: 16px;}

p, ul, ol, table {margin-bottom: 1em;}
ul, ol {margin-left: 1.25em;}
li {margin: 7px 0;}
ul>li {list-style: disc;}
ol>li {list-style: decimal;}

th, td {padding: 14px 20px; border: 1px solid #D9D9D9;}
th {vertical-align: middle; font-weight: 500; background: #F6F6F6;}

.wrapper {overflow: hidden;}
.flex, .flex-col, .flex-row {display: flex;}
.flex-col {flex-direction: column;}
.flex-row {flex-direction: row;}
.flex-grow {flex-grow: 1;}
.left {float: left;}
.right {float: right;}
.clear {clear: both;}
.nowrap {white-space: nowrap;}
.hidden {display: none;}
.red {color: #7C182D;}

input.text,
textarea {margin: 0; border: 0; padding: 0;}


/* Grid
---------------------------------------- */
body {display: flex; min-height: 100vh;}
aside {flex: 0 0 360px; position: relative; z-index: 2;}
main {flex: 1; position: relative; z-index: 1;}
article {margin-bottom: 100px;}


/* Aside
---------------------------------------- */
h1 {margin: 38px auto 0;}
h1 span {display: block;}
h1 a {display: inline-block; text-decoration: none;}
h1 .line1 {font-size: 26px; line-height: 120%; font-weight: 500; color: #7C182D; text-transform: uppercase; letter-spacing: 4px;}
h1 .line2 {margin-top: 5px;}
h1 .line2,
h1 .line3 {font-size: 17px; line-height: 140%; font-weight: 400; color: #000;}
h1 .line4 {margin-top: 27px; text-transform: uppercase;}
h1 .line4,
h1 .line5 {font-size: 26px; line-height: 120%; font-weight: 500;}
h1 .line6 {margin-top: 13px; font-size: 15px; line-height: 140%; font-weight: 300; color: #000;}

aside {text-align: center; box-shadow: 0 10px 30px rgba(6, 26, 66, 0.15);}

nav {margin-top: 59px; padding: 17px 45px; background: linear-gradient(to right, rgba(246, 246, 246, 1) 20%, rgba(246, 246, 246, 0.1) 100%); text-align: left;}
nav ul, nav li {margin: 0; list-style: none;}
nav li {margin-bottom: 7px;}
nav .active {font-weight: 500;}
nav .active a {text-decoration: none; color: #000;}


/* Main
---------------------------------------- */
main {display: flex; flex-direction: column;}
.outer {padding: 36px 100px 0; flex-grow: 1;}
.outer .outer,
.padding {padding-left: 100px; padding-right: 100px;}
.outer .outer {margin-left: -100px; margin-right: -100px;}

.col>:last-child {margin-bottom: 0;}

.offset-top {
	box-sizing: border-box; margin: -36px -100px 0; padding: 36px 100px 0; height: 368px;
	display: flex; flex-direction: row; flex-wrap: wrap; align-items: flex-start;
}

header {line-height: 120%;}
header .col {display: flex; align-items: center;}
header span {font-weight: 300;}
header a, footer a {font-weight: 500;}
.schedule {border: 1px solid #D9D9D9; padding: 7px 14px 6px; text-align: center; justify-content: center;}
.contact {text-align: center; justify-content: center;}

.advantages {align-items: stretch; /* margin: 91px 0; */ font-weight: 300;}
.advantages .col {display: flex;}
.advantages .col img {margin-right: 14px; align-self: center;}
.advantages .col div {display: flex; align-items: center;}
.advantages p {margin-bottom: 0;}

.news {overflow: hidden; box-sizing: border-box; min-height: 251px; background: linear-gradient(to right, #F6F6F6 0, #FFFFFF 100%);}
.news h2 {margin-top: 0;}
.news ul, .news li {margin: 0; list-style: none;}
.news .date {margin-top: 1em; font-size: 15px; font-weight: 300;}
.attention {color: #7C182D;}

.call-me-maybe {
	display: flex; flex-direction: row; align-items: end;
	padding: 18px 21px;
	background: linear-gradient(-70deg, rgba(246, 246, 246, 0.3) 50%, rgba(246, 246, 246, 1) 100%), url(../img/phone.svg) no-repeat 100% 0%;
	background-size: contain;
	font-size: 21px; line-height: 120%;
}
.call-me-maybe p {margin-bottom: 0;}

.documents {clear: both; display: flex; flex-direction: row; gap: 29px; margin: 50px 0; font-weight: 300;}
.documents div {display: flex; align-items: center;}
.documents div ul {margin-bottom: 0;}

.portrait {float: left; margin-right: 29px; margin-bottom: 50px;}

a[href^=tel] {white-space: nowrap;}

.address {margin-bottom: 28px; font-size: 15px; font-weight: 300;}
.map {
	display: flex; justify-content: end; align-items: center; margin-bottom: 16px; height: 400px;
	background: url(../img/map.jpg) no-repeat 50%;
	image-rendering: crisp-edges;
}
.map div {box-sizing: border-box; padding: 25px 30px; width: 33%; line-height: 120%; background: #fff;}
.map div>:first-child {margin-top: 0;}
.map div>:last-child {margin-bottom: 0;}
.neighbour,
.neighbour a {line-height: 150%; color: #424242;}

footer {display: flex; flex-direction: row; justify-content: space-between; height: 100px; background: #F6F6F6;}
footer p {margin: auto 0;}
footer .contact {text-align: right;}

/* 
---------------------------------------- */
@media (max-width: 1700px) and (min-width: 0) {
	.container {padding-left: 75px; padding-right: 75px;}
	.full-width {margin-left: -75px; margin-right: -75px; padding-left: 75px; padding-right: 75px;}

	header.three.cols .col {width: auto;}
	.contact {text-align: right; justify-content: right;}
}
@media (max-width: 1415px) and (min-width: 0) {
	.container {padding-left: 50px; padding-right: 50px;}
	.full-width {margin-left: -50px; margin-right: -50px; padding-left: 50px; padding-right: 50px;}

	header p br {display: none;}
	address {flex-shrink: 1.25;}

	.map br {display: none;}
}