/* CSS Document for FLYING HOUSE PRODUCTIONS */ /* http://www.flyinghouseproductions.com */ /* Created by PBDH : www.pbdh.com : December 2004 */ body#smc-2, body#swc-2, body#fhp-2, body#fhp-3, body#smc-3, body#swc-3 { margin: 0; padding: 0; text-align: center; background: #fff url(../images/framework/bg-wipe.gif) repeat-x left top; } body#home { margin: 0; padding: 0; text-align: center; background: #fff url(../images/framework/bg-home-wipe.gif) repeat-x left top; /* Hat Tip to www.squidfingers.com */ } /*-------------------------------------------------------------- PAGE LAYOUTS --------------------------------------------------------------*/ /* Body IDs define number of columns. EXAMPLE: smc-2 = Seattle Men's Chorus - 2 column smc-3 = Seattle Men's Chorus - 3 column */ /* ---===WRAPPERS===--- */ #wrapper { position: relative; margin: 0 auto; padding: 0; text-align: left; width: 780px; voice-family: "\"}\""; voice-family: inherit; width: 760px; } #wrapper-footer { position: relative; margin: 0 auto; padding: 0; height: 45px; /*background: #fff url(../images/framework/bg-footer.gif) repeat-x left top;*/ } /* ---===CONENT DIVS===--- */ #logo-fhp { position: absolute; top: 10px; left: 15px; width: 271px; margin: 0; padding: 0; } #logo-smc, #logo-swc { position: absolute; top: 0px; left: 16px; margin: 0; padding: 0; z-index: 99; } body#home #main-content { width: 760px; padding: 180px 0 0 0; clear: left; } body#fhp-2 #main-content, body#fhp-3 #main-content, body#smc-2 #main-content, body#smc-3 #main-content, body#swc-2 #main-content, body#swc-3 #main-content { width: 760px; padding: 179px 0 0 0; clear: left; } #home-wrap { margin: 3px 0 0 0; padding: 0; background: url(../images/framework/bg-twister-home.gif) no-repeat left top; /*height: 350px;*/ min-height: 350px; } body#smc-2 #smc-wrap { margin: 0; padding: 0; background: url(../images/framework/bg-wrap-smc.gif) repeat-y left top; } body#smc-3 #smc-wrap { margin: 0; padding: 0; background: url(../images/framework/bg-wrap-smc3.gif) repeat-y left top; } body#swc-2 #swc-wrap { margin: 0; padding: 0; background: url(../images/framework/bg-wrap-swc.gif) repeat-y left top; } body#swc-3 #swc-wrap { margin: 0; padding: 0; background: url(../images/framework/bg-wrap-swc3.gif) repeat-y left top; } body#fhp-2 #fhp-wrap { margin: 0; padding: 0; background: url(../images/framework/bg-wrap-fhp.gif) repeat-y left top; } body#fhp-3 #fhp-wrap { margin: 0; padding: 0; background: url(../images/framework/bg-wrap-fhp3.gif) repeat-y left top; } /*Homepage Columns*/ div#column1, div#column2, div#column3, div#column4, div#column1BTM, div#column2BTM, div#column3BTM, div#column4BTM { margin: 15px 0 0 0; padding: 6px; width: 175px; float: left; } div#column1BTM, div#column2BTM, div#column3BTM, div#column4BTM { background-color: #F5F5F5; padding: 3px; margin: 3px; } div#column1BTM2, div#column2BTM2, div#column3BTM2, div#column4BTM2 { height: 160px; text-align: center; background-color: #FFFFFF; position: relative; background-image: url(../images/twister_homeblock.png) ;} div#column1BTM2 img, div#column2BTM2 img, div#column3BTM2 img, div#column4BTM2 img { border: solid 1px #231F20; border-width: 0; } div#column1BTM2 p, div#column2BTM2 p, div#column3BTM2 p, div#column4BTM2 p, div#column1BTM2 a, div#column2BTM2 a, div#column3BTM2 a, div#column4BTM2 a { font-size: 8pt; } div#column1BTM2 p, div#column2BTM2 p, div#column3BTM2 p, div#column4BTM2 p { color: #231F20; } body#smc-2 #side-nav, body#smc-3 #side-nav { width: 200px; margin: 0; padding: 10px 20px 200px 20px; background: #7289a6 url(../images/framework/bg-sidenav-smc.gif) no-repeat right top; float: left; } body#swc-2 #side-nav, body#swc-3 #side-nav { width: 200px; margin: 0; padding: 10px 20px 200px 20px; background: #71904a url(../images/framework/bg-sidenav-swc.gif) no-repeat right top; float: left; } body#fhp-2 #side-nav, body#fhp-3 #side-nav { width: 200px; margin: 0; padding: 50px 20px 200px 20px; background: #b7b7b7 url(../images/framework/bg-sidenav-fhp.gif) no-repeat right top; float: left; } #wide-right { /*Use with a full-width right column */ width: 480px; padding: 20px; float: right; } #mid-column, #mid-columnYEL { width: 200px; padding: 20px; float: left; margin: 0; /*height: 16px;*/ } #mid-columnYEL { background-color: #FFFED4; } #far-right { width: 240px; padding: 20px; float: left; background-color: #FFFFFF; } #sub-column1, div.innercol01 /* The following two columns can float inside the wide-right column */ { width: 220px; float: left; } #sub-column2, div.innercol02 { width: 220px; float: right; } #footer { width: 760px; margin: 10px 0 0 0; padding: 0; text-align: left; } #footer img { vertical-align: middle; margin-left: 20px; } footer img a:hover { border: 0; cursor: default; } /*-------------------------------------------------------------- NAVIGATION --------------------------------------------------------------*/ /* ---===SUPER GLOBAL===--- */ #super-global { position: absolute; top: 15px; left: 505px; width: 250px; text-align: right; } #super-global ul { margin: 0; padding: 0; list-style-type: none; } #super-global ul li { color: #fff; color: #333333; margin: 0; padding: 0 0 5px 0; font-size: 11px; text-transform: uppercase; } /* ---===GLOBAL===--- */ #nav-global { position: absolute; top: 102px; left: 0px; width: 760px; height: 27px; text-align: right; } #nav-global ul { margin: 0; padding: 0 0 10px 0; list-style-type: none; } #nav-global ul li { margin: 0; padding: 0 10px 0 10px; display: inline; font-size: 11px; } #nav-global ul li#here { color: #fc0; color: #660000; background: url(../images/framework/img-fhpnav-bullet.gif) no-repeat 50% bottom; } /* ---===MAIN NAVIGATION TABS===--- */ #nav-fhp, #nav-smc, #nav-swc { position: absolute; margin: 0; padding: 0; width: 760px; height: 47px; top: 125px; left: 0px; z-index: 5; background-image: url(../images/framework/img-navbase-smc.gif); } /* -- use these with full navigation bar #nav-fhp { background: #eee url(../images/framework/img-navbase-fhp.gif) no-repeat left top; } #nav-smc { background: #eee url(../images/framework/img-navbase-smc.gif) no-repeat left top; } #nav-swc { background: #eee url(../images/framework/img-navbase-swc.gif) no-repeat left top; } */ /* -- use these with nav bar that has FHCS removed */ #nav-fhp { background: url(../images/framework/img-navbase-fhp.gif) no-repeat left top; } #nav-smc { background: url(../images/framework/img-navbase-smc.gif) no-repeat left top; } #nav-swc { background: url(../images/framework/img-navbase-swc.gif) no-repeat left top; } ul#tabs { height: 47px; width: 760px; margin: 0; padding: 0; list-style: none; } #tabs li { height: 47px; margin: 0; padding: 0; display: block; float:left; } #tabs img { border: none; } #tabs a { height: 47px; display: block; float: left; color: #fff; } li#tab-smc { width: 187px; } li#tab-swc { width: 204px; } li#tab-fhcs { width: 116px; } li#tab-se { width: 73px; } li#tab-csp { width: 93px; } li#tab-oe { width: 87px; } li#tab-ss { width: 87px; } li#tab-chorus-spacer { width: 225px; } li#tab-chorus-swc { width: 166px; } li#tab-chorus-smc { width: 166px; } * html a:hover { visibility: visible } #tabs li a:hover img { visibility: hidden; } #tabs li.here img { visibility: hidden; } /* ---===SIDE NAVIGATION===--- */ div#side-nav h2 { font-size: 13px; text-transform: uppercase; color: #fff; margin: 0; padding: 0; } div#side-nav h3 { font-size: 14px; color: #FFFED4; margin: 0; padding: 0; } div#side-nav ul { margin: 0 0 20px 0; padding: 8px 0; list-style-type: none; } div#side-nav ul li { margin: 0; padding: 0; font-size: 12px; } /*-------------------------------------------------------------- LINKS --------------------------------------------------------------*/ a:link { color: #33527e; text-decoration: underline; } a:visited { color: #039; text-decoration: underline; } a:hover { color: #ea8c2e; text-decoration: underline; } a:active { color: #900; text-decoration: underline; } #super-global li a:link, #super-global li a:visited { color: #ffd940; color: #660000; text-decoration: none; } #super-global li a:hover { color: #fff; color: #C0C0C0; text-decoration: none; } #nav-global li a { padding: 0 0 24px 0; } #nav-global li a:link, #nav-global li a:visited { color: #fff; color: #666666; text-decoration: none; } #nav-global li a:hover { color: #ffd940; color: #330000; text-decoration: none; } #nav-global li a.here { color: #ffd940; text-decoration: none; background: url(../images/framework/img-fhpnav-bullet.gif) no-repeat 50% bottom; } body#smc-2 div#side-nav a:link, body#smc-3 div#side-nav a:link, body#smc-2 div#side-nav a:visited, body#smc-3 div#side-nav a:visited, body#swc-2 div#side-nav a:link, body#swc-3 div#side-nav a:link, body#swc-2 div#side-nav a:visited, body#swc-3 div#side-nav a:visited { color: #ff9; text-decoration: none; } body#smc-2 div#side-nav a:hover, body#smc-3 div#side-nav a:hover, body#swc-2 div#side-nav a:hover, body#swc-3 div#side-nav a:hover { color: #ffd940; text-decoration: underline; } body#fhp-2 div#side-nav a:link, body#fhp-2 div#side-nav a:visited, body#fhp-3 div#side-nav a:link, body#fhp-3 div#side-nav a:visited { color: #333; text-decoration: none; } body#fhp-2 div#side-nav a:hover, body#fhp-3 div#side-nav a:hover { color: #900; text-decoration: underline; } ul#cal-list a:link, ul#cal-list a:visited { text-decoration: none; } ul#cal-list a:hover { text-decoration: underline; } #footer a:link, #footer a:visited { color: #666; text-decoration: none; } #footer a:hover { color: #7289A6; text-decoration: underline; } /*-------------------------------------------------------------- FORMATTING --------------------------------------------------------------*/ body { font-family: Tahoma, Verdana, sans-serif; } h1, h2, h3, h4, h5, h6 { font-family: Tahoma, Verdana, sans-serif; margin: .35em 0 .45em 0; font-weight: normal; } p { font-family: Tahoma, Verdana, sans-serif; font-size: 11px; color: #444; line-height: 18px; } li, dd, dt { font-family: Tahoma, Verdana, sans-serif; font-size: 11px; color: #444; line-height: 14px; margin-top: 4px; } p { margin: .35em 0 1em 0; } h1 { font-family: Georgia, "Times New Roman", Times, serif; font-size: 24px; text-transform: uppercase; color: #900; margin-bottom: .25em; } h2 { font-size: 14px; } /* Use h2 for multicolered headings : see classes below */ h3 { font-size: 14px; } /* Use h3 for traditional sub-heading */ h4 { font-size: 13px; } /* Use for Show Title */ h5 { font-size: 13px; } /* Use for Name with h6 */ h6 { font-size: 12px; } /* Use for Title with h5 */ h5 { font-weight: bold; color: #666; margin: 10px 0 1px 0; padding: 8px 0 0 0; } h6 { margin: 0; color: #888; } ul, ol { margin: .5em 0 .5em 1.5em; padding: 0; } dl { margin: 1.5em 0; } dt { font-weight: bold; margin: .25em 0 0 0; } dd { margin: 0; padding: .05em 0 .5em 0; line-height: 14px; } /*-------------------------------------------------------------- SPECIAL FORMATTING --------------------------------------------------------------*/ /*---===COLORED H2 CLASSES===---*/ /*Use in combination with spans to acheive black*/ h2 { font-family: Helvetica, Arial, sans-serif; margin: 0 0 10px 0; text-transform: uppercase; color: #222; } span.blue { color: #7289A6; } span.green { color: #71904A; } span.orange { color: #E48000; } span.red { color: #900; } span.purple { color: #A6A5D0; } span.grey { color: #666; } span.black { color: #000000; } span.gold { color: #E09A30; } p.lead { font-family: Georgia, "Times New Roman", Times, serif; font-size: 16px; line-height: 24px; color: #333; margin: 0 0 2.5em 0; } p.right { text-align: right; } p.date { font-size: 10px; text-transform: uppercase; color: #777; } div#footer p { font-size: 10px; color: #999; } div#letter-dennis img { margin: 0 5px 0 0; padding: 1px; border: 1px solid #fff; float: left; } div#letter-dennis h5 { font-family: Georgia, "Times New Roman", Times, serif; font-size: 14px; color: #fff; margin-bottom: 3px; } div#letter-dennis h6 { font-size: 12px; margin: 0; color: #333; } div#letter-dennis p { margin: 0; color: #fff; } div.show-listing { margin: 15px 0 15px 0; padding: 0; } div.show-listing h4, div.show-listing p { margin: 0 70px 0 0; padding: 0; } div.show-listing h4 { margin: 0 70px 0 0; font-size: 14px; color: #900; } div#raffle-fineprint p { color: #990000; } /*-------------------------------------------------------------- SPECIAL LIST STYLES --------------------------------------------------------------*/ ul#cal-list { /* For calendar listings */ margin: 0; padding: 0; list-style-type: none; } ul#cal-list li { width: 90%; margin: 0; padding: 2px 0 2px 0; border-bottom: 1px solid #999; } ul#cal-list li strong { margin: 0 10px 0 0; color: #333; } /*-------------------------------------------------------------- IMAGES --------------------------------------------------------------*/ img.main-image { border: 1px solid #ccc; padding: 5px; } div#banners img { margin: 0; padding: 0; border: 0; } img.right { margin: 0 0 5px 5px; float: right; clear: right; padding: 2px; border: 1px solid #ccc; } img.left { margin: 0 5px 5px 0; float: left; clear: left; padding: 2px; border: 1px solid #ccc; } img.poster { margin: 0 0 25px 0; padding: 10px; border: 1px solid #ccc; } /* _ LINER NOTES ___________________________________ */ body#linerBody { margin: 0; padding: 0; left: 0; top: 0; } #linernotes, #linernotesPop { border-bottom: solid 0px #00FF00; display: none; width: 100%; text-align: center; padding: 10px; } #linernotesPop { display: block; left: 0; top: 0; position: absolute; padding: 0; } #linerspacer, #linerspacerPop { height: 90px; min-height: 90px; } #linerspacerPop { height: 0px; min-height: 0px; } #linerblock { border: solid 4px #7D3134; background-color: #FFFFFF; height: 100%; padding: 20px; text-align: left; } #linerclose { float: right; margin-right: 10px; font-size: 10px; margin-top: -4px; } #linerclose img, #linercloseBTM img { vertical-align: middle; border-width: 0; } #linercloseBTM { text-align: center; margin-top: 30px; padding-top: 10px; font-size: 10px; border-top: solid 1px #900000; } #linertitle { margin-top: -8px; font-size: 18px; letter-spacing: .3em; border-bottom: solid 2px #636363; margin-bottom: 12px; } #linerCD { background-color: #FFFED4; padding: 10px; border: solid 1px #333333; height: 120px; min-height: 120px; } #linerCD img { margin-right: 10px; } #linerchorus, dt.linerchorus, dt.linerchorusB { border-bottom: solid 2px #7D3134; } dt.linerchorusB { width: 50%; } #linerblock dl { margin-right: 20px; margin-left: 12px; } div#linerblock dl dt { padding-left: 6px; } div#linerblock dl dd { margin-left: 20px; padding-bottom: 12px; line-height: 18px; } div#linerblock p.indent { text-indent: 2em; } div#trackcredits { margin-left: 10px; margin-right: 10px; border: solid 0px #FFCC00; border-bottom: solid 2px #900000; } div#trackcredits1 { margin-left: 10px; margin-right: 10px; border: solid 0px #FFCC00; border-bottom: solid 1px #900000; } div#trackcredits-B { margin-left: 10px; margin-right: 10px; } div#tracklistL { width: 320px; border: solid 0px #FF0000; padding-left: 10px; padding-right: 4px; margin-left: 6px; float: left; } div#tracklistR { width: 320px; border: solid 0px #00FF00; padding-left: 10px; padding-right: 4px; float: left; margin-left: 6px; } /* _ END LINER NOTES ___________________________________ */ .clearTOP { margin-top: 0; } .clearBTM { margin-bottom: 0; } .clearTB { margin-top: 0; margin-bottom: 0; } .offset20LR { margin-left: 20px; margin-right: 20px; } .offset10L { margin-left: 10px; } .offset12L { margin-left: 12px; } .offset20L { margin-left: 20px; } .offset20L10T { margin-left: 20px; margin-top: 10px; } .offset20LR10T { margin-left: 20px; margin-right: 20px; margin-top: 10px; } .offset20LRT { margin-left: 20px; margin-right: 20px; margin-top: 20px; } p.normalline { line-height: normal; } dt.padbtm03, li.padbtm03, dd.padbtm03, div.padbtm03 { padding-bottom: 3px; } li.padtop03, dt.padtop03, dd.padtop03, div.padtop03 { padding-top: 3px; } li.padtopbtm03, dt.padtopbtm03, dd.padtopbtm03, div.padtopbtm03 { padding-top: 3px; padding-bottom: 3px; } ul.padtopbtm03, ol.padtopbtm03, dl.padtopbtm03, div.offset03TB { margin-top: 3px; margin-bottom: 3px; } dt.padbtm06, li.padbtm06, dd.padbtm06, div.padbtm06 { padding-bottom: 6px; } li.padtop06, dt.padtop06, dd.padtop06, div.padtop06 { padding-top: 6px; } li.padtopbtm06, dt.padtopbtm06, dd.padtopbtm06, div.padtopbtm06 { padding-top: 6px; padding-bottom: 6px; } ul.padtopbtm06, ol.padtopbtm06, dl.padtopbtm06, div.offset06TB { margin-top: 6px; margin-bottom: 6px; } /* greys #464646 (edge - header bottom bar) #C3C3C3 (swirl - sidebar) #B7B7B7 (ground - sidebar) */ .ruleBTM, .ruleBTMpad03, .ruleBTMpad06 { border-bottom: solid 2px #333333; } .rule2BTM, .rule2BTMpad03, .ruleBTMpad06 { border-bottom: solid 2px #C3C3C3; } .ruleBTMpad03, .rule2BTMpad03 { padding-bottom: 3px; } .ruleBTMpad06, .ruleBTMpad06 { padding-bottom: 6px; } div.midcol_yellow { background-color: #FFFED4; } strong.UC { text-transform: uppercase; } .textLC, .mac { text-transform: lowercase; } /* this class is for developing use only - remove or rem out before uploading to live */ .box { border: solid 1px #FF0000; } #tourdates, #tourdatesCOL { border: solid 3px #222222; background-color: #FFFED4; background-color: #FFFFFF; width: 220px; padding: 10px; text-align: left; } #tourdates { display: none; z-index: 9999; position: absolute; left: -2000px; top: -2000px; } #tourdatesCOL { width: 174px; padding: 10px; text-align: left; margin-bottom: 20px; } #tourdates .dateline, #tourdatesCOL .dateline { color: #222222; } /*-------------------------------------------------------------- special stylesheets for ie5mac only note: this should be last in the stylesheet. --------------------------------------------------------------*/ /*\*//*/ div#column1, div#column2, div#column3, div#column1BTM, div#column2BTM, div#column3BTM { padding-top: 21px; } #wide-right { width: 470px; } #far-right { width: 230px; } /**/