/* Getting the new tags to behave */
article, aside, audio, canvas, command, datalist, details, embed, figcaption, figure, footer, header, hgroup, keygen, meter, nav, output, progress, section, source, video{ display: block; }
mark, rp, rt, ruby, summary, time{ display: inline }

/* Global properties ======================================================== */
body {
	background:url(../images/tail-top.gif) 0 0 repeat-x #383838;
	font-family:Arial, Helvetica, sans-serif;
	font-size:100%;
	line-height:1.09em;
	color:#808080;
	margin: 0;
	padding: 0;
}
html { min-width:1176px;}

/* Global Structure ============================================================= */
#main {
	margin: 0 auto;
	position: relative;
	width: 1176px;
	font-size:.75em;
}

	/* Header */
	header{
		margin-bottom:11px;
		background:url(../images/divider.gif) 293px 0 repeat-y #000;
	}
	
	/* Content */
	section#content {
		padding:0 0 15px 0;
	}
	.mainContent {
		float:left;
		width:800px;
	}
	
	/* Sidebar */
	aside{
		width:280px;
		float:left;
	}
	aside.left {
	float:left;
	margin-right:1px;
	margin-bottom:10px;
	}
	
	aside.left2 {
	float:left;
	text-align: center;
	width: 200px;
	margin-bottom:10px;
	vertical-align: middle;
	}
	
	aside.right {
		margin-right:0;
		margin-left:1px;
	}
			
	/* Footer */
	footer{
	width:588px;
	padding-bottom:6px;
	text-align: center;
	margin-top: 0;
	margin-right: auto;
	margin-bottom: 0;
	margin-left: auto;
	}




/* Left & Right alignment */

.fleft { float:left;
margin-bottom: 50px;}

.fleft2 { float:left;
margin-bottom: 50px;
width: 100%;
text-align: center;}

.fright { float:right;
width: 100%;
}
.clear { clear:both;}

.col-1, .col-2, .col-3 { float:left;}

.alignright { text-align:right;}
.aligncenter { text-align:center;}

.wrapper {
	width: 100%;
	overflow: hidden;
}

/* The inside class provides consistent padding. To be used often! */
.inside{ padding: 20px; }


/*----- form defaults -----*/
input, select, textarea { 
	font-family:Arial, Helvetica, sans-serif;
	font-size:1em;
	vertical-align:middle;
	font-weight:normal;
}

/*----- other -----*/
figure { 
	margin:0 20px 0 0; 
	float:left;
}
.img-box {
	width:100%;
	overflow:hidden;
	padding-bottom:22px;
	text-align: left;
}

.text-box p {
	width:465px;
	left:30%;
	font: "titilliumText22L Lt";
	color:#c0c0c0;
	text-align:left;
	text-indent:25px;
}

.text-box {
	position:absolute;
	left:55%;	
	font: "titilliumText22L Lt";
	font-size:13px;
	
}

.extra-wrap { 
	overflow:hidden;
}

p {margin-bottom:18px;}
.p1 { margin-bottom:9px;}
.p2 { margin-bottom:18px;}
.p3 { margin-bottom:27px;}

p.justify {text-align:justify;}


/*----- txt, links, lines, titles -----*/
a {
	color:#fff; 
	outline:none;
}
a:hover{
	text-decoration:none;
}

h1 {
	font-size:32px;
	line-height:1.2em;
	color:#fff;
	font-weight:normal;
	text-transform:uppercase;
	padding:0 0 0 20px;
	float:left;
	height:64px;
	line-height:64px;
}
	h1 a {
		color:#fff;
		text-decoration:none;
	}
h2 {
	font: "MS Serif", "New York", serif;
	font-size:18px;
	color:#fff;
	font-weight:normal;
	padding:13px 0 13px 20px;
	background:#272727;
	text-transform:uppercase;
	text-shadow: 0 1px 0 black;
	margin-bottom:5px;
}
h3 {
	font-size:18px;
	color:#fff;
	font-weight:normal;
	background:#121212;
	text-transform:uppercase;
	margin-bottom:1px;
	padding-top: 13px;
	padding-right: 0;
	padding-bottom: 13px;
	padding-left: 4px;
	text-shadow:0 1px 0 #black;
}
h4 {
	font-size:1em;
	color:#fff;
	font-weight:normal;
}

h5 {
	font: "MS Serif", "New York", serif;
	font-size:18px;
	color:#fff;
	font-weight:normal;
	padding:13px 0 13px 20px;
	background:#1B1B1B;
	text-transform:uppercase;
	text-shadow: 0 1px 0 black;
	margin-bottom:5px;
}



mark {
	color:#fff;
	background:none;
}

.link1 { 
	text-transform:uppercase;
}
	

.button { 
	display:inline-block;
	background:#000;
	padding:10px 20px;
	text-transform:uppercase;
	text-decoration:none;
	margin-bottom:1px;
}
.button:hover {
	background:#fff;
	color:#000;
}


/*==================boxes====================*/
.box {
	background:#272727;
	overflow:hidden;
	margin-bottom:100px;
	width: 95%;
	padding-top: 14px;
	padding-right: 17px;
	padding-bottom: 14px;
	padding-left: 19px;
	margin-left: 70px;
}
	.box h2 {
		padding:0;
		margin-bottom:18px;
	}

.box1 {
	background:#000;
	padding:14px 17px 0px 19px;
	overflow:hidden;
	margin-bottom:1px;
	width: 103%;
}
	.box1 h3 {
		padding:0;
		margin-bottom:18px;
		background:#000;
	}
	
.box9 {
	background:#000;
	padding:14px 17px 14px 19px;
	overflow:hidden;
	margin-bottom:1px;
	width: 95%;
	margin-left: 70px;
}
	.box1 h3 {
		padding:0;
		margin-bottom:18px;
		background:#000;
	}

.box3 {
	background:#272727;
	overflow:hidden;
	margin-bottom:1px;
	width: 103%;
	padding-top: 14px;
	padding-right: 17px;
	padding-bottom: 14px;
	padding-left: 19px;
	margin-right: 20px;
}
	.box3 h2 {
		padding:0;
		margin-bottom:18px;
	}
	
.box4 {
	background:#272727;
	overflow:hidden;
	margin-bottom:50px;
	width: 99%;
	padding-top: 14px;
	padding-right: 80px;
	padding-bottom: 14px;
	padding-left: 19px;
}
	.box4 h2 {
		padding:0;
		margin-bottom:18px;
	}

.box5 {
	background:#1B1B1B;
	padding:14px 30px 14px 19px;
	overflow:hidden;
	margin-bottom:10px;
	width: 940px;
}
	.box5 h3 {
		padding:0;
		margin-bottom:18px;
		background:#000;
	}
	
.box6 {
	background:#272727;
	overflow:hidden;
	margin-bottom:15px;
	margin-right: 5px;
	width: 940px;
	padding-top: 14px;
	padding-right: 30px;
	padding-bottom: 14px;
	padding-left: 19px;
}
	.box6 h2 {
		padding:0;
		margin-bottom:18px;
	}


.address { 
	float:left;
}
	.address dt {
		margin-bottom:16px;
	}
	.address dd { 
		clear:both;
		text-align:right;
	}
		.address dd span { 
			float:left;
			padding-right:25px;
		}

#video {
	width: 296px;
	margin-left: -15px;
	margin-top: 30px;
}

#work {
	float:left;
	width: 300px;
	padding:10px;
	padding-right:70px;
}

#work p {
	margin-top:10px;
	text-decoration:none;
	text-shadow:0 1px 0 black;
}

#work img {
	border: 1px solid black;
}

#work a {
	text-decoration:none;	
}

#work a:hover {
	text-decoration: underline;	
}

#work 2{
  	float:left;
	width:400px;
	height:300px;		
}

#work8 {
	float: right;
	width: 400px;
	height:300px;
	margin-top:21px;
}


#work2 {
	float: left;
	width: 300px;
	padding: -10px;
	margin-left: 10px;
	margin-top: 21px;
	height:300px;

	
}

.GoBack {
	text-align:left;
	font-size:14px;
}

.GoBack2 {
	text-align:left;
	font-size:16px;
}

.GoBack3 {
	text-align:left;
	font-size:18px;
	line-height:2em;
}
	
#work3 {
	float: left;
	width: 200px;
	padding: -10px;
	margin-left: 10px;
	margin-right: 20px;
	margin-top: 21px;
}

#work4 {
	float: left;
	width: 500px;
	padding: -10px;
	margin-left: -50px;
	margin-right: 10px;
	margin-top: 21px;
}

#work5 {
	float: left;
	width: 500px;
	padding: -10px;
	margin-left: 10px;
	margin-right: 110px;
	margin-top: 21px;
}

#workbox {
	width: 940px;
	height: 350;
}

#variance {
	width:300px;
	height: 200px;
}
/*===== header =====*/
/****
header .projects {
	padding:19px 0 7px 313px; 
	overflow:hidden;
	position:relative;
	display:none;
}
	header .projects li {
		float:left;
		width:150px;
		padding-right:20px;
		padding-bottom:13px;
		overflow:hidden;
	}
		header .projects li a {
			float:left;
			color:#808080;
			text-transform:uppercase;
			text-decoration:none;
			width:304px;
			line-height:56px;
			position:relative;
			text-indent:-2000px;
		}
		
		header .projects li img {
			position:absolute;
			left:0;
			top:0;
		}
		
		header .projects img:hover {		    	
			-webkit-border-radius: 5px;
			-moz-border-radius: 5px;
			border-radius: 5px;
			border: 2px solid #c0c0c0;
			-webkit-transition: background .5s;
			-moz-transition: background .5s;
			-o-transition: background .5s;
			transition: background .5s;
		}
		****/
header nav {
	float:right;
}
	header nav li {
		float:left;
		border-right: 1px solid #3e3e3e;
	}
		header nav li a {
			float:left;
			width:125px;
			border-right:1px solid #2b2b2b;
			border-top:1px solid #2e2e2e;
			font-size:20px;
			text-transform:uppercase;
			font-family:"Trebuchet MS";
			color:#a7a7a7;
			text-decoration:none;
			text-shadow: 0 1px 0 #646464;
			line-height:1em;
			padding:40px 10px 20px 10px;
			height: 40px;
		}
		header nav li:first-child a {
			border-top:none;
		}
		header nav li span {
			display:inline-block;
			width:23px;
			height:12px;
			background:url(../images/arrow.gif) no-repeat 0 0;
			overflow:hidden;
			margin:3px 0 0 4px;
		}
		header nav li a.active span {
			background-position:0 -8px;
		}
		header nav li a:hover, header nav li a.current {
			color:#fff;
			text-shadow: 0 1px 0 #646464;
		}

/*===== content =====*/
#content article {
	margin-bottom:1px;
	width: 100%;
}`
#content article .content {
	background:#272727;
	padding:16px 20px 16px 20px;
	text-transform:uppercase;
	width: 100%;
}
	.gallery {
	width: 100%;
	
	}
		.gallery li {
			float:left;
			margin:0 1px 1px 0;
		}
			.gallery li a {
				position:relative;
				width:293px;
				height:254px;
				color:#808080;
				text-decoration:none;
				display:block;
			}
	
			.gallery li a span.description {
				width:293px;
				height:254px;
				position:absolute;
				left:0;
				top:0;
				background:url(../images/desc-bg.png) 0 0;
				z-index:2;
				cursor:pointer;
				display:none;
				text-shadow: 0 1px 0 black;
			}
				.gallery li a span mark {
					line-height:21px;
					color:#fff;
					text-transform:uppercase;
					display:block;
					position:absolute;
					left:22px;
					top:24px;
				}
				.gallery li a span em {
					font-style:normal;
					display:block;
					position:absolute;
					left:21px;
					bottom:24px;
					background:url(../images/arrow-right.gif) no-repeat 100% 100%;
					padding-right:67px;
				}
	
	
	.menu ul {
		height:38px;
		padding-bottom:1px;
		background-color:#1B1B1B;
		padding-top:10px;
		padding-bottom:10px;
		color:#808080;
		font: "MS Serif", "New York", serif;
		text-shadow: 0 1px 0 black;
		text-transform:uppercase;			
	}
	
	.menu li {
		width:100%;
		overflow:hidden;
		padding-bottom:1px;
		height: 38px;
	}
		.menu li a {
	font: "MS Serif", "New York", serif;
	text-shadow: 0 1px 0 black;
	display:block;
	text-transform:none;
	color:#808080;
	text-decoration:none;
	padding-top: 10px;
	padding-right: 0;
	padding-bottom: 10px;
	padding-left: 0px;
	background-color: #1B1B1B;
		}
		.menu li a span {
			display:inline-block;
			width:29px;
			height:15px;
			background:url(../images/arrow3.gif) no-repeat 0 0;
			overflow:hidden;
			margin:3px 0 0 24px;
		}
		.menu li a.active span {
			background-position:0 -15px;
		}
		.menu li a:hover {
			color:#fff;
		}
			.menu li ul {
				margin:1px 0 -1px 0;
				display:none;
			}
			.menu li li a {
				margin-left:34px;
				background:#272727;
			}
	
	
	.list1 {
		padding-bottom:10px;
		width:100%;
		overflow:hidden;
	}
	.list1.alt {
		padding-bottom:0;
	}
		.list1 li {
			background:url(../images/arrow-small.gif) no-repeat 0 6px;
			padding:0 0 10px 22px;
			text-transform:uppercase;
		}
			.list1 li a {
				text-decoration:none;
			}
			.list1 li a:hover {
				text-decoration:underline;
			}
		.list1.half li {
			float:left;
			width:46%;
		}
	
	
	.img-list {
		padding-bottom:4px;
	}
	.img-list li {
		width:100%;
		overflow:hidden;
		padding-bottom:20px;
	}
		.img-list li img {
			float:left;
			margin-right:19px;
		}
#artists {
	margin-left: -15px;
	padding-right: -10px;
	text-align: center;
	width: 220px;
	font: "MS Serif", "New York", serif;
	text-shadow: 0 1px 0 #000000;
}

#logo {
	float: left;
}

/*===== footer =====*/
footer {
	text-transform:uppercase;
	color:#747474;
	width: 800px;
	z-index: 0;
	text-shadow: 0 1px 0 black;
}
	footer a {
		color:#747474;
		text-decoration:none;
	}
	footer a:hover {
		text-decoration:underline;
	}
footer nav {
	padding-bottom:9px;
}
	footer nav li {
		display:inline;
		padding-right:20px;
		text-align: center;
}
		footer nav li a {
			text-decoration:none;
			text-transform:uppercase;
			color:#fff;
			text-align: center;
	}

/*==========================================*/

@font-face {
	font-family: "Trebuchet MS";
	src:(http://advancecg.com/trebuc.ttf) format("truetype");
}


@-webkit-keyframes cf3FadeInOut {
	 0% {
	   opacity:1;
	 }
	25% {
		opacity:1;
	}
	75% {
		opacity:0;
	}
	 100% {
	   opacity:0;
	 }
	}
	
	@-moz-keyframes cf3FadeInOut {
	 0% {
	   opacity:1;
	 }
	25% {
		opacity:1;
	}
	75% {
		opacity:0;
	}
	 100% {
	   opacity:0;
	 }
	}	
	
	@-ms-keyframes cf3FadeInOut {
	 0% {
	   opacity:1;
	 }
	25% {
		opacity:1;
	}
	75% {
		opacity:0;
	}
	 100% {
	   opacity:0;
	 }
	}	

	#cf3 {
		position:relative;
		height:254px;
		width:293px;
		margin:0 auto;
	}
	#cf3 img {
		position:absolute;
		left:0;
			height:254px;
		width:293px;
	}
	
	#cf3 img.top {
		-webkit-animation-name: cf3FadeInOut;
		-webkit-animation-timing-function: ease-in-out;
		-webkit-animation-iteration-count: infinite;
		-webkit-animation-duration: 10s;
		-webkit-animation-direction: alternate;
		
		-moz-animation-name: cf3FadeInOut;
		-moz-animation-timing-function: ease-in-out;
		-moz-animation-iteration-count: infinite;
		-moz-animation-duration: 10s;
		-moz-animation-direction: alternate;		
		
		-ms-animation-name: cf3FadeInOut;
		-ms-animation-timing-function: ease-in-out;
		-ms-animation-iteration-count: infinite;
		-ms-animation-duration: 10s;
		-ms-animation-direction: alternate;		
	}
	
/* ================================================================ 

This copyright notice must be untouched at all times.



The original version of this stylesheet and the associated (x)html

is available at http://www.cssplay.co.uk/menus/cssplay-click-slide.html

Copyright (c) 2005-2011 Stu Nicholls. All rights reserved.

This stylesheet and the associated (x)html may be modified in any 

way to fit your requirements.

=================================================================== */

/* this is a CSS answer to fix the hover/focus '~' and hover/focus '+' problem in safari and chrome */

/* tabindex="1" in the link code to fix the 'focus persist' problem in safari and chrome */

html {-webkit-animation: safariSelectorFix infinite 1s;}

@-webkit-keyframes safariSelectorFix {

0% {zoom:1;} 

100% {zoom:1;}

}



#menuOuter {position:relative; height:auto; width:100%; margin:0 auto; }

/* for Internet Explorer to force a menu refresh after :active + ul */

#menu li a,

body {behavior:url(trigger.htc)}



/* general styling */

.slidehead {
	font-size:18px;
	color:#fff;
	font-weight:normal;
	background:#121212;
	text-transform:uppercase;
	margin-bottom:1px;
	padding-top: 8px;
	padding-right: 0;
	padding-bottom: 8px;
	padding-left: 0px;
	text-shadow:0 1px 0 #black;
}

#menu, #menu ul {padding:0; margin:0; list-style:none; width:100%;}

#menu {padding:10px 0; background:#1B1B1B; border:0px solid black; position:relative; bottom:0;

/**-webkit-box-reflect: below 3px -webkit-gradient(linear, left bottom, left top, from(rgba(255,255,255,0.5)), to(transparent));
**/
}


#menu li {display:inline;
}

#menu li {*float:left;

} /* for IE7 to remove the vertical gap between list items */

#menu li a {display:block; width:100%; line-height:30px; background:#121212; color:#fff; text-decoration:none;
 font: Arial, Helvetica, sans-serif;
 font-size:18px; 
 text-shadow:0 1px 0 black;
 text-align:center; 

 outline:0;}

#menu li:hover > a
{background:#272727;
}

#menu ul { height:0; overflow:hidden;
-ms-border-radius: 0 0 0px 1px;
-moz-border-radius: 0 0 0px 1px;
border-radius: 0 0 0px 1px;
-webkit-transition: 0.4s ease-in-out;
-moz-transition: 0.4s ease-in-out;
-o-transition: 0.4s ease-in-out;
transition: 0.4s ease-in-out;
}

#menu ul li a {background:#1B1B1B; width:100%; font-weight:normal; font-size:14px;
color:#808080; border-bottom:1px solid #272727; padding-top:2px; padding-bottom:2px;}

#menu ul li a:hover {background:#121212;
-ms-border-radius: 0;
-moz-border-radius: 0;
border-radius: 0;
}

#menu li a:active {background:#a1a1a1;
}

#menu li a:active + ul {padding:0 0 10px 0;}
#menu li a:active + ul .sub1 {height:307px;}
#menu li a:active + ul.sub2 {height:201px;}
#menu li a:active + ul.sub3 {height:305px;}
#menu li a:active + ul.sub4 {height:235px;}
#menu li a:active + ul.sub5 {height:405px;}

#menu li a:focus {background:#121212;
}

#menu li a:focus + ul {padding:0 0 10px 0;}
#menu li a:focus + ul.sub1 {height:307px;}
#menu li a:focus + ul.sub2 {height:201px;}
#menu li a:focus + ul.sub3 {height:305px;}
#menu li a:focus + ul.sub4 {height:235px;}
#menu li a:focus + ul.sub5 {height:405px;}

#menu li ul:hover {padding:0 0 10px 0;}
#menu li ul.sub1:hover {height:307px;}
#menu li ul.sub2:hover {height:201px;}
#menu li ul.sub3:hover {height:305px;}
#menu li ul.sub4:hover {height:235px;}
#menu li ul.sub5:hover {height:405px;}


#first-child {
  	height:307px;
}
.floatRight {
	float: right;
}
.floatLeft {
	float: left;
}
.center {
	display: block;
	text-align: center;
}
.whiteTEXT {
	color: #FFFFFF;
}
.blackTEXT {
	color: #ABABAB;
	text-align: left;
}