.appBG{
    background-color: #e0dcdc;
    width: 100%;
    height: 100%;
    position: absolute;
}

.appBG_darkMode{
    background-color: #141921;
}

.svgMapHolder{
    display: flex;
    z-index: 0;
    align-self: center;
    align-items: center;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
}

.svgMapIconsHolder{
    display: flex;
    z-index: 0;
    align-self: center;
    align-items: center;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    pointer-events: none;
}

.svgMap
{
    height: 95%;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    stroke: #000000;
    stroke-width: 0.2px;
    stroke-opacity: 0.12;
}

.svgMapIcons
{
    height: 95%;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    stroke: #00000000;
    stroke-width: 0;
    stroke-opacity: 0;
    pointer-events: none;
}

html.light .svgMap
{
    stroke: #6d6d6d;
}

.svgMap_darkMode
{
    stroke: #000000;
}

.svgMapAdditional
{
    position: absolute;
    left: 0;
}

.svgLabels{
    z-index: 2;
    font-family: 'e-Ukraine', serif;
    font-weight: 100;
    fill: #FFFFFF;
}

html.light .svgLabels
{
    fill: #2A2D31;
}

html.light .artilleryBG
{
    fill: #141921;
    fill-opacity: 0.7;
}

.artilleryBG
{
    fill: white;
    fill-opacity: 0.7;
}

.artilleryBGInner
{
    fill: #2A2D31;
}

html.light .artilleryBGInner
{
    fill: #FFFFFF;
}

.state
{
    stroke: #000000;
    stroke-opacity: 18%;
    stroke-width: 0.62px;
    fill : #3B4351;
}

html.light .state
{
    fill : #EEE9E3;
    stroke: #C5BCB1;
    stroke-width: 0.62px;
    stroke-opacity: 44%;
}

.dist
{
    stroke: #000000;
    stroke-width: 0.22px;
    stroke-opacity: 6%;
    fill: transparent;
}

html.light .dist
{
    stroke: #908779;
    stroke-width: 0.22px;
    stroke-opacity: 6%;
    fill: transparent;
}   

.textAlert{
    fill: white;    
}

.regionAlert 
{ 
    fill : #D45B50;
    fill-opacity: 1;
}

.regionAlert_15
{
    fill : #BC4A40;
}

.regionAlert_30
{
    fill : #A53931;
}

.regionAlert_60
{
    fill : #91322b;
}

.regionAlert_long
{
    fill: #7e2b25;
}

.regionAlert_infinity
{
    fill : #7e2b25;
    fill-opacity: 1;
}

html.light .regionAlert
{
    fill : #D45B50;
    fill-opacity: 1;
}

html.light .regionAlert_15
{
    fill : #BC4A40;
}

html.light .regionAlert_30
{
    fill : #A53931;
}

html.light .regionAlert_60
{
    fill : #91322b;
}

html.light .regionAlert_long
{
    fill: #7e2b25;
}

.regionAlert_artillery
{
    fill : #FF9900;
    fill-opacity: 1;
}

.regionAlert_diaArtillery
{
    fill: url(#diaArtillery);
    fill-opacity: 1;
}

.regionAlert_diaArtilleryAndStreet {
    fill: url(#diaArtilleryAndStreet) !important;
    fill-opacity: 0.8 !important;
}

.regionAlert_diaStreet
{
    fill: url(#diaStreet);
    fill-opacity: 1;
}

.regionAlert_artillery_15
{
    fill-opacity: 0.95;
}

.regionAlert_artillery_30
{
    fill-opacity: 0.9;
}

.regionAlert_artillery_60
{
    fill-opacity: 0.85;
}

html.light .regionAlert_artillery
{
    fill : #FF9900;
    fill-opacity: 1;
}
html.light .regionAlert_artillery_15
{
    fill-opacity: 0.95;
}
html.light .regionAlert_artillery_30
{
    fill-opacity: 0.9;
}
html.light .regionAlert_artillery_60
{
    fill-opacity: 0.85;
}

.regionAlert_nuclear
{
    fill : #E6B20E;
    fill-opacity: 1;
}

.regionAlert_nuclear_15
{
    fill-opacity: 0.95;
}

.regionAlert_nuclear_30
{
    fill-opacity: 0.9;
}

.regionAlert_nuclear_60
{
    fill-opacity: 0.85;
}

html.light .regionAlert_nuclear
{
    fill : #E6B20E;
    fill-opacity: 1;
}
html.light .regionAlert_nuclear_15
{
    fill-opacity: 0.95;
}
html.light .regionAlert_nuclear_30
{
    fill-opacity: 0.9;
}
html.light .regionAlert_nuclear_60
{
    fill-opacity: 0.85;
}

.regionAlert_chemical
{
    fill : #B75AEE;
    fill-opacity: 1;
}

.regionAlert_chemical_15
{
    fill-opacity: 0.95;
}

.regionAlert_chemical_30
{
    fill-opacity: 0.9;
}

.regionAlert_chemical_60
{
    fill-opacity: 0.85;
}

.regionAlert_street
{
    fill : #00B280;
    fill-opacity: 1;
}
.regionAlert_street_15
{
    fill-opacity: 0.95;
}
.regionAlert_street_30
{
    fill-opacity: 0.9;
}
.regionAlert_street_60
{
    fill-opacity: 0.85;
}

html.light .regionAlert_chemical
{
    fill : #B75AEE;
    fill-opacity: 1;
}
html.light .regionAlert_chemical_15
{
    fill-opacity: 0.95;
}
html.light .regionAlert_chemical_30
{
    fill-opacity: 0.9;
}
html.light .regionAlert_chemical_60
{
    fill-opacity: 0.85;
}

.regionAlert_diaAlert
{
    fill: url(#diaAlert);
    fill-opacity: 1;
    stroke-width: 0 !important;
    stroke-opacity: 0 !important;
    stroke: red !important 
}

.regionAlert_diaAlert_15
{
    fill: url(#diaAlert_15) !important;
    fill-opacity: 1;
}

.regionAlert_diaAlert_30
{
    fill: url(#diaAlert_30) !important;
    fill-opacity: 1;
}

.regionAlert_diaAlert_60
{
    fill: url(#diaAlert_60) !important;
    fill-opacity: 1;
}

.regionAlert_diaAlert_long
{
    fill: url(#diaAlert_long) !important;
    fill-opacity: 1;
}

html.light .regionAlert_diaAlert
{
    fill: url(#diaAlert_light) !important;
    fill-opacity: 1 !important;
}
html.light .regionAlert_diaAlert_15
{
    fill: url(#diaAlert_light_15) !important;
    fill-opacity: 1 !important;
}
html.light .regionAlert_diaAlert_30
{
    fill: url(#diaAlert_light_30) !important;
    fill-opacity: 1 !important;
}
html.light .regionAlert_diaAlert_60
{
    fill: url(#diaAlert_light_60) !important;
    fill-opacity: 1 !important;
}
html.light .regionAlert_diaAlert_long
{
    fill: url(#diaAlert_light_long) !important;
    fill-opacity: 1 !important;
}


.regionInfo
{
    fill : #ffce66;
    stroke : #faff7e;
}

.regionInfo_darkMode
{
    fill : #a69f3f; 
    stroke : #faff7e;

} 

.dist_alarmed
{
    fill : #f58e8e;
    opacity: 0.9;
}

.community_alarmed
{
    opacity: 0.8;
}

.artilleryIcon
{
    position: absolute;
    width: 100%;
    height: 95%;
    z-index: 4;
    fill: #736c6c;
}

.artilleryTooltip
{
    text-align: center;
}