@font-face {
    font-family: 'Work Sans';
    src: url('font/WorkSans-VariableFont_wght.ttf') format('truetype');
}

:root {

    --white2: #E1E1E1;
    --grey: #a9a9a9;
    --yellow: #FFE500;
    --black: #1E1E1E;
    --blue: #0043FF;
    --purple: #FF00E5;
    --white: #F5F5F5;
    --lgray: #3B456a;
    --dgray: #161a29;
    --dgrayT: rgba(180, 180, 180, 0.1);
    --lred: #ff2e2e;
    --dred: #c70000;
    --lorange: #ff852e;
    --dorange: #c75400;
    --lgreen: #00f327;
    --dgreen: #008a16;
    --lblue: #628dff;
    --dblue: #265eff;

    --hoverColor: #fff;

    --radius: 15px;

    --transition: all .2s ease-out;

    --gradS: linear-gradient(-45deg, var(--black), var(--blue), var(--black));
    --gradG: linear-gradient(135deg, var(--lgray), var(--dgray));
    --gradGI: linear-gradient(135deg, var(--dgray), var(--lgray));
    --shadow: 10px 30px 8px rgba(22, 26, 41, 0.34);
    --headShadow: 0 0 12px rgba(0, 0, 0, 1);
}

html {
    scroll-behavior: smooth;
}

* {
    font-family: "Work Sans", sans-serif;
    margin: 0;
    padding: 0;
}


body {
    scroll-behavior: smooth;
    overflow-x: hidden;
    overflow-y: scroll;
    background: var(--gradG);
    background-attachment: fixed;
    width: 100vw;
    margin: 0;
    padding: 0;

}

main {
    display: flex;
    flex-direction: column;
    height: 100%;
    padding-top: 40px;
    padding-bottom: 40px;
    min-height: 80vh;
}

.box {
    border-radius: var(--radius);
    width: 70vw;
    margin: 40px auto 60px;
    padding: 8vh 5vw;
}

.box h2 {
    font-size: 28px;
    line-height: calc(28px * 1.6);
    font-variant: small-caps;
}

.linkTxt {
    text-decoration: underline;
    cursor: pointer;
}

.material-symbols-outlined {
    font-variation-settings: 'FILL' 0,
    'wght' 400,
    'GRAD' 0,
    'opsz' 48
}

#error404 {
    color: var(--white);
    text-align: center;
    margin: auto;
    border-radius: 25px;
    width: 40vw;
    overflow-y: scroll;
    padding: 25px;
}

#error404 h2 {
    font-size: larger;
}

.disabled {
    display: none !important;
}

@media (width < 800px) {

}