/* SpikeCast.co.uk
	Name: CSS Index - Cheval Roc
	Author: M. J. Magee - www.e-scape.co.uk
	Date: 02/11/07
	Version: 0.1
*/

/* Standards */

	/* Main Body */
		* { margin: 0px; padding: 0px; font-size: 100%; font-family: Verdana, Arial, Helvetica, sans-serif; }
		#container { width: 759px; margin: 10px auto 0 auto; text-align: center; }
		.clear { clear: both; }
		p { margin: 10px 0; }
	
	/* Header */
		#header { width: 727px; height: 130px; padding: 0 15px; background: url(../../img/header-bg.jpg) repeat-x bottom; background-color: #f5f6f7; border: 1px solid #d9dbdc; border-bottom: 0px; text-align: left; }
			#logo { border: 5px solid #d9dbdc; float: left; margin: 18px 0 0 0; }
				#logo:hover { border: 5px solid #aaabac; }
			#strap-line { color: #000000; font-weight: bold; font-size: 90%; float: right; margin: 70px 0 0 0; }
			.colour-strip { width: 738px; height: 15px; font-size: 70%; text-align: right; padding: 5px 16px 5px 5px; }
	
	/* Player */
		#player { width: 757px; height: 315px; background: url(../../img/player-bg.jpg) no-repeat; border: 1px solid #d9dbdc; border-bottom: 0px; }
			#alt-content { margin: 25px 0 0 0; }
			#drop-shadow { width: 410px; height: 20px; margin: 0 auto; text-align: center; background: url(../../img/drop-shadow.jpg) no-repeat; position: relative; bottom: 1px; }

	/*  Gradient */
		#gradient { width: 759px; height: 150px; background: url(../../img/gradient-bg.jpg) no-repeat; }

	
	/* Other Films */
		#portfolio { width: 640px; margin: 0 auto; padding: 0 59px 18px 59px; position: relative; bottom: 125px; text-align: center; }
			.film-container { width: 140px; margin: 10px; float: left; text-align: left; }
				.film-container a { font-size: 70%; color: #737373; text-decoration: none; font-weight: bold; }
					.film-container a:hover { text-decoration: underline; }
				.film-container p.alt-colour { font-size: 70%; margin: 0; font-weight: bold; }
				.film-img { width: 130px; height: 130px; margin: 0 0 10px 0; background: url(../../img/portfolio-bg.jpg) no-repeat; }
				.film-img:hover { border: 5px solid #dbdcde; }
				.film-img img { padding: 5px 0 0 5px; width: 120px; height: 120px; }

				
				
	/* Contact Info */
		#contact { width: 759px; position: relative; bottom: 100px; }
			.header { font-size: 90%; font-weight: bold; }
			#contact p { font-size: 78%; color: #5d5e5e; }
			#contact address { font-style: normal; font-size: 78%; color: #5d5e5e; }
				#contact address p { margin: 0 0 10px 0; font-size: 100%; }
				#contact address span.header { font-size: 100%; }
				#contact a { color: #5d5e5e; font-weight: bold; text-decoration: none; }
					#contact a:hover { text-decoration: underline; }
			#col-1 { width: 213px; padding: 0 30px 0 0; background: url(../../img/divider.jpg) no-repeat right top; text-align: left; float: left; }
			#col-2 { width: 216px; padding: 0 30px; background: url(../../img/divider.jpg) no-repeat right top; text-align: left; float: left; }
			#col-3 { width: 210px; padding: 0 0 0 30px; text-align: left; float: left; }
				#col-3 br { margin: 15px 0 0 0; }
				#col-2 ul li { font-size: 78%; color: #5d5e5e; margin: 3px 0; }

	/* Footer */
		#footer { position: relative; bottom: 50px; }
			#footer p { color: #FFFFFF; font-size: 100%; font-weight: bold; text-align: center; margin: 0; }

/* Customizable (Colours) */
	/* Colour Strip (Top Strip and Footer) */
		.colour-strip { background: #000000; color: #fcf9cd; }
			.colour-strip a { color: #fcf9cd; text-decoration: underline; }
			.colour-strip a:hover { text-decoration: none; }
		
	/* Other Films */
		#portfolio { border-bottom: 1px solid #000000;  }
			.film-container { width: 140px; margin: 10px; float: left; text-align: left; }
				.film-img { border: 5px solid #000000; }
			p.alt-colour { color: #000000; }

				
	/* Contact Info */
		.header { color: #000000; }