@import url(https://fonts.googleapis.com/css?family=Poppins:100,100italic,200,200italic,300,300italic,regular,italic,500,500italic,600,600italic,700,700italic,800,800italic,900,900italic);

* {
    font-family: Poppins;
    user-select: none;
    -moz-user-select: none;
    -webkit-user-select: none;
}

.left {
    height: 400px;
    width: auto;
    border-radius: 10px;
    background-image: url(./img/clear_sky.jpg);
    z-index: 99;
    aspect-ratio: 5/4;
    text-shadow: 4px 4px 2px rgba(0, 0, 0, 0.16);
}

.right {
    height: 370px;
    width: auto;
    aspect-ratio: 1/1;
    background-color: rgba(0, 0, 0, 0.185);
    border-radius: 10px;
    padding-top: 2rem;
    padding-bottom: 2rem;
    text-shadow: 4px 4px 2px rgba(0, 0, 0, 0.16);
}

section {
    height: 100vh;
}

#weatherIcon {
    font-size: calc(3rem + 1.5vw);
    line-height: 1.2;
}

#temp {
    font-size: calc(3.8rem + 2vw);
    line-height: 1;
}

.grey {
    color: grey;
}

.btn {
    border-radius: 50px;
}

#locationVal {
    border-radius: 10px;
    box-shadow: 4px 4px 2px rgba(0, 0, 0, 0.16);
}