/* ---------------------------------------------------------- Site: 'Wireframe' site Filename: s-themes.css URL: Author: Peter Barclay Version: 2008.07.16 Description: Mainly cosmetic Comments: This stylesheet provides styling for this brand of the programmes templates. Notes: n1. Where pngs are used, the rule must be replicated in the sibling css file (s-ie-png.css) with the appropriate ie-specific filter. n2. ROWS: Borders on rows require corresponding reduction in LH padding on .p-mod element, otherwise, they will break the visual language and also float wrongly (last one will possibly wrap). n3. PROMOS: Borders - see note 4. Index: =UNIVERSAL STYLING - Some basic high-level styling applied universally FOR THIS SITE/BRAND ONLY (links, etc) Ensure Progs B content and Barlesque page areas are targeted separately as appropriate - use Progs B hooks to do this (e.g. .prg-wrapper, #prg-wrapper-shell etc) =MAIN PAGE STRUCTURE ELEMENTS =STANDALONE ELEMENTS (OUTSIDE LH and RH AREAS) - e.g. masthead, main nav strip etc =COMMONLY RE-USED CONTENT MODULES (p-grp, p-mod, promo etc) =COMMONLY RE-USED SMALLER ELEMENTS - quote boxes, etc =SPECIFIC CONTEXTS AND USAGES * --- CONTEXT: 'FEATURED' CONTENT AREA ( = 'Main' content area) --- * --- CONTEXT: 'EXTRA' CONTENT AREA ( = RH Content) AREA) --- * --- CONTEXT: PAGETYPE-SPECIFIC: Styling only applying to specific page types (index, subindex, content) --- =BESPOKE THEMES - system for styling selected content blocs and descendants differently from defaults. =VISIONAPPS - comments, galleries, uploader etc ---------------------------------------------------------- */ /* =SITE-LEVEL GENERIC STYLING --------------------------------------------- */ h2, h3, h4{ background:#FFF7EA; } .nav-cat-artists h2, .nav-cat-artists h3, .nav-cat-artists h4{ background:#f5f5f5; } /* Re-defining some global links settings: */ .prg-wrapper a { font-weight:bold; color:#9999FF; } .prg-wrapper a:link, .prg-wrapper a:visited { text-decoration:none; } .prg-wrapper a:hover { text-decoration:underline; } /*Standalone headings*/ .prg-wrapper .prg-grp h2 { } .prg-wrapper h2.standalone { margin-bottom:10px; font-size:15px; line-height:0.6em; background: #000000; border: 1px solid #D10B96; } /* =MAIN PAGE STRUCTURE ELEMENTS --------------------------------------------- */ /* Outer containers enclosing everything between Barlesque opening and closing content. */ .prg-wrapper { background:#FFF7EA url('/staticarchive/82807c69eb9611b20fa67560efc2af320b0eaa05.jpg') no-repeat; font-family:arial, sans-serif; } .prg-wrapper .p-grp h2 { margin-bottom:10px; } .prg-wrapper h1, .prg-wrapper h2, .prg-wrapper h3 { font-family:arial, sans-serif; background-color:#f5f5f5; } .glow-gecko .prg-wrapper h1, .prg-wrapper h2, .prg-wrapper h3 { background:transparent; } #prg-wrapper-shell { font-family:arial,sans-serif; color:#3A3A3A; } /* =STANDALONE ELEMENTS - OUTSIDE 'FEATURED' AND 'EXTRA' AREAS --------------------------------------------- */ /* MASTHEAD(banner) */ #prg-masthead { height: 150px; padding: 0; } #prg-masthead img { position: absolute; top: 31px; right: 0px; } /* MAIN NAV (usu. top of page) */ #prg-nav-main { background:#5E0544 url(/staticarchive/8fa03ac0ab48dede63e937f9ab9f841f809dbde3.jpg) repeat-x; padding: 0px; text-align: center; height: 32px; margin: 0px 0px 14px 0px; border: 1px solid #D10B96 } #prg-nav-main ul.nav-strip { margin: 0px; text-align:left; } #prg-nav-main ul.nav-strip li{ display: inline-block; background:transparent url(/staticarchive/db576e1355c059e7067e9ff3042bda2c19e576b8.jpg) no-repeat right; padding: 0px 5px 0px 0px; margin: 0px 0px 0px 0px; font-size: 1.2em; } #prg-nav-main li { background-position:left center; background-repeat:no-repeat; } #prg-nav-main li.nth-child-1 { background: none; } #prg-nav-main a { color:#fff; } #prg-nav-main a:link { color:#fff; } #prg-nav-main a:visited { color:#fff; } #prg-nav-main a:hover { background:#C90B90 url(/staticarchive/e52cf7c606dc818d68c95935432105ada8996959.jpg) repeat-x; color:#ffffff; } #prg-nav-main a:active { color:#000000; } .prg-wrapper #prg-nav-main a:hover { text-decoration:none; } #prg-nav-main ul.nav-strip li a.selected{ background:#C90B90 url(/staticarchive/e52cf7c606dc818d68c95935432105ada8996959.jpg) repeat-x; } /* PAGE HEADER STRIP (full-page-width version, outside main content areas).*/ #prg-header-main { } .prg-header { background:none; background-color:#1E2831; color: #333333; } .prg-header .content-extra { font-style:italic; } /* BOOKMARKS */ #prg-bookmark{ border: 1px solid #D10B96; background:#FFF7EA; margin: 100px 0px 0px 0px; } #prg-bookmark, #prg-bookmark h2 { color:#333333; } #prg-bookmark a{ color:#333333; text-decoration:underline; } /* =COMMONLY RE-USED CONTENT MODULES (prg-grp p-grp, p-mod, promo etc) --------------------------------------------- */ /* Default 'Super-group' - style (prg-grp) prg-grp is used to contain rows (p-grp) for presentational reasons. use selectively where other styling solutions aren't available */ .prg-grp { } /* Default 'row' style */ .p-grp { } /* Default p-mod style */ .p-mod { } /* Default p-mod style */ .p-mod-content { } /* Default promo style */ .promo { background:#FFF7EA; border: 1px solid #D10B96; color: #333333; } .promo img{ border:1px solid #000; } /* =COMMONLY RE-USED CONTENT MODULES (prg-grp p-grp, p-mod, promo etc) --------------------------------------------- */ /* Default 'Super-group' - style (prg-grp) prg-grp is used to contain rows (p-grp) for presentational reasons. use selectively where other styling solutions aren't available */ .prg-grp { } /* Default 'row' style */ .p-grp { } /* Default p-mod style */ .p-mod { } /* Default p-mod style */ .p-mod-content { } /* Default promo style */ .promo { background:#FFF7EA; border: 1px solid #D10B96; } .promo img{ border:none; } /* =COMMONLY RE_USED SMALLER ELEMENTS - quote boxes, etc --------------------------------------------- */ /* Carousel */ .prg-wrapper .prg-carousel-content { /*padding:5px 0 5px 6px; padding-left:0;*/ } /* Featured lead */ .prg-featured-lead{ background:#FFF7EA; border: 1px solid #D10B96; padding-bottom: 14px; color: #333333; } .prg-featured-lead img.large{ margin:0 90px 10px 90px; border:1px solid #000; } .prg-featured-lead .promo{ border:none; } .prg-featured-lead .promo p{ background:#FFF7EA; color: #333333; } .nav-cat-home .prg-featured-lead p.caption{ margin:0px 55px 10px 55px; _margin:0px 55px 10px 55px; width:502px; _width:502px; padding:5px; background:#D10B96 url(/staticarchive/e52cf7c606dc818d68c95935432105ada8996959.jpg) bottom repeat-x; color: #ffffff; border-left: 1px solid #D10B96; border-right: 1px solid #D10B96; border-bottom: 1px solid #D10B96; } .nav-cat-home .prg-featured-lead p{ margin:0px 10px 10px 10px; padding:5px; background:#FFF7EA; color: #333333; } .nav-cat-home .prg-featured-lead .promo_image{ margin:0px 55px 0px 55px; } /* Image overlay box (captions sitting over images, often with background colour, image or semi-transparency png: */ .promo .promoDetails .overlay-footer { background-image: url(/staticarchive/17df96b5e0f3c9910fa76ae17e058a57ccfa71bb.png); } /* Blockquote */ .prg-content .p-blockquote { /*background-color: #000000; background-image: url(f/quote-open.gif); background-repeat: no-repeat; background-position: 10px 10px; color:#FFFFFF;*/ } .prg-content .p-blockquote p.quote-text { /*background-image: url(f/quote-close.gif); background-repeat: no-repeat; background-position: 156px 100%; color: #333333;*/ } .prg-content .p-blockquote p.quote-text a, .prg-content .p-blockquote p.quote-text a:link, .prg-content .p-blockquote p.quote-text a:visited, .prg-content .p-blockquote p.quote-text a:active { /*color: #333333;*/ } /* =SPECIFIC CONTEXTS AND USAGES --------------------------------------------- */ /* --- CONTEXT: 'FEATURED' CONTENT AREA ( = 'Main' content) --- */ /* Page header strip - inside featured area (alternative to full-page-width version).*/ #prg-wrapper-featured{ height:auto; } #prg-wrapper-featured #prg-header-main { } #prg-wrapper-featured .prg-header { /*background:none; background-color:#1E2831; color: #333333;*/ } #prg-wrapper-featured .prg-header .content-extra { /*font-style:italic;*/ } /* Images in the featured area */ #prg-wrapper-featured img { /*border: 1px solid #E0E4E4;*/ } /* Lead promos */ #prg-wrapper-featured .prg-featured-lead-bg { /*background-color:#F4F5F9; background-image:url('f/bg-index-lead.gif'); background-repeat:no-repeat;*/ } #prg-wrapper-featured .prg-featured-lead-bg .lead-text { /*margin:0 10px;*/ } #prg-wrapper-featured .prg-featured-lead-bg .p-grp { /*position:absolute; bottom:0; left:0; width:100%; margin-bottom:0;*/ } /* Parent container holding 'rows' of promos: */ #prg-wrapper-featured .prg-grp { /*border-bottom:5px solid #F4F5F9; border-top:15px solid #F4F5F9; background-color: #F4F5F9; margin-bottom:10px;*/ } /* Separator in content area */ #prg-wrapper-featured hr { /*background-color: #CCCCCC;*/ } /* video-carousel description box */ .prg-wrapper .emp-carousel-description { /*background-image:url('f/bg-carousel-description.png'); background-repeat:repeat-x; background-position:0 0; background-color:#e2efec; border:2px solid #000000;*/ } /* video-carousel background image */ .prg-carousel-content-black { /*background-image:url('f/bg-black-carousel-video.png'); background-color:#1A171B;*/ } .prg-carousel-content-silver { /*background-image:url('f/bg-silver-carousel-video.png'); background-color:#CDCCCE;*/ } /* video-carousel buttons */ .prg-wrapper .rollover a.navPrev-black-1 { /*background-image: url('f/btn-carousel-black-1-l.gif');*/ } .prg-wrapper .rollover a.navNext-black-1 { /*background-image: url('f/btn-carousel-black-1-r.gif');*/ } .prg-wrapper .rollover a.navPrev-black-2 { /*background-image: url('f/btn-carousel-black-2-l.gif');*/ } .prg-wrapper .rollover a.navNext-black-2 { /*background-image: url('f/btn-carousel-black-2-r.gif');*/ } .prg-wrapper .rollover a.navPrev-black-3 { /*background-image: url('f/btn-carousel-black-3-l.gif');*/ } .prg-wrapper .rollover a.navNext-black-3 { /*background-image: url('f/btn-carousel-black-3-r.gif');*/ } .prg-wrapper .rollover a.navPrev-silver-1 { /*background-image: url('f/btn-carousel-silver-1-l.gif');*/ } .prg-wrapper .rollover a.navNext-silver-1 { /*background-image: url('f/btn-carousel-silver-1-r.gif');*/ } .prg-wrapper .rollover a.navPrev-silver-2 { /*background-image: url('f/btn-carousel-silver-2-l.gif');*/ } .prg-wrapper .rollover a.navNext-silver-2 { /*background-image: url('f/btn-carousel-silver-2-r.gif');*/ } .prg-wrapper .rollover a.navPrev-silver-3 { /*background-image: url('f/btn-carousel-silver-3-l.gif');*/ } .prg-wrapper .rollover a.navNext-silver-3 { /*background-image: url('f/btn-carousel-silver-3-r.gif');*/ } /* --- CONTEXT: 'EXTRA' CONTENT AREA AREA ( = RH Content) --- */ /* 'Super-group' container in 'EXTRA' area */ #prg-wrapper-extra .prg-grp .nth-child-1 { /*background:none;*/ } #prg-wrapper-extra .prg-related .p-grp { } /* Related content in 'Extra' area */ /* Default basic styling: */ #prg-wrapper-extra .prg-related { background:#FFF7EA; border: 1px solid #D10B96; padding-bottom: 10px; } #prg-wrapper-extra .prg-related h3.decor1{ font-family: Arial, Verdana, sans-serif; padding: 5px 0px 5px 0px ; } #prg-wrapper-extra .prg-related ul, #prg-wrapper-extra .prg-related h3 { margin:0 10px; } #prg-wrapper-extra .prg-related p{ margin:5px 10px; font-family: Arial, Verdana, sans-serif; color: #333333; } #prg-wrapper-shell #prg-wrapper-extra .prg-related h2 { /*padding-top: 10px;*/ } /* 'Super-group' container in 'Related' area: */ #prg-wrapper-extra .prg-related .p-grp .p-mod { /*padding-bottom:5px; background: url(f/bg-p-grp-extra.gif); background-position:center bottom; background-repeat:no-repeat;*/ } #prg-wrapper-extra .prg-related .p-grp .p-mod p { /*margin-bottom:7px;*/ } /* Promo in 'Related' area: */ #prg-wrapper-extra .prg-related .promo { border:0; } #prg-wrapper-extra .prg-related a, #prg-wrapper-extra .prg-related a:link, #prg-wrapper-extra .prg-related a:visited, #prg-wrapper-extra .prg-related a:active { /*color: #333333;*/ } /* Images in 'Related' area */ #prg-wrapper-extra .prg-related img { /*border: 1px solid #FFFFFF;*/ } /* APS in 'EXTRA' area */ #prg-wrapper-shell #prg-wrapper-extra .p-aps { /*background:#B6BDC5;*/ } .prg-wrapper .p-grp h2{ margin:0; } .prg-wrapper .p-aps h2{ background:none; padding-left:0; padding-top:0; } .p-aps .promo{ margin-bottom:10px; margin-top:0; padding-top:0; } .p-aps .promo a, .p-aps .promo a:link, .p-aps .promo a:visited, .p-aps .promo a:active { } .p-aps .promo a:hover { /*text-decoration: none;*/ } .p-aps .promo hr { /*background-color: #CCCCCC; margin: 0 0 5px;*/ } /* MPU ad in 'EXTRA' area */ #prg-wrapper-extra .p-ad-mpu { /*background-color:#1E2831; color:#FFFFFF;*/ } #prg-wrapper-extra .p-ad-mpu a, #prg-wrapper-extra .p-ad-mpu a:link, #prg-wrapper-extra .p-ad-mpu a:visited, #prg-wrapper-extra .p-ad-mpu a:active { /*color: #333333;*/ } #prg-wrapper-featured .p-ad-mpu img { /*border:none;*/ } /* --- CONTEXT: PAGETYPE-SPECIFIC --- */ /* INDEX PAGES */ .prg-index .prg-featured-lead .p-grp-aa { /*padding-top:5px; background-image:url(f/bg-p-grp-a.gif); background-position:center top; background-repeat:no-repeat;*/ } .prg-index .prg-wrapper .p-quote .q-open { /*background:url(f/quote-open.gif) left top no-repeat;*/ } .prg-index .prg-wrapper .p-quote .q-closed { /*background:url(f/quote-close.gif) right top no-repeat;*/ } .prg-index .p-aps .promo{ /*background:#B6BDC5; margin-bottom:10px;*/ } .prg-index #prg-wrapper-extra .p-grp { /*background-color:#F4F5F9; */ } .prg-index #prg-wrapper-extra .prg-related .p-grp { /*background-color:transparent; */ } .prg-index #prg-wrapper-featured h3 { /*font-size:1.1em;*/ } .prg-index-a .prg-featured-lead { background:#FFF7EA; border: 1px solid #D10B96; } .prg-index-a #prg-wrapper-extra .p-grp .nth-child-1 { /*padding-top:0; background: none;*/ } .prg-index-a .prg-featured-lead .p-grp-a { /*padding-top:15px;*/ } .prg-index-b .prg-featured-lead .p-mod-2a { /*padding:15px 0;*/ } .prg-index-b .prg-featured-lead .p-mod-2a { /*background-color:#F4F5F9;*/ } .prg-index #prg-wrapper-featured .prg-grp .p-grp-aa { /*padding:0; background-color:#F4F5F9; background-image: url(f/bg-p-grp-aa.gif); background-position:center top; background-repeat:repeat-y;*/ } .prg-index #prg-wrapper-featured .p-grp-aa h2 { background:#FFF7EA; border: 1px solid #D10B96; } .prg-index-b #prg-wrapper-featured .prg-grp .p-grp-aaa { /*background-color:#F4F5F9; background-image:url(f/bg-p-grp-aaa.gif); background-position:center top; background-repeat:repeat-y;*/ } .prg-index #prg-wrapper-featured .p-grp-aaa h2 { /*margin-top:0; padding-bottom:7px; background-color:#F4F5F9;*/ } .prg-index #prg-wrapper-featured .prg-grp .p-grp-aaaa { /*background-color:#F4F5F9; background-image:url(f/bg-p-grp-aaaa.gif); background-position:center top; background-repeat:repeat-y;*/ } .prg-index #prg-wrapper-featured .prg-grp .p-grp-aaaa h2 { /*margin-top:0; padding-bottom:7px; background-color:#F4F5F9;*/ } .prg-index-b #prg-wrapper-featured .prg-grp .p-grp-aaaaaa { /*background-color:#F4F5F9; background-image:url(f/bg-p-grp-aaaaaa.gif); background-position:center top; background-repeat:repeat-y;*/ } .prg-index #prg-wrapper-featured .prg-grp .p-grp-aaaaaa h2 { /*margin-top:0; padding-bottom:7px; background-color:#F4F5F9;*/ } .prg-index-b #prg-wrapper-featured .prg-featured-lead .p-grp { /*background:none;*/ } .prg-index-b #prg-wrapper-featured .prg-featured-lead h2 .lead{ margin-left:65px; } /* SUBINDEX PAGES */ .prg-subindex #prg-wrapper-featured h2 { margin-bottom:10px; background:#FFF7EA; border: 1px solid #D10B96; } .prg-subindex #prg-wrapper-featured .p-grp-aaaaaa{ background:url(/staticarchive/bfc4359b1b24d07a47fcac4cb53fb63176b94a48.gif) 0 10px; } #prg-type-subindex ol.letter-nav{ height:2em; margin-bottom:10px; } #prg-type-subindex ol.letter-nav .letter, #prg-type-subindex ol.letter-nav .numbers{ display:inline; } #prg-type-subindex ol.letter-nav .letter a, #prg-type-subindex ol.letter-nav .numbers a, #prg-type-subindex ol.letter-nav span.unlinked{ font-size:1.2em; text-align:center; padding:5px 0; display:block; float:left; background:#fff; border-bottom:3px solid #990033; border-right:3px solid #CC0066; margin-right:4px; _margin-right:2px; width:27px; } #prg-type-subindex ol.letter-nav .z{ margin-right:0; } #prg-type-subindex ol.letter-nav .numbers a, #prg-type-subindex ol.letter-nav .numbers span.unlinked{ width:55px; } #prg-type-subindex ol.letter-nav span.unlinked, #prg-type-subindex ol.letter-nav .numbers span.unlinked{ background:#EDEDED; font-weight:bold; } #prg-type-subindex #numbers, #prg-type-subindex #letter-a, #prg-type-subindex #letter-b, #prg-type-subindex #letter-c, #prg-type-subindex #letter-d, #prg-type-subindex #letter-e, #prg-type-subindex #letter-f, #prg-type-subindex #letter-g, #prg-type-subindex #letter-h, #prg-type-subindex #letter-i, #prg-type-subindex #letter-j, #prg-type-subindex #letter-k, #prg-type-subindex #letter-l, #prg-type-subindex #letter-m, #prg-type-subindex #letter-n, #prg-type-subindex #letter-o, #prg-type-subindex #letter-p, #prg-type-subindex #letter-q, #prg-type-subindex #letter-r, #prg-type-subindex #letter-s, #prg-type-subindex #letter-t, #prg-type-subindex #letter-u, #prg-type-subindex #letter-v, #prg-type-subindex #letter-w, #prg-type-subindex #letter-x, #prg-type-subindex #letter-y, #prg-type-subindex #letter-z { float:left; } #prg-type-subindex .promo{ border:0; } #prg-type-subindex .p-grp-aaa .p-mod .promo{ padding:10px 7px; border-bottom:3px solid #990033; border-right:3px solid #CC0066; } #prg-type-subindex .prg-content #prg-wrapper-featured .p-grp{ } /* groups/'rows' of promos: */ .prg-subindex #prg-wrapper-featured .prg-grp .p-grp-aa { /*padding:0; margin-bottom:0; background-image: url(f/bg-p-grp-aa-vert.gif); background-position:center top; background-repeat:no-repeat;*/ } .prg-subindex #prg-wrapper-featured .prg-grp .nth-child-1 { } .prg-subindex #prg-wrapper-featured .prg-grp .nth-child-1 .p-mod .promo { } body.prg-subindex .prg-wrapper #vision-gallery-view ul#vision-gallery-grid li { /*width:139px;*/ } /* CONTENT PAGES */ .prg-content #prg-wrapper-featured .p-grp h2{ margin-bottom:10px; border-bottom:3px solid #990033; border-right:3px solid #CC0066; } .prg-content #prg-wrapper-featured .p-grp-a-composite h2{ border:none; } .prg-content #prg-wrapper-featured .prg-grp .p-grp h2{ /*background-image: url('f/bg-prg-grp-content.gif'); background-repeat: no-repeat; background-position: top center;*/ } .prg-content #prg-wrapper-featured .prg-grp .nth-child-1 { /*background:none;*/ } /* Cast List, or other key / value pairings */ .prg-content .p-keyvalue dl dt { /* n1 */ /*background-image: url('f/bg-prg-castlist.gif'); background-repeat: repeat-x; background-position: 0 80%;*/ } .prg-content .p-keyvalue dl dt span.keyvalue-key { /*background-color: #F7F7FF;*/ } /* Cast list, or other key-value pairing */ .prg-content .p-detail-list-style-1 { /* n1 */ /*padding: 10px 0;*/ } .prg-content .p-detail-list table td { /* n1 */ /*border-top: 1px solid #000000;*/ } .prg-content .p-detail-list table tr.first-row td { /* n1 */ /*border-top: 0px;*/ } /* Images */ .prg-content .p-image { /* n1 */ /*background-color: #E0E4E4;*/ } /* Pullquote */ .prg-content .p-pullquote { /*background-color: #000000; background-image: url(f/quote-open.gif); color:#FFFFFF;*/ } .prg-content .p-pullquote p.quote-text { /*background-image: url(f/quote-close.gif); color: #333333;*/ } .prg-content .p-pullquote p.quote-text a, .prg-content .p-pullquote p.quote-text a:link, .prg-content .p-pullquote p.quote-text a:visited, .prg-content .p-pullquote p.quote-text a:active { /*color: #333333;*/ } /* Webform */ #p-mod-webForm{ margin-left:160px; margin-right:10px; } #p-mod-webForm .p-form-text, #p-mod-webForm .p-form-radiogroup{ margin-bottom:10px; background:#ECE7ED; padding:5px; } #p-mod-webForm .p-form-text label{ display:block; width:240px; float:left; } #p-mod-webForm .p-form-buttons{ text-align:right; } #p-mod-webForm p{ background:transparent; margin-left:0; } .prg-content .p-form .p-form-text, .prg-content .p-form .p-form-textarea { /*background-color: #000000; color:#FFFFFF;*/ } .prg-content .p-form .p-form-radiogroup, .prg-content .p-form .p-form-checkgroup { /*background-color: #333333; color:#000000;*/ } /* Quiz */ .prg-content .p-quiz .p-quiz-question { /*background-color: #333333;*/ } /* =BESPOKE THEMES - system for styling selected content groups and children separately. Extending basic prg-grp, .p-grp, .p-mod and .promo selectors. --------------------------------------------- */ /* 'Super-group' (prg-grp) - use selectively where other styling solutions aren't available */ /* Theme 1 prg-grp */ .prg-wrapper .prg-grp-theme-1 { } /* Rows and their children These classes are applied to a parent row element (p-grp) They affect the row and the child elements too (p-mod, promo) via cascade. */ /* Rows and children - Theme 1 */ /* Theme 1 p-grp */ #prg-type-subindex .p-grp-theme-1 .promo .promoDetails { margin-top:3em; } .prg-wrapper .p-grp-theme-1 { background:#fff; border-right: 3px solid #CC0066; border-bottom:3px solid #990033; } .prg-wrapper .p-grp-theme-1 .p-mod{ width:148px; padding-left:10px; } .prg-wrapper .p-grp-theme-1 .p-mod img{ } /* Theme 1 p-mod */ .prg-wrapper .p-grp-theme-1 .p-mod { } /* Theme 1 promo */ .prg-wrapper .p-grp-theme-1 .promo { } /* Theme 1 p-mod-content */ .prg-wrapper .p-grp-theme-1 .p-mod-content { } /* Rows and their children - Theme 2 */ /* Theme 2 p-grp */ .prg-wrapper .p-grp-theme-2 { padding:10px 0; background:#fff url(/staticarchive/3a16dd2e39373000380c2602ed3d54932528ae82.gif); border-right: 3px solid #CC0066; border-bottom:3px solid #990033; } /* Theme 2 p-mod */ .prg-wrapper .p-grp-theme-2 .p-mod { } /* Theme 2 promo */ #prg-type-subindex .prg-wrapper .p-grp-theme-2 .promo { border:none; border-right:1px solid #c0c0c0; } #prg-type-subindex .prg-wrapper .p-grp-theme-2 .promo ol { display:block; } /* Theme 2 p-mod-content */ .prg-wrapper .p-grp-theme-2 .p-mod-content { } /* =VISIONAPPS - comments, galleries, uploader etc --------------------------------------------- */ /* Gallery */ body .prg-wrapper #vision-gallery-view ul#vision-gallery-grid li div { } /* Uploader */ body .prg-wrapper #vision-ugc-add { /*background-color: #333333;*/ } h2{ padding:6px 10px 10px 10px; font-family:Arial, Vedana, sans-serif; font-size: 1.3em; color: #333333; } h2.lead{ font-family:Arial, Vedana, sans-serif; font-size: 1.3em; color: #333333; } .nav-cat-episodes #prg-wrapper-featured .p-grp h2.decor1, .nav-cat-episodes #prg-wrapper-featured .p-grp h2.decor2 { border:none; line-height:0.6em; padding: 5px 0px 0px 0px; } h2.decor1, h2.decor2{ font-family: Arial, Verdana, sans-serif; display: block; } h2 span{ position: absolute; _position: inherit; _float: right; right: 25px; _right: 0px; font-size: 0.9em; _margin-top: -13px; _line-height: 1.2em; _z-index: 1; } .p-aps p, .p-aps span{ margin-left:10px; } .episode_name{ margin-left:-5px; padding-left:10px; background:url(/staticarchive/706b445748b4521f0019683da09cb8346fcd8814.gif) 0 2px no-repeat; } #prg-wrapper-extra .p-aps .iplayer_availability{ display:block; margin:5px 0 0 20px; padding-left:14px; background:url(/staticarchive/c93d8206cd0a43ab76df29c21e441f28bcdb6ba4.gif) 0 2px no-repeat; } .p-aps .iplayer_availability{ display:block; margin:auto; padding-left:14px; background:url(/staticarchive/c93d8206cd0a43ab76df29c21e441f28bcdb6ba4.gif) 0 2px no-repeat; } .nav-cat-artists .prg-featured-lead p{ margin:0 85px; } /*Carousel - Taken from Last Choir Standing - modified to fit with site. */ .carousel-container { background-color: transparent; padding: 0px 10px 0px 73px; position: relative; z-index: 0; margin: 0px 0px 40px 0px;} .carousel-container ul {border: 1px solid #D10B96;} .carousel-container ul li { background: #000000; width: 146px; height: 125px; margin: 0px 6px 0px 6px; float: left; position: relative; z-index: 1; color: #333333; font-size: 0.9em; padding: 0px 0px 10px 0px; text-align: center; border-left: 1px solid #D10B96; border-right: 1px solid #D10B96; line-height: 1.1em; } .carousel-container ul li img{ padding: 0px 0px 0px 0px; margin: 0px 0px 0px 0px; float: left; } .carousel-container ul li a { text-transform: normal; color: #506A8D; color: #fff; padding: 2px 0px 0px 0px;} .carousel-container ul li a:hover { color: #fff; text-decoration: none; } .carousel-container ul.visionAppsCarousel { width: 476px; height: 125px; overflow: hidden; position: relative; } .carousel-container ul.visionAppsCarousel li { top: 0px; } .carousel-container .caroursel-previous, .carousel-container .caroursel-next { width: 18px; height: 125px; background: #052a5c; display: block; position: absolute; top: 0px; z-index: 2; } .carousel-container .caroursel-previous span, .carousel-container .caroursel-next span { display: none; } .carousel-container .caroursel-previous { left: 55px; background: url('/staticarchive/8a4495314c69cb194db41bd5c3f2f61fd09a8439.gif'); border-left: 1px solid #D10B96; border-top: 1px solid #D10B96; border-bottom: 1px solid #D10B96; } .carousel-container .caroursel-next { right: 55px; background: url('/staticarchive/086a18c4e409c7ebca7317abf14fb9b8d24e7607.gif'); border-right: 1px solid #D10B96; border-top: 1px solid #D10B96; border-bottom: 1px solid #D10B96; } .carousel-container.caroursel-previous:hover.inactive, .carousel-container .caroursel-previous:focus.inactive, .carousel-container .caroursel-previous:active.inactive, .carousel-container .caroursel-previous.inactive { background: url('/staticarchive/11844c95216f58a1e3968a6c1e12c4117be5af20.gif'); cursor: default; border-left: 1px solid #D10B96; border-top: 1px solid #D10B96; border-bottom: 1px solid #D10B96; } .carousel-container .caroursel-next:hover.inactive, .carousel-container .caroursel-next:focus.inactive, .carousel-container .caroursel-next:active.inactive, .carousel-container .caroursel-next.inactive { background: url('/staticarchive/11844c95216f58a1e3968a6c1e12c4117be5af20.gif'); cursor: default; border-right: 1px solid #D10B96; border-top: 1px solid #D10B96; border-bottom: 1px solid #D10B96; } /*EMP Audio Styles*/ #emp-audio{ margin: 5px 5px 5px 8px; } .p-emp{ border-left: 1px solid #D10B96; border-right: 1px solid #D10B96; border-top: 1px solid #D10B96; width: 512px; } /*Image Styles*/ .item{ height:1%; overflow: hidden; margin: 0px 14px 0px 14px; padding: 14px 0px 7px 0px; border-bottom: 1px solid #D10B96; } .left{ float: left; padding: 1px; border: 1px solid #D10B96; display: block; margin: 0px 14px 14px 14px; } .right{ float: right; margin: 0px 14px 14px 14px; padding: 1px; border: 1px solid #D10B96; } .content h2{ margin: 0px 0px 0px 14px; padding: 7px 0px 7px 0px; line-height: 1.2em; } .content{ width: 330px; float: left; padding: 0px; margin: 0px; } .content p{ margin: 0px; padding: 0px; } .image-text{ width: 248px; margin: 0px 14px 0px 0px; float: left; } /*Form*/ form{ margin: 0px 14px; } form p{ margin: 0px; } .form-element{ margin: 2px 0px 5px 0px; } .form-element label{ width: 230px; display: inline-block; } input, select{ border: 1px solid #333333; background: #ffffff; color: #000000; padding: 1px; width: 180px; } #terms{ border: none; width: 50px; } radio{ border: 0px; } /*H3 Styles etc*/ .prg-featured-lead h3{ font-size: 1.2em; margin: 0px 10px 0px 10px; } .prg-featured-lead ol{ margin: 0px 14px 0px 14px; padding: 0px 14px 14px 14px; line-height: 1.2em; list-style: disc; } ul.videos{ width: 600px; overflow: hidden; display: block; margin:0px 50px; } ul.videos li{ width: 250px; display: inline-block; margin: 0px 5px 0px 5px; overflow: hidden; float: left; } ul.videos li img{ float: left; padding: 0px 7px 0px 0px; *padding: 0px 0px 0px 0px; margin: 5px 0px 5px 5px; } ul.videos li p{ padding: 10px 0px 0px 0px; } .bullet{ margin: 0px 0px 10px 10px; } .bullet li{ list-style: disc; margin: 0px 0px 0px 14px; } .form-area h3{ margin: 0px 0px 10px 0px; } .form-area p{ margin: 0px; padding: 0px; text-indent: 0px; } /*Homepage Panel*/ #features-panel {height:300px;width:622px;overflow:hidden;background-color:#FFF7EA;margin:0 0 10px 0; border: 1px solid #D10B96;} #features-panel img {border:0;} /* features panel nav list */ #features-panel ul#features-list, #features-panel #features-panes ul{ overflow:hidden; list-style:none; padding:0; margin:0; width: 622px; } #features-panel ul#features-list li, #features-panel ul li a { display:block; color:#9999FF; text-decoration:none; font-size: 1em; font-weight: bold; font-family: Verdana, Arial, Helvetica, sans-serif; text-align:center; padding:0; margin:0; cursor:pointer; overflow:hidden;} #features-panel ul#features-list li { width:153px; height:40px; border-top:4px solid #FFF7EA; float:left; margin:0 4px 0 0; padding: 10px 0px 0px 0px; clear:none; background:#DCE6E5; } #features-panel ul#features-list li:last-child { margin:0; width:151px; } #features-panel ul#features-list li { /*padding:1em .5em .5em .5em;*/ } #features-panel ul#features-list li a:hover{ } #features-panel ul#features-list li.selected {background:#FFF7EA;} #features-panel ul#features-list li.selected { border-top:4px solid #FFF7EA; height: 22px; border-bottom: 4px solid #D10B96; } /* features panel panes */ #features-panel #features-panes, #features-panel #features-panes ul, #features-panel #features-panes li {height:260px;width:622px;overflow:hidden;background-color:#ffffff;} #features-panel #features-panes {} #features-panel #features-panes ul {} #features-panel #features-panes ul li {position:relative;} #features-panel #features-panes ul li img {position:absolute;top:0;left:0;} #features-panel #features-panes ul li .player {position:absolute;top:-8px;left:0;width: 400px; height: 260px;} #features-panel #features-panes ul li .player p{ position:absolute; top:20px; left:2px; width: 370px; height: auto; background: #000000; filter:alpha(opacity=75); -moz-opacity:0.75; -khtml-opacity: 0.75; opacity: 0.75; color: #ffffff; font-weight: normal; font-size: 1.1em; padding: 5px 5px 5px 5px } #features-panel #features-panes ul li .player p a{ display: inline; background: none; padding: 0px; font-weight: bold; color: #f5f5f5; text-decoration: underline; } #features-panel #features-panes ul li .player p a:hover{ display: inline; background: none; padding: 0px; font-weight: bold; color: #f5f5f5; text-decoration: none; } #features-panel #features-panes ul li div { position:absolute; top:0; left:400px; width:225px; height:260px; background:#FFF7EA; color:#fff; overflow:hidden; padding:8px 0 0 0; } #features-panel #features-panes ul li div.wide { position:absolute; top:200px; left:0px; width:622px; height:60px; background:transparent url('/staticarchive/2b62e06b5504cc8736f0362040f68bde3cdffd09.png'); background: #FFF7EA; color:#fff; overflow:hidden; padding:7px 0 0 0; filter:alpha(opacity=96); -moz-opacity:0.96; -khtml-opacity: 0.96; opacity: 0.96; /*border-top: 4px solid #ffffff;*/ } #features-panel #features-panes ul li div h3, #features-panel #features-panes ul li div p, #features-panel #features-panes ul li div ul { margin:0 8px 0px 8px; padding:0; color:#333333; background:transparent; } #features-panel #features-panes ul li div h3 { font-size:1.4em; color: #333333; } #features-panel #features-panes ul li div h3 a{ color: #9999FF; text-align: left; font-family: arial, helvetica, sans-serif; } #features-panel #features-panes ul li div ul li, #features-panel #features-panes ul li div ul li a {width:auto;height:auto;background:transparent;} #features-panel #features-panes ul li div ul li a {display:inline;} #features-panel #features-panes ul li div p{ line-height: 1.3em; } #features-panel #features-panes ul li div p a{ color: #9999FF; text-decoration: none; font-weight: normal; background:transparent url(/staticarchive/a57383825eafa024ca4e306b6f46e69691d132c9.gif) no-repeat 0px 10px; padding: 5px 0px 5px 7px; text-align: left; line-height: 1.2em; font-family: arial, helvetica, verdana, sans-serif; } #features-panel #features-panes ul li div p a:hover{ text-decoration: underline; font-weight: normal; } #features-panel #features-panes ul li div.wide p a{ color: #9999FF; text-decoration: none; font-weight: normal; display: inline; margin: 0px; padding: 0px; background: transparent; } #features-panel #features-panes ul li div.wide p a:hover{ text-decoration: underline; font-weight: normal; } /* initial state */ #features-panel #features-panes ul li {position:absolute;left:-9999px;} #features-panel #features-panes ul li.show {position:relative;left:0;} /*Spacer*/ .spacer{ height: 50px; display: block; } .list{ margin: 0px 14px; } ul.audio-links, ul.video-links{ margin: 0px 55px; } ul.audio-links li h3, ul.video-links li h3{ padding: 0px; margin: 10px 0px 10px 0px; } ul.audio-links li a{ background: url('/staticarchive/ff2adb4087044f8895d6a774c5da91cd9d31a3ee.gif') no-repeat 0px 1px; padding:0px 0px 1px 21px; height:20px; font-weight: normal; display: inline; } ul.download-links{ margin: 0px 0px 0px 14px; } ul.download-links li a{ background: url('/staticarchive/738e7e0de2f0fc34164e2143db189e9d8ea03a6e.gif') no-repeat 0px 1px; padding:0px 0px 1px 21px; height:20px; font-weight: normal; display: inline; color: #003399; text-decoration: none; } ul.video-links li a{ background: url('/staticarchive/5e043466ab674814bcc455130c7253302434a1e7.gif') no-repeat 0px 1px; padding:0px 0px 1px 21px; height:20px; font-weight: normal; display: inline; } .listen-to-choirs{ width: 230px; height: auto; background: #ffffff; padding: 7px; font-size: 1.2em; position: absolute; top: 60px; left: 300px; border: 2px solid #D10B96; } #widget-box{ text-align: center; }