:root{
    --background-color: #eefcf8;
    --text-color: #486054;
    --accentGreen-color: #68B0AB;
    --accentGreen-color-op05: rgba(104, 176, 171, 0.5);
    --accentYellow-color: #CD9042;
    --accentRed-color: #CD5C5C;
}
/*:root{
    --background-color: #000000;
    --text-color: #486054;
    --accentGreen-color: #68afaa;
    --accentYellow-color: #b08e68;
    --accentRed-color: #B06868;
}*/

@font-face {
    src: url("../Font/Manrope.ttf");
    font-family: Manrope;
}
@keyframes animate {
    0%{
        opacity: 0;
    }
    100%{
        opacity: 1;
    }
}
body{
    margin: 0 auto;
    background: var(--background-color);
    color: var(--text-color);
    font-family: Manrope;
    font-size: 1.1rem;
    animation: linear animate 1s;
}
h1{
    color: var(--accentGreen-color);
    border-bottom: 2px solid var(--accentGreen-color);
    text-align: center;
}
*::selection{
    color: var(--text-color);
}
button{
    background: none;
    border: none;
    cursor: pointer;
}
a{
    cursor: pointer;
}
a, a:link, a:visited  {
    text-decoration: none;
}

a:hover  {
    text-decoration: none;
}
::-webkit-scrollbar {
    width: 5px;               /* ширина scrollbar */
    height: 5px;
}
::-webkit-scrollbar-track {
    background-color: var(--background-color);    /* цвет дорожки */
}
::-webkit-scrollbar-thumb {
    background-image: linear-gradient(var(--background-color), var(--accentGreen-color), var(--background-color)); /* цвет плашки */
    /*background-color: var(--accentGreen-color);*/
    border: none;  /* padding вокруг плашки */
}