/* ....................................... */
/* Cтили для праздничного оформления шапки */
/* ....................................... */

.header__overlay {
    position: relative;
}

.header__video {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
    object-fit: cover;
    z-index: 1;
    display: none;
}

.header--newyear .header__video.header__video--newyear,
.header--birthday .header__video.header__video--birthday,
.header--vipusknoy .header__video.header__video--vipusknoy,
.header--september1 .header__video.header__video--september1 {
    display: block;
}

@media (max-width: 1024px) {
    .header__mobile--newyear {
        background: #fff url('/i/header/newyear-bg-tablet.png') no-repeat;
    }

    .header__mobile--birthday {
        background: #fff url('/i/header/birthday-bg-tablet.png') no-repeat;
        background-size: 100% 100%;
        ;
    }

    .header__mobile--vipusknoy {
        background: #fff url('/i/header/vipusknoy-bg-tablet.png') no-repeat center;
    }

    .header__mobile--september1 {
        background: #fff url('/i/header/september1-bg-tablet.png') no-repeat;
    }
}

@media (max-width: 600px) {
    .header__mobile--newyear {
        background: #fff url('/i/header/newyear-bg-mobile.png') no-repeat;
    }

    .header__mobile--birthday {
        background: #fff url('/i/header/birthday-bg-mobile.png') no-repeat;
        background-size: cover;
    }

    .header__mobile--september1 {
        background: #fff url('/i/header/september1-bg-mobile.png') no-repeat;
    }
}

.logo__mobile {
    position: relative;
}

.header__mobile--vipusknoy .logo__mobile::after {
    content: '';
    display: block;
    position: absolute;
    top: 16px;
    right: -10px;
    z-index: 1;
    width: 65px;
    height: 73px;
    background-size: contain;
    background: url(/i/header/vipusknoy-hat.svg) center no-repeat;
    background-size: cover;
}

@media (max-width: 600px) {
    .header__mobile--vipusknoy .logo__mobile::after {
        top: 15px;
        right: 6px;
        z-index: 1;
        width: 45px;
        height: 40px;
        transform: rotate(-20deg);
    }
}

.logo__img {
    position: relative;
}
.mobile__wrap .logo__txt {
    position: relative;
    z-index: 2;
}

@media (min-width: 1025px) {
    .logo__img--vipusknoy {
        display: none;
        position: absolute;
        left: 0;
        top: 0;
        transform: translate(-44%, -10%) rotate(4deg);
        z-index: -1;
    }

    .logo__img--september1 {
        display: none;
        position: absolute;
        right: 0;
        bottom: 0;
        transform: translate(30%, 20%);
        z-index: -1;
    }
}

.header--vipusknoy .logo__img--vipusknoy,
.header--september1 .logo__img--september1 {
    display: block;
}

.header__main-middle {
    position: relative;
    height: 150px;
    z-index: 2;
    background-color: transparent;
}
.header__main-menu {
    z-index: 2;
    background-color: transparent;
    position: relative;
}

.header__main-menu.fixed {
    background-color: #fff;
    left: 15px;
}

/* ....................... */
/* ........Конец.........  */
/* ....................... */

.header__main-middle {
    z-index: 2;
    background-color: initial;
}

.header__main-menu {
    position: relative;
    z-index: 2;
}

.mobile__wrap .logo__img,
.mobile__wrap .logo__txt {
    position: relative;
    z-index: 3;
}


/*Анимация фейерверка */
.fireworks-container {
    width: 100%;
    height: 300px;
    position: absolute;
    z-index: -99;
}

.fireworks-container-canvas {
    width: 100%;
    height: 300px;
    position: absolute;
    z-index: -98;
}