:root {
    --font-family: "Manrope", sans-serif;
    --second-family: "Prata", sans-serif;
    --third-family: "Inter Tight", sans-serif;
    --font3: "Nunito", sans-serif;
    --text-color: #393939;
    --primary-color: #00cbc3;
    --hover-primary-color: #09b9b2;
    --hover-color: #00cbc3;
}

body { font-family: var(--font-family); color: var(--text-color); background: white; }
a, a.nav-link { color: var(--text-color); text-decoration: none; transition: all 0.4s ease; }
a:hover { color: var(--hover-color); }

ul.nav { gap: 8px 20px; }
ul.nav .nav-link { padding: 0; }
ul.nav .nav-link:focus { background-color: unset; color: var(--primary-color); }
ul.nav .nav-link:hover{ color: var(--primary-color); }
ul.nav .nav-link.is-active { color: var(--primary-color); }

.pager { display: flex; justify-content: center; margin-top: 20px; }
.pager .page-link { box-shadow: none!important; }
.pagination {
    --bs-pagination-color: var(--primary-color);
    --bs-pagination-hover-color: var(--hover-primary-color);
    --bs-pagination-focus-color: var(--primary-color);
    --bs-pagination-active-bg: var(--primary-color);
    --bs-pagination-active-border-color: var(--primary-color);
}

.contacts { display: flex; flex-direction: row; column-gap: 20px; }
.contacts .contact { display: flex; flex-direction: row; align-items: center; column-gap: 10px; }
.contacts .contact a {  font: 500 15px var(--font-family); color: #000; }
.contacts .contact a:hover { color: var(--hover-color); }
.contacts .contact img { width: 18px; height: 18px; object-fit: cover; }

.btn {
    background: var(--primary-color);
    padding: 12px 30px;
    color: white;
    font: 500 15px var(--font-family);
    text-align: center;
    border-radius: 50px;
    transition: all ease-in-out .3s;
}
.btn:hover, .btn:active, .btn:focus, .btn:focus-visible, .btn:disabled{
    color: white!important;
    background: var(--hover-primary-color)!important;
}

.block-title {
    display: inline-block;
    font: 500 13px var(--font-family);
    text-transform: lowercase;
    color: #5f5f5f;
    border-radius: 50px;
    background: #e4e4e4;
    padding: 6.5px 24px;
    margin-bottom: 20px;
}

div#vpa-short-wrapper {
    margin-left: auto;
    margin-right: 30px;
    padding: 30px;
    max-width: 641px;
    gap: 72px;
}
div#vpa-short-wrapper .vpa-content p {
    font: 400 15px var(--third-family);
    color: #000;
}

div#vpa-short-wrapper .vpa-actions .btn-primary {
    font: 600 15px var(--third-family);
    color: #000;
    padding: 11px 29.5px;
    background-color: transparent;
    border: 1px solid #000 !important;
    border-radius: 5px;
}

@media screen and (max-width: 1199px) {
}
@media screen and (max-width: 991px) {
}
@media screen and (max-width: 767px) {
    div#vpa-short-wrapper { margin: 0; max-width:none }
}
@media screen and (max-width: 575px) {
    div#vpa-short-wrapper { flex-direction: column; gap: 12px; }
}

/*============================== HEADER ==============================*/
header#header { z-index: 100; width: 100%; }
header#header .header-top { display: flex; flex-direction: row; justify-content: space-between; gap: 12px; padding: 11px 0 16px; background-color: white; }
header#header .header-top .logo a img { width: 169px; height: 57px; object-fit: cover; }

header#header .header-top .wr-search { display: flex; flex-direction: row; align-items: center; }
header#header .header-top .wr-search .region-search form { position: relative; }
header#header .header-top .wr-search .region-search .form-item.form-type-search { width: 100%; }
header#header .header-top .wr-search .region-search .form-item.form-type-search input {
    width: 170px;
    padding: 6px 0;
    padding-left: 25px;
    font: 500 12px var(--font-family);
    border: none;
    border-radius: 0;
    border-bottom: 1px solid #828282;
}
header#header .header-top .wr-search .region-search .form-item.form-type-search input::placeholder,
header#header .header-top .wr-search .region-search .form-item.form-type-search input::-webkit-input-placeholder { color: #828282; }
header#header .header-top .wr-search .region-search .form-actions { display: block; }
header#header .header-top .wr-search .region-search .form-actions button {
    position: absolute;
    background: url(/sites/all/themes/vesta_theme/image/icons/search.svg) no-repeat center !important;
    font-size: 0;
    width: 14px;
    height: 30px;
    padding: 0;
    border: 0px solid;
    box-shadow: none;
    top: 0;
    left: 0;
    z-index: 2;
}

header#header .header-top .wr-contacts { display: flex; flex-direction: row; align-items: center; gap: 30px; }
header#header .header-top .wr-contacts .wr-callback .btn { display: flex; align-items: center; gap: 10px; }
header#header .header-top .wr-contacts .wr-callback .btn::after {
    content: '';
    display: block;
    width: 7px;
    height: 7px;
    background-color: white;
    border-radius: 50%;
}

header#header .header-bottom { border-radius: 0 0 30px 30px; background: white; }
header#header .header-bottom ul.nav {
    justify-content: center;
    padding: 18px;
    border-radius: 50px;
    background: #f2f2f2;
}
header#header .header-bottom ul.nav .nav-link { font: 700 15px var(--font-family); color: #4e4e4e; }
header#header .header-bottom ul.nav .nav-link:focus { color: var(--hover-primary-color); }
header#header .header-bottom ul.nav .nav-link:hover{ color: var(--hover-primary-color); }
header#header .header-bottom ul.nav .nav-link.is-active { color: var(--hover-primary-color); }
/*====================================================================*/

/*============================== HEADER MOBILE ==============================*/
header#header-mob { background-color: white; }
header#header-mob .wr-contacts { display: flex; flex-direction: row; align-items: center; gap: 20px; }
@media screen and (max-width: 795px) {
    header#header-mob .wr-contacts .contacts { flex-direction: column; row-gap: 12px; }
}
@media screen and (max-width: 615px) {
    header#header-mob .wr-callback { display: none; }
}
@media screen and (max-width: 405px) {
    header#header-mob .wr-contacts { display: none; }
}
header#header-mob .wr-callback .btn { display: flex; align-items: center; gap: 10px; }
header#header-mob .wr-callback .btn::after {
    content: '';
    display: block;
    width: 7px;
    height: 7px;
    background-color: white;
    border-radius: 50%;
}


.offcanvas#offcanvasNav .offcanvas-body {
    display: flex;
    flex-direction: column;
    gap: 16px;
}
.offcanvas#offcanvasNav .offcanvas-body .contacts { flex-direction: column; gap: 12px; }
.offcanvas#offcanvasNav .offcanvas-body .region-search form { position: relative; }
.offcanvas#offcanvasNav .offcanvas-body .region-search .form-item.form-type-search { width: 100%; }
.offcanvas#offcanvasNav .offcanvas-body .region-search .form-item.form-type-search input {
    width: 100%;
    padding: 6px 0;
    padding-left: 25px;
    font: 500 15px var(--font-family);
    border: none;
    border-radius: 0;
    border-bottom: 1px solid #828282;
}
.offcanvas#offcanvasNav .offcanvas-body .region-search .form-item.form-type-search input::placeholder,
.offcanvas#offcanvasNav .offcanvas-body .region-search .form-item.form-type-search input::-webkit-input-placeholder { color: #828282; }
.offcanvas#offcanvasNav .offcanvas-body .region-search .form-actions { display: block; }
.offcanvas#offcanvasNav .offcanvas-body .region-search .form-actions button {
    position: absolute;
    background: url(/sites/all/themes/vesta_theme/image/icons/search.svg) no-repeat center/contain !important;
    font-size: 0;
    width: 16px;
    height: 34px;
    padding: 0;
    border: 0px solid;
    box-shadow: none;
    top: 0;
    left: 0;
    z-index: 2;
}
/*===========================================================================*/

/*============================== SLIDER ==============================*/
#slider-block .node.node--type-slide {
    overflow: hidden;
    border-radius: 20px;
}
#slider-block .node.node--type-slide .field.field--name-field-image { position: relative; }
#slider-block .node.node--type-slide .field.field--name-field-image::after {
    content: '';
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(40deg, rgba(0, 0, 0, 0) 3%, rgba(0, 0, 0, 1) 100%);
    transform: rotate(-180deg);
}
#slider-block .node.node--type-slide .field.field--name-field-image img { min-height: 458px; object-fit: cover; }

#slider-block .node.node--type-slide .content .field.field--name-field-slide-title { max-width: 510px; font: 400 32px / 1.09375 var(--second-family); margin-bottom: 30px; }
#slider-block .node.node--type-slide .content .field.field--name-body { max-width: 510px; font: 500 15px var(--font-family); }

@media screen and (max-width: 767px) {
    #slider-block .node.node--type-slide .content .field.field--name-field-slide-title { font-size: 25px; }
    #slider-block .node.node--type-slide .field.field--name-field-image img { min-height: 375px; }
}

/*====================================================================*/

/*============================== ABOUT ==============================*/
#about-block { scroll-margin-top: 150px; }
#about-block #block-vesta-theme-zagolovokonas { max-width: 730px; margin-bottom: 40px; }
#about-block #block-vesta-theme-zagolovokonas .field.field--name-body h1 { font: 400 37px / 1.08108 var(--second-family); }
#about-block #block-vesta-theme-zagolovokonas .field.field--name-body h1 span { color: #7c7c7c; }

#about-block #block-vesta-theme-tekstonas { margin-bottom: 40px; }
#about-block #block-vesta-theme-tekstonas .field.field--name-body::after { display: none; }
/* #about-block #block-vesta-theme-tekstonas .field.field--name-body { display: flex; flex-wrap: wrap; gap: 30px; font: 500 15px var(--font-family); } */
#about-block #block-vesta-theme-tekstonas .field.field--name-body { font: 500 15px var(--font-family); }
/* #about-block #block-vesta-theme-tekstonas .field.field--name-body p { flex: 1 1 47%; } */

#about-block #block-vesta-theme-opisanieonas .field.field--name-body::after { display: none; }
#about-block #block-vesta-theme-opisanieonas .field.field--name-body { display: flex; flex-wrap: wrap; gap: 30px; }
#about-block #block-vesta-theme-opisanieonas .field.field--name-body p { flex: 1 1 0%; padding: 45px 32px; border-radius: 20px; background: #26ede6; font: 400 22px var(--second-family); text-align: center; align-content: center; }

@media screen and (max-width: 767px) {
    #about-block #block-vesta-theme-zagolovokonas .field.field--name-body h1 { font-size: 28px; }
    #about-block #block-vesta-theme-tekstonas .field.field--name-body { gap: 24px; }
    #about-block #block-vesta-theme-opisanieonas .field.field--name-body { gap: 16px; }
}
/*===================================================================*/

/*============================== CHAIRS ==============================*/
#chairs-block { scroll-margin-top: 150px; }
#chairs-block .block.block-views.block-views-blockchairs-block-filter { margin-bottom: 25px; }

#chairs-block #block-vesta-theme-zagolovoktovarnayaprodukciya { max-width: 670px; margin-bottom: 30px; }
#chairs-block #block-vesta-theme-zagolovoktovarnayaprodukciya .field.field--name-body { font: 400 37px / 1.08108 var(--second-family); }
#chairs-block #block-vesta-theme-zagolovoktovarnayaprodukciya .field.field--name-body span { color: #7c7c7c; }
@media screen and (max-width: 767px) {
    #chairs-block #block-vesta-theme-zagolovoktovarnayaprodukciya .field.field--name-body { font-size: 25px; }
}
/*====================================================================*/


/*============================== STANDARTS ==============================*/
#standarts-block { scroll-margin-top: 150px; }
#standarts-block #block-vesta-theme-zagolovokstandarty { max-width: 772px; margin-bottom: 30px; }
#standarts-block #block-vesta-theme-zagolovokstandarty .field.field--name-body { font: 400 37px / 1.08108 var(--second-family); }
#standarts-block #block-vesta-theme-zagolovokstandarty .field.field--name-body span { color: #7c7c7c; }

#standarts-block #block-vesta-theme-tablicastandartov .field.field--name-body { overflow-x: auto; }
#standarts-block #block-vesta-theme-tablicastandartov table.table>:not(caption)>*>* {
    padding: 12px 30px;
    border: 1px solid #c1c1c1;
}

#standarts-block #block-vesta-theme-tablicastandartov table thead th,
#standarts-block #block-vesta-theme-tablicastandartov table tbody tr td { font: 500 16px var(--font-family); color: #5f5f5f; }

@media screen and (max-width: 767px) {
    #standarts-block #block-vesta-theme-zagolovokstandarty .field.field--name-body { font-size: 25px; }
}
/*=======================================================================*/

/*============================== SERVICES ==============================*/
#services-block { scroll-margin-top: 150px; }
#services-block #block-vesta-theme-zagolovokdopolnitelnyeuslugi { display: flex; flex-direction: row; align-items: flex-start; margin-bottom: 50px; }
#services-block #block-vesta-theme-zagolovokdopolnitelnyeuslugi .field.field--name-body { font: 400 32px / 1.09375 var(--second-family); max-width: 770px; margin-left: 199px; }
#services-block #block-vesta-theme-zagolovokdopolnitelnyeuslugi .field.field--name-body span { color: #7c7c7c; }

@media screen and (max-width: 1199px) {
    #services-block #block-vesta-theme-zagolovokdopolnitelnyeuslugi { flex-direction: column; }
    #services-block #block-vesta-theme-zagolovokdopolnitelnyeuslugi .field.field--name-body { margin-left: 0; }
}
@media screen and (max-width: 767px) {
    #services-block #block-vesta-theme-zagolovokdopolnitelnyeuslugi .field.field--name-body { font-size: 25px; }
}
/*======================================================================*/

/*============================== PROJECTS ==============================*/
#projects-block { scroll-margin-top: 150px; }
#projects-block #block-vesta-theme-realizovannyeproekty { display: flex; flex-direction: row; align-items: flex-start; justify-content: space-between; margin-bottom: 50px; }
#projects-block #block-vesta-theme-realizovannyeproekty .field.field--name-body { font: 400 37px / 1.08108 var(--second-family); max-width: 670px; }

@media screen and (max-width: 1199px) {
    #projects-block #block-vesta-theme-realizovannyeproekty { flex-direction: column; }
}
@media screen and (max-width: 767px) {
    #projects-block #block-vesta-theme-realizovannyeproekty .field.field--name-body { font-size: 25px; }
}
/*======================================================================*/

/*============================== BRANDS ==============================*/
#brands-block { scroll-margin-top: 150px; }
#brands-block #block-vesta-theme-brendoborudovaniya { display: flex; flex-direction: row; align-items: flex-start; justify-content: space-between; margin-bottom: 87px; }
#brands-block #block-vesta-theme-brendoborudovaniya .field.field--name-body { font: 400 37px / 1.08108 var(--second-family); max-width: 670px; }

#brands-block .node.node--type-brands .field.field--name-field-brands {
    display: flex;
    gap: 16px 30px;
    align-items: center;
    flex-wrap: wrap;
    justify-content: center;
}

@media screen and (max-width: 1199px) {
    #brands-block #block-vesta-theme-brendoborudovaniya { flex-direction: column; margin-bottom: 50px; }
}
@media screen and (max-width: 767px) {
    #brands-block .node.node--type-brands .field.field--name-field-brands { gap: 16px 10px; }
    #brands-block #block-vesta-theme-brendoborudovaniya .field.field--name-body { font-size: 25px; }
}
@media screen and (max-width: 575px) {
    #brands-block .node.node--type-brands .field.field--name-field-brands .field__item { max-width: 160px; }
}
/*====================================================================*/

/*============================== CALLBACK FORM ==============================*/
#callback-form-block { margin-bottom: 40px!important; scroll-margin-top: 150px; }
#callback-form-block #block-vesta-theme-otvetimnavsevoprosy { display: flex; flex-direction: row; align-items: flex-start; justify-content: space-between; margin-bottom: 50px; }
#callback-form-block #block-vesta-theme-otvetimnavsevoprosy .field.field--name-body { font: 400 37px / 1.08108 var(--second-family); max-width: 675px; width: 100%; }

#callback-form-block .wr-callbackform { row-gap: 30px; }
#callback-form-block .wr-callbackform .webform-button--submit { width: 100%; }

#callback-form-block .wr-callbackform .contacts > div { display: flex; flex-direction: row; align-items: center; gap: 15px; }
#callback-form-block .wr-callbackform .contacts > div.contact-mail { margin-bottom: 16px; }
#callback-form-block .wr-callbackform .contacts > div.contact-mail a { font: 400 15px var(--font-family); color: #4e4e4e; }
#callback-form-block .wr-callbackform .contacts > div.contact-mail a:hover {  color: var(--hover-color); }

#callback-form-block .wr-callbackform .contacts > div.contact-phone { margin-bottom: 30px; }
#callback-form-block .wr-callbackform .contacts > div.contact-phone a { font: 500 30px var(--font-family); color: #00a7a0; }
#callback-form-block .wr-callbackform .contacts > div.contact-phone a:hover {  color: var(--hover-primary-color); }

#callback-form-block .wr-callbackform .contacts > div.contact-schedule { font: 500 15px var(--font-family); color: #828282; }
#callback-form-block .wr-callbackform .contacts > div.contact-schedule p { max-width: 300px; }


#callback-form-block .wr-callbackform .contacts > div img { width: 35px; height: 35px; object-fit: cover; }

@media screen and (max-width: 1199px) {
    #callback-form-block #block-vesta-theme-otvetimnavsevoprosy { flex-direction: column; }
}
@media screen and (max-width: 767px) {
    #callback-form-block #block-vesta-theme-otvetimnavsevoprosy .field.field--name-body { font-size: 25px; }
}
/*===========================================================================*/

/*============================== FOOTER ==============================*/
#footer {
    padding-top: 46px;
    padding-bottom: 20px;
    border-top: 1px solid #c0c0c0;
}
#footer .logo a img { width: 169px; height: 57px; object-fit: cover; }
#footer > .container > .row { gap: 10px 0; }
#footer .block-title,
#footer #block-vesta-theme-osnovnayanavigaciya-menu { font: 600 15px var(--font-family); color: #4e4e4e; background: unset; padding: 0; margin-bottom: 10px; margin-top: 4px; border-radius: 0; text-transform: none; }
#footer .wr-nav ul.nav { flex-direction: column; gap: 5px; align-items: flex-start; font: 400 15px var(--font-family); color: #4e4e4e; }

#footer .view.view-chairs.view-id-chairs.view-display-id-block_filter .view-content { flex-wrap: nowrap; flex-direction: column; gap: 5px; }
#footer .view.view-chairs.view-id-chairs.view-display-id-block_filter .view-content .views-row { font: 400 15px var(--font-family); color: #4e4e4e; padding: 0; text-transform: none; border: none; text-align: left; }
#footer .view.view-chairs.view-id-chairs.view-display-id-block_filter .view-content .views-row a:hover { color: var(--primary-color); }

#footer .wr-contacts {
    display: flex;
    flex-direction: column;
    gap: 5px;
    font: 400 15px var(--font-family);
    color: #4e4e4e;
    max-width: 294px;
}

#footer .row-copyright { display: flex; flex-direction: row; justify-content: space-between; padding-top: 26px; font: 400 15px var(--third-family); color: #828282; }
#footer .row-copyright a { font: 400 15px var(--third-family); color: #828282; }
#footer .row-copyright a:hover { color: var(--primary-color); }

@media screen and (max-width: 1199px) {
    #footer .row-copyright { flex-wrap: wrap; gap: 10px; }
}
/*====================================================================*/