﻿body { margin:0; padding: 0;  background-color: #e4701d; }
#main_content {margin:0; padding-top: 30px; padding-bottom: 20px; padding-right: 20px; padding-left: 30px; position: absolute; top:0px; bottom: 0px; width:100%}
#main_content_part {margin:0; padding-top: 0px; padding-bottom: 0px; padding-right: 0px; padding-left: 0px; position: absolute; top:0px; bottom: 0px; width:100%; height: 99vh !important; overflow:hidden;}
#left_panel {margin:0; padding:0; position:relative; top:0px; bottom:0px; width:70%; height:100%; float: left; }
#right_panel {margin:0; padding:0; position:relative; top:0px; bottom:0px; width:30%; height:100%; float: right; background-color: white; }
#panel_1{margin:0; padding:0; position:relative; top:0px; bottom:0px; width:100%; height: 45%}
#panel_2{margin:0, auto; padding:0; position:relative; top:60px; bottom:0px; width:100%; height:100%;}
#panel_3{margin:0; padding:0; position:relative; top:0px; bottom:0px; width:100%; height:100%;}
#map { position:relative; top:0; width:100%; height:100%; }
#LP_trend { position:relative; top:0; bottom:0; width:100%; height:100%; background-color:slategray}
#RP_table { position:relative; top:0; bottom:0; width:100%; height:100%; display:block}

#ProductName{ font-size: 14px; color: lightgray; font-weight:200; position: absolute; top: 0}
/*#lastupdate{ font-size: 14px; color: white; }*/
/*#totaltext{ font-size: 14px; color: white; font-weight:100; position: absolute; top: 0; float: right; text-align: right; width: 100%; padding-right:20px; padding-top: 4px;}*/
.footertextL{ font-size: 14px; color: lightgray; }
.footertextR{ font-size: 14px; color: white; float: right; margin-right: 20px; font-style:italic}
.summarytextR{ font-size: 16px; color: lightgray; float: right; margin-right: 20px; font-style:italic}
.poweredby_summary{ font-size: 16px; color: white; position: relative; top: 0; float: left; text-align: left; width: 45%; padding-left:20px; padding-top: 4px; font-style:italic}
.lastupdate_summary{ font-size: 16px; color: white; font-weight:100; position: relative; top: 0; float: left; text-align: left; width: 45%; padding-left:20px; padding-top: 4px;}
.totaltext_summary{ font-size: 20px; color: white; font-weight:100; position: relative; top: 0; float: left; text-align: left; width: 45%; padding-left:20px; padding-top: 4px;}

#fg_1a {position:relative; top:0; bottom:0; width:100%; height:100%; display:block; background-color:white}
#fg_1b {position:relative; top:0; bottom:0; width:100%; height:100%; display:none; background-color:white}
#ut_1 {position:relative; top:0; bottom:0; width:100%; height:100%; display:none; background-color: white; }
.DT_Text {font-size: 12px; white-space:nowrap; }
.DT_Text2 {font-size: 12px; white-space:nowrap; }
.DT_C_Align {text-align: center; }
.DT_L_Align {text-align: left; }
.DT_R_Align {text-align: right; }
.DT_Rows tr {height: 14px; line-height: 14px; }
.DT_Rows2 tr td {height: 10px; line-height: 10px; }

/* The following are for the status spinners*/
.spinner-map{width: 20%; height: 20%; position: absolute; top: 40%; left: 40%}
.spinner-table{width: 20%; height: 20%; position: absolute; top: 40%; left: 40%}
.spinner-trend{width: 20%; height: 20%; position: absolute; top: 40%; left: 40%}
.spinner-all{width: 20%; height: 20%; position: absolute; top: 50%; left: 50%}

/* The following are part of the styles of the map itself*/
.legend { background-color:#ffffff; padding: 5px; border-radius:3px; box-shadow: 0 1px 2px rgba(0,0,0,.1)}
.legend .swatch {width: 20px; height:20px; float:left; margin-right:10px; }
.info { background-color:#ffffff; padding: 5px; border-radius:3px; box-shadow: 0 1px 2px rgba(0,0,0,.1)}
#layersicon {width: 30px; height: 30px; position: absolute; left: 9px; top: 120px; }
#overviewicon  {width: 30px; height: 30px; position: absolute; left: 9px; top: 80px; }
#layermenu { position: absolute; left:50px; top: 130px;  background-color:#ffffff; padding: 5px; border-radius:3px; box-shadow: 0 1px 2px rgba(0,0,0,.1)}
