main.css

.small
{
    font-size: 0.6em;
}
.center
{
    text-align: center;
}

.weather
{
    display: flex;
    flex-flow: column wrap;
    box-shadow: 0px 1px 10px 0px #cfcfcf;
    overflow: hidden;
}

.weather .current
{
    display: flex;
    flex-flow: row wrap;
    color: orange;
}

.weather .current .info
{
    display: flex;
    flex-flow: column wrap;
    justify-content: space-around;
    flex-grow: 2;
}

.weather .current .info .city
{
    font-size: 26px;
}

.weather .current .info .temp
{
    font-size: 56px;
}

.weather .current .info .wind
{
    font-size: 24px;
}

.weather .current .icon
{
    text-align: center;
    font-size: 64px;
    flex-grow: 1;
}

.weather .future
{
    display: flex;
    flex-flow: row nowrap;
}

.weather .future .day
{
    flex-grow: 1;
    text-align: center;
}

.weather .future .day h3
{
    text-transform: uppercase;
}

.weather .future .day p
{
    font-size: 28px;
}

#map 
{ 
    height: 360px; 
}