@font-face {
  font-family: 'poppins'; 
  src: url('src/fonts/Poppins-Regular.ttf') format('truetype');
}

@font-face {
  font-family: 'poppinsbold'; 
  src: url('src/fonts/Poppins-Black.ttf') format('truetype');
}

/* ==========================
   VARIABILI
========================== */
:root{
    --bg: #f4f4f4; 
    --text: #0f0f0f; 
    --accent: #1C56A3; 
    --second: #F44100;
}

html, body{
    margin: 0px;
    padding: 0px;
}

body{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;

    width: 100vw;
    height: 100vh;
}

.imgLogo{
    width: 90vw;
    max-width: 400px;
}

.main-title{
    font-family: 'poppinsbold';
    font-size: 2rem;
    color: var(--accent);
    text-align: center;

    margin: 0px 5px;
}

.main-subtitle{
    font-family: 'poppins'; 
    font-size: 0.8rem;
    text-align: center;
    color: black;
    
    margin: 0px 5px;
}

a{
    text-decoration: none;
    color: black;

    font-family: 'poppins'; 
}

.locationContainer{
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 5px;
}

.locationContainer > img{
    width: 16px;
    height: 16px; 
}

@media (max-width: 600px) {
    .locationContainer > img{
        width: 32px;
        height: 32px; 
    }
}

.locationContainer a{
    font-size: 'poppins';
    font-size: 0.8rem;
}

.btn-container{
    display: flex;
    justify-content: center;
    align-items: center;

    margin-top: 16px;
}

.btn-container a{
    font-size: 'poppins';
    font-size: 0.8rem;

    background-color: var(--second);
    padding: 5px; 
    border-radius: 3px;

    margin: 5px;

    color: white;
}