/* CSS formatting for Madison Parks Pages */

#main,
#main #nav_menu {
	border-color: #669933;
}

ul#sub_nav li {
	background-color:#CCCC66;
}

ul#sub_nav li a {
	color: #FFFFFF;
	background-color: #548a2c;
}

ul#sub_nav li li a {
	color: #000000;
	background-color: #EEFFAA;
}

ul#sub_nav li a:hover,
ul#sub_nav li li a:hover {
	background-color: #CCCC66;
	color:#000000;
}

ul#sub_nav li ul {
	border-top: 0;
	left: -2px;
}

ul#sub_nav li li {
	border-color: #CCCC66;
	border-width:  0 2px 2px 2px;
}

ul#sub_nav li.home { width: 69px; }
ul#sub_nav li.home a { width: 55px; }

ul#sub_nav li.explore { width: 125px; }
ul#sub_nav li.explore a { width: 113px; }
ul#sub_nav li.explore ul, ul#sub_nav li.explore li { width: 128px; }
ul#sub_nav li.explore li a { width: 118px; }

ul#sub_nav li.play { width: 70px; }
ul#sub_nav li.play a { width: 58px; }
ul#sub_nav li.play ul, ul#sub_nav li.play li { width: 120px; }
ul#sub_nav li.play li a { width: 110px; }

ul#sub_nav li.activities { width: 110px; }
ul#sub_nav li.activities a { width: 98px; }
ul#sub_nav li.activities ul, ul#sub_nav li.activities li { width: 135px; }
ul#sub_nav li.activities li a { width: 125px; }

ul#sub_nav li.plan { width: 70px; }
ul#sub_nav li.plan a { width: 58px; }
ul#sub_nav li.plan ul, ul#sub_nav li.plan li { width: 110px; }
ul#sub_nav li.plan li a { width: 100px; }

ul#sub_nav li.services { width: 90px; }
ul#sub_nav li.services a { width: 78px; }
ul#sub_nav li.services ul, ul#sub_nav li.services li { width: 128px; }
ul#sub_nav li.services li a { width: 118px; }

ul#sub_nav li.seasonal { width: 100px; }
ul#sub_nav li.seasonal a { width: 88px; }
ul#sub_nav li.seasonal ul, ul#sub_nav li.seasonal li { width: 138px; }
ul#sub_nav li.seasonal li a { width: 128px; }

ul#sub_nav li.volunteer { width: 90px; }
ul#sub_nav li.volunteer a { width: 78px; }
ul#sub_nav li.volunteer ul, ul#sub_nav li.volunteer li { width: 168px; }
ul#sub_nav li.volunteer li a { width: 158px; }

ul#sub_nav li.kids { width: 67px; }
ul#sub_nav li.kids a { width: 55px; }
ul#sub_nav li.kids ul, ul#sub_nav li.kids li { width: 120px; }
ul#sub_nav li.kids li a { width: 110px; }

ul#sub_nav li.calendar { width: 89px; }
ul#sub_nav li.calendar a { width: 77px; }
ul#sub_nav li.calendar ul, ul#sub_nav li.kids li { width: 120px; }
ul#sub_nav li.calendar li a { width: 110px; }

ul#sub_nav li.projects { width: 77px; }
ul#sub_nav li.projects a { width: 65px; }
ul#sub_nav li.projects ul, ul#sub_nav li.kids li { width: 120px; }
ul#sub_nav li.projects li a { width: 110px; }

ul#sub_nav li.about { width: 79px; }
ul#sub_nav li.about a { width: 67px; }
ul#sub_nav li.about ul, ul#sub_nav li.about li { width: 120px; }
ul#sub_nav li.about li a { width: 110px; }

ul#sub_nav li.contact { width: 90px; }
ul#sub_nav li.contact a { width: 78px; }
ul#sub_nav li.contact ul, ul#sub_nav li.contact li { width: 100px; }
ul#sub_nav li.contact li a { width: 90px; }
ul#sub_nav li.contact ul { left: -14px; } /* moves dropdown to the left */

.helperText{
	font-size: 10px;
	color: #444444;
}

/***********************************
   	   GRAY TITLE
************************************/
.title_gray {
	margin: 0;
	margin-bottom: 5px;
	padding: 1px;
	padding-left: 3px;
	background-color:#bbbbbb;
	color:#ffffff;
	text-transform:uppercase;
	font: bold 14px Trebuchet MS, Verdana, Arial, Helvetica, sans-serif;
}


/***********************************
   		BANNER IMAGE OVERLAY
************************************/
.columnSingle div.banner_overlay { background: url(../parks/images/bannerSingle.jpg) no-repeat 3px 3px; }
.columnQuarter div.banner_overlay { background: url(../parks/images/bannerQuarter.jpg) no-repeat 3px 3px; }
.columnDouble div.banner_overlay { background: url(../parks/images/bannerDouble.jpg) top left no-repeat; }
.columnHalf div.banner_overlay { background: url(../parks/images/bannerHalf.jpg) top left no-repeat; }
.columnTriple div.banner_overlay { background: url(../parks/images/bannerTriple.jpg) top left no-repeat; }
.columnThreeQuarter div.banner_overlay { background: url(../parks/images/bannerThreeQuarter.jpg) top left no-repeat; }
.columnFull div.banner_overlay { background: url(../parks/images/bannerFull.jpg) top left no-repeat; }

/* fixes content spacing from WYSIWYG editor */
.outline_box_banner .body p {
	margin: 0 0 8px 0;	
}

/***********************************
  			HIGHLIGHTS
************************************/

.highlights .highlights_content { height: 245px; }

.highlights ul, .highlights li, .columnDouble .jcarousel-clip-horizontal, .columnDouble .jcarousel-item { height: 210px; }

.highlights h2 a {
	text-decoration: none;
	color: #000000;
	font-family: "Trebuchet MS";
}

.jcarousel-navigation .previous,
.jcarousel-navigation .next,
.jcarousel-control a:hover,
.jcarousel-control a.active {
	background-color: #555555;
}

.jcarousel-navigation a.previous:hover,
.jcarousel-navigation a.next:hover  {
	background-color: #333333;
}


/***********************************
   FACILITY LINK LIST (WITH ICONS)
************************************/
.facilities a {
	padding: 0 6px 0 12px;
	text-decoration: none;
	border-bottom: 1px solid #CCCCCC;
}

.facilities a {
	height: 26px;
	line-height: 26px;
}

.facilities img {
	border: 0;
	padding: 0;
	margin: 0 6px 3px 0;
}


/***********************************
 FACILITY LARGE LINK LIST (WITH ICONS)
************************************/
.facilities_large a {
	padding: 0 6px 0 12px;
	text-decoration: none;
	border-bottom: 1px solid #CCCCCC;
}

.facilities_large a {
	height: 36px;
	line-height: 36px;
	font-size: 13px;
}

.facilities_large img {
	border: 0;
	padding: 0;
	margin: 0 6px 3px 0;
}

/* Column Widths */
.columnDouble .facilities_large a { width: 218px; }
.columnHalf .facilities_large a { width: 211px; }


/***********************************
    THREE COLUMN LIST
************************************/
.three_column { 
	margin-bottom: 12px;
	padding: 0;
	float: left;
	clear: both;
}

.three_column ul {
	float: left;
	padding: 0;
	margin: 0;
	list-style: none; 
	border-left: 1px solid #CCCCCC;
}

.three_column li {
	float: left;
}

.three_column a {
	display: block;
	width: 298px;
	padding: 4px 6px;
	text-decoration: none;
	border: 1px solid #CCCCCC; 
	border-width: 0 1px 1px 0;
}

.three_column a:hover {
	background-color: #EEEEEE;
}

/* Column Widths */
.columnFull .three_column a { width: 298px; }


/***********************************
   	    FACILITY DETAIL BOXES
************************************/
.facility_list {
	min-height: 12px;
	margin-bottom: 12px;	
}

.facility_row {
	/*float: left;
	clear: left;*/
}

#main .leftFacility {
	/*clear: left;	*/
}

#main .rightFacility {
	margin-right: 0;	
}

.facility {
	float: left;
	width: 345px;
	vertical-align: top;
	margin-right: 12px;
}

.facility .title {
	padding: 3px;	
	border-bottom: 1px solid #CCCCCC;
}

.facility .title h2 {
	padding: 3px 6px;
	background-color: #669933;
	min-height:17px;
	color: #FFFFFF;
}

/***********************************
     CALENDAR STYLES (FOR HOMEPAGE)
************************************/
.events {
	margin-left: 170px;
}

.events ul {
	padding: 0;
	margin: 0;
	border-left: 1px solid #CCCCCC;
	border-bottom: 1px solid #CCCCCC;
	list-style: none;
	font-size: 11px;
}

.events li {
	display: block;
	padding: 4px 6px;
	border-top: 1px solid #CCCCCC;
	border-right: 1px solid #CCCCCC;
	text-decoration: none;
	list-style: none;
}

.events li.title {
	background-color: #AAAAAA;
	color: #FFFFFF;
	font-size: 12px;
	font-weight: bold;
}

/* Dark background for alternating list rows */
li.dark {
	background-color: #EEEEEE;
}


/***********************************
   	 MODAL WINDOW POPUP STYLES
************************************/
div#nyroModalFull {
	/*font-size: 12px;
	color: #333;*/
}
div#nyroModalLoading {
	border: 4px solid #777;
	width: 150px;
	height: 150px;
	text-indent: -9999em;
	background: #fff url(../images/modal/ajaxLoader.gif) no-repeat;
	background-position: center;
}
div#nyroModalLoading.error {
	border: 4px solid #f66;
	line-height: 20px;
	padding: 20px;
	width: 300px;
	height: 100px;
	text-indent: 0;
	background: #fff;
}
div#nyroModalWrapper {
	background: #fff;
	border: 4px solid #777;
}
a#closeBut {
	position: absolute;
	display: block;
	top: -13px;
	right: -13px;
	width: 12px;
	height: 12px;
	text-indent: -9999em;
	background: url(../images/modal/close.gif) no-repeat;
	outline: 0;
}
h1#nyroModalTitle {
	margin: 0;
	padding: 0;
	position: absolute;
	top: -22px;
	left: 5px;
	font-size: 12px;
	color: #ddd;
}
div#nyroModalContent {
	overflow: auto;
}
div.wrapper div#nyroModalContent {
	padding: 5px;
}
div.wrapperImg div#nyroModalContent {
	position: relative;
	overflow: hidden;
	text-align: center;
}
div.wrapperImg img {
	vertical-align: baseline;
}
div.wrapperImg div#nyroModalContent div {
	position: absolute;
	bottom: 0;
	left: 0;
	background: black;
	padding: 10px;
	margin: 10px;
	border: 1px white dotted;
	overflow: hidden;
	opacity: 0.2;
	filter: alpha(opacity=20);
}
div.wrapperImg div#nyroModalContent div:hover {
	opacity: 0.5;
	filter: alpha(opacity=50);
	cursor: help;
}
a.nyroModalPrev, a.nyroModalNext {
	z-index: 105;
	outline: none;
	position: absolute;
	top: 0;
	height: 100%;
	width: 40%;
	cursor: pointer;
	text-indent: -9999em;
	background: left 20% no-repeat;
	background-image: url(data:image/gif;base64,AAAA); /* Trick IE6 */
}
div.wrapperSwf a.nyroModalPrev, div.wrapperSwf a.nyroModalNext, div.wrapper a.nyroModalPrev, div.wrapper a.nyroModalNext {
	height: 60%;
	width: 20%;
}
a.nyroModalPrev {
	left: 0;
}
a.nyroModalPrev:hover {
	background-image: url(../images/modal/prev.gif);
}
a.nyroModalNext {
	right: 0;
	background-position: right 20%;
}
a.nyroModalNext:hover {
	background-image: url(../images/modal/next.gif);
}

div#rotatingImages {
   position: absolute;
   overflow: hidden;
   left: -9999px; 
   top: -9999px;
   height: 1px;
   width: 1px;
}

/***********************************
   	   MAP INFO WINDOWS
************************************/
.parkInfoWindow {
	width:250px;
}

.parkInfoWindow img{
	margin: 3px 4px 0px 0px;
}


/***********************************
   	   CALENDAR STYLES
************************************/
#main .mini_calendar .calendar_title {
	background-color: #65ACE0;
	color: #FFFFFF;
}
/*
#main .search_calendar #submit {
	background-color: #548a2c;
	color: #FFFFFF;
	border: 2px solid #548a2c;
}
*/

/***********************************
   	  SHELTER PRICES
************************************/
.shelterFeeStructure{
	float:left;
	width:335px;
	margin-bottom:19px;
}
div.shelterFeeStructure .lightRow{
	background-color:#eeeeee;
}
div.shelterFeeStructure .darkRow{
	background-color:#dedede;
}
.rightFee{
		margin-right:0px;
}
.leftFee{
	margin-right:18px;
}

/***********************************
   	  two column list text size
************************************/

.two_column a {
	font-size:11px;
}

/***********************************
   	  scroll for calendar
************************************/
ul.scroll {
	height: 170px; 
	overflow: -moz-scrollbars-vertical; 
	overflow-y: scroll;
	border:0;
	border-bottom:1px solid #999;
}


/***********************************
   	   ALERT STYLES
************************************/

.outline_box.alert {
	background:#ffc;
	border:1px solid #dd5;
	padding:0;
	line-height:18px;
}

.outline_box.alert .body {
	margin:0;
	border:1px dashed #ff5;
	padding:20px;
}

/***********************************
   	   social media box
************************************/

ul.socialmedia {
	list-style:none;
	margin:0 0 5px 25px;
}

.outline_box_banner .body ul.socialmedia img {
	margin: 5px 0 -3px 0;
	float:none;
}

ul.socialmedia a {
	text-decoration:none;
}