div#sqm-widget {
	font-size: 13px;
	line-height: 20px;
}

.sqm-current {
    margin-bottom: 1rem;
}

.sqm-current-value {
    font-size: 3rem;
    line-height: 1;
}

.sqm-current-unit {
    font-size: 1rem;
    color: #666;
    margin-top: .25rem;
}

.sqm-quality {
    font-size: 1.3rem;
    font-weight: 600;
    margin-top: 1rem;
}

.sqm-quality.perfect { color: #000A3A;}
.sqm-quality.extremely-dark { color: #0E1E64; }
.sqm-quality.dark { color: #2850A0;}
.sqm-quality.very-dark { color: #406898; }
.sqm-quality.slightly-bright { color: #4C6782; }
.sqm-quality.clearly-bright { color: #646464;}
.sqm-quality.very-bright { color: #766140;}
.sqm-quality.poor { color: #a38352; }

.sqm-last-update {
    margin-top: .4rem;
}
   
#sqm-chart-container {
    cursor: zoom-in;
	height: 300px;
	background-color: white;
}

#sqm-chart {
    height: 100%;
}

#sqm-chart-container:fullscreen {
    padding: 20px;
    cursor: zoom-out;
}

.sqm-error {
    color: #b00020;
    margin: 1rem 0;
}

.sqm-details {
    margin-top: 1rem;
}

.sqm-details p {
    margin-top: .75rem;
}

.sqm-details th, .sqm-details td {
    border-bottom: 1px solid #ddd;
    padding: .4rem .6rem;
}