* {
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

p {
    font-size: 4vw;
    line-height: 6vw;
    letter-spacing: 0px;
    margin: 1vw 0px 2vw;
}

p a {
    text-decoration: none;
    color: inherit;
}

ul {
    margin: 3vw 0px;
    padding: 0px 0px 0px 6vw;
}

ul li::before {
    width: 3vw;
    left: -6vw;
    top: 3vw;
    height: 2px;
}

input[type="checkbox"], input[type="search"], input[type="email"], input[type="radio"], input[type="text"], input[type="tel"], textarea, select {
    font-size: 4vw;
    letter-spacing: 0px;
    line-height: 9vw;
    height: 9vw;
}

h1 {
    font-size: 8vw;
    line-height: 9vw;
}

h2 {
    font-size: 8vw;
    line-height: 9vw;
}

h3 {
    font-size: 7vw;
    line-height: 8vw;
}

h4 {
    font-size: 6vw;
    line-height: 7vw;
}

h5 {
    font-size: 5vw;
    line-height: 6vw;
}

h6 {
    font-size: 4vw;
    line-height: 5vw;
}

.letter {
    line-height: 1em;
}

.title {
    font-size: 5vw;
    line-height: 7vw;
    margin: 0px 0px 5vw;
}

.designer-title {
    font-size: 6vw;
    line-height: 10vw;
    padding: 5vw 0px;
    left: -7vw;
    width: 100vw;
    overflow: hidden;
}

.designer-title::before {
    font-size: 20vw;
    line-height: 20vw;
    letter-spacing: 0px;
}

.btn {
    font-size: 4vw;
    line-height: 11.7vw;
    letter-spacing: 0px;
    padding: 0px 12vw;
    border-radius: 1vw;
}

body {
    letter-spacing: 0px;
    font-size: 4vw;
    line-height: 6vw;
    padding: 21.5vmin 0px 0px;
    width: 100vw;
    max-width: 100vw;
    min-width: 100vw;
}

.slide-left, .slide-right {
    line-height: 9vw;
    font-size: 5vw;
    width: 9vw;
    height: 9vw;
    left: -11vw;
}

.slide-right {
    left: inherit;
    right: -11vw;
}

tpl {
    font-size: 50px;
    line-height: 70px;
}

.block {
    width: 86vw;
    min-width: 0px;
    max-width: 100vw;
}

.soc {
    float: right;
    margin: 0px;
}

.soc a {
    font-size: 6vw;
    line-height: 9vw;
    width: 9vw;
    height: 9vw;
}

header .top-header {
    display: block;
    height: auto;
    background-color: rgb(0, 70, 130);
    position: absolute;
    top: 0px;
    width: 100%;
    z-index: 5;
    transition: opacity 200ms linear 0s;
}

header .top-header section {
    position: relative;
    overflow: hidden;
    display: block;
    background-color: rgb(0, 70, 130);
    transition: height 0.35s ease 0s;
    box-sizing: border-box;
}

header .top-header section > div {
    margin: 5vmin 0px;
    display: block;
}

header .top-header span {
    color: rgb(255, 149, 65);
    font-size: 5vmin;
    line-height: 7vmin;
}

header .top-header p {
    color: rgb(255, 255, 255);
    margin: 1vmin;
    font-size: 3.3vmin;
    line-height: 6vmin;
    letter-spacing: 0.05vmin;
}

header .top-header font {
    color: rgb(255, 255, 255);
    font-size: 2vmin;
    line-height: 6vmin;
    display: block;
    font-family: icon;
    background-color: rgb(0, 70, 130);
}

header .top-header font::before {
    content: "";
}

header .top-header.open font {
    background-color: rgb(0, 100, 180);
}

header .top-header.open font::before {
    content: "";
}

header section {
    position: relative;
}

header {
    position: fixed;
    box-sizing: border-box;
    text-align: center;
    background-color: rgb(0, 100, 180);
    z-index: 888;
    width: 100vw;
    padding-top: 6vmin;
    transition: padding-top 200ms linear 0s;
}

header .logo {
    display: block;
    width: 50vw;
    height: 16vmin;
    position: absolute;
    top: 0px;
    left: calc(50% - 25vw);
    background-position: center center;
    background-size: 40vmin;
    float: none;
}

header .menu {
    float: left;
}

header .lang {
    float: right;
    padding: 4vmin 0px;
}

header .menu span, header .menu span::before, header .menu span::after {
    position: absolute;
    width: 40%;
    top: calc(50% - 2px);
    left: 30%;
    height: 3px;
    background-color: rgb(255, 255, 255);
    transition: all 0.3s ease-out 0s;
}

header .menu span::before, header .menu span::after {
    content: "";
    width: 100%;
    left: 0px;
}

header .menu span::before {
    top: -1.9vmin;
}

header .menu span::after {
    top: 1.9vmin;
}

header .menu.active span::before {
    transform: rotate(-45deg);
    width: 50%;
    transform-origin: 75% 150%;
}

header .menu.active span::after {
    transform: rotate(45deg);
    width: 50%;
    transform-origin: 75% -25%;
}

header .lang font {
    width: 8vmin;
    height: 8vmin;
    display: block;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
    margin: 0px auto;
}

header .lang font[lang-img="uk"] {
    background-image: url("../images/lang/uk.svg");
}

header .lang font[lang-img="ru"] {
    background-image: url("../images/lang/ru.svg?1");
}

header .lang font[lang-img="en"] {
    background-image: url("../images/lang/en.svg");
}

header .menu, header .lang {
    height: 16vmin;
    width: 16vmin;
    position: relative;
    box-sizing: border-box;
}

header .lang .ux-option {
    position: absolute;
    left: 0px;
    top: 0px;
    right: 0px;
    bottom: 0px;
}

header .lang .ux-option figure {
    width: 100%;
    height: 100%;
    font-size: 0px;
}

header .lang .ux-option > section {
    width: 100%;
    top: calc(100% + 2vmin);
}

header .lang .ux-option > section ul {
    width: 100%;
    padding: 0px;
    background: none;
    box-shadow: none;
}

header .lang .ux-option > section ul li {
    padding: 0px;
}

header .lang ul {
    width: 100%;
    text-align: center;
}

header .lang .ux-option font {
    background-color: rgb(255, 255, 255);
    background-size: 6vmin;
    border-radius: 0px;
    width: 12vmin;
    height: 12vmin;
    box-shadow: rgba(0, 0, 0, 0.3) -1px 4px 10px;
}

header.hide {
    padding-top: 0px;
}

header.hide .top-header {
    z-index: 0;
    opacity: 0;
}

backdrop {
    position: fixed;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 997;
    opacity: 0;
    transition: opacity 0.35s linear 0s;
    pointer-events: none;
}

backdrop.open {
    opacity: 1;
}

nav {
    position: fixed;
    top: 0px;
    width: 89vmin;
    height: 100vh;
    z-index: 999;
    background-color: rgba(0, 70, 130, 0.95);
    overflow: hidden;
    display: none;
    transition: all 0.35s ease 0s;
    left: -89vmin;
    opacity: 0;
}

nav .top-nav {
    display: block;
    width: 100%;
    position: relative;
    height: 29.2vmin;
    background-color: rgb(255, 255, 255);
    border-bottom: 1vmin solid rgb(74, 182, 245);
    box-sizing: border-box;
    padding: 5vmin 5vmin 6vmin;
    transition: all 0.35s ease 0s;
    top: -30vmin;
}

nav .top-nav .logo {
    display: block;
    height: 100%;
    width: 53vmin;
    background-image: url("../images/svg/8.svg");
    background-repeat: no-repeat;
    background-position: 0px 2vmin;
    background-size: 53vmin;
    position: relative;
}

nav .top-nav .logo p {
    margin: 0px;
    color: rgb(96, 202, 255);
    position: absolute;
    bottom: 0px;
    right: 0px;
    font-size: 2.4vw;
    line-height: 3vw;
    display: none;
}

nav .top-nav .user {
    width: 15vmin;
    height: 15vmin;
    line-height: 15vmin;
    font-size: 10vmin;
    position: absolute;
    right: 4vmin;
    top: 7vmin;
    color: rgb(25, 88, 142);
    text-align: center;
}

nav .search, nav .back {
    float: none;
    width: calc(100% - 20.5vmin);
    margin: 9vmin 0px 5vmin 12vmin;
    display: table;
    padding: 0px 0px 4vmin;
    border-bottom: 2px solid rgb(255, 255, 255);
    transition: all 0.35s ease 0s;
    opacity: 0;
}

nav .search input {
    float: right;
    border: none;
    width: calc(100% - 9vmin);
    line-height: 11vmin;
    height: 11vmin;
    padding: 0px 4vmin;
    font-size: 7.5vmin;
    font-weight: bold;
    color: rgb(255, 255, 255);
}

nav .search input::placeholder {
    color: rgb(255, 255, 255);
}

nav .search .icon-12 {
    float: left;
    border: none;
    background: transparent;
    font-size: 8vmin;
    width: 9vmin;
    height: 11vmin;
    line-height: 11vmin;
}

nav .back {
    width: calc(100% - 30vmin);
    line-height: 11vmin;
    font-size: 7.5vmin;
    font-weight: bold;
    color: rgb(255, 138, 45);
    position: relative;
    padding-left: 9vmin;
}

nav .back::before {
    content: "";
    font-family: icon;
    font-size: 5vmin;
    width: 9vmin;
    height: 11vmin;
    line-height: 11vmin;
    position: absolute;
    left: 0px;
    top: 0px;
    text-align: left;
    font-weight: 100;
    color: rgb(255, 138, 45);
}

nav section {
    overflow: auto;
    position: absolute;
    bottom: 0px;
    left: 0px;
    width: 100%;
    height: calc(100vh - 29vmin);
    transition: left 0.35s linear 0s;
}

nav section > ul {
    padding: 0px 5vmin 0px 12vmin;
}

nav section:nth-child(2) {
    left: 0%;
}

nav section:nth-child(3) {
    left: 100%;
}

nav.open-children section:nth-child(2) {
    left: -100%;
}

nav.open-children section:nth-child(3) {
    left: 0%;
}

nav section > ul > li {
    display: block;
    border: none;
    padding-left: 6vmin;
    margin: 6.4vmin 0px;
    position: relative;
    transition: all 0.35s ease 0s;
    opacity: 0;
    transform: translate3d(0px, 3vmin, 0px);
}

nav section > ul > li ul > li {
    padding-left: 6vmin;
    margin: 5vmin 0 6.4vmin;
    position: relative;
}

nav ul li::before {
    content: "";
    display: block;
    background: none;
    color: rgb(255, 255, 255);
    font-family: icon;
    position: absolute;
    left: 0px;
    top: 0px;
    width: 5vmin;
    height: 8vmin;
    line-height: 8vmin;
    text-align: left;
}

nav ul li a {
    padding: 0px;
    background: none;
}

nav ul li a p {
    font-weight: 400;
    font-size: 5vmin;
    line-height: 8vmin;
}

nav ul li ul {
    display: none;
}

nav ul li a:hover, nav ul li a.active {
    background: transparent;
    color: rgb(255, 138, 45);
}

nav ul li a:hover, nav ul li a.active > * {
    color: rgb(255, 138, 45);
}

nav .close {
    position: fixed;
    bottom: 10vmin;
    right: 18vmin;
    width: 14vmin;
    height: 14vmin;
    border-radius: 7vmin;
    background-color: rgb(255, 138, 45);
    z-index: 5;
}

nav .close::before, nav .close::after {
    content: "";
    position: absolute;
    height: 3px;
    width: 43%;
    left: 28%;
    top: 47.5%;
    background-color: rgb(255, 255, 255);
    transform: rotate(45deg);
}

nav .close::after {
    transform: rotate(-45deg);
}

nav.open {
    left: 0px;
    opacity: 1;
}

nav .top-nav.anim {
    top: 0px;
}

nav section > ul > li.anim {
    opacity: 1;
    transform: translate3d(0px, 0px, 0px);
}

nav .search.anim, nav .back.anim {
    opacity: 1;
}

nav #nav-ul > ul > li ul {
    display: block;
    padding-left: 0;
}

.search input {
    width: calc(100% - 11vw);
    border: 1px solid rgba(255, 255, 255, 0);
    padding: 0px 5vw;
    height: 11vw;
}

.search button {
    font-size: 5vw;
    float: right;
    width: 11vw;
    height: 11vw;
    line-height: 11vw;
    box-sizing: border-box;
    border: none;
}

.slider .search {
    padding: 0px;
    width: 86vw;
    background-color: rgb(255, 255, 255);
    box-sizing: border-box;
    display: table;
    font-size: 0px;
    line-height: 0;
    letter-spacing: 0px;
    position: absolute;
    top: 5vw;
    height: 9.2vw;
    left: 7vw;
    z-index: 7;
}

.slider .search input {
    color: rgb(0, 0, 0);
}

.footer-soc {
    padding: 5.5vw 0px;
}

.footer-soc .block {
    display: table;
}

.footer-soc div p {
    font-size: 4vw;
    line-height: 9vw;
    margin: 0px;
}

.up, footer .up {
    line-height: 11vw;
    font-size: 3vw;
    right: 38vw;
    top: -8vw;
    width: 11vw;
    height: 11vw;
}

footer .row {
    padding: 0px;
}

footer .row > * {
    padding: 4vw 7vw;
    box-sizing: border-box;
    width: 100%;
    margin: 0px;
    border-bottom: 1px solid rgb(0, 51, 95);
}

footer .row > :last-child {
    text-align: center;
}

footer .row > :last-child li {
    display: inline-block;
    width: 33.3%;
}

footer .row > :last-child li:first-child {
    text-align: left;
}

footer .row > :last-child li:last-child {
    text-align: right;
}

footer .row .logo {
    height: 23vw;
    background-position: center center;
    background-size: 60vw;
    background-image: url("../images/svg/3.svg");
}

footer ul li {
    padding: 1.3vw 0px;
}

footer ul li a p {
    font-size: 4vw;
    line-height: 4.5vw;
    font-weight: 500;
}

messenger {
    position: fixed;
    top: 60%;
    right: 5.5vmin;
    width: 12.5vmin;
    height: 12.5vmin;
    z-index: 887;
}

messenger > a {
    width: 12.5vmin;
    height: 12.5vmin;
    font-size: 7vmin;
    line-height: 12.5vmin !important;
}

.copyright {
    display: block;
    font-size: 3.2vw;
    line-height: 7vw;
    color: rgb(255, 255, 255);
    font-weight: 500;
    text-align: center;
    padding: 5vw 0px;
    background-color: rgb(0, 53, 99);
}

.slider .swiper-pagination {
    bottom: 17vw;
}

.slider {
    width: 100vw;
    height: 103.8vw;
    margin: 0px;
}

.slider .desc {
    left: 7vw;
    top: 31vw;
    padding: 0px;
}

.slider .desc p {
    font-size: 2.3vw;
    letter-spacing: 0px;
    line-height: 4vw;
    margin: 0px;
    display: none;
}

.slider .desc span {
    font-size: 6vw;
    line-height: 8vw;
    margin: 2vw 0px 5vw;
}

.slider .desc .btn {
    font-size: 3vw;
    letter-spacing: 0px;
    line-height: 8vw;
    min-width: 30vw;
}

.slider-lite {
    height: 50vw;
}

.slider-lite span {
    font-size: 8vw;
    line-height: 14vw;
    top: 25%;
}

.slider-lite .item {
    background-size: cover;
}

.card-link {
    margin-top: -11vw;
    margin-bottom: 11vw;
    width: 100%;
}

.card-link a {
    padding: 2.5vw;
}

.card-link a figure {
    font-size: 10vw;
    line-height: 13vw;
    height: 13vw;
    margin: 0px;
}

.card-link a span {
    font-size: 3vw;
    line-height: 4vw;
}

.about .card-link {
    width: 86vw;
}

.lite-desc {
    margin-top: 10vw;
    margin-bottom: 10vw;
}

.lite-desc .slide {
    width: 70vw;
    height: 60vw;
    margin: 0px auto 8.5vw;
    padding: 0px;
    float: none;
    display: block;
}

.lite-desc .slide .item {
    font-size: 0px;
    line-height: 0;
}

.lite-desc .desc {
    width: 100%;
}

.lite-desc .desc h3 {
    font-size: 4.2vw;
    line-height: 6vw;
    text-align: center;
    margin: 0px 0px 7.4vw;
}

.lite-desc .desc p {
    font-size: 3.15vw;
    line-height: 5.1vw;
}

.lite-desc .btn {
    margin: 7vw auto 0px;
    display: table;
}

.records {
    padding: 15vw 0px 14.1vw;
    width: 100vw;
    overflow: hidden;
}

.records .tabs, .page .tabs {
    margin: 6vw 0px 0px;
    left: -7vw;
    width: 100vw;
    overflow: hidden;
    position: relative;
}

.page .tabs {
    margin: 0px 0px 8vw;
}

.tabs .tabs-head {
    font-size: 0px;
    line-height: 0;
    letter-spacing: 0px;
    width: 100%;
    position: relative;
    border-bottom: none;
    overflow: auto;
    display: block;
    padding: 4vw 0px;
}

.tabs .tabs-head section {
    width: 130vw;
    text-align: left;
    display: table;
    padding: 0px 7vw;
}

.tabs .tabs-head .tabs-item {
    font-size: 4vw;
    line-height: 10vw;
    padding: 0px 5vw;
    border-radius: 1vw;
    margin: 0px 1vw;
    color: rgb(46, 46, 46);
    border: none;
    background: rgb(248, 248, 248);
    user-select: none;
}

.tabs .tabs-head .tabs-item::before, .tabs .tabs-head .tabs-item::after {
    display: none;
}

.tabs .tabs-head .tabs-item:focus {
}

.tabs .tabs-head .tabs-item:hover, .tabs .tabs-head .tabs-item:focus {
    color: rgb(46, 46, 46);
}

.tabs .tabs-head .active, .tabs .tabs-head .active:focus, .tabs .tabs-head .active:hover {
    color: rgb(255, 255, 255);
    background: rgb(0, 100, 180);
}

.tabs .tabs-body {
    padding: 9vw 7vw 0px;
    min-height: 570vw;
    overflow: hidden;
}

.records .row .item {
    width: 100%;
    margin: 0px 0px 8vw;
    height: 53vw;
}

.records .row .item:nth-child(2), .records .row .item:nth-child(3n+2) {
    margin-right: 0px;
    margin-left: 0px;
}

.records .item .cat {
    font-size: 3vw;
    line-height: 7vw;
    left: 5vw;
    top: 4vw;
    padding: 0px 3vw;
    border-radius: 1vw;
    font-weight: 500;
}

.records .item .desc {
    padding: 5vw;
}

.records .item .desc .date-and-view {
    font-size: 3vw;
    line-height: 4vw;
    margin: 0px 0px 2vw;
}

.records .item .desc span {
    font-size: 3vw;
    line-height: 4vw;
}

.records .item section {
    font-size: 4vw;
    letter-spacing: 0px;
    line-height: 6vw;
    padding: 5vw;
}

.records .item .line {
    padding: 3vw 5vw;
    width: 100%;
}

.records .item .line p {
    font-size: 5vw;
    line-height: 8vw;
}

.records .item .line font {
    font-size: 5vw;
    line-height: 8vw;
}

.records .btn {
    margin: 3vw auto;
}

.contact .left {
    float: none;
    width: 100%;
}

.contact .right {
    float: none;
    width: 100%;
    text-align: center;
}

.contact .right figure {
    height: 5vw;
}

.contact h3 {
    font-size: 7vw;
    line-height: 10vw;
    text-align: center;
    margin: 10vw 0px;
}

.contact form input, .contact form textarea {
    font-size: 4vw;
    line-height: 9vw;
    width: 100%;
    margin: 0px 0px 5vw;
    padding: 2vw;
}

.contact form input:nth-child(1), .contact form input:nth-child(3) {
    margin-right: 0px;
}

.contact form textarea {
    height: 50vw;
}

.contact form button {
    margin: 5vw auto;
    display: table;
}

.contact .right span {
    font-size: 5vw;
    line-height: 7vw;
}

.contact .right p {
    font-size: 4vw;
    line-height: 6vw;
}

.map {
    margin: 15vw 0px 0px;
    height: 70vw;
}

.sub-menu {
    width: 100%;
}

.sub-menu > ul > li > a {
    margin: 0px 0px 2vw;
}

.sub-menu > ul > li > a p, .sub-menu > ul > li ul p {
    font-size: 4vw;
    line-height: 6vw;
    padding: 2vw 0px 4vw 0;
}
.sub-menu > ul > li > a p{
    padding-left: 6vw;
}
.sub-menu > ul > li > a p::after {
    width: 5vw;
    height: 5vw;
    left: 6vw;
    bottom: -2.3vw;
}

.sub-menu > ul > li > ul a.active p {
    /* padding-left: 0; */
}

.page {
    padding: 10vw 0px 20vw;
}

.page > div {
    display: block;
}

.page .left {
    position: relative;
    top: 0px;
    width: 100%;
    padding: 20vw 0 0;
}

.page .right {
    width: 100%;
}

.page .info {
    border-radius: 0px;
    padding: 2vw;
    margin: 7vw 0px;
}

.page .info > * {
    margin: 0px 3vw 0px 0px;
}

.page .info font {
    font-size: 4vw;
    line-height: 7vw;
    width: 8vw;
    height: 8vw;
    margin-right: 2vw;
}

.page .info .-right font {
    margin-right: 0px;
    margin-left: 2vw;
}

.page .desc table {
    max-width: 100vw;
    width: 100vw;
    overflow: auto;
    display: block;
    position: relative;
    left: -7vw;
    padding: 1px;
    box-sizing: border-box;
    height: initial !important;
    border: none;
}

.page .desc table tbody {
    display: table;
    margin: 0 7vw;
}

.page .desc table td {
    font-size: 4vw;
    line-height: 6vw;
}

.page .files {
    margin: 10vw 0px;
}

.page .desc a {
    font-size: 4vw;
    line-height: 6vw;
}

.page .slider {
    width: 70vw;
    height: 60vw;
    margin: 10vw auto;
}

.page .slider .swiper-container {
    width: 100%;
    height: 100%;
}

.page .slider::before, .page .slider::after {
    display: none;
}

.page .slider .item {
    height: 100%;
    border-radius: 0px;
}

.page .records {
    width: 100%;
}

.page .records .row .item, .page .records .row .item:nth-child(2), .page .records .row .item:nth-child(3n+2) {
    width: 100%;
    margin-bottom: 8vw;
}

.page .records .row .item:nth-child(2n) {
    margin-left: 0px;
}

.page .right .btn {
    margin: 0px auto;
    display: table;
}

.paginate {
    margin: 10vw auto;
}

.paginate-btn {
    line-height: 9vw;
    min-width: 10vw;
    font-size: 3vw;
    margin: 0px 1vw;
    border-radius: 2vw;
}

.paginate-previous, .paginate-next {
    padding: 0px;
    font-size: 0px;
    text-align: center;
}

.paginate-previous::before, .paginate-next::after {
    font-size: 3vw;
    line-height: 9vw;
    width: 9vw;
    top: 0px;
}

.search .item {
    padding: 5vw 4vw 8vw;
    margin: 0px 0px 6vw;
    border-radius: 2vw;
}

.not-found .designer-title {
    padding-top: 22vw;
    margin: 0px;
}

.share {
    margin: 10vw 0px 0px;
    padding: 5vw 0px 0px;
}

.share p {
    margin: 0px 2vw 0px 0px;
    letter-spacing: 0.5vw;
    padding: 0px 5vw 0px 0px;
    font-size: 4vw;
    line-height: 6vw;
}

.share a {
    font-size: 5vw;
    width: 9vw;
    line-height: 6vw;
    margin: 0px 2.3vw 0px 0px;
}

.share a:last-child {
    margin: 0px;
}
