/*	Charlie Khan
	--------------------------------------------------
	author(s):		Chris Goodchild (chris@villainousrecords.com)
	date:			March 2009
	description:	Global stylesheet 
*/


/*	RESET
	-------------------------------------------------- */
	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-family: inherit;
		font-weight: inherit;
		font-style: inherit;
		font-size: 100%;
		vertical-align: baseline;
	}
	/* remember to define focus styles! */
	:focus {
		outline: 0;
	}
	/* tables still need 'cellspacing="0"' in the markup */
	table {
		border-collapse: separate;
		border-spacing: 0;
	}
	caption, th, td {
		text-align: left;
		font-weight: normal;
	}



/*	BASE: Default font & colour styles
	-------------------------------------------------- */	
	body {
		font: normal normal normal 62.5%/1.3 Arial, Helvetica, sans-serif;  /* 10px font size */
		background: black url(../../images/structure/backgrounds/ckn_site_bg2_1600x1200.jpg) left top repeat-y;
		color: white;
	}


	
/*	STRUCTURE: Structure elements
	-------------------------------------------------- */	
	#ck_container {
		width: 832px;
		height: 1000px;
		margin: 0 0 0 92px;
	}
	#ck_container,
	#ck_header,
	#ck_content,
	#ck_footer {
		position: relative;
	}
	
	
	
/*	TYPOGRAPHY: Headings, paragraphs & links
	-------------------------------------------------- */
	h1, h2, h3, h4, h5, h6 {color: white;}
	
	/* Main and sub headings */
	h1 {font-size: 3.2em; margin: 15px 0 0 70px;}
	h2 {font-size: 1.6em; margin: 12px 0 0 260px;}
	
	/* Content headings */
	h3 {font-size: 2em; margin: 0 0 0 0;}
	h4 {font-size: 1.6em; margin: 0 0 20px 0;}
	
	/* Extra headings */
	h5 {font-size: 1.4em;}
	h6 {font-size: 1.4em;}
	
	p {font-size: 1.4em; margin: 0 0 16px 0; padding: 0; color: #FFF;}
	
	a, a:visited, a:active	{color: #CCC; text-decoration: underline;}
	a:hover	{color: #FFF; text-decoration: none;}
	
	ul {
		list-style: none;
		margin: 0;
		padding: 0;
	}
	ol {
		margin: 0 0 0 28px;
	}
		
	
	
/*	ACCESSIBILITY: Skip links
	-------------------------------------------------- */
	ul.skiplinks a {
		position: absolute;
		top: -1000px;
		left: -1000px;
		background: #333;
		border: 1px solid #666;
		font-size: 1.4em;
		font-weight: bold;
		color: #FFF;
	}
	ul.skiplinks a:focus {
		position: absolute;
		top: 10px;
		left: 20px;
	}


	
/*	HEADER: Global links, branding & search
	-------------------------------------------------- */
	#ck_header {
		min-height: 74em;
		background: transparent url(../../images/structure/backgrounds/ckn_strange_416x640.jpg) right 99px no-repeat;
	}
		#ck_header .player {
			width: 300px;
			position: absolute;
			top: 190px;
			left: 30px;
		}
		#ck_header h3.tagline {
			position: absolute;
			top: 480px;
			left: 35px;
		}
		#ck_header .sn_links {
			position: absolute;
			top: 540px;
			left: 80px;
		}
			#ck_header .sn_links ul {
				list-style: none;
				margin: 0;
			}
				#ck_header .sn_links ul li {
					float: left;
					margin: 0 8px 0 0;
					padding: 0;
				}


	
/*	CONTENT: Everything!
	-------------------------------------------------- */
	#ck_content {
		padding: 0 0 30px 0;
	}
		a#rockbottom,
		a#topofthepile {
			display: block;
			margin: 20px auto;
			clear: both;
		}
		a#rockbottom {
			width: 126px;
		}
		a#topofthepile {
			width: 155px;
		}
		
		/* NEWS SECTION */
		#news {
			float: left;
			width: 400px;
			padding: 30px 40px 0 40px;
		}
			#news h4 {
				margin-bottom: 12px;
			}
			#news .feed_data {
				border-top: 1px dashed #222;
			}
			#news .update {
				padding: 10px 0;
				border-bottom: 1px dashed #222;
			}
			#news .update h5 {
				font-size: 1.4em;
				font-weight: bold;
			}
				#news .update h5 a {
					text-decoration: none;
				}
			#news .update span {
				display: block;
				font-size: 12px;
				font-style: italic;
				color: #999;
			}
		
		
		/* CONTACT SECTION */
		#contact {
			width: 320px;
			float: right;
			padding: 30px 0;
		}
			#contact p {
				margin: 0;
			}
				#contact form label {
					display: inline-block;
					margin-top: 12px;
					font-size: 1.4em;
				}
				#contact form input,
				#contact form textarea {
					display: block;
					width: 232px;
					margin: 0;
					padding: 2px;
					background: #333 !important;
					border: 2px solid #666;
					font-family: Arial;
					font-size: 1.4em;
					color: white;
				}
				#contact form input:focus,
				#contact form textarea:focus {
					background: #222 !important;
					border-color: #999;
				}
				#contact form textarea {
					width: 272px;
					height: 126px;
				}
				#contact form button {
					display: block;
					width: 80px;
					height: 30px;
					margin-top: 12px;
					overflow: hidden;
					text-indent: -1000em;
					background: transparent url(../../images/content/buttons/form_submit_80x60.gif) 0 0 no-repeat;
					border-width: 0;
					cursor: pointer;
				}
				#contact form button:hover {
					background-position: 0 -30px;
				}
				#ck_contact .error {
					display: block;
					font-size: 1.2em;
					font-style: italic;
					color: red;
				}
				
		
		/* SHOWS SECTION */
		#shows {
			width: 500px;
			padding: 60px 40px 30px 40px;
			clear: both;
		}
			#shows h4 {
				margin: 0 0 20px 40px;
			}
			#shows .feed_data {
				height: 30em;
				overflow: auto;
				border: 1px solid #333;
				border-width: 1px 0 1px 1px;
			}
				#shows .feed_data .show {
					margin: 0;
					padding: 12px;
				}
					#shows .feed_data .show h5 {
						font-size: 1.4em;
						font-weight: bold;
					}
					#shows .feed_data .show p {
						margin: 0;
						font-size: 1.4em;
					}
		
		
		/* BIOGRAPHY SECTION */
		#biography {
			width: auto;
			padding: 30px 40px 0 40px;
		}
			#biography h3 {
				text-align: center;
			}
			#biography h4 {
				text-align: center;
				margin-left: 20px;
			}
			#biography img.bio_pic {
				float: left;
				display: block;
				margin: 0 12px 12px 0;
			}
			

		/* DISCOGRAPHY SECTION */
		#discography {
			width: auto;
			padding: 60px 40px 0 40px;
		}
			#discography h3 {
				text-align: center;
			}
			#discography h4 {
				text-align: center;
				margin-left: 180px;
			}
			#discography .release {
				width: auto;
				padding: 20px 0;
				overflow: hidden;
			}
			#discography .release.cake {}
				#discography .release.cake img {
					float: left;
					margin: 0 12px 12px 0;
					border: 2px solid #222;
				}
				#discography .release.cake .info {
					float: right;
					width: 450px;
				}
				
			#discography .release.essays {
				clear: both;
			}
				#discography .release.essays img {
					float: right;
					margin: 0 0 12px 12px;
					border: 2px solid #222;
				}
				#discography .release.essays .info {
					float: left;
					width: 450px;
				}
				
				#discography .release ol {
					padding: 16px 0;
					font-size: 1.4em;
				}
	
				
		/* MOTION PICTURE SECTION */
		#motionpicture {
			clear: both;
			width: auto;
			padding: 30px 40px 30px 40px;
		}
			#motionpicture h4 {
				margin: 6px 0 20px 30px;
			}
			#motionpicture .youtube {
				width: 425px;
				padding: 4px;
				background: #222;
			}
				#motionpicture .youtube object {
					display: block;
					margin: 0;
					padding: 0;
				}


	
/*	CLEAR: clear multiple floats
	-------------------------------------------------- */	
	#discography {
		overflow: visible;
		clear: both;
	}
		 
	body#IE6 #ck_header {
		height: 740px;
	}