:root{
    --theme-primary: #39652c;
    --theme-green: #00c344;
    --theme-secondary: #1c2a3e;
    --theme-blue: #0d4a80;
    --theme-darkblue: #002060;


    --theme-light: white;
    --theme-dark: var(--theme-secondary);
    --font-norm: "Merriweather", serif;
    --font-impact: "BebasNeue", sans-serif;

    --border-px: 4px;
}

@font-face {
    font-family: "Dosis";
    src: url(/assets/fonts/Dosis.ttf);
}
@font-face {
    font-family: "BebasNeue";
    src: url(/assets/fonts/BebasNeue.ttf);
}
@font-face{
    font-family: "Merriweather";
    src: url(/assets/fonts/Merriweather.ttf);

}
*{

    box-sizing: border-box;
}
html, body{
    position: relative;
    margin: 0;
    padding: 0;
    min-width: 100%;
    font-size: 1.15rem;
    /* font-family:  */
    text-rendering: optimizeLegibility;
    overflow-x: hidden;
    background-color: var(--theme-primary);
}

.font-norm{
    font-family: var(--font-norm);
    font-size: 1rem;
    font-weight: 400;
    line-height: 2em;
}
.font-imp{
    font-family: var(--font-impact);
    font-size: 2.5rem;
    font-weight: 800;
}
p{
}
h1, h2, h3, h4, h5, h6, p{

    margin: 0;
}
h1, h2, h3, h4, h5, h6{
    font-weight: bold;
    font-weight: 800;
    text-decoration: underline;
}
img{
    user-select: none;
}
input, button, textarea{
    /* font-size: inherit; */
    font-family: inherit;
    background-color: var(--theme-light);
    border: grey 2px solid;
}
ul.right{
    text-align: right;
    direction: rtl;
    list-style-type: "—";
    
}
a.undecorated{
    color: inherit;
}

/* animations */
:root{
    --outline-flash: outline-flash 0.75s steps(2) infinite;
}
@keyframes outline-flash{
    from{
        outline-offset: 0px;
        outline-width: 4px;
    }
    to{
        outline-offset: -4px;
        outline-width: 8px;
    }
}