﻿.animate {
    animation: fadeInAnimation ease 0.4s;
    animation-iteration-count: 1;
    animation-fill-mode: forwards;
}

.animate1 {
    animation: fadeInAnimation ease 0.6s;
    animation-iteration-count: 1;
    animation-fill-mode: forwards;
}

.animate2 {
    animation: fadeInAnimation ease 0.8s;
    animation-iteration-count: 1;
    animation-fill-mode: forwards;
}
.animate3 {
    animation: fadeInAnimation ease 1s;
    animation-iteration-count: 1;
    animation-fill-mode: forwards;
}

.animate4 {
    animation: fadeInAnimation ease 1.2s;
    animation-iteration-count: 1;
    animation-fill-mode: forwards;
}

.animate5 {
    animation: fadeInAnimation ease 1.4s;
    animation-iteration-count: 1;
    animation-fill-mode: forwards;
}

@keyframes fadeInAnimation {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

body, div {
    --duration: 0.5s;
    --timing: ease;
    color: var(--color);
    background-color: var(--background-color);
    transition: background-color var(--duration) var(--timing), color var( --duration ) var(--timing);
}

p, h1 {
    animation: fadeInAnimation ease 0.4s;
    animation-iteration-count: 1;
    animation-fill-mode: forwards;
}

html, body {
    width: 100%;
    height: 100%;
}

a {
    text-decoration: none;
}

.transverse-div {
    display: inline-block;
    margin: 20px;
}

::-webkit-scrollbar {
    width: 4px;
    height: 5px;
}

@media (prefers-color-scheme: light) {
    html, body, .backmask, .right {
        background-color: #F7F9FC;
    }

    h1, p, div, a, .f {
        color: #001D35;
    }

    .fx, .b {
        color: #EAEFF9;
    }

    .news, .left, .copyright, .bm {
        background-color: #EAEFF9;
    }

    .bmx {
        background-color: #001D35;
    }

    .fib {
        background-image: url('ibl.svg');
        background-size: 138.94px 88px;
    }

    ::-webkit-scrollbar-thumb {
        background-color: #B4B8BF;
    }
}

@media (prefers-color-scheme: dark) {
    html, body, .backmask, .right {
        background-color: #000000;
    }

    h1, p, div, a, .f {
        color: #EAEFF9;
    }

    .fx, .b {
        color: #141414;
    }

    .news, .left, .copyright, .bm {
        background-color: #141414;
    }

    .bmx {
        background-color: #EAEFF9;
    }

    .fib {
        background-image: url('ibd.svg');
        background-size: 138.94px 88px;
    }

    ::-webkit-scrollbar-thumb {
        background-color: #949297;
    }
}