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

	CSS on Sails
	Title: Hannula & Halom
	Author: XHTMLized (http://www.xhtmlized.com/)
	Date: Febrauary 2010

***********************************************************************************************

	1. BASE
			1.1 Reset
			1.2 Accessibility Navigation & Hide
			1.3 Clearfix
			1.4 Default Styles

	2. LAYOUT
			2.1 Structure
			2.2 Header
			2.3 Navigation
			2.4 Content
			2.5 Sidebar
			2.5b Contact Form
			2.6 Footer

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


/* 1. BASE
-----------------------------------------------------------------------------------------------
===============================================================================================*/


/* 1.1 Reset
-----------------------------------------------------------------------------------------------*/

html, body, div, span, object, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, samp, small, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; font-size: 100%; vertical-align: baseline; background: transparent; }
q { quotes: none; }
q:before, q:after { content: ""; content: none; }
a, ins, del { text-decoration: none; }
table { border-collapse: collapse; border-spacing: 0; }
th, td { vertical-align: top; }
th { text-align: left; }

/* 1.2 Accessibility Navigation & Hide
-----------------------------------------------------------------------------------------------*/

ol#accessibility-nav, .hide { position: absolute; top: -999em; left: -999em; height: 1px; width: 1px; }

/* 1.3 Clearfix
-----------------------------------------------------------------------------------------------*/
.wrapper-content:after,
.clearfix:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
	overflow: hidden;
}

.clear {clear: both;}

/* 1.4 Default Styles
-----------------------------------------------------------------------------------------------*/
body {
	color: #333;
	font-size: 12px;
	font-family: Arial, sans-serif;
	background: #eaeaea;
}
hr { display: none; }
strong { font-weight: bold; }
em { font-style: italic; }
del { text-decoration: line-through; }
th { font-weight: normal; }
address, cite, dfn { font-style: normal; }
li { list-style: none; }
abbr, acronym { border-bottom: 1px dotted #999; cursor: help; }
input, textarea, select { font-family: Arial, sans-serif; font-size: 12px; }
a, a:visited { color: #333; text-decoration: underline; }
a:hover, a:active { color: #0f1676; text-decoration: none; }

/* 2. LAYOUT
-----------------------------------------------------------------------------------------------
===============================================================================================*/

/* 2.1 Structure
-----------------------------------------------------------------------------------------------*/

.wrapper-header-content {
	background: #eaeaea url(../images/bg.png) repeat-y 50% 0;
}


.wrapper-content {
	width: 1000px;
	margin: 0 auto;
	background: url(../images/bg_content.png) repeat-y 0 0;
	margin-top: 120px;
}

#profile-page .wrapper-content {
	background: url(../images/bg_wide_content.png) repeat-y 0 0;
}

#home_page .wrapper-content {
	margin-top: 0;
	}

	.wrapper-content .bottom {
		clear: both;
		height: 53px;
		background: #fff;
		margin: 0 1px 0 1px;
	}

.wrapper-footer {
	background: #eaeaea url(../images/bg_footer.png) no-repeat 50% 0;
	height: 170px;
}

/* 2.2 Header
-----------------------------------------------------------------------------------------------*/

#header {
	width: 1000px;
	height: 173px;
	margin: 0 auto;
	margin-bottom: 12px;
	position: relative;
}

#home_page #header {height: 630px;}

	#header div.h1 {
		position: absolute;
		top: 82px;
		right: 20px;
		z-index: 2;
		width: 360px;
		height: 173px;
		background: #18a5ff;
	}

	#home_page #header div.h1 {height: 378px;}

		#header .h1 h1 {
			padding: 36px 0 29px 51px;
		}

			#header .h1 h1 a,
			#header .h1 h1 img {
				display: block;
			}


		#header .h1 p {
			color: #fff;
			font-size: 20px;
			padding: 0 63px 25px 63px;
		}

	#header div.slideshow {
		position: absolute;
		top: 82px;
		left: 0px;
		z-index: 1;
		width: 980px;
		height: 193px;
		overflow: hidden;
	}

	#home_page #header div.slideshow {
		height: 548px;
	}

#header div.slideshow > div {

}

		#header div.slideshow img {
			display: block;
			float: left;
			margin: 0 0 0 20px;
		}
		
		#home_page #header div.slideshow img {margin-left: 1px;}


/* SLIDESHOW */
/*** set the width and height to match your images **/
#slides {position:relative;height:378px; overflow: hidden; border-bottom: 1px solid #fff;}
#slides img {position:absolute;top:0;left:0;z-index:8; opacity:0.0;}
#slides img.active {z-index:10; opacity:1.0;}
#slides img.last-active {z-index:9;}


		#header div.slideshow h2 {
			font-size: 20px;
			color: #fff;
			width: 420px;
			height: 43px;
			padding: 17px 0 0 27px;
			background: url(../images/bg_slideshow_h2.png) repeat 0 0;
			font-weight: normal;
			float: left;
			margin: 130px 0 0 -620px;
			z-index: 1000;

		}

		#home_page #header div.slideshow h2 {
			margin: 288px 0 0 -620px;
		}

		#header div.slideshow ul {
			position: absolute;
			bottom: 0;
			left: 20px;
			width: 958px;
			height: 140px;
			padding: 10px 0 0 2px;
			background: #1c2122;
			border-top: solid 20px #fff;
		}

			#header div.slideshow ul li {
				float: left;
				border-right: solid 1px #4c5554;
				width: 238px;
				height: 120px;
			}

			#header div.slideshow ul li.active,
			#header div.slideshow ul li.current,
			#header div.slideshow ul li:hover {
				background: #333839;
			}

			#header div.slideshow ul li:last-child {
				border: none;
			}

				#header div.slideshow ul dl {
					color: #fff;
					padding: 15px 30px 0 30px;
				}

					#header div.slideshow ul dl dt {
						font-size: 13px;
						padding: 0 0 11px 0;
					}

					#header div.slideshow ul dl dd {
						font-size: 12px;
						line-height: 115%;
					}

						#header div.slideshow ul dl dd a {
							font-size: 11px;
							color: #fff;
							display: block;
							padding: 7px 0 0 0;
						}

/* 2.3 Navigation
-----------------------------------------------------------------------------------------------*/

#navigation {
	position: absolute;
	top: 45px;
	right: 20px;
}

	#navigation li {
		float: left;
		padding: 0 0 0 37px;
	}

		#navigation li a {
			display: block;
			float: left;
			color: #182841;
			height: 36px;
			text-decoration: none;
		}


		#home_page li a#nav_home,
		#news_page li a#nav_news,
		#practice_page li a#nav_practice,
		#condemnation-law-page li a#nav_practice,
		#workers-comp-page li a#nav_practice,
		#personal-injury-page li a#nav_practice,
		#auto-accidents-page li a#nav_practice,
		#profile-page li a#nav_profiles,
		#profile-page-detail li a#nav_profiles,
		#contact-page li a#nav_contact,
		#comp_page li a#nav_comp,
		#navigation li a:hover {
			background: url(../images/bullet_navigation.png) no-repeat 50% 100%;
			color: #0f1676;
		}

/* 2.4 Content
-----------------------------------------------------------------------------------------------*/

#content {
	width: 465px;
	float: left;
	padding: 17px 0 30px 0;
}

#profile-page #content {width: 680px;}
	#content h3 {
		font-size: 20px;
		font-weight: normal;
		color: #1c2122;
		padding: 0 19px 26px 19px;
	}

	#content h4 {
		font-size: 14px;
		font-weight: normal;
		padding: 0 20px 17px 20px;
		line-height: 120%;
	}

	#content p {
		padding: 0 20px 19px 20px;
		line-height: 150%;
	}

	#content p.back-top {
		padding: 0 0 10px 20px;
	}

	#content ul, #content ol {
		padding: 0 0 17px 0;
	}

		#content ul li, #content ol li {
			padding: 0 20px 3px 20px;
			background: url(../images/bullet_01.png) no-repeat 0 2px;
		}
		
		#content ol li {
			padding-left: 5px;
			margin: 5px 15px;
			background: none;
			line-height: 150%;
			list-style-type: lower-roman;
		}

.profile {clear: both; padding: 15px 0 15px 25px; border-bottom: 1px solid #eeeeee;}
.profile div {float: left;}
.profile-photo {width: 150px;}
.profile-intro {width: 330px;}
.profile-contact {width: 170px;}
.img-right, .img-left {float: left; margin: 0 10px 0 0; background: #eaeaea; padding: 5px;
}
.img-right {float: right; margin: 10px 0 10px 10px;}
/* 2.5 Sidebar
-----------------------------------------------------------------------------------------------*/

#sidebar {
	width: 240px;
	float: left;
	margin: 0 33px 0 0;
	padding: 10px 0 30px 0;
}

	#sidebar h3 {
		font-size: 20px;
		font-weight: normal;
		color: #fff;
		background: url(../images/bg_sidebar_h3.png) repeat 0 0;
		padding: 7px 0 9px 52px;
		margin: 0 0 17px 0;
	}

	#sidebar dl, #content dl {
		padding: 0 0 24px 0;
	}

		#sidebar dl dt {
			font-size: 14px;
			padding: 0 0 14px 52px;
		}

		#sidebar dl dd, #content dl dd {
			font-size: 12px;
			padding: 0 10px 0 52px;
			line-height: 140%;
			background: url(../images/bullet_01.png) no-repeat 33px 8px;
		}

		#content dl dd {
			background: url(../images/bullet_01.png) no-repeat 33px 3px;
		}
			#sidebar dl dd a {
				display: block;
				font-size: 11px;
				padding: 5px 0 0 0;
			}
			
			#workers-comp-page #sidebar dl dd a#pa-1,
			#personal-injury-page #sidebar dl dd a#pa-2,
			#auto-accidents-page #sidebar dl dd a#pa-3,
			#condemnation-law-page #sidebar dl dd a#pa-4,
			#land-owners-page #sidebar dl dd a#pa-5,
			#eminent-domain-page #sidebar dl dd a#pa-6
			{text-decoration: none; color: #0f1676;}

	#sidebar address {
		padding: 5px 0 19px 52px;
		line-height: 140%;
	}

#sidebar2 {
	width: 233px;
	float: right;
	padding: 17px 26px 10px 0;
}

	#sidebar2 h3 {
		font-size: 20px;
		font-weight: normal;
		color: #1c2122;
		padding: 0 19px 26px 28px;
	}

	#sidebar2 dl {
		padding: 0 0 34px 28px;
	}

		#sidebar2 dl dt {
			font-size: 14px;
			padding: 0 0 5px 0;
		}

		#sidebar2 dl dd {
			font-size: 12px;
			line-height: 140%;
		}

			#sidebar2 dl dd img, .profile-photo img {
				display: block;
				float: right;
				background: #eaeaea;
				padding: 5px;
				border-top: solid 1px #f5f5f5;
				border-bottom: solid 1px #f5f5f5;
				margin: -1px 0 0 14px;
			}

			#sidebar2 dl dd a {
				display: block;
			}

/* 2.5b Contact Form
-----------------------------------------------------------------------------------------------*/

#contact { display: block; width: 350px;}

/* Form style */

label { display: inline-block; float: left; height: 26px; line-height: 26px; width: 350px; }
input, textarea, select {width: 350px; margin: 0; padding: 5px; color: #666; background: #f5f5f5; border: 1px solid #ccc; margin: 5px 10px;}   
input:focus, textarea:focus, select:focus { border: 1px solid #999; background-color: #fff; color:#333; }
input.submit { cursor: pointer; border: 1px solid #222; background:#333; color:#fff;}
input.submit:hover { background:#444; }
textarea {height: 100px;}
fieldset { padding:10px;}
legend {padding:7px 10px;}

span.required{ font-size: 13px; color: #ff0000; } /* Select the colour of the * if the field is required. */

/* Style for the error message */

.error_message { display: block; height: 22px; line-height: 22px; background: #FBE3E4 url("../images/error.gif") no-repeat 10px center; padding: 8px 10px 8px 35px; margin: 10px 0; color:#8a1f11;border: 1px solid #FBC2C4; width: 400px;}


/* 2.6 Footer
-----------------------------------------------------------------------------------------------*/

#footer {
	width: 1000px;
	height: 120px;
	margin: 0 auto;
	position: relative;
	background: #1c2122;
	color: #fff;
}

	#footer ul {
		text-align: center;
		padding: 18px 40px 18px 40px;
	}

		#footer ul li {
			display: inline-block;
			padding: 0 20px 0 20px;
		}

			#footer ul li a {
				text-decoration: none;
				color: #fff;
			}

			#home_page li a#nav_foot_home,
			#news_page li a#nav_foot_news,
			#practice_page li a#nav_foot_practice,
			#profile_page li a#nav_foot_profiles,
			#contact_page li a#nav_foot_contact,
			#comp_page li a#nav_foot_comp,
			#footer ul li a:hover {
				text-decoration: underline;
			}

	#footer p {
		text-align: center;
		color: #fff;
		line-height: 140%;
	}

		#footer p a {
			color: #fff;
		}