
/*Настройки меню*/
  :root {
    --menu-height: 60px; /*Высота верхнего меню*/
    --menu-text-color: #fff; /*Цвет текста пунктов меню*/
    --menu-color: #fff; /*Бэкграунд верхнего меню*/
    --menu-color-bg: rgba(28,28,28,.96); /*Бэкграунд верхнего и левого оменю*/
    --menu-opacity-bg: 0.4; /*Прозрачность бэкграунда*/
    --menu-top-padding-left: 10px; /*Отступ слева верхнего меню*/
    --menu-top-padding-right: 0; /*Отступ справа верхнего меню*/
    --menu-top-right-item-divider-color: unset; /*Цвет разделителя правых пунктов верхнего меню*/
    --main-site-color: var(--orange-yellow-color);
    --menu-top-position: fixed;
  }

/*Кнопка меню*/
  .hamRotate.active {
    transform: rotate(45deg);
  }
  .ham {
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
    transition: transform 400ms;
    -moz-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
  }
  .line {
    fill:none;
    transition: stroke-dasharray 400ms, stroke-dashoffset 400ms;
    stroke: #fff;
    stroke-width:4.5;
  }
  .ham4 .top {
    stroke-dasharray: 40 121;
  }
  .ham4 .bottom {
    stroke-dasharray: 40 121;
    transform: scaleX(0.5) translateX(30px);
    transition: .4s;
  }
  .ham4.active .top {
    stroke-dashoffset: -68px;
  }
  .ham4.active .bottom {
    stroke-dashoffset: -68px;
    transform: unset;
  }
  /*Конец кнопки меню*/

  .r-menu {
    z-index: 1001;
    position: var(--menu-top-position);
    right: 0;
    left: 0;
    top: 0;
  }

  .r-menu__top {
    height: var(--menu-height);
    z-index: 2;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-left: var(--menu-top-padding-left);
    padding-right: var(--menu-top-padding-right);
    transition: .4s;
    background-color: var(--menu-color-bg);
  }

  .r-menu__top-bg {
    background: var(--menu-color);
    opacity: 0;
    position: absolute;
    z-index: -1;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    -webkit-animation: hideBG .4s;
            animation: hideBG .4s;
    -webkit-animation-fill-mode: forwards;
            animation-fill-mode: forwards;
    -webkit-animation-timing-function: linear;
            animation-timing-function: linear;
  }

  .r-menu__top--fixed .r-menu__top-bg{
    -webkit-animation: showBG .4s;
            animation: showBG .4s;
    -webkit-animation-fill-mode: forwards;
            animation-fill-mode: forwards;
    -webkit-animation-timing-function: linear;
            animation-timing-function: linear;
    /*transition: .4s;*/
  }

  /*Анимация появления картинки бэкграунда*/
  @-webkit-keyframes showBG {
    0% {
      /*background: url('https://accentmed.ru/site/templates/default/imgs_default/bg-mobile.png');*/
      box-shadow: 0px 4px 5px 0px rgba(0,0,0,0.17);
      opacity: 0;
    }
    50% {
      /*background: url('https://accentmed.ru/site/templates/default/imgs_default/bg-mobile.png');*/
      box-shadow: 0px 4px 5px 0px rgba(0,0,0,0.17);
      opacity: 0.5;
    }
    100% {
      /*background: url('https://accentmed.ru/site/templates/default/imgs_default/bg-mobile.png');*/
      box-shadow: 0px 4px 5px 0px rgba(0,0,0,0.17);
      opacity: 1;
    }
  }
  @keyframes showBG {
    0% {
      /*background: url('https://accentmed.ru/site/templates/default/imgs_default/bg-mobile.png');*/
      box-shadow: 0px 4px 5px 0px rgba(0,0,0,0.17);
      opacity: 0;
    }
    50% {
      /*background: url('https://accentmed.ru/site/templates/default/imgs_default/bg-mobile.png');*/
      box-shadow: 0px 4px 5px 0px rgba(0,0,0,0.17);
      opacity: 0.5;
    }
    100% {
      /*background: url('https://accentmed.ru/site/templates/default/imgs_default/bg-mobile.png');*/
      box-shadow: 0px 4px 5px 0px rgba(0,0,0,0.17);
      opacity: 1;
    }
  }
  /*Анимация скрытия картинки бэкграунда*/
  @-webkit-keyframes hideBG {
    0% {
      /*background: url('https://accentmed.ru/site/templates/default/imgs_default/bg-mobile.png');*/
      /*box-shadow: 0px 4px 5px 0px rgba(0,0,0,0.17);*/
      opacity: 1;
    }
    50% {
      /*background: url('https://accentmed.ru/site/templates/default/imgs_default/bg-mobile.png');*/
      /*box-shadow: 0px 4px 5px 0px rgba(0,0,0,0.17);*/
      opacity: 0.5;
    }
    100% {
      /*background: url('https://accentmed.ru/site/templates/default/imgs_default/bg-mobile.png');*/
      /*box-shadow: 0px 4px 5px 0px rgba(0,0,0,0.17);*/
      opacity: 0;
    }
  }
  @keyframes hideBG {
    0% {
      /*background: url('https://accentmed.ru/site/templates/default/imgs_default/bg-mobile.png');*/
      /*box-shadow: 0px 4px 5px 0px rgba(0,0,0,0.17);*/
      opacity: 1;
    }
    50% {
      /*background: url('https://accentmed.ru/site/templates/default/imgs_default/bg-mobile.png');*/
      /*box-shadow: 0px 4px 5px 0px rgba(0,0,0,0.17);*/
      opacity: 0.5;
    }
    100% {
      /*background: url('https://accentmed.ru/site/templates/default/imgs_default/bg-mobile.png');*/
      /*box-shadow: 0px 4px 5px 0px rgba(0,0,0,0.17);*/
      opacity: 0;
    }
  }

  .r-menu__top__left {
    padding-left: 10px;
    width: 40%;
    height: 70%;
  }

  .r-menu__top__left__logo {
      -webkit-mask-image: url('/site/templates/default/imgs_default/kLogoYellow.png');
      mask-image: url('/site/templates/default/imgs_default/kLogoYellow.png');
      -webkit-mask-position: center;
      mask-position: center;
      -webkit-mask-size: contain;
      mask-size: contain;
      -webkit-mask-repeat: no-repeat;
      mask-repeat: no-repeat;

      background-color: var(--orange-yellow-color);
      width: 119px;
      height: 42px;
      display: block;
  }

  .r-menu__top__left img{
    /*height:calc(var(--menu-height) - 14px)*/
    height: 100%;
    object-fit: contain;
  }

  @media screen and (max-width: 620px) {
    .r-menu__top__left {
      margin-right: 40px;
    }
  }

  .r-menu__top__right {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
  }

  .r-menu__top__right-item {
    border-left: 1px solid var(--menu-top-right-item-divider-color);
    display: flex;
    justify-content: center;
    align-items: center;
  }

  .r-menu__top__right-item--cart,
  .r-menu__top__right-item--phone,
  .r-menu__top__right-item--search,
  .r-menu__top__right-item--user {
    height: 16px;
    width: 16px;
  }

  .r-menu__top__right-item--cart {
    -webkit-mask-image: url('/site/templates/default/svgs/kCart.svg');
    mask-image: url('/site/templates/default/svgs/kCart.svg');
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: contain;
    background-color: var(--main-site-color);
  }

  .r-menu__top__right-item--phone {
    -webkit-mask-image: url('/site/templates/default/svgs/kPhone.svg');
    mask-image: url('/site/templates/default/svgs/kPhone.svg');
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: contain;
    background-color: var(--main-site-color);
  }

  .r-menu__top__right-item--search {
    -webkit-mask-image: url('/site/templates/default/svgs/kSearch.svg');
    mask-image: url('/site/templates/default/svgs/kSearch.svg');
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: contain;
    background-color: var(--main-site-color);
  }

  .r-menu__top__right-item--user {
    -webkit-mask-image: url('/site/templates/default/svgs/kUser.svg');
    mask-image: url('/site/templates/default/svgs/kUser.svg');
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: contain;
    background-color: var(--main-site-color);
  }

  .r-menu__top__right-item:last-child {
    transform: scaleX(-1);
  }

  .r-menu__top__right-item svg{
    width: 45px;
    height: 45px;
  }

  .r-menu-bg {
    position: fixed;
    z-index: 10;
    top: 0;
    right: 0;
    left: 0;
    /*height: 100vh;*/
    bottom: 0;
    background-color: black;
    opacity: var(--menu-opacity-bg);
    display: none;
  }

  .r-menu__content {
    /*border-top-right-radius: 20px;*/
    /*background-color: var(--menu-color-bg);*/
    background: var(--menu-color-bg);
    position: fixed;
    z-index: 100;
    left: 0;
    top: var(--menu-height);
    bottom: 0;
    /*height: calc(100vh - var(--menu-height));*/
    transform: translateX(-100%);
    transition: .4s;
    padding: 20px;
    width: calc(100% - var(--menu-height));
    overflow-y: scroll;
  }

  .r-menu__content.active {
    transform: translateX(0%);
  }

  .r-menu__content__search {
    display: none;
    position: relative;
  }

  .r-menu__content__search input {
    font-size: 12px;
    padding: 14px;
    padding-right: 35px;
    color: #1c1c1c;
  }

  .r-menu__content__search__clear {
    position: absolute;
    z-index: 2;
    right: 15px;
    top: calc(50% - 7px);
    -webkit-mask-image: url('/site/templates/default/svgs/kClose.svg');
    mask-image: url('/site/templates/default/svgs/kClose.svg');
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-size: cover;
    mask-size: cover;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    width: 15px;
    height: 15px;
    background-color: #1c1c1c;
    display: none;
  }

  .r-menu__content__search input:focus + .r-menu__content__search__clear {
    /*display: block;*/
  }

  .r-menu__content__item {
    padding-top: 10px;

    margin-bottom: 30px;
  }

  .r-menu__content__item li{
    padding-top: 24px;
  }

  .r-menu__content__item a{
    font-size: 17px;
    color: var(--menu-text-color);
  }

  .r-menu__content__item-top {
    display: flex;
    flex-direction: column;
    padding-top: 20px;
  }

  .r-menu__content__item-top__item {
    color: var(--menu-text-color);
    text-transform: uppercase;
    margin-bottom: 25px;
    font-weight: 14px;
  }

  .r-menu__content__item-top__item a{
    color: inherit;
    text-decoration: none;
    display: flex;
  }

  .r-menu__content__item-top__item__icon {
    width: 20px;
    height: 20px;
    -webkit-mask-size: cover;
    -webkit-mask-repeat: no-repeat;
    background-color: var(--orange-yellow-color);
    margin-right: 13px;
  }
  .r-menu__content__item-bottom {
    display: flex;
    flex-direction: column;
  }

  .r-menu__content__item-bottom div:not(:last-child) {
    margin-bottom: 15px;
  }

  .r-menu__content__item-bottom div:last-child {
    margin-top: 10px;
  }

  .r-menu__content__item-bottom .feedback-phone-btn,
  .r-menu__content__item-bottom .feedback-email-btn,
  .r-menu__content__item-bottom .feedback-company,
  .r-menu__content__item-bottom .feedback-address {
    font-size: 18px;
  }

  .r-menu__content__item-bottom .feedback-phone-btn i {
    font-size: 15px;
    margin-right: 12px;
  }

  .r-menu__content__item-bottom__socials{
    display: flex;
    margin-bottom: 30px;
  }

  .r-menu__content__item-bottom__socials a{
    color: inherit;
    padding-right: 40px;
  }

  .r-menu__content__item-bottom__socials a i{
    font-size: 28px;
  }

  .r-menu__content__item-bottom__socials a:nth-child(1) i{
    color: #4a76a8;
  }

  .r-menu__content__item-bottom__socials a:nth-child(2) i{
    background: -webkit-linear-gradient(45deg, #f09433 0%,#e6683c 25%,#dc2743 50%,#cc2366 75%,#bc1888 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
  }

  .r-menu__content__item-bottom__socials a:nth-child(3) i{
    color: #ee8208;
  }


  @media screen and (min-width: 1001px) {
    .r-menu {
      display: none;
    }
  }

  /*Стили с reloadteam.ru возможно, нужно будет заменить*/

  .mobile__menu-contact {
    font-size: 18px;
  }

  .mobile__menu-contact .rhead__item {
    justify-content: normal;
    margin-bottom: 10px;
  }

  .rhead__item {
    display: flex;
    margin: 0 -5px;
    justify-content: flex-end;
    align-items: center;
    cursor: pointer;
  }

  .rhead__item > * {
    margin: 0 5px;
  }

  .mobile__menu-contact .rhead__item:last-child {
    margin-bottom: 15px;
  }


  .promotion__button-w {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
  }

  .feedback_modal {
    display: none;
  }

  .feedback_modal .fs-contact-seller {
    background-color: #fff;
    padding: 10px;
    z-index: 1001;
    top: 24%;
    position: fixed;
    margin: 10px;
  }

  /*Стили с reloadteam.ru возможно, нужно будет заменить*/