body
{
	background-color: #06397B; /* Background color */
	color: #111; /* Foreground color used for text */
	font-family: Helvetica, Arial, sans-serif;
	font-size: 14px;
	margin:0;
}

a
{
	text-decoration: none;
}
a img
{
	border: none;
}
#header > img
{
   display: block;
   margin-top: 5px;
   margin-left: auto;
   margin-right: auto;
}

#content h2
{
	background-color: #eee;
	border-bottom: 1px solid #666;
	color: #000;
	display: block;
	font-size: 14px;
	font-weight: bold;
	padding: 10px 5px 10px 5px;
	text-align: center;
	margin: 0;
}

#content
{
	padding-left:10px;
	padding-right:10px;
}
#header h1
{
	margin: 0;
	background-color: #06397B;
	/* border-bottom: 1px solid #666; */
	color: #eee;
	display: block;
	font-size: 20px;
	font-weight: bold;
	padding: 10px 0 10px 0;
	text-align: center;
	text-decoration: none;
	text-shadow: 0px 1px 0px #444;
	background-image: -webkit-gradient(linear, left top, left bottom, from(#99BBE8), to(#06397B));
	background-image: -moz-linear-gradient(top, #99BBE8, #06397B);
}

#header h2
{
	margin: 0;
	color: #fff;
	display: block;
	font-size: 18px;
	font-weight: bold;
	padding: 10px 0 0 0;
	text-align: center;
	text-decoration: none;
	text-shadow: 0px 1px 0px #444;
}

#header a img
{
	position: absolute;
	left: 10px;
	top: 10px;
	border: 0;
}

#header ul, #content ul, #footer ul
{
	list-style: none;
}

#content ul li > img:first-child
{
	margin:7px 0px 0px -35px;
	float: left;
}
#content ul li.listhead > img:first-child
{
	margin:-5px 0px 0px -43px;
}

#content ul li.nobullet> img:first-child
{
	margin:-3px 0px 0px -35px;
}

#content ul li > a
{
	background: url(../../static/mobile/images/next.png) no-repeat right center;
	display: block;
	padding: 12px 35px 12px 16px;
	color: #222;
}

#content ul li > div
{
	padding: 12px 0px 12px 16px; 
}

#content ul li
{
	border: 1px solid #999999;
	color: #222222;
	font-size: 14px;
	font-weight: bold;
	margin-bottom: -1px;
	background-color: #fff;
}

/* the following entry is for descriptive text in the detailed about and help pages */
#content ul li.plaintext
{
	font-weight: normal;
}

/* the following entry is for a bulleted list within the current li structure*/
#content ul li.bullet
{
	border: none;
	font-weight: normal;
	list-style-type: disc;
	padding: 5px 10px;
}

#content ol li.numbered
{
	border: none;
	font-weight: normal;
	padding: 5px 10px;
}

#content ul li.nobullet
{
	border: none;
	font-weight: normal;
	padding: 10px 10px;
	
}

/* the following entries are intended for SPECIAL ANNOUNCEMENTS but may find use elsewhere */
#content ul.specialannouncements li span.announcetitle 
{
	color:red;
}

#content ul.specialannouncements li span.regulartext 
{
	font-weight: normal;	
}

#content ul li a.emph-list-item
{
	color: #0000bb;
}

#content ul li a.major-list-item
{
	color: #bb0000;
}

#content ul li.listhead
{
	border: 1px solid #999999;
	color: #222;
	display: block;
	font-size: 14px;
	font-weight: bold;
	margin-bottom: -1px;
	padding: 12px 8px;
	text-decoration: none;
	background-color: #ddd;
}

#content .nonultitle 
{
   padding:0px; 
   margin-left: 7px; 
   margin-top:30px; 
   margin-bottom: -15px;
   color:white; 
   font-weight: bold; 
   font-size:120%;
}

#footer
{
	color: #fff;
	text-align: center;
	font-size: 11px;
	font-weight: bold;
	padding: 0px 6px 12px 6px;
	/* margin: 0px 0px 6px 0px; */
}

a.flink, a.flink:link, a.flink:visited {
	color: #fff;
	padding-left: 10px;
	padding-right: 10px;
}

#header ul li:first-child, #header ul li:first-child a, #content ul li:first-child, #content ul li:first-child a
{
	-webkit-border-top-left-radius: 8px;
	-webkit-border-top-right-radius: 8px;
	border-top-left-radius: 8px;
	border-top-right-radius: 8px;
	-moz-border-radius-topleft: 8px;
	-moz-border-radius-topright: 8px;
}
#header ul li:last-child, #header ul li:last-child a, #content ul li:last-child, #content ul li:last-child a
{
	-webkit-border-bottom-left-radius: 8px;
	-webkit-border-bottom-right-radius: 8px;
	border-bottom-left-radius: 8px;
	border-bottom-right-radius: 8px;
	-moz-border-radius-bottomleft: 8px;
	-moz-border-radius-bottomright: 8px;
}

#footer ul li:first-child a
{
	-webkit-border-top-left-radius: 8px;
	-webkit-border-bottom-left-radius: 8px;
	border-top-left-radius: 8px;
	border-bottom-left-radius: 8px;
	-moz-border-radius-topleft: 8px;
	-moz-border-radius-bottomleft: 8px;
}
#footer ul li:last-child a
{
	-webkit-border-bottom-right-radius: 8px;
	-webkit-border-top-right-radius: 8px;
	border-bottom-right-radius: 8px;
	border-top-right-radius: 8px;
	-moz-border-radius-bottomright: 8px;
	-moz-border-radius-topright: 8px;
}

#event-table
{
	font-family: Helvetica;
	font-size: 14px;
	border-collapse: collapse;
	width: 100%;
}
#event-table td
{
	padding: 8px;
	color: #336;
	font-weight: normal;
}
#event-table tr
{
	border-top:solid 1px gray;
}

#event-table td.no-events
{
	color: #555;
	font-weight: bold;
}
#event-table a
{
	background: url(../../static/mobile/images/next.png) no-repeat right center;
	display:block;
	padding-right: 35px;
	min-height:21px;
	overflow-wrap: anywhere;
}

#event-table a.Major
{
	color: #bb0000;
}

#content p
{
	padding: 0px 14px;
}

.information
{
	background: #fff;
	margin: 10px;
	padding: 2px;
	-webkit-border-bottom-right-radius: 8px;
	-webkit-border-top-right-radius: 8px;
	-webkit-border-top-left-radius: 8px;
	-webkit-border-bottom-left-radius: 8px;
}

.webcam-thumb
{
	background: url(../../static/mobile/images/next.png) no-repeat right center;
	border-top: solid 2px #999999;
}

.webcam-thumb a
{
	display: block;
}

.info-center
{
	text-align: center;
}

#weather-table
{
	font-family: Helvetica;
	font-size: 14px;
	text-align: left;
	border-collapse: collapse;
	margin-left: auto;
	margin-right: auto;
}
#weather-table th
{
	font-size: 14px;
	font-weight: bold;
	padding: 8px;
	border-top: 2px solid #d3ddff;
	border-bottom: 2px solid #d3ddff;
	color: #039;
	background: #e8edff;
}
#weather-table td
{
	padding: 8px;
	color: #336;
	text-align: center;
	border-bottom: 1px solid #d3ddff;
}

#content .imageButton
{
	height: 2em;
	display: inline;
	padding: 5px 5px 5px 5px;
	margin: 15px 0 0 0;
	background-color: #357EC7;
	background-image: none;
	background-image: -webkit-gradient(linear, left top, left bottom, from(#06397B), to(#99BBE8));
	background-image: -moz-linear-gradient(top, #06397B, #99BBE8);
	text-align:center;
	color:White;
	font-weight:bold;
	font-size:smaller;
	white-space : nowrap;
}

#content .setwidth {
    display:inline-block;
    width: 45%;
    min-width: 200px;
    max-width: 350px;
}

.roundedCorner
{
	border-radius: 8px;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
}
label
{
	cursor:pointer;
}
.field
{
	width: 100%;
	margin-bottom: 10px;
	border:none;
}
.fieldText
{
	 color: White;
}
#content ul li > div.webcam-thumb
{
	padding-right:35px;
}

/*used by rounded corner sections that don't have left padding for icons*/
ul.noindent
{
	margin-left:0px;
	padding-left:0px;
}

#buttons {
	margin-left: 40px;	
}


#content .webcamDetailLi
{
	background-color:Transparent;
	border:none;
	color: White;
	padding: 0 0 10px 0;
}

#content li.webcamDetailLi > img:first-child
{
	float:none;
	margin: 0px;
	vertical-align:middle;
}

#content .webcamDetailLi > div
{
	padding:0;
}

#updateDateTime
{
    font-size: 12px;
	font-weight: bold;
	color: White;
	background-color: Black;
	width: 350px;
	text-align: center;
	margin-bottom: -8px;
}

.normalFont
{
	font-weight:normal;
}

.italicFont
{
	font-style:italic;
	font-size:0.8em;
}

.routeInputShow
{
	display: inline;

}
.routeInputHide
{
	display: none;
}
.routeDataErr
{
	display: inline;
	color: Red;
}






#routeContainer{
	max-width: 225px;
}


#useMyLocation{
  background: url(../images/icons/myLocation.png) no-repeat left center;
  background-position: 37px 50% ;
  background-size: 18px 18px;
  font-size: 8pt;
  vertical-align: text-bottom;
  padding-left:57px;
  margin: 5px;
}


#useMyLocation:hover{
  text-decoration: underline;
  color:blue;
}


.myLocationA
{
  position: relative; 
  left : 4.5em; 
  top: -4.2em;
  padding-left: .3em;
  padding-right: 3.4em;
  padding-top: .3em;
  width: 100px;
  height: 1.2em;
}
.myLocationB
{
  position: relative; 
  left: 4.5em; 
  top: -2.2em; 
  padding-left: .3em;
  padding-right: 3.4em;
  padding-top: .3em;
  width: 100px;
  height: 1.2em;

}
.myLocationText
{
	font-weight: normal;
}
#fieldRoutePointA
{
	height:28px; 
	padding-left:28px;
	background: url(/static/mobile/images/A.png) no-repeat left center;
}
#swapImageContainer{
  position:relative;
  top:-45px;
  left: -13px;
  float:right;
}
#fieldRoutePointB
{
	height:28px; 
	padding-left:28px;
	background: url(/static/mobile/images/B.png) no-repeat left center;
}

#routeResolutionContainer div ul
{	
	padding-left: 1px;
	text-indent: 10px;
}
#routeDisclaimerDiv{
  height: 100%;
  margin: 10px;
  color: white;
}
#resolutionInfoDiv{
  height: 100%;
  margin: 10px;
  color: white;
}
.clickable{
    cursor:pointer;
}

.imageButton
{
  height: 1em;
  display: inline;
  padding: 4px;
  margin: 2px;
  background-color: #357EC7;
  background-image: none;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#06397B), to(#99BBE8));
  background-image: -moz-linear-gradient(top, #06397B, #99BBE8);
  text-align:center;
  color:White;
  font-weight:bold;
  font-size:smaller;
  white-space : nowrap;
}

.xingErrorMsg {font-weight:bold; color:red; display:none;}


#twitter-region {
	padding: 0;
	margin: 10px 0 0 0;
	text-align: center;
}

#twitter-region div {	
	display: inline-block;
	vertical-align: top;

	/* For IE 7 */
	zoom: 1;
	*display: inline;
}


#region-map {
	position: relative;
	top: -10px;
	width: 700px;
}

#bcmap {
	width:410px; 
	height:378px;
	border: 0;
	z-index:1;
}

#bcmapMap {
	height:0px;
}


/* Text labels on mobile Twitter map */
.region-label {font-weight:bold; font-size:12px; color:white; font-family: Helvetica, Arial, sans-serif; text-shadow:1px 1px #989898;}
#map-labels {position: relative; margin:0; padding:0;}
#map-labels a {width: 3em; margin:0; padding:0; float:left; text-align:center;}
#nw-label {position:absolute; bottom: 180px; left: 70px;}
#ne-label {position:absolute; bottom: 190px; left: 155px;}
#nc-label {position:absolute; bottom: 120px; left: 140px;}
#c-label {position:absolute; bottom: 80px; left: 150px;}
#k-label {position:absolute; bottom: 30px; left: 245px;}
#tok-label {position:absolute; bottom: 35px; left: 185px;}
#lm-label {position:absolute; bottom: 40px; left: 125px;}
#vi-label {position:absolute; bottom: 5px; left: 100px;}

/* Current Weather */
.waiting-div {
	display:none; 
	width:140px; 
	height:140px; 
	padding:30px 0px 0px 0px; 
	margin:0px auto;
	text-align: center;
}
.weather-waiting {width:60px; height:60px;}
.weather {margin: 0px; padding: 0px; background-color: white;}
#curWeatherTitle {background-color:white; color:black;}
#curWeatherDiv {
	color: #333333;
	background-color: #ffffff;
	font: normal 12px "Trebuchet MS" , "Lucida Grande" , Verdana, Sans-Serif;
	height: 100%;
	margin:0px auto; 
	width:240px; 
}
#curWeatherDiv ul {padding: 0px;}
#curWeatherDiv li {list-style-type: none; padding: 0px;}
.curWeatherBlock {border-top:1px solid black; border-bottom:1px solid black; }
.weather_left_col {display:inline-block; width:150px; vertical-align:top; zoom:1; *display:inline;}
.weather_right_col {display:inline;zoom:1; *display:inline; padding-left:5px;}
.dataTbl {width:85px; display:inline-block;zoom:1; *display:inline;}
.lineH {padding:1px 0;} /* line height */
.shade-row {background-color: #DEEBFB;}
.clear-row {background-color: #FFFFFF;}

#emergency-message-div {
	color: #ff0;
	font-size: 14px;
	font-weight: bold;
	margin: 10px 5px 10px 5px;
	text-align: center;
}
#emergency-message-div a {color:#D64A1A;}
#emergency-message-div a:hover {color:#D56741;}
#emergency-message-div a:visited {color:#D64A1A;}
#emergency-message {text-align: center;}

/* Start of stale data warning */

#stale_data_warning {width:300px; margin:0 auto;}
.warn_body {color: red; font-weight: bold;}

/* End of stale data warning */