@import url("https://fonts.googleapis.com/css2?family=Oswald:wght@200..700&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Archivo+Black&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Archivo+Black&family=Manrope:wght@200..800&display=swap");

:root
{
    --deepocean:#070b11;
    --petroleum:#141b29;
    --bluebase:#00355d;
    --sadderblue:#344c5f;
    --sadblue:#517088;
    --silver:#7ea6c5;
    --bluelake:#1b78be;
    --lightblue:#53a5e4;
    --whiteice:#e3e7ec;
    --dirtypaper:#d8dce0;
    --oswald:"Oswald";
    --archivo:"Archivo Black";
    --manrope:"Manrope";
}

html, body
{
    margin:0;
    height:100%;
}
body
{
    display:flex;
    flex-direction:column;
    background-color:var(--whiteice);
}
h1, h2, h3, h4, h5, h6, p
{
    margin:0;
    font-family:var(--archivo);
}
p
{
    font-family:var(--manrope);
}
img
{
    user-select:none;
    -webkit-user-drag:none;
}
a
{
    text-decoration:none;
    transition:0.3s;
}
a, button
{
    cursor:pointer;
}
input, button, select, textarea
{
    transition:0.3s;
}
input:focus, button:focus, select:focus, textarea:focus
{
    outline:0;
}

.row, .col
{
    display:flex;
}
.row
{
    flex-direction:row !important;
}
.row.mid
{
    justify-content:center;
}
.row.cen
{
    align-items:center;
}
.col
{
    flex-direction:column !important;
}
.col.mid
{
    align-items:center;
}
.g05
{
    gap:5px;
}
.g10
{
    gap:10px;
}
.g15
{
    gap:15px;
}
.g20
{
    gap:20px;
}
.g25
{
    gap:25px;
}
.g30
{
    gap:30px;
}