body {
    font-family: 'Open Sans', sans-serif;
    font-weight: 400;
    font-size: 14px;
    line-height: 22px;
    color: var(--text);
    width: 100%;
    background-color: var(--bg-home);
    -webkit-text-size-adjust: 100%;
}

.main {
    width: 100%;
    max-width: 1240px;
    margin: 0 auto;
}

.background>img {
    display: block;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    overflow: hidden;
    object-fit: cover;
    object-position: right;
    width: 100%;
    height: 100%;
    z-index: 0;
}

.image>img {
    display: block;
    position: relative;
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
}

.button {
    display: inline-block;
    position: relative;
    width: auto;
    height: auto;
    border-radius: 50px;
    background-color: var(--btn);
    font-weight: 700;
    font-size: 15px;
    line-height: 22px;
    text-transform:uppercase;
    text-align: center;
    white-space: nowrap;
    color: var(--bg-content);
    cursor: pointer;
    padding: 13px 31.5px;
    transition: all 0.5s;
}

.button:hover {
    transform: translateY(-5px);
    z-index: 10;
}

h1,
h2,
h3,
.title {
    display: block;
    position: relative;
    width: 100%;
    font-family: "Roboto Condensed", sans-serif;
    font-weight: 700;
    text-transform:uppercase;
    text-align: center;
}

h1,
.title.general {
    font-size: 32px;
    line-height: 40px;
    text-align: left;
    color: var(--bg-content);
}

h2,
.title.high {
    font-size: 24px;
    line-height: 32px;
    color: var(--title);
}

h3,
.title.subtitle {
    font-size: 15px;
    line-height: 22px;
    color: var(--title);
}

.content {
    display: block;
    position: relative;
    overflow: hidden;
    height: auto;
    border-radius: 6px;
    background-color: var(--bg-content);
    padding: 32px 20px;
} 

.content + .content {
    margin-top: 20px; 
}

/**-------------- HEADER --------------*/

.header {
    position: fixed;
    top: 0px;
    left: 0px;
    right: 0px;
    z-index: 1000;
}

.header__content {
    position: relative;
    max-width: 100%;
    display: flex;
    align-items: center;
    overflow: visible;
    height: 80px;
    background-color: var(--header);
    border-radius: 0;
    padding: 12px 48px 12px 100px;
}

.header__logo img {
    max-width: 182px;
}
    

.menu ul {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0;
}

.header__menu ul {
    background-color: var(--bg-menu);
    border-radius: 50px;
    margin-left: 24px;
}

.header-menu__list {
    position: relative;
    font-weight: 400;
    font-size: 15px;
    line-height: 22px;
    text-transform: uppercase;
    color: var(--bg-content);
    padding: 13px 24px;
    border-radius: 50px;
    transition: background-color 0.3s;
}

.header-menu__list:hover {
    background-color: var(--hover-menu);
}

.header-dropdown__link {
    background: transparent;
    border: none;
    font-weight: 400;
    font-size: 15px;
    line-height: 22px;
    text-transform: uppercase;
    color: var(--bg-content);
}

.header-dropdown__toggle {
    width: 10px;
    height: 7px;
    background: url("../img/chevron-down.svg") no-repeat center / contain;
    vertical-align: middle;
    margin-left: 5px;
    transition: transform 0.3s;
}

.header-dropdown__toggle.active {
    transform: rotate(180deg);
}

.header-menu__list > ul.header__dropdown {
    display: none;
    position: absolute;
    top: 55px;
    left: 0;
    flex-direction: column;
    align-items: flex-start;
    min-width: 161px;
    white-space: nowrap;
    border-radius: 6px;
    background-color: var(--dropdown-menu);
    margin-left: 0;
    z-index: 2000;
    opacity: 0;
    transform: translateY(-8px);
    transition: opacity 0.25s ease, transform 0.25s ease;
}

.header-menu__list > ul.header__dropdown.show {
    display: flex;
    opacity: 1;
    transform: translateY(0);
}

.header-dropdown__list {
    display: block;
    padding: 8px 16px;
}

.header-dropdown__list a {
    color: var(--bg-content);
    transition: color 0.2s;
}

.header-dropdown__list a:hover {
    color: var(--btn); 
}

.header__button-auth {
    margin-left: auto;
}

.header__button {
    padding-left: 24px;
    padding-right: 24px;
}

.header__button-login {
    background-color: var(--bg-menu);
    margin-right: 16px;
}

.button.green {
    background-color: var(--btn-green);
}

.header__watch {
    margin-left: 24px;
    margin-right: 24px;
}


.header__watch span {
    font-size: 15px;
    color: var(--bg-content);
}

.header__lang {
    display: flex;
    align-items: center;
    background-color: var(--header);
}

.header__lang img {
    display: block;
    width: 24px;
    height: 24px;
}

.header__lang span {
    font-size: 14px;
    line-height: 22px;
    text-transform: uppercase;
    color: var(--bg-content);
    margin-left: 8px;
}

/**-------------- HERO --------------*/

.hero__content {
   border-radius: 0;
   padding: 0;
   margin-top: 80px;
   margin-bottom: 20px;
}

.hero__info {
    position: relative;
    max-width: 610px;
    background-color: transparent;
    padding: 87px 0 87px 100px;
    z-index: 1;
}

.hero__info span {
    display: block;
    font-weight: 700;
    color: var(--bg-content);
}

.hero__rating {
    font-weight: 700;
    text-transform: uppercase;
    color: var(--bg-content);
}

.hero__title {
    margin-top: 8px;
    margin-bottom: 8px;
}

.hero__button {
    margin-top: 16px;
}

/**-------------- INFO --------------*/

.info__content {
    background-color: transparent;
    padding: 0;
}

.info__team {
    display: flex;
    justify-content: space-between;
}

.info__table {
    width: 100%;
    max-width: 610px;
    border-collapse: separate;
    border-spacing: 0 4px; 
}

.info__table tr {
    background-color: var(--bg-content);
}

.info__table td {
    font-weight: 700;
    text-align: left;
    vertical-align: middle;
    white-space: nowrap;
    border-radius: 6px;
    padding: 12px 16px;
}

.info__table tr td:first-child {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.info__table td+td {
    font-weight: 400;
    padding-left: 0;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

/**-------------- BANNER --------------*/

.banner__content {
    padding: 53px 0;
}

.banner__info {
    position: relative;
    max-width: 610px;
    background-color: transparent;
    padding: 0 20px;
    z-index: 1;
}

.banner__info span {
    display: block;
    font-weight: 700;
    font-size: 15px;
    line-height: 22px;
    color: var(--bg-content)
}

.banner__title {
    font-size: 32px;
    line-height: 40px;
    text-align: left;
    color: var(--bg-content);
    margin-top: 8px;
}

.banner__button {
    margin-top: 16px;
}

/**-------------- GAMES --------------*/

.games__content {
    background-color: transparent;
    overflow: visible;
    padding: 0;
}

.games-panel__list {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.games-panel__list li {
    position: relative;
    overflow: hidden;
    width: 232px;
    height: 138px;
    border-radius: 6px;
}

.games-panel__image img {
    width: 232px;
    height: 138px;
}

.games-panel__hover {
    position: absolute;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 232px;
    height: 138px;
    background: #000000CC;
    border-radius: 6px;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    opacity: 0;
    visibility: hidden;
}

.games-panel__list li:hover .games-panel__hover {
    opacity: 1;
    visibility: visible;
}

/**-------------- NAVIGATION --------------*/

.navigation__content {
    padding: 0;
}

.navigation__general {
    padding: 17px 20px;
}

.navigation__general button {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    font-weight: 700;
    text-transform: uppercase;
    text-wrap: wrap;
    text-align: left;
    color: var(--text);
    background-color: transparent;
    border-radius: 6px;
    -webkit-tap-highlight-color: transparent;
}

.navigation__general button::after {
    content: "";
    display: block;
    width: 32px;
    height: 32px;
    border-radius: 6px;
    background-image: url("../img/arrow-down.png");
    background-color: var(--btn-navigation);
    background-repeat: no-repeat;
    background-position: center;
    transition: transform 0.5s ease;
}

.navigation__general.active button::after {
    transform: rotate(180deg);
}

.navigation__general.active {
    background-color: var(--title);
    border-radius: 6px 6px 0 0;
}

.navigation__general.active button {
    color: var(--bg-content);
}

.navigation__menu {
    height: 0;
    opacity: 0;
    overflow: hidden;
    padding: 0 20px;
    transition: height 0.5s ease, opacity 0.5s ease, padding 0.5s ease;
}

.navigation__general.active + .navigation__menu {
    opacity: 1;
    padding: 8px 20px 0 20px;
}

.navigation__menu li a {
    display: block;
    color: var(--text);
    margin-bottom: 8px;
    transition: transform 0.5s ease;
    -webkit-tap-highlight-color: transparent;
}

.navigation__menu li a:hover {
    font-weight: 700;
}

/**-------------- ARTICLE --------------*/

.article {
    text-align: left;
}

.article *+* {
    margin-top: 16px;
}


.article p a {
    font-weight: 700;
    color: var(--btn);
}

.article li {
    margin-top: 8px;
}

.article li {
    display: flex;
    align-items: center;
}

.article ul li::before {
    content: "";
    display: inline-block;
    width: 6px;
    height: 6px;
    flex-shrink: 0;
    background: var(--title);
    border-radius: 50%;
    margin-right: 6px;
}

.article ol {
    counter-reset: num;   
}

.article ol li::before {
    counter-increment: num;
    content: counter(num) ".";
    display: inline-flex;
    justify-content: center;
    align-items: center;
    flex-shrink: 0;
    color: var(--text);
    margin-right: 5px;
}

.article__button {
    display: block;
    max-width: max-content;
    margin: 12px auto 0;
}

/**-------------- FAQ --------------*/

.faq__list li {
    margin-top: 20px;
}

.faq__question {
    position: relative;
    width: 100%;
    max-width: 1200px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-weight: 700;
    font-size: 15px;
    line-height: 22px;
    text-wrap: wrap;
    text-align: left;
    color: var(--bg-content);
    background-color: var(--title);
    border-radius: 6px;
    padding: 17px 20px;
    -webkit-tap-highlight-color: transparent;
}

.faq__question::after {
    content: "";
    display: inline-block;
    width: 32px;
    height: 32px;
    margin-left: 20px;
    border-radius: 6px;
    flex-shrink: 0;
    background-color: var(--btn-navigation);
    background-image: url("../img/arrow-down.png");
    background-repeat: no-repeat, no-repeat;
    background-position: center, center;
    background-size: 11px 6px, cover;
    transition: all 0.5s;
}

.faq__list li.active .faq__question::after {
    transform: rotate(180deg);
}

.faq__list li.active .faq__question {
    color: var(--bg-content);
    background-color: var(--title);
    border-radius: 6px 6px 0 0;
}

.faq__answer {
    max-height: 0;
    opacity: 0;
    padding: 0 20px;
    transition: max-height 0.5s ease, padding 0.5s ease, opacity 0.5s ease;
}

.faq__list li.active .faq__answer {
    max-height: 600px;
    background-color: transparent;
    opacity: 1;
    padding: 12px 20px;
}

/**-------------- FOOTER --------------*/

.footer__content {
    max-width: 100%;
    background-color: var(--bg-content);
    border-radius: 0;
    margin-top: 20px;
}

.footer__navigation {
    display: flex;
    justify-content: center;
    margin-bottom: 32px;
}

.footer__navigation li:not(:last-child) {
    margin-right: 32px;
}

.footer__navigation li a {
    font-weight: 700;
    font-size: 15px;
    line-height: 22px;
    color: var(--text);
    text-transform: uppercase;
    transition: all 0.5s;
}

.footer__navigation a:hover {
    color: var(--btn);
}

.footer__images {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    margin-bottom: 32px;
}

.footer-images__image:not(:last-child) {
    margin-right: 32px;
}

.footer__bottom {
    width: 100%;
    max-width: 1240px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    margin: 0 auto;
    
}

.footer__details {
    width: 100%;
    max-width: 1180px;
    text-align: center;
    margin-right: 20px;
}

/**-------------- SCROLL --------------*/

.scroll__button {
    display: none;
    position: absolute;
    bottom: 20px;
    right: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background-color:var(--btn-green);
    box-shadow: 0px 4px 25px 0px #054146CC;
    background-image: url("../img/vector.png");
    background-repeat: no-repeat, no-repeat;
    background-position: center;
    transition: all 0.5s;
    z-index: 999;
}

.scroll__button:hover {
    box-shadow: 0px 4px 40px 0px var(--btn);
}

/**-------------- BONUSES PAGE --------------*/

.main-bonuses {
    width: 100%;
    max-width: 1240px;
    margin: 0 auto;
}

/**-------------- HEADER-BONUSES --------------*/

.header-bonuses {
    position: fixed;
    top: 0px;
    left: 0px;
    right: 0px;
    z-index: 1000;
}

.header-bonuses__content {
    position: relative;
    max-width: 100%;
    display: flex;
    align-items: center;
    overflow: visible;
    height: 80px;
    background-color: var(--header);
    border-radius: 0;
    padding: 12px 48px 12px 100px;
}

.header-bonuses__logo img {
    max-width: 182px;
}

.header-bonuses__menu ul {
    background-color: var(--bg-menu);
    border-radius: 50px;
    margin-left: 24px;
}

.header-bonuses-menu__list {
    position: relative;
    font-weight: 400;
    font-size: 15px;
    line-height: 22px;
    text-transform: uppercase;
    color: var(--bg-content);
    padding: 13px 24px;
    border-radius: 50px;
    transition: background-color 0.3s;
}

.header-bonuses-menu__list:hover {
    background-color: var(--hover-menu);
}

.header-bonuses-dropdown__link {
    background: transparent;
    border: none;
    font-weight: 400;
    font-size: 15px;
    line-height: 22px;
    text-transform: uppercase;
    color: var(--bg-content);
}

.header-bonuses-dropdown__toggle {
    width: 10px;
    height: 7px;
    background: url("../img/chevron-down.svg") no-repeat center / contain;
    vertical-align: middle;
    margin-left: 5px;
    transition: transform 0.3s;
}

.header-bonuses-dropdown__toggle.active {
    transform: rotate(180deg);
}

.header-bonuses-menu__list > ul.header-bonuses__dropdown {
    display: none;
    position: absolute;
    top: 55px;
    left: 0;
    flex-direction: column;
    align-items: flex-start;
    min-width: 161px;
    white-space: nowrap;
    border-radius: 6px;
    background-color: var(--dropdown-menu);
    margin-left: 0;
    z-index: 2000;
    opacity: 0;
    transform: translateY(-8px);
    transition: opacity 0.25s ease, transform 0.25s ease;
}

.header-bonuses-menu__list > ul.header-bonuses__dropdown.show {
    display: flex;
    opacity: 1;
    transform: translateY(0);
}

.header-bonuses-dropdown__list {
    display: block;
    padding: 8px 16px;
}

.header-bonuses-dropdown__list a {
    color: var(--bg-content);
    transition: color 0.2s;
}

.header-bonuses-dropdown__list a:hover {
    color: var(--btn);
}

.header-bonuses__button-auth {
    margin-left: auto;
}

.header-bonuses__button {
    padding-left: 24px;
    padding-right: 24px;
}

.header-bonuses__button-login {
    background-color: var(--bg-menu);
    margin-right: 16px;
}

.header-bonuses__watch {
    margin-left: 24px;
    margin-right: 24px;
}


.header-bonuses__watch span {
    font-size: 15px;
    color: var(--bg-content);
}

.header-bonuses__lang {
    display: flex;
    align-items: center;
    background-color: var(--header);
}

.header-bonuses__lang img {
    display: block;
    width: 24px;
    height: 24px;
}

.header-bonuses__lang span {
    font-size: 14px;
    line-height: 22px;
    text-transform: uppercase;
    color: var(--bg-content);
    margin-left: 8px;
}

/**-------------- HERO-BONUSES --------------*/

.hero-bonuses__content {
    border-radius: 0;
    padding: 0;
    margin-top: 80px;
    margin-bottom: 20px;
}

.hero-bonuses__info {
    position: relative;
    max-width: 610px;
    background-color: transparent;
    padding: 87px 0 87px 100px;
    z-index: 1;
}

.hero-bonuses__info span {
    display: block;
    color: var(--bg-content);
}

.hero-bonuses__title {
    margin-top: 8px;
    margin-bottom: 8px;
}

.hero-bonuses__button {
    margin-top: 16px;

}

.breadcrumbs__link {
    display: flex;
    justify-content: flex-start;
    align-items: center;
}

.breadcrumbs__link a {
    display: inline-block;
    white-space: nowrap;
    text-transform: capitalize;
    transition: font-weight 0.3s;
}

.breadcrumbs__link li {
    position: relative;
    display: flex;
    align-items: center;
}

.breadcrumbs__link li:not(:first-child)::before {
    content: "";
    width: 1px;
    height: 12px;
    background-color: var(--bg-content);
    margin: 0 8px; 
}

.breadcrumbs__link a[href]:hover {
    font-weight: 400;
}

.breadcrumbs__link a:not([href]) {
    font-weight: 700;
    pointer-events: none; 
}

/**-------------- NAVIGATION-BONUSES --------------*/

.navigation-bonuses__content {
    padding: 0;
}

.navigation-bonuses__general {
    padding: 17px 20px;
}

.navigation-bonuses__general button {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    font-weight: 700;
    text-transform: uppercase;
    text-wrap: wrap;
    text-align: left;
    color: var(--text);
    background-color: transparent;
    border-radius: 6px;
    -webkit-tap-highlight-color: transparent;
}

.navigation-bonuses__general button::after {
    content: "";
    display: block;
    width: 32px;
    height: 32px;
    border-radius: 6px;
    background-image: url("../img/arrow-down.png");
    background-color: var(--btn-navigation);
    background-repeat: no-repeat;
    background-position: center;
    transition: transform 0.5s ease;
}

.navigation-bonuses__general.active button::after {
    transform: rotate(180deg);
}

.navigation-bonuses__general.active {
    background-color: var(--title);
    border-radius: 6px 6px 0 0;
}

.navigation-bonuses__general.active button {
    color: var(--bg-content);
}

.navigation-bonuses__menu {
    height: 0;
    opacity: 0;
    overflow: hidden;
    padding: 0 20px;
    transition: height 0.5s ease, opacity 0.5s ease, padding 0.5s ease;
}

.navigation-bonuses__general.active + .navigation-bonuses__menu {
    opacity: 1;
    padding: 8px 20px 0 20px;
}

.navigation-bonuses__menu li a {
    display: block;
    color: var(--text);
    margin-bottom: 8px;
    transition: transform 0.5s ease;
    -webkit-tap-highlight-color: transparent;
}

.navigation-bonuses__menu li a:hover {
    font-weight: 700;
}

/**-------------- BONUS --------------*/

.bonus__content {
    background-color: transparent;
    padding: 0;
}

.bonus__list {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    margin: -10px;
}

.bonus__list li {
    position: relative;
    overflow: visible;
    width: calc(50% - 10px);
    max-width: 610px;
    border-radius: 6px;
    background-color: var(--bg-bonus);
    margin: 10px;
}

.bonus__list li::before {
    content: "";
    position: absolute;
    top: 210px;
    left: 50%;
    transform: translateX(-50%);
    width: 80px;
    height: 80px;
    background-image: url("../img/bonus-icon.svg");
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    z-index: 3; 
}

.bonus__image {
    width: 610px;
    height: 280px;
}

.bonus__info {
    position: relative;
    max-width: 544px;
    text-align: center;
    background-color: var(--bonus-info);
    box-shadow: 0px 4px 25px 0px #054146CC;
    padding: 48px 16px 16px 16px;
    margin: -35px auto 0;
    z-index: 2;
    
}

.bonus__title {
    margin-bottom: 16px;
}

.bonus__text {
    display: block;
    font-size: 15px;
    line-height: 22px;
}

.bonus__buttons {
    display: flex;
    justify-content: space-between;
    padding-left: 33px;
    padding-right: 33px;
    margin-top: 24px;
    margin-bottom: 24px;
}

.bonus__button {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    max-width: 268px;
    white-space: normal;
    word-break: break-word;
    background-color: var(--btn-bonus);
}


/**-------------- FAQ-BONUSES --------------*/

.faq-bonuses__list li {
    margin-top: 20px;
}

.faq-bonuses__question {
    position: relative;
    width: 100%;
    max-width: 1200px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-weight: 700;
    font-size: 15px;
    line-height: 22px;
    text-wrap: wrap;
    text-align: left;
    color: var(--bg-content);
    background-color: var(--title);
    border-radius: 6px;
    padding: 17px 20px;
    -webkit-tap-highlight-color: transparent;
}

.faq-bonuses__question::after {
    content: "";
    display: inline-block;
    width: 32px;
    height: 32px;
    margin-left: 20px;
    border-radius: 6px;
    flex-shrink: 0;
    background-color: var(--btn-navigation);
    background-image: url("../img/arrow-down.png");
    background-repeat: no-repeat, no-repeat;
    background-position: center, center;
    background-size: 11px 6px, cover;
    transition: all 0.5s;
}

.faq-bonuses__list li.active .faq-bonuses__question::after {
    transform: rotate(180deg);
}

.faq-bonuses__list li.active .faq-bonuses__question {
    color: var(--bg-content);
    background-color: var(--title);
    border-radius: 6px 6px 0 0;
}

.faq-bonuses__answer {
    max-height: 0;
    opacity: 0;
    padding: 0 20px;
    transition: max-height 0.5s ease, padding 0.5s ease, opacity 0.5s ease;
}

.faq-bonuses__list li.active .faq-bonuses__answer {
    max-height: 600px;
    background-color: transparent;
    opacity: 1;
    padding: 12px 20px;
}

/**-------------- FOOTER-BONUSES --------------*/

.footer-bonuses__content {
    max-width: 100%;
    background-color: var(--bg-content);
    border-radius: 0;
    margin-top: 20px;
}

.footer-bonuses__navigation {
    display: flex;
    justify-content: center;
    margin-bottom: 32px;
}

.footer-bonuses__navigation li:not(:last-child) {
    margin-right: 32px;
}

.footer-bonuses__navigation li a {
    font-weight: 700;
    font-size: 15px;
    line-height: 22px;
    color: var(--text);
    text-transform: uppercase;
    transition: all 0.5s;
}

.footer-bonuses__navigation a:hover {
    color: var(--btn);
}

.footer-bonuses__images {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    margin-bottom: 32px;
}

.footer-bonuses-images__image:not(:last-child) {
    margin-right: 32px;
}

.footer-bonuses__bottom {
    width: 100%;
    max-width: 1240px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    margin: 0 auto;

}

.footer-bonuses__details {
    width: 100%;
    max-width: 1180px;
    text-align: center;
    margin-right: 20px;
}

/**-------------- FREE-SPINS PAGE --------------*/

.main-spins {
    width: 100%;
    max-width: 1240px;
    margin: 0 auto;
}

/**-------------- HEADER-SPINS --------------*/

.header-spins {
    position: fixed;
    top: 0px;
    left: 0px;
    right: 0px;
    z-index: 1000;
}

.header-spins__content {
    position: relative;
    max-width: 100%;
    display: flex;
    align-items: center;
    overflow: visible;
    height: 80px;
    background-color: var(--header);
    border-radius: 0;
    padding: 12px 48px 12px 100px;
}

.header-spins__logo img {
    max-width: 182px;
}

.header-spins__menu ul {
    background-color: var(--bg-menu);
    border-radius: 50px;
    margin-left: 24px;
}

.header-spins-menu__list {
    position: relative;
    font-weight: 400;
    font-size: 15px;
    line-height: 22px;
    text-transform: uppercase;
    color: var(--bg-content);
    padding: 13px 24px;
    border-radius: 50px;
    transition: background-color 0.3s;
}

.header-spins-menu__list:hover {
    background-color: var(--hover-menu);
}

.header-spins-dropdown__link {
    background: transparent;
    border: none;
    font-weight: 400;
    font-size: 15px;
    line-height: 22px;
    text-transform: uppercase;
    color: var(--bg-content);
}

.header-spins-dropdown__toggle {
    width: 10px;
    height: 7px;
    background: url("../img/chevron-down.svg") no-repeat center / contain;
    vertical-align: middle;
    margin-left: 5px;
    transition: transform 0.3s;
}

.header-spins-dropdown__toggle.active {
    transform: rotate(180deg);
}

.header-spins-menu__list > ul.header-spins__dropdown {
    display: none;
    position: absolute;
    top: 55px;
    left: 0;
    flex-direction: column;
    align-items: flex-start;
    min-width: 161px;
    white-space: nowrap;
    border-radius: 6px;
    background-color: var(--dropdown-menu);
    margin-left: 0;
    z-index: 2000;
    opacity: 0;
    transform: translateY(-8px);
    transition: opacity 0.25s ease, transform 0.25s ease;
}

.header-spins-menu__list > ul.header-spins__dropdown.show {
    display: flex;
    opacity: 1;
    transform: translateY(0);
}

.header-spins-dropdown__list {
    display: block;
    padding: 8px 16px;
}

.header-spins-dropdown__list a {
    color: var(--bg-content);
    transition: color 0.2s;
}

.header-spins-dropdown__list a:hover {
    color: var(--btn);
}

.header-spins__button-auth {
    margin-left: auto;
}

.header-spins__button {
    padding-left: 24px;
    padding-right: 24px;
}

.header-spins__button-login {
    background-color: var(--bg-menu);
    margin-right: 16px;
}

.header-spins__watch {
    margin-left: 24px;
    margin-right: 24px;
}


.header-spins__watch span {
    font-size: 15px;
    color: var(--bg-content);
}

.header-spins__lang {
    display: flex;
    align-items: center;
    background-color: var(--header);
}

.header-spins__lang img {
    display: block;
    width: 24px;
    height: 24px;
}

.header-spins__lang span {
    font-size: 14px;
    line-height: 22px;
    text-transform: uppercase;
    color: var(--bg-content);
    margin-left: 8px;
}

/**-------------- HERO-SPINS --------------*/

.hero-spins__content {
    border-radius: 0;
    padding: 0;
    margin-top: 80px;
    margin-bottom: 20px;
}

.hero-spins__info {
    position: relative;
    max-width: 610px;
    background-color: transparent;
    padding: 87px 0 87px 100px;
    z-index: 1;
}

.hero-spins__info span {
    display: block;
    color: var(--bg-content);
}

.hero-spins__title {
    margin-top: 8px;
    margin-bottom: 8px;
}

.hero-spins__button {
    margin-top: 16px;

}

/**-------------- BANNER-SPINS --------------*/

.banner-spins__content {
    padding: 53px 0;
}

.banner-spins__info {
    position: relative;
    max-width: 610px;
    background-color: transparent;
    padding: 0 20px;
    z-index: 1;
}

.banner-spins__info span {
    display: block;
    font-weight: 700;
    font-size: 15px;
    line-height: 22px;
    color: var(--bg-content)
}

.banner-spins__title {
    font-size: 32px;
    line-height: 40px;
    text-align: left;
    color: var(--bg-content);
    margin-top: 8px;
}

.banner-spins__button {
    margin-top: 16px;
}

/**-------------- NAVIGATION-SPINS --------------*/

.navigation-spins__content {
    padding: 0;
}

.navigation-spins__general {
    padding: 17px 20px;
}

.navigation-spins__general button {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    font-weight: 700;
    text-transform: uppercase;
    text-wrap: wrap;
    text-align: left;
    color: var(--text);
    background-color: transparent;
    border-radius: 6px;
    -webkit-tap-highlight-color: transparent;
}

.navigation-spins__general button::after {
    content: "";
    display: block;
    width: 32px;
    height: 32px;
    border-radius: 6px;
    background-image: url("../img/arrow-down.png");
    background-color: var(--btn-navigation);
    background-repeat: no-repeat;
    background-position: center;
    transition: transform 0.5s ease;
}

.navigation-spins__general.active button::after {
    transform: rotate(180deg);
}

.navigation-spins__general.active {
    background-color: var(--title);
    border-radius: 6px 6px 0 0;
}

.navigation-spins__general.active button {
    color: var(--bg-content);
}

.navigation-spins__menu {
    height: 0;
    opacity: 0;
    overflow: hidden;
    padding: 0 20px;
    transition: height 0.5s ease, opacity 0.5s ease, padding 0.5s ease;
}

.navigation-spins__general.active + .navigation-spins__menu {
    opacity: 1;
    padding: 8px 20px 0 20px;
}

.navigation-spins__menu li a {
    display: block;
    color: var(--text);
    margin-bottom: 8px;
    transition: transform 0.5s ease;
    -webkit-tap-highlight-color: transparent;
}

.navigation-spins__menu li a:hover {
    font-weight: 700;
}

/**-------------- FAQ-SPINS --------------*/

.faq-spins__list li {
    margin-top: 20px;
}

.faq-spins__question {
    position: relative;
    width: 100%;
    max-width: 1200px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-weight: 700;
    font-size: 15px;
    line-height: 22px;
    text-wrap: wrap;
    text-align: left;
    color: var(--bg-content);
    background-color: var(--title);
    border-radius: 6px;
    padding: 17px 20px;
    -webkit-tap-highlight-color: transparent;
}

.faq-spins__question::after {
    content: "";
    display: inline-block;
    width: 32px;
    height: 32px;
    margin-left: 20px;
    border-radius: 6px;
    flex-shrink: 0;
    background-color: var(--btn-navigation);
    background-image: url("../img/arrow-down.png");
    background-repeat: no-repeat, no-repeat;
    background-position: center, center;
    background-size: 11px 6px, cover;
    transition: all 0.5s;
}

.faq-spins__list li.active .faq-spins__question::after {
    transform: rotate(180deg);
}

.faq-spins__list li.active .faq-spins__question {
    color: var(--bg-content);
    background-color: var(--title);
    border-radius: 6px 6px 0 0;
}

.faq-spins__answer {
    max-height: 0;
    opacity: 0;
    padding: 0 20px;
    transition: max-height 0.5s ease, padding 0.5s ease, opacity 0.5s ease;
}

.faq-spins__list li.active .faq-spins__answer {
    max-height: 600px;
    background-color: transparent;
    opacity: 1;
    padding: 12px 20px;
}

/**-------------- FOOTER-SPINS --------------*/

.footer-spins__content {
    max-width: 100%;
    background-color: var(--bg-content);
    border-radius: 0;
    margin-top: 20px;
}

.footer-spins__navigation {
    display: flex;
    justify-content: center;
    margin-bottom: 32px;
}

.footer-spins__navigation li:not(:last-child) {
    margin-right: 32px;
}

.footer-spins__navigation li a {
    font-weight: 700;
    font-size: 15px;
    line-height: 22px;
    color: var(--text);
    text-transform: uppercase;
    transition: all 0.5s;
}

.footer-spins__navigation a:hover {
    color: var(--btn);
}

.footer-spins__images {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    margin-bottom: 32px;
}

.footer-spins-images__image:not(:last-child) {
    margin-right: 32px;
}

.footer-spins__bottom {
    width: 100%;
    max-width: 1240px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    margin: 0 auto;

}

.footer-spins__details {
    width: 100%;
    max-width: 1180px;
    text-align: center;
    margin-right: 20px;
}

/**-------------- PROMO-CODE PAGE --------------*/

.main-promo {
    width: 100%;
    max-width: 1240px;
    margin: 0 auto;
}

/**-------------- HEADER-PROMO --------------*/

.header-promo {
    position: fixed;
    top: 0px;
    left: 0px;
    right: 0px;
    z-index: 1000;
}

.header-promo__content {
    position: relative;
    max-width: 100%;
    display: flex;
    align-items: center;
    overflow: visible;
    height: 80px;
    background-color: var(--header);
    border-radius: 0;
    padding: 12px 48px 12px 100px;
}

.header-promo__logo img {
    max-width: 182px;
}

.header-promo__menu ul {
    background-color: var(--bg-menu);
    border-radius: 50px;
    margin-left: 24px;
}

.header-promo-menu__list {
    position: relative;
    font-weight: 400;
    font-size: 15px;
    line-height: 22px;
    text-transform: uppercase;
    color: var(--bg-content);
    padding: 13px 24px;
    border-radius: 50px;
    transition: background-color 0.3s;
}

.header-promo-menu__list:hover {
    background-color: var(--hover-menu);
}

.header-promo-dropdown__link {
    background: transparent;
    border: none;
    font-weight: 400;
    font-size: 15px;
    line-height: 22px;
    text-transform: uppercase;
    color: var(--bg-content);
}

.header-promo-dropdown__toggle {
    width: 10px;
    height: 7px;
    background: url("../img/chevron-down.svg") no-repeat center / contain;
    vertical-align: middle;
    margin-left: 5px;
    transition: transform 0.3s;
}

.header-promo-dropdown__toggle.active {
    transform: rotate(180deg);
}

.header-promo-menu__list > ul.header-promo__dropdown {
    display: none;
    position: absolute;
    top: 55px;
    left: 0;
    flex-direction: column;
    align-items: flex-start;
    min-width: 161px;
    white-space: nowrap;
    border-radius: 6px;
    background-color: var(--dropdown-menu);
    margin-left: 0;
    z-index: 2000;
    opacity: 0;
    transform: translateY(-8px);
    transition: opacity 0.25s ease, transform 0.25s ease;
}

.header-promo-menu__list > ul.header-promo__dropdown.show {
    display: flex;
    opacity: 1;
    transform: translateY(0);
}

.header-promo-dropdown__list {
    display: block;
    padding: 8px 16px;
}

.header-promo-dropdown__list a {
    color: var(--bg-content);
    transition: color 0.2s;
}

.header-promo-dropdown__list a:hover {
    color: var(--btn);
}

.header-promo__button-auth {
    margin-left: auto;
}

.header-promo__button {
    padding-left: 24px;
    padding-right: 24px;
}

.header-promo__button-login {
    background-color: var(--bg-menu);
    margin-right: 16px;
}

.header-promo__watch {
    margin-left: 24px;
    margin-right: 24px;
}


.header-promo__watch span {
    font-size: 15px;
    color: var(--bg-content);
}

.header-promo__lang {
    display: flex;
    align-items: center;
    background-color: var(--header);
}

.header-promo__lang img {
    display: block;
    width: 24px;
    height: 24px;
}

.header-promo__lang span {
    font-size: 14px;
    line-height: 22px;
    text-transform: uppercase;
    color: var(--bg-content);
    margin-left: 8px;
}

/**-------------- HERO-PROMO --------------*/

.hero-promo__content {
    border-radius: 0;
    padding: 0;
    margin-top: 80px;
    margin-bottom: 20px;
}

.hero-promo__info {
    position: relative;
    max-width: 610px;
    background-color: transparent;
    padding: 87px 0 87px 100px;
    z-index: 1;
}

.hero-promo__info span {
    display: block;
    color: var(--bg-content);
}

.hero-promo__title {
    margin-top: 8px;
    margin-bottom: 8px;
}

.hero-promo__button {
    margin-top: 16px;

}

/**-------------- BANNER-PROMO --------------*/

.banner-promo__content {
    padding: 53px 0;
}

.banner-promo__image {
    position: absolute;
    bottom: 0;
    right: 194px;
}

.banner-promo__info {
    position: relative;
    max-width: 610px;
    background-color: transparent;
    padding: 0 20px;
    z-index: 1;
}

.banner-promo__info span {
    display: block;
    font-weight: 700;
    font-size: 15px;
    line-height: 22px;
    color: var(--bg-content)
}

.banner-promo__title {
    font-size: 32px;
    line-height: 40px;
    text-align: left;
    color: var(--bg-content);
    margin-top: 8px;
}

.banner-promo__button {
    margin-top: 16px;
}

/**-------------- NAVIGATION-PROMO --------------*/

.navigation-promo__content {
    padding: 0;
}

.navigation-promo__general {
    padding: 17px 20px;
}

.navigation-promo__general button {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    font-weight: 700;
    text-transform: uppercase;
    text-wrap: wrap;
    text-align: left;
    color: var(--text);
    background-color: transparent;
    border-radius: 6px;
    -webkit-tap-highlight-color: transparent;
}

.navigation-promo__general button::after {
    content: "";
    display: block;
    width: 32px;
    height: 32px;
    border-radius: 6px;
    background-image: url("../img/arrow-down.png");
    background-color: var(--btn-navigation);
    background-repeat: no-repeat;
    background-position: center;
    transition: transform 0.5s ease;
}

.navigation-promo__general.active button::after {
    transform: rotate(180deg);
}

.navigation-promo__general.active {
    background-color: var(--title);
    border-radius: 6px 6px 0 0;
}

.navigation-promo__general.active button {
    color: var(--bg-content);
}

.navigation-promo__menu {
    height: 0;
    opacity: 0;
    overflow: hidden;
    padding: 0 20px;
    transition: height 0.5s ease, opacity 0.5s ease, padding 0.5s ease;
}

.navigation-promo__general.active + .navigation-promo__menu {
    opacity: 1;
    padding: 8px 20px 0 20px;
}

.navigation-promo__menu li a {
    display: block;
    color: var(--text);
    margin-bottom: 8px;
    transition: transform 0.5s ease;
    -webkit-tap-highlight-color: transparent;
}

.navigation-promo__menu li a:hover {
    font-weight: 700;
}

/**-------------- FAQ-PROMO --------------*/

.faq-promo__list li {
    margin-top: 20px;
}

.faq-promo__question {
    position: relative;
    width: 100%;
    max-width: 1200px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-weight: 700;
    font-size: 15px;
    line-height: 22px;
    text-wrap: wrap;
    text-align: left;
    color: var(--bg-content);
    background-color: var(--title);
    border-radius: 6px;
    padding: 17px 20px;
    -webkit-tap-highlight-color: transparent;
}

.faq-promo__question::after {
    content: "";
    display: inline-block;
    width: 32px;
    height: 32px;
    margin-left: 20px;
    border-radius: 6px;
    flex-shrink: 0;
    background-color: var(--btn-navigation);
    background-image: url("../img/arrow-down.png");
    background-repeat: no-repeat, no-repeat;
    background-position: center, center;
    background-size: 11px 6px, cover;
    transition: all 0.5s;
}

.faq-promo__list li.active .faq-promo__question::after {
    transform: rotate(180deg);
}

.faq-promo__list li.active .faq-promo__question {
    color: var(--bg-content);
    background-color: var(--title);
    border-radius: 6px 6px 0 0;
}

.faq-promo__answer {
    max-height: 0;
    opacity: 0;
    padding: 0 20px;
    transition: max-height 0.5s ease, padding 0.5s ease, opacity 0.5s ease;
}

.faq-promo__list li.active .faq-promo__answer {
    max-height: 600px;
    background-color: transparent;
    opacity: 1;
    padding: 12px 20px;
}

/**-------------- FOOTER-PROMO --------------*/

.footer-promo__content {
    max-width: 100%;
    background-color: var(--bg-content);
    border-radius: 0;
    margin-top: 20px;
}

.footer-promo__navigation {
    display: flex;
    justify-content: center;
    margin-bottom: 32px;
}

.footer-promo__navigation li:not(:last-child) {
    margin-right: 32px;
}

.footer-promo__navigation li a {
    font-weight: 700;
    font-size: 15px;
    line-height: 22px;
    color: var(--text);
    text-transform: uppercase;
    transition: all 0.5s;
}

.footer-promo__navigation a:hover {
    color: var(--btn);
}

.footer-promo__images {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    margin-bottom: 32px;
}

.footer-promo-images__image:not(:last-child) {
    margin-right: 32px;
}

.footer-promo__bottom {
    width: 100%;
    max-width: 1240px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    margin: 0 auto;
}

.footer-promo__details {
    width: 100%;
    max-width: 1180px;
    text-align: center;
    margin-right: 20px;
}

/**-------------- WELCOME-BONUS PAGE --------------*/

.main-welcome {
    width: 100%;
    max-width: 1240px;
    margin: 0 auto;
}

/**-------------- HEADER-WELCOME --------------*/

.header-welcome {
    position: fixed;
    top: 0px;
    left: 0px;
    right: 0px;
    z-index: 1000;
}

.header-welcome__content {
    position: relative;
    max-width: 100%;
    display: flex;
    align-items: center;
    overflow: visible;
    height: 80px;
    background-color: var(--header);
    border-radius: 0;
    padding: 12px 48px 12px 100px;
}

.header-welcome__logo img {
    max-width: 182px;
}

.header-welcome__menu ul {
    background-color: var(--bg-menu);
    border-radius: 50px;
    margin-left: 24px;
}

.header-welcome-menu__list {
    position: relative;
    font-weight: 400;
    font-size: 15px;
    line-height: 22px;
    text-transform: uppercase;
    color: var(--bg-content);
    padding: 13px 24px;
    border-radius: 50px;
    transition: background-color 0.3s;
}

.header-welcome-menu__list:hover {
    background-color: var(--hover-menu);
}

.header-welcome-dropdown__link {
    background: transparent;
    border: none;
    font-weight: 400;
    font-size: 15px;
    line-height: 22px;
    text-transform: uppercase;
    color: var(--bg-content);
}

.header-welcome-dropdown__toggle {
    width: 10px;
    height: 7px;
    background: url("../img/chevron-down.svg") no-repeat center / contain;
    vertical-align: middle;
    margin-left: 5px;
    transition: transform 0.3s;
}

.header-welcome-dropdown__toggle.active {
    transform: rotate(180deg);
}

.header-welcome-menu__list > ul.header-welcome__dropdown {
    display: none;
    position: absolute;
    top: 55px;
    left: 0;
    flex-direction: column;
    align-items: flex-start;
    min-width: 161px;
    white-space: nowrap;
    border-radius: 6px;
    background-color: var(--dropdown-menu);
    margin-left: 0;
    z-index: 2000;
    opacity: 0;
    transform: translateY(-8px);
    transition: opacity 0.25s ease, transform 0.25s ease;
}

.header-welcome-menu__list > ul.header-welcome__dropdown.show {
    display: flex;
    opacity: 1;
    transform: translateY(0);
}

.header-welcome-dropdown__list {
    display: block;
    padding: 8px 16px;
}

.header-welcome-dropdown__list a {
    color: var(--bg-content);
    transition: color 0.2s;
}

.header-welcome-dropdown__list a:hover {
    color: var(--btn);
}

.header-welcome__button-auth {
    margin-left: auto;
}

.header-welcome__button {
    padding-left: 24px;
    padding-right: 24px;
}

.header-welcome__button-login {
    background-color: var(--bg-menu);
    margin-right: 16px;
}

.header-welcome__watch {
    margin-left: 24px;
    margin-right: 24px;
}


.header-welcome__watch span {
    font-size: 15px;
    color: var(--bg-content);
}

.header-welcome__lang {
    display: flex;
    align-items: center;
    background-color: var(--header);
}

.header-welcome__lang img {
    display: block;
    width: 24px;
    height: 24px;
}

.header-welcome__lang span {
    font-size: 14px;
    line-height: 22px;
    text-transform: uppercase;
    color: var(--bg-content);
    margin-left: 8px;
}

/**-------------- HERO-WELCOME --------------*/

.hero-welcome__content {
    border-radius: 0;
    padding: 0;
    margin-top: 80px;
    margin-bottom: 20px;
}

.hero-welcome__info {
    position: relative;
    max-width: 610px;
    background-color: transparent;
    padding: 87px 0 87px 100px;
    z-index: 1;
}

.hero-welcome__info span {
    display: block;
    color: var(--bg-content);
}

.hero-welcome__title {
    margin-top: 8px;
    margin-bottom: 8px;
}

.hero-welcome__button {
    margin-top: 16px;

}

/**-------------- BANNER-WELCOME --------------*/

.banner-welcome__content {
    padding: 53px 0;
}

.banner-welcome__image {
    position: absolute;
    bottom: 28px;
    right: 215px;
}

.banner-welcome__info {
    position: relative;
    max-width: 610px;
    background-color: transparent;
    padding: 0 20px;
    z-index: 1;
}

.banner-welcome__info span {
    display: block;
    font-weight: 700;
    font-size: 15px;
    line-height: 22px;
    color: var(--bg-content)
}

.banner-welcome__title {
    font-size: 32px;
    line-height: 40px;
    text-align: left;
    color: var(--bg-content);
    margin-top: 8px;
}

.banner-welcome__button {
    margin-top: 16px;
}

/**-------------- NAVIGATION-WELCOME --------------*/

.navigation-welcome__content {
    padding: 0;
}

.navigation-welcome__general {
    padding: 17px 20px;
}

.navigation-welcome__general button {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    font-weight: 700;
    text-transform: uppercase;
    text-wrap: wrap;
    text-align: left;
    color: var(--text);
    background-color: transparent;
    border-radius: 6px;
    -webkit-tap-highlight-color: transparent;
}

.navigation-welcome__general button::after {
    content: "";
    display: block;
    width: 32px;
    height: 32px;
    border-radius: 6px;
    background-image: url("../img/arrow-down.png");
    background-color: var(--btn-navigation);
    background-repeat: no-repeat;
    background-position: center;
    transition: transform 0.5s ease;
}

.navigation-welcome__general.active button::after {
    transform: rotate(180deg);
}

.navigation-welcome__general.active {
    background-color: var(--title);
    border-radius: 6px 6px 0 0;
}

.navigation-welcome__general.active button {
    color: var(--bg-content);
}

.navigation-welcome__menu {
    height: 0;
    opacity: 0;
    overflow: hidden;
    padding: 0 20px;
    transition: height 0.5s ease, opacity 0.5s ease, padding 0.5s ease;
}

.navigation-welcome__general.active + .navigation-welcome__menu {
    opacity: 1;
    padding: 8px 20px 0 20px;
}

.navigation-welcome__menu li a {
    display: block;
    color: var(--text);
    margin-bottom: 8px;
    transition: transform 0.5s ease;
    -webkit-tap-highlight-color: transparent;
}

.navigation-welcome__menu li a:hover {
    font-weight: 700;
}

/**-------------- FAQ-WELCOME --------------*/

.faq-welcome__list li {
    margin-top: 20px;
}

.faq-welcome__question {
    position: relative;
    width: 100%;
    max-width: 1200px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-weight: 700;
    font-size: 15px;
    line-height: 22px;
    text-wrap: wrap;
    text-align: left;
    color: var(--bg-content);
    background-color: var(--title);
    border-radius: 6px;
    padding: 17px 20px;
    -webkit-tap-highlight-color: transparent;
}

.faq-welcome__question::after {
    content: "";
    display: inline-block;
    width: 32px;
    height: 32px;
    margin-left: 20px;
    border-radius: 6px;
    flex-shrink: 0;
    background-color: var(--btn-navigation);
    background-image: url("../img/arrow-down.png");
    background-repeat: no-repeat, no-repeat;
    background-position: center, center;
    background-size: 11px 6px, cover;
    transition: all 0.5s;
}

.faq-welcome__list li.active .faq-welcome__question::after {
    transform: rotate(180deg);
}

.faq-welcome__list li.active .faq-welcome__question {
    color: var(--bg-content);
    background-color: var(--title);
    border-radius: 6px 6px 0 0;
}

.faq-welcome__answer {
    max-height: 0;
    opacity: 0;
    padding: 0 20px;
    transition: max-height 0.5s ease, padding 0.5s ease, opacity 0.5s ease;
}

.faq-welcome__list li.active .faq-welcome__answer {
    max-height: 600px;
    background-color: transparent;
    opacity: 1;
    padding: 12px 20px;
}

/**-------------- FOOTER-WELCOME --------------*/

.footer-welcome__content {
    max-width: 100%;
    background-color: var(--bg-content);
    border-radius: 0;
    margin-top: 20px;
}

.footer-welcome__navigation {
    display: flex;
    justify-content: center;
    margin-bottom: 32px;
}

.footer-welcome__navigation li:not(:last-child) {
    margin-right: 32px;
}

.footer-welcome__navigation li a {
    font-weight: 700;
    font-size: 15px;
    line-height: 22px;
    color: var(--text);
    text-transform: uppercase;
    transition: all 0.5s;
}

.footer-welcome__navigation a:hover {
    color: var(--btn);
}

.footer-welcome__images {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    margin-bottom: 32px;
}

.footer-welcome-images__image:not(:last-child) {
    margin-right: 32px;
}

.footer-welcome__bottom {
    width: 100%;
    max-width: 1240px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    margin: 0 auto;
}

.footer-welcome__details {
    width: 100%;
    max-width: 1180px;
    text-align: center;
    margin-right: 20px;
}

/**-------------- VIP PAGE --------------*/

.main-vip {
    width: 100%;
    max-width: 1240px;
    margin: 0 auto;
}

/**-------------- HEADER-VIP --------------*/

.header-vip {
    position: fixed;
    top: 0px;
    left: 0px;
    right: 0px;
    z-index: 1000;
}

.header-vip__content {
    position: relative;
    max-width: 100%;
    display: flex;
    align-items: center;
    overflow: visible;
    height: 80px;
    background-color: var(--header);
    border-radius: 0;
    padding: 12px 48px 12px 100px;
}

.header-vip__logo img {
    max-width: 182px;
}

.header-vip__menu ul {
    background-color: var(--bg-menu);
    border-radius: 50px;
    margin-left: 24px;
}

.header-vip-menu__list {
    position: relative;
    font-weight: 400;
    font-size: 15px;
    line-height: 22px;
    text-transform: uppercase;
    color: var(--bg-content);
    padding: 13px 24px;
    border-radius: 50px;
    transition: background-color 0.3s;
}

.header-vip-menu__list:hover {
    background-color: var(--hover-menu);
}

.header-vip-dropdown__link {
    background: transparent;
    border: none;
    font-weight: 400;
    font-size: 15px;
    line-height: 22px;
    text-transform: uppercase;
    color: var(--bg-content);
}

.header-vip-dropdown__toggle {
    width: 10px;
    height: 7px;
    background: url("../img/chevron-down.svg") no-repeat center / contain;
    vertical-align: middle;
    margin-left: 5px;
    transition: transform 0.3s;
}

.header-vip-dropdown__toggle.active {
    transform: rotate(180deg);
}

.header-vip-menu__list > ul.header-vip__dropdown {
    display: none;
    position: absolute;
    top: 55px;
    left: 0;
    flex-direction: column;
    align-items: flex-start;
    min-width: 161px;
    white-space: nowrap;
    border-radius: 6px;
    background-color: var(--dropdown-menu);
    margin-left: 0;
    z-index: 2000;
    opacity: 0;
    transform: translateY(-8px);
    transition: opacity 0.25s ease, transform 0.25s ease;
}

.header-vip-menu__list > ul.header-vip__dropdown.show {
    display: flex;
    opacity: 1;
    transform: translateY(0);
}

.header-vip-dropdown__list {
    display: block;
    padding: 8px 16px;
}

.header-vip-dropdown__list a {
    color: var(--bg-content);
    transition: color 0.2s;
}

.header-vip-dropdown__list a:hover {
    color: var(--btn);
}

.header-vip__button-auth {
    margin-left: auto;
}

.header-vip__button {
    padding-left: 24px;
    padding-right: 24px;
}

.header-vip__button-login {
    background-color: var(--bg-menu);
    margin-right: 16px;
}

.header-vip__watch {
    margin-left: 24px;
    margin-right: 24px;
}


.header-vip__watch span {
    font-size: 15px;
    color: var(--bg-content);
}

.header-vip__lang {
    display: flex;
    align-items: center;
    background-color: var(--header);
}

.header-vip__lang img {
    display: block;
    width: 24px;
    height: 24px;
}

.header-vip__lang span {
    font-size: 14px;
    line-height: 22px;
    text-transform: uppercase;
    color: var(--bg-content);
    margin-left: 8px;
}

/**-------------- HERO-VIP --------------*/

.hero-vip__content {
    border-radius: 0;
    padding: 0;
    margin-top: 80px;
    margin-bottom: 20px;
}

.hero-vip__info {
    position: relative;
    max-width: 610px;
    background-color: transparent;
    padding: 87px 0 87px 100px;
    z-index: 1;
}

.hero-vip__info span {
    display: block;
    color: var(--bg-content);
}

.hero-vip__title {
    margin-top: 8px;
    margin-bottom: 8px;
}

.hero-vip__button {
    margin-top: 16px;

}

/**-------------- BANNER-VIP --------------*/

.banner-vip__content {
    padding: 53px 0;
}

.banner-vip__info {
    position: relative;
    max-width: 610px;
    background-color: transparent;
    padding: 0 20px;
    z-index: 1;
}

.banner-vip__info span {
    display: block;
    font-weight: 700;
    font-size: 15px;
    line-height: 22px;
    color: var(--bg-content)
}

.banner-vip__title {
    font-size: 32px;
    line-height: 40px;
    text-align: left;
    color: var(--bg-content);
    margin-top: 8px;
}

.banner-vip__button {
    margin-top: 16px;
}

/**-------------- NAVIGATION-VIP --------------*/

.navigation-vip__content {
    padding: 0;
}

.navigation-vip__general {
    padding: 17px 20px;
}

.navigation-vip__general button {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    font-weight: 700;
    text-transform: uppercase;
    text-wrap: wrap;
    text-align: left;
    color: var(--text);
    background-color: transparent;
    border-radius: 6px;
    -webkit-tap-highlight-color: transparent;
}

.navigation-vip__general button::after {
    content: "";
    display: block;
    width: 32px;
    height: 32px;
    border-radius: 6px;
    background-image: url("../img/arrow-down.png");
    background-color: var(--btn-navigation);
    background-repeat: no-repeat;
    background-position: center;
    transition: transform 0.5s ease;
}

.navigation-vip__general.active button::after {
    transform: rotate(180deg);
}

.navigation-vip__general.active {
    background-color: var(--title);
    border-radius: 6px 6px 0 0;
}

.navigation-vip__general.active button {
    color: var(--bg-content);
}

.navigation-vip__menu {
    height: 0;
    opacity: 0;
    overflow: hidden;
    padding: 0 20px;
    transition: height 0.5s ease, opacity 0.5s ease, padding 0.5s ease;
}

.navigation-vip__general.active + .navigation-vip__menu {
    opacity: 1;
    padding: 8px 20px 0 20px;
}

.navigation-vip__menu li a {
    display: block;
    color: var(--text);
    margin-bottom: 8px;
    transition: transform 0.5s ease;
    -webkit-tap-highlight-color: transparent;
}

.navigation-vip__menu li a:hover {
    font-weight: 700;
}

/**-------------- FAQ-VIP --------------*/

.faq-vip__list li {
    margin-top: 20px;
}

.faq-vip__question {
    position: relative;
    width: 100%;
    max-width: 1200px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-weight: 700;
    font-size: 15px;
    line-height: 22px;
    text-wrap: wrap;
    text-align: left;
    color: var(--bg-content);
    background-color: var(--title);
    border-radius: 6px;
    padding: 17px 20px;
    -webkit-tap-highlight-color: transparent;
}

.faq-vip__question::after {
    content: "";
    display: inline-block;
    width: 32px;
    height: 32px;
    margin-left: 20px;
    border-radius: 6px;
    flex-shrink: 0;
    background-color: var(--btn-navigation);
    background-image: url("../img/arrow-down.png");
    background-repeat: no-repeat, no-repeat;
    background-position: center, center;
    background-size: 11px 6px, cover;
    transition: all 0.5s;
}

.faq-vip__list li.active .faq-vip__question::after {
    transform: rotate(180deg);
}

.faq-vip__list li.active .faq-vip__question {
    color: var(--bg-content);
    background-color: var(--title);
    border-radius: 6px 6px 0 0;
}

.faq-vip__answer {
    max-height: 0;
    opacity: 0;
    padding: 0 20px;
    transition: max-height 0.5s ease, padding 0.5s ease, opacity 0.5s ease;
}

.faq-vip__list li.active .faq-vip__answer {
    max-height: 600px;
    background-color: transparent;
    opacity: 1;
    padding: 12px 20px;
}

/**-------------- FOOTER-VIP --------------*/

.footer-vip__content {
    max-width: 100%;
    background-color: var(--bg-content);
    border-radius: 0;
    margin-top: 20px;
}

.footer-vip__navigation {
    display: flex;
    justify-content: center;
    margin-bottom: 32px;
}

.footer-vip__navigation li:not(:last-child) {
    margin-right: 32px;
}

.footer-vip__navigation li a {
    font-weight: 700;
    font-size: 15px;
    line-height: 22px;
    color: var(--text);
    text-transform: uppercase;
    transition: all 0.5s;
}

.footer-vip__navigation a:hover {
    color: var(--btn);
}

.footer-vip__images {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    margin-bottom: 32px;
}

.footer-vip-images__image:not(:last-child) {
    margin-right: 32px;
}

.footer-vip__bottom {
    width: 100%;
    max-width: 1240px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    margin: 0 auto;
}

.footer-vip__details {
    width: 100%;
    max-width: 1180px;
    text-align: center;
    margin-right: 20px;
}

/**-------------- APP PAGE --------------*/

.main-app {
    width: 100%;
    max-width: 1240px;
    margin: 0 auto;
}

/**-------------- HEADER-APP --------------*/

.header-app {
    position: fixed;
    top: 0px;
    left: 0px;
    right: 0px;
    z-index: 1000;
}

.header-app__content {
    position: relative;
    max-width: 100%;
    display: flex;
    align-items: center;
    overflow: visible;
    height: 80px;
    background-color: var(--header);
    border-radius: 0;
    padding: 12px 48px 12px 100px;
}

.header-app__logo img {
    max-width: 182px;
}

.header-app__menu ul {
    background-color: var(--bg-menu);
    border-radius: 50px;
    margin-left: 24px;
}

.header-app-menu__list {
    position: relative;
    font-weight: 400;
    font-size: 15px;
    line-height: 22px;
    text-transform: uppercase;
    color: var(--bg-content);
    padding: 13px 24px;
    border-radius: 50px;
    transition: background-color 0.3s;
}

.header-app-menu__list:hover {
    background-color: var(--hover-menu);
}

.header-app-dropdown__link {
    background: transparent;
    border: none;
    font-weight: 400;
    font-size: 15px;
    line-height: 22px;
    text-transform: uppercase;
    color: var(--bg-content);
}

.header-app-dropdown__toggle {
    width: 10px;
    height: 7px;
    background: url("../img/chevron-down.svg") no-repeat center / contain;
    vertical-align: middle;
    margin-left: 5px;
    transition: transform 0.3s;
}

.header-app-dropdown__toggle.active {
    transform: rotate(180deg);
}

.header-app-menu__list > ul.header-app__dropdown {
    display: none;
    position: absolute;
    top: 55px;
    left: 0;
    flex-direction: column;
    align-items: flex-start;
    min-width: 161px;
    white-space: nowrap;
    border-radius: 6px;
    background-color: var(--dropdown-menu);
    margin-left: 0;
    z-index: 2000;
    opacity: 0;
    transform: translateY(-8px);
    transition: opacity 0.25s ease, transform 0.25s ease;
}

.header-app-menu__list > ul.header-app__dropdown.show {
    display: flex;
    opacity: 1;
    transform: translateY(0);
}

.header-app-dropdown__list {
    display: block;
    padding: 8px 16px;
}

.header-app-dropdown__list a {
    color: var(--bg-content);
    transition: color 0.2s;
}

.header-app-dropdown__list a:hover {
    color: var(--btn);
}

.header-app__button-auth {
    margin-left: auto;
}

.header-app__button {
    padding-left: 24px;
    padding-right: 24px;
}

.header-app__button-login {
    background-color: var(--bg-menu);
    margin-right: 16px;
}

.header-app__watch {
    margin-left: 24px;
    margin-right: 24px;
}


.header-app__watch span {
    font-size: 15px;
    color: var(--bg-content);
}

.header-app__lang {
    display: flex;
    align-items: center;
    background-color: var(--header);
}

.header-app__lang img {
    display: block;
    width: 24px;
    height: 24px;
}

.header-app__lang span {
    font-size: 14px;
    line-height: 22px;
    text-transform: uppercase;
    color: var(--bg-content);
    margin-left: 8px;
}

/**-------------- HERO-APP --------------*/

.hero-app__content {
    border-radius: 0;
    padding: 0;
    margin-top: 80px;
    margin-bottom: 20px;
}

.hero-app__info {
    position: relative;
    max-width: 610px;
    background-color: transparent;
    padding: 87px 0 87px 100px;
    z-index: 1;
}

.hero-app__info span {
    display: block;
    color: var(--bg-content);
}

.hero-app__title {
    margin-top: 8px;
    margin-bottom: 8px;
}

.hero-app__buttons {
    display: flex;
    justify-content: flex-start;
    margin-top: 16px;
}

.hero-app__button {
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
    max-width: 200px;
    font-size: 15px;
    line-height: 18px;
    text-wrap: wrap;
    text-align: left;
    padding: 13px 20px 13px 24px;
}

.hero-app__button::before {
    content: "";
    display: inline-block;
    width: 24px;
    height: 24px;
    margin-right: 6px;
    flex-shrink: 0;
    background-image: url("../img/apple.svg");
    background-repeat: no-repeat, no-repeat;
    background-position: center, center;
}

.hero-app__button-android {
    margin-left: 16px;
}

.hero-app__button-android::before {
    background-image: url("../img/android.svg");
}

/**-------------- NAVIGATION-APP --------------*/

.navigation-app__content {
    padding: 0;
}

.navigation-app__general {
    padding: 17px 20px;
}

.navigation-app__general button {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    font-weight: 700;
    text-transform: uppercase;
    text-wrap: wrap;
    text-align: left;
    color: var(--text);
    background-color: transparent;
    border-radius: 6px;
    -webkit-tap-highlight-color: transparent;
}

.navigation-app__general button::after {
    content: "";
    display: block;
    width: 32px;
    height: 32px;
    border-radius: 6px;
    background-image: url("../img/arrow-down.png");
    background-color: var(--btn-navigation);
    background-repeat: no-repeat;
    background-position: center;
    transition: transform 0.5s ease;
}

.navigation-app__general.active button::after {
    transform: rotate(180deg);
}

.navigation-app__general.active {
    background-color: var(--title);
    border-radius: 6px 6px 0 0;
}

.navigation-app__general.active button {
    color: var(--bg-content);
}

.navigation-app__menu {
    height: 0;
    opacity: 0;
    overflow: hidden;
    padding: 0 20px;
    transition: height 0.5s ease, opacity 0.5s ease, padding 0.5s ease;
}

.navigation-app__general.active + .navigation-app__menu {
    opacity: 1;
    padding: 8px 20px 0 20px;
}

.navigation-app__menu li a {
    display: block;
    color: var(--text);
    margin-bottom: 8px;
    transition: transform 0.5s ease;
    -webkit-tap-highlight-color: transparent;
}

.navigation-app__menu li a:hover {
    font-weight: 700;
}

/**-------------- FAQ-APP --------------*/

.faq-app__list li {
    margin-top: 20px;
}

.faq-app__question {
    position: relative;
    width: 100%;
    max-width: 1200px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-weight: 700;
    font-size: 15px;
    line-height: 22px;
    text-wrap: wrap;
    text-align: left;
    color: var(--bg-content);
    background-color: var(--title);
    border-radius: 6px;
    padding: 17px 20px;
    -webkit-tap-highlight-color: transparent;
}

.faq-app__question::after {
    content: "";
    display: inline-block;
    width: 32px;
    height: 32px;
    margin-left: 20px;
    border-radius: 6px;
    flex-shrink: 0;
    background-color: var(--btn-navigation);
    background-image: url("../img/arrow-down.png");
    background-repeat: no-repeat, no-repeat;
    background-position: center, center;
    background-size: 11px 6px, cover;
    transition: all 0.5s;
}

.faq-app__list li.active .faq-app__question::after {
    transform: rotate(180deg);
}

.faq-app__list li.active .faq-app__question {
    color: var(--bg-content);
    background-color: var(--title);
    border-radius: 6px 6px 0 0;
}

.faq-app__answer {
    max-height: 0;
    opacity: 0;
    padding: 0 20px;
    transition: max-height 0.5s ease, padding 0.5s ease, opacity 0.5s ease;
}

.faq-app__list li.active .faq-app__answer {
    max-height: 600px;
    background-color: transparent;
    opacity: 1;
    padding: 12px 20px;
}

/**-------------- FOOTER-APP --------------*/

.footer-app__content {
    max-width: 100%;
    background-color: var(--bg-content);
    border-radius: 0;
    margin-top: 20px;
}

.footer-app__navigation {
    display: flex;
    justify-content: center;
    margin-bottom: 32px;
}

.footer-app__navigation li:not(:last-child) {
    margin-right: 32px;
}

.footer-app__navigation li a {
    font-weight: 700;
    font-size: 15px;
    line-height: 22px;
    color: var(--text);
    text-transform: uppercase;
    transition: all 0.5s;
}

.footer-app__navigation a:hover {
    color: var(--btn);
}

.footer-app__images {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    margin-bottom: 32px;
}

.footer-app-images__image:not(:last-child) {
    margin-right: 32px;
}

.footer-app__bottom {
    width: 100%;
    max-width: 1240px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    margin: 0 auto;
}

.footer-app__details {
    width: 100%;
    max-width: 1180px;
    text-align: center;
    margin-right: 20px;
}

/**-------------- DEPOSIT PAGE --------------*/

.main-deposit {
    width: 100%;
    max-width: 1240px;
    margin: 0 auto;
}

/**-------------- HEADER-DEPOSIT --------------*/

.header-deposit {
    position: fixed;
    top: 0px;
    left: 0px;
    right: 0px;
    z-index: 1000;
}

.header-deposit__content {
    position: relative;
    max-width: 100%;
    display: flex;
    align-items: center;
    overflow: visible;
    height: 80px;
    background-color: var(--header);
    border-radius: 0;
    padding: 12px 48px 12px 100px;
}

.header-deposit__logo img {
    max-width: 182px;
}

.header-deposit__menu ul {
    background-color: var(--bg-menu);
    border-radius: 50px;
    margin-left: 24px;
}

.header-deposit-menu__list {
    position: relative;
    font-weight: 400;
    font-size: 15px;
    line-height: 22px;
    text-transform: uppercase;
    color: var(--bg-content);
    padding: 13px 24px;
    border-radius: 50px;
    transition: background-color 0.3s;
}

.header-deposit-menu__list:hover {
    background-color: var(--hover-menu);
}

.header-deposit-dropdown__link {
    background: transparent;
    border: none;
    font-weight: 400;
    font-size: 15px;
    line-height: 22px;
    text-transform: uppercase;
    color: var(--bg-content);
}

.header-deposit-dropdown__toggle {
    width: 10px;
    height: 7px;
    background: url("../img/chevron-down.svg") no-repeat center / contain;
    vertical-align: middle;
    margin-left: 5px;
    transition: transform 0.3s;
}

.header-deposit-dropdown__toggle.active {
    transform: rotate(180deg);
}

.header-deposit-menu__list > ul.header-deposit__dropdown {
    display: none;
    position: absolute;
    top: 55px;
    left: 0;
    flex-direction: column;
    align-items: flex-start;
    min-width: 161px;
    white-space: nowrap;
    border-radius: 6px;
    background-color: var(--dropdown-menu);
    margin-left: 0;
    z-index: 2000;
    opacity: 0;
    transform: translateY(-8px);
    transition: opacity 0.25s ease, transform 0.25s ease;
}

.header-deposit-menu__list > ul.header-deposit__dropdown.show {
    display: flex;
    opacity: 1;
    transform: translateY(0);
}

.header-deposit-dropdown__list {
    display: block;
    padding: 8px 16px;
}

.header-deposit-dropdown__list a {
    color: var(--bg-content);
    transition: color 0.2s;
}

.header-deposit-dropdown__list a:hover {
    color: var(--btn);
}

.header-deposit__button-auth {
    margin-left: auto;
}

.header-deposit__button {
    padding-left: 24px;
    padding-right: 24px;
}

.header-deposit__button-login {
    background-color: var(--bg-menu);
    margin-right: 16px;
}

.header-deposit__watch {
    margin-left: 24px;
    margin-right: 24px;
}


.header-deposit__watch span {
    font-size: 15px;
    color: var(--bg-content);
}

.header-deposit__lang {
    display: flex;
    align-items: center;
    background-color: var(--header);
}

.header-deposit__lang img {
    display: block;
    width: 24px;
    height: 24px;
}

.header-deposit__lang span {
    font-size: 14px;
    line-height: 22px;
    text-transform: uppercase;
    color: var(--bg-content);
    margin-left: 8px;
}

/**-------------- HERO-DEPOSIT --------------*/

.hero-deposit__content {
    border-radius: 0;
    padding: 0;
    margin-top: 80px;
    margin-bottom: 20px;
}

.hero-deposit__info {
    position: relative;
    max-width: 610px;
    background-color: transparent;
    padding: 87px 0 87px 100px;
    z-index: 1;
}

.hero-deposit__info span {
    display: block;
    color: var(--bg-content);
}

.hero-deposit__title {
    margin-top: 8px;
    margin-bottom: 8px;
}

.hero-deposit__button {
    margin-top: 16px;

}

/**-------------- NAVIGATION-DEPOSIT --------------*/

.navigation-deposit__content {
    padding: 0;
}

.navigation-deposit__general {
    padding: 17px 20px;
}

.navigation-deposit__general button {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    font-weight: 700;
    text-transform: uppercase;
    text-wrap: wrap;
    text-align: left;
    color: var(--text);
    background-color: transparent;
    border-radius: 6px;
    -webkit-tap-highlight-color: transparent;
}

.navigation-deposit__general button::after {
    content: "";
    display: block;
    width: 32px;
    height: 32px;
    border-radius: 6px;
    background-image: url("../img/arrow-down.png");
    background-color: var(--btn-navigation);
    background-repeat: no-repeat;
    background-position: center;
    transition: transform 0.5s ease;
}

.navigation-deposit__general.active button::after {
    transform: rotate(180deg);
}

.navigation-deposit__general.active {
    background-color: var(--title);
    border-radius: 6px 6px 0 0;
}

.navigation-deposit__general.active button {
    color: var(--bg-content);
}

.navigation-deposit__menu {
    height: 0;
    opacity: 0;
    overflow: hidden;
    padding: 0 20px;
    transition: height 0.5s ease, opacity 0.5s ease, padding 0.5s ease;
}

.navigation-deposit__general.active + .navigation-deposit__menu {
    opacity: 1;
    padding: 8px 20px 0 20px;
}

.navigation-deposit__menu li a {
    display: block;
    color: var(--text);
    margin-bottom: 8px;
    transition: transform 0.5s ease;
    -webkit-tap-highlight-color: transparent;
}

.navigation-deposit__menu li a:hover {
    font-weight: 700;
}

/**-------------- FAQ-DEPOSIT --------------*/

.faq-deposit__list li {
    margin-top: 20px;
}

.faq-deposit__question {
    position: relative;
    width: 100%;
    max-width: 1200px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-weight: 700;
    font-size: 15px;
    line-height: 22px;
    text-wrap: wrap;
    text-align: left;
    color: var(--bg-content);
    background-color: var(--title);
    border-radius: 6px;
    padding: 17px 20px;
    -webkit-tap-highlight-color: transparent;
}

.faq-deposit__question::after {
    content: "";
    display: inline-block;
    width: 32px;
    height: 32px;
    margin-left: 20px;
    border-radius: 6px;
    flex-shrink: 0;
    background-color: var(--btn-navigation);
    background-image: url("../img/arrow-down.png");
    background-repeat: no-repeat, no-repeat;
    background-position: center, center;
    background-size: 11px 6px, cover;
    transition: all 0.5s;
}

.faq-deposit__list li.active .faq-deposit__question::after {
    transform: rotate(180deg);
}

.faq-deposit__list li.active .faq-deposit__question {
    color: var(--bg-content);
    background-color: var(--title);
    border-radius: 6px 6px 0 0;
}

.faq-deposit__answer {
    max-height: 0;
    opacity: 0;
    padding: 0 20px;
    transition: max-height 0.5s ease, padding 0.5s ease, opacity 0.5s ease;
}

.faq-deposit__list li.active .faq-deposit__answer {
    max-height: 600px;
    background-color: transparent;
    opacity: 1;
    padding: 12px 20px;
}

/**-------------- FOOTER-DEPOSIT --------------*/

.footer-deposit__content {
    max-width: 100%;
    background-color: var(--bg-content);
    border-radius: 0;
    margin-top: 20px;
}

.footer-deposit__navigation {
    display: flex;
    justify-content: center;
    margin-bottom: 32px;
}

.footer-deposit__navigation li:not(:last-child) {
    margin-right: 32px;
}

.footer-deposit__navigation li a {
    font-weight: 700;
    font-size: 15px;
    line-height: 22px;
    color: var(--text);
    text-transform: uppercase;
    transition: all 0.5s;
}

.footer-deposit__navigation a:hover {
    color: var(--btn);
}

.footer-deposit__images {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    margin-bottom: 32px;
}

.footer-deposit-images__image:not(:last-child) {
    margin-right: 32px;
}

.footer-deposit__bottom {
    width: 100%;
    max-width: 1240px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    margin: 0 auto;

}

.footer-deposit__details {
    width: 100%;
    max-width: 1180px;
    text-align: center;
    margin-right: 20px;
}

/**-------------- CASINO PAGE --------------*/

.main-casino {
    width: 100%;
    max-width: 1240px;
    margin: 0 auto;
}

/**-------------- HEADER-CASINO --------------*/

.header-casino {
    position: fixed;
    top: 0px;
    left: 0px;
    right: 0px;
    z-index: 1000;
}

.header-casino__content {
    position: relative;
    max-width: 100%;
    display: flex;
    align-items: center;
    overflow: visible;
    height: 80px;
    background-color: var(--header);
    border-radius: 0;
    padding: 12px 48px 12px 100px;
}

.header-casino__logo img {
    max-width: 182px;
}

.header-casino__menu ul {
    background-color: var(--bg-menu);
    border-radius: 50px;
    margin-left: 24px;
}

.header-casino-menu__list {
    position: relative;
    font-weight: 400;
    font-size: 15px;
    line-height: 22px;
    text-transform: uppercase;
    color: var(--bg-content);
    padding: 13px 24px;
    border-radius: 50px;
    transition: background-color 0.3s;
}

.header-casino-menu__list:hover {
    background-color: var(--hover-menu);
}

.header-casino-dropdown__link {
    background: transparent;
    border: none;
    font-weight: 400;
    font-size: 15px;
    line-height: 22px;
    text-transform: uppercase;
    color: var(--bg-content);
}

.header-casino-dropdown__toggle {
    width: 10px;
    height: 7px;
    background: url("../img/chevron-down.svg") no-repeat center / contain;
    vertical-align: middle;
    margin-left: 5px;
    transition: transform 0.3s;
}

.header-casino-dropdown__toggle.active {
    transform: rotate(180deg);
}

.header-casino-menu__list > ul.header-casino__dropdown {
    display: none;
    position: absolute;
    top: 55px;
    left: 0;
    flex-direction: column;
    align-items: flex-start;
    min-width: 161px;
    white-space: nowrap;
    border-radius: 6px;
    background-color: var(--dropdown-menu);
    margin-left: 0;
    z-index: 2000;
    opacity: 0;
    transform: translateY(-8px);
    transition: opacity 0.25s ease, transform 0.25s ease;
}

.header-casino-menu__list > ul.header-casino__dropdown.show {
    display: flex;
    opacity: 1;
    transform: translateY(0);
}

.header-casino-dropdown__list {
    display: block;
    padding: 8px 16px;
}

.header-casino-dropdown__list a {
    color: var(--bg-content);
    transition: color 0.2s;
}

.header-casino-dropdown__list a:hover {
    color: var(--btn);
}

.header-casino__button-auth {
    margin-left: auto;
}

.header-casino__button {
    padding-left: 24px;
    padding-right: 24px;
}

.header-casino__button-login {
    background-color: var(--bg-menu);
    margin-right: 16px;
}

.header-casino__watch {
    margin-left: 24px;
    margin-right: 24px;
}


.header-casino__watch span {
    font-size: 15px;
    color: var(--bg-content);
}

.header-casino__lang {
    display: flex;
    align-items: center;
    background-color: var(--header);
}

.header-casino__lang img {
    display: block;
    width: 24px;
    height: 24px;
}

.header-casino__lang span {
    font-size: 14px;
    line-height: 22px;
    text-transform: uppercase;
    color: var(--bg-content);
    margin-left: 8px;
}

/**-------------- HERO-CASINO --------------*/

.hero-casino__content {
    border-radius: 0;
    padding: 0;
    margin-top: 80px;
    margin-bottom: 20px;
}

.hero-casino__info {
    position: relative;
    max-width: 610px;
    background-color: transparent;
    padding: 87px 0 87px 100px;
    z-index: 1;
}

.hero-casino__info span {
    display: block;
    color: var(--bg-content);
}

.hero-casino__title {
    margin-top: 8px;
    margin-bottom: 8px;
}

.hero-casino__button {
    margin-top: 16px;

}

/**-------------- GAMES-CASINO --------------*/

.games-casino__content {
    background-color: transparent;
    overflow: visible;
    padding: 0;
}

.games-casino-panel__list {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.games-casino-panel__list li {
    position: relative;
    overflow: hidden;
    width: 232px;
    height: 138px;
    border-radius: 6px;
}

.games-casino-panel__image img {
    width: 232px;
    height: 138px;
}

.games-casino-panel__hover {
    position: absolute;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 232px;
    height: 138px;
    background: #000000CC;
    border-radius: 6px;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    opacity: 0;
    visibility: hidden;
}

.games-casino-panel__list li:hover .games-casino-panel__hover {
    opacity: 1;
    visibility: visible;
}

/**-------------- NAVIGATION-CASINO --------------*/

.navigation-casino__content {
    padding: 0;
}

.navigation-casino__general {
    padding: 17px 20px;
}

.navigation-casino__general button {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    font-weight: 700;
    text-transform: uppercase;
    text-wrap: wrap;
    text-align: left;
    color: var(--text);
    background-color: transparent;
    border-radius: 6px;
    -webkit-tap-highlight-color: transparent;
}

.navigation-casino__general button::after {
    content: "";
    display: block;
    width: 32px;
    height: 32px;
    border-radius: 6px;
    background-image: url("../img/arrow-down.png");
    background-color: var(--btn-navigation);
    background-repeat: no-repeat;
    background-position: center;
    transition: transform 0.5s ease;
}

.navigation-casino__general.active button::after {
    transform: rotate(180deg);
}

.navigation-casino__general.active {
    background-color: var(--title);
    border-radius: 6px 6px 0 0;
}

.navigation-casino__general.active button {
    color: var(--bg-content);
}

.navigation-casino__menu {
    height: 0;
    opacity: 0;
    overflow: hidden;
    padding: 0 20px;
    transition: height 0.5s ease, opacity 0.5s ease, padding 0.5s ease;
}

.navigation-casino__general.active + .navigation-casino__menu {
    opacity: 1;
    padding: 8px 20px 0 20px;
}

.navigation-casino__menu li a {
    display: block;
    color: var(--text);
    margin-bottom: 8px;
    transition: transform 0.5s ease;
    -webkit-tap-highlight-color: transparent;
}

.navigation-casino__menu li a:hover {
    font-weight: 700;
}

/**-------------- FAQ-CASINO --------------*/

.faq-casino__list li {
    margin-top: 20px;
}

.faq-casino__question {
    position: relative;
    width: 100%;
    max-width: 1200px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-weight: 700;
    font-size: 15px;
    line-height: 22px;
    text-wrap: wrap;
    text-align: left;
    color: var(--bg-content);
    background-color: var(--title);
    border-radius: 6px;
    padding: 17px 20px;
    -webkit-tap-highlight-color: transparent;
}

.faq-casino__question::after {
    content: "";
    display: inline-block;
    width: 32px;
    height: 32px;
    margin-left: 20px;
    border-radius: 6px;
    flex-shrink: 0;
    background-color: var(--btn-navigation);
    background-image: url("../img/arrow-down.png");
    background-repeat: no-repeat, no-repeat;
    background-position: center, center;
    background-size: 11px 6px, cover;
    transition: all 0.5s;
}

.faq-casino__list li.active .faq-casino__question::after {
    transform: rotate(180deg);
}

.faq-casino__list li.active .faq-casino__question {
    color: var(--bg-content);
    background-color: var(--title);
    border-radius: 6px 6px 0 0;
}

.faq-casino__answer {
    max-height: 0;
    opacity: 0;
    padding: 0 20px;
    transition: max-height 0.5s ease, padding 0.5s ease, opacity 0.5s ease;
}

.faq-casino__list li.active .faq-casino__answer {
    max-height: 600px;
    background-color: transparent;
    opacity: 1;
    padding: 12px 20px;
}

/**-------------- FOOTER-CASINO --------------*/

.footer-casino__content {
    max-width: 100%;
    background-color: var(--bg-content);
    border-radius: 0;
    margin-top: 20px;
}

.footer-casino__navigation {
    display: flex;
    justify-content: center;
    margin-bottom: 32px;
}

.footer-casino__navigation li:not(:last-child) {
    margin-right: 32px;
}

.footer-casino__navigation li a {
    font-weight: 700;
    font-size: 15px;
    line-height: 22px;
    color: var(--text);
    text-transform: uppercase;
    transition: all 0.5s;
}

.footer-casino__navigation a:hover {
    color: var(--btn);
}

.footer-casino__images {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    margin-bottom: 32px;
}

.footer-casino-images__image:not(:last-child) {
    margin-right: 32px;
}

.footer-casino__bottom {
    width: 100%;
    max-width: 1240px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    margin: 0 auto;

}

.footer-casino__details {
    width: 100%;
    max-width: 1180px;
    text-align: center;
    margin-right: 20px;
}

/**-------------- SLOTS PAGE --------------*/

.main-slots {
    width: 100%;
    max-width: 1240px;
    margin: 0 auto;
}

/**-------------- HEADER-SLOTS --------------*/

.header-slots {
    position: fixed;
    top: 0px;
    left: 0px;
    right: 0px;
    z-index: 1000;
}

.header-slots__content {
    position: relative;
    max-width: 100%;
    display: flex;
    align-items: center;
    overflow: visible;
    height: 80px;
    background-color: var(--header);
    border-radius: 0;
    padding: 12px 48px 12px 100px;
}

.header-slots__logo img {
    max-width: 182px;
}

.header-slots__menu ul {
    background-color: var(--bg-menu);
    border-radius: 50px;
    margin-left: 24px;
}

.header-slots-menu__list {
    position: relative;
    font-weight: 400;
    font-size: 15px;
    line-height: 22px;
    text-transform: uppercase;
    color: var(--bg-content);
    padding: 13px 24px;
    border-radius: 50px;
    transition: background-color 0.3s;
}

.header-slots-menu__list:hover {
    background-color: var(--hover-menu);
}

.header-slots-dropdown__link {
    background: transparent;
    border: none;
    font-weight: 400;
    font-size: 15px;
    line-height: 22px;
    text-transform: uppercase;
    color: var(--bg-content);
}

.header-slots-dropdown__toggle {
    width: 10px;
    height: 7px;
    background: url("../img/chevron-down.svg") no-repeat center / contain;
    vertical-align: middle;
    margin-left: 5px;
    transition: transform 0.3s;
}

.header-slots-dropdown__toggle.active {
    transform: rotate(180deg);
}

.header-slots-menu__list > ul.header-slots__dropdown {
    display: none;
    position: absolute;
    top: 55px;
    left: 0;
    flex-direction: column;
    align-items: flex-start;
    min-width: 161px;
    white-space: nowrap;
    border-radius: 6px;
    background-color: var(--dropdown-menu);
    margin-left: 0;
    z-index: 2000;
    opacity: 0;
    transform: translateY(-8px);
    transition: opacity 0.25s ease, transform 0.25s ease;
}

.header-slots-menu__list > ul.header-slots__dropdown.show {
    display: flex;
    opacity: 1;
    transform: translateY(0);
}

.header-slots-dropdown__list {
    display: block;
    padding: 8px 16px;
}

.header-slots-dropdown__list a {
    color: var(--bg-content);
    transition: color 0.2s;
}

.header-slots-dropdown__list a:hover {
    color: var(--btn);
}

.header-slots__button-auth {
    margin-left: auto;
}

.header-slots__button {
    padding-left: 24px;
    padding-right: 24px;
}

.header-slots__button-login {
    background-color: var(--bg-menu);
    margin-right: 16px;
}

.header-slots__watch {
    margin-left: 24px;
    margin-right: 24px;
}


.header-slots__watch span {
    font-size: 15px;
    color: var(--bg-content);
}

.header-slots__lang {
    display: flex;
    align-items: center;
    background-color: var(--header);
}

.header-slots__lang img {
    display: block;
    width: 24px;
    height: 24px;
}

.header-slots__lang span {
    font-size: 14px;
    line-height: 22px;
    text-transform: uppercase;
    color: var(--bg-content);
    margin-left: 8px;
}

/**-------------- HERO-SLOTS --------------*/

.hero-slots__content {
    border-radius: 0;
    padding: 0;
    margin-top: 80px;
    margin-bottom: 20px;
}

.hero-slots__info {
    position: relative;
    max-width: 610px;
    background-color: transparent;
    padding: 87px 0 87px 100px;
    z-index: 1;
}

.hero-slots__info span {
    display: block;
    color: var(--bg-content);
}

.hero-slots__title {
    margin-top: 8px;
    margin-bottom: 8px;
}

.hero-slots__button {
    margin-top: 16px;

}

/**-------------- GAMES-SLOTS --------------*/

.games-slots__content {
    background-color: transparent;
    overflow: visible;
    padding: 0;
}

.games-slots-panel__list {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.games-slots-panel__list li {
    position: relative;
    overflow: hidden;
    width: 232px;
    height: 138px;
    border-radius: 6px;
}

.games-slots-panel__image img {
    width: 232px;
    height: 138px;
}

.games-slots-panel__hover {
    position: absolute;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 232px;
    height: 138px;
    background: #000000CC;
    border-radius: 6px;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    opacity: 0;
    visibility: hidden;
}

.games-slots-panel__list li:hover .games-slots-panel__hover {
    opacity: 1;
    visibility: visible;
}

/**-------------- NAVIGATION-SLOTS --------------*/

.navigation-slots__content {
    padding: 0;
}

.navigation-slots__general {
    padding: 17px 20px;
}

.navigation-slots__general button {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    font-weight: 700;
    text-transform: uppercase;
    text-wrap: wrap;
    text-align: left;
    color: var(--text);
    background-color: transparent;
    border-radius: 6px;
    -webkit-tap-highlight-color: transparent;
}

.navigation-slots__general button::after {
    content: "";
    display: block;
    width: 32px;
    height: 32px;
    border-radius: 6px;
    background-image: url("../img/arrow-down.png");
    background-color: var(--btn-navigation);
    background-repeat: no-repeat;
    background-position: center;
    transition: transform 0.5s ease;
}

.navigation-slots__general.active button::after {
    transform: rotate(180deg);
}

.navigation-slots__general.active {
    background-color: var(--title);
    border-radius: 6px 6px 0 0;
}

.navigation-slots__general.active button {
    color: var(--bg-content);
}

.navigation-slots__menu {
    height: 0;
    opacity: 0;
    overflow: hidden;
    padding: 0 20px;
    transition: height 0.5s ease, opacity 0.5s ease, padding 0.5s ease;
}

.navigation-slots__general.active + .navigation-slots__menu {
    opacity: 1;
    padding: 8px 20px 0 20px;
}

.navigation-slots__menu li a {
    display: block;
    color: var(--text);
    margin-bottom: 8px;
    transition: transform 0.5s ease;
    -webkit-tap-highlight-color: transparent;
}

.navigation-slots__menu li a:hover {
    font-weight: 700;
}

/**-------------- FAQ-SLOTS --------------*/

.faq-slots__list li {
    margin-top: 20px;
}

.faq-slots__question {
    position: relative;
    width: 100%;
    max-width: 1200px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-weight: 700;
    font-size: 15px;
    line-height: 22px;
    text-wrap: wrap;
    text-align: left;
    color: var(--bg-content);
    background-color: var(--title);
    border-radius: 6px;
    padding: 17px 20px;
    -webkit-tap-highlight-color: transparent;
}

.faq-slots__question::after {
    content: "";
    display: inline-block;
    width: 32px;
    height: 32px;
    margin-left: 20px;
    border-radius: 6px;
    flex-shrink: 0;
    background-color: var(--btn-navigation);
    background-image: url("../img/arrow-down.png");
    background-repeat: no-repeat, no-repeat;
    background-position: center, center;
    background-size: 11px 6px, cover;
    transition: all 0.5s;
}

.faq-slots__list li.active .faq-slots__question::after {
    transform: rotate(180deg);
}

.faq-slots__list li.active .faq-slots__question {
    color: var(--bg-content);
    background-color: var(--title);
    border-radius: 6px 6px 0 0;
}

.faq-slots__answer {
    max-height: 0;
    opacity: 0;
    padding: 0 20px;
    transition: max-height 0.5s ease, padding 0.5s ease, opacity 0.5s ease;
}

.faq-slots__list li.active .faq-slots__answer {
    max-height: 600px;
    background-color: transparent;
    opacity: 1;
    padding: 12px 20px;
}

/**-------------- FOOTER-SLOTS --------------*/

.footer-slots__content {
    max-width: 100%;
    background-color: var(--bg-content);
    border-radius: 0;
    margin-top: 20px;
}

.footer-slots__navigation {
    display: flex;
    justify-content: center;
    margin-bottom: 32px;
}

.footer-slots__navigation li:not(:last-child) {
    margin-right: 32px;
}

.footer-slots__navigation li a {
    font-weight: 700;
    font-size: 15px;
    line-height: 22px;
    color: var(--text);
    text-transform: uppercase;
    transition: all 0.5s;
}

.footer-slots__navigation a:hover {
    color: var(--btn);
}

.footer-slots__images {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    margin-bottom: 32px;
}

.footer-slots-images__image:not(:last-child) {
    margin-right: 32px;
}

.footer-slots__bottom {
    width: 100%;
    max-width: 1240px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    margin: 0 auto;

}

.footer-slots__details {
    width: 100%;
    max-width: 1180px;
    text-align: center;
    margin-right: 20px;
}

/**-------------- LIVE PAGE --------------*/

.main-live {
    width: 100%;
    max-width: 1240px;
    margin: 0 auto;
}

/**-------------- HEADER-LIVE --------------*/

.header-live {
    position: fixed;
    top: 0px;
    left: 0px;
    right: 0px;
    z-index: 1000;
}

.header-live__content {
    position: relative;
    max-width: 100%;
    display: flex;
    align-items: center;
    overflow: visible;
    height: 80px;
    background-color: var(--header);
    border-radius: 0;
    padding: 12px 48px 12px 100px;
}

.header-live__logo img {
    max-width: 182px;
}

.header-live__menu ul {
    background-color: var(--bg-menu);
    border-radius: 50px;
    margin-left: 24px;
}

.header-live-menu__list {
    position: relative;
    font-weight: 400;
    font-size: 15px;
    line-height: 22px;
    text-transform: uppercase;
    color: var(--bg-content);
    padding: 13px 24px;
    border-radius: 50px;
    transition: background-color 0.3s;
}

.header-live-menu__list:hover {
    background-color: var(--hover-menu);
}

.header-live-dropdown__link {
    background: transparent;
    border: none;
    font-weight: 400;
    font-size: 15px;
    line-height: 22px;
    text-transform: uppercase;
    color: var(--bg-content);
}

.header-live-dropdown__toggle {
    width: 10px;
    height: 7px;
    background: url("../img/chevron-down.svg") no-repeat center / contain;
    vertical-align: middle;
    margin-left: 5px;
    transition: transform 0.3s;
}

.header-live-dropdown__toggle.active {
    transform: rotate(180deg);
}

.header-live-menu__list > ul.header-live__dropdown {
    display: none;
    position: absolute;
    top: 55px;
    left: 0;
    flex-direction: column;
    align-items: flex-start;
    min-width: 161px;
    white-space: nowrap;
    border-radius: 6px;
    background-color: var(--dropdown-menu);
    margin-left: 0;
    z-index: 2000;
    opacity: 0;
    transform: translateY(-8px);
    transition: opacity 0.25s ease, transform 0.25s ease;
}

.header-live-menu__list > ul.header-live__dropdown.show {
    display: flex;
    opacity: 1;
    transform: translateY(0);
}

.header-live-dropdown__list {
    display: block;
    padding: 8px 16px;
}

.header-live-dropdown__list a {
    color: var(--bg-content);
    transition: color 0.2s;
}

.header-live-dropdown__list a:hover {
    color: var(--btn);
}

.header-live__button-auth {
    margin-left: auto;
}

.header-live__button {
    padding-left: 24px;
    padding-right: 24px;
}

.header-live__button-login {
    background-color: var(--bg-menu);
    margin-right: 16px;
}

.header-live__watch {
    margin-left: 24px;
    margin-right: 24px;
}


.header-live__watch span {
    font-size: 15px;
    color: var(--bg-content);
}

.header-live__lang {
    display: flex;
    align-items: center;
    background-color: var(--header);
}

.header-live__lang img {
    display: block;
    width: 24px;
    height: 24px;
}

.header-live__lang span {
    font-size: 14px;
    line-height: 22px;
    text-transform: uppercase;
    color: var(--bg-content);
    margin-left: 8px;
}

/**-------------- HERO-LIVE --------------*/

.hero-live__content {
    border-radius: 0;
    padding: 0;
    margin-top: 80px;
    margin-bottom: 20px;
}

.hero-live__info {
    position: relative;
    max-width: 610px;
    background-color: transparent;
    padding: 87px 0 87px 100px;
    z-index: 1;
}

.hero-live__info span {
    display: block;
    color: var(--bg-content);
}

.hero-live__title {
    margin-top: 8px;
    margin-bottom: 8px;
}

.hero-live__button {
    margin-top: 16px;

}

/**-------------- GAMES-LIVE --------------*/

.games-live__content {
    background-color: transparent;
    overflow: visible;
    padding: 0;
}

.games-live-panel__list {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.games-live-panel__list li {
    position: relative;
    overflow: hidden;
    width: 232px;
    height: 138px;
    border-radius: 6px;
}

.games-live-panel__image img {
    width: 232px;
    height: 138px;
}

.games-live-panel__hover {
    position: absolute;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 232px;
    height: 138px;
    background: #000000CC;
    border-radius: 6px;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    opacity: 0;
    visibility: hidden;
}

.games-live-panel__list li:hover .games-live-panel__hover {
    opacity: 1;
    visibility: visible;
}

/**-------------- NAVIGATION-LIVE --------------*/

.navigation-live__content {
    padding: 0;
}

.navigation-live__general {
    padding: 17px 20px;
}

.navigation-live__general button {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    font-weight: 700;
    text-transform: uppercase;
    text-wrap: wrap;
    text-align: left;
    color: var(--text);
    background-color: transparent;
    border-radius: 6px;
    -webkit-tap-highlight-color: transparent;
}

.navigation-live__general button::after {
    content: "";
    display: block;
    width: 32px;
    height: 32px;
    border-radius: 6px;
    background-image: url("../img/arrow-down.png");
    background-color: var(--btn-navigation);
    background-repeat: no-repeat;
    background-position: center;
    transition: transform 0.5s ease;
}

.navigation-live__general.active button::after {
    transform: rotate(180deg);
}

.navigation-live__general.active {
    background-color: var(--title);
    border-radius: 6px 6px 0 0;
}

.navigation-live__general.active button {
    color: var(--bg-content);
}

.navigation-live__menu {
    height: 0;
    opacity: 0;
    overflow: hidden;
    padding: 0 20px;
    transition: height 0.5s ease, opacity 0.5s ease, padding 0.5s ease;
}

.navigation-live__general.active + .navigation-live__menu {
    opacity: 1;
    padding: 8px 20px 0 20px;
}

.navigation-live__menu li a {
    display: block;
    color: var(--text);
    margin-bottom: 8px;
    transition: transform 0.5s ease;
    -webkit-tap-highlight-color: transparent;
}

.navigation-live__menu li a:hover {
    font-weight: 700;
}

/**-------------- FAQ-LIVE --------------*/

.faq-live__list li {
    margin-top: 20px;
}

.faq-live__question {
    position: relative;
    width: 100%;
    max-width: 1200px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-weight: 700;
    font-size: 15px;
    line-height: 22px;
    text-wrap: wrap;
    text-align: left;
    color: var(--bg-content);
    background-color: var(--title);
    border-radius: 6px;
    padding: 17px 20px;
    -webkit-tap-highlight-color: transparent;
}

.faq-live__question::after {
    content: "";
    display: inline-block;
    width: 32px;
    height: 32px;
    margin-left: 20px;
    border-radius: 6px;
    flex-shrink: 0;
    background-color: var(--btn-navigation);
    background-image: url("../img/arrow-down.png");
    background-repeat: no-repeat, no-repeat;
    background-position: center, center;
    background-size: 11px 6px, cover;
    transition: all 0.5s;
}

.faq-live__list li.active .faq-live__question::after {
    transform: rotate(180deg);
}

.faq-live__list li.active .faq-live__question {
    color: var(--bg-content);
    background-color: var(--title);
    border-radius: 6px 6px 0 0;
}

.faq-live__answer {
    max-height: 0;
    opacity: 0;
    padding: 0 20px;
    transition: max-height 0.5s ease, padding 0.5s ease, opacity 0.5s ease;
}

.faq-live__list li.active .faq-live__answer {
    max-height: 600px;
    background-color: transparent;
    opacity: 1;
    padding: 12px 20px;
}

/**-------------- FOOTER-LIVE --------------*/

.footer-live__content {
    max-width: 100%;
    background-color: var(--bg-content);
    border-radius: 0;
    margin-top: 20px;
}

.footer-live__navigation {
    display: flex;
    justify-content: center;
    margin-bottom: 32px;
}

.footer-live__navigation li:not(:last-child) {
    margin-right: 32px;
}

.footer-live__navigation li a {
    font-weight: 700;
    font-size: 15px;
    line-height: 22px;
    color: var(--text);
    text-transform: uppercase;
    transition: all 0.5s;
}

.footer-live__navigation a:hover {
    color: var(--btn);
}

.footer-live__images {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    margin-bottom: 32px;
}

.footer-live-images__image:not(:last-child) {
    margin-right: 32px;
}

.footer-live__bottom {
    width: 100%;
    max-width: 1240px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    margin: 0 auto;

}

.footer-live__details {
    width: 100%;
    max-width: 1180px;
    text-align: center;
    margin-right: 20px;
}

/**-------------- SUPPORT PAGE --------------*/

.main-support {
    width: 100%;
    max-width: 1240px;
    margin: 0 auto;
}

/**-------------- HEADER-SUPPORT --------------*/

.header-support {
    position: fixed;
    top: 0px;
    left: 0px;
    right: 0px;
    z-index: 1000;
}

.header-support__content {
    position: relative;
    max-width: 100%;
    display: flex;
    align-items: center;
    overflow: visible;
    height: 80px;
    background-color: var(--header);
    border-radius: 0;
    padding: 12px 48px 12px 100px;
}

.header-support__logo img {
    max-width: 182px;
}

.header-support__menu ul {
    background-color: var(--bg-menu);
    border-radius: 50px;
    margin-left: 24px;
}

.header-support-menu__list {
    position: relative;
    font-weight: 400;
    font-size: 15px;
    line-height: 22px;
    text-transform: uppercase;
    color: var(--bg-content);
    padding: 13px 24px;
    border-radius: 50px;
    transition: background-color 0.3s;
}

.header-support-menu__list:hover {
    background-color: var(--hover-menu);
}

.header-support-dropdown__link {
    background: transparent;
    border: none;
    font-weight: 400;
    font-size: 15px;
    line-height: 22px;
    text-transform: uppercase;
    color: var(--bg-content);
}

.header-support-dropdown__toggle {
    width: 10px;
    height: 7px;
    background: url("../img/chevron-down.svg") no-repeat center / contain;
    vertical-align: middle;
    margin-left: 5px;
    transition: transform 0.3s;
}

.header-support-dropdown__toggle.active {
    transform: rotate(180deg);
}

.header-support-menu__list > ul.header-support__dropdown {
    display: none;
    position: absolute;
    top: 55px;
    left: 0;
    flex-direction: column;
    align-items: flex-start;
    min-width: 161px;
    white-space: nowrap;
    border-radius: 6px;
    background-color: var(--dropdown-menu);
    margin-left: 0;
    z-index: 2000;
    opacity: 0;
    transform: translateY(-8px);
    transition: opacity 0.25s ease, transform 0.25s ease;
}

.header-support-menu__list > ul.header-support__dropdown.show {
    display: flex;
    opacity: 1;
    transform: translateY(0);
}

.header-support-dropdown__list {
    display: block;
    padding: 8px 16px;
}

.header-support-dropdown__list a {
    color: var(--bg-content);
    transition: color 0.2s;
}

.header-support-dropdown__list a:hover {
    color: var(--btn);
}

.header-support__button-auth {
    margin-left: auto;
}

.header-support__button {
    padding-left: 24px;
    padding-right: 24px;
}

.header-support__button-login {
    background-color: var(--bg-menu);
    margin-right: 16px;
}

.header-support__watch {
    margin-left: 24px;
    margin-right: 24px;
}

.header-support__watch span {
    font-size: 15px;
    color: var(--bg-content);
}

.header-support__lang {
    display: flex;
    align-items: center;
    background-color: var(--header);
}

.header-support__lang img {
    display: block;
    width: 24px;
    height: 24px;
}

.header-support__lang span {
    font-size: 14px;
    line-height: 22px;
    text-transform: uppercase;
    color: var(--bg-content);
    margin-left: 8px;
}

/**-------------- HERO-SUPPORT --------------*/

.hero-support__content {
    border-radius: 0;
    padding: 0;
    margin-top: 80px;
    margin-bottom: 20px;
}

.hero-support__info {
    position: relative;
    max-width: 610px;
    background-color: transparent;
    padding: 87px 0 87px 100px;
    z-index: 1;
}

.hero-support__info span {
    display: block;
    color: var(--bg-content);
}

.hero-support__title {
    margin-top: 8px;
    margin-bottom: 8px;
}

.hero-support__button {
    margin-top: 16px;

}

/**-------------- NAVIGATION-SUPPORT --------------*/

.navigation-support__content {
    padding: 0;
}

.navigation-support__general {
    padding: 17px 20px;
}

.navigation-support__general button {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    font-weight: 700;
    text-transform: uppercase;
    text-wrap: wrap;
    text-align: left;
    color: var(--text);
    background-color: transparent;
    border-radius: 6px;
    -webkit-tap-highlight-color: transparent;
}

.navigation-support__general button::after {
    content: "";
    display: block;
    width: 32px;
    height: 32px;
    border-radius: 6px;
    background-image: url("../img/arrow-down.png");
    background-color: var(--btn-navigation);
    background-repeat: no-repeat;
    background-position: center;
    transition: transform 0.5s ease;
}

.navigation-support__general.active button::after {
    transform: rotate(180deg);
}

.navigation-support__general.active {
    background-color: var(--title);
    border-radius: 6px 6px 0 0;
}

.navigation-support__general.active button {
    color: var(--bg-content);
}

.navigation-support__menu {
    height: 0;
    opacity: 0;
    overflow: hidden;
    padding: 0 20px;
    transition: height 0.5s ease, opacity 0.5s ease, padding 0.5s ease;
}

.navigation-support__general.active + .navigation-support__menu {
    opacity: 1;
    padding: 8px 20px 0 20px;
}

.navigation-support__menu li a {
    display: block;
    color: var(--text);
    margin-bottom: 8px;
    transition: transform 0.5s ease;
    -webkit-tap-highlight-color: transparent;
}

.navigation-support__menu li a:hover {
    font-weight: 700;
}

/**-------------- FAQ-SUPPORT --------------*/

.faq-support__list li {
    margin-top: 20px;
}

.faq-support__question {
    position: relative;
    width: 100%;
    max-width: 1200px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-weight: 700;
    font-size: 15px;
    line-height: 22px;
    text-wrap: wrap;
    text-align: left;
    color: var(--bg-content);
    background-color: var(--title);
    border-radius: 6px;
    padding: 17px 20px;
    -webkit-tap-highlight-color: transparent;
}

.faq-support__question::after {
    content: "";
    display: inline-block;
    width: 32px;
    height: 32px;
    margin-left: 20px;
    border-radius: 6px;
    flex-shrink: 0;
    background-color: var(--btn-navigation);
    background-image: url("../img/arrow-down.png");
    background-repeat: no-repeat, no-repeat;
    background-position: center, center;
    background-size: 11px 6px, cover;
    transition: all 0.5s;
}

.faq-support__list li.active .faq-support__question::after {
    transform: rotate(180deg);
}

.faq-support__list li.active .faq-support__question {
    color: var(--bg-content);
    background-color: var(--title);
    border-radius: 6px 6px 0 0;
}

.faq-support__answer {
    max-height: 0;
    opacity: 0;
    padding: 0 20px;
    transition: max-height 0.5s ease, padding 0.5s ease, opacity 0.5s ease;
}

.faq-support__list li.active .faq-support__answer {
    max-height: 600px;
    background-color: transparent;
    opacity: 1;
    padding: 12px 20px;
}

/**-------------- FOOTER-SUPPORT --------------*/

.footer-support__content {
    max-width: 100%;
    background-color: var(--bg-content);
    border-radius: 0;
    margin-top: 20px;
}

.footer-support__navigation {
    display: flex;
    justify-content: center;
    margin-bottom: 32px;
}

.footer-support__navigation li:not(:last-child) {
    margin-right: 32px;
}

.footer-support__navigation li a {
    font-weight: 700;
    font-size: 15px;
    line-height: 22px;
    color: var(--text);
    text-transform: uppercase;
    transition: all 0.5s;
}

.footer-support__navigation a:hover {
    color: var(--btn);
}

.footer-support__images {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    margin-bottom: 32px;
}

.footer-support-images__image:not(:last-child) {
    margin-right: 32px;
}

.footer-support__bottom {
    width: 100%;
    max-width: 1240px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    margin: 0 auto;

}

.footer-support__details {
    width: 100%;
    max-width: 1180px;
    text-align: center;
    margin-right: 20px;
}

/**-------------- LOGIN PAGE --------------*/

.main-login {
    width: 100%;
    max-width: 1240px;
    margin: 0 auto;
}

/**-------------- HEADER-LOGIN --------------*/

.header-login {
    position: fixed;
    top: 0px;
    left: 0px;
    right: 0px;
    z-index: 1000;
}

.header-login__content {
    position: relative;
    max-width: 100%;
    display: flex;
    align-items: center;
    overflow: visible;
    height: 80px;
    background-color: var(--header);
    border-radius: 0;
    padding: 12px 48px 12px 100px;
}

.header-login__logo img {
    max-width: 182px;
}

.header-login__menu ul {
    background-color: var(--bg-menu);
    border-radius: 50px;
    margin-left: 24px;
}

.header-login-menu__list {
    position: relative;
    font-weight: 400;
    font-size: 15px;
    line-height: 22px;
    text-transform: uppercase;
    color: var(--bg-content);
    padding: 13px 24px;
    border-radius: 50px;
    transition: background-color 0.3s;
}

.header-login-menu__list:hover {
    background-color: var(--hover-menu);
}

.header-login-dropdown__link {
    background: transparent;
    border: none;
    font-weight: 400;
    font-size: 15px;
    line-height: 22px;
    text-transform: uppercase;
    color: var(--bg-content);
}

.header-login-dropdown__toggle {
    width: 10px;
    height: 7px;
    background: url("../img/chevron-down.svg") no-repeat center / contain;
    vertical-align: middle;
    margin-left: 5px;
    transition: transform 0.3s;
}

.header-login-dropdown__toggle.active {
    transform: rotate(180deg);
}

.header-login-menu__list > ul.header-login__dropdown {
    display: none;
    position: absolute;
    top: 55px;
    left: 0;
    flex-direction: column;
    align-items: flex-start;
    min-width: 161px;
    white-space: nowrap;
    border-radius: 6px;
    background-color: var(--dropdown-menu);
    margin-left: 0;
    z-index: 2000;
    opacity: 0;
    transform: translateY(-8px);
    transition: opacity 0.25s ease, transform 0.25s ease;
}

.header-login-menu__list > ul.header-login__dropdown.show {
    display: flex;
    opacity: 1;
    transform: translateY(0);
}

.header-login-dropdown__list {
    display: block;
    padding: 8px 16px;
}

.header-login-dropdown__list a {
    color: var(--bg-content);
    transition: color 0.2s;
}

.header-login-dropdown__list a:hover {
    color: var(--btn);
}

.header-login__button-auth {
    margin-left: auto;
}

.header-login__button {
    padding-left: 24px;
    padding-right: 24px;
}

.header-login__button-login {
    background-color: var(--bg-menu);
    margin-right: 16px;
}

.header-login__watch {
    margin-left: 24px;
    margin-right: 24px;
}

.header-login__watch span {
    font-size: 15px;
    color: var(--bg-content);
}

.header-login__lang {
    display: flex;
    align-items: center;
    background-color: var(--header);
}

.header-login__lang img {
    display: block;
    width: 24px;
    height: 24px;
}

.header-login__lang span {
    font-size: 14px;
    line-height: 22px;
    text-transform: uppercase;
    color: var(--bg-content);
    margin-left: 8px;
}

/**-------------- HERO-LOGIN --------------*/

.hero-login__content {
    border-radius: 0;
    padding: 0;
    margin-top: 80px;
    margin-bottom: 20px;
}

.hero-login__info {
    position: relative;
    max-width: 610px;
    background-color: transparent;
    padding: 87px 0 87px 100px;
    z-index: 1;
}

.hero-login__info span {
    display: block;
    color: var(--bg-content);
}

.hero-login__title {
    margin-top: 8px;
    margin-bottom: 8px;
}

.hero-login__button {
    margin-top: 16px;

}

/**-------------- NAVIGATION-LOGIN --------------*/

.navigation-login__content {
    padding: 0;
}

.navigation-login__general {
    padding: 17px 20px;
}

.navigation-login__general button {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    font-weight: 700;
    text-transform: uppercase;
    text-wrap: wrap;
    text-align: left;
    color: var(--text);
    background-color: transparent;
    border-radius: 6px;
    -webkit-tap-highlight-color: transparent;
}

.navigation-login__general button::after {
    content: "";
    display: block;
    width: 32px;
    height: 32px;
    border-radius: 6px;
    background-image: url("../img/arrow-down.png");
    background-color: var(--btn-navigation);
    background-repeat: no-repeat;
    background-position: center;
    transition: transform 0.5s ease;
}

.navigation-login__general.active button::after {
    transform: rotate(180deg);
}

.navigation-login__general.active {
    background-color: var(--title);
    border-radius: 6px 6px 0 0;
}

.navigation-login__general.active button {
    color: var(--bg-content);
}

.navigation-login__menu {
    height: 0;
    opacity: 0;
    overflow: hidden;
    padding: 0 20px;
    transition: height 0.5s ease, opacity 0.5s ease, padding 0.5s ease;
}

.navigation-login__general.active + .navigation-login__menu {
    opacity: 1;
    padding: 8px 20px 0 20px;
}

.navigation-login__menu li a {
    display: block;
    color: var(--text);
    margin-bottom: 8px;
    transition: transform 0.5s ease;
    -webkit-tap-highlight-color: transparent;
}

.navigation-login__menu li a:hover {
    font-weight: 700;
}

/**-------------- FAQ-LOGIN --------------*/

.faq-login__list li {
    margin-top: 20px;
}

.faq-login__question {
    position: relative;
    width: 100%;
    max-width: 1200px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-weight: 700;
    font-size: 15px;
    line-height: 22px;
    text-wrap: wrap;
    text-align: left;
    color: var(--bg-content);
    background-color: var(--title);
    border-radius: 6px;
    padding: 17px 20px;
    -webkit-tap-highlight-color: transparent;
}

.faq-login__question::after {
    content: "";
    display: inline-block;
    width: 32px;
    height: 32px;
    margin-left: 20px;
    border-radius: 6px;
    flex-shrink: 0;
    background-color: var(--btn-navigation);
    background-image: url("../img/arrow-down.png");
    background-repeat: no-repeat, no-repeat;
    background-position: center, center;
    background-size: 11px 6px, cover;
    transition: all 0.5s;
}

.faq-login__list li.active .faq-login__question::after {
    transform: rotate(180deg);
}

.faq-login__list li.active .faq-login__question {
    color: var(--bg-content);
    background-color: var(--title);
    border-radius: 6px 6px 0 0;
}

.faq-login__answer {
    max-height: 0;
    opacity: 0;
    padding: 0 20px;
    transition: max-height 0.5s ease, padding 0.5s ease, opacity 0.5s ease;
}

.faq-login__list li.active .faq-login__answer {
    max-height: 600px;
    background-color: transparent;
    opacity: 1;
    padding: 12px 20px;
}

/**-------------- FOOTER-LOGIN --------------*/

.footer-login__content {
    max-width: 100%;
    background-color: var(--bg-content);
    border-radius: 0;
    margin-top: 20px;
}

.footer-login__navigation {
    display: flex;
    justify-content: center;
    margin-bottom: 32px;
}

.footer-login__navigation li:not(:last-child) {
    margin-right: 32px;
}

.footer-login__navigation li a {
    font-weight: 700;
    font-size: 15px;
    line-height: 22px;
    color: var(--text);
    text-transform: uppercase;
    transition: all 0.5s;
}

.footer-login__navigation a:hover {
    color: var(--btn);
}

.footer-login__images {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    margin-bottom: 32px;
}

.footer-login-images__image:not(:last-child) {
    margin-right: 32px;
}

.footer-login__bottom {
    width: 100%;
    max-width: 1240px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    margin: 0 auto;

}

.footer-login__details {
    width: 100%;
    max-width: 1180px;
    text-align: center;
    margin-right: 20px;
}

/**-------------- RESPONSIBLE GAMING PAGE --------------*/

.main-gaming {
    width: 100%;
    max-width: 1240px;
    margin: 0 auto;
}

/**-------------- HEADER-GAMING --------------*/

.header-gaming {
    position: fixed;
    top: 0px;
    left: 0px;
    right: 0px;
    z-index: 1000;
}

.header-gaming__content {
    position: relative;
    max-width: 100%;
    display: flex;
    align-items: center;
    overflow: visible;
    height: 80px;
    background-color: var(--header);
    border-radius: 0;
    padding: 12px 48px 12px 100px;
}

.header-gaming__logo img {
    max-width: 182px;
}

.header-gaming__menu ul {
    background-color: var(--bg-menu);
    border-radius: 50px;
    margin-left: 24px;
}

.header-gaming-menu__list {
    position: relative;
    font-weight: 400;
    font-size: 15px;
    line-height: 22px;
    text-transform: uppercase;
    color: var(--bg-content);
    padding: 13px 24px;
    border-radius: 50px;
    transition: background-color 0.3s;
}

.header-gaming-menu__list:hover {
    background-color: var(--hover-menu);
}

.header-gaming-dropdown__link {
    background: transparent;
    border: none;
    font-weight: 400;
    font-size: 15px;
    line-height: 22px;
    text-transform: uppercase;
    color: var(--bg-content);
}

.header-gaming-dropdown__toggle {
    width: 10px;
    height: 7px;
    background: url("../img/chevron-down.svg") no-repeat center / contain;
    vertical-align: middle;
    margin-left: 5px;
    transition: transform 0.3s;
}

.header-gaming-dropdown__toggle.active {
    transform: rotate(180deg);
}

.header-gaming-menu__list > ul.header-gaming__dropdown {
    display: none;
    position: absolute;
    top: 55px;
    left: 0;
    flex-direction: column;
    align-items: flex-start;
    min-width: 161px;
    white-space: nowrap;
    border-radius: 6px;
    background-color: var(--dropdown-menu);
    margin-left: 0;
    z-index: 2000;
    opacity: 0;
    transform: translateY(-8px);
    transition: opacity 0.25s ease, transform 0.25s ease;
}

.header-gaming-menu__list > ul.header-gaming__dropdown.show {
    display: flex;
    opacity: 1;
    transform: translateY(0);
}

.header-gaming-dropdown__list {
    display: block;
    padding: 8px 16px;
}

.header-gaming-dropdown__list a {
    color: var(--bg-content);
    transition: color 0.2s;
}

.header-gaming-dropdown__list a:hover {
    color: var(--btn);
}

.header-gaming__button-auth {
    margin-left: auto;
}

.header-gaming__button {
    padding-left: 24px;
    padding-right: 24px;
}

.header-gaming__button-login {
    background-color: var(--bg-menu);
    margin-right: 16px;
}

.header-gaming__watch {
    margin-left: 24px;
    margin-right: 24px;
}

.header-gaming__watch span {
    font-size: 15px;
    color: var(--bg-content);
}

.header-gaming__lang {
    display: flex;
    align-items: center;
    background-color: var(--header);
}

.header-gaming__lang img {
    display: block;
    width: 24px;
    height: 24px;
}

.header-gaming__lang span {
    font-size: 14px;
    line-height: 22px;
    text-transform: uppercase;
    color: var(--bg-content);
    margin-left: 8px;
}

/**-------------- HERO-GAMING --------------*/

.hero-gaming__content {
    border-radius: 0;
    padding: 0;
    margin-top: 80px;
    margin-bottom: 20px;
}

.hero-gaming__info {
    position: relative;
    max-width: 610px;
    background-color: transparent;
    padding: 87px 0 87px 100px;
    z-index: 1;
}

.hero-gaming__info span {
    display: block;
    color: var(--bg-content);
}

.hero-gaming__title {
    margin-top: 8px;
    margin-bottom: 8px;
}

.hero-gaming__button {
    margin-top: 16px;

}

/**-------------- NAVIGATION-GAMING --------------*/

.navigation-gaming__content {
    padding: 0;
}

.navigation-gaming__general {
    padding: 17px 20px;
}

.navigation-gaming__general button {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    font-weight: 700;
    text-transform: uppercase;
    text-wrap: wrap;
    text-align: left;
    color: var(--text);
    background-color: transparent;
    border-radius: 6px;
    -webkit-tap-highlight-color: transparent;
}

.navigation-gaming__general button::after {
    content: "";
    display: block;
    width: 32px;
    height: 32px;
    border-radius: 6px;
    background-image: url("../img/arrow-down.png");
    background-color: var(--btn-navigation);
    background-repeat: no-repeat;
    background-position: center;
    transition: transform 0.5s ease;
}

.navigation-gaming__general.active button::after {
    transform: rotate(180deg);
}

.navigation-gaming__general.active {
    background-color: var(--title);
    border-radius: 6px 6px 0 0;
}

.navigation-gaming__general.active button {
    color: var(--bg-content);
}

.navigation-gaming__menu {
    height: 0;
    opacity: 0;
    overflow: hidden;
    padding: 0 20px;
    transition: height 0.5s ease, opacity 0.5s ease, padding 0.5s ease;
}

.navigation-gaming__general.active + .navigation-gaming__menu {
    opacity: 1;
    padding: 8px 20px 0 20px;
}

.navigation-gaming__menu li a {
    display: block;
    color: var(--text);
    margin-bottom: 8px;
    transition: transform 0.5s ease;
    -webkit-tap-highlight-color: transparent;
}

.navigation-gaming__menu li a:hover {
    font-weight: 700;
}

/**-------------- FOOTER-GAMING --------------*/

.footer-gaming__content {
    max-width: 100%;
    background-color: var(--bg-content);
    border-radius: 0;
    margin-top: 20px;
}

.footer-gaming__navigation {
    display: flex;
    justify-content: center;
    margin-bottom: 32px;
}

.footer-gaming__navigation li:not(:last-child) {
    margin-right: 32px;
}

.footer-gaming__navigation li a {
    font-weight: 700;
    font-size: 15px;
    line-height: 22px;
    color: var(--text);
    text-transform: uppercase;
    transition: all 0.5s;
}

.footer-gaming__navigation a:hover {
    color: var(--btn);
}

.footer-gaming__images {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    margin-bottom: 32px;
}

.footer-gaming-images__image:not(:last-child) {
    margin-right: 32px;
}

.footer-gaming__bottom {
    width: 100%;
    max-width: 1240px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    margin: 0 auto;

}

.footer-gaming__details {
    width: 100%;
    max-width: 1180px;
    text-align: center;
    margin-right: 20px;
}

/**-------------- PRIVACY POLICY PAGE --------------*/

.main-privacy {
    width: 100%;
    max-width: 1240px;
    margin: 0 auto;
}

/**-------------- HEADER-PRIVACY --------------*/

.header-privacy {
    position: fixed;
    top: 0px;
    left: 0px;
    right: 0px;
    z-index: 1000;
}

.header-privacy__content {
    position: relative;
    max-width: 100%;
    display: flex;
    align-items: center;
    overflow: visible;
    height: 80px;
    background-color: var(--header);
    border-radius: 0;
    padding: 12px 48px 12px 100px;
}

.header-privacy__logo img {
    max-width: 182px;
}

.header-privacy__menu ul {
    background-color: var(--bg-menu);
    border-radius: 50px;
    margin-left: 24px;
}

.header-privacy-menu__list {
    position: relative;
    font-weight: 400;
    font-size: 15px;
    line-height: 22px;
    text-transform: uppercase;
    color: var(--bg-content);
    padding: 13px 24px;
    border-radius: 50px;
    transition: background-color 0.3s;
}

.header-privacy-menu__list:hover {
    background-color: var(--hover-menu);
}

.header-privacy-dropdown__link {
    background: transparent;
    border: none;
    font-weight: 400;
    font-size: 15px;
    line-height: 22px;
    text-transform: uppercase;
    color: var(--bg-content);
}

.header-privacy-dropdown__toggle {
    width: 10px;
    height: 7px;
    background: url("../img/chevron-down.svg") no-repeat center / contain;
    vertical-align: middle;
    margin-left: 5px;
    transition: transform 0.3s;
}

.header-privacy-dropdown__toggle.active {
    transform: rotate(180deg);
}

.header-privacy-menu__list > ul.header-privacy__dropdown {
    display: none;
    position: absolute;
    top: 55px;
    left: 0;
    flex-direction: column;
    align-items: flex-start;
    min-width: 161px;
    white-space: nowrap;
    border-radius: 6px;
    background-color: var(--dropdown-menu);
    margin-left: 0;
    z-index: 2000;
    opacity: 0;
    transform: translateY(-8px);
    transition: opacity 0.25s ease, transform 0.25s ease;
}

.header-privacy-menu__list > ul.header-privacy__dropdown.show {
    display: flex;
    opacity: 1;
    transform: translateY(0);
}

.header-privacy-dropdown__list {
    display: block;
    padding: 8px 16px;
}

.header-privacy-dropdown__list a {
    color: var(--bg-content);
    transition: color 0.2s;
}

.header-privacy-dropdown__list a:hover {
    color: var(--btn);
}

.header-privacy__button-auth {
    margin-left: auto;
}

.header-privacy__button {
    padding-left: 24px;
    padding-right: 24px;
}

.header-privacy__button-login {
    background-color: var(--bg-menu);
    margin-right: 16px;
}

.header-privacy__watch {
    margin-left: 24px;
    margin-right: 24px;
}

.header-privacy__watch span {
    font-size: 15px;
    color: var(--bg-content);
}

.header-privacy__lang {
    display: flex;
    align-items: center;
    background-color: var(--header);
}

.header-privacy__lang img {
    display: block;
    width: 24px;
    height: 24px;
}

.header-privacy__lang span {
    font-size: 14px;
    line-height: 22px;
    text-transform: uppercase;
    color: var(--bg-content);
    margin-left: 8px;
}

/**-------------- HERO-PRIVACY --------------*/

.hero-privacy__content {
    border-radius: 0;
    padding: 0;
    margin-top: 80px;
    margin-bottom: 20px;
}

.hero-privacy__info {
    position: relative;
    max-width: 610px;
    background-color: transparent;
    padding: 87px 0 87px 100px;
    z-index: 1;
}

.hero-privacy__info span {
    display: block;
    color: var(--bg-content);
}

.hero-privacy__title {
    margin-top: 8px;
    margin-bottom: 8px;
}

.hero-privacy__button {
    margin-top: 16px;

}

/**-------------- NAVIGATION-PRIVACY --------------*/

.navigation-privacy__content {
    padding: 0;
}

.navigation-privacy__general {
    padding: 17px 20px;
}

.navigation-privacy__general button {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    font-weight: 700;
    text-transform: uppercase;
    text-wrap: wrap;
    text-align: left;
    color: var(--text);
    background-color: transparent;
    border-radius: 6px;
    -webkit-tap-highlight-color: transparent;
}

.navigation-privacy__general button::after {
    content: "";
    display: block;
    width: 32px;
    height: 32px;
    border-radius: 6px;
    background-image: url("../img/arrow-down.png");
    background-color: var(--btn-navigation);
    background-repeat: no-repeat;
    background-position: center;
    transition: transform 0.5s ease;
}

.navigation-privacy__general.active button::after {
    transform: rotate(180deg);
}

.navigation-privacy__general.active {
    background-color: var(--title);
    border-radius: 6px 6px 0 0;
}

.navigation-privacy__general.active button {
    color: var(--bg-content);
}

.navigation-privacy__menu {
    height: 0;
    opacity: 0;
    overflow: hidden;
    padding: 0 20px;
    transition: height 0.5s ease, opacity 0.5s ease, padding 0.5s ease;
}

.navigation-privacy__general.active + .navigation-privacy__menu {
    opacity: 1;
    padding: 8px 20px 0 20px;
}

.navigation-privacy__menu li a {
    display: block;
    color: var(--text);
    margin-bottom: 8px;
    transition: transform 0.5s ease;
    -webkit-tap-highlight-color: transparent;
}

.navigation-privacy__menu li a:hover {
    font-weight: 700;
}

/**-------------- FOOTER-PRIVACY --------------*/

.footer-privacy__content {
    max-width: 100%;
    background-color: var(--bg-content);
    border-radius: 0;
    margin-top: 20px;
}

.footer-privacy__navigation {
    display: flex;
    justify-content: center;
    margin-bottom: 32px;
}

.footer-privacy__navigation li:not(:last-child) {
    margin-right: 32px;
}

.footer-privacy__navigation li a {
    font-weight: 700;
    font-size: 15px;
    line-height: 22px;
    color: var(--text);
    text-transform: uppercase;
    transition: all 0.5s;
}

.footer-privacy__navigation a:hover {
    color: var(--btn);
}

.footer-privacy__images {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    margin-bottom: 32px;
}

.footer-privacy-images__image:not(:last-child) {
    margin-right: 32px;
}

.footer-privacy__bottom {
    width: 100%;
    max-width: 1240px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    margin: 0 auto;

}

.footer-privacy__details {
    width: 100%;
    max-width: 1180px;
    text-align: center;
    margin-right: 20px;
}

/**-------------- BURGER BUTTON--------------*/

.burger__button {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border: 2px solid var(--btn);
    border-radius: 8px;
    z-index: 1001;
    order: 99;
}

.burger__button span {
    position: absolute;
    width: 22px;
    height: 3px;
    background-color: var(--btn);
    border-radius: 2px;
    transition: all 0.3s ease;
}

.burger__button span:nth-child(1) {
    top: 50%;
    transform: translateY(-10px);
}

.burger__button span:nth-child(2) {
    top: 50%;
    transform: translateY(0);
}

.burger__button span:nth-child(3) {
    top: 50%;
    transform: translateY(10px);
}

#burger-toggle:checked+.burger__button span:nth-child(1) {
    transform: translateY(0) rotate(45deg);
}

#burger-toggle:checked+.burger__button span:nth-child(2) {
    opacity: 0;
}

#burger-toggle:checked+.burger__button span:nth-child(3) {
    transform: translateY(0) rotate(-45deg);
}