@charset "utf-8";
/* CSS Document */
	html { 
	  	background: url(../_images/beach_sandfence_vert_2400x1400_cmp.jpg) no-repeat center center fixed; 
	  	-webkit-background-size: cover;
	  	-moz-background-size: cover;
	  	-o-background-size: cover;
	  	background-size: cover;

	  	

	}

	body {
		font-family: 'Noto Sans', sans-serif;
		margin:0;
		padding:0;
		color: rgb(120,120,120);
		font-size: 12px;
		background-color: transparent;
	}

	h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
		font-family: 'Noto Sans', sans-serif;
	}
	h3 {
		font-size: 18px;
		color: #7765b8;
	}
	h4 { 
		color: #4c4c4c;
		text-shadow: 1px 1px 0 #d0c099;
	}
	h5 {
		font-weight:bold;
	}
	hr {
		margin:7px 0;
		border-color: #dfdfdf;
	}
/* forces scroll bar to always show so no image shifting when navigating between pages */
/*//legacy//*/
/*//new//*/
html {overflow-y: scroll;}
.no_scroll {overflow-y: hidden; }

.block_mini {
	height: 25px;
	min-height:25px;
	max-height:25px; 
	position:relative; 
}
.siteTitle { 
	cursor:pointer;
	color: #479dff;
	font-weight:600;
	max-width: 90%;
	margin-left:auto;
	margin-right:auto;
	margin-bottom:12px; 
	text-align:center;
	position:relative;
	text-shadow: 1px 2px 2px #ddd;
}
/* bootstrap floats all spans left; this centers all containers */
.container {
	float:none;
}
.box_shadow {
	-moz-box-shadow:    3px 3px 2px  #aaa;
	-webkit-box-shadow: 3px 3px 2px  #aaa;
	box-shadow:         3px 3px 2px  #aaa;
}
.text_shadow {
	-webkit-text-shadow: 2px 2px 1px #999;
	-moz-text-shadow: 2px 2px 1px #999;
	text-shadow: 2px 2px 1px #999;
	}
.page-content {
	position:relative;
	top:165px;
}

/* --- text colors --- */
.super_darkest {color: rgb(10,10,10); }
.super_darker {color: rgb(35,35,35); }
.super_dark {color:rgb(60,60,60);}
.darkest {color:rgb(85,85,85);} /*default for h1 */
.darker {color:rgb(100,100,100);} /*default for h4*/
.dark {color:rgb(125,125,125);}
/*note: default color is rgb(150,150,150) *//*default for h2, h3, h5*/
.light {color:rgb(185,185,185);} /*default for input box default text */
.lighter {color:rgb(210,210,210);}
.lightest {color:rgb(245,245,245);}
.white {color:#FFFFFF; }
.dark_blue {color: #224573;}
.black {color:#313131; }

/* --- font sizes --- */
.largest {font-size: 26px; }
.larger {font-size: 22px; }
.large {font-size:18px }
/*note: normal size is 16px */
.small {font-size:14px; }
.smaller {font-size: 12px; }
.smallest {font-size: 10px; }

/* === STYLES === */
.border1 {border:thin solid #cdcdcd; }
.border_top1 {border-top:thin solid #cdcdcd;}
.border_bot1 {border-bottom:thin solid #cdcdcd;}
.border_l1 {border-left:thin solid #cdcdcd;}
.border_r1 {border-right:thin solid #cdcdcd;}

.pad_left0{ padding-left:0; }
.pad_left_5{ padding-left:5px; }
.pad_left1{ padding-left:10px; }
.pad_left2{ padding-left:20px; }
.pad_left3 { padding-left:40px; }
.pad_left4 { padding-left:80px; }
.pad_left5 { padding-left:160px; }
.pad_left6 { padding-left:320px; }

.pad_bot0 { padding-bottom: 0; }
.pad_bot1{ padding-bottom:10px; }
.pad_bot2{ padding-bottom:20px; }
.pad_bot3{ padding-bottom:40px; }
.pad_bot4{ padding-bottom:80px; }

.pad_top0 {padding-top: 0; }
.pad_top1 {padding-top:10px; }
.pad_top2{ padding-top:20px; }
.pad_top3{ padding-top:40px; }
.pad_top4 { padding-top:80px; }
.pad_top5 { padding-top:160px; }

.pad_right0 {padding-right:0; }
.pad_right_5 { padding-right:5px;}
.pad_right1 { padding-right:10px;}
.pad_right2 { padding-right:20px;}
.pad_right3 { padding-right:40px;}
.pad_right4 { padding-right:800px;}
.pad_right5 { padding-right:160px;}
.pad_right6	{ padding-right:320px;}

.marg_bot0 {margin-bottom: 0; }

.marg_right0{ margin-right:0;}
.marg_right1{ margin-right:10px;}
.marg_right2{ margin-right:20px; }
.marg_right3{ margin-right:40px;}

.marg_left1{ margin-left:10px;}

.marg_top0 {margin-top: 0; }
.marg_top1 {margin-top: 10px; }
.marg_top2 {margin-top:20px; }
.marg_top3 {margin-top:40px; }

.inline {
	vertical-align: top;
	display:inline;
}
header { 
	position:fixed;
	top:100px;
	padding-left:5px;
}
header > h2 { 
	display: inline; }
header > p { 
	display: inline-block;
	margin-left: 20px;
	margin-bottom: 1px;
	vertical-align: bottom;
	font-size: 16px;
	font-weight: 500;
}


.lh1 {line-height: 1;}

ul {
	margin:0;
}

ul li {
	padding-top:2px;
}

ul li a {
	text-decoration: none;
	color: #7F590F;
}
.panel1 {
	margin: 15px 15px 0 0;
	padding: 10px;
	box-shadow: 3px 3px rgba(180,180,180,.4);
	border: 1px solid rgba(220,220,220,.4)
}
#wx_uground .panel1 {
	margin:inherit;
}

#wx_uground table {
	margin-bottom: 0;
}

.panel-heading {
	background-color: #AF8362;
	color:#fff;
}
.panel-body {
	padding: 3px 3px 10px;
}

#radarKey {
	width:170px;
	margin:40px auto;
	font-size:14px; 
	font-variant:small-caps; 
	font-weight:bold;
	color: #fff;
	border: thin solid #acacac;
	box-shadow: 2px 2px #999;
}
#radarKey td {
	text-align:center;
}
.half-chart {
	width: 400px;
	height: 400px;
}

/* ============================= forms - general ============================= */
.button	{ 
	display:inline-block; 
	color:#fff /*!important*/; 
	text-decoration:none; 
	line-height:34px; 
	margin:10px 5px 5px 5px; 
	padding:0 5px;
	border-radius: 6px; 
	background:#993300; 
	min-height:15px;
}

.button:hover { 
	background:#cecece /*!important*/; 	
	color:#000 /*!important*/;
	cursor: pointer;
	text-decoration:none;
}
.button2	{ 
	display:inline-block; 
	color:#fff /*!important*/; 
	text-decoration:none; 
	line-height:34px; 
	margin:10px 5px 5px 5px; 
	padding:0 5px;
	border-radius: 6px; 
	background:#9e9e9e; 
	min-height:15px;
}

.button2:hover { 
	background:#cecece /*!important*/; 
	color:#000 /*!important*/;
	text-decoration:none;
}
.button3	{ 
	display:inline-block; 
	color:#fff /*!important*/; 
	text-decoration:none; 
	line-height:22px; 
	margin:2px; 
	padding: 0 5px;
	border-radius: 6px; 
	background:#993300; 
	min-height:15px;
	font-size:14px;
}

.button3:hover { 
	background:#cecece /*!important*/; 
	color:#000 /*!important*/;
}
.btn-danger {
	background-color:#993300;
	border:none;
}
/*============ general FORMS styling ================*/
		
.formContainer {
	max-width: 480px;
	border: thin solid #dedede;
	border-radius: 6px;
	padding:5px;
	background-color: #FFF;
}
.form-group .inline{
	margin-right: 10px;
}

.buttonContainer {
	max-width: 300px;
	/*offset right margin of last button in container of right-justified buttons*/
}

.bg-light {
	background-color: #FEFEFE;
	color: rgb(110,110,110);	
}
.bg-grey {
	background-color: #EFEFEF;
	color: rgb(135,135,135);	
}
/**** Response Blocks ****/

.response,
.response-m {
	margin: 20px 0 5px 0;
	border-radius:6px;
	overflow:hidden;
	
	font-size: 13px;
	background: rgba(255,255,255,0.95);
	text-align:left;
	width:300px;
}


.response-success {
	color: #498D0D;
	background-color:#E1FFD5;
	display:block;
	margin: 20px 3px 5px 0;
	padding:3px 3px 3px 6px;
	text-align:left;
	width:300px;
}
.response-errors {
	color: #BB832F;
	background-color:#FFeeaa;	
	display:block;
	margin: 20px 0 5px 0;
	padding:3px 3px 3px 6px; 	
	text-align: left;
	width:300px;
}

/**** parsley.js errors ****/
ul.parsley-error-list {
  font-size: 11px;
  margin: 2px;
  list-style-type:none;
  padding: 3px;
  
}
ul.parsley-error-list li {
  line-height: 13px;
}
/* ===== form inputs ===== */
.input {
    vertical-align:baseline;
	border:1px solid #d0c099; 
	border-radius:6px; 
	padding:4px; 
	font-size:11px; 
	margin:5px 0;
		
	min-height:25px;
	height: 25px;
}
.disabled {
	background-color:#fff;
	border: thin solid #fff;
	border-radius: 6px;
}
.enabled {
	border: thin solid #d0c099;
	border-radius: 6px;
	background: #fefefe;
	cursor:pointer;
}

/*overrides bootstrap input-sm*/
.input-xs { width: 38px; }
.input-sm { width: 83px; }
.input-ms { width: 105px; }
.input-md { width: 128px; }
.input-ml { width: 151px; }
.input-lg,
.input-lg:first-child { 
	margin-right:6px;
	width: 174px;
}
input:last-of-type{
	margin-right:0;
}
.input-xl { width: 232px; }
.input-xxl { width: 358px; }

.input-select-light {
	background-color: #FEFEFE;
	color: rgb(155,155,155);	
}

label{
	padding:0;
	margin-bottom: 8px;
	font-weight:400;  
}
#login label {
	color: #2a2c38;	
	font-size: 14px;
	margin-bottom: -2px;
	margin-top: 8px;
}
.label_right {

}
.form_title {
	font-size: 16px;
	font-weight: 700;
}

/* ====== check box ====== */
input[type='checkbox'].ckbox {
	margin: 0;
	padding: 0;
	float:left;
}
.ckbox,
.ckbox a {
	font-size: 11px;
	margin: 0;
	padding-left: 5px;
	line-height: 1;
	font-weight:300;
	vertical-align:baseline;
}
.ckbox a {
	padding-left: 0;
}
/* ===== radio and label ===== */


.radio_input {
	max-width: 20px;
}
/* ===== textarea ===== */
textarea {
	overflow: auto; 
	border:1px solid #d0c099; 
	border-radius: 6px; 
	padding:6px 8px; 
	font-size: 14px;
	height:97px;
	margin:5px auto 0;
	min-width: 100%;
	max-width: 100%; 
}
/* ===== input type=file ===== */
	.file-upload {
		border: thin solid #d0c099;
		border-radius: 6px;
		width: 400px;
	}
	.loader {
	    border: 16px solid #f8f8f0; /* Light brown */
	    border-top: 16px solid #479dff; /* Blue */
	    border-radius: 50%;
	    width: 120px;
	    height: 120px;
	    margin: 20px auto 0 auto;
	    animation: spin 2s linear infinite;
	}

	@keyframes spin {
	    0% { transform: rotate(0deg); }
	    100% { transform: rotate(360deg); }
	}
	.hidden {
		display:none;
	}
	.del-btn {
		color:#c9a7de;
		float:right;
		margin-right: 2px;
		margin-top: 10px;
	}
	.date_pickr {
		min-width:85px;
	}

	.left {
		float:left;
	}
	
	.btn-file {
		position: relative;
		overflow: hidden;
		font-family:Arial, Helvetica, sans-serif;
	}
	.btn-file input[type=file] {
		position: absolute;
		top: 0;
		right: 0;
		min-width: 100%;
		min-height: 100%;
		font-size: 999px;
		text-align: right;
		filter: alpha(opacity=0);
		opacity: 0;
		outline: none;
		background: none;
		cursor: inherit;
		display: block;
	}
	.btn-file,
	.btn-file:active {
		color:#787878;
	}
	.btn-file:hover,
	.btn-file:focus {
		color:#b1b1b1;
	}
	
	input[readonly] {
		background-color: white !important;
		cursor: text !important;
	}
	.imageWrapper {
		position:relative;
		width: 90px;
		display:inline-block;
	}
	.required {
		border: thin solid #AAA;
	}
	.nopadding {
		padding: 0 !important;
		margin: 0 !important;
	}
	/*.center_block {
		margin:auto;
		
		padding:10px;
		border-radius: 4px;
	}*/
	
	#login .container {
		margin-left:auto;
		margin-right:auto;
	}
	#login .center_block {
		background-color:#F2DCBC; 
		border-radius: 8px;
		margin: auto;
		max-width: 265px;
		padding: 10px;
		text-align: center;
	}
	#login .center_block label {
		text-align: left;
		padding-left:15px;
		padding-right:15px;
	}
	#login .input-group {
		display:block;
		float:right;
	}
	
	#login .input {
		color: #535353;
		min-width: 195px;
		box-shadow: 1px 1px #D8D5CD;
	}
	/* parsley */
	#login .parsley-custom-error-message {
		color: #90C;
		font-size: 12px;
		font-style:italic;
		margin-left: -30px;
	}
	
	#login .btn-primary {
		background-color: #479dff;
		/*border: 1px solid #d0c099;*/
		border-radius: 5px;
	}
	
	#login .tt-dropdown-menu {
		background-color: #F9fFFF;
		min-width: 80px;
		text-align:center;
		border-radius: 0 0 6px 6px;
	}
	#login .tt-suggestions {
		color: #535353;
		padding-left:5px;
		padding-right:5px;
		padding-top:5px;
		margin-bottom:0;
		border-radius: 6px;
		font-size:12px;
	}
	#login .tt-suggestion:hover {
		background-color:#479DFF;
		color: #F4F1F8;
		cursor:pointer;
	}
	.tt-hint {
		opacity: 1;
	}
		
	/* home page (with search box) */
	#home .input {
		max-width: 290px;
		width:100%;
		min-height:32px;
		box-shadow: 1px 1px #D8D5CD;
		color:#777;
	}
	#content {
		margin:10px auto;
		max-width:900px;
		height:90%;
		padding-left: 15px;
	}
		
	#content-body {
		width: 96%;
		/*background-color:#FCF7ED;*/
		color: #777;
		font-size: 12px;
		/*border-radius:3px;*/
		padding:3px;
		/*box-shadow: 1px 1px #D8D5CD;*/
	}

	#accordion {
		margin: auto;
		width: 98%;
	}
	
	.category {
		box-shadow:1px 1px #ccc;
		border-radius: 6px;
		background-color: #f8f8f0;
		/*border: thin solid #e8e0cd;*/
		background-size: 40px 40px;
		background-repeat: no-repeat;
		min-height:40px;
		padding:4px 4px 4px 50px;
		color: #479dff;
		font-family:"Segoe Print","TrebuchetMS-Italic",sans serif;
		font-size:16px;
		font-weight:500;
		margin-bottom:7px;
		vertical-align: middle;
		width:100%;		
	}
	.category > p {
		margin-bottom: 0;
		padding:0;
	}
	
	.category > h4 {
		font-family: "Segoe Print","TrebuchetMS-Italic",sans serif;
	}
	
	.panel > .category {
		margin-bottom: 0;
	}

	.weather {
		background-image: url(../_images/Umbrella_Beach_160_160.jpg);
	}
	.brindley {
		background-image: url(../_images/brindley_beach_chair.png);		
	}
	.recycle {
		background-image: url(../_images/recycle_green.gif);
	}
	.poolspa {
		background-image: url(../_images/grill_bar_pool_spa_150_150.jpg);
	}
	.audiovideo {
		background-image: url(../_images/volume_knob.jpg);
	}
	.kitchen {
		background-image: url(../_images/kitchen_193x193.jpg);
	}
	.golf {
		background-image: url(../_images/golf.png);
	}
	.hurricane {
		background-image: url(../_images/hurricane.png);
	}
	.hvac {
		background-image: url(../_images/temp.jpg);
	}
	.dining {
		background-image: url(../_images/pine_island_diner.jpg);
	}
	.seedo {
		background-image: url(../_images/wrightbros.jpg);
	}
	.comments {
		background-image: url(../_images/comments2.jpg);
	}
	.new {
		background-image: url(../_images/new_house2.gif);
	}
	.internetphone {
		background-image: url(../_images/wifi_2.gif);
	}
	.sportcourt{
		background-image: url(../_images/bocce_ball_mark_150_150.jpg);
	}
	.elevator {
		background-image: url(../_images/elevator_696x696.jpg);
	}
	
	/*#home .panel-heading {
		background-color: #7388A3;
		color:#fff;
	}
	#home option {
		color:#cacaca;
	}*/
	.navlink {
		cursor:pointer;
		overflow:hidden;
	}
	.navlink:hover,
	.navlink > a:hover {
		background-color: #d0c099;
		color:#f8f8f0;
	}
	.navlink > a {
		text-decoration:none;
		color: #479dff;
	}
	
	.module {
		width:100%;
		background-color:#f8f6f0;
		box-shadow:1px 1px #ccc;
		border-radius: 6px;
		/*border: thin solid #e8e0cd;
		float:left;*/
		font-size: 12px;
		color: #656565;
		min-height:0;
	}
	.module-head {
		background-color: #fee9b7;
		border-radius: 6px 6px 0 0;
		border-bottom: thin solid #444; 
		padding: 2px 4px 6px;
		margin-top: 0;
	}
	.module-head > h3 {
		margin-top: 0;
		margin-bottom: 0;
		padding-left:5px;
	}
	.module-head > h4 {
		margin-left: 8px;
	}
	.module-body {
		padding: 4px 12px;
	}
	.module-body > ul {
		padding-left:20px;
	}
	.module-body h4 {
		font-size: 14px;
		margin-bottom: 3px;
		margin-top: 30px;
	}
	.module-body hr {
		color: #7765B8;
		height: 1px;
		width: 50%;
		margin: 5px auto;
	}
	.module-body > div {
		/*min-height:320px;*/
		min-height: 100%;
		height:100%;
		padding-bottom:10px;
	}
	.module-body > span {
		font-size: 10px;
		float: right;
		padding-top: 10px;
	}
	.module-body > ul li {
		margin-bottom: 6px;
	}
	.module .row {
		padding:0;
		margin:0;
	}
	.chart {
		height: 320px;
		width: 100%;
		border-top: thin solid #e8e0cd;
	}
	#chart1,
	#chart2,
	#chart3 {
		padding-left:0;
		padding-right:0;
	}
	.chart > a {
		font-size: 10px;
		float: right;
	}
	.nws_map {
		position:relative;
		top: 0;
		left: 0;
	}
	.nws_map > img {
		padding-top:20px;
	}
	.imgAfter1 {
		position:absolute;
		top:0;
		left: 0;
		margin: 0 auto;
	}
	#main_content {
		display:none;
	}
	.tile {
		border-top: thin solid #e8e0cd;
		width:100%;
	}
	.welcome {
		font-size: 18px;
		color: #f8f8f0;
		font-weight:500;
		text-shadow: 2px 2px #ddd;
		text-align:center;
		margin: 10px auto;
	}
	.forecast {
		font-size:11px;
		padding-left:10px;
		margin-bottom: 2px;
	}
	p.attn,
	li.attn {
		font-style:italic;
		color:#0000FF;
	}
	p.divider {
		text-align:center;
		color: #7765B8;
		font-size: 16px;
		margin: 5px auto;
	}
	p.highlight,
	span.highlight,
	li.highlight {
		background-color: #FF0;
	}
	/*help <pre> formatted text wrap (NOAA feed) */
	pre {
		white-space: pre-wrap;       /* css-3 */
		white-space: -moz-pre-wrap;  /* Mozilla, since 1999 */
		white-space: -pre-wrap;      /* Opera 4-6 */
		white-space: -o-pre-wrap;    /* Opera 7 */
		word-wrap: break-word;       /* Internet Explorer 5.5+ */
	}
	.modal-title {
		display:inline;
		float:none;
		padding: 3px;
		font-size:20px;
		font-weight:500;
	}
	.close {
		margin-top:0;
		margin-right: 7px;
	}
	label {
		padding-top: 6px;
		padding-right: 6px;
	}
	#help_alert {
		margin:5px 0 0;
	}
	#help_alert .alert {
		margin-bottom:0;
	}
	#login_help_form .loader {
		background-image: url(/_images/ajax-loader_1.gif);
		background-repeat: no-repeat;
		background-position:center;
		height: 25px;
		margin-top:10px;
	}
	.panel-group .panel {
		border-radius: 6px;
	}
	.panel-title {
		font-weight: 500;
		margin-top: 5px;
	}
	.panel-title > a:hover,
	.panel-title > a:focus {
		text-decoration:none;
	}
	.module-body > div.nodata {
		min-height:0;
		height:70px;
	}
	
.index > ul li,
.index > ul li a,
.steps > ul li {
	padding-top:0;
	padding-bottom: 0;
	margin-bottom: 2px;
}

.steps > li {
	list-style-type: disc;
	padding: 0 0 0 2px;
	margin-left: 25px;
	margin-bottom: 2px;	
}	

.main-content
{
	width: 680px;
	min-width: 650px;
	margin: 10px auto;
	background-color: #fff;
	padding: 37px;
	border-radius: 4px;
}
.header {
	margin-bottom: 20px;
	text-align: center;
}
.header > h3 {
	margin-bottom: 0;
}
.header > p {
	padding-bottom: 0;
	padding-top: 5px;
	margin: 0;
}

.year,
.year_open,
.itemLink,
.itemLink_open {
	cursor:pointer;
	color: #479dff;
	font-size: 14px;
	font-variant:small-caps;
	border:none;
	text-decoration:none;
	font-weight:500;
}
.year_open{
	text-decoration: underline;
	font-weight:bold;
}
.items {
	/*display: none;*/
}
.itemLink,
.itemLink_open {
	font-size:11px;
	padding-left: 10px;
}
.itemLink_open {
	text-decoration:underline;
	font-weight: bold;
}
.itemBody,
.itemBody_open {
	display:none;
	font-size: 11px;
	padding-left: 20px;
}
.itemBody_open {
	display:block;
}
.expandAll {
	font-size: 10px;
	font-variant:normal;
	display:inline-block;
	cursor:pointer;
	padding-left:15px;
	padding-bottom: 0;
	padding-top:3px;
}
/* added for pi48 v3; using this approach: 
https://www.smashingmagazine.com/2015/12/reimagining-single-page-applications-progressive-enhancement/
*/
main > * {
    display: none;
}

main > *:last-child {
    display: block;
}

main > *:target {
	display:block;
}

main > *:target ~ * {
    display: none;
}
/**** end v3 addition ***/		
