@use 'colors'as c; @use 'utils'as u; #extended-forecast-html.weather-display { background-image: url('../images/BackGround2_1.png'); } .weather-display .main.extended-forecast { .day-container { margin-top: 16px; margin-left: 27px; } .day { @include u.text-shadow(); padding: 5px; height: 285px; width: 155px; display: inline-block; margin: 0px 15px; font-family: 'Star4000'; font-size: 24pt; .date { text-transform: uppercase; text-align: center; color: c.$title-color; } .condition { text-align: center; height: 74px; margin-top: 10px; } .icon { text-align: center; height: 75px; img { max-height: 75px; } } .temperatures { width: 100%; margin-top: 5px; .temperature-block { display: inline-block; width: 44%; >div { text-align: center; ; } .value { font-family: 'Star4000 Large'; margin-top: 4px; } &.lo .label { color: c.$extended-low; } &.hi .label { color: c.$title-color; } } } } }