:root{
    --blue-default: #2c7b95; 
    --white-default: #fff;
    --red-default: #bb2d3b; 
    --red-hover: #e61d31;
    --green-default: #157347;
    --black-default: #231f20;
    --yellow-default: #ffca2c;

    --gray-soft: rgba(51, 51, 51, 0.493);
    --white-soft: rgba(255, 255, 255, 0.13);

    --background-disable: rgba(239, 239, 239, 0.3);
    --color-disable: rgba(16, 16, 16, 0.3);

    --title-font: "Quicksand", sans-serif;
    --text-font: "Poppins", sans-serif;

    --shadow-default: -2px 2px 6px rgba(90, 90, 90, 0.35);
}

*{
    box-sizing:border-box;
    padding:0;
    margin:0;
}

html{
    padding:0;
    margin: 0;
}

body{
    background-color:var(--blue-default);
}

div.container {
    display: flex;
    justify-content: space-between;
    align-items: center;

    flex-direction:column;

    height: 100vh;
    width: 100vw;
}

div.container > div.content{
    display: flex;
    justify-content: space-evenly;
    align-items: center;
    flex-direction: column;

    width: 75%;

    height: 100%;
}

span.little-info{
    margin-left:5px;

    font-size: 0.8rem;

    color: var(--gray-soft);
}

div.display-flex{
    display:flex;
    align-items: center;
    justify-content: center;
}

@media (max-width: 500px) {
    html {
        font-size: 93.75%; 
    }
}

@media (max-width: 520px) {
    html {
        font-size: 87.5%; 
    }
}