/* ############################# HTML ELEMENT STYLES */	

html, body{
	margin: 0;
	width: 100%;
	height: 100%;
	background-color: #fff;
	
	font-family: Georgia,Trebuchet MS,Times,serif;
	
	font-size:100%;
    line-height:1.125em; /* 16×1.125=18 */
	color: #333;
}

html>body {
	width: 100%;
	height: 100%;
}

img {	
	display: block;
	border: 0;
}

.hidden {
	display:none;
}

.expand {
	display:none;
}

.expand-icon {
	font-size: 0.85em;
}

/* ############################# STYLES for Default links */	
a, a:link {
	text-decoration: none;
	color:  #666;  /* color: red */
	outline: none;
}
	
a:visited {
	color:  #666; /* color: green #1E7F3B */
}

a:hover {
	color: #000;
}

a:active {
	color:  #666;
}


/* ####################################### START - Main Block Elements */

#header {
	width: 950px;
	height: 95px;
	margin: auto;
	clear:left;
	background: #fff url(images/header_logo.png) no-repeat 0 0;
}

#page-break {
	width: 909px;
	height: 5px;
	margin: auto;
	clear:left;
}

#container {
	width: 950px;
	margin: auto;
	overflow: hidden;
	background-color: #4090CF;
}

#image-container {
	width: 950px;
	min-height: 400px;
	margin: auto;
	background: transparent url(images/vancouver.png) no-repeat bottom center;
	overflow: hidden;
}


/* ####################################### START - Header Block Elements */
#top-bar {
	height:6px;
	/*border-top:1px solid #fff;*/
	background-color: #000;
}


#header-menu {
	text-align:right;
	padding-top: 2px;
	font-size: 0.59em;
	font-family: verdana,arial,helvetica,sans-serif;
	color:#000;
}

#header-menu a, #header-menu a:link {
	color: #000;
}

#header-menu a:visited {
	color: #000;
}

#header-menu a:hover {
	color: #666;
}

#header-menu a:active {
	color: #000;
}

/* ####################################### START - headline-overlay */
#headline-overlay {
	position: relative;
	color: #fff;
}

#headline-overlay a, #headline-overlay a:link {
	color: #fff;
}

#headline-overlay a:visited {
	color: #fff;
}

#headline-overlay a:hover {
	color: #fff;
}

#headline-overlay a:active {
	color: #fff;
}

#headline-back {
	position: absolute;
	top: 26px;
	left: 520px;
	width: 400px;
	height: 374px;
	z-index: 95;
	/*background: transparent url(images/headline-back.png) repeat;*/
	display: none;
}


#headline-0, #headline-1, #headline-2, #headline-3 {
	position: absolute;
	top: 50px;
	left: 545px;
	width: 360px;
}

#headline-0 {
	z-index: 95;
}

#headline-0 p { display: none; }

#headline-1 {
	z-index: 96;
	display: none;
}

/*#headline-1 p { display: none; }*/

#headline-2 {
	z-index: 97;
	display: none;
}

#headline-3 {
	z-index: 98;
	display: none;
}

#headline-overlay h1 {
	margin: 0;
	padding: 0;
	margin-bottom: 3px;
	font-weight: normal;
	font-size: 1.6em;
	line-height: 1.35em;
}

#headline-overlay p {
	margin: 0;
	padding: 0;
	padding-top: 5px;
	font-size: 1.1em;
	line-height: 1.2em;
}

/* ####################################### START - content-overlay */
#content-overlay {
	width: 670px;
	/*height: 500px;
	min-height: 374px;*/
	margin-top: 26px;
	padding: 10px 25px 20px 15px;
	background: transparent url(images/content-back.png) repeat;
}

/* Note each overlay has a class that can control the min-height */
.firm-overlay {
	min-height: 580px;
}

.practice-overlay {
	min-height: 650px;
}

#content-overlay a {
	text-decoration: underline;
}

#content-overlay h2 {
	margin: 0;
	padding: 10px 0;
	font-size: 0.9em;
	font-style: italic;
	color: #00337d;
	border-bottom: 1px dashed #000;
	
	padding-left: 5px; /* move text 5 px from left */
}

#content-overlay h3 {
	margin: 0;
	width: 70%;
	padding: 15px 0 5px 0;
	font-weight: normal;
	font-size: 1.6em;
	line-height: 1.3em;
	
	padding-left: 5px; /* move text 5 px from left */
}

#content-overlay p {
	width: 70%;
	line-height: 1.25em;
	
	margin: 0;
	padding: 5px 0;
	
	padding-left: 5px; /* move text 5 px from left */
}

.firm-content p, .practice-overlay p {
	font-size:0.8em;
}

#content-links {
	margin: 0;
	padding: 10px 0;
	border-bottom: 1px dashed #000;
}

#content-links li {
	margin:0;
	padding: 5px 0;
	list-style: none;
	font-size: 0.9em;
	
	padding-left: 5px; /* move text 5 px from left */
}

#content-links a, #content-links a:link {
	color: #00337d;
	text-decoration: none;
}

#content-links a:visited {
	color: #00337d;
}

#content-links a:hover {
	color: #000;
}

#content-links a:active {
	color: #00337d;
}

#content-links a.news-current, #content-links a.firm-current {
	font-weight: 700;
}

/* ####################################### Start - Areas of practice list styles */

.practice-list {
	margin: 0;
	padding: 0;
	padding-top: 10px;
	padding-left: 5px; /* move text 5 px from left */
	font-size: 0.8em;
	
	float: left;
	width: 290px;
}

.practice-list li {
	list-style: none;
	list-style-image: url(images/bullet-lrg.png);
	padding: 0 20px 10px 0;
	margin-left: 10px;
}

.practice-list ul {
	margin: 0;
	padding: 0;
}

.practice-list ul.expand {
	margin: 10px 0 15px 0;
	padding: 0;
}

.practice-list ul li {
	clear: left;
	margin: 0;
	margin-left: 10px;
	padding: 0;
	list-style-type: none;
	list-style-image: url(images/bullet.png);
}

.practice-list ul li.no-bullet {
	clear: left;
	margin: 0;
	padding: 0;
	list-style-type: none;
	list-style-image: none;
}


/* ####################################### Start - Useful links list styles */
#useful-links {
	margin-top: 10px;
	border-top: 1px dashed #000;
	font-size: 0.8em;
	line-height: 1.18em;
}

#useful-links ul {
	float: left;
	width: 200px;
	margin: 15px 15px 0 0;
	padding:0;
}

#useful-links li {
	margin: 0;
	padding: 0 0 18px 0;
	list-style-type: none;
}

#useful-links a {
	font-style: italic;
	text-decoration: underline;
}

/* ####################################### Start - Contact Us section */
#lawyer-directory, .address {
	margin-top: 10px;
	font-size: 0.8em;
}

.address {
	margin-bottom: 10px;
}

#lawyer-directory ul {
	float: left;
	width: 200px;
	margin: 15px 15px 0 0;
	padding:0;
}

#lawyer-directory li {
	margin: 0;
	padding: 0 0 10px 0;
	list-style-type: none;
	
	padding-left: 5px;  /* move text 5 px from left */
}

#lawyer-directory a {
	font-style: italic;
	text-decoration: underline;
}

/* ####################################### Start - privacy policy */
#privacy-body {
	margin-top: 10px;
	font-size: 0.8em;
}

#privacy-body ul {
	width: 70%;
}
	


/* ####################################### START - meet-lawyers */
#meet-lawyers {
	background-color: #fff;
	padding-top: 36px;
}

#meet-lawyers .white-break {
	border-top: 1px dashed #333;
	background-color: #fff;
	height: 10px;
}

#lawyer-thumbs {
	float: left;
	width: 500px;
}

.lThumb {
	float: left;
	width: 68px;
	height: 68px;
	margin-bottom: 10px;
	
	/* sample thumb image */
	background: #efefef url(null) no-repeat top left;
	
	overflow: hidden;
	/*display: none;*/
}

.lThumb a {
	display: block;
	/*width: 100%;*/
	height: 64px;
	text-indent: -9999px;
	border: transparent 2px solid;
}

.lThumb a:hover {
	border: #333 2px solid;
}

.lThumb a.border {
	border: #333 2px solid;
}

/* Row 1 of thumbnails */
#th-1 { width: 71px; margin-right: 2px; background-image: url(images/portraits/thumbs/1.jpg); }
#th-2 { width: 101px; margin-right: 2px; background-image: url(images/portraits/thumbs/2.jpg);} 
#th-3 { width: 91px; margin-right: 2px; background-image: url(images/portraits/thumbs/3.jpg);} 
#th-4 { width: 101px; margin-right: 2px; background-image: url(images/portraits/thumbs/4.jpg);} 
#th-5 { width: 128px; background-image: url(images/portraits/thumbs/5.jpg);}

/* Row 2 of thumbnails */
#th-6 { width: 128px; margin-right: 2px; background-image: url(images/portraits/thumbs/6.jpg);}
#th-7 { width: 101px; margin-right: 2px; background-image: url(images/portraits/thumbs/7.jpg);} 
#th-8 { width: 91px; margin-right: 2px; background-image: url(images/portraits/thumbs/8.jpg);}
#th-9 { width: 91px; margin-right: 2px; background-image: url(images/portraits/thumbs/12.jpg);} 
#th-10 { width: 10px; background-color: #fff;}

/* Row 3 of thumbnails */
#th-11 { width: 71px; margin-right: 2px; background-image: url(images/portraits/thumbs/10.jpg);}
#th-12 { width: 101px; margin-right: 2px; background-image: url(images/portraits/thumbs/11.jpg);} 
#th-13 { width: 91px; margin-right: 2px; background-image: url(images/portraits/thumbs/9.jpg);} 
#th-14 { width: 101px; margin-right: 2px; background-image: url(images/portraits/thumbs/13.jpg);} 
#th-15 { width: 128px; background-image: url(images/portraits/thumbs/14.jpg); overflow:hidden;} 

#lawyer-names {
	float: left;
	width: 450px;
}

#lawyer-names h2 {
	margin:0;
	padding: 0;
	padding-bottom: 5px;
	border-bottom: 1px dashed #333;
	font-size: 0.9em;
	
	padding-left: 3px; /* add extra 3px padding to left */
}

#lawyer-partners {
	margin-left: 25px;
	float: left;
	width: 266px;
	min-height: 100px;
}

#lawyer-associates {
	margin-left: 25px;
	float: left;
	width: 134px;
	min-height: 100px;
}

.lawyers-list {
	float: left;
	margin: 0;
	padding: 0;
	padding-top: 5px;
	width: 130px;
	
	font-size: 0.83em;
	
	padding-left: 3px; /* add extra 3px padding to left */
}

.lawyers-list li {
	margin: 0;
	padding: 3px 0;
	list-style-type: none;
}

.item-lawyer a.embolden {
	color: #000;
}


/* ####################################### START - lawyer-details */
#lawyer-details {
	min-height: 300px;
	padding: 15px 0;
	background: #fff;
}

#lawyer-contact-image {
	float: left;
	width: 500px;
}

#lawyer-contact {
	padding-left: 15px;
}

#lawyer-image {
	width: 500px;
	height: 332px;
	background: transparent url(null) no-repeat top left;
	
	padding-bottom: 10px;
	border-bottom: 1px dashed #333;
}

.contact-list {
	float: left;
	margin: 0;
	padding: 0;
	padding-top: 5px;
	
	padding-left: 3px; /* add extra 3px padding to left */
}

.contact-short { width: 185px; }
.contact-wide { width: 280px; }

.contact-list li {
	margin: 0;
	padding: 2px 0;
	list-style-type: none;
}

#lawyer-contact {
	font-size: 0.8em;
	line-height: 1.2em;
	color: #333;
	font-style: italic;
}

#lawyer-contact a { text-decoration: underline; }
	

#lawyer-info {
	float: left;
	width: 425px;
	margin-left: 25px;
}

#lawyer-info h3 {
	margin:0;
	padding: 0;
	margin-bottom: 3px;
	font-weight: normal;
	font-size: 1.6em;
	line-height: 1.2em;
	color: #231f20;
	
	padding-right: 35px; /* add extra 35px padding to right */
}

#lawyer-info p {
	margin:0;
	padding: 5px 0;
	font-size: 0.8em;
	line-height: 1.2em;
	/*color: #333;*/
	
	padding-right: 40px; /* add extra 40px padding to right */
}

#lawyer-info a {
	text-decoration: underline;
}

#lawyer-info p.prac-dis {
	font-size: 0.58em;
	font-family: verdana,arial,helvetica,sans-serif;
	color:#000;
}






/* ####################################### START - News and News-item */
#news {
	width: 950px;
	padding: 10px 0 20px 0;
	margin: auto;
}

#news h3 {
	margin:0;
	margin-top: 15px;
	padding:0;
	font-size: 0.90em;
	color: #333;
}

#news p {
	margin:0;
	margin-top: 5px;
	padding:0;
	font-size: 0.80em;
	color: #333;
}

#news ul {
	margin: 10px 15px;
	padding: 0;
	font-size: 0.85em;
	color: #666;
}

#news a {
	font-style: italic;
	text-decoration: underline;
}

.news-item {
	width: 280px;
	display:none;
	/*height: 163px;
	overflow: hidden;*/
	float: left;
	border-top: 1px dashed #000;
	padding: 0 10px;
}

.news-margin {
	margin-right: 25px;
}


/* special styles for news page list only */

.news-page ul, .news-page ol {
	width: 70%;
	line-height: 1.25em;
	
	margin: 0;
	padding: 5px 0;
	
	margin-left: 15px;
	padding-left: 5px; /* move text 5 px from left */
}

.news-page li {
	font-size: 0.8em;
	list-style: none;
	list-style-image: url(images/bullet-lrg.png);
}

.news-page p {
	font-size: 0.8em;
}


/* ####################################### START - Sitemap-menu Block Elements */
#sitemap-menu {
	font-size: 0.85em;
}

#sitemap-menu a {
	text-transform: capitalize;
}

#sitemap-menu ul {
	margin: 0;
	padding: 0 20px;
}

#sitemap-menu li ul {
	padding-left: 20px;
}

#sitemap-menu li {
	padding: 2px 0;
	list-style: none;
	list-style-image: none; /* url(images/bullet-lrg.png);*/
}


/* ####################################### START - Footer Block Elements */
#footer {
	width: 950px;
	margin: auto;
	padding-top: 8px;
	font-size: 0.58em;
	font-family: verdana,arial,helvetica,sans-serif;
	color:#000;
}

#footer a, #footer a:link {
	color: #000;
}

#footer a:visited {
	color: #000;
}

#footer a:hover {
	color: #666;
}

#footer a:active {
	color: #000;
}

#bottom-bar {
	height: 3px;
	background-color:#000;
}

#copyright {
	float: left;
	width: 250px;
}

#company-info {
	float: left;
	width: 700px;
	text-align: right;
}