/* @override 
	http://thesurroundings.local/stylesheet.php?cssid=50&mediatype=all
	http://thesurroundings.local/stylesheet.php?cssid=50&mediatype=all
	http://thesurroundings.local/styles.css
	http://surr.chrisburbridge.com/styles.css
	http://sr2.chrisburbridge.com/styles.css
*/

/* Start of CMSMS style sheet 'Surroundings' */

/***** Sticky footer code, from http://www.cssstickyfooter.com *****/
html, body, #wrap { height: 100%; }
body > #wrap { height: auto; min-height: 100%; }
#main { padding-bottom: 35px; }  /* must be same height as the footer */
#footer {position: relative;
	margin-top: -35px; /* negative value of footer height */
	height: 35px;
	clear:both; } 
	
#footer p {
	font-size: 1em;
	color: #a3a5a8;
	text-align: left;
	margin-left: 195px;
}	

/* CLEAR FIX*/
.clearfix:after { 
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}
.clearfix { display: inline-block; }
/***** end sticky footer stuff *****/

body {
	font-size: .7em;
	color: #828386;
	font-family: "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
	line-height: 1.3em;
}

strong, h1, h2, h3, h4, h5, h6, th {
	color: #3f4042;
}

h1, h2, h3, h4, h5, h6, p {
	margin: 1em 0;
} 

h1 {
	text-transform: uppercase;
}

table {
	
}

ul, ol {
	margin: .6em 0 .8em 1.58em;
}

li {
	margin: 0 0 .3em 0;
}

a, a:link, a:visited, a:hover {
	text-decoration: none;
	color: #f7941d;
}

a:hover {
	color: #549E33;	
	/*-webkit-transition: color .4s ease-out;*/	
}

#wrap {
	width: 960px;
	background: #fff;
	margin: 0 auto;
}

#header {
	height: 132px;
	margin-left: 97px;
}

#logo {
	width: 186px;
	height: 75px;
	margin: 50px 0 0 0;
	float: left;
}

#logo p {
	display: none;
}

#navigation {
	float: left;
	margin-top: 82px;
	margin-left: 315px;
} 

#navigation ul {
	width: 90px;
	float: left;
	margin: 0;
}

#navigation li {
	margin: 0;
	line-height: .95em;
}

#navigation a.current {
	font-weight: bold;
	/*color: #5D5D5D;*/
	color: #5a5a5a;
}

#navigation a {
	/*color: #9da0a3;*/
	color: #7a797d;
	font-size: 9px;
	text-transform: uppercase;
}

#navigation a:hover,
#navigation a.current:hover {
	color: #f7941d;
	font-weight: bold;
}

#content {
	clear: both;
	width: 725px;
	margin: 22px 0 40px 97px;
	position: relative;
	z-index: 10;
}

.projects #content {
	width: 900px;
}

#footer {
	font-size: .8em;
	text-align: center;
	width: 960px;
	margin-left: auto;
	margin-right: auto;
}


/* page-specific */

.home p {
	font-size: 1.34em;
	font-size: 1.2596em;
	line-height: 1.57em;
}

.home p strong {
	font-weight: normal;
	color: #65676b;
}

#flash-intro {
	margin-left: 9px;
	margin-bottom: 34px;
	padding-top: 0;
	width: 663px;
	height: 311px;
	position:  relative;
}

#flash-intro #intro {
	position: relative;
}

#flash-intro #intro img {
	position: absolute;
	display: none;
}

#flash-intro #i-logo {
	left: 145px ;
	top:  95px;
}

#flash-intro #i-landscape {
	left: 360px ;
	top:  95px;
}

#flash-intro #i-architecture {
	left: 360px ;
	top:  138px;
}

#flash-intro #i-urbanism {
	left: 360px ;
	top:  186px;
}


#flash-intro #pause-play {
	position: absolute;	
	bottom:  0;
	right: 20px;
	z-index: 100;	
	width: 19px;	
	height: 19px;
	background-image: url(/modules/FlashIntro/img/pause.png);
}

#flash-intro .btn {
	margin:  0;
}

#flash-intro .btn span {
	display: none;
}

#flash-intro .btn:hover {
	opacity: .8;
}

#flash-intro #next {
	position: absolute;	
	bottom:  0;
	right: 0;
	background:  white;
	z-index: 100;
	width: 10px;	
	height: 19px;
	background-image: url(/modules/FlashIntro/img/play.png);
}

#flash-intro .slides,
#flash-intro .btn {
	display: none;
}

.resources #content {
	width: 890px;
	margin-left: 194px;
	margin-top: 48px;
}

.four-col {
	width: 161px;
	float: left;
	padding-right: 40px;
	font-size: .9em;
}

.four-col h2 {
	text-transform: uppercase;
	margin-bottom: .4em;
}

.four-col p {
	line-height: 1.2em;
	margin: 1px 0 4px 0;
}

.contact #content {
	margin-top: 0;
}

#contact {
	margin-left: 55px;
	margin-top: -3px;
}

#contact .right {
	padding-left: 86px;
	padding-top: 217px;
	width: 220px;
}

#contact .address {
	font-size: 1.1em;
	line-height: 1.26em;
}

#contact .phone, 
#contact .join {
	font-size: .8em;
	line-height: 1.4em;
}

#contact strong {
	font-weight: normal;
}

.home #content {
	margin-top: 19px;	
}

.projects #content {
	margin-left: 0;
}

#img-carousel-wrapper {
    height: 160px;
    width: 726px;
    position: relative;
    white-space: nowrap;
    margin: 58px 0 3px 100px;
    float: left;
    z-index: 10;
    overflow: hidden;
/*    border: 1px solid #000;*/
}

#img-carousel {
    height: 56px;
    width: 100%;
    white-space: nowrap;
    position: relative; 
    padding-top: 60px;
/*    background: #ccc;   */
}

#img-carousel-left {
	position: absolute;
	width: 325px;
	top: 0;
	left: 0;
	height: 160px;
	background: blue;
	opacity: .3;
}

#img-carousel-right {
	position: absolute;
	width: 325px;
	top: 0;
	left: 325px;
	height: 160px;
	background: green;
	opacity: .3;
}

.item {
	font-size: 1.3em;
	height: 56px;
	display: inline-block;
	margin-right: 10px;
	z-index : 0;
	left: 0;
	width: auto;
	margin-left: 0;
}

.leftmost {
/*  border-left: 6px solid red;*/
}

.rightmost {
/*  border-right: 6px solid red;*/
}

#caption {
	color: #54575f;
    margin-left: 9px;
    height: 40px;
    font-size: .9em;
	position: absolute;
	top: 212px;
	left: 0;
	text-transform: capitalize;
}

#caption .title {
    font-weight: bold;
}

#caption .category {

}

.absolute {
	position: absolute;
}

.hidden {
	display: none;
}

#sub-nav {
	margin-left: 194px;
	margin-top: 279px;
}

#sub-nav ul {
	margin: 0;
}

#sub-nav li.depth-1,
#sub-nav.sub-level h3 {
	float: left;
	text-transform: uppercase;
	font-size: .8em;
	width: 195px;
	margin: 0;
}

#sub-nav.sub-level h3 {
	margin-bottom: 1px;
	font-weight: normal;
	color: #54575f;
	width: 100%;
}

#sub-nav li.depth-1 a {
	color: #54575f;
	/*color: #5F626B;*/
}

#sub-nav li.depth-2,
#sub-nav.sub-level li {
	text-transform: capitalize;
}

#sub-nav.sub-level li a {
 	color: #97969a;
}

#sub-nav li.depth-2 a {
	/*color: #BABABF;*/
 	color: #97969a;
}

#sub-nav li.depth-1 a:hover {
	color: #54575f;
}

#bios {

}

#bio-1, 
#bio-2, 
#bio-3,
.hover {
	display: none;
}


#project-images {
	margin-top: 24px;
	/*height: 275px;*/
}

#main-image {
	margin-left: 196px;
	padding-bottom: 28px;
	min-height: 250px;
	position: relative;
	height: 350px;
	width: 620px;
}

#main-image .front, 
#main-image .back {
	width: 620px;
	height: 350px;
	position: absolute;
	bottom: 22px;
	background: #fff;
}

#main-image img {
	position: absolute;
	bottom: 0;
}

.front {
	z-index: 50;
}

.back {
	z-index: 10;
}

#other-images {
	/*width: 400px;*/
	margin-left: 196px;
	width: 528px;
	float: left;
	/*background: palegreen;*/
}

#project-nav {
	width: 118px;
	float: left;
	font-size: 9px;
	/*background: palegoldenrod;*/
}

#project-nav a {
	color: #7a797d;	
}

#project-nav .text {
	margin: 0 5px;
	vertical-align: 10px;
}

#project-nav .prev {
	margin-right: 9px;
}

#other-images img {
	padding: .16em;
}

#content.project-detail {
	width: 630px;
	float: left;
	margin-top: 0;
	margin-left: 14px;
	clear: none;
}

#sidebar {
	font-size: .7em;
	line-height: 1.4em;
	width: 80px;
	margin-top: 6px;
	float: left;
	margin-left: 99px;
	clear: both;
}

#image-block {
	height: 314px;
	position: relative;
	margin-bottom: 30px;
}

#image-block img {
	position: absolute;
	bottom: 0;
}

.people table {
	margin-top: 36px;	
	margin-bottom: 23px;
}

.people table td {
	padding-right: 18px;
}

.people table td.c1 {
	padding-right: 0;
}

.people table .r2 .c1 {
	font-style: italic;
	font-size: 9px;
	line-height: 1.4;
	text-transform: uppercase;
	padding-top: 12px;
	text-align: left;
	vertical-align: bottom;
}

.people table .r2 td {
	text-align: center;
	text-transform: uppercase;
	font-size: .8em;
	vertical-align: bottom;
}

.people table .c1 {
	width: 98px;
}


td.bio {
	/*cursor: url('images/bullseye.png');*/
}

.top-img {
	margin-left: 99px;
}