@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@100..900&family=Rubik:ital,wght@0,300..900;1,300..900&family=Jaro:opsz@6..72&family=Honk&family=Cal+Sans&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Lora:ital,wght@0,400..700;1,400..700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Lexend:wght@100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Alumni+Sans+Pinstripe:ital@0;1&display=swap');
.currentWeather {
    margin-bottom: 0px;
}
@media (min-width: 768px) {
    #airportTitle {
        font-size: 30px;
        text-align: left;
    }
    body {
        text-align: center;
        background-color: hsl(0, 0%, 5%);
        color: white;
        font-family: "Outfit", sans-serif;
        font-weight: 300;
        
    }
    h3, h1 {
        font-family: "Outfit", sans-serif;
        font-weight: 300;
    }
    .currentWeather, .metarCurrentWeather {
        font-family: "Alumni Sans Pinstripe", sans-serif;
        font-weight: 800;
        display: flex;
        font-size: 30px;
        align-items: center;
    }
    #temp, .temp {
        font-family: "Alumni Sans Pinstripe", sans-serif;
        font-weight: 800;
        font-size: 90px;
        margin: 0 0 0 100px;
    }
    canvas {
        margin: 0px 100px;
    }
    .right {
        display: flex;
        flex-direction: column;
        margin-left: 30px;
        text-align: left;
    }
    #airportTitle h3 {
        margin-top: 0px;
        margin-left: 100px;
    }
}

@media (max-width: 768px) {
    #airportTitle {
        font-size: 20px;
        text-align: left;
    }
    body {
        text-align: center;
        background-color: hsl(0, 0%, 5%);
        color: white;
        font-family: "Outfit", sans-serif;
        font-weight: 200;
        
    }
    h3, h1 {
        font-family: "Outfit", sans-serif;
        font-weight: 300;
    }
    .currentWeather, .metarCurrentWeather {
        font-family: "Alumni Sans Pinstripe", sans-serif;
        font-weight: 800;
        display: flex;
        font-size: 25px;
        align-items: center;
    }
    #temp, .temp {
        font-family: "Alumni Sans Pinstripe", sans-serif;
        font-weight: 800;
        font-size: 75px;
        margin: 0 0 0 20px;
    }
    canvas {
        margin: 0px 20px;
    }
    .right {
        display: flex;
        flex-direction: column;
        margin-left: 30px;
        text-align: left;
    }
    #airportTitle h3 {
        margin-top: 0px;
        margin-left: 20px;
    }
}



a:link, a:visited, a:hover, a:active {
    color: hsl(0, 0%, 100%) !important;
}
#humidity, #updated, .updated {
    margin: none;
}
h3 {
    margin-bottom: 0px;
}

.page {
    display: none;
    flex-direction: column;
    align-items: center;
}