﻿/*
Developed by Step Online Ltd
TW Podcasts Screen CSS  
Created 21st October 2008  
All Rights Reserved
*/

/* Global Reset */
html, body, p, h1, h2, h3, h4, h5, h6, img, ol, ul, li, dfn, div, strong, em, dd, dt, dl, form, input, textarea, select, option, a { margin: 0; padding: 0; outline: none; border: 0; font-size: 100% }
img, a img { border: 0 }
body { font-size: 62.5% }
/* End Global Reset */

/* Site Structure */
body { text-align: center; background: #820000 url(http://www.twpodcasts.co.uk/images/background.png) repeat-x; padding: 30px 0 30px 0 }
h1 { background: url(http://www.twpodcasts.co.uk/images/header.jpg) no-repeat; height: 234px }
h1 a { display: block; height: 234px; text-indent: -9999em }
#siteHolder { font-size: 1.2em; background: url(http://www.twpodcasts.co.uk/images/contentBackground.gif) repeat-y; width: 922px; text-align: left; margin: 0 auto; font: 1.2em/1.4 Tahoma,Arial,sans-serif }
#content { width: 640px; padding: 22px; background: #EEE; padding: 12px; margin: 12px 0; border: 1px #C1C1C1 solid }
.contentBox { background: #EEE; padding: 12px; margin: 12px 0; border: 1px #C1C1C1 solid }
.contentBox img { width: 598px; border: 1px #C1C1C1 solid }
.slideToggle1, .slideToggle2, .slideToggle3, .slideToggle4, .slideToggle5 { cursor: pointer; padding: 4px 14px; border: 1px #999 solid; background: #F4F4F4; margin: 1em 0 0 0; letter-spacing: 1px; word-spacing: 1px }
.slideToggle1:hover, .slideToggle2:hover, .slideToggle3:hover, .slideToggle4:hover, .slideToggle5:hover { background: #FFF }
.exampleCast { margin: 1em 0 1em }
.videoProductionBox, .audioProductionBox { float: left; position: relative; display: inline; width: 300px; margin: 6px 0; text-align: justify }
.videoProductionBox:hover, .audioProductionBox:hover, .videoProductionBox:hover p, .audioProductionBox:hover p { color: #820000; cursor: pointer }
.videoProductionBox h3, .audioProductionBox h3 { margin-bottom: 0; padding-bottom: 0; line-height: 1.2em }
.audioProductionBox { margin-right: 18px }
/* End Structure */

/* Nav */
#nav { float: right; position: relative; display: inline; margin: 0 0 0 6px; list-style: none; width: 242px; padding: 0 }
#nav li { width: 240px; height: 74px; clear: left; float: left; position: relative; display: inline; margin: 10px 0 0 2px }
#nav li a { display: block; padding: 6px; text-decoration: none; font-size: 140%; color: #A02303; background: #FFF url(http://www.twpodcasts.co.uk/images/listItem.jpg) no-repeat }
#nav li a:focus, #nav li a:hover { background-position: -240px 0 }
#nav li a span { display: block; color: #232323; font-size: 80% }
#nav li a:focus span, #nav li a:hover span { color: #820000 }
/* End Nav */

/* Footer */
#footer { clear: both; font-size: 1.2em; width: 922px; color: #FFF; margin: 20px auto 0; font-family: Verdana,Arial,sans-serif; text-align: center }
#footer ul { list-style: none }
#footer ul, #footer p { color: #FFF; margin: 0.4em 256px 0.4em 0; text-align: center }
#footer li { display: inline; margin: 0 6px 0 0 }
#footer a { color: #FFFEC6; text-decoration: none }
/* End Footer */

/* Typography */
p, #content ul, #content ol, #content dl { margin: 1em 0 1em; color: #484848 }
#content ul, #content ol { margin-left: 22px }
h2, h3, h4, legend { clear: left; font-size: 2.6em; font-weight: normal; color: #A02303; letter-spacing:-1px; word-spacing: -1px }
h3, legend { font-size: 2.2em }
h4 { font-size: 1.6em; clear: left }
strong { color: #820000 }
.highlight { font-size: 140% }
dt { display: block; font-weight: bold; margin: 1em 0 0 0 }
#content a { color: #820000; text-decoration: none; border-bottom: 1px #820000 solid }
#content a:focus, #content a:hover, #content a:focus { color: #F00000; border-bottom: 1px #F00000 solid }
/* End Typography */

/* Contact Form */
#pageContact form p { background: #F8F2EF; padding: 8px 0; width: 320px; border: 1px #EBC7C7 solid; overflow: auto }
#pageContact form p.buttonp, #pageContact form p#log_res { border: 0; background: none; padding: 0 }
label { float: left; display: inline; position: relative; width: 120px; text-indent: 8px }
input, textarea { float: left; position: relative; display: inline; padding: 2px; width: 188px; background: #FFF; border: 1px #EBC7C7 solid }
textarea { font: 1em/1.6 "Lucida Sans",Arial,sans-serif }
.fValidator-msg { clear: both; padding-top: 6px; color: #000; margin-left: 120px; font-weight: bold }
#pageContact .right { float: right; position: relative; display: inline; width: 240px; margin-top: 12px }
fieldset { padding: 0 18px; border: 1px #EBC7C7 solid; width: 330px }
legend { padding: 12px }
/* End Contact Form */

/* Tools */
.discreet, .human, .ieignore { position: absolute; top: -9999em; left: -9999em }
.human { display: none; visibility: hidden }
.button { width: auto; margin: 0; position: static; padding: 2px; color: #000; border: 1px #6D102C solid; font-size: 1.2em }
.clear { clear: both }
.floatRight, .floatLeft { float: right; position: relative; display: inline; margin: 0 12px 12px 12px }
img.floatRight { padding: 2px; border: 1px #CCC solid; background: #FFF }
.floatLeft { float: left }
div.clear { height: 1px; overflow: hidden }
/* End Tools */