/* CSS generated by SiteManager at 02:22pm 15/04/2011 - do not edit this file directly */ /*----------------------------------------------------------------------------------------------------------------------------------------------------------- CSS for Churchill the Musical - Main Stylesheet Author: Alison Springall (alisonspringall@silktide.com) / Silktide Studios Created: 05/01/2011 -------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* Global Styles -------------------------------------------------------------------------------------------------------------------------------------------------------------- */ body { background-color: #fefad4; font: 80% georgia, "Times New Roman", Times, serif; text-align: center; padding: 0; margin: 0; } h1 { font-weight: bold; font-size: 2.2em; text-align: center; color: #000; padding: 0; margin: 15px 0; } h2 { font-weight: normal; font-size: 1.4em; color: #000; padding: 0; margin: 0 0 10px; } h3 { font-weight: normal; font-size: 1.2em; color: #000; margin: 10px 0; } h4 { font-weight: bold; font-size: 1.0em; color: #000; margin: 0; } p, li { font-size: 1.0em; line-height: 1.4em; color: #000; margin: 10px 0; } .smalltext { font-size: 0.85em; } .mediumtext { font-size: 1.25em; } .largetext { font-size: 1.5em; } a, a:visited { text-decoration: underline; color: #2929D5; } a:hover, a:active { text-decoration: none; color: #ff0000; } hr { height: 1px; background-color: transparent; color: #f7f5f2; padding: 0; border: 0; border-top: 1px solid #e8e8e8; margin: 15px 0; } img { border: 0; } form, table { background: transparent; font-size: 1.0em; } fieldset { border: 1px solid #b8b8b8; margin-bottom: 10px; } legend { font-size: 1.1em; color: #e86304; } .tablestyle { border-collapse: collapse; width:710px; } .tablestyle th { background-color: #EBEAE5; vertical-align: top; padding: 5px 5px 5px 0; } .tablestyle td { vertical-align: middle; padding: 5px 5px 5px 0; } .tableborder td, .tableborder th { vertical-align: middle; padding: 10px; border: 1px solid #e8e8e8; } .trackstable { margin-bottom:25px; } .trackstable .buybutton { width:122px; } .trackstable .playaudio { text-align:center; } .clear { height: 0; clear: both; font-size: 0.1em; line-height: 0.1em; padding: 0; margin: 0; } .right { float: right; } .left { float: left; } .centerimg { text-align: center; } .centerimg img { display: block; margin: 0 auto; } .widthwrapper { width: 100%; } .padding { padding: 20px; } /* Layout Styles -------------------------------------------------------------------------------------------------------------------------------------------------------------- */ #container { width: 100%; margin: 0 auto; } .fixedwrapper { width: 980px; position: relative; text-align: left; margin: 0 auto; } /* Header Styles -------------------------------------------------------------------------------------------------------------------------------------------------------------- */ #header { width: 960px; height: 95px; position: relative; z-index: 0; margin: 0 auto; } /* Banner Styles -------------------------------------------------------------------------------------------------------------------------------------------------------------- */ #banner { width: 100%; height: 126px; position: relative !important; z-index: 0; background: #000; margin: 0 auto; } #banner #sitelogo { position: absolute; top: -42px; left: 10px; z-index: 100; } #banner #rbl { width: 180px; position: absolute; top: 10px; right: 10px; } #banner #rbl p { float: left; font-size: 0.85em; text-align: right; color: #fff; margin: 0 5px 0 0; } #banner #rbl img { float: right; } #banner .bannerimg { margin-left: 190px; } /* Content Styles -------------------------------------------------------------------------------------------------------------------------------------------------------------- */ #content { width: 960px; text-align: left; padding: 0; margin: 0 auto; } .imagebottom #content { min-height: 350px; } #content .col { width: 260px; min-height: 170px; float: left; margin: 0 25px 0 0; } #content .widecol { width: 465px; min-height: 170px; float: left; margin-right: 25px; } #content .last { margin-right: 0!important; } #content .spacing { margin-right: 30px; } #home #content .col { margin-top: 30px; } .threecol #content .col { width: 300px; } .fourcol #content .col { width: 220px; } #content .col img, #content .widecol img { display: block; margin: 0; } #content .widecol h2 a, #content .widecol h2 a:visited { text-decoration: none; color: #272624; } #content .widecol h2 a:hover, #content .widecol h2 a:active { text-decoration: underline; } #content .contentimg { width: 220px; height: 160px; min-height: 160px; overflow: hidden; position: relative; padding: 0; margin-bottom: 20px; } #content .long { width: 220px; height: 300px; min-height: 300px; overflow: hidden; position: relative; padding: 0; margin-bottom: 20px; } #content .contentimg img { position: absolute; left: 0; top: 0; display: block; } #content .contentimg .imgframe { position: absolute; left: 0; top: 0; display: block; } #content #sponsors { width: 350px; padding-top: 250px; } #content #sponsors h2 { text-transform: uppercase; color: #000; } #content #sponsors .sponsorcol { width: 150px; min-height: 110px; float: left; text-align: center; margin: 0 12px 12px; } #content #sponsors .sponsorcol img { margin: 0 auto; } #content #sponsors #buynowbutton { position: absolute; top: 150px; right: -50px; } #content .gallery td { padding: 0 0 20px; } #content .gallery td img { padding: 2px; border: 1px solid #D5D5D5; margin-bottom: 5px; } #content .videothumb { float: left; margin: 10px 10px 10px 0; } #content .videothumb img { float: left; padding: 2px; border: 1px solid #D5D5D5; margin: 0 10px 0 0; } #content .videothumb p { margin: 0; } #content a.download, #content a.download:visited { width: 102px; height: 23px; display: block; background: transparent url(/templatefiles/download_button.jpg) no-repeat 0 0; font: bold 0.85em arial, verdana, helvetica, sans-serif; line-height: 24px; text-align: center; color: #000; } #content a.download:hover, #content a.download:active { background-image: url(/templatefiles/download_button2.jpg); } a.button_subscribe, a.button_subscribe:visited { width: 82px; height: 24px; display: block; background: transparent url(/templatefiles/btn_subscribe.jpg) no-repeat 0 0; font: bold 0.85em arial, verdana, helvetica, sans-serif; line-height: 24px; text-align: center; color: #000; } #home a.button_subscribe { position: absolute; right: 40px; top: 500px; } /* Booking Styles -------------------------------------------------------------------------------------------------------------------------------------------------------------- */ #booking fieldset { padding: 15px 15px; border: 1px solid #D5D5D5; } #booking legend { font-size: 1.4em; margin-bottom: 10px; } #booking td select { width: 420px; margin-bottom: 10px; } #booking td input { width: 415px !important; margin-bottom: 10px; } /* Buy Online Styles -------------------------------------------------------------------------------------------------------------------------------------------------------------- */ .merchandise { width: 290px; min-height: 450px; float: left; background-color: #fff; text-align: center; padding: 9px; border: 1px solid #e8e8e8; margin: 0 15px 15px 0; } .last { margin-right: 0; } .double { width: 615px; } .triple { width: 940px; margin-right: 0; } .merchandise .itemimg { border: 1px solid #e8e8e8; } .merchandise .label { width: 50px; text-align: right; padding-right: 10px; } .merchandise td select { width: 180px; } .merchandise .button { display: block; margin: 10px auto; } .merchandise .samples { width: 615px; float: right; border-collapse: collapse; margin-bottom: 22px; } .merchandise .samples td { text-align: left; padding: 0; } /* Sidecol Styles -------------------------------------------------------------------------------------------------------------------------------------------------------------- */ #sidecol { width: 380px; float: right; text-align: right; margin: 0 0 20px 20px; } #imgbot { width: 500px; height: 350px; position: absolute; bottom: 29px; right: 0; z-index: 2; background-repeat: no-repeat; background-position: bottom right; text-align: right; margin: 0; } #imgbot img { display: block; position: relative; z-index: -1;} /* Footer Styles -------------------------------------------------------------------------------------------------------------------------------------------------------------- */ #footer .fixedwrapper { width: 950px; text-align: right; border-top: 1px solid #ddd; } #home #footer .fixedwrapper { border-top: 0; } #footer p { font-size: 0.85em; margin: 10px 0; } /* Dropdown Styles -------------------------------------------------------------------------------------------------------------------------------------------------------------- */ #menu { height: 30px; position: absolute; top: -45px; right: 0; float: right; z-index: 500; font-size: 0.9em; list-style: none; padding: 0; margin: 0 0 0 0; } #menu li { float: left; font-weight: bold; line-height: 30px; padding: 0; margin: 0; } #menu li a { height: 30px; display: block; float: left; line-height: 30px; color: #272624; text-decoration: none; padding: 0 6px; } #menu table { width: 0; height: 0; position: absolute; top: 0; left: 0; border-collapse: collapse; } /* Default link styling */ /* Style the list OR link hover. Depends on which browser is used */ #menu li a:hover { z-index: 200; position: relative; background: #fff; color: #ff0000 !important; } #menu li:hover { position: relative; z-index: 200; background: #fff; color: #ff0000; } #menu li:hover > a { color: #ff0000; } #menu li:hover > a.sub { color: #ff0000; } #menu :hover ul { width: 150px; left: 0; top: 30px; background: #fff; } /* keep the 'next' level invisible by placing it off screen. */ #menu ul, #menu :hover ul ul { width: 0; height: 0; position: absolute; left: -9999px; top: -9999px; background: #fff; list-style: none; padding: 0; margin: 0; } #menu :hover ul :hover ul { width: 150px; height: auto; left: 150px; top: -1px; white-space: nowrap; z-index: 200; background: #fff; } #menu :hover ul li { background: #fff; font-weight: normal; border-top: 1px solid #e8e8e8; margin: 0; } #menu :hover ul li a { width: 130px; height: auto; line-height: 1.5em; color: #272624; padding: 5px 10px; } * html #menu ul li a { width: 150px; } #menu :hover ul :hover { color: #272624; } #menu :hover ul li.currentsub a { width: 130px; height: auto; line-height: 1.5em; color: #272624; padding: 5px 10px; } #menu :hover ul :hover ul li a { width: 130px; height: auto; line-height: 1.5em; color: #272624; padding: 5px 10px; } #menu :hover ul :hover ul :hover { color: #272624; } #menu :hover ul :hover ul li.currentfly a, #menu :hover ul :hover ul li.currentfly a:hover { color: #272624; } /* Homepage Styles -------------------------------------------------------------------------------------------------------------------------------------------------------------- */ body#home { background: #000 url(/templatefiles/home_bg.jpg) no-repeat center 221px; } #home #header #soundclip { text-align: right; padding-top: 5px; } #home #menu li a { color: #fff; } #home #menu li li a { color: #000; } #home #menu li:hover > a { color: #ff0000; } #home #menu li:hover > a.sub { color: #ff0000; } #home #banner { background: #b72323; } #home #content { min-height: 467px; } #home #content h1, #home #content p { display: none; } #home #content p#video { width: 358px; height: 47px; display: block; background: transparent url(/templatefiles/ctm-frame-home.png) no-repeat 0 0; font-weight: bold; font-size: 1.2em; text-align: center; text-decoration: none; padding: 5px 0 0; margin: 5px auto !important; } #home #content p#video a { text-decoration: none; } /* #home #content p#video { width: 350px; display: block; background-color: #fff; font-weight: bold; font-size: 1.2em; text-align: center; text-decoration: none; padding: 5px 10px; border: 1px solid #ff0000; margin: 5px auto !important; } #home #content p#video a { text-decoration: none; } */ #home #facebox .body { background: #000 url(/templatefiles/flag_bg.jpg) no-repeat center -3px; padding: 30px; } #home #facebox .footer { border-top: 0; } #home #facebox .close { width: 66px; height: 22px; display: block; background: #000 url(/templatefiles/closelabel.gif) no-repeat 0 0; margin: 0 auto; } #home #facebox .close img { display: none; }