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

	Title: Bishop
	Author: XHTMLized
	Date: February 2008 

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

	1.  GENERAL
			1.1 Headings and paragraphs
			1.2 Forms
			1.3 Links
			1.4 Miscellaneous
		
	2. GENERAL ELEMEMENTS
	
	3. LAYOUT
			3.1 Accessibility menu
			3.2 Header
			3.3 Content
			3.4 Secondary content
			3.5 Sidebar
			3.6 Footer
		
	4. LAYOUT ELEMENTS

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


/* 1. GENERAL
-----------------------------------------------------------------------------------------------
===============================================================================================*/	

/* Global reset */
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,font,img,ins,kbd,q,s,samp,small,strike,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; outline:0; font-weight:inherit; font-style:inherit; font-size:100%; font-family:inherit; vertical-align:baseline; }

html, body{
	height: 100%;}

body {
	line-height:1; }	
	
ol,ul {
	list-style:none; }
	
table {
	border-collapse:separate; 
	border-spacing:0;  /* tables still need 'cellspacing="0"' in the markup */
}

caption,th,td {
	text-align:left; 
	font-weight:normal;
}

body {
	background: #000 none no-repeat left top;
	color: #FFF;
	font: normal normal 62.5%/138.46% Helvetica,Arial,Verdana,sans;
	text-align: left;}

/* 1.1	Headings and paragraphs
-----------------------------------------------------------------------------------------------*/	

h1 {}

h2 {}

h3 {}

h4 {}

p  {}


/* 1.2	Forms
-----------------------------------------------------------------------------------------------*/	

input, textarea, select {
	font:1.2em Arial, Helvetica, sans-serif;
}

/* 1.3	Links
-----------------------------------------------------------------------------------------------*/	

a {
	color:#656565;
	text-decoration:none;
}
a:visited {}
a:hover {
	color:#fff;
	text-decoration:none;
}
a:active {}

/* 1.4	Miscellaneous
-----------------------------------------------------------------------------------------------*/	

hr {display:none;}
strong {font-weight:bold;}
em {font-style:italic;}
abbr, acronym {border-bottom:1px dotted #999;cursor:help;}

/* 2. GENERAL ELEMENTS
-----------------------------------------------------------------------------------------------
===============================================================================================*/	

.hide {position:absolute;left:-9999px;}
img.left {float:left;margin-left:0;}
img.right {float:right;margin-right:0;}

.clear {clear:both;}
br.clear {font-size:0;height:0;line-height:0;overflow:hidden;}

.clearfix:after 
{content:".";display:block;height:0;clear:both;visibility:hidden;}

.clearfix 
{display:inline-block;}	/* Hides from IE-mac \*/ 

* html .clearfix 
{height:1%;}

.clearfix 
{display:block;} /* End hide from IE-mac */


/* 3. LAYOUT
-----------------------------------------------------------------------------------------------
===============================================================================================*/	

.container {
	background: transparent none no-repeat right top;
	width: 974px;
	margin: 0 auto;
	padding-left: 20px;
	text-align:left;}

	/* layout-a : landing page ( home, portfolio ); */
	body.layout-a .container{
		height: auto !important;
		height: 100%;
		min-height: 100%;
		position: relative;}
		
	body.layout-a #footer{
		bottom: 0px;
		left: 20px;
		position: absolute;
		width: 944px;}
		
	/* layout-b : landing pages for portfolio categories, career, ...  */
	body.layout-b #content{
		padding-top: 480px;}

		body.portfolio-category #content p{
			font-size: 1.6em;
			line-height: 1.5em;}
					

/* Default - Two columns layout */

#content {
	float:right;
	width:610px; 
	padding:40px 0 20px 10px;}
	
#sidebar {
	background: transparent url(../images/sidebar.png) repeat left top;
	padding: 20px 40px 20px 30px;
	width:265px;
	float:left;} 


#footer {
	clear:both; }
	
/* 3.1	Accessibility menu
-----------------------------------------------------------------------------------------------*/	
#accessibility-menu {position:absolute;left:-1000em;text-align:left;}

/* 3.2	Header
-----------------------------------------------------------------------------------------------*/	

/* Logo -> Image replacement. */
#header #logo, #header #logo a, #header #logo a span {display:block;width:100px;height:50px;overflow:hidden;}

#header #logo {position:absolute;top:0;left:0;}
#header #logo a { /* style the text covered by image */ }
#header #logo a span {	
	position:absolute;top:0;left:0;z-index:10;
	background:url(../../images/logo.gif) no-repeat;
}


/* 3.3	Content
-----------------------------------------------------------------------------------------------*/	

#content h2 {
	margin-top:20px;
	font-size:2.2em;
	line-height:1.3em;
}
#content h2 a{
	text-decoration: none;}
#content p {
	margin-bottom:10px;
	font-size:1.3em;
	line-height:1.38em;
}	
	#content p.links {margin-top:15px;}
	#content p.meta {margin-bottom:15px;}

#content a {
	color:#fff;
	text-decoration:underline;
}
	#content a:hover {
		text-decoration:none;
	}
#content dl {
	float:right;
	padding-left:40px;
	width:150px;
}
#content dl dt {
	font-weight:bold;
	font-size:1.4em;
	line-height:1.28em;
}
	#content dl dd {
		font-size:1.2em;
		line-height:1.5em;
		margin-bottom:10px;
	}
#content ul.nb {
	margin:15px 0 30px;
	height:20px;
}
	#content ul.nb li {
		float:left;
	}
		#content ul.nb li a {
			float:left;
			padding:5px 3px;
			text-decoration:none;
			color:#656565;
			font-size:1.1em;
		}
			#content ul.nb li a:hover, #content ul.nb li.current a, #content ul.nb li.ui-tabs-selected a {
				color:#fff;
			}

#content a.download {
	display:block;line-height:20px;
	padding-left:24px;
	background:url(../images/download.gif) left center no-repeat;
	font-size:1.2em;
	color:#656565;
	text-decoration:none;
}
	#content a.download:hover {color:#fff;}
#content p.links a, #content p.meta a {
	text-decoration:none;
}
	#content p.links a:hover, #content p.meta a:hover {
		text-decoration:underline;
	}
	#content a.more {
		display:block;
	}
	
#content .news {
	border-top:1px solid #fff;
	margin-bottom:20px;
}
	#content #first.news {border-top:none;}
	
/* Custom Backgrounds */
#content {
	background-position:top right;
	background-repeat:no-repeat;
}

body.portfolio .container{
	background-image: url(../images/bg/portfolio.jpg);}

body.corporate-workplace .container{
	background-image: url(../images/bg/corporate.jpg);}	
	
body.entertainment .container{
	background-image: url(../images/bg/entertainment.jpg);}	
	
body.housing .container{
	background-image: url(../images/bg/housing.jpg);}		




body.careers .container {background-image:url(../images/careers.jpg);}
	body.careers #content {padding-top:550px;}
	
body.about #content {padding-top:470px;}


	/* homepage random */
	body#rand1 .container{
		background-image: url(../images/bg/01.jpg);}
	body#rand2 .container {
		background-image: url(../images/bg/02.jpg);}
	body#rand3 .container {
		background-image: url(../images/bg/03.jpg);}
	body#rand4 .container {
		background-image: url(../images/bg/04.jpg);}
	body#rand5 .container {
		background-image: url(../images/bg/05.jpg);}
	body#rand6 .container {
		background-image: url(../images/bg/06.jpg);}
	body#rand7 .container {
		background-image: url(../images/bg/07.jpg);}
	body#rand8 .container {
		background-image: url(../images/bg/08.jpg);}
	body#rand9 .container {
		background-image: url(../images/bg/09.jpg);}
	body#rand10 .container {
		background-image: url(../images/bg/10.jpg);}		
	body#rand11 .container {
		background-image: url(../images/bg/11.jpg);}
	body#rand12 .container {
		background-image: url(../images/bg/12.jpg);}
	body#rand13 .container {
		background-image: url(../images/bg/13.jpg);}		
	body#rand14 .container {
		background-image: url(../images/bg/14.jpg);}
	body#rand15 .container {
		background-image: url(../images/bg/15.jpg);}
	body#rand16 .container {
		background-image: url(../images/bg/16.jpg);}	


/* 3.4	Secondary content
-----------------------------------------------------------------------------------------------*/	

/* 3.5	Sidebar
-----------------------------------------------------------------------------------------------*/	

	#sidebar a {
		display:block;
		color:#656565;
		text-decoration:none;
	}
		#sidebar a:hover, #sidebar a:focus, #sidebar li.current_page_item a, #sidebar li.current-cat a{
			color:#fff;
			text-decoration:none;
		}
			#sidebar li.current_page_item li a {color:#656565;}
				#sidebar li.current_page_item li a:hover {color:#fff;}
				#sidebar li.current_page_item li.current_page_item a {color:#fff;}
		
/* Default */

ul#sideul li {
	margin-bottom:10px;
}

ul#sideul ul li {
	font-size:1.2em;
	line-height:1.2em;
	margin-bottom:0;
}
	ul#sideul ul ul li {
		font-size:1em;
	}
	ul#sideul li h3 {
		margin-bottom:10px;
		font-size:1.7em;
		font-weight:bold;
		color:#656565;
	}
	ul#sideul li h2 {
		font-size:14px;
		margin:10px 0 5px;
	}
		ul#sideul li h2 a {
			color:#fff;
		}
			ul#sideul li h2 a:hover {text-decoration:underline;}
		ul#sideul li p {
			line-height:1.8em;
		}
			ul#sideul li p a {
				display:inline;
				font-size:14px;
				color:#656565;
			}

/* Main Nav */
ul#sideul li.mainnav {
	padding-bottom:5px;
	border-bottom:1px solid #5e5e5e;
	margin-bottom:5px;
}
ul#sideul li.mainnav li {
	font-size:3.5em;
	line-height:1em;
	font-weight:bold;
	white-space: nowrap;
}

/* Secondary Nav */
ul#sideul li.secnav {
	margin-bottom:20px;
}
ul#sideul li.secnav li {
	font-size:1.7em;
	line-height:1.17;
	font-weight:bold;
	text-transform: uppercase;
	white-space: nowrap;
}
	ul#sideul li.secnav li ul {
		margin:10px 0 15px;
	}
	ul#sideul li.secnav li li {
		font-size:0.7em;
		line-height:1.66em;
		text-transform: none;
	}

/* Top, Inline Nav */
ul#sideul li.inline li {
	display:inline;
	font-size:1em;
	margin-right:20px;
}
	ul#sideul li.inline li a {display:inline;}

/* rss */
ul#sideul li.rss li a {
	padding-left:22px;
	background:url(../images/rss.gif) left center no-repeat;
}

a.pdf {
	padding-left:18px;
	background:url(../images/pdf.gif) left center no-repeat;
	text-transform:uppercase;
}

/* 3.6	Footer
-----------------------------------------------------------------------------------------------*/	
#footer {
	padding: 25px 15px 15px 10px;
}
#footer p.copy {
	float:left;
	color:#999;}

	#footer a.terms {
		float:right;
		color:#999;
		text-decoration:none;}
		
		#footer a.terms:hover {
			text-decoration:underline;}

/* 4. LAYOUT ELEMENTS
-----------------------------------------------------------------------------------------------
===============================================================================================*/	

/* capabilities */
body #content.capabilities{
	padding-top: 220px;
	position: relative;}

#content.capabilities h2{
	left: -1000em;	
	position: absolute;}

	#content.capabilities ul{
		font-size: 2.6em;
		line-height: 1.2em;
		font-weight: bold;
		text-transform: uppercase;
		width: 374px;}
	#content.capabilities ul a{
		color: #656565;
		text-decoration: none;}

	#content.capabilities ul ul{
		display: none;
		color: #FFF;
		left: 375px;
		font-size: 0.615em;
		font-weight: normal;
		line-height: 1.2em;
		position: absolute;
		text-transform: none;
		top: 220px;
		width: 250px;}

	#content.capabilities ul li.active a{
		color: #FFF;}

	#content.capabilities ul li.active ul{
		display: block;}

#comments{
	font-size: 1.3em;}
	
	#comments h3{
		font-weight: bold;}
	
	#comments ol{
		margin: 1em 0;}
	
	#comments li{
		border-top: 1px solid #FFF;
		padding: 2em 0;}
		
	#comments li p{
		margin: .5em 0 0;}
		

#add-comment{
	font-size: 1.3em; }
	
	#add-comment h3{
		font-weight: bold;
		font-size: 1.2em;
		margin-bottom: .5em;}
	
	#add-comment input, #add-comment textarea{
		font-size: 1em;
		width: 200px;}
		
	#add-comment textarea{
		width: 100%;}

/* teaser */
.teaser h2{
	font-weight: bold;}
	
ul#sideul li.teaser li{
	margin: 0 0 1em;}
	
.teaser a.more{
	font-weight: bold;}

#slideshow{
	position: relative;}      
#slideshow #preview img{
            display: block;}

	#slideshow #preview div.ui-tabs-hide {
		display: none !important;}

.portfolio-content{
	margin-right: 190px}



.page-nav{
	margin: 0 -5px 20px 0;
	text-align: right;}
	
	.page-nav li{
		display: inline;
		padding: 0 5px;}
