/*



	Author	:	Sonora DesignWorks



	Website	:	SonoraDesignWorks.com



*/











@import url("reset.css");























/* GENERAL



-----------------------------------------------------------------------------



-----------------------------------------------------------------------------*/











body  {



	font-family:Arial, Helvetica, sans-serif;



	background:url(../images/page-back.jpg) repeat-x #003164;



	text-align: center;



	color: #333;



}







h1 {font-size:22px; color:#FFF; margin-bottom:20px}







/* LINKS



-----------------------------------------------------------------------------*/







a:link, a:visited, a:hover, a:active {text-decoration:none}







a:link 		{color:#339}



a:visited 	{color:#339}



a:hover 	{color:#036}



a:active 	{color:#036}















/* CONTAINER



-----------------------------------------------------------------------------



-----------------------------------------------------------------------------*/







#container { 



	width: 930px;



	



	margin: 0 auto;



	text-align: left;



} 











/* HEADER



-----------------------------------------------------------------------------



-----------------------------------------------------------------------------*/











#header { 



	 



	height:216px;



	



} 







#header h1 {



	text-indent:-9999px;



	



}







#logoBox {width:309px; height:216px; background:url(../images/logo.gif); float:left}



#flashBox {width:930px; height:216px; }



#flashBox2 {width:621px; height:181px; background: #00090d; padding-top:35px; float:right}







.home-link {position:relative; left:25px}











#head-pics {background-image:url(../images/headers/about.jpg); width:930px; height:216px}



#contact-page #head-pics {background-image:url(../images/headers/7.jpg); width:930px; height:216px}






#main-map-page #head-pics,
#cat-page #head-pics,
#list-page #head-pics,
#search-page #head-pics
{background-image:url(../images/headers/bellows.jpg); width:930px; height:216px}




#comments-page
{background-image:url(../images/headers/7.jpg); width:930px; height:216px}

#instructions-page #head-pics
{background-image:url(../images/headers/skaters.jpg); width:930px; height:216px}







#comments-page #head-pics
{background-image:url(../images/headers/skate.jpg); width:930px; height:216px}











/* MAIN NAV



-----------------------------------------------------------------------------*/







#navBox{width:930px; height:49px; background:url(../images/nav-back.png) no-repeat}







.how-button {float:right; margin-right:25px; margin-top:7px}







#mainNav li {display:inline}







#mainNav a:link, #mainNav a:visited, #mainNav a:hover, #mainNav a:active {text-decoration:none}







#mainNav a:link 	{color:#339}



#mainNav a:visited 	{color:#339}



#mainNav a:hover 	{color:#036}



#mainNav a:active 	{color:#036}







/* HOME PAGE



-----------------------------------------------------------------------------*/



#homeBack {width:930px; height:494px; background:url(../images/home-back.jpg) no-repeat}







/* int PAGE



-----------------------------------------------------------------------------*/



#intBack {width:930px;  background:url(../images/contentBack.png) repeat-y;}











/* LEFT COL



-----------------------------------------------------------------------------



-----------------------------------------------------------------------------*/







#leftCol {



	float: left;



	width: 230px;



	margin-left:80px;



	text-align:center;



	padding-top:35px



}







#leftCol h3 {font-family:Arial, Helvetica, sans-serif; font-size:30px; color:#d5ed00}



#leftCol h3 span {font-size:40px; color:#fff}







/* RIGHT COL



-----------------------------------------------------------------------------



-----------------------------------------------------------------------------*/







#rightCol {



	float: right;



	width: 415px;



	



	padding:50px 70px 0 0;



}







#rightCol {font-size:11px; font-weight:bold; color:#FFF}



#rightCol span {color:#d8f000}



#rightCol .spanL {font-size:14px;}



.spanLCaps {font-size:14px; font-variant:small-caps}



























/* MAINCONTENT



-----------------------------------------------------------------------------



-----------------------------------------------------------------------------*/









#mainColContent {padding:45px 0 0 50px; width:740px}







#mainCol {font-size:11px;  color:#FFF}



#mainCol span {color:#d8f000; font-weight:bold;}



#mainCol .spanL {font-size:14px; font-weight:bold;}



#mainCol {min-height:425px; width:883px; background:url(../images/main-back.png) top right no-repeat; float:right; margin-right:5px;  margin-top:35px; }





#mainColB {min-height:425px; width:883px; background:url(../images/main-back.png) top right no-repeat; float:right; margin-right:5px;  margin-top:35px; }

#mainColContent {padding:45px 0 0 50px; width:740px}

#mainColB {font-size:11px;  color:#FFF}

#mainColB span {color:#d8f000; font-weight:bold;}

#mainColB .spanL {font-size:14px; font-weight:bold;}







.content-footer {padding-top:10px; border-top:1px solid #4e9b31;}



.content-footer p {font-weight:bold; font-size:14px; color:#4e9b31; float:left}











/* FOOTER



-----------------------------------------------------------------------------



-----------------------------------------------------------------------------*/







#footer { color:#09F; height:17px; background:url(../images/footerBack.png) top no-repeat; font-size:10px;padding:30px 0 30px 0;}
.home #footer{padding-top:10px;} 







#footer a:link, #footer a:visited {color:#09F; text-decoration:none}



#footer a:hover, #footer a:active {color:#fff; text-decoration:none}



#footer p {float:right; padding-top:15px; *margin-top:15px; padding-right:10px}







/* FORM LINKS



-----------------------------------------------------------------------------*/



input, .form-text-area {background-color:#eee; border:1px solid #d8f000;  -webkit-border-radius:10px;



-moz-border-radius:10px; padding:3px}







textarea {border:1px solid #d8f000; margin-top:4px}











.submit,.submitButton,.submitButton2 { background-color:#d8f000; color:#000; border:1px solid #fff; cursor:pointer; *border:1px; font-weight:bold; -webkit-border-radius:10px;



-moz-border-radius:10px}







.submit:hover,.submitButton:hover,.submitButton2:hover {background-color:#ffc;}











/* 



------------------------------------



Map Styles 



------------------------------------



*/



#map_canvas{



	position:relative;



	top:-25px;



	left:-20px;



}



.clear{



	clear:both;



}



.sf-menu {



	width:715px;



	position:relative;



	z-index:999;



}







#addCommentLink, .showme, .comment{



	clear:both;



	float:left;

color:#000;

}



.comment,.listViewDesc{



	display:none;



}



h3{



	margin-top:50px;



}



.smallSize{



	font-size:10px;

	font-weight:bold;

}



.infoWindow .smallSize{



	color:#000 !important;

}



.searchedOn{



position:relative;



top:-30px;



left:-22px;



}



/* 



------------------------------------



InfoWindow  - Google Map



------------------------------------



*/



.infoWindow{



	width:570px;

	height:400px;

	overflow:auto;

	color:#000;



}



.infoWindow a{



	color:#3174b1;

	text-decoration:underline;

	font-weight:bold;

	margin-right:20px;

	font-size:12px;



}



.infoWindow a:hover{



	color:#000;



}



.infoWindowTitle{



	padding:5px;

	text-align:left;

	color:#000;

	background:#edffbc;

	border:1px solid #666; 

	z-index:10;



}



#editMe{



	position:relative;

	left:35px;



}



#getDir{



	margin-top:10px;



}



#popUp{



	position:absolute;

	top:14%;

	left:34%;

	z-index:1000;

	background:#0d3b6d;

	color:#fff;

	padding-bottom:10px;

}



#closePop{

	text-align:right;

	position:relative;

	top:25px;

	right:60px;

}



#closePop a{

	color:#d7ee00;

}



#closePop a:hover{

	text-decoration:underline;

}







.infoWindow input {background-color:#eee; border:1px solid #000;  -webkit-border-radius:10px;

-moz-border-radius:10px; padding:3px; margin-left:0px; margin-bottom:5px}



.infoWindow form {padding-left:0px}



.listView {margin:25px; padding-left:5px; color:#ccc}

.listView-1{ border-left:3px solid #52aaea;padding-left:10px;}

.listView-2{ border-left:3px solid #14c721;padding-left:10px;}

.listView-3{ border-left:3px solid #d7ef00;padding-left:10px;}

.listViewDesc {color:#dcf0ff; border:1px dotted #011c38; padding:15px; margin-top:15px; background:#0d3b6d}

#mainColB .listViewDesc span{color:#fff; font-weight:normal;}

.listView b {color:#fff; font-size:12px}



h3 {font-size:16px;}







#mainColB a:link, #mainColB a:visited {color:#d7ee00; text-decoration:none}

#mainColB a:hover, #mainColB a:active {color:#52aae9 ; text-decoration:none}



#mainCol a:link, #mainCol a:visited {color:#0456ac ; text-decoration:none}

#mainCol a:hover, #mainCol a:active {color:#0456ac ; text-decoration:underline}



#mainColB li{margin-bottom:5px}



.searchedOn strong {color:#52aaea}



#mainCategories{

	text-align:right;

	padding-right:25px;

}

#mainCategories a{

	color:#d7ef00;

	margin-right:10px;

}

#mainCategories a:hover{

	color:#fff;

}



#mainCats{

	float:left;

}

#subCats{

	float:right;

}

#mainCats h3,#subCats h3{

	margin:0;

}



/* 



------------------------------------



Route Styles - directions



------------------------------------



*/



#route{



	width:175px;

	float:right;

	position:relative;

	top:-25px;

	right:15px;

	background:#fff;

	color:#000;

	border:1px solid #4b5c9a;



}



#route td{

	font-size:11px;



}



/* 



------------------------------------



Forms 



------------------------------------



*/



form{



	width:520px;

	clear:both;

	display:block;

	padding:8px;



}



label,input, select{



	display:block;

	margin-top:5px;



}



textarea{

	width:500px;

	height:250px;

	display:block;



}



#closePop{



	float:right;

	position:relative;

	top:0px;

	left:0px;



}



.submitButton{



	float:left;

	clear:both;



}



.submitButton2, #editButton{



	float:right;

	clear:both;



}



#searchForm input, #searchForm label, #categoryList input, #categoryList label{



	display:inline;



}
#categoryList h4{
	margin-top:12px;
}


#iconWindow{

	width:450px;

	position:absolute;

	top:20%;

	left:45%;

	display:none;

	z-index:10;

	background:#fff;

	border:1px solid #666;

	padding:8px;

}



/* hidden inputs */



input[type="hidden"] {

  -moz-appearance: none;

  display: none;

  padding: 0;

  border: 0;

  cursor: auto;

  -moz-user-focus: ignore;

  -moz-binding: none;

}



/* 



------------------------------------



Help Box



------------------------------------



*/



#helpBox{

	width:145px;

	height:111px;

	padding: 10px 0 4px 55px;

	text-align:left;

	color:#000;

	font-size:11px;

	background-image:url(../images/menu-popup.png);

	background-repeat:no-repeat;

	position:absolute;

	top:10%;

	left:30%;

	z-index:999;

	display:none;

}



#helpBoxBox{

	width:742px;

	float:right;

	margin-right:26px;



}



#helpBoxHome{

	width:87%;

	height:23px;

	float:left;

	padding:4px;

	text-align:left;

	background:#09F;

	border:1px solid #ccc;

}



#infoBox{

	float:right;

	position:relative;

	bottom:15px;

	right:10px;

}



#toggleLocationInfo{

	width:250px;

	height:30px;

	background:#fff;

	position:absolute;

	bottom:200px;

	left:0;

	z-index:100;

	border-left:1px solid #666;

	border-right:1px solid #666;

	border-top:1px solid #666;

	text-align:left;

	line-height:25px;

	padding-left:20px;



}



#toggleLocationInfo:hover{background-color:#a9d335;}



#toggleLocationInfo a{display:block;}



#toggleLocationInfo a:hover{text-decoration:none;}



#locationInfo{



	height:200px;

	background:#edffbc;

	position:absolute;

	bottom:0;

	left:0;

	z-index:99;

	text-align:left;

	border:1px solid #666;

}



#locationInfo p{

	padding:5px;

	line-height:1.8em;

}



#locationInfo h2{

	margin:5px 0 -8px 5px;

}



/* 



------------------------------------



Site Comments



------------------------------------



*/

#all_site_comments{
	padding-bottom:40px;
}

.site_comment{

	clear:both;

	padding:10px 0;

	border-bottom:1px solid #ccc;

	width:520px;

	margin-top:10px;



}



.site_comment span{

	display:block;



}



/* 



------------------------------------

Contact Box

------------------------------------



*/



#contactbox{

	width:510px;

	height:450px;

	color:#fff;

	background:#0d3b6d;

	padding:5px;

	border:1px solid #000;

	position:absolute;

	top:10%;

	left:35%;

	display:none;

	text-align:left;

	z-index:1000;

}

/*Position contact box on map page*/
#list-page #contactbox{
	top:10%;
	left:60%;
}

#contactbox h3{

	margin:0;

	color:#fff;

}



form a{

	color:#fff;

}



form a:hover{

	text-decoration:underline;

}

.popup_info{

	margin:25px;

	padding:0 20px;

}



/* 

------------------------------------

Category Page

------------------------------------

*/

#cat-page-main{

	float:left;

}

#cat-page-sub{

	float:right;

}

.float-left{

	float:left;

}

.float-right{

	float:right;

}

.cat_name{

	font-size:13px;

	color:#fff;

}

.subCatsAll{

	margin-top:25px;

	padding-left:15px;

	border-left:4px solid #044f9e;

}



/* Looking For Sprites */
#comment-sprite{
width:327px;
height:52px;
display:block;
background: transparent url(../images/comment-sprite.gif) no-repeat left top;
text-indent:-999999px;
margin:40px;
}
#comment-sprite:hover{
background: transparent url(../images/comment-sprite.gif) no-repeat left -52px;
}
/*
#jobs{
width:140px;
height:72px;
display:block;
background: transparent url(../images/buttons/jobs-sprite.png) no-repeat left top;
text-indent:-999999px;
position:relative;
left:44px;
}
#jobs:hover{
background: transparent url(../images/buttons/jobs-sprite.png) no-repeat -144px top;
}

#community-service{
width:160px;
height:72px;
display:block;
background: transparent url(../images/buttons/community-sprite.png) no-repeat left top;
text-indent:-999999px;
position:relative;
left:40px;
}
#community-service:hover{
background: transparent url(../images/buttons/community-sprite.png) no-repeat -162px top;
}

#food{
width:112px;
height:72px;
display:block;
background: transparent url(../images/buttons/food-sprite.png) no-repeat left top;
text-indent:-999999px;
position:relative;
left:60px;
}
#food:hover{
background: transparent url(../images/buttons/food-sprite.png) no-repeat -117px top;
}
*/


#instructions{
position:relative;
top:15px;
left:27px;
}

.longText #mainColContent{
width:70%;
margin:auto;
position:relative;
left:-50px;
}

.longText #mainColContent b{
color:#D1EC00;
}

#mainCol #mainColContent a{
color:#D1EC00;
}

#mainCol #mainColContent .infoWindow a{
color:#000;
}



.longText b{
color:#D1EC00;
}

.listViewDesc br{
	margin-bottom:-5px;	
}

.longText ul{
list-style-type:disc;
}

.listView strong{
color:#D7EE00;
}
.listView{
	line-height:1.2em;
	font-size:1.1em;
}
.listView b{
	font-weight:normal;
	font-size:1.2em;
}
.listView .listViewDesc{
	line-height:1.4em;
}

#rightCol .spanL .secondary-text{
color:#fff;	
font-size:12px;
}

#fb-like{
	position:relative;
	top:4px;
	left:6px;
}

#recent-events-hdr{
margin-top:10px;
margin-bottom:3px;
font-size:14px;
}
#recent-events div{
	width:180px;
}
#recent-events a{
color:#fff;
font-size:0.9em;
font-weight:normal;
}



/* Thickbox styles START here */

/* ----------------------------------------------------------------------------------------------------------------*/
/* ---------->>> global settings needed for thickbox <<<-----------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/
*{padding: 0; margin: 0;}
/* ----------------------------------------------------------------------------------------------------------------*/
/* ---------->>> thickbox specific link and font settings <<<------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/
#TB_window {
  font: 12px Arial, Helvetica, sans-serif;
  color: #333333;
}
#TB_secondLine {
  font: 10px Arial, Helvetica, sans-serif;
  color:#666666;
}
#TB_window a:link {color: #666666;}
#TB_window a:visited {color: #666666;}
#TB_window a:hover {color: #000;}
#TB_window a:active {color: #666666;}
#TB_window a:focus{color: #666666;}
/* ----------------------------------------------------------------------------------------------------------------*/
/* ---------->>> thickbox settings <<<-----------------------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/
#TB_overlay {
  position: fixed;
  z-index:100;
  top: 0px;
  left: 0px;
  height:100%;
  width:100%;
}
.TB_overlayMacFFBGHack {background: url(macFFBgHack.png) repeat;}
.TB_overlayBG {
  background-color:#000;
  filter:alpha(opacity=75);
  -moz-opacity: 0.75;
  opacity: 0.75;
}
* html #TB_overlay { /* ie6 hack */
     position: absolute;
     height: expression(document.body.scrollHeight > document.body.offsetHeight ? document.body.scrollHeight : document.body.offsetHeight + 'px');
}
#TB_window {
  position: fixed;
  background: #ffffff;
  z-index: 102;
  color:#000000;
  display:none;
  border: 4px solid #525252;
  text-align:left;
  top:50%;
  left:50%;
  z-index:2000;
}
* html #TB_window { /* ie6 hack */
position: absolute;
margin-top: expression(0 - parseInt(this.offsetHeight / 2) + (TBWindowMargin = document.documentElement && document.documentElement.scrollTop || document.body.scrollTop) + 'px');
}
#TB_window img#TB_Image {
  display:block;
  margin: 15px 0 0 15px;
  border-right: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
  border-top: 1px solid #666;
  border-left: 1px solid #666;
}
#TB_caption{
  height:25px;
  padding:7px 30px 10px 25px;
  float:left;
}
#TB_closeWindow{
  height:25px;
  padding:11px 25px 10px 0;
  float:right;
}
#TB_closeAjaxWindow{
  padding:7px 10px 5px 0;
  margin-bottom:1px;
  text-align:right;
  float:right;
}
#TB_ajaxWindowTitle{
  float:left;
  padding:7px 0 5px 10px;
  margin-bottom:1px;
}
#TB_title{
  background-color:#e8e8e8;
  height:27px;
}
#TB_ajaxContent{
  clear:both;
  padding:2px 15px 15px 15px;
  overflow:auto;
  text-align:left;
  line-height:1.4em;
}
#TB_ajaxContent.TB_modal{
  padding:15px;
}
#TB_ajaxContent p{
  padding:5px 0px 5px 0px;
}
#TB_load{
  position: fixed;
  display:none;
  height:13px;
  width:208px;
  z-index:103;
  top: 50%;
  left: 50%;
  margin: -6px 0 0 -104px; /* -height/2 0 0 -width/2 */
}
* html #TB_load { /* ie6 hack */
position: absolute;
margin-top: expression(0 - parseInt(this.offsetHeight / 2) + (TBWindowMargin = document.documentElement && document.documentElement.scrollTop || document.body.scrollTop) + 'px');
}
#TB_HideSelect{
  z-index:99;
  position:fixed;
  top: 0;
  left: 0;
  background-color:#fff;
  border:none;
  filter:alpha(opacity=0);
  -moz-opacity: 0;
  opacity: 0;
  height:100%;
  width:100%;
}
* html #TB_HideSelect { /* ie6 hack */
     position: absolute;
     height: expression(document.body.scrollHeight > document.body.offsetHeight ? document.body.scrollHeight : document.body.offsetHeight + 'px');
}
#TB_iframeContent{
  clear:both;
  border:none;
  margin-bottom:-1px;
  margin-top:1px;
  _margin-bottom:1px;
}


/* Thickbox styles END here */


/*
.youtube #mainColContent{
width:830px
}
#mainCol #mainColContent #youtube_videos iframe{
	display:none;
}
#mainCol #mainColContent #youtube_videos a{
	font-size:14px;
}
*/


#youtube_video{
width:235px;
height:175px;
background:#fff;
text-align:center;
}
#youtube_video img{
margin-top:15%;
}
#youtube_thumbs img{
	width:54px;
	height:54px;
	cursor:pointer;
	border:1px solid #000;
}
#youtube_thumbs img:hover{
	border-color:#ccc;
}
#youtube_thumbs{
	margin-top:3px;
}
#youtube_title{
	position:relative;
	top:-10px;
}
.home #rightCol{
	width:440px;
	padding-top:30px;
}
#youtube_widget{
	width:235px;
	float:right;
	position:relative;
left:25px;
top:0px;
background:#4e9b31;
padding:8px;
border:1px solid #71bf53;
font-weight:normal;
}
#youtube_widget h2{font-weight:normal;margin-bottom:4px;text-align:center;}
#rightCol #youtube_title{
color:#fff;
}
#youtube_videos{
	float:left;
	margin-bottom:20px;
}
#youtube_videos img{
border:1px solid #000;
}
#youtube_videos div{
	width:150px;
	float:left;
margin-right:15px;
text-align:center;
}
#youtube_videos img:hover{
border: 1px solid #ccc;
}


#getting_there_box {
	width:470px;
    background: none repeat scroll 0 0 #4E9B31;
    border: 1px solid #71BF53;
    font-weight: normal;
    padding: 8px;
    clear:both;
}
