:root{
    --background-color : #010101;
    --text-color : #ffffff;
    --button-color : #0775CC;
    --app-theme-color : #FFA500;
    --tag-color: #FFD580;
    --light-green : #90EE90;
    --alert-color : #FF0000;
    --light-red : #FF7F7F;
    --light-blue : #ADD8E6;
}

@font-face {
    font-family: coolvetica;
    src: url(../fonts/coolvetica.otf);
}

@font-face {
    font-family: nunito;
    src: url(../fonts/nunito.ttf);
}

@font-face {
    font-family: montserrat;
    src: url(../fonts/montserrat.ttf);
}
@font-face {
    font-family: kartina;
    src: url(../fonts/kartina.ttf);
}
@font-face {
    font-family: helvetica;
    src: url(../fonts/helvetica.ttf);
}
@font-face {
    font-family: roboto;
    src: url(../fonts/roboto.ttf);
}
@font-face {
    font-family: roboto-thin;
    src: url(../fonts/roboto-thin.ttf);
}
@font-face {
    font-family: carnollia;
    src: url(../fonts/carnollia.otf);
}

@font-face {
    font-family: oregano;
    src: url(../fonts/oregano.ttf);
}
html, *{
    background-color: var(--background-color);
    padding: 0;
    margin: 0;
    box-sizing: border-box;
    font-size: 62.5%;
}

h1{
    font-family: coolvetica;
    font-size: 2.5rem;
    color: var(--text-color);
}

h2{
    font-size: 2rem;
    color: var(--text-color);
    font-family: helvetica;
}
p{
    font-family: roboto;
    font-size: 1.55rem;
    color: var(--text-color);
}

a{
    font-family: helvetica;
    font-size: 1.6rem;
    color: var(--tag-color);
    text-decoration: none;
}