[data-bs-theme=dark]{--bs-body-bg:#1a1b1c;--bs-body-bg-rgb:26,27,28}.fit-cover{object-fit:cover}.bs-icon{--bs-icon-size:.75rem;display:flex;flex-shrink:0;justify-content:center;align-items:center;font-size:var(--bs-icon-size);width:calc(var(--bs-icon-size) * 2);height:calc(var(--bs-icon-size) * 2);color:var(--bs-primary)}.bs-icon-xs{--bs-icon-size:1rem;width:calc(var(--bs-icon-size) * 1.5);height:calc(var(--bs-icon-size) * 1.5)}.bs-icon-sm{--bs-icon-size:1rem}.bs-icon-md{--bs-icon-size:1.5rem}.bs-icon-lg{--bs-icon-size:2rem}.bs-icon-xl{--bs-icon-size:2.5rem}.bs-icon.bs-icon-primary{color:var(--bs-white);background:var(--bs-primary)}.bs-icon.bs-icon-primary-light{color:var(--bs-primary);background:rgba(var(--bs-primary-rgb),.2)}.bs-icon.bs-icon-semi-white{color:var(--bs-primary);background:rgba(255,255,255,.5)}.bs-icon.bs-icon-rounded{border-radius:.5rem}.bs-icon.bs-icon-circle{border-radius:50%}
.g-text{
    color: #01ED81;
}
.menu-gradient {
    background: rgb(2,0,36);
    background: linear-gradient(90deg, rgba(2,0,36,1) 0%, rgba(13,45,68,1) 50%, rgba(15,22,39,1) 100%);
}
.menu-text {
    font-style: italic;
}
#mainlogo {
    display: block;
    min-width: 60px;
    min-height: 60px;
    overflow: hidden;
    box-shadow: 16px 0 50px 40px rgba(24, 33, 73, 0.5),
                -16px 0 50px 40px rgba(24, 33, 73, 0.5);
}
#flogo{
    display: block;
    position: relative;
    top: 0px;
    left: 0px;
    padding-top: 100%;
    padding-left: calc(padding-top);
    background-image: url('../src/imgs/fbl.png');
    background-size: 200% 100%;
    background-repeat: repeat;
    filter: brightness(120%);
    animation: moving 10s linear infinite;
    z-index: 2;
    box-shadow: inset 4px 0 8px 2px rgba(0, 0, 0, 0.6),
                inset -4px 0 8px 2px rgba(255, 255, 255, 0.3);
}
#blogo{
    display: block;
    position: relative;
    top: 0px;
    left: 0px;
    margin-top: calc(-100%);
    padding-top: 100%;
    padding-left: calc(padding-top);
    background-image: url('../src/imgs/fbl.png');
    background-size: 200% 100%;
    background-repeat: repeat;
    filter: brightness(60%);
    animation: moving 15s linear infinite reverse;
    z-index: 1;
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
}
.gradient-box {
    background: linear-gradient( 135deg, #e5baba, #dfd997, #88c8ea );
    background-size: 300% 300%; /* для анимации */
    animation: gradientShift 8s ease infinite;
    box-shadow: 0 10px 30px rgba(255, 150, 150, 0.3);
}

@keyframes gradientShift {
    0% {
        background-position: 0% 50%;
    }
    50% {
        background-position: 100% 50%;
    }
    100% {
        background-position: 0% 50%;
    }
}

@keyframes scrollOpacity {
    0% {
        background-color: rgba(13,14,32,0);
    }
    20% {
        background-color: rgba(13,14,32,1);
    }
}

@keyframes moving {
    0% {
        background-position: 0% 0%;
    }
    100% {
        background-position: 99% 0%;
    }
}
