/* CSS formatting for Main City Homepage */

#main #body {
	border: 1px solid #003366;
	border-right: 0;
	width: 555px;
	margin: 0;
	padding: 5px;
	vertical-align: top;
}

#main #right {
	border-left: 0;
	width: 170px;
	vertical-align: top;
	margin-left: 0;
	padding: 5px;
	background-color: #F3F3F3;
}

/* All links */
a {
	color: #336699;
}

a:hover {
	color: #003366;
}

#main #body table, #main #body tr, #main #body td, 
#main #right table, #main #right tr, #main #right td {
	border: 0;
}

#main #body td {
	margin: 0;
	padding: 0 0 5px 0;
	vertical-align: top;
}

#main #body td td {
	padding-bottom: 0;
}

.box {
	margin: 0;
}



/**************************
	Content Boxes Styles 
***************************/

.outline_box_homepage {
	border: 1px solid #999999;
	margin: 0;
	padding: 0;
	background-color: #FFFFFF;
}

.outline_box_homepage .body {
	margin: 0;
	padding: 10px;
}

.outline_box_homepage img {
	padding: 3px;
	border: 0;
}

.outline_box_homepage ul {
	padding: 0;
	margin: 0 0 0 16px;
}



#main #body .outline_box_banner {
	margin-right: 8px;
	margin-bottom: 0;
}


/**************************
	City News - homepage specific styles
***************************/

/* Four important links on right side of City News element */
#main #news_links_right {
	margin: 0;
	padding: 0 0 0 2px;
	border-left: 1px solid #FFFFFF;
	background-color: #EEEEEE;
}

#main #news_links_right ul {
	padding: 0;
	margin: 0;
	list-style: none;
}

#main #news_links_right li {
	background: #FFFFFF;
}

#main #news_links_right a {
	display: block;
	margin: 0 0 2px 0;
	padding: 5px 0 5px 10px;
	width: 162px; /*125px;*/
	color: #000000;
	background-color: #DDE4EB;
	text-decoration: none;
}

#main #news_links_right a:hover, #main #news_links_right a:hover .box_lightblue_right * {
	background-color: #C6D9EC;
}

#main #news_links_right li.top a {
	padding-top: 0;
}

#main #news_links_right li.bottom a {
	padding-bottom: 0;
	margin: 0;
}
  
/* News Release/Incident Reports Links */
#main #news_links_bottom {
	margin: 0;
	padding: 0;
	background-color: #EEEEEE;
	vertical-align: bottom;
}

#main #news_links_bottom ul {
	padding: 0;
	margin: 0;
	list-style: none;
	background-color: #EEEEEE;
}

#main #news_links_bottom li {
	float: left;
	background-color: #EEEEEE;
}

#main #news_links_bottom a {
	display: block;
	margin: 0;
	padding: 5px 0;
	text-align: center;
	color: #000000;
	background-color: #AAAAAA; /*#336699;*/
	margin-right: 2px;
	text-decoration: none;
}

#main #news_links_bottom a:hover, 
#main #news_links_bottom a:hover .box_darkgray_left *, 
#main #news_links_bottom a:hover .box_darkgray_right * {
	background-color: #777777;
	color: #FFFFFF;
}

/* CITY NEWS */
#slider1 .contentdiv {
	padding: 5px 5px 8px 5px;
}

#paginate-slider1 {
	padding: 0;
	margin: 0 0 0 46px;
	width: 450px; /*280px;*/
}

#slider1 a {
	font-weight: bold;
}

#paginate-slider1 .previous {
	float: left;
	display: block;
	font-weight: bold;
}

#paginate-slider1 .next {
	float: right;
	display: block;
	font-weight: bold;
}

/* WHAT'S NEW ON THE SITE */
#slider2 .contentdiv {
	padding: 5px; 
}

#paginate-slider2 {
	padding: 2px 0 0 0;
	margin: 0 5px 0 5px;
}

#paginate-slider2 .previous {
	float: left;
	display: block;
}

#paginate-slider2 .next {
	float: right;
	display: block;
}

#paginate-previous-slider2 .previous {
	float: left;
	display: block;
}

#paginate-next-slider2 .next {
	float: right;
	display: block;
}

#slider2 .contentdiv img {	
	float: left; 
	margin: 0 5px 0 0;
}

#slider2 .pagination .previous {
	float: left;
}

#slider2 .pagination .next {
	float: right;
}


/* News Links Right */
.box_lightblue_right{display:block; background-color: #FFFFFF;}
.box_lightblue_right *{
  display:block;
  height:1px;
  overflow:hidden;
  font-size:.01em;
  background:#DDE4EB}
.box_lightblue_right1{
  margin-right:3px;
  padding-right:1px;
  border-right:1px solid #f0f3f6;
  background:#e5eaf0}
.box_lightblue_right2{
  margin-right:1px;
  padding-right:1px;
  border-right:1px solid #fbfcfd;
  background:#e3e9ee}
.box_lightblue_right3{
  margin-right:1px;
  border-right:1px solid #e3e9ee;}
.box_lightblue_right4{
  border-right:1px solid #f0f3f6}
.box_lightblue_right5{
  border-right:1px solid #e5eaf0}

/* News Links Bottom */
.box_darkgray_left, .box_darkgray_right{display:block; background-color: #FFFFFF;}
.box_darkgray_left *{
  display:block;
  height:1px;
  overflow:hidden;
  font-size:.01em;
  background:#AAAAAA}
.box_darkgray_left1{
  margin-left:3px;
  padding-left:1px;
  border-left:1px solid #dadada;
  background:#bfbfbf}
.box_darkgray_left2{
  margin-left:1px;
  padding-right:1px;
  border-left:1px solid #f6f6f6;
  background:#bababa}
.box_darkgray_left3{
  margin-left:1px;
  border-left:1px solid #bababa;}
.box_darkgray_left4{
  border-left:1px solid #dadada;}
.box_darkgray_left5{
  border-left:1px solid #bfbfbf;}

.box_darkgray_right{display:block; background-color: #EEEEEE;}
.box_darkgray_right *{
  display:block;
  height:1px;
  overflow:hidden;
  font-size:.01em;
  background:#AAAAAA}
.box_darkgray_right1{
  margin-right:3px;
  padding-right:1px;
  border-right:1px solid #dadada;
  background:#bfbfbf}
.box_darkgray_right2{
  margin-right:1px;
  padding-right:1px;
  border-right:1px solid #f6f6f6;
  background:#bababa}
.box_darkgray_right3{
  margin-right:1px;
  border-right:1px solid #bababa;}
.box_darkgray_right4{
  border-right:1px solid #dadada;}
.box_darkgray_right5{
  border-right:1px solid #bfbfbf;}
  
.box_darkgrayinverse_left{display:block; background:#AAAAAA; width: 5px; }
.box_darkgrayinverse_left *{
  display:block;
  height:1px;
  overflow:hidden;
  font-size:.01em;
  background:#EEEEEE; }
.box_darkgrayinverse_left1{
  margin-left:3px;
  padding-left:1px;
  border-left:1px solid #c7c7c7;
  background:#dddddd}
.box_darkgrayinverse_left2{
  margin-left:1px;
  padding-left:1px;
  border-left:1px solid #b0b0b0;
  background:#e1e1e1}
.box_darkgrayinverse_left3{
  margin-left:1px;
  border-left:1px solid #e1e1e1;}
.box_darkgrayinverse_left4{
  border-left:1px solid #c7c7c7;}
.box_darkgrayinverse_left5{
  border-left:1px solid #dddddd;}
  
.box_blue_left {display:block; background-color: #FFFFFF;}
.box_blue_left *{
  display:block;
  height:1px;
  overflow:hidden;
  font-size:.01em;
  background:#336699;}
.box_blue_left1{
  margin-left:3px;
  padding-left:1px;
  border-left:1px solid #a7bdd3;
  background:#668cb2}
.box_blue_left2{
  margin-left:1px;
  padding-left:1px;
  border-left:1px solid #eaeff4;
  background:#5983ac}
.box_blue_left3{
  margin-left:1px;
  border-left:1px solid #5983ac;}
.box_blue_left4{
  border-left:1px solid #a7bdd3}
.box_blue_left5{
  border-left:1px solid #668cb2}
  
.box_blue_right {display:block; background-color: #FFFFFF;}
.box_blue_right *{
  display:block;
  height:1px;
  overflow:hidden;
  font-size:.01em;
  background:#336699;}
.box_blue_right1{
  margin-right:3px;
  padding-right:1px;
  border-right:1px solid #a7bdd3;
  background:#668cb2}
.box_blue_right2{
  margin-right:1px;
  padding-right:1px;
  border-right:1px solid #eaeff4;
  background:#5983ac}
.box_blue_right3{
  margin-right:1px;
  border-right:1px solid #5983ac;}
.box_blue_right4{
  border-right:1px solid #a7bdd3}
.box_blue_right5{
  border-right:1px solid #668cb2}
  
.box_blueinverse_left {display:block; background-color: #336699; width: 5px;}
.box_blueinverse_left *{
  display:block;
  height:1px;
  overflow:hidden;
  font-size:.01em;
  background:#FFFFFF;}
.box_blueinverse_left1{
  margin-left:3px;
  padding-left:1px;
  border-left:1px solid #8aa7c4;
  background:#ccd8e5}
.box_blueinverse_left2{
  margin-left:1px;
  padding-left:1px;
  border-left:1px solid #4775a3;
  background:#d8e1eb}
.box_blueinverse_left3{
  margin-left:1px;
  border-left:1px solid #d8e1eb;}
.box_blueinverse_left4{
  border-left:1px solid #8aa7c4;}
.box_blueinverse_left5{
  border-left:1px solid #ccd8e5;}


#main #body .homepage_title_blue {
	background-color: #336699;
	color: #FFFFFF;
	padding: 0 0 0 20px;
	width: 220px;
	float: left;
	font-weight: bold;
}

#main #body .homepage_title_mediumgray {
	background-color: #999999;
	color: #FFFFFF;
	font-weight: bold;
	text-transform: uppercase;
	padding: 0 5px 5px 20px;
}

/* CITY HIGHLIGHTS */
#main #body #highlights {
	
}

#main #body #highlights .item {
	padding: 5px; 
	border-left: 1px solid #CCCCCC;
	border-right: 1px solid #CCCCCC;
	border-bottom: 1px dashed #CCCCCC;
	vertical-align: middle;
}

#main #body #highlights .item img {	
	float: left; 
	margin: 0 5px 0 0;
}

#main #body #highlights .last {
	border-bottom: 1px solid #CCCCCC;
}


/* MOST REQUESTED SERVICES */
#main #body #most_requested {
	padding: 0;
	margin: 0;
	border-left: 1px solid #CCCCCC;
	list-style: none;
	height: 99px; 
	overflow: -moz-scrollbars-vertical; 
	overflow-y: scroll; 
	border-bottom: 1px solid #CCCCCC;
}

#main #body #most_requested a {
	display: block;
	width: 316px;
	padding: 4px 6px;
	border-bottom: 1px solid #CCCCCC;
	text-decoration: none;
}

#main #body #most_requested a:hover {
	background-color: #EEEEEE;
}

/**************************
	Right Column Styles 
***************************/
#main #right .outline_box_homepage, 
#main #right .outline_box_banner,  
#main #right .outline_box_noimage, 
#main #right .outline_box_image {
	margin: 0 0 5px 0;
}

.ad {
	background-color: #FFFFFF;
	margin: 0 0 5px 0;
	width: auto; /*166px;*/
}

.ad a {
	width: auto; /*146px;*/
}

.image_ad {
	background-color: #FFFFFF;
	margin: 0 0 5px 0;
}

.image_ad a {
	display: block;
	border: 1px solid #CCCCCC;
	padding: 0;
	margin: 0;
}

.image_ad a:hover {
	border: 1px solid #999999;
	color: #000000;
}

.image_ad a img {
	padding: 3px;
	margin: 0;
}

/**************************
   Right Dropdown Menus 
***************************/
ul#sub_nav { /* all lists */
	padding: 0;
	margin: 0;
	list-style: none;
	display: block;
	border-top: 2px solid #336699;
	width: 184px;
}

ul#sub_nav li { /* all list items */
	position: relative;
	float: left;
	border: 0;
	margin: 0;
	padding: 0;
	z-index: 400;
}

/* to override top and left in browsers other than IE, which will position to the 
top right of the containing li, rather than bottom left */
li > ul { 
	top: auto;
	left: auto;
}

ul#sub_nav li ul { /* second-level lists */
	list-style: none;
	display: none;
	border-top: 1px solid #999999;
	position: absolute;
	top: -1px;
	left: 100%;
	padding: 0;
	margin: 0;
	z-index: 400;
}

ul#sub_nav li li {
	height: auto;
	width: auto;
	background-color: #FFFFFF;
	border: 0;
	padding: 0;
}

ul#sub_nav a {
	font-size: 12px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	text-align: left;
	color: #000000;
	text-decoration: none;
	z-index: 400;
}

ul#sub_nav li a {
	width: 170px;
	padding: 6px;
	display: block;
	border: 1px solid #CCCCCC;
	border-width: 0 1px 1px 1px;
}

ul#sub_nav li a:hover {
	display: block;
	background-color: #E3E3E3;
	border-left: 2px solid #336699;
	border-right: 2px solid #336699;
	border-bottom: 1px solid #CCCCCC;
	padding: 6px 5px 6px 5px;
}

ul#sub_nav li > a {
	padding: 6px 6px 5px 6px;
}

ul#sub_nav li > a:hover {
	padding: 6px 5px 5px 5px;
}

ul#sub_nav li li a {
	height: auto;
	width: 145px;
	background-color:#FFFFFF;
	padding: 3px 5px 3px 5px;
	border: 1px solid #999999;
	border-width: 0 1px 1px 1px;
}

ul#sub_nav li li a:hover {
	background-color: #E3E3E3;
	padding: 3px 4px 3px 4px;
	border-bottom: 1px solid #999999;
}

/* displays hidden lists */
ul#sub_nav li:hover ul, ul#sub_nav li.over ul { 
	display: block;
}

ul#sub_nav li.gray a {
	background-color: #F0F0F0;
}

ul#sub_nav li.gray a:hover {
	background-color: #E3E3E3;
}

ul#sub_nav li.last {
	border-bottom: 2px solid #336699;
}

ul#sub_nav li.last a {
	border-bottom: 0;
	padding-bottom: 6px;
}

ul#sub_nav li.last a:hover {
	border-bottom: 0;
	padding-bottom: 6px;
}



/***********************************
    TWO COLUMN LIST
************************************/
.two_column { 
	padding: 0;
	min-height: 12px;
	float: left;
}

.two_column ul {
	width: 380px;
	float: left;
	padding: 0;
	margin: 0;
	list-style: none; 
	border-left: 1px solid #999999;
	border-bottom: 1px solid #999999;
	height: 150px; 
	overflow: -moz-scrollbars-vertical; 
	overflow-y: scroll; 
	font-size: 11px;
}

.two_column li {
	float: left;
}

.two_column a {
	display: block;
	border: 1px solid #999999; 
	border-width: 0 1px 1px 0;
	padding: 4px 6px;
	text-decoration: none;
	width:168px;
}

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

/***********************************
   	   GRAY TITLE
************************************/
.title_gray {
	display: block;
	/*margin-right: 5px;*/
	padding-top: 1px;
	padding-left:5px;
	font: bold 14px Trebuchet MS, Verdana, Arial, Helvetica, sans-serif;
	color: #fff;
	text-decoration: none;
	text-transform: none;
	background-color:#999;
}

.title_gray_light {
	border:1px solid #999;
}

.title_gray_light a {
	background-color:#ccc; 
	color:#333; 
	margin:3px; 
	padding:3px 3px 3px 7px;
	font-family:Trebuchet MS, Arial, Helvetica, sans-serif;
	text-decoration:none;
	text-transform:uppercase;
	font-size:14px;
	font-weight:bold;
	display:block;
}

/***********************************
    		 LINK LIST
************************************/
.link_list {
	border: 1px solid #999;
	border-width: 1px 1px 0 1px;
	margin-bottom: 5px;
	padding: 0;
	background-color: #FFFFFF;
	min-height: 12px;
	clear: both;
}

.link_list img {
	padding: 3px;
	border: 1px solid #999;
	border-width: 0 0 1px 0;
}

.link_list ul img {
	padding: 0;
	border: 0;
}

.link_list ul {
	padding: 0;
	margin: 0;
	list-style: none;
	font-size: 11px;
}

.link_list a {
	display: block;
	padding: 4px 6px;
	text-decoration: none;
	border-bottom: 1px solid #999;
}

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

/* Link List Widths */
/*
.columnSingle .link_list a { width: 204px; }
.columnDouble .link_list a { 462px; }
.columnQuarter .link_list a { width: 211px; }
.columnHalf .link_list a { width: 448px; }
*/

/* Link List Banner Styles (Border/Padding) */
.columnDouble .link_list, .columnHalf .link_list, 
.columnTriple .link_list, .columnThreeQuarter .link_list { 
	border: 0; 
}

.columnDouble .link_list img, .columnHalf .link_list img, 
.columnTriple .link_list img, .columnThreeQuarter .link_list img { 
	padding: 0; 
	border: 0; 
}

.columnDouble .link_list ul, .columnHalf .link_list ul, 
.columnTriple .link_list ul, .columnThreeQuarter .link_list ul { 
	border: 1px solid #666666; 
	border-width: 1px 1px 0 1px; 
}



/**********************
Banner Overlay (used for Sidewalk alerts
*************************/

#main #body .outline_box_banner {
	margin:0 0 10px 0;
	padding:0;
}

#main #body .outline_box_banner .banner_overlay {
	background:#ccc;
	color:#333;
	padding:4px 4px 4px 8px;
	margin:3px;
	font-weight:bold;
}


.outline_box_banner .banner_overlay a {
	color:#333;
	text-decoration:none;
}

#main #body .outline_box_banner .body {
	padding:5px 10px 10px 10px;
}