.bg-grey-middle {
    --bs-bg-opacity: 1;
    background-color: rgba(132, 132, 132), var(--bs-bg-opacity) !important
}

.bg-orange-light {
    background-color: rgba(255, 161, 97);
}

/*/translate: calc(240vh - 12px);/*/
.bg-bledno-blue {
    background-color: rgba(151, 224, 255);
}

.font-krasiviy {
    font-family: cursive;
}

.anim1 {
    animation: ease-in-out anim 20s infinite;
    max-width: 100px;
}

@keyframes anim {
    50% {
        translate: calc(85vw - 12px);
    }

    /*12px*/
    100% {
        translate: 0px;
    }
}

@media (min-width:576px) {
    @keyframes anim-sm {
        50% {
            translate: calc(85vw - 12px);
        }

        100% {
            translate: 0px;
        }
    }

    .anim1-sm {
        animation: ease-in-out anim-sm 20s infinite;
        max-width: 100px;
    }
}

@media (min-width:768px) {
    @keyframes anim-md {
        50% {
            translate: calc(85vw - 12px);
        }

        100% {
            translate: 0px;
        }
    }

    .anim1-md {
        animation: ease-in-out anim-md 20s infinite;
        max-width: 150px;
    }
}

@media (min-width:992px) {
    @keyframes anim-lg {
        50% {
            translate: calc(85vw - 12px);
        }

        100% {
            translate: 0px;
        }
    }

    .anim1-lg {
        animation: ease-in-out anim-lg 20s infinite;
        max-width: 175px;
    }
}

@media (min-width:1200px) {
    @keyframes anim-xl {
        50% {
            translate: calc(84vw - 12px);
        }

        100% {
            translate: 0px;
        }
    }

    .anim1-xl {
        animation: ease-in-out anim-xl 20s infinite;
        max-width: 200px;
    }
}

@media (min-width:1400px) {
    @keyframes anim-xxl {
        50% {
            translate: calc(85vw - 12px);
        }

        100% {
            translate: 0px;
        }
    }

    .anim1-xxl {
        animation: ease-in-out anim-xxl 20s infinite;
        max-width: 200px;
    }
}

h2 {
    font-size: calc(1.375rem + 1.5vw)
}

.col-6-1 {
    flex: 0 0 auto;
    width: 49%
}

.height-6 {
    flex: 0 0 auto;
    height: 50%
}

.height-auto {
    flex: 0 0 auto;
    height: auto;
}

.height-1 {
    flex: 0 0 auto;
    height: 8.33333333%;
}

.height-2 {
    flex: 0 0 auto;
    height: 16.66666667%;
}

.height-3 {
    flex: 0 0 auto;
    height: 25%;
}

.height-4-5 {
    flex: 0 0 auto;
    height: 33.33333333%;
    width: 41.66666667%;
}

.height-5 {
    flex: 0 0 auto;
    height: 41.66666667%;
    width: 41.66666667%;
}

.height-7 {
    flex: 0 0 auto;
    height: 58.33333333%;
}

.height-8 {
    flex: 0 0 auto;
    height: 66.66666667%;
}

.height-9 {
    flex: 0 0 auto;
    height: 75%;
}

.height-10 {
    flex: 0 0 auto;
    height: 83.33333333%;
}

.height-11 {
    flex: 0 0 auto;
    height: 91.66666667%;
}

.height-12 {
    flex: 0 0 auto;
    height: 100%;
}

.shw-anim {
    animation: ease-in-out shw 2s;
}

.skr-anim {
    animation: ease-in-out skr 2s;
}

@keyframes skr {
    0% {
        opacity: 1.0;
    }

    100% {
        opacity: 0;
    }
}

@keyframes shw {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1.0;
    }
}

.flex-center {
    display: flex !important;
    justify-content: center;
    flex-wrap: wrap;
}

video {
    width: 96vw;
    height: 96vh;
}