/**
 * Niche Productions - Website CSS
 * 
 * @copyright		Copyright 2007, Alvin Savoy
 * @author 			alvin.savoy@gmail.com
 * @package			niche
 * @version			1.0
 */
 
/*=========*/
/* COLOURS */
/*=========*/
/* 
/* 	#fd1813		Red
/* 	#363636		Dark grey
/*	#cccccc		Light grey
/*	#99cc33		Green
/*	
/*	Text
/*	#cccccc		Page text
/*
/*=========*/

* {
	margin: 0pt;
	padding: 0pt;
}

html, body {
	width:100%;
	height:100%;
	margin:0;
	padding:0;
}


/*==================*/
/* FONTS AND STYLES */
/*==================*/

body, input, select, option, button, textarea {
	font-family: arial, helvetica, tahoma, sans-serif;
	font-size:10px;
	color: #ffffff;
	line-height: 1.5;
}
	select, option, input, button, textarea {
		color:black;
	}

	#second_content,
	#third_content {
		color:#cccccc;
	}
	
	#page {
		color:#999999;
	}
	
	a {
		color:#99cc33;
		text-decoration:none;
	}
		a:hover {
			/*background-color:#99cc33;*/
			/*color:#000000;*/
			/*text-decoration:underline;*/
		}
		a img {
			border:0;
		}
	
	p, ul, li {
		margin:10px 0;
	}
	
	#page li {
		list-style-position:inside;
		margin-left:10px;
	}


	p.highlight {
		background:#ffff00;
		color:black;
		padding:5px;
	}

/*==========*/
/* HEADINGS */
/*==========*/

h1, h2, h3, h4, h5, h6 {
	font-family: arial, helvetica, tahoma, sans-serif;
	font-size:12px;
	font-weight:bold;
}
	
	h1 {
		color:#000000;
		background-color:#fd1813;
		
		margin:10px 0;
		padding:3px 35px;
	}
	
	h2 {
		color:#000000;
		background-color:#fd1813;
		
		margin:10px 0;
		padding:3px 35px;
	}
		
		.article h2,
		.media h2 {
			margin-top:5px;
		}
	
		
	
	h3 {
		color:#fd1813;
		
		margin:10px 0;
	}

	h4 {
		color:white;
		font-size:10px;
		
		margin:10px 0;
	}
	
	
	
	
	

/*========*/
/* LAYOUT */
/*========*/

body {
	background: #363636 url(../img/common/site_bg.gif) repeat-y;
	background-position:center;
}

#site_container {
	width:800px;
	margin:0 auto;
	position:relative;
}

	#header {
		background-image:url(../img/common/header_bg.gif);
		
		background-repeat:repeat-x;
		
		height:150px;
	}
		
	
		#nav {
			margin:0;
			height:25px;
			
			background-color:#666666;
			border-bottom:1px solid black;
		}
		
		
	
	#page_container {
		min-height:400px;
		position:relative;
		
		padding-bottom:40px;
	}
		#ie6 #page_container {
				height:400px;
			}
		
	
		#second_content {
			float:left;
			background-color:#363636;
			
			width:175px;
			padding:0 5px 5px 5px;
			
			position:relative;
		}
		
		#page {
			float:left;
			background-color:#000000;
			
			width:420px;
			padding:0 5px 5px 5px;
				
			position:relative;
			
			
		}
			
		
		#third_content {
			float:left;
			background-color:#363636;
			
			width:175px;
			padding:0 5px 5px 5px;
			
			position:relative;
		}
		
		
		.admin_template #header {
			height:149px;
		}
		
		.admin_template #nav_second {
			margin:0;
			height:28px;
			background-color:#fd1813;
			border-bottom:1px solid black;
		}
		
		.admin_template #page {
			width:605px;
			background-color:#000000;
		}
		
		.admin_template #second_content {
			float:right;
			width:174px;
			background-color:#000000;
		}
		
		body.editor_template {
			background:none;
			
		}
		
		.admin_template input.file {
			clear:both;
			margin-bottom:8px;
		} 
		iframe {
			background:black;
		}
		
/*===============*/
/* PAGE ELEMENTS */
/*===============*/

.feature_page_image {
	width:420px;
	height:175px;
	overflow:hidden;
	margin:5px 0 10px 0;
	zoom:1;
}
	#page .feature_page_image ul,
	#page .feature_page_image li {
		margin:0;
		padding:0;
		clear:both;
		list-style-type:none;
		position:relative;
	}
		#page .feature_page_image li {
			width:420px;
			height:175px;
		}
	
	#ie7 .feature_page_image li {
		list-style-position:outside;
	}

.article {
	padding:0 35px;
}
	.article h2 {
		width:100%;
		
		position:relative;
		left:-35px;
	}
	
.artist {
}
	.artist h4 {
		color:#fd1813;
	}
	
	#page .artist .discography {
		list-style-type:none;
	}
	#page .artist .discography li {
		margin-left:0;		
	}


.past_tour {
}
	.thumbnails {
		list-style-type:none;
		overflow:auto;
	}
	
		.thumbnails li {
			float:left;
			margin:0px 4px 4px 0;
			
		}
		
			.thumbnails li img {
				display:block;
				width:50px;
				height:50px;
			}

.media{
}
	.media h2 {
		background-color:#999999;
	}
	
	.media_list {
		list-style-type:none;
		overflow:auto;
		
		margin-right:-9px;
	}
	
		#page .media_list li {
			float:left;
			margin:0 9px 7px 0px;
			
		}
			.media_list li a {
				display:block;
				width:134px;
				height:50px;
				
				overflow:hidden;
				position:relative;
			}
				.media_list li a:hover {
				}
				
				.media_list li a img {
					position:absolute;
					left:0;
					top:0;
					height:50px;
					width:50px;
				}
				
				.media_list li a span {
					position:absolute;
					right:0;
					top:0;
					width:74px;
					padding:0 4px;
					height:50px;
					color:#cccccc;
					background-color:#363636;
					font-size:8px;
				}
		


/*===============*/
/* SIDE ELEMENTS */
/*===============*/

#second_content, #third_content {
}

#second_content .feature_image,
#third_content .feature_image {
	width:175px;
	height:175px;
	overflow:hidden;
	
	margin:10px 0;
	margin-top:5px;
}
	#second_content .no_feature_image,
	#third_content .no_feature_image {
		margin:-10px 0 0 0;
		height:0;
		overflow:hidden;
		
	}

#second_content .feature_box,
#third_content .feature_box {
	padding:0 15px;
	margin-bottom:5px;
}

	.feature_box h2 {
		width:100%;

		color:#000000;
		background-color:#cccccc;
		
		margin:5px 0 10px 0;
		padding:3px 15px;
		
		position:relative;
		left:-15px;
	}
	
	.feature_box h3 {
		color:#ffffff;
		
		margin:10px 0;
	}


	.feature_box {
	}
		.feature_box ul {
			list-style-type:none;
		}
		
		.feature_box li {
			color:#fd1813;
		}
			.feature_box li a {
				color:#999999;
			}
				.feature_box li a:hover {
				}

	.artists {
		padding:0;
	}
		.artists ul {
			list-style-type:none;
		}
		
		.artists li {
			position:relative;
			left:-15px;
			margin:5px 0;
		}
		
		.artists a {
			display:block;
			padding:0px 2px;
			padding-left:15px;
			width:158px;
			background-color:#666;
		}
		
		.artists a:hover {
			background-color:#999999;
			color:#000000;
		}
		
		.artists a.active {
			background-color:#ccc;
			color:#ffffff;
		}
		
	.upcoming_shows,
	.news,
	.past_tours {
	}
	
		.upcoming_shows ul,
		.news ul,
		.past_tours ul {
			list-style-type:none;
		}
			.upcoming_shows ul, 
			.past_tours ul {
				height:500px;
				list-style-type:none;
				overflow:auto;
				width:160px;
			}
		
			.upcoming_shows li,
			.news li,
			.past_tours li {
				padding-bottom:6px;
				margin:5px 0;
				
				background-image:url(../img/common/hr_bg.gif);
				background-repeat:repeat-x;
				background-position:0 100%;
			}
				.upcoming_shows li a,
				.news li a,
				.past_tours li a {
					display:block;
					color:#cccccc;
				}
				
					.upcoming_shows li a:hover,
					.news li a:hover,
					.past_tours li a:hover {
					}
				
					.upcoming_shows li.active a,
					.news li.active a,
					.past_tours li.active a {
						color:#ffffff;
					}


	form {
	}
	
		form .input {
			margin:10px 40px;
		}
		
		#second_content form .input {
			margin-left:0;
			margin-right:10px;
		}
		
		#second_content form input.textfield {
			width:100%;
		}
		#second_content form .submit {
			margin:10px 0;
		}
		
		input.textfield {
			width:160px;
		}
		
		label {
			float:left;
			padding-top:4px;
			width:100px;
		}
		
		div.error-message,
		p.error {
			color:#FD1813;
			font-weight:bold;
			margin:10px 0px;
		}
	
		form .submit {
			margin:10px 40px;
		}




/*========*/
/* HEADER */
/*========*/

#header {
	position:relative;	
}
	#header #site_name {
		display:block;
		background-image:url(../img/common/niche_masthead.gif);
		background-repeat:no-repeat;
		width:201px;
		height:100%;
		
		text-indent:-1000px;
		overflow:hidden;
	}
	
	#header #soundtrax {
		height:25px;
		width:175px;
		display:block;
		position:absolute;
		right:5px;
		bottom:20px;
	}
	#soundtrax embed {
		position:relative;
		top:0;
		left:0;
	}

/*=====*/
/* NAV */
/*=====*/

#nav {
	list-style-type:none;
	
	font-size:10px;
	color:#cccccc;
	
	padding-left:11px;
}
	#nav a {
		display:block;
		
		height:19px;
		
		margin:0;
		padding:5px 8px 1px;
		
		color:#cccccc;
		text-decoration:none;
		
		outline:0;
	}
		#nav a:hover {
			background-color:#cccccc;
			color:#000000;
		}
	
		#nav a.active {
			color:#ffffff;
			background-color:#fd1813;
		}
		

	#nav li {
		margin:0;
		float:left;
	}
	
		#nav li.first {
		}
		
		#nav li.last {
		}
		
/*===============*/
/* SECONDARY NAV */
/*===============*/

#nav_second {
	list-style-type:none;
	
	font-size:10px;
	color:#cccccc;
	
	padding-left:11px;
}
	#nav_second a {
		display:block;
		
		height:19px;
		border-top:3px solid #fd1813;
		
		margin:0;
		padding:5px 8px 1px;
		
		color:#cccccc;
		text-decoration:none;
	}
		#nav_second a:hover {
			background-color:#fd1813;
			color:#000000;
		}
	
		#nav_second a.active {
			color:#ffffff;
			background-color:#000000;
		}
		

	#nav_second li {
		margin:0;
		float:left;
	}
	
		#nav_second li.first {
		}
		
		#nav_second li.last {
		}
		
/*========*/		
/* FOOTER */
/*========*/

#footer {
	position:absolute;
	bottom:0;
	margin:10px 185px;
	padding:0 35px; 
}
	#footer ul {
		list-style-type:none;
		overflow:auto;
	}
	
		#footer li {
			margin:0;	
			float:left;
			padding-right:4px;
			
		}
		
		#footer a {
			color:#999999;
		}
			#footer a:hover {
			}



/*=======*/
/* ADMIN */
/*=======*/
	.admin_template {
		background-image:url(../img/common/site_admin_bg.gif);
	}

	.admin_template #page_container a {
		border-bottom:1px dotted #99cc33;
	}
	
	.admin_template #nav {
		border-bottom:0;
	}
		
		.admin_template #nav a,
		.admin_template #nav_second a {
			border-bottom:0;
		}
	
	.admin_template .paging {
		margin:10px 0;
	}
		.admin_template .paging div {
			display:inline;
		}
		
	.admin_template .actions {
		float:left;
	}
	.admin_template .actions ul {
		margin:0;
		list-style-type:none;
	}
		.admin_template .actions li {
			float:left;
			margin:0;
			padding:8px;
			border:0;
			background:0;
		}
		
	.admin_template .pagination {
		color:#999;
	}
	.admin_template table {
		margin:10px 0;
	}
		.admin_template table .actions a {
			float:left;
			clear:both;
			margin:3px;
		}
		
		.admin_template #page td,
		.admin_template #page th {
			padding:4px;
			float:none;
		}
		
		.admin_template #page th .asc, 
		.admin_template #page th .desc {
			color:white;
		}
			.admin_template #page th .asc span, 
			.admin_template #page th .desc span {
				color:white;
				font-size:16px;
				font-weight:bold;
				
				margin-right:2px;
				border:0;
			}
			
			
		.admin_template td {
			border-top:1px dotted #99cc33;
			border-right:1px solid #000000;
		}

	.admin_template fieldset {
		clear:both;
		margin:10px 0;
		padding:10px;
		border:1px dotted #99cc33;
	}
		.admin_template .editor_tips fieldset {
			margin:0;
			border:0;
			padding:0;
		}
			.admin_template .editor_tips fieldset legend {
				margin:0;
				left:0;
			}
			.admin_template .editor_tips dl {
				margin:10px;
			}
			
			.admin_template .editor_tips dt {
				display:block;
				clear:both;
				overflow:hidden;
				width:200px;
				margin-bottom:-1.5em;
				color:white;
			}
			.admin_template .editor_tips dd {
				float:right;
				display:block;
				margin-top:-1em;
				width:50%;
			}
	
		.admin_template legend {
			background:#99cc33;
			padding:4px 3px;
			color:black;
		}
		
		.admin_template .input {
			margin:10px 0;
			float:left;
			clear:both;
			width:100%;
		}
		
		.admin_template .tip {
			padding:5px;
			float:left;
		}
			
			.admin_template label {
				float:left;
				width:160px;
				font-weight:bold;
				color:white;
			}
			
			.admin_template input {
				float:left;
			}
				.admin_template input.textfield {
					width:235px;
				}
				
				.admin_template textarea {
					width:410px;
					height:80px;
				}
				
				.admin_template textarea.editor {
					width:410px;
					height:550px;
				}
				
				.admin_template option {
					padding-right:10px;
				}
			
			
		.admin_template .submit {
			overflow:visible;
			float:left;
		}
			
	body.editor_template {
		background:#000000;
		margin:10px;
		height:auto;
		width:auto;
	}
		.editor_template .SC_Item,
		.editor_template .SC_Item .BaseFont {
			background-color:#000000;
		}
			
			
/*===============*/
/* FORM ELEMENTS */
/*===============*/

	input, select, textarea {
		background-color:#eeeeee;
		color:black;
		
		padding:2px;
	}
	
	option {
		padding-right:7px;
	}
	
	input.textfield, select {
		color:black;
		border:0px solid #000;
		border-top:3px double #999;
		border-left:2px double #999;
	}
	
/*
	input, textarea {
		background-color:#eeeeee;
		color:black;
		border:0px solid #000;
		border-top:3px double #999;
		border-left:2px double #999;
		padding:3px;
	}
		input.textfield {
			width:200px;
		}
	
	.admin_template .submit input {
	
		border:1px solid #660000;
		border-bottom:3px double #990000;
		border-right:2px double #990000;
		cursor:pointer;
	}
*/
		
/*==================*/
/* FLASHED MESSAGES */
/*==================*/

.message {
	background-color:#99cc33;
	border:3px double #000;
	color:#000000;
	font-weight:bold;
	padding:4px 10px;
	margin:10px 0;
}

/**
* MISC
*/

hr {
	margin:10px 0;
	
	height:1px;
	width:100%;
	background-color:transparent;
	background-image:url(../img/common/hr_bg.gif);
	_background-repeat:repeat-x;
	outline:0;
	border:0;
	
	clear:both;
}

#ie6 hr,
#ie7 hr {
	margin:0;
	padding:0;
	background-color:blue;
	border-color:#99cc33;
	border-style:dotted;
	border-width:1px;
	
	height:1px;
	outline:none;
	background-image:none;
	color:transparent;
	
}

div.clear {
	height:1px;
	clear:both;
	overflow:hidden;
	width:100%;
}




