@charset "UTF-8";
body {
	font: 100%;
	background: #010020 url(http://www.slinkypictures.com/images/page/newbg7.jpg) no-repeat scroll center top;
	margin: 0; /* it's good practice to zero the margin and padding of the body element to account for differing browser defaults */
	padding: 0;
	text-align: center; /* this centers the container in IE 5* browsers. The text is then set to the left aligned default in the #container selector */
	color: #000;
	font-family: Century Gothic, Verdana, Geneva, Arial, Helvetica, sans-serif;
}

h1, h5, h6 {
	margin: 0;
	padding: 0;
}



ul { margin: 0; padding: 0; }

a {
	text-decoration:none;
	color:#FFF;
}

img { border:none; }

a:hover {
	color: #FFCC00;
}

.fence #container {
	width: 1080px;  /* this width will create a container that will fit in an 800px browser window if text is left at browser default font sizes */
	background: transparent;
	margin: 0 auto; /* the auto margins (in conjunction with a width) center the page */
	text-align: left; /* this overrides the text-align: center on the body element. */
}

.fence #header { 
	background: transparent; 
	height:170px;
	padding: 0 10px 0 0;  /* this padding matches the left alignment of the elements in the divs that appear beneath it. If an image is used in the #header instead of text, you may want to remove the padding. */
	}


.fence #header h1 {
	margin: 0; /* zeroing the margin of the last element in the #header div will avoid margin collapse - an unexplainable space between divs. If the div has a border around it, this is not necessary as that also avoids the margin collapse */
	padding: 10px 0; /* using padding instead of margin will allow you to keep the element away from the edges of the div */
}

#header img {
	float: left;
	margin-top: 40px;
	border:none;
}

#header object {
	margin: 0 auto;
	position:absolute;
	left:50px;
	width:1200px;
	height:200px;
	z-index:0;
}

#navcontainer {
	background:transparent url(http://www.slinkypictures.com/images/page/sq.png) repeat;
	margin:0 auto;
	padding-top: 5px;
	height:30px;
	width:1080px;
	-moz-border-radius-topright: 10px;
	-webkit-border-top-right-radius: 10px;
	border-radius: 10px;
	}

#sitenav {
		position:relative;
		float: right;
		margin-top:125px;
		margin-right:15px;
		z-index:1;
		
		}

#sitenav li {
 		margin:0 0 0 25px;
		display:inline;
		font-size:30px;
		}	

	#navcontainer #worknav {
		margin:0;
		padding:0 5px 0 25px;
		list-style-type:none;
		text-align:right;
		}
	
	#navcontainer #worknav li {
		display:inline;
		vertical-align:sub;
		padding-right: 15px;
		font-size:14px;
		}
	
	.active {
		color:#FFCC00 !important;
	}
	
		

.fence #mainContent {
	background: transparent url(http://www.slinkypictures.com/images/page/sq.png) repeat;
	height:350px;
	margin-top: 0 auto;
	padding-top:15px;
	text-align:center;	
	width: 1080px;
}

.fence #ksmainContent {
	background: transparent url(http://www.slinkypictures.com/images/page/sq.png) repeat;
	height:1100px;
	margin-top: 0 auto;
	padding-top:15px;
	text-align:center;	
	width: 1080px;
}

#featured {
	background: transparent;
	float:left;
	margin:0 0 0 20px;
	height:305px;
	width:1020px;
	-moz-border-radius-topleft: 10px;
	-moz-border-radius-topright: 10px;
	-moz-border-radius-bottomleft: 10px;
	-moz-border-radius-bottomright: 10px;
	-webkit-border-top-right-radius: 10px;
	-webkit-border-top-left-radius: 10px;
	-webkit-border-bottom-right-radius: 10px;
	-webkit-border-bottom-left-radius: 10px;
	border-radius: 10px;
	
}

#vimeo {
	background: transparent;
	float:left;
	margin:0 0 0 20px;
	height:405px;
	width:720px;
	-moz-border-radius-topleft: 10px;
	-moz-border-radius-topright: 10px;
	-moz-border-radius-bottomleft: 10px;
	-moz-border-radius-bottomright: 10px;
	-webkit-border-top-right-radius: 10px;
	-webkit-border-top-left-radius: 10px;
	-webkit-border-bottom-right-radius: 10px;
	-webkit-border-bottom-left-radius: 10px;
	border-radius: 10px;
	
}



#about {
	background: transparent;
	float: left;
	margin:0 0 0 20px;
	width:1020px;
	-moz-border-radius-topleft: 10px;
	-moz-border-radius-topright: 10px;
	-webkit-border-top-right-radius: 10px;
	-webkit-border-top-left-radius: 10px;
}

#about img { 
	float:left;
	margin: 0 10px 0 0;
 }
 
#about #do {
	color: #EEE;
	margin-left: 15px;
	font-family: Century Gothic, Verdana, Geneva, Arial, Helvetica, sans-serif;
	text-align:justify;
	font-size:14px;
	width: 680px;
} 

#about h1 {
	color: #FFCC00;
	font-family: Century Gothic, Verdana, Geneva, Arial, Helvetica, sans-serif;
	text-align:left;
	margin:10px;
	font-size:24px;
	font-weight: 100;
	letter-spacing: 0.02em;
}

#about h2 {
	color:#FFCC00;
	font-family: Century Gothic, Verdana, Geneva, Arial, Helvetica, sans-serif;
	text-align:left;
	margin: 30px 0 10px 10px;
	font-size:24px;
	font-weight: 100;
	letter-spacing: 0.02em;
}

#about h3 {
	color:#EEE;
	font-family: Century Gothic, Verdana, Geneva, Arial, Helvetica, sans-serif;
	text-align:left;
	margin: 0 28px 0 10px;
	font-weight: 100;
	font-size:20px;
	
}

#about h4 {
	color:#FFCC00;
	font-family: Century Gothic, Verdana, Geneva, Arial, Helvetica, sans-serif;
	text-align:left;
	margin: 0 28px 0 10px;
	font-weight: 100;
	font-size:16px;
}

#about p {
	color: #EEE;
	margin-left: 10px;
	font-family: Century Gothic, Verdana, Geneva, Arial, Helvetica, sans-serif;
	text-align:justify;
	font-size:13px;
	width: 820px;
	
}

#featured h1 {
	background: url(http://www.slinkypictures.com/images/page/sq.png) repeat;
	color: #FFCC00;
	text-align:right;
	margin: 350px 0 0 100px;
	padding: 5px 20px 5px 0;
	font-size:30px;
	font-weight: 100;
	letter-spacing: 0.02em;
	width:570px;
	font-family: Century Gothic, Futura, Verdana, Geneva, sans-serif;
	-moz-border-radius-topleft: 10px;
	-moz-border-radius-topright: 10px;
	-moz-border-radius-bottomleft: 10px;
	-moz-border-radius-bottomright: 10px;
	-webkit-border-top-left-radius: 10px;
	-webkit-border-top-right-radius: 10px;
	-webkit-border-bottom-left-radius: 10px;
	-webkit-border-bottom-right-radius: 10px;
}

#featured p { 
	color:#CCC;
	text-align: left;
	font-size: 26px;
}

#featured a { color:#FFCC00; }

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


#locations {
	font-family: Century Gothic, Verdana, Geneva, Arial, Helvetica, sans-serif;
	background: transparent url(http://www.slinkypictures.com/images/page/locationbox.png);
	float:left;
	margin: 0 0 0 20px;
	height:450px;
	width:300px;
	-moz-border-radius-topleft: 10px;
	-moz-border-radius-topright: 10px;
	-webkit-border-top-right-radius: 10px;
	-webkit-border-top-left-radius: 10px;
	border-radius: 10px;
	
}

#ny, #la {
	margin: 0 0 0 10px;
	height:120px;
	color:#FFF;
	text-align:left;
}

#london {
	margin: 20px 0 0 10px;
	height:110px;
	color:#FFF;
	text-align:left;
}


#locations h2 {
	font-family: Century Gothic, futura, Verdana, sans-serif;
	font-size:20px;
	font-weight: 100;
	text-align:left;
	color:#FFF;
	margin:5px 0 0 10px;
	padding:0;
	width: 100px;
}

#locations h3 {
	color:#FFCC00;
	font-family: Century Gothic, futura, Verdana, sans-serif; 
	font-weight:100;
	font-size:16px;
	margin:5px 0 5px 0;
}

#locations p {
	font-weight:100;
	font-size:11px;
	margin:0;
	padding:0;
}



.fence .vid {
	float:left;
	margin: 20px 5px 0 15px;
	padding: 10px 10px 20px 0;
	width: 320px;
}

.fence .vid p {
	color:#FFFFFF;
	margin: 0;
	padding: 0;
	font-size:12px;
}

#footer 	{ 
	float:left;
	background:#010020;
	height:125px;
	padding-left:10px;
	margin: 10px 0 0 10px;
	width: 1060px;
	} 

#footer .contact 	{
	color:#EEE;
	margin: 0; 
	padding: 10px 0; 
	font-size:10px;
	}

#footer #copyright {
	margin-top:10px;
	padding:10px, 10px, 10px, 0;
	color:#DDDDDD;
	font-size:10px;
	text-align:left;
	}

#footer img {
	float: right;
}

#icons {
	float:right;
	margin: 0 0 0;
	padding: 0;
	width: 120px;
}

#icons img {
	border:none;
	
	}

#errorbadge {
	background-color:#ffcc00;
	width:350px;
	height:100px;
	margin-top: -50px;
	margin-left: 650px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
}

#errorbadge h1 {
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:60px;
	font-weight:lighter;
	
}

#errormessage {
	width:900px;
	margin-left: 15px;
	margin-top: -50px;
}

#errormessage p {
	font-family: Century Gothic, Verdana, Arial, Helvetica, sans-serif;
	font-size:20px;
	color:#EEE;
	text-align: left;
}

#ks {
	background: transparent;
	height: 405px;
	width: 720px;
	margin: 0 0 0 20px;
	float: left;
}

#ks h1 {
	
}

#ksinfo {
	margin: 20px 0 0 10px;
	height:150px;
	color:#FFF;
	text-align:left;
	width: 280px;
}


#kswhere, #kspeople, #kscontact {
	margin: 0 0 0 10px;
	height:110px;
	color:#FFF;
	text-align:left;
}

#kscontact {
	margin: 20px 0 0 10px;
	height:120px;
	color:#FFF;
	text-align:left;
}

#ksinfo h3 {
	font-size:20px;
}


#kswhere p, #kspeople p, #ksinfo p, #kscontact p {
	font-size:12px;
}

#director {
	background:transparent url(http://www.slinkypictures.com/images/page/sq.png) repeat;
	float:left;
	width:1080px;
}