/*
* style.css
* DW Mobile V2.1.0
* Copyright 2018, DWEM, Inc.
* dwmobile.software
* 05/15/2018
*/

/* Table of contents
–––––––––––––––––––––––––––––––––––––––––––––
- Grid
- Base Styles
- Typography
- Links
- Buttons
- Forms
- Lists
- Code
- Tables
- Spacing
- Utilities
- Clearing
- Media Queries
*/

* {
		font-family: "HelveticaNeue", "Helvetica", Arial, sans-serif;
}

body {
		-webkit-touch-callout: none;
		-webkit-user-select: none;
		-khtml-user-select: none;
		-moz-user-select: none;
		-ms-user-select: none;
		user-select: none;
}

a {
		outline: none;
}

.ui-content {
		margin: 0 !important;
		padding: 0 !important;
}

.ui-input-text {
		background: transparent !important;
		border: none !important;
		box-shadow: none !important;
}

.ui-focus {
       -moz-box-shadow: none !important;
       -webkit-box-shadow: none !important;
       box-shadow: none !important;
}

.ui-btn:focus {
       -moz-box-shadow: none !important;
       -webkit-box-shadow: none !important;
       box-shadow: none !important;
}

#thelist {
       position: absolute;
       top: 44px;
       bottom: 45px;
       left: 0;
       right: 0;
}

#Global_Local_Switcher {
       position: absolute;
       top: 7px;
       left: 50%;
       padding: 0;
       margin: 0;
       width: 220px;
       margin-left: -110px;
       background: transparent;
}

#Global_Local_Switcher .ui-btn {
       background: rgba(255, 255, 255, 1) !important;
       border-color: rgb(76,175,80) !important;
       color: rgb(76,175,80);
}

#Global_Local_Switcher .ui-btn.ui-btn-active {
       background: rgba(76,175,80, 1) !important;
       border-color: rgb(76,175,80) !important;
       color: rgb(255, 255, 255);

       -webkit-transition: all .1s ease-in-out;
       -moz-transition: all .1s ease-in-out;
       -o-transition: all .1s ease-in-out;
       transition: all .1s ease-in-out;
}

#Global_Local_Switcher input {
       visibility: hidden;
}

.right {
       float: right;
       color: rgba(55,55,55, .5);
}









#UserResetPrefButton {
       width: 100px;
       background: rgba(255, 255, 255, 1) !important;
       border-color: rgb(76,175,80) !important;
       color: rgb(76,175,80);
}

#UserResetPrefButton:active {
       background: rgba(76,175,80, 1) !important;
       border-color: rgb(76,175,80) !important;
       color: rgb(255, 255, 255);
       -webkit-transition: all .1s ease-in-out;
       -moz-transition: all .1s ease-in-out;
       -o-transition: all .1s ease-in-out;
       transition: all .1s ease-in-out;
}

/*******************************************************/
/*               HAPTIC TESTS BUTTONS               */
/*******************************************************/

#AlarmTestButton {
       width: 100px;
       background: rgba(255, 255, 255, 1) !important;
       border-color: rgb(76,175,80) !important;
       color: rgb(76,175,80);
}

#AlarmTestButton:active {
       background: rgba(76,175,80, 1) !important;
       border-color: rgb(76,175,80) !important;
       color: rgb(255, 255, 255);
       -webkit-transition: all .1s ease-in-out;
       -moz-transition: all .1s ease-in-out;
       -o-transition: all .1s ease-in-out;
       transition: all .1s ease-in-out;
}

#SignificantLevelTestButton {
       width: 100px;
       background: rgba(255, 255, 255, 1) !important;
       border-color: rgb(76,175,80) !important;
       color: rgb(76,175,80);
}

#SignificantLevelTestButton:active {
       background: rgba(76,175,80, 1) !important;
       border-color: rgb(76,175,80) !important;
       color: rgb(255, 255, 255);
       -webkit-transition: all .1s ease-in-out;
       -moz-transition: all .1s ease-in-out;
       -o-transition: all .1s ease-in-out;
       transition: all .1s ease-in-out;
}

#NetworkStatusTestButton {
       width: 100px;
       background: rgba(255, 255, 255, 1) !important;
       border-color: rgb(76,175,80) !important;
       color: rgb(76,175,80);
}

#NetworkStatusTestButton:active {
       background: rgba(76,175,80, 1) !important;
       border-color: rgb(76,175,80) !important;
       color: rgb(255, 255, 255);
       -webkit-transition: all .1s ease-in-out;
       -moz-transition: all .1s ease-in-out;
       -o-transition: all .1s ease-in-out;
       transition: all .1s ease-in-out;
}

#PowerSourceTestButton {
       width: 100px;
       background: rgba(255, 255, 255, 1) !important;
       border-color: rgb(76,175,80) !important;
       color: rgb(76,175,80);
}

#PowerSourceTestButton:active {
       background: rgba(76,175,80, 1) !important;
       border-color: rgb(76,175,80) !important;
       color: rgb(255, 255, 255);
       -webkit-transition: all .1s ease-in-out;
       -moz-transition: all .1s ease-in-out;
       -o-transition: all .1s ease-in-out;
       transition: all .1s ease-in-out;
}

#BatteryLevelTestButton {
       width: 100px;
       background: rgba(255, 255, 255, 1) !important;
       border-color: rgb(76,175,80) !important;
       color: rgb(76,175,80);
}

#BatteryLevelTestButton:active {
       background: rgba(76,175,80, 1) !important;
       border-color: rgb(76,175,80) !important;
       color: rgb(255, 255, 255);
       -webkit-transition: all .1s ease-in-out;
       -moz-transition: all .1s ease-in-out;
       -o-transition: all .1s ease-in-out;
       transition: all .1s ease-in-out;
}

/*******************************************************/

#Status_Filter_Control {
       position: absolute;
       top: 0;
       /* top: 38px; */
       left: 0;
       right: 0;
       border-radius: 0;
       border: none !important;
}

#Status_Filter_Control label {
       border-left: none !important;
       border-right: none !important;
       border-top: none !important;
       border-bottom: 1px solid #dddddd !important;
}

#Sensor_Sorter_Control {
       position: absolute;
       top: 0;
       /* top: 38px; */
       left: 0;
       right: 0;
       border-radius: 0;
       border: none !important;
}

#Sensor_Sorter_Control label {
       border-left: none !important;
       border-right: none !important;
       border-top: none !important;
       border-bottom: 1px solid #dddddd !important;
}

#RadioChoiceSensorSorterNearest {
       display: none !important;
}

#RadioChoiceSensorSorterFarthest {
       display: none !important;
}

#RadarOpacitySliderHolder {
       display: none;
}

#MrMsHSROpacitySliderHolder {
       display: none;
}

#InfraredOpacitySliderHolder {
       display: none;
}

#WaterVaporOpacitySliderHolder {
       display: none;
}

#VisibleOpacitySliderHolder {
       display: none;
}

#IsohyetalLinesPeriodHolder {
       display: none;
}

#Global_Local_Switcher2 {
       position: absolute;
       top: 7px;
       left: 50%;
       padding: 0;
       margin: 0;
       width: 220px;
       margin-left: -110px;
       background: transparent;
}

#Global_Local_Switcher2 .ui-btn {
       background: rgba(255, 255, 255, 1) !important;
       border-color: rgb(76,175,80) !important;
       color: rgb(76,175,80);
}

#Global_Local_Switcher2 .ui-btn.ui-btn-active {
       background: rgba(76,175,80, 1) !important;
       border-color: rgb(76,175,80) !important;
       color: rgb(255, 255, 255);

       -webkit-transition: all .1s ease-in-out;
       -moz-transition: all .1s ease-in-out;
       -o-transition: all .1s ease-in-out;
       transition: all .1s ease-in-out;
}

#Global_Local_Switcher2 input {
       visibility: hidden;
}

#one { position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: rgb(255,255,255); /* rgb(33,33,33); */ }
#two { position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: rgb(255,255,255); /* rgb(33,33,33); */ }
#five { position: absolute; top: 0; right: 0; bottom: 0; left: 0; }
#six { position: absolute; top: 0; right: 0; bottom: 0; left: 0; }
#seven { position: absolute; top: 0; right: 0; bottom: 0; left: 0; }
#seven label { border-radius: 0; background: rgb(255,255,255); }
#ten {  }
#ten label { border-radius: 0; background: rgb(255,255,255); }
#eleven {  }
#eleven label { border-radius: 0; background: rgb(255,255,255); }
#twelve {  }
#twelve label { border-radius: 0; background: rgb(255,255,255); }
#SettingSupportPage {  }
#SettingSupportPage label { border-radius: 0; background: rgb(255,255,255); }

#WebCamPage {

/* background: rgb(76,175,80); */

/*background: rgb(0,0,0); */

}

#WebCamPage label { border-radius: 0; background: rgb(255,255,255); }

#OnlineStatusAboutHolder {
       position: absolute;
       top: 0px;
       right: 12px;
       text-align: right;
       font-size: 20px !important;
       color: rgb(82,214,105);
       margin: 0 !important;
       padding: 0 !important;
       line-height: 45px;
}

.Status_Online {
       color: rgb(82,214,105) !important;
}

.Status_Offline {
       color: rgb(252,13,27) !important;
}

#ProtocolStatusAboutHolder {
       position: absolute;
       top: 0px;
       right: 12px;
       text-align: right;
       font-size: 20px !important;
       margin: 0 !important;
       padding: 0 !important;
       line-height: 45px;
}

#chargingTimeHolder {
       display: none;
}

#dischargingTimeHolder {
       display: none;
}

#BatteryLevel {
       display: none;
}

#TimeChangingDisCharging {
       display: none;
}

#charging {
       position: absolute;
       top: 0px;
       right: 12px;
       text-align: right;
       font-size: 20px !important;
       margin: 0 !important;
       padding: 0 !important;
       line-height: 45px;
}

#level {
       position: absolute;
       top: 0px;
       right: 12px;
       text-align: right;
       font-size: 20px !important;
       margin: 0 !important;
       padding: 0 !important;
       line-height: 45px;
}


#chargingTime {
       position: absolute;
       top: 0px;
       right: 12px;
       text-align: right;
       font-size: 20px !important;
       margin: 0 !important;
       padding: 0 !important;
       line-height: 45px;
}

#SensorsAboutHolder {
       position: absolute;
       top: 0px;
       right: 12px;
       text-align: right;
       font-size: 20px !important;
       /* font-weight: bold !important; */
       margin: 0 !important;
       padding: 0 !important;
       line-height: 45px;
}

#SystemHealthHolder {
       position: absolute;
       top: 0px;
       right: 12px;
       text-align: right;
       font-size: 20px !important;
       /* font-weight: bold !important; */
       margin: 0 !important;
       padding: 0 !important;
       line-height: 45px;
}

#SystemHealthHolder strong {
       color: rgba(0, 0, 0, .5) !important;
       text-align: right;
       /* font-size: 14px !important; */
       font-weight: normal !important;
       margin: 0 !important;
       padding: 0 !important;
       line-height: 45px;
}

#DWRunningAboutHolder {
       position: absolute;
       top: 0px;
       right: 12px;
       text-align: right;
       font-size: 20px !important;
       /* font-weight: bold !important; */
       margin: 0 !important;
       padding: 0 !important;
       line-height: 45px;
}

#DWInstalledAboutHolder {
       position: absolute;
       top: 0px;
       right: 12px;
       text-align: right;
       font-size: 20px !important;
       /* font-weight: bold !important; */
       margin: 0 !important;
       padding: 0 !important;
       line-height: 45px;
}

#VersionAboutHolder {
       position: absolute;
       top: 0px;
       right: 12px;
       text-align: right;
       font-size: 20px !important;
       /* font-weight: bold !important; */
       margin: 0 !important;
       padding: 0 !important;
       line-height: 45px;
}

#DWMobileViews {
       position: absolute;
       top: 0px;
       right: 12px;
       text-align: right;
       font-size: 20px !important;
       /* font-weight: bold !important; */
       margin: 0 !important;
       padding: 0 !important;
       line-height: 45px;
}

#DWMobileLastView {
       position: absolute;
       top: 0px;
       right: 12px;
       text-align: right;
       font-size: 20px !important;
       /* font-weight: bold !important; */
       margin: 0 !important;
       padding: 0 !important;
       line-height: 45px;
}

#LatAboutHolder {
position: absolute;
top: 0px;
right: 12px;
text-align: right;
font-size: 20px !important;
/* font-weight: bold !important; */
margin: 0 !important;
padding: 0 !important;
line-height: 45px;
}

#LongAboutHolder {
position: absolute;
top: 0px;
right: 12px;
text-align: right;
font-size: 20px !important;
/* font-weight: bold !important; */
margin: 0 !important;
padding: 0 !important;
line-height: 45px;
}

#ServerDate {

       margin: 0;
       padding: 0;
       font-size: 14px;
       line-height: 50px;
       height: 50px;
       color: rgba(55,55,55,.69);

text-align: center;


}

/* PAGE TWO */





/*


#SingleControllerPage {
       position: fixed;
       bottom: 0;
       left: 0;
       right: 0;
       height: 45px;
}


#SingleControllerPage a {
       padding: 0;
       margin: 0;
}





*/








































.BackPageButton {
       /*       visibility: hidden; */
       position: absolute;
       top: 0;
       left: 0;
       /* width: 48px; */
       width: 50px;
       margin: 0;
       /* padding: 2px 0px 5px 0px !important; */
       padding: 8px 0px 5px 7px !important;
       /* font-size: 40px !important; */
       font-size: 16px !important;
       line-height: 35px;
       text-align: left;
       border: none;
       color: rgba(76,175,80, 1) !important;
       background: transparent !important;
       border-radius: 0 !important;
       text-decoration: none !important;
       text-shadow: none !important;
       -webkit-transition: all .3s ease-in-out;
       -moz-transition: all .3s ease-in-out;
       -o-transition: all .3s ease-in-out;
       transition: all .3s ease-in-out;
       /* background-color: red !important; */
}

.BackPageButton:active {
       opacity: .5 !important;
}



#TabularChartRainfallPanelToggleButton {

       display: none;
       position: absolute;
       top: 0;
       right: 42px;
       bottom: 0;
       margin: 0;
       padding: 0;
       width: 48px;
       height: 50px;
       text-align: center;
       border: none;
       border-radius: 0;
       line-height: 50px;
       font-size: 30px !important;
       color: rgba(76,175,80, 1) !important;
       background: transparent !important;
       text-decoration: none !important;
       text-shadow: none !important;
              /* background-color: red !important; */
       -webkit-transition: all .3s ease-in-out;
       -moz-transition: all .3s ease-in-out;
       -o-transition: all .3s ease-in-out;
       transition: all .3s ease-in-out;

}

#TabularChartRainfallPanelToggleButton:active {
       opacity: .5 !important;
}

#TimeToDisplayCommands {
       display: none;
       position: absolute;
       top: 0;
       right: 0;
       bottom: 0;
       margin: 0;
       padding: 0;
       width: 48px;
       height: 50px;
       text-align: center;
       border: none;
       border-radius: 0;
       line-height: 50px;
       font-size: 30px !important;
       color: rgba(76,175,80, 1) !important;
       background: transparent !important;
       text-decoration: none !important;
       text-shadow: none !important;
              /* background-color: red !important; */
       -webkit-transition: all .3s ease-in-out;
       -moz-transition: all .3s ease-in-out;
       -o-transition: all .3s ease-in-out;
       transition: all .3s ease-in-out;
}

#TimeToDisplayCommands:active {
       opacity: .5 !important;
}




.ForwardPageButton {
/*       visibility: hidden; */
       position: absolute;
       top: 0;
       bottom: 0;
       right: 0;
       margin: 0;
       padding: 2px 0 0 5px;
       font-size: 34px !important;
       line-height: 35px;
       text-align: center;
       border: none;
       color: rgba(88,88,88, .69) !important;
       background: transparent !important;
       border-radius: 0 !important;
       text-decoration: none !important;
       text-shadow: none !important;
       -webkit-transition: all .3s ease-in-out;
       -moz-transition: all .3s ease-in-out;
       -o-transition: all .3s ease-in-out;
       transition: all .3s ease-in-out;
}

.ForwardPageButton:active {
       opacity: .5 !important;
}














#MainPanelToggleButton {
       display: none; 
       position: absolute;
       top: 0;
       bottom: 0;
       left: 0;

       width: 48px;
       height: 50px;

       margin: 0;
       padding: 0;
       font-size: 30px !important;
       line-height: 50px;
       text-align: center;
       border: none;
       color: rgba(76,175,80, 1) !important;
       background: transparent !important;
       border-radius: 0 !important;
       text-decoration: none !important;
       text-shadow: none !important;

       -webkit-transition: all .3s ease-in-out;
       -moz-transition: all .3s ease-in-out;
       -o-transition: all .3s ease-in-out;
       transition: all .3s ease-in-out;




              /* background-color: red !important; */



}

#MainPanelToggleButton:active {
       opacity: .5 !important;
}






















#MapSettingsPanelToggleButton {

       display: none;
       position: absolute;
       top: 0;
       right: 42px;
       bottom: 0;
       margin: 0;
       padding: 0;
       width: 48px;
       height: 50px;
       text-align: center;
       border: none;
       border-radius: 0;
       line-height: 50px;
       font-size: 30px !important;
       color: rgba(76,175,80, 1) !important;
       background: transparent !important;
       text-decoration: none !important;
       text-shadow: none !important;
              /* background-color: red !important; */
       -webkit-transition: all .3s ease-in-out;
       -moz-transition: all .3s ease-in-out;
       -o-transition: all .3s ease-in-out;
       transition: all .3s ease-in-out;

}

#MapSettingsPanelToggleButton:active {
       opacity: .5 !important;
}

#MapSettingsPanelToggleButtonTwo {

       display: none;
       position: absolute;
       top: 0;
       right: 0;
       bottom: 0;
       margin: 0;
       padding: 0;
       width: 48px;
       height: 50px;
       text-align: center;
       border: none;
       border-radius: 0;
       line-height: 50px;
       font-size: 30px !important;
       color: rgba(76,175,80, 1) !important;
       background: transparent !important;
       text-decoration: none !important;
       text-shadow: none !important;
              /* background-color: red !important; */
       -webkit-transition: all .3s ease-in-out;
       -moz-transition: all .3s ease-in-out;
       -o-transition: all .3s ease-in-out;
       transition: all .3s ease-in-out;

}

#MapSettingsPanelToggleButtonTwo:active {
       opacity: .5 !important;
}








#DWMobileInfoToggleButton {

       /* display: none; */
       position: absolute;
       top: 0;
       right: 3px;
       margin: 0;
       padding: 5px 5px 0px 0px;
       font-size: 30px !important;
       line-height: 50px;
       text-align: center;
       border: none;
       color: rgba(76,175,80, 1) !important;
       background: transparent !important;
       border-radius: 0;
       text-decoration: none !important;
       text-shadow: none !important;
       -webkit-transition: all .3s ease-in-out;
       -moz-transition: all .3s ease-in-out;
       -o-transition: all .3s ease-in-out;
       transition: all .3s ease-in-out;
       /* background-color: red !important; */
}

#DWMobileInfoToggleButton:active {
       opacity: .5 !important;
}



#DWMobileInfoToggleDoneButton {

       /*       visibility: hidden; */
       position: absolute;
       top: 0;
       left: 0;
       /* width: 48px; */
       width: 50px;
       margin: 0;
       /* padding: 2px 0px 5px 0px !important; */
       padding: 8px 0px 5px 7px !important;
       /* font-size: 40px !important; */
       font-size: 16px !important;
       line-height: 50px;
       text-align: left;
       border: none;
       color: rgba(76,175,80, 1) !important;
       background: transparent !important;
       border-radius: 0 !important;
       text-decoration: none !important;
       text-shadow: none !important;
       -webkit-transition: all .3s ease-in-out;
       -moz-transition: all .3s ease-in-out;
       -o-transition: all .3s ease-in-out;
       transition: all .3s ease-in-out;
       /* background-color: red !important; */

}

#DWMobileInfoToggleDoneButton:active {
       opacity: .5 !important;
}







#DWMobileVersionToggleDoneButton {

       /*       visibility: hidden; */
       position: absolute;
       top: 0;
       left: 0;
       /* width: 48px; */
       width: 50px;
       margin: 0;
       /* padding: 2px 0px 5px 0px !important; */
       padding: 8px 0px 5px 7px !important;
       /* font-size: 40px !important; */
       font-size: 16px !important;
       line-height: 50px;
       text-align: left;
       border: none;
       color: rgba(76,175,80, 1) !important;
       background: transparent !important;
       border-radius: 0 !important;
       text-decoration: none !important;
       text-shadow: none !important;
       -webkit-transition: all .3s ease-in-out;
       -moz-transition: all .3s ease-in-out;
       -o-transition: all .3s ease-in-out;
       transition: all .3s ease-in-out;
       /* background-color: red !important; */
}

#DWMobileVersionToggleDoneButton:active {
       opacity: .5 !important;
}











#CategoryTypesPanelToggleButton {

       display: none;
       position: absolute;
       top: 0;
       right: 0;
       bottom: 0;
       margin: 0;
       padding: 0;
       width: 48px;
       height: 50px;
       text-align: center;
       border: none;
       border-radius: 0;
       line-height: 50px;
       font-size: 30px !important;
       color: rgba(76,175,80, 1) !important;
       background: transparent !important;
       text-decoration: none !important;
       text-shadow: none !important;
              /* background-color: red !important; */
       -webkit-transition: all .3s ease-in-out;
       -moz-transition: all .3s ease-in-out;
       -o-transition: all .3s ease-in-out;
       transition: all .3s ease-in-out;

}

#CategoryTypesPanelToggleButton:active {
       opacity: .5 !important;
}













#RainfallInfoFooter {
       display: none;

       /* position: absolute; */

       position: fixed;

       top: 53px;
       left: 0;
       right: 0;
       height: 50px;
       z-index: 2;


text-align: center;



}

#RainfallInfoFooter p {

       padding: 5px;
       margin: 0;

       /* background: rgba(248, 248, 248, .95); */

       background: rgb(248, 248, 248);
       border: none;
       border-bottom: 1px solid rgb(221, 221, 221);
       font-size: 14px;
       font-weight: normal;

}

#OverviewReportedInfoFooter {

       display: none;

       /* position: absolute; */

       position: fixed;
       bottom: 53px;
       left: 0;
       right: 0;
       height: 50px;


       background: rgb(248, 248, 248);

       border: none;

       border-top: 1px solid rgb(221, 221, 221);


text-align: center;

       z-index: 2;

}


#OverviewReportedInfoFooter p {

       padding: 5px;
       margin: 0;

       /* background: rgba(248, 248, 248, .95); */


       font-size: 14px;
       font-weight: normal;

}

#OverviewReportedInfoFooter progress {

       width: 90%;

}



#OverviewReportedInfoFooterText {
       height: 35px;
}

#MapLocationInfoFooter {

       display: none;
       /* position: absolute; */
       position: fixed;
       bottom: 104px;
       left: 0;
       right: 0;
       height: 81px;
       /* background: rgba(248, 248, 248, .95); */
       background: rgb(248, 248, 248);
       border: none;
       border-top: 1px solid rgb(221, 221, 221);
       width: 100%;
       z-index: 2;

}


#MapLocationInfoFooter p {

       padding: 5px;
       margin: 0;
       font-size: 14px;
       font-weight: normal;
       line-height: 18px;

}

#MapLocationInfoFooter progress {

       width: 90%;

}


#MapLocationInfoFooterText {

       position: absolute;
       left: 0;
       text-align: left;

}

#MapLocationInfoFooterText2 {
       position: absolute;
       right: 0;
       text-align: right;
}

#ListViewSortButton {

       display: none;
       position: absolute;
       top: 0;
       right: 42px ;
       bottom: 0;
       margin: 0;
       padding: 0;
       width: 48px;
       height: 50px;
       text-align: center;
       border: none;
       border-radius: 0;
       line-height: 50px;
       font-size: 30px !important;
       color: rgba(76,175,80, 1) !important;
       background: transparent !important;
       text-decoration: none !important;
       text-shadow: none !important;
              /* background-color: red !important; */
       -webkit-transition: all .3s ease-in-out;
       -moz-transition: all .3s ease-in-out;
       -o-transition: all .3s ease-in-out;
       transition: all .3s ease-in-out;

}



#ListViewSortButton:active {
       opacity: .5 !important;
}

#ListViewSortButtonTwo {

       display: none;
       position: absolute;
       top: 0;
       right: 0;
       bottom: 0;
       margin: 0;
       padding: 0;
       width: 48px;
       height: 50px;
       text-align: center;
       border: none;
       border-radius: 0;
       line-height: 50px;
       font-size: 30px !important;
       color: rgba(76,175,80, 1) !important;
       background: transparent !important;
       text-decoration: none !important;
       text-shadow: none !important;
              /* background-color: red !important; */
       -webkit-transition: all .3s ease-in-out;
       -moz-transition: all .3s ease-in-out;
       -o-transition: all .3s ease-in-out;
       transition: all .3s ease-in-out;

}

#ListViewSortButtonTwo:active {
       opacity: .5 !important;
}

#ListViewFilterButton {

       display: none;
       position: absolute;
       top: 0;
       right: 84px;
       bottom: 0;
       margin: 0;
       padding: 0;
       width: 48px;
       height: 50px;
       text-align: center;
       border: none;
       border-radius: 0;
       line-height: 50px;
       font-size: 30px !important;
       color: rgba(76,175,80, 1) !important;
       background: transparent !important;
       text-decoration: none !important;
       text-shadow: none !important;
              /* background-color: red !important; */
       -webkit-transition: all .3s ease-in-out;
       -moz-transition: all .3s ease-in-out;
       -o-transition: all .3s ease-in-out;
       transition: all .3s ease-in-out;

}

#ListViewFilterButton:active {
       opacity: .5 !important;
}

#ListViewFilterButtonTwo {

       display: none;
       position: absolute;
       top: 0;
       right: 42px;
       bottom: 0;
       margin: 0;
       padding: 0;
       width: 48px;
       height: 50px;
       text-align: center;
       border: none;
       border-radius: 0;
       line-height: 50px;
       font-size: 30px !important;
       color: rgba(76,175,80, 1) !important;
       background: transparent !important;
       text-decoration: none !important;
       text-shadow: none !important;
              /* background-color: red !important; */
       -webkit-transition: all .3s ease-in-out;
       -moz-transition: all .3s ease-in-out;
       -o-transition: all .3s ease-in-out;
       transition: all .3s ease-in-out;

}

#ListViewFilterButtonTwo:active {
       opacity: .5 !important;
}

#OverviewSortButton {

       display: none;
       position: absolute;
       top: 0;
       right: 42px ;
       bottom: 0;
       margin: 0;
       padding: 0;
       width: 48px;
       height: 50px;
       text-align: center;
       border: none;
       border-radius: 0;
       line-height: 50px;
       font-size: 30px !important;
       color: rgba(76,175,80, 1) !important;
       background: transparent !important;
       text-decoration: none !important;
       text-shadow: none !important;
              /* background-color: red !important; */
       -webkit-transition: all .3s ease-in-out;
       -moz-transition: all .3s ease-in-out;
       -o-transition: all .3s ease-in-out;
       transition: all .3s ease-in-out;

}

#OverviewSortButton:active {
       opacity: .5 !important;
}

#OverviewSortButtonTwo {

       display: none;
       position: absolute;
       top: 0;
       right: 0;
       bottom: 0;
       margin: 0;
       padding: 0;
       width: 48px;
       height: 50px;
       text-align: center;
       border: none;
       border-radius: 0;
       line-height: 50px;
       font-size: 30px !important;
       color: rgba(76,175,80, 1) !important;
       background: transparent !important;
       text-decoration: none !important;
       text-shadow: none !important;
              /* background-color: red !important; */
       -webkit-transition: all .3s ease-in-out;
       -moz-transition: all .3s ease-in-out;
       -o-transition: all .3s ease-in-out;
       transition: all .3s ease-in-out;

}

#OverviewSortButtonTwo:active {
       opacity: .5 !important;
}

#OverviewFilterButton {

       display: none;
       position: absolute;
       top: 0;
       right: 84px;
       bottom: 0;
       margin: 0;
       padding: 0;
       width: 48px;
       height: 50px;
       text-align: center;
       border: none;
       border-radius: 0;
       line-height: 50px;
       font-size: 30px !important;
       color: rgba(76,175,80, 1) !important;
       background: transparent !important;
       text-decoration: none !important;
       text-shadow: none !important;
              /* background-color: red !important; */
       -webkit-transition: all .3s ease-in-out;
       -moz-transition: all .3s ease-in-out;
       -o-transition: all .3s ease-in-out;
       transition: all .3s ease-in-out;

}

#OverviewFilterButton:active {
       opacity: .5 !important;
}

#OverviewFilterButtonTwo {

       display: none;
       position: absolute;
       top: 0;
       right: 42px;
       bottom: 0;
       margin: 0;
       padding: 0;
       width: 48px;
       height: 50px;
       text-align: center;
       border: none;
       border-radius: 0;
       line-height: 50px;
       font-size: 30px !important;
       color: rgba(76,175,80, 1) !important;
       background: transparent !important;
       text-decoration: none !important;
       text-shadow: none !important;
              /* background-color: red !important; */
       -webkit-transition: all .3s ease-in-out;
       -moz-transition: all .3s ease-in-out;
       -o-transition: all .3s ease-in-out;
       transition: all .3s ease-in-out;

}

#OverviewFilterButtonTwo:active {
       opacity: .5 !important;
}

#MapViewFilterButton {

       display: none;
       position: absolute;
       top: 0;
       right: 84px;
       bottom: 0;
       margin: 0;
       padding: 0;
       width: 48px;
       height: 50px;
       text-align: center;
       border: none;
       border-radius: 0;
       line-height: 50px;
       font-size: 30px !important;
       color: rgba(76,175,80, 1) !important;
       background: transparent !important;
       text-decoration: none !important;
       text-shadow: none !important;
              /* background-color: red !important; */
       -webkit-transition: all .3s ease-in-out;
       -moz-transition: all .3s ease-in-out;
       -o-transition: all .3s ease-in-out;
       transition: all .3s ease-in-out;

}

#MapViewFilterButton:active {
       opacity: .5 !important;
}

#MapViewFilterButtonTwo {

       display: none;
       position: absolute;
       top: 0;
       right: 42px;
       bottom: 0;
       margin: 0;
       padding: 0;
       width: 48px;
       height: 50px;
       text-align: center;
       border: none;
       border-radius: 0;
       line-height: 50px;
       font-size: 30px !important;
       color: rgba(76,175,80, 1) !important;
       background: transparent !important;
       text-decoration: none !important;
       text-shadow: none !important;
              /* background-color: red !important; */
       -webkit-transition: all .3s ease-in-out;
       -moz-transition: all .3s ease-in-out;
       -o-transition: all .3s ease-in-out;
       transition: all .3s ease-in-out;

}

#MapViewFilterButtonTwo:active {
       opacity: .5 !important;
}




#HomeLocationOnMapButtonHolder {


       position: fixed;
       right: 5px;
       bottom: 0;
       margin: 0;
       padding: 0;
       width: 48px;
       height: 48px;
       text-align: center;
       border: 1px solid rgb(221, 221, 221);
       border-radius: 100%;
       line-height: 48px;
       font-size: 30px !important;

       background: rgb(248, 248, 248) !important;

/*       background: red !important; */

z-index: 3;


}




#HomeLocationOnMapButton {


       position: absolute;
       top: 0;
       right: 0;
       left: 0;
       margin: 0;
       padding: 0;
       width: 48px;
       height: 48px;
       text-align: center;
       border: none;
       border-radius: 0;
       line-height: 48px;
       font-size: 30px !important;
       color: rgba(55,55,55,.25);
       background: transparent !important;
       text-decoration: none !important;
       text-shadow: none !important;
/*       background-color: red !important; */
       -webkit-transition: all .3s ease-in-out;
       -moz-transition: all .3s ease-in-out;
       -o-transition: all .3s ease-in-out;
       transition: all .3s ease-in-out;

z-index: 4;
}

#HomeLocationOnMapButton:active {
       opacity: .5 !important;
}

.NotAtHomeLocation {
       color: rgba(76,175,80, 1) !important;
}







#CurrentLocationOnMapButtonHolder {


       position: fixed;
       right: 5px;
       bottom: 0;
       margin: 0;
       padding: 0;
       width: 48px;
       height: 48px;
       text-align: center;
       border: 1px solid rgb(221, 221, 221);
       border-radius: 100%;
       line-height: 48px;
       font-size: 30px !important;

       background: rgb(248, 248, 248) !important;

/*       background: red!important; */


z-index: 3;


}




#CurrentLocationOnMapButton {


       position: absolute;
       top: 0;
       right: 0;
       left: 0;
       margin: 0;
       padding: 0;
       width: 48px;
       height: 48px;
       text-align: center;
       border: none;
       border-radius: 0;
       line-height: 48px;
       font-size: 30px !important;
       color: rgba(55,55,55,.25);
       background: transparent !important;
       text-decoration: none !important;
       text-shadow: none !important;
/*       background-color: red !important; */
       -webkit-transition: all .3s ease-in-out;
       -moz-transition: all .3s ease-in-out;
       -o-transition: all .3s ease-in-out;
       transition: all .3s ease-in-out;

z-index: 4;

}

#CurrentLocationOnMapButton:active {
       opacity: .5 !important;
}

.NotAtCurrentLocation {
       color: rgba(76,175,80, 1) !important;
}






/* Not Sure */


#CurrentLocationOnListandOverviewButton {
/*       opacity: 0; */
       display: none;
       position: absolute;
       top: 0;

       left: 42px;

       bottom: 0;

       margin: 0;
       padding: 5px 5px !important;
       font-size: 30px !important;
       line-height: 35px;
       text-align: left;
       width: 35px;

       border: none;
       color: rgba(55,55,55,.25) !important;
       background: transparent !important;
       border-radius: 0;
       text-decoration: none !important;
       text-shadow: none !important;
       -webkit-transition: all .3s ease-in-out;
       -moz-transition: all .3s ease-in-out;
       -o-transition: all .3s ease-in-out;
       transition: all .3s ease-in-out;

       /* background-color: red !important; */
}

#CurrentLocationOnListandOverviewButton:active {
       opacity: .5 !important;
}




.ControllersUpdateButton {
       /* display: none; */
       position: absolute;
       top: 0;
       bottom: 0;
       right: 3px;
       width: 35px;
       margin: 0;
       padding: 6px 0px 0px 5px;
       font-size: 26px !important;
       line-height: 35px;
       text-align: center;
       border: none;
       color: rgba(76,175,80, 1) !important;
       background: transparent !important;
       border-radius: 0 !important;
       text-decoration: none !important;
       text-shadow: none !important;
       -webkit-transition: all .3s ease-in-out;
       -moz-transition: all .3s ease-in-out;
       -o-transition: all .3s ease-in-out;
       transition: all .3s ease-in-out;
}

.ControllersUpdateButton:active {
       opacity: .5 !important;
}

#DWMobileListView::-webkit-scrollbar {
width: 0px;
/*
-webkit-box-shadow: inset 0 0 1px rgba(0,0,0,0.3);
border-radius: 3px;
margin-left: 60px;
*/
background: transparent;
}

#DWMobileListView::-webkit-scrollbar-track {

}

#DWMobileListView::-webkit-scrollbar-thumb {
/*
  border-radius: 3px;
  -webkit-box-shadow: inset 0 0 1px rgba(0,0,0,0.5);
  background: rgba(76,175,80, 1);
*/
width: 0px;
background: transparent;
}





#DWMobileOverview::-webkit-scrollbar {
width: 0px;
/*
-webkit-box-shadow: inset 0 0 1px rgba(0,0,0,0.3);
border-radius: 3px;
margin-left: 60px;
*/
background: transparent;
}

#DWMobileOverview::-webkit-scrollbar-track {

}

#DWMobileOverview::-webkit-scrollbar-thumb {
/*
  border-radius: 3px;
  -webkit-box-shadow: inset 0 0 1px rgba(0,0,0,0.5);
  background: rgba(76,175,80, 1);
*/
width: 0px;
background: transparent;
}





#ListEmptyStateHolder {
       display: none;
       position: absolute;
       top: 0;
       left: 0;
       right: 0;
       bottom: 0;
       /* background: rgba(248, 248, 248, .90); */


       background: rgb(255,255,255); /*Original */

       /* background: rgb(33,33,33); */

       z-index: 2;
}

#ListEmptyState {
       position: absolute;
       top: 50%;
       left: 50%;
       margin-top: -30px;
       margin-left: -100px;
       line-height: 30px;
       width: 200px;
       font-size: 20px;
       text-align: center;
}

.InfoBoxClass {
       border: 1px solid rgba(55,55,55, 0.69);
       border-radius: .3125em;
       text-align: center;
       font-size: 14px;
       font-weight: bold;
       padding-right: 3px;
       padding-left: 3px;
       width: auto;
       color: black;
       background: white;
}

.InfoBoxClass div {
       padding: 0;
       margin: 0;
       width: 100%;
}

.InfoBoxClass div:hover {
       cursor: pointer;
}

.InfoBoxClassTwo {
       border: 1px solid rgba(55,55,55, 0.69);
       /* border: none; */
       border-radius: .3125em;
       text-align: center;
       font-size: 14px;
       font-weight: bold;
       padding-right: 3px;
       padding-left: 3px;
       width: auto;
       color: black;
       background: white;
       /* background: transparent; */
}

.InfoBoxClassTwo div {
       padding: 0;
       margin: 0;
       width: 100%;
}

.InfoBoxClassTwo div:hover {
       cursor: pointer;
}

#Google-Map {
/*       visibility: hidden; */
display: none;
       position: absolute;
       top: 0;
/*        top: 135px; */
       right: 0;
       left: 0;
       /* bottom: 45px; /* make 0px */
       /* bottom: 104px; /* make 0px */
       bottom: 0; /* make 0px */
       padding: 0;
       margin: 0;
       border: none;

       -webkit-transition: all .3s ease-in;
       -moz-transition: all .3s ease-in;
       -o-transition: all .3s ease-in;
       transition: all .3s ease-in;

       -webkit-transition: all .1s ease-out;
       -moz-transition: all .1s ease-out;
       -o-transition: all .1s ease-out;
       transition: all .1s ease-out;
}

#High-Charts {
       visibility: hidden;
       position: absolute;
       top: 47px;
       right: 0;
       left: 0;
       bottom: 90px;
       padding: 0; 
       margin: 0;
       border: none;
       -webkit-overflow-scrolling: touch;
       /* background-color: orange; */
       -webkit-transition: all .3s ease-in;
       -moz-transition: all .3s ease-in;
       -o-transition: all .3s ease-in;
       transition: all .3s ease-in;

       -webkit-transition: all .1s ease-out;
       -moz-transition: all .1s ease-out;
       -o-transition: all .1s ease-out;
       transition: all .1s ease-out;
}

#DWMobileListView {
       /* visibility: hidden; */
       display: none;
       position: absolute;
       top: 0;
       right: 0;
       left: 0;
       bottom: 0;
       /* padding: 0 0 0 0; */
       /* padding: 45px 0 45px 0; */
       padding: 0;
       /* padding: 47px 0 94px 0; */
       /* margin: 0; */
       margin: 53px 0 104px 0;
       border: none;
       /* -webkit-animation: fadeInUpBig 1s; */
       /* animation: fadeInUpBig 1s; */
       overflow: hidden;
       overflow-y: scroll;
       -webkit-overflow-scrolling: touch;
}

#DWMobileListView li {
       margin: 0;
       padding: 0;
       color: rgb(0, 0, 0) !important; 
       border: none;
       border-bottom: 1px solid rgb(221, 221, 221);
       height: 69px;
       line-height: 69px;
}

#DWMobileListView li:first-child {
       border-top: none;
}

#DWMobileListView li:last-child {
       /* border-bottom: none; */
}

#DWMobileListView li:hover {
       cursor: pointer;
}

#DWMobileOverview {
       /* visibility: hidden; */
       display: none;
       position: absolute;
       top: 0;
       right: 0;
       left: 0;
       bottom: 0;
       /* padding: 0 0 0 0; */
       /* padding: 45px 0 45px 0; */
       padding: 0;
       /* padding: 47px 0 94px 0; */
       /* margin: 0; */
       margin: 53px 0 104px 0;
       border: none;
       /*  -webkit-animation: fadeInUpBig 1s; */
       /*  animation: fadeInUpBig 1s; */
       overflow: hidden;
       overflow-y: scroll;
       -webkit-overflow-scrolling: touch;
}

#DWMobileOverview li {
       border: none;
       border-collapse: collapse;
       margin: 0;
       padding: 0;
       color: rgb(0, 0, 0) !important; 
       /* color: rgb(255, 255, 255) !important; */
       /* color: rgb(255, 255, 255) !important; */ /* If using them B */
       /* background: transparent !important; */
       border: 1px solid rgb(221, 221, 221);
       border-left: none;
       border-right: none;
       border-top: none;
       /* border-radius: .3125em; */
       height: 69px;
       line-height: 40px;
}

#DWMobileOverview li:first-child {
       border-top: none;
}

#DWMobileOverview li:last-child {
       /* border-bottom: none; */
}

#DWMobileOverview li:hover {
       cursor: pointer;
}

#DWMobileOverview  .overview {
       height: auto;
       padding-top: 14px;
       padding-bottom: 14px;
       background-color: transparent;
       text-align: center;
}

#DWMobileOverview  .overview .overviewNumReported {
       font-size: 12px !important;
       margin: 0 !important;
       padding: 0 !important;
       color: rgba(0, 0, 0, .5) !important;
}

#DWMobileOverview  .overview progress {
       width: 90% !important;
}

.overviewHeader {
       position: absolute;
       top: 0;
       left: 0;
       right: 0;
       height: 45px;
       border-bottom: 1px solid rgb(221, 221, 221);
       font-size: 16px;
       font-weight: bold;
       text-align: center;
       line-height: 45px;
       /* background: rgba(248, 248, 248, .95); */
       background: rgb(248, 248, 248);
}

#DWMobileOverview progress {
       left: 50%;
       width: 326px !important;
}

/*
#GroupsCount {

}

.GroupsCountClass {
    -webkit-animation: myfade 1s .5s;
    animation: myfade 1s .5s;
}
*/



.RightNavArrow {
       position: absolute;
       top: 3px;
       right: 3px;
       width: 19px;
       line-height: 23px;
       font-size: 20px !important;
       color: rgba(0, 0, 0, .50) !important;
       /* background: red; */
}

.Controller24hStatus {
       position: absolute;
       top: 3px;
       left: 5px;
       width: 19px;
       line-height: 20px;
       font-size: 14px !important;
       /* background: rgb(76,175,80); */
}

.ControllerOver24hStatus {
       position: absolute;
       top: 3px;
       left: 3px;
       width: 20px;
       line-height: 20px;
       /* background: rgba(164,164,164, .81); */
}

.Sensor24hStatus {
       position: absolute;
       top: 0;
       left: 0;
       bottom: 0;
       width: 4px;
       background: rgb(76,175,80);
       border-radius: none;
       border-top-left-radius: .3125em;
       border-bottom-left-radius: .3125em;
}

.SensorOver24hStatus {
       position: absolute;
       top: 0;
       left: 0;
       bottom: 0;
       width: 4px;
       background: rgba(164,164,164, .81);
       border-radius: none;
       border-top-left-radius: .3125em;
       border-bottom-left-radius: .3125em;
}

/* Used For HELP Start */

.SigLevelIcon7 {
       color: rgb(255,87,34) !important;
       padding: 7px;
}

.SigLevelIcon6 {
       color: rgb(255,193,7) !important;
       padding: 7px;
}

.SigLevelIcon5 {
       color: rgb(76,175,80) !important;
       padding: 7px;
}

.SigLevelIcon4 {
       color: rgb(33,150,243) !important;
       padding: 7px;
}

.SigLevelIcon3 {
       color: rgb(63,81,181) !important;
       padding: 7px;
}

.SigLevelIcon2 {
       color: rgb(156,39,176) !important;
       padding: 7px;
}

.SigLevelIcon1 {
       color: rgb(200,53,115) !important;
       padding: 7px;
}

.SigLevelIcon0 {
       color: rgb(142, 142, 142) !important;
       padding: 7px;
}

.AlarmIcon {
       color: rgb(244,67,54) !important;
       padding: 7px;
}

.NavigationIcons {
       color: rgb(76,175,80) !important;
       padding: 7px;
}

.NavigationIconsAlt {
       color: rgba(55,55,55,.25) !important;
       padding: 7px;
}





/* Used For HELP End */

.StatsDivider {
       /* color: rgba(55,55,55, .69) !important; */
       text-align: center !important;
       line-height: 30px !important;
       height: 30px !important;
}

.Level7IconOn {
       color: rgb(255,87,34) !important;
}

.Level7IconOff {
       color: transparent !important;
}

.SigLevel7 { /* ORANGE */
       color: rgb(255,87,34) !important;
       border-color: rgb(255,87,34) !important;
       /* border-color: rgb(221, 221, 221) !important; */
       background: transparent !important;
}

.SigLevel7BGCF { /* ORANGE */
       color: rgb(255,87,34) !important;
       border-color: rgb(255,87,34) !important;
       background: rgba(255,87,34, 0.25) !important;
}

.Level6IconOn {
       color: rgb(255,193,7) !important;
}

.Level6IconOff {
       color: transparent !important;
}

.SigLevel6 { /* YELLOW */
       color: rgb(255,193,7) !important;
       border-color: rgb(255,193,7) !important;
       /* border-color: rgb(221, 221, 221) !important; */
       background: transparent !important;
}

.SigLevel6BGCF { /* YELLOW */
       color: rgb(255,193,7) !important;
       border-color: rgb(255,193,7) !important;
       background: rgba(255,193,7, 0.25) !important;
}

.Level5IconOn {
       color: rgb(76,175,80) !important;
}

.Level5IconOff {
       color: transparent !important;
}

.SigLevel5 { /* GREEN */
       color: rgb(76,175,80) !important;
       border-color: rgb(76,175,80) !important;
       /* border-color: rgb(221, 221, 221) !important; */
       background: transparent !important;
}

.SigLevel5BGCF { /* GREEN */
       color: rgb(76,175,80) !important;
       border-color: rgb(76,175,80) !important;
       background: rgba(76,175,80, 0.25) !important;
}

.Level4IconOn {
       color: rgb(33,150,243) !important;
}

.Level4IconOff {
       color: transparent !important;
}

.SigLevel4 { /* BLUE */
       color: rgb(33,150,243) !important;
       border-color: rgb(33,150,243) !important;
       /* border-color: rgb(221, 221, 221) !important; */
       background: transparent !important;
}

.SigLevel4BGCF { /* BLUE */
       color: rgb(33,150,243) !important;
       border-color: rgb(33,150,243) !important;
       background: rgba(33,150,243, 0.25) !important;
}

.Level3IconOn {
       color: rgb(63,81,181) !important;
}

.Level3IconOff {
       color: transparent !important;
}

.SigLevel3 { /* INDIGO */
       color: rgb(63,81,181) !important;
       border-color: rgb(63,81,181) !important;
       /* border-color: rgb(221, 221, 221) !important; */
       background: transparent !important;
}

.SigLevel3BGCF { /* INDIGO */
       color: rgb(63,81,181) !important;
       border-color: rgb(63,81,181) !important;
       background: rgba(63,81,181, 0.25) !important;
}

.Level2IconOn {
       color: rgb(156,39,176) !important;
}

.Level2IconOff {
       color: transparent !important;
}

.SigLevel2 { /* PURPLE */
       color: rgb(156,39,176) !important;
       border-color: rgb(156,39,176) !important;
       /* border-color: rgb(221, 221, 221) !important; */
       background: transparent !important;
}

.SigLevel2BGCF { /* PURPLE */
       color: rgb(156,39,176) !important;
       border-color: rgb(156,39,176) !important;
       background: rgba(156,39,176, 0.25) !important;
}

.Level1IconOn {
       color: rgb(200,53,115) !important;
}

.Level1IconOff {
       color: transparent !important;
}

.SigLevel1 { /* MAGENTA */
       color: rgb(200,53,115) !important;
       border-color: rgb(200,53,115) !important;
       /* border-color: rgb(221, 221, 221) !important; */
       background: transparent !important;
}

.SigLevel1BGCF { /* MAGENTA */
       color: rgb(200,53,115) !important;
       border-color: rgb(200,53,115) !important;
       background: rgba(200,53,115, 0.25) !important;
}

.SigLevel0 {
       /* color: rgba(55,55,55, .69) !important; */
       color: rgb(142, 142, 142) !important;
       border-color: rgb(221, 221, 221) !important;
       background: transparent !important;
}

.AlarmIconOn {
       color: rgb(244,67,54) !important;
}

.AlarmIconOff {
       color: transparent !important;
}

.Alarm { /* RED */
       color: rgb(244,67,54) !important;
       border-color: rgb(244,67,54) !important;
       /* border-color: rgb(221, 221, 221) !important; */
       background: transparent !important;
}

.AlarmBGCF { /* RED */
       color: rgb(244,67,54) !important;
       border-color: rgb(244,67,54) !important;
       background: rgba(244,67,54, 0.25) !important;
}

.MaintenanceIconOn {
       color: rgb(255,87,34) !important;
}

.MaintenanceIconOff {
       color: transparent !important;
}

.Maintenance { /* ORANGE */
       color: rgb(255,87,34) !important;
       border-color: rgb(255,87,34) !important;
       background: transparent !important;
}

.MaintenanceBGCF { /* ORANGE */
       color: rgb(255,87,34) !important;
       border-color: rgb(255,87,34) !important;
       background: rgba(255,87,34, 0.25) !important;
}

.NonReportingIconOn {
       color: rgb(255,140,21) !important;
}

.NonReportingIconOff {
       color: transparent !important;
}

.NonReporting { /* ORANGE */
       color: rgb(255,140,21) !important;
       border-color: rgb(255,140,21) !important;
       background: transparent !important;
}

.NonReportingBGCF { /* ORANGE */
       color: rgb(255,140,21) !important;
       border-color: rgb(255,140,21) !important;
       background: rgba(255,140,21, 0.25) !important;
}

.mobileblue {
       color: rgb(40, 159, 242) !important;
}

.valueUP {
       color: rgb(76,175,80) !important;
}

.valueDOWN {
       color: rgb(244,67,54) !important;
}

.Red {
       color: rgb(255, 0, 0) !important;
}

.PeriodValueIconOn {
       color: rgb(40, 159, 242) !important;
}

.PeriodValueIconOff {
       color: transparent !important;
}

.ReportedValueIconOn {
       color: rgb(40, 159, 242) !important;
}

.ReportedValueIconOff {
       color: transparent !important;
}

.ZeroValueIconOn {
       color: rgba(0, 0, 0, .50) !important;
}

.ZeroValueIconOff {
       color: transparent !important;
}

.ControllerOver24hStatusListItem {
       opacity: 0.50 !important;
}

.ControllerControlIDInList {
       position: absolute;
       top: 3px;
       left: 22px;
       height: 20px;
       text-align: left;
       font-size: 16px !important;
       font-weight: bold !important;
       margin: 0 !important;
       padding: 0 !important;
       line-height: 20px;
       opacity: 100;
       /* background: red; */
       /* border: 1px solid black; */
}

.ControllerControlIDInOverview {
       position: absolute;
       top: 3px;
       left: 8px;
       height: 20px;
       text-align: left;
       font-size: 16px !important;
       font-weight: bold !important;
       margin: 0 !important;
       padding: 0 !important;
       line-height: 20px;
       opacity: 100;
       /* background: red; */
       /* border: 1px solid black; */
}

.ControllerRInListIcon {
       display: none;
       position: absolute;
       top: 24px;
       left: 12px;
       font-size: 26px !important;
       font-weight: bold !important;
       color: rgba(76,175,80, .81) !important;
}

.ControllerNameInList {
       position: absolute;
       top: 26px;
       left: 22px;
       height: 18px;
       text-align: left;
       font-weight: bold;
       font-size: 16px !important;
       white-space: nowrap; 
       min-width: 65%;
       max-width: 65%;
       overflow: hidden;
       text-overflow: ellipsis;
       opacity: 100;
       margin: 0 !important;
       padding: 0 !important;
       line-height: 18px;
       /* border: 1px solid black; */
}

.ControllerNameInOverview {
       position: absolute;
       top: 26px;
       left: 8px;
       height: 18px;
       text-align: left;
       font-weight: bold;
       font-size: 16px !important;
       white-space: nowrap; 
       min-width: 220px;
       max-width: 40%;
       overflow: hidden;
       text-overflow: ellipsis;
       opacity: 100;
       margin: 0 !important;
       padding: 0 !important;
       line-height: 18px;
       /* border: 1px solid black; */
}

.ControllerControlStatusInListOn {
       position: absolute;
       bottom: 3px;
       left: 22px;
       height: 19px;
       text-align: left;
       font-size: 14px !important;
       font-weight: bold !important;
       margin: 0 !important;
       padding: 0 !important;
       line-height: 19px;
       /* border: 1px solid black; */
}

.ControllerControlStatusInListOff {
       display: none !important;
       color: transparent !important;
       position: absolute;
       bottom: 7px;
       left: 12px;
       text-align: left;
       font-size: 14px !important;
       font-weight: bold !important;
       /* color: rgb(142, 142, 142) !important; */
       margin: 0 !important;
       padding: 0 !important;
       line-height: 14px;
}

.ControllerControlStatusInOverviewOn {
       position: absolute;
       top: 47px;
       left: 8px;
       height: 19px;
       text-align: left;
       font-size: 14px !important;
       font-weight: bold !important;
       margin: 0 !important;
       padding: 0 !important;
       line-height: 19px;
       /* border: 1px solid black; */
}

.ControllerControlStatusInOverviewOff {
       display: none !important;
       color: transparent !important;
       position: absolute;
       bottom: 7px;
       left: 8px;
       text-align: left;
       font-size: 14px !important;
       font-weight: bold !important;
       /* color: rgb(142, 142, 142) !important; */
       margin: 0 !important;
       padding: 0 !important;
       line-height: 14px;
}





#OverviewHeaderListControl1 {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    margin: 0;
    padding: 0;
    width: 48px;
    height: 45px;
    text-align: center;
    border: none;
    border-radius: 0;
    line-height: 45px;
    font-size: 30px !important;
    background: transparent !important;
    text-decoration: none !important;
    text-shadow: none !important;
    /* background-color: red !important; */
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}


#OverviewHeaderListControl2 {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    margin: 0;
    padding: 0;
    width: 48px;
    height: 45px;
    text-align: center;
    border: none;
    border-radius: 0;
    line-height: 45px;
    font-size: 30px !important;
    background: transparent !important;
    text-decoration: none !important;
    text-shadow: none !important;
    /* background-color: red !important; */
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}



#OverviewHeaderListControl3 {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    margin: 0;
    padding: 0;
    width: 48px;
    height: 45px;
    text-align: center;
    border: none;
    border-radius: 0;
    line-height: 45px;
    font-size: 30px !important;
    background: transparent !important;
    text-decoration: none !important;
    text-shadow: none !important;
    /* background-color: red !important; */
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}

#OverviewHeaderListControl4 {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    margin: 0;
    padding: 0;
    width: 48px;
    height: 45px;
    text-align: center;
    border: none;
    border-radius: 0;
    line-height: 45px;
    font-size: 30px !important;
    background: transparent !important;
    text-decoration: none !important;
    text-shadow: none !important;
    /* background-color: red !important; */
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}






#OverviewHeaderListControl5 {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    margin: 0;
    padding: 0;
    width: 48px;
    height: 45px;
    text-align: center;
    border: none;
    border-radius: 0;
    line-height: 45px;
    font-size: 30px !important;
    background: transparent !important;
    text-decoration: none !important;
    text-shadow: none !important;
    /* background-color: red !important; */
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}



#OverviewHeaderListControl6 {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    margin: 0;
    padding: 0;
    width: 48px;
    height: 45px;
    text-align: center;
    border: none;
    border-radius: 0;
    line-height: 45px;
    font-size: 30px !important;
    background: transparent !important;
    text-decoration: none !important;
    text-shadow: none !important;
    /* background-color: red !important; */
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}







#OverviewHeaderListControl7 {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    margin: 0;
    padding: 0;
    width: 48px;
    height: 45px;
    text-align: center;
    border: none;
    border-radius: 0;
    line-height: 45px;
    font-size: 30px !important;
    background: transparent !important;
    text-decoration: none !important;
    text-shadow: none !important;
    /* background-color: red !important; */
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}







#OverviewHeaderListControl8 {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    margin: 0;
    padding: 0;
    width: 48px;
    height: 45px;
    text-align: center;
    border: none;
    border-radius: 0;
    line-height: 45px;
    font-size: 30px !important;
    background: transparent !important;
    text-decoration: none !important;
    text-shadow: none !important;
    /* background-color: red !important; */
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}






#OverviewHeaderListControl9 {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    margin: 0;
    padding: 0;
    width: 48px;
    height: 45px;
    text-align: center;
    border: none;
    border-radius: 0;
    line-height: 45px;
    font-size: 30px !important;
    background: transparent !important;
    text-decoration: none !important;
    text-shadow: none !important;
    /* background-color: red !important; */
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}






#OverviewHeaderListControl10 {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    margin: 0;
    padding: 0;
    width: 48px;
    height: 45px;
    text-align: center;
    border: none;
    border-radius: 0;
    line-height: 45px;
    font-size: 30px !important;
    background: transparent !important;
    text-decoration: none !important;
    text-shadow: none !important;
    /* background-color: red !important; */
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}





#OverviewHeaderListControl11 {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    margin: 0;
    padding: 0;
    width: 48px;
    height: 45px;
    text-align: center;
    border: none;
    border-radius: 0;
    line-height: 45px;
    font-size: 30px !important;
    background: transparent !important;
    text-decoration: none !important;
    text-shadow: none !important;
    /* background-color: red !important; */
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}





#OverviewHeaderListControl12 {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    margin: 0;
    padding: 0;
    width: 48px;
    height: 45px;
    text-align: center;
    border: none;
    border-radius: 0;
    line-height: 45px;
    font-size: 30px !important;
    background: transparent !important;
    text-decoration: none !important;
    text-shadow: none !important;
    /* background-color: red !important; */
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}







#OverviewHeaderListControl13 {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    margin: 0;
    padding: 0;
    width: 48px;
    height: 45px;
    text-align: center;
    border: none;
    border-radius: 0;
    line-height: 45px;
    font-size: 30px !important;
    background: transparent !important;
    text-decoration: none !important;
    text-shadow: none !important;
    /* background-color: red !important; */
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}





#OverviewHeaderListControl14 {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    margin: 0;
    padding: 0;
    width: 48px;
    height: 45px;
    text-align: center;
    border: none;
    border-radius: 0;
    line-height: 45px;
    font-size: 30px !important;
    background: transparent !important;
    text-decoration: none !important;
    text-shadow: none !important;
    /* background-color: red !important; */
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}







#OverviewHeaderListControl15 {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    margin: 0;
    padding: 0;
    width: 48px;
    height: 45px;
    text-align: center;
    border: none;
    border-radius: 0;
    line-height: 45px;
    font-size: 30px !important;
    background: transparent !important;
    text-decoration: none !important;
    text-shadow: none !important;
    /* background-color: red !important; */
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}




#OverviewHeaderListControl16 {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    margin: 0;
    padding: 0;
    width: 48px;
    height: 45px;
    text-align: center;
    border: none;
    border-radius: 0;
    line-height: 45px;
    font-size: 30px !important;
    background: transparent !important;
    text-decoration: none !important;
    text-shadow: none !important;
    /* background-color: red !important; */
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}

#OverviewHeaderListControl17 {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    margin: 0;
    padding: 0;
    width: 48px;
    height: 45px;
    text-align: center;
    border: none;
    border-radius: 0;
    line-height: 45px;
    font-size: 30px !important;
    background: transparent !important;
    text-decoration: none !important;
    text-shadow: none !important;
    /* background-color: red !important; */
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}

#OverviewHeaderListControl18 {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    margin: 0;
    padding: 0;
    width: 48px;
    height: 45px;
    text-align: center;
    border: none;
    border-radius: 0;
    line-height: 45px;
    font-size: 30px !important;
    background: transparent !important;
    text-decoration: none !important;
    text-shadow: none !important;
    /* background-color: red !important; */
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}

#OverviewHeaderListControl19 {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    margin: 0;
    padding: 0;
    width: 48px;
    height: 45px;
    text-align: center;
    border: none;
    border-radius: 0;
    line-height: 45px;
    font-size: 30px !important;
    background: transparent !important;
    text-decoration: none !important;
    text-shadow: none !important;
    /* background-color: red !important; */
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}

#OverviewHeaderListControl20 {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    margin: 0;
    padding: 0;
    width: 48px;
    height: 45px;
    text-align: center;
    border: none;
    border-radius: 0;
    line-height: 45px;
    font-size: 30px !important;
    background: transparent !important;
    text-decoration: none !important;
    text-shadow: none !important;
    /* background-color: red !important; */
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}

#OverviewHeaderListControl21 {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    margin: 0;
    padding: 0;
    width: 48px;
    height: 45px;
    text-align: center;
    border: none;
    border-radius: 0;
    line-height: 45px;
    font-size: 30px !important;
    background: transparent !important;
    text-decoration: none !important;
    text-shadow: none !important;
    /* background-color: red !important; */
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}

#OverviewHeaderListControl22 {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    margin: 0;
    padding: 0;
    width: 48px;
    height: 45px;
    text-align: center;
    border: none;
    border-radius: 0;
    line-height: 45px;
    font-size: 30px !important;
    background: transparent !important;
    text-decoration: none !important;
    text-shadow: none !important;
    /* background-color: red !important; */
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}

#OverviewHeaderListControl23 {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    margin: 0;
    padding: 0;
    width: 48px;
    height: 45px;
    text-align: center;
    border: none;
    border-radius: 0;
    line-height: 45px;
    font-size: 30px !important;
    background: transparent !important;
    text-decoration: none !important;
    text-shadow: none !important;
    /* background-color: red !important; */
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}

#OverviewHeaderListControl24 {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    margin: 0;
    padding: 0;
    width: 48px;
    height: 45px;
    text-align: center;
    border: none;
    border-radius: 0;
    line-height: 45px;
    font-size: 30px !important;
    background: transparent !important;
    text-decoration: none !important;
    text-shadow: none !important;
    /* background-color: red !important; */
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}

#OverviewHeaderListControl25 {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    margin: 0;
    padding: 0;
    width: 48px;
    height: 45px;
    text-align: center;
    border: none;
    border-radius: 0;
    line-height: 45px;
    font-size: 30px !important;
    background: transparent !important;
    text-decoration: none !important;
    text-shadow: none !important;
    /* background-color: red !important; */
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}

#OverviewHeaderListControl26 {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    margin: 0;
    padding: 0;
    width: 48px;
    height: 45px;
    text-align: center;
    border: none;
    border-radius: 0;
    line-height: 45px;
    font-size: 30px !important;
    background: transparent !important;
    text-decoration: none !important;
    text-shadow: none !important;
    /* background-color: red !important; */
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}

#OverviewHeaderListControl27 {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    margin: 0;
    padding: 0;
    width: 48px;
    height: 45px;
    text-align: center;
    border: none;
    border-radius: 0;
    line-height: 45px;
    font-size: 30px !important;
    background: transparent !important;
    text-decoration: none !important;
    text-shadow: none !important;
    /* background-color: red !important; */
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}

#OverviewHeaderListControl28 {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    margin: 0;
    padding: 0;
    width: 48px;
    height: 45px;
    text-align: center;
    border: none;
    border-radius: 0;
    line-height: 45px;
    font-size: 30px !important;
    background: transparent !important;
    text-decoration: none !important;
    text-shadow: none !important;
    /* background-color: red !important; */
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}

#OverviewHeaderListControl29 {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    margin: 0;
    padding: 0;
    width: 48px;
    height: 45px;
    text-align: center;
    border: none;
    border-radius: 0;
    line-height: 45px;
    font-size: 30px !important;
    background: transparent !important;
    text-decoration: none !important;
    text-shadow: none !important;
    /* background-color: red !important; */
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}

#OverviewHeaderListControl30 {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    margin: 0;
    padding: 0;
    width: 48px;
    height: 45px;
    text-align: center;
    border: none;
    border-radius: 0;
    line-height: 45px;
    font-size: 30px !important;
    background: transparent !important;
    text-decoration: none !important;
    text-shadow: none !important;
    /* background-color: red !important; */
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}

#OverviewHeaderListControl31 {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    margin: 0;
    padding: 0;
    width: 48px;
    height: 45px;
    text-align: center;
    border: none;
    border-radius: 0;
    line-height: 45px;
    font-size: 30px !important;
    background: transparent !important;
    text-decoration: none !important;
    text-shadow: none !important;
    /* background-color: red !important; */
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}

#OverviewHeaderListControl32 {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    margin: 0;
    padding: 0;
    width: 48px;
    height: 45px;
    text-align: center;
    border: none;
    border-radius: 0;
    line-height: 45px;
    font-size: 30px !important;
    background: transparent !important;
    text-decoration: none !important;
    text-shadow: none !important;
    /* background-color: red !important; */
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}



.eyeInOverviewOff {
       /* display: none; */
       color: rgba(55,55,55,.25) !important;

/*       color: rgba(76,175,80, 1) !important; */
}

.eyeInOverviewOn {
       color: rgba(76,175,80, 1) !important;

/*       color: rgba(55,55,55,.25) !important; */
}







.SigIconLevel7 {
       color: rgb(255,87,34) !important;
}

.SigIconLevel6 {
       color: rgb(255,193,7) !important;
}

.SigIconLevel5 {
       color: rgb(76,175,80) !important;
}

.SigIconLevel4 {
       color: rgb(33,150,243) !important;
}

.SigIconLevel3 {
       color: rgb(63,81,181) !important;
}

.SigIconLevel2 {
       color: rgb(156,39,176) !important;
}

.SigIconLevel1 {
       color: rgb(200,53,115) !important;
}

.SigIconLevel0 {
       display: none;
       color: transparent !important;
}

.alarmInListOff {
       display: none;
       color: transparent !important;
}

.alarmInListOn {
       color: rgb(244,67,54) !important;
}

.maintenanceInListOff {
       display: none;
       color: transparent !important;
}

.maintenanceInListOn {
       color: rgb(255,87,34) !important;
}

.NonReportingInListOn {
       color: rgb(255,140,21) !important;
}

.orange {
       color: rgb(255,140,21) !important;
}

.grey {
       color: rgba(55,55,55,.25) !important;
}

.NoRain {
       color: rgba(0, 0, 0, .50) !important;
}

.RainInListOff {
       color: rgba(0, 0, 0, .50) !important;
}

.RainInListOn {
       color: rgb(40, 159, 242) !important;
}

.DataValueInList {
       position: absolute;
       top: 0;
       left: 22px;
       text-align: left;
       font-size: 26px !important;
       /* font-weight: bold !important; */
       margin: 0 !important;
       padding: 0 !important;
       line-height: 50px;










}

.DataValueInList strong {
       padding-right: 3px;
}

.DataValueInListHasRain {
       position: absolute;
       top: 0;
       left: 15px;
       text-align: left;
       font-size: 26px !important;
       /* font-weight: bold !important; */
       margin: 0 !important;
       padding: 0 !important;
       line-height: 50px;








}

.DataValueInListHasRain strong {
       padding-right: 3px;
}



.DataValueInListNoRain {
       position: absolute;
       top: 0;
       left: 15px;
       text-align: left;
       font-size: 26px !important;
       /* font-weight: bold !important; */
       margin: 0 !important;
       padding: 0 !important;
       line-height: 50px;
       color: rgba(0, 0, 0, .50) !important;










}

.DataValueInListNoRain strong {
       padding-right: 3px;

}

.ControllerEventTime {











              position: absolute;
              top: 3px;
              right: 22px;
              text-align: right;
              font-size: 20px !important;
       font-weight: bold !important;
              padding: 0 !important;
              margin: 0 !important;
              height: 23px;
              line-height: 23px;



/*
background: red;
*/


}

.ControllerEventTime strong {

}




/* NEW */



.GlanceAvgStartTime {
/*
       position: absolute;
       top: 3px;
       right: 22px;
       height: 19px;
       text-align: right;
       font-size: 14px !important;
       font-weight: bold !important;
       margin: 0 !important;
       padding: 0 !important;
       line-height: 19px;
*/
/*old */



              position: absolute;
              top: 3px;
              right: 22px;
              text-align: right;
              font-size: 20px !important;
              font-weight: bold !important;
              padding: 0 !important;
              margin: 0 !important;
              height: 23px;
              line-height: 23px;



/*
background: red;
*/

}







.GlanceAvgEndTime {
/*
       position: absolute;
       bottom: 3px;
       right: 22px;
       height: 19px;
       text-align: right;
       font-size: 14px !important;
       font-weight: bold !important;
       margin: 0 !important;
       padding: 0 !important;
       line-height: 19px;
*/
/* old */



              position: absolute;
              bottom: 3px;
              right: 22px;
              text-align: right;
              font-size: 20px !important;
              font-weight: bold !important;
              padding: 0 !important;
              margin: 0 !important;
              height: 23px;
              line-height: 23px;



/*
background: red;
*/

}



/* NEW */



















/* NEW */

.tabularliStatusInfo {
       position: absolute;
       bottom: 3px;
       left: 22px;
       height: 19px;
       text-align: right;
       font-size: 14px !important;
       /* font-weight: bold !important; */
       margin: 0 !important;
       padding: 0 !important;
       line-height: 19px;
}

/* NEW */

.DataDateInList {




       position: absolute;
       bottom: 3px;
       right: 22px;
       height: 19px;
       text-align: right;
       font-size: 14px !important;
       font-weight: bold !important;
       margin: 0 !important;
       padding: 0 !important;
       line-height: 19px;


/*
background: red;
*/




}

.DataDateInList strong {

}




.ControllerEventTimeBack {






       position: absolute;
       top: 28px;
       right: 22px;
       height: 17px;
       text-align: right;
       /* font-weight: bold; */
       font-size: 16px !important;


       margin: 0 !important;
       padding: 0 !important;
       line-height: 17px;


/*
background: red;
*/



}

.ControllerEventTimeBack strong {

}





.ARainDataTimeInList {
       position: absolute;
       bottom: 0;
       right: 12px;
       text-align: right;
       line-height: 48px;
       /* color: rgb(142, 142, 142); */
       font-size: 20px !important;
       margin: 0 !important;
       padding: 0 !important;
}

.ARainDataTimeInList strong {
		padding-left: 7px;
		padding-right: 7px;
}

.ControllerTime {








       position: absolute;
       bottom: 3px;
       right: 22px;
       height: 19px;
       text-align: right;
       font-size: 14px !important;
       font-weight: bold !important;
       margin: 0 !important;
       padding: 0 !important;
       line-height: 19px;


/*
background: red;
*/







}
.ControllerTime i {
		/* color: rgb(199, 199, 204) !important; */
		/* color: rgb(55, 55, 55) !important; */
}

.ControllerTimeBack {












       position: absolute;
       top: 28px;
       right: 22px;
       height: 17px;
       text-align: right;
       /* font-weight: bold; */
       font-size: 16px !important;


       margin: 0 !important;
       padding: 0 !important;
       line-height: 17px;


/*
background: red;
*/
















}

.ControllerTimeBack strong {

}



.ControllerOutputStatus {





              position: absolute;
              top: 3px;
              right: 22px;
              text-align: right;
              font-size: 20px !important;

              padding: 0 !important;
              margin: 0 !important;
              height: 23px;
              line-height: 23px;



/*
background: red;
*/











}

.ControllerOutputStatus strong {
		font-weight: bold !important;
		padding-left: 7px;
}

.ControllerEventOutputStatus {
		position: absolute;
		bottom: 0;
		right: 18px;
		text-align: right;
		font-size: 12px !important;
		font-weight: bold !important;
		padding: 3px 10px;
		margin: 0;
		color: rgba(76,175,80, .81);
		border: 1px solid rgba(188, 188, 188, .5);
		background-color: rgba(255,255,255,1);
		-webkit-border-radius: 7px;
		-moz-border-radius: 7px;
		border-radius: 7px;
		-webkit-box-shadow: inset 0px 1px 1px rgba(188, 188, 188, 0.15);
		-moz-box-shadow: inset 0px 1px 1px rgba(188, 188, 188, 0.15);
		box-shadow: inset 0px 1px 1px rgba(188, 188, 188, 0.15);
		overflow: none;
}

.ControllerOutputStatus2 {
		position: absolute;
		top: 35px;
		left: 15px;
		text-align: left;
		font-size: 12px !important;
		font-weight: bold !important;
		padding: 3px 10px;
		color: rgba(76,175,80, .81);
		border: 1px solid rgba(188, 188, 188, .5);
		background-color: rgba(255,255,255,1);
		-webkit-border-radius: 7px;
		-moz-border-radius: 7px;
		border-radius: 7px;
		-webkit-box-shadow: inset 0px 1px 1px rgba(188, 188, 188, 0.15);
		-moz-box-shadow: inset 0px 1px 1px rgba(188, 188, 188, 0.15);
		box-shadow: inset 0px 1px 1px rgba(188, 188, 188, 0.15);
		overflow: none;
		z-index: 100;
}

#SensorIDandNameHolder {
		margin: 0;
		padding: 0;
		font-size: 16px;
		line-height: 50px;
		height: 50px;
		color: rgb(71,71,71);
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
}

#WebCamIDandNameHolder {
		margin: 0;
		padding: 0;
		font-size: 16px;
		line-height: 50px;
		height: 50px;
		color: rgb(71,71,71);
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
}




#WebCamImageHolderDiv {
position: absolute;
top: 0;

right: 0;
bottom: 0;
left: 0;

padding: 0; 
margin: 0;
border: none;
/* background-color: red !important; */

overflow: hidden;
overflow-y: scroll;
-webkit-overflow-scrolling: touch;


}


#WebCamImageHolder {
position: relative;
top: 0;
/*
right: 0;
bottom: 0;
left: 0;
*/
width: 100%;
height: auto;

padding: 90px 0 43px 0; 
margin: 0;
border: none;

}






#theWebCamImage {

/*
    max-width: 100%;
    height: auto;
*/


   width: 100%;
   height: 100%;

border: none;

}



#controller-events-list {
visibility: hidden;
position: absolute;
top: 0;
right: 0;
left: 0;
bottom: 0;
/* padding: 0 0 0 0; */
padding: 53px 0 104px 0; 
margin: 0;
border: none;
/*  -webkit-animation: fadeInUpBig 1s; */
/*  animation: fadeInUpBig 1s; */
overflow: hidden;
overflow-y: scroll;
-webkit-overflow-scrolling: touch;
}

#controller-events-list li {
margin: 0;
padding: 0;
border: none;
border-bottom: 1px solid rgb(221, 221, 221);
height: 69px;
color: rgb(0,0,0) !important;
line-height: 69px;
}

#controller-events-list li:first-child {
border-top: none;
}

#controller-events-list li:last-child {
/* border-bottom: none; */
}








/* TESTING THIS */


#controller-events-list li:hover > p.ControllerEventTimeBack {


/* background: red !important; */


/* visibility: visible !important; */



}










#controller-events-list-Stats {
visibility: hidden;
position: absolute;
top: 0;
right: 0;
left: 0;
bottom: 0;
/* padding: 0 0 0 0; */
padding: 53px 0 90px 0; 
margin: 0;
border: none;
/*  -webkit-animation: fadeInUpBig 1s; */
/*  animation: fadeInUpBig 1s; */
overflow: hidden;
overflow-y: scroll;
-webkit-overflow-scrolling: touch;
}

#controller-events-list-Stats li {
margin: 0;
padding: 0;
border: none;
border-bottom: 1px solid rgb(221, 221, 221);
height: 69px;
color: rgb(0,0,0) !important;
line-height: 69px;
}

#controller-events-list-Stats li:first-child {
border-top: none;
}

#controller-events-list-Stats li:last-child {
/* border-bottom: none; */
}






.GlanceDynamicP {

text-align: center;
margin: 0px 12px;

}









#contacts-table3 {
       position: absolute;
       top: 89px;
       right: 0;
       left: 0;
       bottom: 0;
       /* padding: 0 0 0 0; */
        padding: 0; 

       margin: 0;
       border: none;

       /*  -webkit-animation: fadeInUpBig 1s; */
       /*  animation: fadeInUpBig 1s; */



       -webkit-overflow-scrolling: touch;



}

#contacts-table3 a {
       padding-top: 11px;
       background: rgb(255,255,255);
}

#contacts-table4 {
       position: absolute;
       top: 81px;
       right: 0;
       left: 0;
       bottom: 0;
       /* padding: 0 0 0 0; */
        padding: 0; 

       margin: 0;
       border: none;

       /*  -webkit-animation: fadeInUpBig 1s; */
       /*  animation: fadeInUpBig 1s; */

       overflow: hidden;
       overflow-y: scroll;

       -webkit-overflow-scrolling: touch;
}








#contacts-table5 {
       position: absolute;
       top: 81px;
       right: 0;
       left: 0;
       bottom: 0;
       /* padding: 0 0 0 0; */
        padding: 0; 

       margin: 0;
       border: none;

       /*  -webkit-animation: fadeInUpBig 1s; */
       /*  animation: fadeInUpBig 1s; */

       overflow: hidden;
       overflow-y: scroll;

       -webkit-overflow-scrolling: touch;
}





#contacts-table6 {
       position: absolute;
       top: 81px;
       right: 0;
       left: 0;
       bottom: 0;
       /* padding: 0 0 0 0; */
        padding: 0; 

       margin: 0;
       border: none;

       /*  -webkit-animation: fadeInUpBig 1s; */
       /*  animation: fadeInUpBig 1s; */

       overflow: hidden;
       overflow-y: scroll;

       -webkit-overflow-scrolling: touch;
}

#HelpHolder {
position: absolute;
top: 81px;
right: 0;
left: 0;
}

#contacts-table7001 {
       position: relative;

       /* padding: 0 0 0 0; */
        padding: 0; 

       margin: 0;
       margin-top: 85px;
       border: none;
}

#contacts-table7001 a {
       padding-top: 11px;
       background: rgb(255,255,255);
}








#contacts-table700177777 {

       position: relative;

       /* padding: 0 0 0 0; */
        padding: 0; 

       margin: 0;
       margin-top: 40px;
       border: none;
}

#contacts-table700177777 a {
       padding-top: 11px;
       background: rgb(255,255,255);
}






#contacts-table7001777777 {

       position: relative;

       /* padding: 0 0 0 0; */
        padding: 0; 

       margin: 0;
       margin-top: 40px;
       border: none;
}

#contacts-table7001777777 a {
       padding-top: 11px;
       background: rgb(255,255,255);
}



















#contacts-table70011 {
display: none;
       position: relative;

       /* padding: 0 0 0 0; */
        padding: 0; 

       margin: 0;
       margin-top: 40px;
       border: none;
}

#contacts-table70011 a {
       padding-top: 11px;
       background: rgb(255,255,255);
}




#contacts-table700111 {
display: none;
       position: relative;

       /* padding: 0 0 0 0; */
        padding: 0; 

       margin: 0;
       margin-top: 40px;
       border: none;
}

#contacts-table700111 a {
       padding-top: 11px;
       background: rgb(255,255,255);
}





#contacts-table7002 {
       position: relative;

       /* padding: 0 0 0 0; */
        padding: 0; 

       margin: 0;
       margin-top: 40px;
       border: none;
}

#contacts-table7002 a {
       padding-top: 11px;
       background: rgb(255,255,255);
}











#contacts-table7002555 {
       position: relative;

       /* padding: 0 0 0 0; */
        padding: 0; 

       margin: 0;
       margin-top: 40px;
       border: none;
}

#contacts-table7002555 a {
       padding-top: 11px;
       background: rgb(255,255,255);
}















#sendFeedbackButton {
       position: relative;

       /* padding: 0 0 0 0; */
        padding: 0; 

       margin: 0;
       margin-top: 40px;
       border: none;
}

#sendFeedbackButton a {
       padding-top: 11px;
       background: rgb(255,255,255);
}














#contacts-table7004 {
       position: relative;

       /* padding: 0 0 0 0; */
        padding: 0; 

       margin: 0;
       margin-top: 40px;
       border: none;
}

#contacts-table7004 a {
       padding-top: 11px;
       background: rgb(255,255,255);
}


#contacts-table7005 {
       position: relative;

       /* padding: 0 0 0 0; */
        padding: 0; 

       margin: 0;
       margin-top: 40px;
       border: none;
}

#contacts-table7005 a {
       padding-top: 11px;
       background: rgb(255,255,255);
}

#contacts-table7006 {
       position: relative;

       /* padding: 0 0 0 0; */
        padding: 0; 

       margin: 0;
       margin-top: 40px;
       border: none;
}

#contacts-table7006 a {
       padding-top: 11px;
       background: rgb(255,255,255);
}





/*

#contacts-twitter-support {
position: absolute;
top: 0;
right: 12px;
font-size: 20px;
text-align: right;
line-height: 44px;
padding: 0;
margin: 0;
}

#contacts-twitter-support:hover {
color: rgb(76,175,80);
cursor: pointer;
}

*/


#DWMobileIconInAbout {

width: 135px;
height: 135px;

padding: 0;
margin: 0;
margin-top: 113px;
/* margin-bottom: 10px; */
margin-bottom: 79px;

border-radius: 20px;

line-height: 135px;
text-align: center;
font-size: 90px;

color: rgba(255,255,255,.96);

/*
-webkit-box-shadow: 0px 3px 7px 0px rgba(0,0,0,0.4);
-moz-box-shadow: 0px 3px 7px 0px rgba(0,0,0,0.4);
box-shadow: 0px 3px 7px 0px rgba(0,0,0,0.4);
*/

-webkit-box-shadow: 0px 1px 7px 0px rgba(0,0,0,0.4);
-moz-box-shadow: 0px 1px 7px 0px rgba(0,0,0,0.4);
box-shadow: 0px 1px 7px 0px rgba(0,0,0,0.4);

background-color: rgb(76,175,80) !important;

/*
  background: url("/../images/newIcon.png") no-repeat center; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
*/

}

#DWMobileIconInAboutText {
		font-size: 40px;
		margin-bottom: 69px;
}

#DWMobileIconInAboutText2 {
		color: rgb(40,159,242) !important;
		font-size: 40px;
		margin-bottom: 69px;
}

#contacts-table8 {
		position: relative;
		/* padding: 0 0 0 0; */
        padding: 0;
		margin: 0;
		border: none;
		/* -webkit-animation: fadeInUpBig 1s; */
		/* animation: fadeInUpBig 1s; */
}

#contacts-table8 a {
		padding-top: 11px;
		background: rgb(255,255,255);
}

#contacts-table8 p {
		font-size: 11px;
}

#contacts-table81a {
		position: relative;
		/* padding: 0 0 0 0; */
        padding: 0;
		margin: 0;
		margin-top: 40px;
		border: none;
		/*  -webkit-animation: fadeInUpBig 1s; */
		/*  animation: fadeInUpBig 1s; */
}

#contacts-table81a a {
		padding-top: 11px;
		background: rgb(255,255,255);
}

#contacts-table81 {
		display: none;
		position: relative;
		/* padding: 0 0 0 0; */
        padding: 0;
		margin: 0;
		margin-top: 40px;
		border: none;
		/*  -webkit-animation: fadeInUpBig 1s; */
		/*  animation: fadeInUpBig 1s; */
}

#contacts-table81 a {
		padding-top: 11px;
		background: rgb(255,255,255);
}

#contacts-table88 {
		visibility: visible;
		position: relative;
		/* padding: 0 0 0 0; */
		padding: 0;
		margin: 0;
		margin-top: 40px;
		border: none;
		/* -webkit-animation: fadeInUpBig 1s; */
		/* animation: fadeInUpBig 1s; */
}

#contacts-table88 a {
		padding-top: 11px;
		background: rgb(255,255,255);
}

#contacts-table89 {
		visibility: visible;
		position: relative;
		/* padding: 0 0 0 0; */
        padding: 0;
		margin: 0;
		margin-top: 40px;
		border: none;
		/* -webkit-animation: fadeInUpBig 1s; */
		/* animation: fadeInUpBig 1s; */
}

#contacts-table89 a {
       padding-top: 11px;
       background: rgb(255,255,255);
}

#contacts-table888 {
		display: none;
		/* visibility: hidden; */
		position: relative;
		/* padding: 0 0 0 0; */
        padding: 0;
		margin: 0;
		margin-top: 40px;
		border: none;
		/* -webkit-animation: fadeInUpBig 1s; */
		/* animation: fadeInUpBig 1s; */
}

#contacts-table888 a {
		padding-top: 11px;
		background: rgb(255,255,255);
}

#contacts-table8888 {
		visibility: visible;
		/* padding: 0 0 0 0; */
		padding: 0; 
		margin: 0;
		margin-top: 40px;
		margin-bottom: 100px;
		border: none;
		/* -webkit-animation: fadeInUpBig 1s; */
		/* animation: fadeInUpBig 1s; */
}

#contacts-table8888 a {
		padding-top: 11px;
		background: rgb(255,255,255);
}

#RainfallOptions {

}

#RainfallOptions .ui-panel-inner {
		position: absolute !important;
		top: 0 !important;
		left: 0 !important;
		right: 0 !important;
		bottom: 0 !important;
		margin: 0 !important;
}

#TabularChartPeriodValuesNumberAndUnit {
       visibility: hidden;
}

#five .ui-collapsible-heading {
		padding: 0 0 0 15px;
}

.ui-collapsible-content {
		background: transparent !important;
		margin: 0 !important;
}

.ui-collapsible-content p {
		margin: 0;
		padding: 0 0 0 15px;
}

#ControllerCommandOption {
		min-height: 51px !important;
		background: transparent;
}

#ControllerCommandOutputOptions {

}

#CategoryTypesMainPanel {background: rgba(248, 248, 248, 1) !important;}

#CategoryTypesMainPanel .ui-panel-inner {padding: 0 !important;}

#SensorSortPanel {background: rgba(248, 248, 248, 1) !important;}

#SensorFilterPanel {background: rgba(248, 248, 248, 1) !important;}



#SensorFilterPanel input[type="checkbox"] {
              opacity: 0;
}

#SensorFilterPanel label {
              border-left: none !important;
              border-right: none !important;
              border-top: none !important;
              border-bottom: 1px solid #dddddd !important;
}






#DWControlMapSettingsPanel {background: rgba(248, 248, 248, 1) !important;}

#DWControlMapSettingsPanel .ui-panel-inner { margin-left: 10px !important; margin-right: 10px !important;}







/* NEW STUFF Oct 15th 2020 */

#IsohyetalLinesPeriodTypesList {
              /* display: none; */
              position: relative;
              top: 0;
              left: 0;
              right: 0;
}

#IsohyetalLinesPeriodTypesList p {
              text-align: center;
}

#IsohyetalLinesPeriodTypesList label {

}

#IsohyetalLinesPeriodTypesList label:first-child {
              border-top: 1px solid #dddddd !important;
}

#IsohyetalLinesPeriodTypesList label:last-child {
              border-bottom: 1px solid #dddddd !important;
}

#IsohyetalLinesPeriodTypesList input[type="radio"] {
              opacity: 0;
}






/* END NEW STUFF */













#RainfallOptions {background: rgba(248, 248, 248, 1) !important;}

#TabularOptions {background: rgba(248, 248, 248, 1) !important;}

#MainCatHolderDiv {
		position: absolute !important;
		top: 0 !important;
		left: 0 !important;
		right: 0 !important;
		bottom: 0 !important;
		margin: 0 !important;
		/* margin-top: 44px !important; */
		padding-top: 0 !important;
		overflow-x: hidden !important; /* Hide horizontal scrollbar */
		overflow-y: scroll !important; /* Add vertical scrollbar */
		z-index: -1;
}

#MainMapSettingsHolderDiv {
		position: absolute !important;
		top: 0 !important;
		left: 0 !important;
		right: 0 !important;
		bottom: 0 !important;
		margin: 0 !important;
		/* margin-top: 44px !important; */
		padding-top: 0 !important;
		padding-left: 14px;
		padding-right: 14px;
		overflow-x: hidden !important; /* Hide horizontal scrollbar */
		overflow-y: scroll !important; /* Add vertical scrollbar */
		z-index: -1;
}




#MainMapSettingsHolderDiv input[type="checkbox"] {
              opacity: 0;
}





#MainMapSettingsHolderDiv label {

/*
              border-left: none !important;
              border-right: none !important;
              border-top: none !important;
              border-bottom: 1px solid #dddddd !important;
*/


/*
border: 1px solid #dddddd !important;
*/

}










#CategoryTypesList {
		position: relative;
		top: 0;
		left: 0;
		right: 0;
		border-radius: 0;
		border: none !important;
		padding: 0;
		margin: 0;
}

#CategoryTypesList label {
		border-left: none !important;
		border-right: none !important;
		border-top: none !important;
		border-bottom: 1px solid #dddddd !important;
}

#CategoryTypesList input[type="checkbox"] {
		opacity: 0;
}

#RainfallTypesList {
		display: none;
		position: relative;
		top: 0;
		left: 0;
		right: 0;
		border-radius: 0;
		border: none !important;
}

#RainfallTypesList p {
		text-align: center;
}

#RainfallTypesList label {
		border-left: none !important;
		border-right: none !important;
		border-top: 1px solid #dddddd !important;
}

#RainfallTypesList label:last-child {
		border-top: 1px solid #dddddd !important;
		border-bottom: 1px solid #dddddd !important;
}


#RainfallTypesList input[type="radio"] {
		opacity: 0;
}

#RainfallPeriodTypesList {
		display: none;
		position: relative;
		top: 0;
		left: 0;
		right: 0;
		border-radius: 0;
		border: none !important;
}

#RainfallPeriodTypesList p {
		text-align: center;
}

#RainfallPeriodTypesList label {
		border-left: none !important;
		border-right: none !important;
		border-top: 1px solid #dddddd !important;
}

#RainfallPeriodTypesList label:last-child {
		border-top: 1px solid #dddddd !important;
		border-bottom: 1px solid #dddddd !important;
}

#RainfallPeriodTypesList input[type="radio"] {
		opacity: 0;
}

#ZeroRainfallValuesTypesList {
		display: none;
		position: relative;
		top: 0;
		left: 0;
		right: 0;
		border-radius: 0;
		border: none !important;
}

#ZeroRainfallValuesTypesList p {
		text-align: center;
}

#ZeroRainfallValuesTypesList label {
		border-left: none !important;
		border-right: none !important;
		border-top: 1px solid #dddddd !important;
		border-bottom: 1px solid #dddddd !important;
}

#ZeroRainfallValuesTypesList input[type="checkbox"] {
		opacity: 0;
}

#MainFilterTypesList {
		/* display: none; */
		position: relative;
		top: 0;
		left: 0;
		right: 0;
		border-radius: 0;
		border: none !important;
}

#MainFilterTypesList p {
		text-align: center;
}

#MainFilterTypesList label {
		border-left: none !important;
		border-right: none !important;
		border-top: 1px solid #dddddd !important;
}

#MainFilterTypesList label:last-child {
		border-top: 1px solid #dddddd !important;
		border-bottom: 1px solid #dddddd !important;
}

#MainFilterTypesList input[type="checkbox"] {
		opacity: 0;
}

#SigLevel1TypesList {
		/* display: none; */
		position: relative;
		top: 0;
		left: 0;
		right: 0;
		border-radius: 0;
		border: none !important;
}

#SigLevel1TypesList p {
		text-align: center;
}

#NonReportingTypesList label {
		border-left: none !important;
		border-right: none !important;
		border-top: 1px solid #dddddd !important;
		border-bottom: 1px solid #dddddd !important;
}

#SigLevel1TypesList input[type="checkbox"] {
		opacity: 0;
}

.CategoryTypeCountNum {
		float: right;
		color: rgba(55,55,55, .5);
}

.ControllerTimeReports {
		position: absolute;
		top: 5px;
		right: 13px;
		text-align: right;
		font-size: 14px !important;
		color: rgba(55,55,55, .69);
}

.ControllerTimeReports strong {
		color: rgba(55,55,55, .69);
}

.ControllerTimeBackReports {
		position: absolute;
		top: 35px;
		right: 13px;
		text-align: right;
		font-size: 14px !important;
		color: rgba(55,55,55, .69);
}

.ControllerTimeBackReports strong {
		color: rgba(55,55,55, .69);
}

#OutputButtonsHolder {
		display: none;
}

#OutputButtonsHolder {
		position: absolute !important;
		left: 0 !important;
		right: 0 !important;
}

#PendingActionProgressSpinner {
		visibility: hidden;
		position: fixed;
		top: 0;
		left: 0;
		margin: 0;
		padding: 0;
		cursor: pointer;
		width: 45px;
		height: 45px;
		z-index: 1000;
}

div.spinner {
		background-color: transparent;
		position: absolute;
		left: 50%;
		top: 50%;
		margin-left: -11px;
		margin-top: -11px;
		width: 22px;
		height: 22px;
		display: inline-block;
}

div.spinner div {
		/* display:none; */
		width: 12%;
		height: 26%;
		background: rgba(55,55,55, 1);
		position: absolute;
		left: 44.5%;
		top: 37%;
		opacity: 0;
		-webkit-animation: fade 1s linear infinite;
		-webkit-border-radius: 50px;
		-webkit-box-shadow: 0 0 3px rgba(0,0,0,0.2);
}

		div.spinner div.bar1 {-webkit-transform:rotate(0deg) translate(0, -142%); -webkit-animation-delay: 0s;}    
		div.spinner div.bar2 {-webkit-transform:rotate(30deg) translate(0, -142%); -webkit-animation-delay: -0.9167s;}
		div.spinner div.bar3 {-webkit-transform:rotate(60deg) translate(0, -142%); -webkit-animation-delay: -0.833s;}
		div.spinner div.bar4 {-webkit-transform:rotate(90deg) translate(0, -142%); -webkit-animation-delay: -0.75s;}
		div.spinner div.bar5 {-webkit-transform:rotate(120deg) translate(0, -142%); -webkit-animation-delay: -0.667s;}
		div.spinner div.bar6 {-webkit-transform:rotate(150deg) translate(0, -142%); -webkit-animation-delay: -0.5833s;}
		div.spinner div.bar7 {-webkit-transform:rotate(180deg) translate(0, -142%); -webkit-animation-delay: -0.5s;}
		div.spinner div.bar8 {-webkit-transform:rotate(210deg) translate(0, -142%); -webkit-animation-delay: -0.41667s;}
		div.spinner div.bar9 {-webkit-transform:rotate(240deg) translate(0, -142%); -webkit-animation-delay: -0.333s;}
		div.spinner div.bar10 {-webkit-transform:rotate(270deg) translate(0, -142%); -webkit-animation-delay: -0.25s;}
		div.spinner div.bar11 {-webkit-transform:rotate(300deg) translate(0, -142%); -webkit-animation-delay: -0.1667s;}
		div.spinner div.bar12 {-webkit-transform:rotate(330deg) translate(0, -142%); -webkit-animation-delay: -0.0833s;}

@-webkit-keyframes fade {
		from {opacity: 1;}
		to {opacity: 0.25;}
}

#PageTwoHeaderDataHolder {
		position: fixed;
		bottom: 53px;
		left: 0;
		right: 0;
		height: 50px;
		z-index: 2;
		text-align: center;
		background: rgb(248, 248, 248);
		border-top: 1px solid rgb(221, 221, 221);
}

#PageTwoHeaderData {
		margin: 0;
		padding: 0;
		font-size: 14px;
		font-weight: normal;
		line-height: 50px;
		height: 50px;
		color: rgba(55,55,55,.69);
}






#WebCamPageHeader {
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		height: 50px;
}

#WebCamPageFooter {
		position: fixed;
		bottom: 0;
		left: 0;
		right: 0;
		height: 50px;
}






#PageOneHeader {
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		height: 50px;
}

#PageOneFooter {
		position: fixed;
		bottom: 0;
		left: 0;
		right: 0;
		height: 50px;
}

#PageTwoHeader {
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		height: 50px;
}

#PageTwoFooter {
		position: fixed;
		bottom: 0;
		left: 0;
		right: 0;
		height: 50px;
}







#SettingsPageFooter {
              position: fixed;
              bottom: 0;
              left: 0;
              right: 0;
              height: 50px;
}










#ClockPageFooter {
              position: fixed;
              bottom: 0;
              left: 0;
              right: 0;
              height: 50px;
}


#DisplayPageFooter {
              position: fixed;
              bottom: 0;
              left: 0;
              right: 0;
              height: 50px;
}


#WebNotificationsPageFooter {
              position: fixed;
              bottom: 0;
              left: 0;
              right: 0;
              height: 50px;
}




#ResetUserPreferencesPageFooter {
              position: fixed;
              bottom: 0;
              left: 0;
              right: 0;
              height: 50px;
}

































#HelpPageFooter {
              position: fixed;
              bottom: 0;
              left: 0;
              right: 0;
              height: 50px;
}







#loadingspinnerbackground {
		display: none;
		position: absolute;
		top: 0;
		right: 0;
		bottom: 0;
		left: 0;
		background-color: transparent;
		z-index: 1;
}

div.loadingspinner {
		background-color: transparent;
		position: absolute;
		left: 50%;
		top: 50%;
		margin-left: -23px;
		margin-top: -23px;
		width: 46px;
		height: 46px;
		display: inline-block;
}
    
div.loadingspinner div {
		/* display:none; */
		width: 10%;
		height: 24%;
		background: rgba(55,55,55,.69);
		position: absolute;
		left: 44.5%;
		top: 37%;
		opacity: 0;
		-webkit-animation: fade 1s linear infinite;
		-webkit-border-radius: 50px;
		-webkit-box-shadow: 0 0 3px rgba(0,0,0,0.2);
}
    
		div.loadingspinner div.bar1 {-webkit-transform:rotate(0deg) translate(0, -142%); -webkit-animation-delay: 0s;}    
		div.loadingspinner div.bar2 {-webkit-transform:rotate(30deg) translate(0, -142%); -webkit-animation-delay: -0.9167s;}
		div.loadingspinner div.bar3 {-webkit-transform:rotate(60deg) translate(0, -142%); -webkit-animation-delay: -0.833s;}
		div.loadingspinner div.bar4 {-webkit-transform:rotate(90deg) translate(0, -142%); -webkit-animation-delay: -0.75s;}
		div.loadingspinner div.bar5 {-webkit-transform:rotate(120deg) translate(0, -142%); -webkit-animation-delay: -0.667s;}
		div.loadingspinner div.bar6 {-webkit-transform:rotate(150deg) translate(0, -142%); -webkit-animation-delay: -0.5833s;}
		div.loadingspinner div.bar7 {-webkit-transform:rotate(180deg) translate(0, -142%); -webkit-animation-delay: -0.5s;}
		div.loadingspinner div.bar8 {-webkit-transform:rotate(210deg) translate(0, -142%); -webkit-animation-delay: -0.41667s;}
		div.loadingspinner div.bar9 {-webkit-transform:rotate(240deg) translate(0, -142%); -webkit-animation-delay: -0.333s;}
		div.loadingspinner div.bar10 {-webkit-transform:rotate(270deg) translate(0, -142%); -webkit-animation-delay: -0.25s;}
		div.loadingspinner div.bar11 {-webkit-transform:rotate(300deg) translate(0, -142%); -webkit-animation-delay: -0.1667s;}
		div.loadingspinner div.bar12 {-webkit-transform:rotate(330deg) translate(0, -142%); -webkit-animation-delay: -0.0833s;}

@-webkit-keyframes fade {
		from {opacity: 1;}
		to {opacity: 0.25;}
}

#RCSButtonsHolder {

}

.green {
		color: rgb(76,175,80) !important;
}
















#DWMobileReferenceThree li {
              margin: 0;
              padding: 0;
              color: rgb(0, 0, 0) !important; 
              font-size: 20px;
              /* color: rgb(255, 255, 255) !important; */
              /* color: rgb(255, 255, 255) !important; */ /* If using them B */
              /* background: transparent !important; */
              border: none;
              /* border-bottom: 1px solid rgb(221, 221, 221); */
              height: 69px;
              line-height: 69px;
}

#DWMobileReferenceThree p {
              margin: 0;
              padding: 0;
              padding-left: 21px;
              font-size: 16px;
}









#DWMobileReferenceTwo li {
		margin: 0;
		padding: 0;
		color: rgb(0, 0, 0) !important; 
		font-size: 20px;
		/* color: rgb(255, 255, 255) !important; */
		/* color: rgb(255, 255, 255) !important; */ /* If using them B */
		/* background: transparent !important; */
		border: none;
		/* border-bottom: 1px solid rgb(221, 221, 221); */
		height: 69px;
		line-height: 69px;
}

#DWMobileReferenceTwo p {
		margin: 0;
		padding: 0;
		padding-left: 21px;
		font-size: 16px;
}

#DWMobileReference li {
		margin: 0;
		padding: 0;
		color: rgb(0, 0, 0) !important; 
		font-size: 20px;
		/* color: rgb(255, 255, 255) !important; */
		/* color: rgb(255, 255, 255) !important; */ /* If using them B */
		/* background: transparent !important; */
		border: none;
		/* border-bottom: 1px solid rgb(221, 221, 221); */
		height: 69px;
		line-height: 69px;
}

#DWMobileReference p {
		margin: 0;
		padding: 0;
		padding-left: 21px;
		font-size: 16px;
}