@charset "UTF-8";
/* CSS Document */

* {
	margin: 0;
	padding: 0;
}

a {
	outline: none;
}

#about {
	width: 70%;
	text-align: left;
	display: none;
	float: left;
	margin-top: -50px;
	margin-bottom: 15px;
}

		#about p {
			color:#666;
			font-size: 10px;
			font-family: Helvetica, Arial, sans-serif;
			background: #f5f5f5;
			border: thin solid #ccc;
			line-height: 16px;
			padding: 6px;
			padding-top: 4px;
		}

body {
	text-align: center;
}

#cc {
	width: 309px;
	height: 157px;
	background: url(../images/cc_logo.jpg) no-repeat top left;
	float:right;
	margin-top: -16px;
}

.clearfloat {
	clear:both;
}

#contact {
	width: 156px;
	text-align: left;
	float:left;
	background: #f5f5f5;
	border: thin solid #ccc;
	display: none;
	margin-top: -50px;
	margin-bottom: 15px;
	padding-bottom: 2px;
	
}

		#contact p {
			color:#666;
			font-size: 10px;
			font-family: Helvetica, Arial, sans-serif;
			line-height: 14px;
			padding-left: 6px;
			padding-top: 4px;
			padding-bottom: 0px;
		}
		
		#contact p a {
			color:#666;
			font-size: 10px;
			font-family: Helvetica, Arial, sans-serif;
			line-height: 14px;
			padding-right: 0px;
			padding-top: 4px;
			padding-bottom: 0px;
			text-decoration:none;
		}
		
		#contact p a:hover {
			color:#333;
		}

#container {
	position: absolute;
	left: 30px;
	text-align: left;
}

		#container p.credit {
			color: #aaa;
			font-size: 12px;
			padding-top: 20px;
			padding-bottom: 20px;
		}
		
		#container p.credit a {
			color: #aaa;
			text-decoration: none;
		}
		
		#container p.credit a:hover {
			color: #333;
			text-decoration:none;
		}

#detail {
	width: 100%;
}

		#detail .back {
			color: white;
			font-size: 12px;
			font-family: "Times New Roman", Times, serif;
			font-weight: normal;
		}
		
				#detail .back a {
					color: white;
					display: block;
					font-size: 12px;
					font-family: "Times New Roman", Times, serif;
					font-weight: normal;
					text-decoration: none;
					padding: 2px;
					padding-left: 5px;
					margin-left: 2px;
					background: #333;
					width: 140px;
				}
				
				#detail .back a:hover {
					color: #ccc;
				}
		
		#detail #description {
			margin-bottom: 30px;
			margin-left: 1px;
			width: 530px;
		}

		#detail h3 {
			color: #999;
			font-family: "Times New Roman", Times, serif;
			font-weight: normal;
			font-size: 14px;
			margin-bottom: 0px;
			margin-top: -4px;
			display: inline;
			letter-spacing: .4px;
		}
		
		#detail p {
			color: #777;
			font-family: Helvetica, Arial, sans-serif;
			font-size: 12px;
			display: inline;
		}
		
		#detail .movie {
			margin: 16px 0px 10px 0px;
			float:left;
			text-align: left;
		}
		
		#detail .board {
			background: black;
			margin: 2px;
			float:left;
			display: block;
		}
		
		#detail .work_thumb a {
			width: 150px;
			height: 150px;
			display: block;
		}

#header {
	width: 96%;
	position: relative;
	margin-bottom: 10px;
}

#name {
	width: 198px;
	height: 69px;
	background: url(../images/cc_left_header.jpg) no-repeat top left;
	float:left;
}

		#name h1, #name h2 {
			text-indent: -9999px;
		}

#play {
	width: 100%;
	margin-top: 30px;
}

		#play h1 {
			text-indent: -9999px;
			width: 45px;
			height: 12px;
			background: url(../images/play_header.jpg) no-repeat top left;
			margin-bottom: 1px;
		}
		
		#play .play_thumb {
			width: 150px;
			height: 150px;
			background: black;
			margin: 2px;
			float:left;
			display: block;
			overflow: hidden;
		}
		
		#play .play_thumb a {
			width: 150px;
			height: 150px;
			display: block;
		}

#work {
	width: 100%;
}

		#work h1 {
			text-indent: -9999px;
			width: 45px;
			height: 12px;
			background: url(../images/work_header.jpg) no-repeat top left;
			margin-bottom: 1px;
		}
		
		#work .work_thumb {
			width: 150px;
			height: 150px;
			background: black;
			margin: 2px;
			float:left;
			display: block;
			overflow: hidden;
		}
		
		#work .work_thumb a {
			width: 150px;
			height: 150px;
			display: block;
		}
		
		
/*****************/
/** WORK PIECES **/
/*****************/

#work #work1 {background: url(../images/work/1.jpg) 0px -150px no-repeat;}
	#work #work1:hover {background: url(../images/work/1.jpg) 0px 0px no-repeat;cursor:pointer;}
#work #work2 {background: url(../images/work/2.jpg) 0px -150px no-repeat;}
	#work #work2:hover {background: url(../images/work/2.jpg) 0px 0px no-repeat;cursor:pointer;}
#work #work3 {background: url(../images/work/3.jpg) 0px -150px no-repeat;}
	#work #work3:hover {background: url(../images/work/3.jpg) 0px 0px no-repeat;cursor:pointer;}
#work #work4 {background: url(../images/work/4.jpg) 0px -150px no-repeat;}
	#work #work4:hover {background: url(../images/work/4.jpg) 0px 0px no-repeat;cursor:pointer;}
#work #work5 {background: url(../images/work/5.jpg) 0px -150px no-repeat;}
	#work #work5:hover {background: url(../images/work/5.jpg) 0px 0px no-repeat;cursor:pointer;}
#work #work6 {background: url(../images/work/6.jpg) 0px -150px no-repeat;}
	#work #work6:hover {background: url(../images/work/6.jpg) 0px 0px no-repeat;cursor:pointer;}
#work #work7 {background: url(../images/work/7.jpg) 0px -150px no-repeat;}
	#work #work7:hover {background: url(../images/work/7.jpg) 0px 0px no-repeat;cursor:pointer;}
#work #work8 {background: url(../images/work/8.jpg) 0px -150px no-repeat;}
	#work #work8:hover {background: url(../images/work/8.jpg) 0px 0px no-repeat;cursor:pointer;}
#work #work9 {background: url(../images/work/9.jpg) 0px -150px no-repeat;}
	#work #work9:hover {background: url(../images/work/9.jpg) 0px 0px no-repeat;cursor:pointer;}
#work #work10 {background: url(../images/work/10.jpg) 0px -150px no-repeat;}
	#work #work10:hover {background: url(../images/work/10.jpg) 0px 0px no-repeat;cursor:pointer;}
#work #work11 {background: url(../images/work/11.jpg) 0px -150px no-repeat;}
	#work #work11:hover {background: url(../images/work/11.jpg) 0px 0px no-repeat;cursor:pointer;}
#work #work12 {background: url(../images/work/12.jpg) 0px -150px no-repeat;}
	#work #work12:hover {background: url(../images/work/12.jpg) 0px 0px no-repeat;cursor:pointer;}
#work #work13 {background: url(../images/work/13.jpg) 0px -150px no-repeat;}
	#work #work13:hover {background: url(../images/work/13.jpg) 0px 0px no-repeat;cursor:pointer;}
#work #work14 {background: url(../images/work/14.jpg) 0px -150px no-repeat;}
	#work #work14:hover {background: url(../images/work/14.jpg) 0px 0px no-repeat;cursor:pointer;}
#work #work15 {background: url(../images/work/15.jpg) 0px -150px no-repeat;}
	#work #work15:hover {background: url(../images/work/15.jpg) 0px 0px no-repeat;cursor:pointer;}
#work #work16 {background: url(../images/work/16.jpg) 0px -150px no-repeat;}
	#work #work16:hover {background: url(../images/work/16.jpg) 0px 0px no-repeat;cursor:pointer;}
#work #work17 {background: url(../images/work/17.jpg) 0px -150px no-repeat;}
	#work #work17:hover {background: url(../images/work/17.jpg) 0px 0px no-repeat;cursor:pointer;}
#work #work18 {background: url(../images/work/18.jpg) 0px -150px no-repeat;}
	#work #work18:hover {background: url(../images/work/18.jpg) 0px 0px no-repeat;cursor:pointer;}
#work #work19 {background: url(../images/work/19.jpg) 0px -150px no-repeat;}
	#work #work19:hover {background: url(../images/work/19.jpg) 0px 0px no-repeat;cursor:pointer;}
#work #work20 {background: url(../images/work/20.jpg) 0px -150px no-repeat;}
	#work #work20:hover {background: url(../images/work/20.jpg) 0px 0px no-repeat;cursor:pointer;}
#work #work21 {background: url(../images/work/21.jpg) 0px -150px no-repeat;}
	#work #work21:hover {background: url(../images/work/21.jpg) 0px 0px no-repeat;cursor:pointer;}
#work #work22 {background: url(../images/work/22.jpg) 0px -150px no-repeat;}
	#work #work22:hover {background: url(../images/work/22.jpg) 0px 0px no-repeat;cursor:pointer;}
#work #work23 {background: url(../images/work/23.jpg) 0px -150px no-repeat;}
	#work #work23:hover {background: url(../images/work/23.jpg) 0px 0px no-repeat;cursor:pointer;}
#work #work24 {background: url(../images/work/24.jpg) 0px -150px no-repeat;}
	#work #work24:hover {background: url(../images/work/24.jpg) 0px 0px no-repeat;cursor:pointer;}
#work #work25 {background: url(../images/work/25.jpg) 0px -150px no-repeat;}
	#work #work25:hover {background: url(../images/work/25.jpg) 0px 0px no-repeat;cursor:pointer;}
#work #work26 {background: url(../images/work/26.jpg) 0px -150px no-repeat;}
	#work #work26:hover {background: url(../images/work/26.jpg) 0px 0px no-repeat;cursor:pointer;}
#work #work27 {background: url(../images/work/27.jpg) 0px -150px no-repeat;}
	#work #work27:hover {background: url(../images/work/27.jpg) 0px 0px no-repeat;cursor:pointer;}
#work #work28 {background: url(../images/work/28.jpg) 0px -150px no-repeat;}
	#work #work28:hover {background: url(../images/work/28.jpg) 0px 0px no-repeat;cursor:pointer;}
#work #work29 {background: url(../images/work/29.jpg) 0px -150px no-repeat;}
	#work #work29:hover {background: url(../images/work/29.jpg) 0px 0px no-repeat;cursor:pointer;}
#work #work30 {background: url(../images/work/30.jpg) 0px -150px no-repeat;}
	#work #work30:hover {background: url(../images/work/30.jpg) 0px 0px no-repeat;cursor:pointer;}
#work #work31 {background: url(../images/work/31.jpg) 0px -150px no-repeat;}
	#work #work31:hover {background: url(../images/work/31.jpg) 0px 0px no-repeat;cursor:pointer;}
#work #work32 {background: url(../images/work/32.jpg) 0px -150px no-repeat;}
	#work #work32:hover {background: url(../images/work/32.jpg) 0px 0px no-repeat;cursor:pointer;}
#work #work33 {background: url(../images/work/33.jpg) 0px -150px no-repeat;}
	#work #work33:hover {background: url(../images/work/33.jpg) 0px 0px no-repeat;cursor:pointer;}
#work #work34 {background: url(../images/work/34.jpg) 0px -150px no-repeat;}
	#work #work34:hover {background: url(../images/work/34.jpg) 0px 0px no-repeat;cursor:pointer;}
	

	
	
/*****************/
/** PLAY PIECES **/
/*****************/

#play #play1 {background: url(../images/play/1.jpg) 0px -150px no-repeat;}
	#play #play1:hover {background: url(../images/play/1.jpg) 0px 0px no-repeat;cursor:pointer;}
#play #play2 {background: url(../images/play/2.jpg) 0px -150px no-repeat;}
	#play #play2:hover {background: url(../images/play/2.jpg) 0px 0px no-repeat;cursor:pointer;}
#play #play3 {background: url(../images/play/3.jpg) 0px -150px no-repeat;}
	#play #play3:hover {background: url(../images/play/3.jpg) 0px 0px no-repeat;cursor:pointer;}
#play #play4 {background: none;}
	#play #play4:hover {background: none;}
#play #play5 {background: none;}
	#play #play5:hover {background: none;}
#play #play6 {background: none;}
	#play #play6:hover {background: none;}
#play #play7 {background: none;}
	#play #play7:hover {background: none;}
#play #play8 {background: none;}
	#play #play8:hover {background: none;}
#play #play9 {background: none;}
	#play #play9:hover {background: none;}
#play #play10 {background: none;}
	#play #play10:hover {background: none;}
#play #play11 {background: none;}
	#play #play11:hover {background: none;}
#play #play12 {background: none;}
	#play #play12:hover {background: none;}

	

/*********/
/** NAV **/
/*********/
	
#nav {
	width: 132px;
	height: 13px;
	position: relative;
	float:left;
	margin-left: -3px;
	margin-top: 7px;
	margin-bottom: 7px;
}

#menu {
		margin: 0;
		padding: 0;
		margin-bottom: 20px;
		width: 132px;
		height: 13px;		
		text-align: left;
	}
	#menu li span {display: none;}
	
	#menu li {margin: 0; padding: 0; list-style: none; top: 0; float:left;}

	
    
	#menu li, #menu a {height: 13px; display: block; outline:none;}
	#menu1 {left: 0px; width: 38px;background: transparent url(../images/nav.jpg) 0px 0px no-repeat;outline:none;}
	#menu2 {left: 38px; width: 45px;background: transparent url(../images/nav.jpg) -38px -26px no-repeat;outline:none;}
	#menu3 {left: 83px; width: 49px;background: transparent url(../images/nav.jpg) -83px -26px no-repeat;outline:none;}
	
	#menu1 a:hover {background: transparent url(../images/nav.jpg) 0px 0px no-repeat;cursor: auto;}
	#menu2 a:hover {background: transparent url(../images/nav.jpg) -38px -13px no-repeat;cursor:pointer;}
	#menu3 a:hover {background: transparent url(../images/nav.jpg) -83px -13px no-repeat;cursor:pointer;}
	
	.sub #menu1 {left: 0px; width: 38px;background: transparent url(../images/nav.jpg) 0px -26px no-repeat;outline:none;}
	.sub #menu1 a:hover {left: 0px; width: 38px;background: transparent url(../images/nav.jpg) 0px -13px no-repeat;outline:none;cursor:pointer;}