:root {
    --black: #232323;
    --white: #FFF;
    --viewport-height: 100vh;
    --grey-bg: #eee8e6;
    --orange-bg: #ee752f;
    --scrollbar-width: 0px;
    --content-margins: 0.781vw;
    --grid-col-gap: 0.546vw;
    --body-width: calc(100vw - var(--scrollbar-width));
    --grid-col-width: calc(var(--body-width) / 8 - var(--grid-col-gap) - var(--content-margins) * 2 / 8 + var(--grid-col-gap) / 8);
    --w-x4: calc(var(--grid-col-width) * 4 + var(--grid-col-gap) * 3);
    --w-x5: calc(var(--grid-col-width) * 5 + var(--grid-col-gap) * 4);
    --font-size: 1.25vw;
}

@supports (height: 100dvh) {
    :root {
        --viewport-height: 100dvh;
    }
}

@media (orientation: portrait) {
    :root {
        --content-margins: 5px;
        --font-size: 3.5vw;
    }
}

@media all and (orientation: portrait) and (min-width: 550px) {
    :root {
        --grid-col-gap: 5px;
        --grid-col-width: calc(var(--body-width) / 7 - var(--grid-col-gap) - var(--content-margins) * 2 / 7 + var(--grid-col-gap) / 7);
        --font-size: 2.57vw;
    }
}

@media (orientation: landscape) and (min-width: 2200px) {
    :root {
        --fix-width-px: 2200px;
        --body-width: calc(var(--fix-width-px) - var(--scrollbar-width));
        --font-size: calc(var(--fix-width-px) / 80);
        --grid-col-gap: 0.546em;
    }
}

.cursor-pointer {
    cursor: pointer;
}

:root {
    --cookie-consent-animation-time: 1s;
    --cookie-consent-accent-color: var(--black);
    --cookie-consent-bg-color: var(--white);
    --cookie-consent-text-color: var(--black);
    --cookie-consent-btns-bg: var(--black);
    --cookie-consent-btns-text: var(--white);
    --cookie-consent-font-family: sans-serif;
    --cookie-consent-box-border-radius: 0px;
    --cookie-consent-max-width: 600px;
    --cookie-consent-btn-radius: 0px;
    --cookie-consent-box-paddings: 13px 15px;
    --cookie-consent-box-margin-bottom: 10px;
    --cookie-consent-box-margin-left-right: 10px;
    --cookie-consent-zindex: 20;
    --cookie-consent-font-size: calc(var(--font-size) * 1.25);
    --cookie-consent-btn-font-size: calc(var(--font-size) * 1.3);
  }

    @media (orientation: landscape) {
        :root body.ru {
        }
    }

    @media (orientation: portrait) {
    :root {
        --cookie-consent-font-size: calc(var(--font-size) * 1.2);
        --cookie-consent-btn-font-size: calc(var(--font-size) * 1.2);
      }
    }

    @media (orientation: portrait) and (min-width: 550px) {
        :root {
            --cookie-consent-font-size: calc(var(--font-size) * 1.1);
            --cookie-consent-btn-font-size: calc(var(--font-size) * 1.1);
          }
    }

  .cookie-banner-container {
    position: fixed;
    width: 100%;
    height: var(--viewport-height);
    z-index: var(--cookie-consent-zindex);
  }

  .c-b {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate3d(-50%,-50%,0);
    
    width: var(--w-x4);
    z-index: var(--cookie-consent-zindex);
    line-height: 1;
  }

  .c-b * {
    font-family: var(--cookie-consent-font-family);
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
    color: var(--cookie-consent-text-color);
    font-size: var(--font-size);
    float: none;
  }

  .c-b-body {
    position: relative;
    float: left;
    width: 100%;
    background: var(--cookie-consent-bg-color);
    border-radius: var(--cookie-consent-box-border-radius);
    padding: var(--cookie-consent-box-paddings);
    box-sizing: border-box;
    margin-bottom: var(--cookie-consent-box-margin-bottom);
    transform: translate3d(0, calc( var(--cookie-consent-box-margin-bottom) + 100% ), 0);
    transition: all cubic-bezier(0.22, 0.61, 0.36, 1) var(--cookie-consent-animation-time);
    opacity: 0;
  }

  .c-b-active  .c-b-body {
    transform: translate3d(0, 0%, 0);
    opacity: 1;
    transition: all cubic-bezier(0.22, 0.61, 0.36, 1) var(--cookie-consent-animation-time);

  }

  .c-b-align-left { 
    left: var(--cookie-consent-box-margin-left-right);
    transform: none;
  }

  .c-b-align-right { 
    right: var(--cookie-consent-box-margin-left-right);
    left: auto;
    transform: none;
  }

  .c-b-collapsed,
  .c-b-expanded {
    display: none;
  }

  .c-b-collapsed {
    display: flex;
    align-items: center; 
    justify-content: space-between; 
    gap: var(--font-size); 
  }

  .c-b.c-b-expanded-mode .c-b-expanded {
    display: block;
  }

  .c-b.c-b-expanded-mode .c-b-collapsed {
    display: none;
  }

  .c-b.c-b-collapsed-mode .c-b-collapsed {
    display: flex;
    display: block;
  }

  .c-b.c-b-collapsed-mode .c-b-expanded {
    display: none;
  }

  .cookie-text {
    color: var(--cookie-consent-text-color);
    font-size: var(--cookie-consent-font-size);
    margin-bottom: calc( var(--cookie-consent-font-size) + 4px );
    flex: 1;
    display: block;
  }


  .cookie-text a, .c-b-expanded a {
    color: var(--cookie-consent-text-color);
    font-size: var(--cookie-consent-btn-font-size);
    text-decoration: underline;
}

  .c-b-button-row {
    display: block;
    float: right;
    flex-shrink: 0;
    display: flex;
    gap: calc(var(--font-size) * 0.5);
    width: 100%;
  }

  .c-b-expanded .c-b-button-row {
  }

  .c-b-btn {
    flex: 1;
    padding: 10px;
    padding: 10px 7px;
    text-align: center;
    border-radius: var(--cookie-consent-btn-radius);
    cursor: pointer;
    font-size: var(--cookie-consent-btn-font-size);
    text-decoration: none;
    border: none;
    background-color: var(--cookie-consent-bg-color);
    background-color: var(--grey-bg);
    background-color: var(--orange-bg);
    background-color: var(--cookie-consent-btns-bg);
    color: var(--cookie-consent-btns-text);
    line-height: 1.2;
  }

  .c-b-btn-accept {
    background-color: var(--cookie-consent-accent-color);
    background-color: var(--grey-bg);
    background-color: var(--orange-bg);
    background-color: var(--cookie-consent-btns-bg);
    color: var(--cookie-consent-btns-text);
    padding: 4px 12px;
  }

  .c-b-btn-adjust {
    
    color: var(--cookie-consent-btns-text);
  }

  .c-b-btn-deny {
    
    color: var(--cookie-consent-btns-text);
    
  }

  .c-b-section {
    position: relative;
  }

  .c-b-section::after {
    content: '';
    position: absolute;
    bottom: 0px;
    left: 0px;
    background-color: var(--cookie-consent-text-color);
    opacity: 0.15;
    height: 1px;
    width: 100%;
  }

  .c-b-section:nth-child(2) {
    margin-bottom: 11px;
  }

  .c-b-section:first-child:after {
    display: none;
  }

  .c-b-section a {
    color: var(--cookie-consent-text-color);
    font-size: var(--cookie-consent-btn-font-size);
  }

  .c-b-section h3, .cookie-text h3 {
    font-size: calc( var(--cookie-consent-font-size) * 1.4 );
    margin: 0 0 calc(var(--font-size) * 0.7);
    font-weight: 700;
    color: var(--cookie-consent-text-color);
    padding-bottom: calc(var(--font-size) * 0.8);
  }

  .c-b-section p {
    font-size: calc( var(--cookie-consent-font-size) );
    color: var(--cookie-consent-text-color);
    margin: 0 0 12px;
    padding: 0;
    width: 100%;
  }

  .cookie-option {
    display: flex;
    align-items: center;
    justify-content: space-between;
    cursor: pointer;
    padding-bottom: 4px;
    gap: 6px;
    position: relative;
    padding-top: 4px;
  }

  .cookie-option::after {
    content: '';
    position: absolute;
    top: 0px;
    left: 0px;
    background-color: var(--cookie-consent-text-color);
    opacity: 0.15;
    height: 1px;
    width: 100%;
  }

  .cookie-option .c-b-switch-label {
    flex-grow: 1;
    font-size: calc( var(--cookie-consent-font-size) + 2px );
    color: var(--cookie-consent-text-color);
  }

  .c-b-toggle-icon {
    font-size: calc( var(--cookie-consent-font-size) + 4px );
    font-size: calc( var(--cookie-consent-font-size) + 4px );
    display: inline-block;
    text-align: center;
    user-select: none;
    color: var(--cookie-consent-text-color);
  }

  .c-b-info-text {
    font-size: 13px;
    color: var(--cookie-consent-text-color);
    margin: 4px 0 12px 26px;
  }

  .c-b-info-text:last-child {
    padding-bottom: 8px;
  }

  .c-b-switch {
    display: flex;
    justify-content: space-between;
    align-items: center;
  }

  .c-b-toggle {
    position: relative;
    width: 38px;
    height: 24px;
    flex-shrink: 0;
  }

  .c-b-toggle input {
    opacity: 0;
    width: 0;
    height: 0;
  }

  .c-b-slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: var(--cookie-consent-text-color);
    opacity: 0.4;
    border-radius: 24px;
    transition: 0.3s;
  }

  .c-b-slider:before {
    position: absolute;
    content: '';
    height: 20px;
    width: 20px;
    left: 1.5px;
    bottom: 2px;
    background-color: var(--cookie-consent-bg-color);
    border-radius: 50%;
    transition: 0.3s;
  }

  .c-b-toggle input:checked + .c-b-slider {
    background-color: var(--cookie-consent-accent-color);
    opacity: 1;
  }

  .c-b-toggle input:checked + .c-b-slider:before {
    transform: translateX(15px);
  }

  .c-b-hidden {
    display: none !important;
  }

  .cookies-banner-bg {
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0px;
    left: 0px;
    overflow: hidden;
    z-index: var(--cookie-consent-zindex);
    background: rgba(0,0,0,0.7);
    transition: opacity ease-in-out 0.7s;
    opacity: 1;
  }

  .cookies-banner-hidden  {
    pointer-events: none;
    opacity: 0;
  }


  .cookie-banner-container .languages {
    clear: both;
    width: 100%;
    margin-bottom: calc(var(--font-size) * 0.4);
    padding-left: 0;
  }

  .cookie-banner-container .languages a {
    text-decoration: none;
    font-size: calc(var(--font-size) * 0.99);
  }

  @media (min-width: 600px) and (max-width: 1000px ) {
    :root {
        --cookie-consent-max-width: 80%;
    }
  }

  @media (orientation: portrait) and (max-width: 600px ) {
    .c-b {
      width: calc( 100% - var(--cookie-consent-box-margin-left-right) * 2 );
      max-width: var(--cookie-consent-max-width);
    }


    .c-b.c-b-collapsed-mode .c-b-collapsed {
      display: block;
    }

    .cookie-text {
        margin-bottom: calc(var(--cookie-consent-font-size) + 4px);
    }

    .c-b-button-row {
        float: none
    }

    .c-b-expanded .c-b-button-row {
      float: none;
      display: flex;
    }
  }

.cookie-banner-container .languages {
    position: relative;
    float: left;
    z-index: 1;
}

.cookie-banner-container .languages li {
    position: relative;
    float: left;
    margin-right: 0.65em;
    list-style: none;
    line-height: 1.25em;
}

.cookie-banner-container .languages li:last-child {
    margin-right: 0;
}

.cookie-banner-container .languages li.act {
}

.cookie-banner-container .languages li a {
    font-weight: 700;
    font-size: 1em;
    text-transform: uppercase;
}