/* WeatherCam Mobile */
*{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;}
html{-webkit-text-size-adjust:none;}
a{text-decoration:none;color:#396DA5;}
a:hover{text-decoration:underline;color:red;}
img{border:0;}
.clearBoth{clear:both;}

/* Clearfix */
.clearfix:after {content: ".";display: block;clear: both;visibility: hidden;line-height:0;height:0;}
.clearfix {display:inline-block;}
html[xmlns] .clearfix {display: block;}
* html .clearfix {height: 1%;}

/* Nav */
#logo{padding-top:10px;}
#mobilenav {width:100%;}
#mobilenav ul {background-color:#0060B0;width:100%;border-bottom:1px solid #fff;line-height:31px;}
.topnav li {display:none;}
.responsive li {float:none;display:block;}

#mobilenav li.home {display:inline-block;border-top:none;padding-right:10px;}
#mobilenav li.shortcut {display:inline-block;border-top:none;}
#mobilenav li.shortcut a {text-indent:0;padding: 0 10px;}
#mobilenav li.shortcut .active {font-weight:bold;}

#mobilenav li.icon {float:right;display:inline-block;width:16%;text-align:center;border-top:none;height:31px;}
#mobilenav li.icon a {padding-top:10px;width:100%;text-align:center;text-decoration:none;}

.icon span {display:block;margin:0 auto;background-color:#fff;width:20px;height:3px; margin-bottom:3px;}

.secondnavon {font-weight:bold;}

.nSelected {font-weight: bold;}
.data {color:black;}

.label {display:block;margin:0;padding:0; color:#666;font-family:Arial, Helvetica, sans-serif;font-size:0.5rem;}

.hdata {color:black;font-family:Arial, Helvetica, sans-serif;font-size:14px;line-height: 20px;font-weight:bold;}
.hdata2 {font-weight:bold;color:#000;}

.greytext {color:#666;font-family:Arial, Helvetica, sans-serif;font-size:10px;}
.small_print {font-family: Arial, Helvetica, sans-serif;font-size:9px;color:#444444;}

span.graph_legend {font-family:Verdana, Geneva, sans-serif;font-size:9px;color:#444444; display:block;margin-top: 10px;}

.greybox {position:relative;left:17px;margin-top:17px;width:502px;background-color:#eee; border:1px solid #bbbbbb;padding: 20px;}
.ad_filler {width:150px;height:46px;border:1px solid #ccc;margin-top:5px;}
.deg_symbol {font-weight:normal;}

/* LAYOUT COLUMNS */

.cam_column {display:block; width: 510px; height: 461px; border: 1px solid #ccc; background-color: #eee;}

#wind_graph {position:relative;top:0;width:353px;bottom:50%;border: 1px red dotted;height: 200px;border:1px solid #ccc; }
#wind_graph img {margin-left:27px;}

/* data */

#data_column {display:block;float:left;width:350px;min-height:457px;height:auto;margin-top: 8px;margin-left:0px;margin-right:5px;}

#data_block {position:relative;height:307px;margin-top:5px;width:360px;}

#data_left_column {float:left;width:173px;height:307px;border:1px solid #ccc;}
#data_right_column {float:left;width:173px;height:307px;border:1px solid #ccc;margin-left:5px;}

.databox {margin:7px;padding:0px;font-family:Arial, Helvetica, sans-serif;color:#666; font-size:12px;}

p.forecast {margin:0;margin-bottom:7px;color:#444;}

ul.list_arrow {margin:0;padding:0;list-style:none;}

#ads_column {float:right;width:150px;height:auto;margin-top:8px;margin-right:130px;}

#container {width:100%;}

/* cam header area */
#zoomForm {margin:0;padding:0;}
.cam_zoom {display:inline-block;padding-left:9px;}
#zoom_cb {margin:0 4px;padding:0;width:14px;height:14px;background-color:#eee;color:#eee; vertical-align:middle;}

/* summary */
#summary_box {position:relative;margin-left:17px;margin-top:17px;width:502px;margin-bottom:138px;}

/* ais */
#ais_map {margin:10px;margin-bottom:0;border:1px solid #bbbbbb;width:520px;}

/* google ads */
#ils_promo {display:none;left:838px;margin-top:11px;width:150px;height:90px;border:1px solid #E6E6E6;}
#triview_filler_block {position:absolute;left:1482px;width:76px;margin-top:11px;height: 90px;border:1px solid #E6E6E6;}

#fb_box {display:none;position:absolute;left:749px;top:11px;border:1px solid #e6e6e6;width:82px;height:90px;}

#ads{display:none;}

/* Detail */

#weather-detail {overflow-x:auto;margin-left:16px;margin-top:10px;margin-bottom:15px; border-collapse:collapse;width:100%;}

#weather-detail table {width:auto;}

#weather-detail th{font-size:12px;text-align:left;vertical-align:top;text-transform:uppercase;color:#0060B0;height:3em;}
#weather-detail td{font-size:12px;border-bottom:1px solid #bbb;}


#wd-almanac-data td{border:none;}

.wd-col1{min-width:140px;}	/*param*/
.wd-col2{min-width:80px;}	/*val*/
.wd-col3{min-width:80px;}	/*high*/
.wd-col4{min-width:80px;}	/*time*/
.wd-col5{min-width:80px;}	/*low*/
.wd-col6{min-width:80px;}	/*time*/
.wd-col7{min-width:80px;}	/*avg*/
.wd-col8{min-width:80px;}	/*rate*/
.wd-col9{min-width:80px;}	/*rate hi*/
.wd-col10{min-width:80px;}	/*time*/
.wd-col11{}
.wd-col12{}

/* Mobile Lightning */

#lightning {margin:0 2.5%;}
#sv_graph img {width:100%}

/* */

#cam1 {margin-top:6px;margin-bottom:6px;}

#mobileVersion {float:left;font-size:12px;font-family:Arial, Helvetica, sans-serif;color: #888888;margin-left:18px;padding-top:10px;} 

#m-ads-1{height:auto;margin-top:4%;margin-bottom:4%;min-height:250px;text-align:center;padding:30px 0;}
#m-ads-2{height:auto;min-height:250px;text-align:center;padding:30px 0;border:none;}

.weather_error, .weather_warning { background: url(../weather/images/caution.png) no-repeat left center; font-family: Arial, Helvetica, sans-serif; color: red; font-size: 11px; line-height:16px; margin-left: 17px; margin-top: 12px; padding-left: 23px; width:95% !important; height:auto !important;}

/* PREDICTION */

#predict {margin-left:17px;margin-top:14px;margin-bottom:15px;min-height:480px; /* new 05.11.19 */ width:100%;overflow-x:auto;}
#predict h3 {margin:10px 0;padding:0;font-size:14px;color:#fff;}

.forecast table {border-collapse:collapse;}
.forecast td {padding:1px;border:1px solid #bbb;font-family:Verdana, Geneva, sans-serif; font-size:11px;}
.forecast .c1 {width:100px;}
.forecast th {text-align:left;border:1px solid #bbb;font-size:11px;padding-left:5px; font-weight:normal;}
.forecast td.title {border-top:none;border-left:none;border-right:none;}
.forecast td.location {font-weight:bold;padding-left:4px;}
.forecast tr.gap {height:22px;}
.forecast .fh {width:29px;}

.f0{background-color:#ffffff;}
.f1{background-color:#ccffff;} 
.f2{background-color:#99ccff;}
.f3{background-color:#ccccff;}
.f4{background-color:#cc99ff;}
.f5{background-color:#cc66ff;}
.f6{background-color:#ff99ff;}
.f7{background-color:#ff9900;}
.f8{background-color:#ff6600;}
.f9{background-color:#ff9999;}
.f10{background-color:#ff6666;}
.f11{background-color:#ff3333;}
.f12{background-color:#ff0000;}

td.rain {background-color:#99ccff;}

.p-wind-arrow {padding:0;margin:0;vertical-align:middle;}

/* new */
#mobilenav ul {margin:0;padding:0;}
#mobilenav li {margin:0;padding:0;list-style:none;}
#mobilenav li { background-color:#0060B0; font-size:13px;border-top:1px solid #fff; }
#mobilenav a {color:#fff; height:36px;line-height:36px;text-indent:16px;display:inline-block; width:100%;font-size:14px;} 
#mobilenav li li { line-height:36px; background-color:#9FB3CD;text-align:center; border-top:1px solid #0060B0;/*width:33%;*/width:33.3%; float:left; /*margin-right:1px;*/border-right:1px solid #0060B0;}
#mobilenav li li a {text-indent:0;}

/* Weather-Cam */

.basic-box {width:95%;margin:0 auto; margin-top:15px; border:1px solid #ccc; }
.fw-box {width:95%;margin:0 2.5%;border:1px solid #ccc; } 
.half-box {width:45.5%;margin:2.5%;float:left;border:1px solid #ccc; }
.hb-left {margin-right:4%;}
.hb-right {margin-left:0%;}

.weather-cam {width:95%;margin:0 auto;margin-top:12px;border:1px solid #ccc; background-color:#eee;}

ul.cam-header {width:100%;margin:0;padding:0;padding-top:5px;}
ul.cam-header li {list-style:none;float:left;}

.wind-avg {width:38%;min-height:30px;padding:4px;}
.wind-force {width:20%;min-height:30px;padding:4px;}
.outside-temp {width:17%;min-height:30px;padding:3px;}
.created-by{width:24%;height:100%;min-height:30px;padding:5px;text-align:center;}
.created-by img {vertical-align:middle;}

.weather-img {width:100%;height:auto;}

.images {width:100%;padding:3px;}
.images .label {display:none;}

p.cam-desc {font-size:0.8rem;line-height:0.9rem;margin-top:4px;margin-bottom:0px;}
p.cam-desc-zoom {float:left;width:75%;} 
p.cam-zoom {font-size:0.7rem;margin:10px 0;float:right;width:18%}
#zoom_cb {padding:0; width: 15px; height:15px; background-color: #eee; vertical-align:middle;}

.label {font-size:0.6rem;display:block; color:#666; padding-bottom:4px; }
.hdata {font-size:0.95rem;line-height:0.96rem;color:#000;font-weight:bold; font-family:Arial, Helvetica, sans-serif; }

/* img nos */
#img-nos {width:100%;height:auto;}
ol#img-nos {margin:0;padding:0;}		
#img-nos li {float:left;width:10%;list-style:none;}
#img-nos a {font-size:14px;margin-right:1%;width:95%;text-align:center;background-color:#ccc;display:inline-block;padding:5px 0;text-decoration:none; xfont-family:Arial, Helvetica, sans-serif;}
#img-nos a.active {background-color:#396DA5;color:#fff;}

#webcam {width:100%;height:auto;cursor:pointer;}
.cam-footer {padding:4px 4px;padding-right:2px;font-size:0.5rem;color:#444;}

#wind-graph {background-color:#fff; margin-top:3%;margin-bottom:3%;}
#wind-graph img {width:100%;height:auto;}

#misc-data {padding:5px;min-height:335px;}
#misc-data td {font-size:0.72rem;line-height:1.1rem;}
#misc-data .c1{width:75px;} 

/* WL */
#w-links {padding:5px;min-height:335px;}
#w-links a {font-size:0.86rem;line-height:0.87rem;display:inline-block;width:100%;height:22px;padding-left:9px;
background-image: url(../imgs/arrow.gif); background-repeat: no-repeat; background-position: 1px 25%;}

#data-block, #ad-block {float:left;}

#ad-block {border:none;}
#ad-block a {border:1px solid #ccc; width:48%; height:auto;float:left;}
#ad-block img {width:100%; height:auto;}
.adleft {margin-right:2%;}
.adright {margin-left:2%;}
.adtop {margin-bottom:3%;}
#wcad-1,#wcad-3{margin-right:3.9%}
#wcad-2,#wcad-4{margin-right:0;}

/* GRAPHS */
.graphs .greybox {width:95%;margin-left:auto;margin-right:auto;left:auto;padding:10px 0; padding-top:0;}
.graph_legend{text-indent:10px;}
#wind_12h img,
#direction_12h img,
#barom_5d img {width:100%;height:auto;}
#barom_5d{margin-bottom:15px;}

.footer-m{margin-top:100px !important;} /*space for cookie bar*/
.share{font-size:12px;}
.copyright{font-size:12px;}
.sitemap{font-size:12px;}

@media only screen and (max-width:412px) {
	#summary_box {width:100%;}
	#summary_box img {width:92%;}
}

@media only screen and (max-width: 320px) {
	/* for iPhone 4/5 */
	#mobilenav li.shortcut a {padding:0 6px;}
	.created-by{padding-left:0;}
	.hdata{font-size:0.88rem;}
	p.cam-zoom{font-size:0.6rem;}
	#misc-data .c1{width:65px;}
	#misc-data td{font-size:0.65rem;line-height:0.85rem;}
	
}