/*	
	Spikecast Layout and Presentation CSS
	Author(s): M. J. Magee
	Date: 19.10.07
	Version: 1.2
	www.e-scape.co.uk
	
	Change Log:
	
	07.01.08 - MM - adding search page styles
	08.01.08 - MM - tweaking thumbnail styles

*/

/* Standards*/
	* { margin: 0px; padding: 0px; }
	body { font-family: Arial, Helvetica, sans-serif; font-size: 100%; }
	a { outline: none; }
	span, hr { display: none; }
	.clear { clear: both; height: 1px; }
	.left { text-align: left; }
	
	
	
/* Main Body */
	#wrapper { width: 944px; background: url(../img/opaque_bg.png) repeat-y; text-align: center; margin: 0 auto; }
	#main { width: 914px; text-align: center; margin: 0 auto; }
	
	
	
/* Header */
	#colour-bar { width: 100%; height: 5px; }
	#header { text-align: left; }
	#header h1 { float: left; display: block; }
	#header p { font-weight: bold; }
	#header p em { display: none; }
	#header p.loggedin { width: auto; height: auto; background: none; font-size: 70%; font-weight: normal; margin: 78px 0 0 20px; float: left; }
	#header p.loggedin strong { margin-right: 5px; }
	#header p.loggedin a { text-decoration: none; margin-left: 5px; }
	#header p.loggedin a:hover { text-decoration: underline; }
	#header form { float: right; margin: 35px 0 0 0; height: 60px; }
	#header form input { width: 12em; height: 1.4em; font-size: 80%; border: 1px solid; border-top-color: #8e8e8e; border-right-color: #c2c2c2; border-bottom-color: #c9c9c9; border-left-color: #c3c3c3; color: #666666; font-style: italic; margin: 32px 10px 0 0; padding: 1px 10px; float: left; }
	#header form input.button { width: 53px; height: 22px; border: 0px; margin: 31px 20px 0 0; padding: 0px; }
	#dividing-colour-bar { width: 100%; height: 15px; }
	
	
	
/* Content */
	#content { width: 100%; padding: 20px 0 20px 0; }
	#content #col-1, #content #col-2 { background: none; float: left; }
	#content #col-3 { background: none; float: right; }
	#content h2 { font-size: 110%; }
	#content p { line-height: 18px; font-size: 80%; color: #fffdff; padding: 16px 0 0 0; }
	#content dl { margin: 20px 0 0 0; }
	#content dl dt { font-size: 80%; font-weight: bold; padding: 6px 0 0 0; }
	#content dl dd { font-size: 80%; padding: 4px 0 8px 0; }
	#content dl dd input { width: 95%; height: 1.4em; font-size: 90%; padding: 1px 4px; }
	#content #player { width: 505px; height: 302px; background: url(../img/player_bg.png) repeat-x; text-align: center; margin: 0 auto; padding-top: 8px; }	
	#content #player-shadow { width: 505px; height: 25px; background: url(../img/player_shadow.png) repeat-x; margin: 1px 0 0 0; }	
	
	

/* Two Cols */
	#content.col-2 #col-1 { width: 505px; text-align: left; margin: 0px 30px 0 90px; } 
	#content.col-2 #col-2 { width: 215px; text-align: left; margin: 8px 0 0 0; } 
	#content.col-2 #col-1 h2 { position: relative; bottom: 15px; left: 10px; }
	
	
	
/* Three Cols */
	#content.col-3 #col-1 { width: 145px; text-align: left; margin: 10px 20px 0 20px; } 
	#content.col-3 #col-1 p { padding: 0 0 16px 0; }
	#content.col-3 #col-2 { width: 505px; text-align: left; margin: 8px 0 0 0; } 
	#content.col-3 #col-2 h2 { text-align: center; margin: 0 auto; position: relative; bottom: 15px; }
	#content.col-3 #col-3 { width: 185px; text-align: left; margin: 8px 0 0 20px; float: left; } 
	

	
/* Boxed Elements */
	#content dl.box { width: 163px; margin: 0 0 15px 0; padding: 0 10px; border: 1px solid; }
	#content.col-2 dl.box { width: 210px; }
	#content dl.box dt { font-size: 75%; }
	#content dl.box dd { font-size: 75%; padding: 6px 0 10px 0; }
	#content dl.box ul { list-style: none; }
	#content dl.box ul li { font-size: 95%; text-transform: lowercase; margin-bottom: 5px; }
	#content dl.box ul li a { background: url(../img/downloads_box_arrow.gif) no-repeat 0 3px; padding-left: 14px; text-transform: capitalize; text-decoration: none; }
	#content dl.box ul li a:hover { text-decoration: underline; }
	
	#content p.email-to-friend { margin: 16px 0 0 0; padding: 0px; }
	#content p.email-to-friend a { width: 173px; height: 59px; background: url(../img/buttons/button_email.png) no-repeat; display: block; }
	
	
	
/* Form */
	#content.form { padding-bottom: 20px; }
	#content.form dl { width: 914px; }
	#content.form dl dt { width: 250px; text-align: left; margin: 0 0 0 100px; float: left; }
	#content.form dl dt a { color: #333333; text-decoration: underline; }
	#content.form dl dt a:hover { color: #676767; }
	#content.form dl dd { width: 400px; float: left; }
	#content.form dl dd input { width: 380px; color: #333333; border: 1px solid; border-top-color: #8e8e8e; border-right-color: #c2c2c2; border-bottom-color: #c9c9c9; border-left-color: #c3c3c3; }
	#content.form dl dd input.date-small { width: 15px; }
	#content.form dl dd input.date-large { width: 35px; }
	#content.form dl dd input.check { width: 15px; border: 0px; }
	#content.form dl dd input.radio { width: 15px; border: 0px; }
	#content.form dl dd input.upload { height: 20px; border: 0px;# border: 1px; }
	#content.form dl dd select { width: 392px; max-height: 25px; }
	#content.form dl dd select option { padding: 0 0 3px 0; }
	#content.form dl dd select option.divider { margin-bottom: 8px; padding: 0 0 8px 0; border-bottom: 1px solid #000000; }
	#content.form dl dd label { margin: 0 30px 0 5px; color: #333333; vertical-align: top; }
	#content.form dl dd textarea { width: 368px; height: 10em; font-size: 90%; font-family: Arial, Helvetica, sans-serif; border: 1px solid; border-top-color: #8e8e8e; border-right-color: #c2c2c2; border-bottom-color: #c9c9c9; border-left-color: #c3c3c3; color: #333333; margin: 10px 0 0 0; padding: 5px 10px; }

	#content.form input.button { clear: both; float: right; margin: 10px 50px 0 0; padding: 3px; border: 1px solid;}
	
	
	
/* Sign in or Register */
	#content.form .sign-in { width: 450px; float: left; }
	#content.form .sign-in dl { width: 450px; }
	#content.form .sign-in dl dt { width: 180px; margin: 0 0 0 20px; float: left; }
	#content.form .sign-in dl dd { width: 230px; float: left; }
	#content.form .sign-in dl dd input { width: 200px; }
	
	#content.form .sign-in dl dt.remember { width: 120px; margin-left: 200px; font-size: 60%; font-weight: normal; }
	#content.form .sign-in dl dt.remember label { margin-left: 10px; }
	#content.form .sign-in dl dd.button { width: 110px; }
	#content.form .sign-in dl dd.button input { width: auto; height: auto; margin: 0 20px 0 0; }
	
	#content.form .sign-in p.forgot { font-size: 70%; }
	#content.form .sign-in p.forgot a { color: #6d6d6d; text-decoration: underline; }
	#content.form .sign-in p.forgot a:hover { color: #898989; text-decoration: none; }
	
	
/* Static Text */
	#content.statictext { padding-bottom: 20px; }
	#content.statictext h3, #content .statictext h3 { font-size: 80%; }
	#content.statictext ul, #content .statictext ul { margin: 0 0 10px 35px; padding: 10px 10px 0 0; list-style: disc; }
	#content.statictext ol, #content .statictext ol { margin: 0 0 10px 40px; padding: 10px 10px 0 0; list-style: decimal; }
	#content.statictext ul li, #content.statictext ol li, #content .statictext ul li, #content .statictext ol li { margin-bottom: 5px; font-size: 80%; }
	#content.statictext ul li li, #content.statictext ol li li, #content.statictext ul li li li, #content.statictext ol li li li, #content.statictext ul li p, #content.statictext ol p, #content.statictext ul li h3, #content.statictext ol h3, #content .statictext ul li li, #content .statictext ol li li, #content .statictext ul li li li, #content .statictext ol li li li, #content .statictext ul li p, #content .statictext ol p, #content .statictext ul li h3, #content .statictext ol h3  { font-size: 100%; }
	#content.statictext ul li ul, #content.statictext ol li ol, #content.statictext ul li ol, #content.statictext ol li ul, #content .statictext ul li ul, #content .statictext ol li ol, #content .statictext ul li ol, #content .statictext ol li ul { margin-top: 0px; margin-bottom: 5px; padding-top: 5px; }
	#content.statictext ol.upperalpha, #content .statictext ol.upperalpha { list-style: upper-alpha; }
	#content.statictext ol.lowerroman, #content .statictext ol.lowerroman { list-style: lower-roman; }
	#content.statictext address, #content .statictext address { font-size: 80%; font-style: normal; }



/* Tabs */
	ul#tabs { width: 866px; background: url(../img/tabs_shadow.png) repeat-x bottom; padding: 3px 24px 0 24px; list-style: none; float: left;  }
	ul#tabs li, ul#contenttabs li { float: left; }
	ul#tabs li a { background: url(../img/tabs_bg.jpg) repeat-x #e1dfe0; color: #343434; font-size: 90%; font-weight: bold; text-decoration: none; padding: 7px 10px; display: block; border-top: 1px solid #251f21; border-bottom: 1px solid #251f21; border-left: 1px solid #251f21; }
	ul#tabs li a:hover, ul#tabs li.selected a  { background: #FFFFFF; color: #ed1b24; font-weight: bold; border-bottom: 1px solid #FFFFFF; }
	ul#tabs li a.last-item { border-right: 1px solid #251f21; }
	
	ul#contenttabs { width: 866px; background: url(../img/contenttabs_bg.gif) repeat-x 0 100%; padding: 3px 24px 0 24px; list-style: none; float: left;  }
	ul#contenttabs li a { font-size: 90%; font-weight: bold; text-decoration: none; padding: 7px 10px; display: block; border-top: 1px solid; border-bottom: 1px solid; border-left: 1px solid; }
	ul#contenttabs li a:hover, ul#contenttabs li.selected a { font-weight: bold; }
	ul#contenttabs li a.last-item { border-right: 1px solid; }
	
	
	
	
/* Carousel */
	#colour-bar-2 { width: 100%; height: 5px; }
	#video-content { width: 914px; min-height: 225px; background: #FFFFFF; padding: 18px 0 18px 0; clear: both; }
	#video-content h3 { text-align: left; margin: 0 0 0 20px; font-size: 100%; color: #FF0000; }
	#video-content p { text-align: left; margin: 10px 20px 0 20px; font-size: 80%; color: #333333; }
	
	div#video-content .news_slider { position: relative; width: 906px; margin: 0 auto 20px auto; text-align: left; }

	#video-content .news_slider #next-shadow { width: 83px; height: 225px; background: url(../img/dropshadow_right.jpg) no-repeat; position: absolute; top: 0px; right: 5px; display: block; }
	#video-content .news_slider #prev-shadow { width: 83px; height: 225px; background: url(../img/dropshadow_left.jpg) no-repeat;  position: absolute; top: 0px; left: 5px; display: block; }
	
	#video-content .news_slider #prev, #video-content .news_slider #next { position: absolute; top: 40%; display: none; }
	#video-content .news_slider #next { width: 62px; height: 62px; background: url(../img/arrow_right.png) no-repeat; right: 0; }
	#video-content .news_slider #prev { width: 62px; height: 62px; background: url(../img/arrow_left.png) no-repeat; }
	#video-content .news_slider #no-of-pages { font-size: 70%; padding: 5px; height: 10px; margin: 0 auto 10px auto; text-align: center; }

	
	#video-content .news_slider .news_items { /* The width must be equal to .item ((width + margin-right) * 5). */ position: relative; width: 740px; top: 0; left: 90px; overflow: hidden;  }
	#video-content .news_slider .container { position: relative; top: 0; left: 0; width: 100%; float: left; }
	
	#video-content .news_slider .container .featured { /* Must contain a width and a margin-right. */ width: 134px; margin: 0 14px 10px 0; float: left; }
	#video-content .news_slider .container .featured a img, #content.statictext .container .featured a img { min-width: 120px; max-width: 120px; min-height: 75px; max-height: 75px; display: block; background: #FFFFFF; padding: 5px 6px; border: 1px solid #989898; }
	#video-content .news_slider .container .featured a:hover img { background: #c8c8c8; border: 1px solid #555555; }
	#video-content .news_slider .container .featured .video-wrapper { width: 132px; background: url(../img/video_description_bg.jpg) repeat-x; padding: 7px 1px; }
	#video-content .news_slider .container .featured h3 { font-size: 80%; color: #FF0000; border-bottom: 1px solid #dddbdc; margin: 0; padding: 0 7px 4px 7px; text-align: center; }
	#video-content .news_slider .container .featured h3 a { text-decoration: none; }
	#video-content .news_slider .container .featured h3 a:hover { text-decoration: underline; }
	#video-content .news_slider .container .featured p { font-size: 70%; font-weight: bold; color: #000000; border-bottom: 1px solid #dddbdc; margin: 0; padding: 4px 7px; text-align: center; }
	#video-content .news_slider .container .featured p a { color: #000000; text-decoration: none; }
	#video-content .news_slider .container .featured p a:hover { text-decoration: underline; }
	#video-content .news_slider .container .featured p.date { font-size: 50%; color: #999999; }
	#video-content .news_slider .container .featured ul { list-style: none; margin: 0 0 0 7px; }
	#video-content .news_slider .container .featured ul li { background: url(../img/video_arrow.gif) no-repeat 0 8px; font-size: 70%; color: #999999; border-bottom: 1px solid #dddbdc; padding: 4px 7px 4px 9px;  }
	#video-content .news_slider .container .featured ul li a { color: #999999; text-decoration: none; }
	#video-content .news_slider .container .featured ul li a:hover { text-decoration: underline; }
	
	
	
/* Limited */
	div#video-content.limited { min-height: 90px; padding-bottom: 18px; } 
	div#video-content.limited .news_slider { margin-bottom: 0px; }
	div#video-content.limited .news_slider #next-shadow, div#video-content.limited .news_slider #prev-shadow { display: none; }
	div#video-content.limited .news_slider .news_items { width: 906px; left: 11px; }
	div#video-content.limited .news_slider .container .featured { width: 282px; margin-right: 19px; margin-bottom: 0px; }
	div#video-content.limited .news_slider .container .featured a img { float: left; }
	div#video-content.limited .news_slider .container .featured .video-wrapper { width: 135px; float: left; margin: 0 0 0 10px; }
	
	
	
/* Page Text */
	#page-text { width: 100%; text-align: center; margin: 0 auto; padding-bottom: 35px; border-top: 1px solid; clear: both; }
	#page-text.no-border { border-top: 0px; }
	#main div.page-text-wrapper { width: 764px; text-align: left; margin: 0 0 0 75px; float: left; }
	#main div.content-wrapper { width: 761px; padding-bottom: 1px; padding-left: 1px; border-bottom: 1px solid #dbdad6; border-left: 1px solid #dbdad6; }
	#main div.page-text-wrapper p.logged-in-msg { margin-top: 15px; font-size: 80%; font-weight: bold; }
	#main div.content { width: 703px; min-height: 135px; background: url(../img/content_detail_full_bg.jpg) no-repeat bottom #f9f9f9; padding: 16px 40px 18px 18px; text-align: left; }
	#main div.content h3 { color: #333333; font-size: 105%; }
	#main div.content p { margin-top: 10px; color: #333333; font-size: 80%; line-height: 18px; }

	#corporate #main div.page-text-wrapper { width: 579px; margin-right: 0px; }
	#corporate #main div.content-wrapper { width: 579px; }
	#corporate #main div.content { width: 521px; min-height: 135px; background: url(../img/content_detail_small_bg.jpg) no-repeat bottom #f9f9f9; }
	
	#main div.content table { width: 100%; margin: 10px 0 0 0; }
	#main div.content table tr th { width: 45%; padding: 10px; text-align: left; font-size: 80%; color: #333333; }
	#main div.content table tr td { width: 45%; padding: 10px; text-align: left; font-size: 80%; color: #333333; }
	#main div.content table tr td ul { list-style: disc; margin-left: 15px; }
	#main div.content table tr td ul li { margin: 0 0 5px 0; }
	#main div.content table tr td h3 { margin-bottom: 10px; }
	#main div.content dl dt { margin: 10px 0 0 0; font-size: 80%; color: #333333; font-weight: bold; }
	#main div.content dl dd { font-size: 80%; color: #333333; }

	#page-text #content-col-2, #page-text #content-col-3 { width: 767px; text-align: center; margin: 20px auto 0 auto;  }
	
	#main div.content p.author { margin-top: 20px; color: #545454; font-size: 70%; }
	#page-text form.comments { width: 757px; margin: 30px 0 0 0; }
	#page-text form.comments textarea { width: 97%; height: 10em; font-size: 80%; font-family: Arial, Helvetica, sans-serif; border: 1px solid; border-top-color: #8e8e8e; border-right-color: #c2c2c2; border-bottom-color: #c9c9c9; border-left-color: #c3c3c3; color: #666666; margin: 10px 0 0 0; padding: 5px 10px; }
	#page-text form.comments input.button { float: right; margin: 10px 1px 0 0; }


/* Two Vertical Columns */
	#page-text #content-col-2.vertical { height: 100%; background: url(../img/2_col_vertical_bg.gif) repeat-y 0 0; }
	#page-text #content-col-2.vertical .page-content { width: 342px; background: #FFFFFF; text-align: left; margin-right: 1px; padding: 10px 20px 0 20px; float: left; }
	#page-text #content-col-2.vertical .last-item { margin-right: 0px; border-right: 0px; }


	
/* Three Vertical Columns */
	#page-text #content-col-3.vertical { height: 100%; background: url(../img/3_col_vertical_bg.gif) repeat-y 0 0; border-right: 1px solid; border-left: 1px solid; }
	#page-text #content-col-3.vertical .page-content { width: 215px; background: #FFFFFF; text-align: left; padding: 10px 20px 0 20px;  float: left; }
	#page-text #content-col-3.vertical .middle { margin: 0 1px; }
	


/* Two and Three Horizontal Columns */
	#page-text #content-col-2.horizontal .page-content, #page-text #content-col-3.horizontal .page-content { width: 100%; text-align: left; padding: 12px 20px 0 20px; }	
	
	#page-text #content-col-2 .page-content h3, #page-text #content-col-3 .page-content h3 { font-size: 110%; }
	#page-text #content-col-2 .page-content p, #page-text #content-col-3 .page-content p { font-size: 75%; margin: 5px 0 20px 0; }

	.blockquote { width: 174px; margin: 18px 70px 0 15px; float: right; }
	.blockquote blockquote { width: 172px; background: url(../img/quote_left.jpg) no-repeat 5px 8px #e2e2e2; text-align: left; border-right: 1px solid #c1c1c1; border-left: 1px solid #c1c1c1; padding-bottom: 12px; }
	.blockquote blockquote p { background: url(../img/quote_right.jpg) no-repeat 96% 100%; line-height: 20px; padding: 14px 18px 0 18px; font-size: 75%; }
	.blockquote blockquote p.quoted { background: none; line-height: 18px; padding: 18px 18px 0 18px; font-weight: bold; }
	.blockquote-top { width: 174px; height: 8px; background: url(../img/quote_box_top.jpg) no-repeat; }
	.blockquote-bottom { width: 174px; height: 8px; background: url(../img/quote_box_bottom.jpg) no-repeat; }
	
	#page-text a.register { width: 160px; background: url(../spikecast/img/arrow_black.gif) no-repeat 0 4px; margin: 35px 70px 0 8px; padding-left: 16px; text-align: left; font-size: 95%; font-weight: bold; color: #010000; line-height: 20px; text-decoration: none; float: right; }
	
	
	
/* Search Page */
	#content.statictext .container { width: 820px; margin: 0 auto; text-align: center;}
	#content.statictext .container .featured { width: 134px; margin: 10px 15px 0 15px; float: left; }
	#content.statictext .container .featured a img { max-width: 120px; display: block; background: #FFFFFF; padding: 5px 6px; border: 1px solid #989898; }
	#content.statictext .container .featured a:hover img { background: #c8c8c8; border: 1px solid #555555; }
	#content.statictext .container .featured .video-wrapper { width: 132px; background: url(../img/video_description_bg.jpg) repeat-x; padding: 7px 1px; }
	#content.statictext .container .featured h3 { font-size: 80%; color: #FF0000; border-bottom: 1px solid #dddbdc; margin: 0; padding: 0 7px 4px 7px; text-align: center; }
	#content.statictext .container .featured h3 a { text-decoration: none; }
	#content.statictext .container .featured h3 a:hover { text-decoration: underline; }
	#content.statictext .container .featured p { font-size: 70%; font-weight: bold; color: #000000; border-bottom: 1px solid #dddbdc; margin: 0; padding: 4px 7px; text-align: center; }
	#content.statictext .container .featured p a { color: #000000; text-decoration: none; }
	#content.statictext .container .featured p a:hover { text-decoration: underline; }
	#content.statictext .container .featured p.date { font-size: 50%; color: #999999; border-bottom: 0px;}
	#content.statictext ul.search-list { list-style: none; }
	#content.statictext ul.search-list li { margin: 0 0 10px 0; }
	#content.statictext ul.search-list li a { text-decoration: none; font-weight: bold; }
	#content.statictext ul.search-list li a:hover { text-decoration: underline; }
	
	
	
/* Footer */
	.footer-clear { width: 914px; height: 1px; background: #FFFFFF; text-align: center; margin: 0 auto; clear: both; } 
	#content-bottom { width: 944px; height: 23px; background: url(../img/opaque_bottom.png) no-repeat; text-align: center; margin: 0 auto; display: block; }
	#footer { width: 770px; text-align: center; margin: 18px auto 25px auto; }
	#footer ul { list-style: none; }
	#footer ul li { font-size: 75%; float: left; margin-bottom: 5px; }
	#footer ul li a { padding: 0 8px; text-decoration: none; }
	#footer ul li a:hover { text-decoration: underline; }
	#footer ul li a.first-item { background: none; padding-left: 0px; }
	#footer p.right { font-size: 75%; float: right; }
	#footer p.right a { text-decoration: none; }
	#footer p.right a:hover { text-decoration: underline; }
	#footer p.copyright { font-size: 75%; text-align: left; clear: both; }
	
	
	
/* Globals */
	.margin-left-20px { margin-left: 20px; }