/******************************

master.css
Author:  Steve Collins, PDG + Creative 
Project: City of Sand Spring site
Date: (Begin on 10/19/07)

*******************************/

*  { 
      margin: 0px;
      padding: 0px;
      font-family: "Lucida Grande",Arial;
}

body {
  font-family: Tahoma;
  behavior: url(assets/css/csshover.htc);
  position: relative;
  }

/************************** Basic HTML Elements **********/

a {
   color: #1a76b6;
   }

li {
  list-style-type: none; 
  color: #444444;
  }
  
  select {
  	position:relative;
  	z-index:1;
  }

h3, h4 {
  color: #444444;
  }
  


dd { 
  color: #444444;
  font-size: 12px;
  }

dt { 
  color: #444444;
  font-size: 14px;
  font-weight:bold;
  }
  
  hr {
  	margin:18px 0;
  	background-color:#ccc;
  	color:#ccc;
  	height: 1px;
  }

#content h2 {
	font-size: 21px;
	color: #e6983d;
	margin: 0px 0px 10px 0px;
}

#content h3 {
	font-size: 17px;
	color: #444444;
	margin: 5px 0px 5px 0px;
}
  
#content h4 {
	font-size: 13px;
	color: #1a76b6;
	margin: 5px 0px 5px 0px;
}
  
#content h5 {
	font-size: 12px;
	color: #444444;
	margin: 5px 0px 5px 0px;
}
  
  
div.callout {
	font-size:11px;
	margin-left:15px;
}  

	div.callout h3 {
		font-weight:bold;
		font-size:14px;
	}

#content p {
  color: #444444;
  font-size: 12px;
  line-height: 17px;
  margin-bottom: 12px;
  }

#content img { 
   padding: 4px;
   border: 1px solid #d4d4d4;
   margin: 5px;
   }

#content ol li{
  font-size: 12px;
  margin: 3px 0 3px 30px;
  color: #444;
  list-style-type: decimal; 
   }
#content ul li {
  font-size: 12px;
  margin: 3px 0 3px 30px;
  list-style-type:disc;
  color: #444;
   }
   
 #weather  {
   position: relative;
   top: 182px;
   left: 660px;
   width: 208px;
   height:17px;
   background-color: #F99638;
   opacity: .70;
   filter: alpha(opacity=70); /* IE */
   padding:2px 0 1px 10px;
   font-weight:11px;
   }
   
   	#weather div.opac {
   		font-size:11px;
   		color:#fff;
   	}
   

.news_col_box p {
   font-size: 12px;
   color: #444;
  }

.news_col_box h3 {
   padding: 3px 0px 0px 9px;
   font-size: 16px;
   color: #fff;
   font-weight:normal;
  }
  
  	.news_col_box h3 a {
  		color:#fff;
  		display:block;
  		width:120px;
  	}

.news_col_box a {
   color: #1a76b6;
   text-decoration: none;
   }
  
   
   
   
 #rss a {
   color: #444444;
   text-decoration: none;
   font-size: 10px;
   padding-top: 20px;
   margin-left: 62px;
   display: block;
   font-weight: bold;
   }





 #how_to ul {
   list-style: none;
   padding-top: 5px;
   }

 #how_to a {
   background: url(../../images/small_blue_arrow.gif) no-repeat 0 50%;
   color: #fff;
   text-decoration: none;
   display: block;
   font-size: 10px;
   line-height: 10px;
   font-weight: bold;
   padding: 2px 2px 5px 12px;
   margin-left: 5px;
   }
   
  #footer a#intranet {
    color: #fff;
	text-decoration: none;
	font-size: 10px;
	font-weight: bold;
	float: right;
	}

  #contact p {
    font-size: 12px;
	color: #1a76b6;
	padding: 4px 0px 4px 0px;
	}
   
   #contact a {
    text-decoration: none;
	}
	
  #footer p {
    font-size: 11px;
	color: #fff;
	text-align: center;
	}
	
  #contact h5 {
    color: #0065b2;
	}
	
  #content tr{
    font-size: 12px;
	color: #444444;
	}
  #content tr a {
    text-decoration: none;
	color: #1a76b6;
	font-size: 12px;
	}
  #content tr a:hover{
  	color: #40a2e6;
  	}


/* Specific Styles
--------------------------------------------------*/

	

  .MultiBoxContainer {
	  z-index: 99999 !important;
  }
  #OverlayContainer {
    z-index: 999 !important;
  }
 
  select#how_to {
   width: 168px;
   margin: 11px 0px 11px 5px;
   border: none;
   background: #fff;
   position:relative;
   z-index:5;
  }
  
    #go_box #searchterm {
	 height: 14px;
	 padding:6px 3px;
     width: 133px;
	 margin: 11px 8px 0px 11px;
	 border: none;
	 float: left; 
	 font-size:12px;
	 }

    #go_button {
      background: url(../../images/bttn-go.gif) no-repeat;
	  margin: 8px 7px 0px 0px;
	  border: none;
	  height: 29px;
	  width: 42px;
	  color: #fff;
	  font-weight: bold;
	}
	
	#small_go_button {
	  background: url(../../images/small_go_button.gif) no-repeat;
	  height: 19px;
	  width: 28px;
	  color: #fff;
	  font-weight: bold;
	  border: none;
	}
	

   /* Search item styles */

 .posted a {
	font-size: 11px;
    color: #1a76b6;
    text-decoration: none;
	}
	
 .resultsbox h3 a {
   color: #e6983d;
 }
	
 .resultsbox h3 a:visited {
   color: #e6983d;
   }

 .resultsbox a:visited {
   color: #1a76b6;
   }
   
 .resultsbox a {
   color: #1a76b6;
   }
   
/* Table Styles
------------------------------*/

#pdf_list {
	padding:0px 0;
}

#pdf_list th, #pdf_list td {
  padding: 5px;
  font-size: 11px;
  text-align: left;
  padding-right: 5px;
  }
  
  #pdf_list td a {
  	color:#1A76B6;
  	text-decoration:underline;
  }


/* Layout 
--------------------------------------------------*/

#cont_wrapper {
  width: 945px;
  margin: 20px auto 0px auto;
  padding-bottom:30px;
  }

#top_bar {
  height: 33px;
  margin: 0px;
  background: url(../../images/bg_topbar.gif) repeat-x;
  }
  
#logo_area {
  height: 220px;
  padding-top: 7px;
  background: url(../../images/bg_logoarea.gif);
  }
  
  #logo {
     height: 202px;
	 width: 936px;
	 border: 1px solid #fff; 
     background: url(../../images/main_logo.jpg) no-repeat;
	 margin-left: auto;
	 margin-right: auto;
	 }
     
 #main_nav {
   height: 44px;
   background:#1A76B6;
   border-bottom:4px solid #054674;
   } 
   
  #news_col {
    width: 180px;
    float: left;
    }
 
  #how_to {
    width: 178px;
    background: #1A76B6 url(../../images/how_to_top.gif) no-repeat top;
		margin-bottom: 20px;
	}
 
  #howto_inner {
    width: 178px;
	background: url(../../images/how_to_bottom.gif) no-repeat bottom;
	padding-bottom:10px;
  }
  
  #how_to select {
  	font-size:11px;
  }

  #rss {
    height: 75px;
    background: url(../../images/rss_box.jpg) no-repeat;
    position:relative;
	}
	
	
	#registrationHide{
		margin:0px !important;
		font-size:10px !important;
		color:#0065B2 !important;
		padding:0px 0 !important;
		text-align:center;
		position:absolute;
		top:1px;
		right:1px;
		
	}
	
	#registrationLink{
		margin:23px 0 0 0 !important;
		font-size:10px !important;
		color:#0065B2 !important;
		padding:5px 0 !important;
		text-align:center;
	}
	
	#emailRegistration{
		position:absolute;
		display:none;
		width:260px;
		z-index:99;
		top:0px;
		left:180px;
		border:3px solid #1A76B6;
		padding:5px;
		background-color:#FFFFFF;
	}
	
		#emailRegistration h4{
			padding:5px 0;
		}

  #contact {
    margin: 25px 0px 15px 15px;
   }

  #content {
    width: 484px;
	float: right;
	margin-right: 34px;
	margin-bottom: 20px;
	font-size:12px;
	}
	
  #cityinfo_col {
    float: right;
	width: 220px;
    }
	 
  #go_box {
    height: 47px;
	width: 218px;
    background: #fff url(../../images/bg_go_box.gif) no-repeat;
  }
  
  .news_col_box {
     width: 178px;
	 background: #fff url(../../images/newscol_box_top.gif) no-repeat top;
	 margin-bottom: 25px;
  }
   
 #footer {
  height: 116px;
  background: url(../../images/bg_footer.gif) repeat-x;
  }
   
 #footer_cont {
   width: 945px;
   margin: 0px auto 0px auto;
   padding-top: 15px;
   }
   
 /* Navigation
 ----------------------------------- */
    
#top_bar ul {
	width: 938px;
	margin-left: auto;
	margin-right: auto;
}   
    
	#top_bar li {
		list-style: none;
		float: right;
		padding-left: 12px;
		margin-top: 9px;
		font-size: 9px;
	}
   
		#top_bar a {
			text-transform: uppercase;
			font-weight: bold;
			color: #fff;
			text-decoration: none;
		}


#archives-frame ul.tops{
	padding:5px 10px 5px 10px;
}

	#months {
		padding-left:10px;
		padding-bottom:15px;
	}


  
#main_nav ul {
	width: 975px;
	margin-left: auto;
	margin-right: auto;
	z-index:199;
	position:relative;
}

	#main_nav ul li {
		list-style: none;
		display: block;
		float: left;
		margin-right: 8px;
		font-size: 14px;
		position: relative;
		z-index:99;
	}

		#main_nav ul li a {
			background: url(../../images/dbArrow.gif) no-repeat 8px 50%;
			display: block;
			color: #fff;
			text-decoration: none;
			line-height: 44px;
			padding-left: 22px;
			padding-right: 4px;
		}

		#main_nav ul li.cParent a {
			background:url(../../images/lbActiveArrow.gif) no-repeat 8px 50%;
			background-color: #054674;
		}
		
		
		#main_nav ul li a:hover  {
			background: url(../../images/lbArrowDown.gif) no-repeat 8px 50%;
			background-color:#348CC9;

		}

			#main_nav ul li ul { /* second level ul */
				position: absolute;
				background: #3EB0FF;
				z-index:499;
				width: 185px;
				left: -999em; 
			}
			
				#main_nav ul li ul li {
					margin-right: 3px;
					width: 185px;
					font-size: 13px;
					line-height: normal;
					z-index:99;
					border-bottom:1px solid #277FBB;
				}
	
					#main_nav ul li.level-1 ul li a{
						display: block;
						padding:4px 20px 4px 10px;
						line-height: 20px;
						background-image:none;
						background-color:#348CC9;
					}
					
					#main_nav ul li ul li a:hover {
						background-image:none;
						background-color:#40a2e6;
						background-repeat:no-repeat;
						background-position: 8px 50%;
					}
					
					
					#main_nav ul li.level-1 ul li.parent a{
						background-position:165px 50%;
					}
					
					#main_nav ul li.level-1 ul li.parent a:hover{
						background-position:165px 50%;
					}
					
					
	
						#main_nav ul li ul li ul { /* third level ul */
							margin: -21px 0 0 185px;
							border-left:1px solid #1A76B6;
							border-top:1px solid #1A76B6;
							left: -999em;
						}
					   
					    #main_nav ul li ul li:hover ul {
					       left: 0px;
					       top: 20px;
					    }
					   
							#main_nav ul li.level-1 ul li.level-2 ul li.level-3 a {
								background-image:none;
							}
	
	   
							#main_nav ul li.level-1 ul li.level-2 ul li.level-3 a:hover {
								background-image:none; 
							}
								
									#main_nav ul li ul li ul li ul {  /* fourth level ul */ 
										display: none;
									}
									
										#main_nav ul ul ul li:hover ul {
											left: 0px;
					       					top: 20px;
					       					display: block;
										}
										
										#main_nav ul ul ul li:hover ul ul {
										  display: none;
										}
										
									 
									 #main_nav ul ul ul ul ul { /* fifth level */
									   display: none;
									 }
									 
									 #main_nav ul ul ul ul li:hover ul {
									   display: block
									 }
							


#main_nav li:hover ul ul {
	left: -999em;
}

#main_nav li:hover ul { 
	left: auto;
}
 
#main_nav li li:hover ul {
	left: 0px;
	top: 20px;
}
   


/* Photo Gallery */

div.images-list p  {
	float:left;
	margin:5px;
	height:160px;
	list-style-type:none;
}

ul li.nobullet {
	list-style-type:none;
}
  
	
  
  /* Sub menu items, level 2 */



/* Customize your modal window here, you can add background image too */
/* Z-index of #mask must lower than #boxes .window */
	#boxes {
		display: none;
		}

	#mask {
		position:absolute;
		z-index:9000;
		background-color:#000;
		display:none;
		}
  
	#boxes #dialog-modal {
		position:relative;
		background: black;
		border: 1px solid #ccc;
		-moz-border-radius: 5px;
		-webkit-border-radius: 5px;
		-moz-box-shadow: 2px 2px 13px #000;
		-webkit-box-shadow: 2px 2px 13px #000;
		padding: 5px 5px 5px 15px;
		width: 410px;
		height: 400px;
		display:none;
		z-index:9999;
		}

	#boxes #dialog-modal video {
		display: block;
		}

	.window .close {
		color: white;
		text-indent: 9000px;
		text-align: right;
		display: block;
		height: 23px;
		width: 23px;
		position: absolute;
		top: 10px;
		right: 15px;
		background: url(../../images/close.png) no-repeat top right;
		cursor: pointer;
		}
   

   
   
/* Additional Classes */

ul.show_bullets li {
  list-style-type: disc;
  padding: 2px;
  } 

.article {
   border-bottom: 1px solid #d4d4d4;
   margin-bottom: 14px;
   }
   
  	.article h3 {
  		margin:0px;
  		font-weight:normal;
  		font-size:14px;
  		font-style: italic;
  	}
  	
  	.article h2 {
  		font-weight:normal;
  	}
  	
  	.article img {
  		margin:10px;
  	}

.news_col_box .date {
  padding: 12px 0px 0px 0px;
  }
    
.clear {
   clear: both;
   }
   
 .hide { 
   display: none;
   }
   
 .bold {
   font-weight: bold;
   }
   
 .center {
   margin-left: auto;
   margin-right: auto;
   }
   
 .left {
   float: left;
   }
   
 .right {
   float: right;
   }
   
   
   
   #contactForm{
   
   }
   
   	#contactForm td{
   		padding:4px;
   	}