/*  
screen.css
robsurtees.com
site version 1.0
July 2008
Author: Iain Stewart
URL: www.coolfeed.com
*/
* {
	margin: 0;
	padding:0;
}
a, a:link, a:visited, a:active { color: #fff; text-decoration:none; outline:none; }
a:hover { text-decoration:none; color: #87cefa; }
body {
	background-color: #000;
	font: normal 12px "Trebuchet MS","Lucida Grande", Arial,  Verdana, Helvetica,  sans-serif;
	color: #e5e5e5; 
	line-height:18px; 
	margin: 10px 0 10px 0;
	padding:0;
}
.container {
position: relative;
	margin-left:auto;
	margin-right:auto;
	width:960px;
	height: 620px;
}
#header {
	position: relative;
	width: 960px;
/*	height: 100px;*/
}
h1 {
	position: absolute;
	top: 10px;
	left: 10px;
}
h1 a {
	display: block;
	width: 146px;
	height: 23px;
	background: transparent url(../i/bg/rslogo-bg2.gif) no-repeat 0 0;
	text-indent: -9000em;
}
h2.work-description {
	position: absolute;
	top: 10px;
	right: 10px;
	width: 116px;
	height: 17px;
	background: transparent url(../i/bg/photography2.gif) no-repeat 0% 100%;
	padding: 0;
	text-indent: -9999em;
}
#leftnav {
	position: absolute;
	top: 100px;
	left:10px;
	width: 160px
}
#leftnav ul {
	list-style: none;
}
#leftnav li {
	margin-bottom: 18px;
}
#leftnav li a {
	display: block;
	text-indent: -9000em;
}
#leftnav li a.homepage, #leftnav li a:link.homepage, #leftnav li a:visited.homepage, #leftnav li a:active.homepage {
	height: 12px;
	width: 36px;
	background: transparent url(../i/bg/home-bg1.gif) no-repeat 0 0;;
}
#leftnav li a:hover.homepage {
	background: transparent url(../i/bg/home-bg1.gif) no-repeat 0px -12px;
}
#leftnav li a.contactpage, #leftnav li a:link.contactpage, #leftnav li a:visited.contactpage, #leftnav li a:active .contactpage {
	height: 12px;
	width: 57px;
	background: transparent url(../i/bg/contact-bg1.gif) no-repeat 0 0;;
}
#leftnav li a:hover.contactpage {
	background: transparent url(../i/bg/contact-bg1.gif) no-repeat 0px -12px;
}
#site-info {
	position: absolute;
	top: 520px;
	left: 10px;
	width: 160px;
	height: 30px;
}
#site-info p {
	font-size: 10px;
}
#site-credit {
	position: absolute;
	top: 520px;
	right: 10px;
	width: 160px;
	height: 30px;
}
#site-credit p.web-design {
	font-size: 9px;
	text-align: right;
	padding: 3px 0;
}
#main-photo {
	position: absolute;
	top: 45px;
	left: 170px;
	text-align: center;
}
#main-photo.landscape {
	width: 634px;
	height: 100%;
	text-align: center;
	margin: 0 auto;
}
#main-photo img {
	display: block;
	margin: 0 auto;
	text-align: center;
	border: 5px solid #fff;
	
}
img#largeImg {
	border: none;
}
#main-photo .portrait {
	height:495px;
	width: 100%;
}
#contact-photo {
	position: absolute;
	top: 108px;
	left: 170px;
}
#contact-photo .square {
	width: 420px;
	height: 320px;
}
#contact-details {
	position: absolute;
	top: 180px;
	left: 650px;
	width: 160px;
}
#contact-details a.fn {
	text-transform: uppercase;
	padding: 5px 0;
}
#contact-details p.hcard-download {
	margin-top: 50px;
		padding: 5px 0;
}
#contact-details div.email {
	margin-top: 18px;
		padding: 5px 0;
}

/*#rightnav li a {
	display: block;
	text-indent: -9999em;
	height: 11px;
	width: 60px;
}*/
#rightnav li a.people1, #rightnav li a:link.people1,#rightnav li a:visited.people1,#rightnav li a:active.people1 {
	background: transparent url(../i/bg/people1-bg.gif) no-repeat top right;
}
#rightnav li a:hover.people1 {
	background: transparent url(../i/bg/people1-bg.gif) no-repeat 0 -11px;
}
#rightnav li a.people2, #rightnav li a:link.people2,#rightnav li a:visited.people2,#rightnav li a:active.people2 {
	background: transparent url(../i/bg/people2-bg.gif) no-repeat top right;
}
#rightnav li a:hover.people2 {
	background: transparent url(../i/bg/people2-bg.gif) no-repeat 0 -11px;
}
#rightnav li a.places1, #rightnav li a:link.places1,#rightnav li a:visited.places1,#rightnav li a:active.places1 {
	background: transparent url(../i/bg/places1.gif) no-repeat top right;
}
#rightnav li a:hover.places1 {
	background: transparent url(../i/bg/places1.gif) no-repeat 0 -11px;
}
#rightnav li a.places2, #rightnav li a:link.places2,#rightnav li a:visited.places2,#rightnav li a:active.places2 {
	background: transparent url(../i/bg/places2.gif) no-repeat top right;
}
#rightnav li a:hover.places2 {
	background: transparent url(../i/bg/places2.gif) no-repeat 0 -11px;
}
#rightnav li a.showbiz1, #rightnav li a:link.showbiz1,#rightnav li a:visited.showbiz1,#rightnav li a:active.showbiz1 {
	background: transparent url(../i/bg/showbiz1.gif) no-repeat top right;
}
#rightnav li a:hover.showbiz1 {
	background: transparent url(../i/bg/showbiz1.gif) no-repeat 0 -11px;
}
#rightnav li a.showbiz2, #rightnav li a:link.showbiz2,#rightnav li a:visited.showbiz2,#rightnav li a:active.showbiz2 {
	background: transparent url(../i/bg/showbiz2.gif) no-repeat top right;
}
#rightnav li a:hover.showbiz2 {
	background: transparent url(../i/bg/showbiz2.gif) no-repeat 0 -11px;
}
#thumbs-l {
	position: absolute;
	top: 510px;
	left: 170px;
	height: 100px;
	width: 634px;
}
#thumbs-l ul {
	list-style: none;
	margin-left: 5px;
}
#thumbs-l li {
	display: inline;
	padding-right: 10px;
	padding-bottom: 5px;
}
#thumbs-l li.first {
	margin-left: 4px;
}
#thumbs-l li img {
	border: 2px inset #bbbbbb;
}
#thumbs-l a:link img, #thumbs-l a:visited img,#thumbs-l a:active img {
	border: 2px solid #ffffff;
}
#thumbs-l a:hover img {
	border: 2px solid #4682b4;
}
/* portrait thumbs at left side */
#thumbs-p {
	position: absolute;
	top: 70px;
	/*left: 670px;*/
	left: 170px;
	width: 110px;
	height: 495px;
}
#thumbs-p ul {
	list-style: none;
	float: left;
	width: 49px;
}
#thumbs-p li {
	padding-bottom: 10px;
}
#thumbs-p li img {
	border: 2px solid #cacaca;
}
#thumbs-p a:link img, #thumbs-p a:visited img,#thumbs-p a:active img {
	border: 2px solid #ffffff;
}
#thumbs-p a:hover img {
	border: 2px solid #4682b4;
}
#thumbs-p ul.row2 {
	float:left;
	width: 49px;
	margin-left: 10px;
}
/* portrait thumbs along bottom */
#thumbs-p1 {
	position: absolute;
	top: 570px;
	/*left: 670px;*/
	left: 170px;
	width: 630px;
	height: 100px;
}
#thumbs-p1 ul {
	list-style: none;

}
#thumbs-p1 li {
	padding-right: 10px;
	padding-bottom: 5px;
	display: inline;
}
#thumbs-p1 li img {
	border: 2px solid #cacaca;
}
#thumbs-p1 a:link img, #thumbs-p1 a:visited img,#thumbs-p1 a:active img {
	border: 2px solid #ffffff;
}
#thumbs-p1 a:hover img {
	border: 2px solid #4682b4;
}

hr {
	clear: both;
	color: #000;
}
#leftarrow {
	position: absolute;
	top: 260px;
	left: 140px;
	height: 22px;
	width: 12px;
}
#leftarrow a {
		display: block;
		background: transparent url(../i/bg/leftarrow.gif) no-repeat 0 0;
	text-indent: -9000em;
		margin: 0;
	padding: 0;
	border: none;
}
/*#leftarrow a:link, #leftarrow a:visited, #leftarrow a:active {
	text-decoration: none;
	border: none;
	background: transparent url(../i/bg/leftarrow.gif) no-repeat 0 0;
}*/
#leftarrow a:hover {
	background: transparent url(../i/bg/leftarrow.gif) no-repeat 0 -22px;
}
#rightarrow {
	position: absolute;
	top: 260px;
	left: 820px;
	height: 22px;
	width: 12px;
}
/*#rightarrow ul {
	list-style: none;
}*/
/*#rightarrow li {
	padding:0;
}*/
#rightarrow a {
	display: block;
	background: transparent url(../i/bg/rightarrow.gif) no-repeat 0 0;
	text-indent: -9000em;
	margin: 0;
	padding: 0;
	border: none;
}
/*#rightarrow a:link, #rightarrow a:visited, #rightarrow a:active {
		text-decoration: none;
	border: none;
	background: transparent url(../i/bg/rightarrow.gif) no-repeat 0 0;
}*/
#rightarrow a:hover {
	background: transparent url(../i/bg/rightarrow.gif) no-repeat 0 -22px;
}
#photocaption {
	position: absolute;
	top: 400px;
	left: 850px;
	height: 40px;
	width: 105px;
}
#photocaption p {
	font-size: 11px;
	text-align: left;
	line-height: 14px;
	color: #fff;
	background-color: transparent;
	padding: 4px 0;
	margin: 0;
}
#gallery-title {
	position: absolute;
	top: 520px;
	left: 10px;
	height: 20px;
	width: 150px;
}
#gallery-title p {
	text-align: left;
	font-size: 11px;
	text-transform: uppercase;
	font-weight: bold;
	letter-spacing: 0.1em;
}
#next-gallery {
	position: absolute;
	top: 520px;
	right: 10px;
	height: 20px;
	width: 150px;
}
#next-gallery p {
	text-align: right;
	font-size: 11px;
	font-style: italic;
	font-weight: bold;
	letter-spacing: 0.1em;
}
.hide {
	display: none;
}
/* slideshow */
.pics {  
    position: relative;
	 /*height:  370px;*/  
    width:   630px;  
    padding: 0;  
    margin:  0;  
} 


.pics img {  
    padding: 0px;  
    border:  0;  
    background-color: #e6e6e1;  
    width:  630px; 
    height: 100%; 
    top:  0; 
    left: 0 
}
.nav { margin: 5px 0 }
#nav a { margin: 0 5px; padding: 3px 5px; border: 1px solid #ccc; background: #fc0; text-decoration: none }
#nav a.activeSlide { background: #ea0 }
#nav a:focus { outline: none; }
#output { text-align: left; }
#nav { text-align: left; margin: 3px }
/* home page right menu */
#rightnav {
	position: absolute;
	top: 100px;
	right: 10px;
	height: 280px;
	width: 70px;
}
#rightnav1 {
	position: absolute;
	top: 100px;
	right: 10px;
	height: 280px;
	width: 130px;
}
#rightnav ul, #rightnav1 ul {
	list-style: none;

}
#rightnav li {
	/*margin-bottom: 5px;*/
		list-style: none;
	
}
/* accordion */
* html ul ul li a { height: 100%; }
		* html ul li a { height: 100%; }
		* html ul ul li { margin-bottom: -1px; }
	.js #homemenu li ul {display: none;}	
		#homemenu { width: 130px; height: 200px; margin: 0 0 0 20px;; padding: 0; }
		
		/* Some list and link styling */
		ul li { width: 130px; margin-bottom:14px;	text-align: left; }
		ul ul li { padding: 0px; width: 120px; margin-bottom:0px;	text-align: right; }
		ul ul li a { display:block; color: #fff; background-color: transparent; padding: 3px 0; font-size: 11px; }
		ul ul li a:hover { display:block; color: #87cefa; background-color: transparent; padding: 3px 0; font-size: 11px; }
 }
	
		/* Header links styling */
		p.head {
			font-size: 12px;
			margin-left: 10px;
			text-transform: uppercase;
		}
		p.head a { 
		color: #fff;
		display:block; 
		background-color: transparent;
		padding: 5px 0;
		text-transform: uppercase;
		}
		p.head a:hover { 
		color: #87cefa;
		background-color: transparent;

		}
		p.selected a { 
background-color: transparent;
		color: #fff;
		padding: 5px 0;
		}
		p.selected a:hover { 
background-color: transparent;
		color: #87cefa;
		}
		
	