/* Reset Brower Defaults */
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:normal;font-style:inherit;font-size: 100%;font-family: inherit;vertical-align: baseline;}
/*:focus {outline: 0;}*//* remember to define focus styles! */
body {line-height: 1;color: black;background: white;}
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;}
blockquote:before, blockquote:after,q:before, q:after {content: "";}
blockquote, q {quotes: "" "";}
hr {display:none;}

body {
	font-size: 62.5%;
	color: rgb(145,147,150);
	font-family: Arial, sans-serif;
	background-color: #fff;
	margin:28px;
}
a {
	color: #545454;
}
a:hover, a.active {
	color: #90a91b;
}
a:focus {outline: 0;}


#container {
	position: relative;
	margin: 0 auto 0 auto;
	width: 980px;
	height: 670px;
}
#logo {
	position: absolute;
	top: 0;
	left: 40px;
	z-index: 10;
	background-color: rgb(35,31,32);
	background-color: rgba(35,31,32,.7);
	
}
#logo:hover {  /*update ie css*/
/*	background-color: rgb(198,180,79);*/
/*	background-color: rgba(198,180,79,.5);*/
	background-color: rgb(35,31,32);
	background-color: rgba(35,31,32,.5);
}
#logo a {
	position: relative;
	display: block;
	width: 328px;
	height: 67px;
	background: transparent url(/i/graphics.png) no-repeat -52px 0;
}
#logo a.logo-1 { background-position: -52px 0; }
#logo a.logo-2 { background-position: -52px -60px; }
#logo a.logo-3 { background-position: -52px -120px; }
#logo a.logo-4 { background-position: -52px -180px; }
#logo a.logo-5 { background-position: -52px -240px; }
#logo a.logo-6 { background-position: -52px -300px; }

#content {
	position: relative;
	
	width: 980px;
	height: 670px;

	background-color: rgb(35,31,32);
/*	background: transparent url(/i/photos-intro/Untitled-2.jpg);*/
}

#content-label {
	position: absolute;
	top: 13px;
	left: 38px;
	font-size: 1.2em;
	color: #fff;

}
#content-label a {
	color: #fff;
	text-decoration: none;
}
#textbar {
	position: absolute;
	top: 245px;
	left:0;
	z-index: 10;
	width: 980px;
	height: 180px;
}
#textbar #textbar-background {
	position: absolute;
	top:0;
	left:0;
	z-index:8;
	width: 980px;
	height: 180px;
	background: rgb(35,31,32);
	opacity:.7;
/*	background: rgba(35,31,32,.7);*/
}
#textbar { cursor: pointer; }
.intro #textbar p, .home #textbar p {
	position:relative;
	z-index:10;
	top:0;
	left:0;
	z-index:9;
	width:auto;
	font-size: 3.6em;
	text-align:center;
	line-height: 180px;
	text-shadow: 1px 1px 5px rgb(35,31,32);
}
#textbar p {
	position: relative;
	z-index: 9;
	color: #fff;
	text-align: justify;
	font-size: 2.1em;
	line-height: 1.3em;
	font-family: "Helvetica Neue Light", "HelveticaNeue-Light", Arial, Helvetica, sans-serif;
	font-weight: 300;
	width: 640px;
	margin: 0 auto;
/*	border: 1px solid #f00;*/
}
#textbar p cite {
	display: block;
	text-align: right;
	font-size: .8em;
}

#image-mask {
	position:absolute;
	top:0;
	left:0;
	z-index:8;
	width:980px;
	height:670px;
	background-color:transparent;
}

#content #images {
	position:relative;
	top: 0;
	left: 0;
	z-index: 3;
	width:980px;
	height:670px;
/*	margin-top: -200px;*/
	overflow: hidden;
}
#content #images ul { position: relative;	z-index: 0; }
#content #images ul li {
	position: relative;
	z-index: 0;
	width: 980px;
}
#content #images ul li object {
	position: relative;
	z-index: 0;
}


#content-nav {
	position:	absolute;
	bottom: 22px;
	left: 0;
	z-index: 9;
	overflow: hidden;
	
	width: 980px;
	height: 134px;
	background: rgb(35,31,32);
	background: rgba(35,31,32,.6);
}
#content-nav.closed { height: 14px; }
#content-nav.open { height: 134px; }
#content-nav #content-nav-items {
	position:relative;
	top: 30px;
	left: 0;
	margin: 0 36px 0 38px;
	width: 904px;
	height: 80px;
	overflow: hidden;
/*	background-color: red;*/
/*	border: 1px solid #f00;*/
}
#content-nav ul { position: relative; }
#content-nav ul li {
	position: relative;
	display: block;
	float: left;
	width: 226px;
	height: 80px;
}
#content-nav ul li a {
	display:block;
	width: 116px;
	height: 80px;	
}
#content-nav ul li img {
	background: rgb(35,31,32);
}
#content-nav ul li a:hover, #content-nav ul li.active a	{
	position: relative;
	border: 2px solid #FFF100;
	width: 112px;
	height: 76px;
	overflow: hidden;
/*	margin: -2px;*/
}
#content-nav ul li a:hover img, #content-nav ul li.active a img { margin: -2px; }


#content-nav ul li .title {
	position: absolute;
	bottom: 0;
	left: 122px;
	font-size: 1.2em;
	color: #fff;
/*	border: 1px solid red;*/
}

.arrows-previous, .arrows-next {
	position: absolute;
	top: 306px;
	z-index: 18;
	width: 23px;
	height: 61px;
	background-color: rgb(35,31,32);
	background-color: rgba(35,31,32,.6);
}
.arrows-previous { left: 0; }
.arrows-next { right: 0; }
.arrows-previous a, .arrows-next a {
	display: block;
	width: 23px;
	height: 61px;
	background: transparent url(/i/graphics.png) no-repeat 0 -148px;
}
.arrows-previous a:hover, .arrows-previous a.disabled { background-position: 0 -77px; }
.arrows-next a { background-position: -33px -148px; }
.arrows-next a:hover, .arrows-next a.disabled { background-position: -33px -77px; }
#content-nav .arrows-previous, #content-nav .arrows-next { top: 37px; background: none; }
#content-nav .arrows-previous { left: 6px; }
#content-nav .arrows-next { right: 6px; }
#content-nav .arrows-next a { background-position: -33px -148px; }
#content-nav .arrows-next a:hover, #content-nav .arrows-next a.disabled { background-position: -33px -77px; }
.arrows-next a.disabled, .arrows-previous a.disabled {
	cursor: default;
}


/* Work page: grid view */
.work_grid #image-mask { display:none; }

#content #images #grid, #content #images #client-list {
	position: relative;
}
.work #content #images, .work_clients_list #content #images {
	padding-top: 95px; 
	height: 575px;
}
#content #images #grid li {
	float: left;
	width: 160px;
	height: 110px;
	margin: 0 4px 4px 0;
}
#content #images #grid li.end {
	margin: 0 0 4px 0;
}
#content #images #grid li a {
	display: block;
	width: 160px;
	height: 110px;
/*	background-color: #333;*/
}
#content #images #grid li a:hover {
/*	background-color: #444;*/
}

#content #images .grid-nav {
	clear: both;
	float: left;
	width: 95%;
	position: relative;
	margin: 14px 0 0 40px;
/*	border: 1px solid #f00;*/
}
#content #images .grid-nav li {
	float: left;
	width: 110px;
}
#content #images .grid-nav li a {
	display: block;
	text-decoration: none;
	padding: 2px 0;
	font-size: 1.1em;
}

.work_clients_list #content #images {
	overflow: auto;
}
#content #images #client-list {
/*	padding-top: 95px;*/
	margin: 0 36px 0 64px;
	text-align: center;
}
#content #images #client-list li {
/*	float: left;*/
	display: inline;
	width: auto;
	font-size: 1.8em;
	color: #838A8F;
	padding: 2px 15px 15px 0;
	line-height: 50px;
}
#content #images #client-list li span {
	display: inline-block;
	margin-top:-10px;
	vertical-align: middle;
}

#content #images #client-list li a {
	white-space:nowrap;
	text-decoration: none;
	color: #838A8F;
}
#content #images #client-list li a:hover {
	color: #90a91b;
}
.work_clients_list #image-mask { display:none; }

/* description text [bottom right] */
#description, #nav {
/*	margin-top: 684px;*/

}
#description {
	position: relative;
	z-index: 6;
	float: right;
	margin-top: 14px;
	width: 540px;

	font-size: 1.3em;
	text-align: justify;
	line-height: 1.2em;
}
#description p { padding:0; margin-top:0; margin-bottom: 1em; }

#nav {
	position: relative;
	z-index:5;
	float: left;
	margin: 14px 0 0 40px;
}
#nav ul {
/*	position: relative;*/
	width: 400px;
/*	border: 1px solid #f00;*/
}
#nav ul li {
/*	position: relative;*/
	float: left;
	width: 105px;
	white-space: nowrap;
/*	border: 1px solid #f00;*/
/*	background-color: red;*/
}
#nav ul li a, #nav ul li.active li a {
	display: block;
	padding: 0 0 .5em 0;
	color: rgb(145,147,150);
	text-decoration: none;
	text-transform: uppercase;
	font-size: 1.2em;
	background-color: #fff;
/*	border: 1px solid #f00;*/
}
#nav ul li a:hover, #nav ul li.active a {
	color: rgb(235,28,36);
}
#nav ul li ul {
	position: relative;
/*	visibility: hidden;*/
	display: none;
	width: auto;
}
#nav ul li ul li {
/*	position: relative;*/
/*	float: none;*/
/*	clear:left;*/
/*	width: 150px;*/
}
#nav ul li.active ul { z-index: 50; }
#nav ul li:hover ul { z-index: 51; }
#nav ul li.active ul { /*, #nav ul li:hover ul*/
/*	visibility: visible;*/
	display: block;
}
#nav ul ul li a:hover, #nav ul li.active li.active a  {	color: rgb(88,89,91); }







/* hide text on images repacement */
#logo a, .arrows-previous a, .arrows-next a {
	text-indent: -1000em;
	overflow: hidden;
}

/* thin text trick */
#description, #nav li a {
/*	text-shadow: 1px 1px 1px #fff;*/
}
#content #images .grid-nav li a {
/*	text-shadow: 1px 1px 1px rgb(35,31,32);*/
}