﻿/********************************************************************************************************* 
     Author: Shawn N. Moore		
    Created: 3/25/2024
Description: Classes for SR Weather page. 

**********************************************************************************************************/


/* Wind speed scale based on Beaufort Wind Scale */

.SR-WS-Calm {
    color: #009900; /* Green */
}

.SR-WS-LightAir {
    color: #009900; /* Green */
}

.SR-WS-LightBreeze {
    color: #009900; /* Green */
}

.SR-WS-GentleBreeze {
    color: #009900; /* Green */
}

.SR-WS-ModerateBreeze {
    color: #009900; /* Green */
}

.SR-WS-FreshBreeze {
    color: #999900; /* Yellow */
}

.SR-WS-StrongBreeze {
    color: #cb6915; /* Orange */
}

.SR-WS-NearGale {
    color: #cb6915; /* Orange */
}

.SR-WS-Gale {
    color: #EE0000; /* Red */
}

.SR-WS-SevereGale {
    color: #EE0000; /* Red */
}

.SR-WS-StrongStorm {
    color: #EE0000; /* Red */
}

.SR-WS-ViolentStorm {
    color: #EE0000; /* Red */
}

.SR-WS-HurricaneForce {
    color: #800080; /* Purple */
}


.SR-T-VeryCold {
    color: #0000EE; /* Blue */
}

.SR-T-Cold {
    color: #0090Bb; /* Deep Sky Blue */
}

.SR-T-Cool {
    color: #009900; /* Green */
}

.SR-T-Mild {
    color: #999900; /* Yellow */
}

.SR-T-Warm {
    color: #cb6915; /* Orange */
}

.SR-T-Hot {
    color: #bb3300; /* Tomato */
}

.SR-T-VeryHot {
    color: #aa0000; /* Red */
}

.SR-T-ExtremeHeat {
    color: #8B0000; /* Dark Red */
}


/* Windspeed dial container classes from ESRI popup*/
/* These are embedded into the control as well. */

.windspeed-dial-container {
    position:relative;
}
.windspeed-arrow-container {
    position:absolute;
    top:0;

}
.windspeed-arrow{
    width:100%
}
.windspeed-dial{
    width:100%;
    fill:#aaaaaa;
}

.windspeed-text-container{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -46%);
}


.windspeed-text-container {
    font-size: 1.4em;
    font-weight: bolder;
}
