style.css

.degree_symbol:not(:empty)::after {
    content: "°"
}

img{
    max-width: 100%;
    max-height: 100%;
}

.owm-legend-item{
    display: none;
}

#map {
	width: 600px;
    height: 600px;
}


.icon_01d{
    background-image: url("/img/01d.png");
    background-repeat: no-repeat; 
    background-position: center;
    background-size: cover;
}

.icon_02d{
    background-image: url("/img/02d.png");
    background-repeat: no-repeat; 
    background-position: center;
    background-size: cover;
}

.icon_03d{
    background-image: url("/img/03d.png");   
    background-repeat: no-repeat; 
    background-position: center;
    background-size: cover;
}

.icon_04d{
    background-image: url("/img/04d.png"); 
    background-repeat: no-repeat; 
    background-position: center;
    background-size: cover;
}

.icon_09d{
    background-image: url("/img/09d.png");   
    background-repeat: no-repeat; 
    background-position: center;
    background-size: cover;
}

.icon_10d{
    background-image: url("/img/10d.png");  
    background-repeat: no-repeat; 
    background-position: center;
    background-size: cover;
}

.icon_11d{
    background-image: url("/img/11d.png");   
    background-repeat: no-repeat; 
    background-position: center;
    background-size: cover;
}

.icon_13d{
    background-image: url("/img/13d.png");  
    background-repeat: no-repeat; 
    background-position: center;
    background-size: cover;
}

.icon_50d{
    background-image: url("/img/50d.png");  
    background-repeat: no-repeat; 
    background-position: center;
    background-size: cover;
}

.yellow{
    background-color: yellow;
}

.red{
    background-color: red;
}

.green{
    background-color: green;
}

.blue{
    background-color: blue;
}