html {
  font-size: 16px;
  scroll-behavior: smooth;
}
body {
  background: var(--color-bg-gray);
  color: inherit;
  line-height: inherit;
  position: relative;
  margin: 0;
  line-height: 1.2;
  font-size: var(--font-size-m);
  font-family: var(--font-main), var(--fonts);
  width: 100% !important;
}

/* .container {
  padding-left: 15px;
  padding-right: 15px;
  margin: 0 auto;
} */

@media (min-width: 576px){
  .container {
    max-width: 576px;
  }
}
@media (min-width: 768px){
  .container {
    max-width: 768px;
  }
}
@media (min-width: 992px){
  .container {
    max-width: 992px;
  }
}
@media (min-width: 1200px){
  .container {
    max-width: 1200px;
  }
}


h1, .page-title{
  font-size: var(--font-size-h1);
  font-weight: 800;
  text-align: center;
  margin-bottom: 0.5em;
  text-transform: uppercase;
  display: block;
}
.not-front h1,
.not-front  .page-title{
  font-size: var(--font-size-h1-page);
}
h2, .block-title{
  font-size: var(--font-size-h2);
  font-weight: 800;
  margin-bottom: 1em;
}
h3{
  font-size: var(--font-size-h3);
  font-weight: 800;
}
h4 {
  font-size: var(--font-size-h4);
}
h5{
  font-size: var(--font-size-h5);
}

a{
  display: inline-flex;
  text-decoration: none;
  color: var(--color-link);
}
a:hover{
  color: var(--color-link-hover);
}

p{
  margin: 0;
}

img{
  max-width: 100%;
  height: auto;
}

.page-item a,
.ui-dialog-buttonset .button,
.more-link a,
.btn.button:not(:focus),
.btn.form-submit,
.btn{
  line-height: 1;
  border-radius: var(--border-radius);
  font-weight: 600;
  flex-shrink: 0;
  box-shadow: none;
  appearance: none;

  display: flex;
  align-items: center;
}
.more-link a:active,
.btn:active {
  outline: 0;
}

.page-item a,
.ui-dialog-buttonset .button,
.form-actions .btn,
.btn-default{
  color: var(--color-white);
  background-color: var(--color-main);
  border-color: var(--color-main);
  border-radius: var(--border-radius);
}
.page-item a:is(:focus, :active, :hover),
.ui-dialog-buttonset .button:is(:focus, :active, :hover),
.form-actions .btn:is(:focus, :active, :hover),
.btn-default:is(:focus, :active, :hover){
  color: var(--color-main);
  background-color: var(--color-white);
  border-color: var(--color-main);
}


/* переопределение стандартных active и focus */
.page :is(:active, :focus),
.ui-dialog :is(:active, :focus),
.page .form-control:is(:active, :focus),
.page .form-checkbox:is(:active, :focus){
  outline: none;
  box-shadow: none;
}
.form-date:focus,
.page .form-control:focus,
.page .form-checkbox:focus{
  /* background-color: inherit; */
  border-color: inherit;
  background-color: transparent;
}
.form-date:focus,
.ui-dialog :focus,
.page :focus,
.page .form-control:focus,
.page .form-checkbox:focus {
  outline: 1px dotted var(--color-focus);
  outline-offset: 0px;
}

.view-content>div {
  position: relative;
}

.ajax-progress-throbber{
  position: fixed !important;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  z-index: 1000;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
}


#mobile-header {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 45px;
  background-color: var(--color-white);
  z-index: 100;
  box-shadow: 1px 1px 10px rgba(0, 0, 0, 0.3);
}
#mobile-header .page-header {
  flex-grow: 1;
  font-weight: 300;
  align-self: center;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  padding: 0 5px;
}
#mobile-header>a {
  color: inherit;
  font-size: 32px;
  line-height: 1;
  text-decoration: none;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 5px;
  min-width: 45px;
}

.region-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
}

.header-mobile-block {
  display: none;
}

.region-navigation {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.search-api-page-block-form form{
  display: flex;
}
.search-api-page-block-form .form-type-search{
  width: 100%;
}
.search-api-page-block-form .form-search:focus{
    outline-offset: -1px;
}
.search-api-page-block-form .form-actions .btn{
  padding: 0;
  background-color: var(--color-main);
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  background-image: url('../image/i_search.svg');
  font-size: 0;
}
#superfish-main .is-active{
  pointer-events: none;
}
/*
#superfish-main .active-trail,
#superfish-main a:hover {
  background: rgba(0, 0, 0, 0.1);
}
 */
.cart--cart-block .cart-block--link__expand{
  display: flex;
  align-items: center;
  gap: 5px;
  position: relative;
}

.node--type-slide{
  display: grid;
  align-items: center;
  color: var(--color-white);
}
.node--type-slide div[data-once="contextual-render"]{
  top: 36px;
}
.node--type-slide .field--name-field-image{
  grid-area: 1/1;
}
.node--type-slide .field--name-field-image img{
  min-height: 290px;
}
.node--type-slide .content{
  grid-area: 1/1;
  display: flex;
  flex-direction: column;
  /* gap: 1rem; */
}
.node--type-slide::after{
  content: none;
}

#map-block {
  margin: 0;
}
#map-block .field--name-body {
  display: flex;
}
.footer{
  padding: 2rem 0 0;
}
.footer .vesta{
  padding: 1.125em;
  font-size: 14px;
  color: var(--color-white);
  display: flex;
  justify-content: center;
}


#drupal-modal .form-type-checkbox {
  display: flex;
  align-items: flex-start;
}
#drupal-modal .form-type-checkbox input {
  margin: 5px 0 0 0;
}
#drupal-modal .form-type-checkbox .description {
  margin: 0 0 0 5px;
}

.form-date,
.form-control{
  border-radius: var(--border-radius);
}
.form-type-checkbox {
  display: flex;
}
.form-type-checkbox .description {
  margin-left: .4em;
}
.form-item{
  margin: 0;
}
.form-date::placeholder,
.form-control::placeholder{
  color: var(--color-text-placeholder);
}

.form-type-checkbox{
  display: flex;
}
.form-type-checkbox .description{
  margin-left: .4em;
}

/* ### WEBFORM DIALOG ### */
body .ui-dialog :is(.ui-dialog-titlebar, .ui-dialog-buttonpane){
  background-color: transparent;
}
.ui-dialog .webform-submission-form{
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.ui-dialog .webform-submission-form .form-type-processed-text{
  margin-top: 1rem;
  font-size: 13px;
}


.view-grid .view-content {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(var(--grid-colmn-width), 1fr));
  gap: var(--gap-default);
}

.view-news.view-display-id-page_1 .content {
  background-color: var(--color-bg-gray);
  padding: 10px;
  display: flex;
  flex-direction: column;
  gap: 15px;
}


/* .mm-navbar{} */
.region-navigation-mobile .menu {
  display: grid;
}
.region-navigation-mobile .menu a {
  background-color: transparent;
  color: var(--color-black);
}
.region-navigation-mobile .menu .is-active {
  color: var(--color-white);
  background-color: var(--color-main);
  pointer-events: none;
}
.region-navigation-mobile .menu .menuparent+ul {
  display: none;
}


#scrollToTop {
  appearance: none;
  display: flex;
  width: 3rem;
  height: 3rem;
  cursor: pointer;
  font-size: 0;
  transition: .2s;
  background-image: url('../image/i_totop.svg');
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  background-color: transparent;
  border: none;
  opacity: 0.8;

  position: fixed;
  right: 6vw;
  bottom: 3vh;
  z-index: 10;
}
.social-field:hover,
#scrollToTop:hover {
  opacity: 1;
  transform: scale(1.05);
}
.social-field:active,
#scrollToTop:active {
  transform: scale(0.9);
  transition-duration: 0s;
}


/* ### ADAPTIVE ### */
@media screen and (max-width: 1199px){}
@media screen and (max-width: 991px){
  html{font-size: 14px;}

  /* ### MOBILE MENU ### */
  .footer .menu--main,
  .header-block,
  .region-navigation .navigation {
    display: none;
  }
  #mobile-nav .navigation{
    display: block;
  }
  .mm-page {
    padding-top: 0 !important; /* 64px */
  }

  #header{
    position: sticky;
    top: 0;
    z-index: 500;
    padding: 0;
  }

  #block-vesta-theme-osnovnayanavigaciya-2 :is(.sf-accordion-toggle, #superfish-main-accordion){
    display: none;
  }
  #block-vesta-theme-osnovnayanavigaciya-2  #superfish-main{
    display: flex !important;
  }
  .header-mobile-block {
    display: block;
    padding: 8px 0;
    width: 100%;
    z-index: 400;
    background-color: var(--color-white);
    box-shadow: 1px 1px 10px rgba(0, 0, 0, 0.3);
  }
  .header-mobile-block .region-header-mobile{
    display: flex;
  }
}
@media screen and (max-width: 767px){
  html {font-size: 12px;}
  body {
    padding-top: 0 !important;
    padding: 0 !important;
  }
  /* ### webform ### */
  .webform-submission-form{
    grid-template-columns: 1fr;
  }
}
@media screen and (max-width: 576px){
  html {font-size: 13px;}
}

.contextual-region .contextual{
  display: none;
}
.contextual-region:hover .contextual{
  display: block;
}

.view-commerce-cart-form .form-actions{
  display: flex;
  justify-content: flex-end;
  gap: 10px;
}
.view-commerce-cart-form .btn-primary{
  background-color: var(--color-main);
  border-color: var(--color-main);
}
.view-commerce-cart-form .btn-primary:hover{
  background-color: var(--color-white);
  color: var(--color-main);
}
.view-commerce-cart-form .table-wrapper{
  overflow-x: auto;
}
.ui-dialog .ui-dialog-content a{
  color: var(--color-main);
}
.ui-dialog-buttonset{
  display: flex;
}