@charset "utf-8"; /* Yorkshire Bach Choir main.css _________________________________________________base elements, site-wide______________________________________________ */ body { font-size: 1 em; color: #000000; background-color: #FFFFFF; margin: 0px; padding: 0px; font-family: Verdana, Arial, Helvetica, sans-serif; } p { clear:left; font-size:small; } h1, h2, h3 { font-family: "Trebuchet MS", Helvetica, Arial, sans-serif; } h1 { color: #486292; } h4 { font-family: Geneva, Arial, Helvetica, sans-serif; color: #FFFFFF; background-color: #486292; margin-top: 2em; padding-top: 0.3em; padding-bottom: 0.3em; padding-left: 0.2em; font-size: small; } h6 { font-size:50%; } cite { color:#486292; font-weight: bold; font-style: normal; } strong { color: #999999; } strong.musicalwork { color: #333333; } #ataglance .concert em { color: #333333; } /*blockquote { font-style: italic; margin-left: 0px; color: #990000; width: 80%; margin-top: 0px; } /* ____________________________The masthead and navigation side bar #header, #nav and #content are siblings who inherit from the base declarations._______________________________*/ #header { margin-left: 0; margin-top: 0; } #nav { position: absolute; width: 220px; left: 0; top: 140px; background-image: url(../images/creamtex25.gif); padding-top: 15px; padding-left: 20px; padding-bottom: 10px; margin-bottom: 0px; height: 2500px; } #nav h1 { font-size: 100%; font-weight: bold } #nav ul { list-style-type: none; margin: 0px; padding: 0px; line-height: 150%; } #nav a:link { text-decoration: none; color: #486292; } #nav a:visited { text-decoration: none; color: #486292 } #nav a:hover { color: #333300; text-decoration: underline; } #nav_season { margin-top: 40px } #nav_season p { margin-top: 11px; font-size:70%; } #nav_season table { width: 98%; border-collapse: collapse; font-size: 70%; line-height: 180%; } #nav_ybc { line-height: 80%; margin-top: 50px; } #nav_ybc p { line-height: 45%; } #nav_ybc a { font-size: 70%; } /* _______________________________Styles for all content pages #content inherits from ______________________________________________________________________*/ #content { margin-left: 15px; float: left; padding-left: 240px; padding-bottom: 1em; width: 525px; } #content h1 { font-size: 120%; font-weight: bold; } #content h2 { font-size: 150%; font-weight: bold; /*margin-top: 0.9em;*/ color: #486292; } #content h3 { font-size: 110%; /*margin-top: 0px; /*margin-bottom: 0.2em;*/ color: #666666; } /*#content h5 { color: #000000; }*/ #content table { font-size: small; margin-left: 0px; } #content td { padding-right: 1em; vertical-align: text-top; } #content ul { line-height: 140%; font-size: 70%; list-style-type: none; padding-top: 0; padding-right: 0; padding-bottom: 1em; padding-left: 0; } #content ol { line-height: 140%; font-size: 70%; list-style-type: decimal; padding-top: 0; padding-bottom: 1em; padding-left: 145px; margin-right: 1px; margin-left: 1em; } #content p { line-height: 150%; } #content a:link, a:visited, a:hover, a:active { font-style: normal; text-decoration: none; color: #990000; } #content a:hover { text-decoration: underline; } .moreinfo { margin: 0px; padding-top: 0px; padding-right: 80px; padding-left: 0px; padding-bottom: 1em; } .abovemoreinfo { margin: 0px; padding-top: 1em; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; } /* ___________________________Section ids The ids that follow are all children of #content, siblings of each other__________________________ ____________________________Special styles for the 'At a glance' page___________________________________________________________*/ #ataglance table { padding-bottom: 0.7em; line-height:80%; } /*#ataglance h1 { margin-bottom: 0px; padding-top: 80px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; }*/ #ataglance p { margin-top: 0px; margin-right: 0px; margin-bottom: 1em; margin-left: 0px; width: 400px; } #ataglance h2 { font-size: 100%; margin-bottom: 0px; } #ataglance h3 { font-size: 100%; margin-top:0; } #ataglance h3 a:link, #ataglance h3 a:visited, #ataglance h3 a:hover, #ataglance h3 a:active { color: #666666; font-style: normal; text-decoration: none; } #ataglance h3 a:hover { text-decoration: underline; } #ataglance h2 a:link, #ataglance h2 a:visited, #ataglance h2 a:hover, #ataglance h2 a:active { color: #486292; font-style: normal; text-decoration: none; } #ataglance h2 a:hover { text-decoration: underline; } #photoheader { width: 540px; padding-left: 0px; margin-left: -15px; margin-top: -5px; } #photoheader_narrow { width: 350px; padding-left: 0px; margin-left: -15px; margin-top: -5px; float: left; margin-right: 1em; margin-bottom: 1em; } #photoheader_250 { width: 250px; padding-left: 0px; margin-left: -15px; margin-top: -5px; float: left; margin-right: 1em; margin-bottom: 1em; } #photoheader h6 { text-align:right; } #photofloat { width: 200px; padding-left: 0px; margin-left: 0px; margin-top: 0px; float: left; margin-right: 1em; margin-bottom: 1em; } /*___________________________________Special styles for the individual concert pages_________________________________________________________*/ #concertpage p { width: 450px; } #concertpage table { line-height:85%; } #concertpage cite { color:black; font-style:italic } #concertpage strong { color: #486292; } /* ________________________special table styles for the ticket prices__________________________________________________________ */ #tickets table { border-collapse: collapse; font-size: 70%; margin-bottom: 1em; border-bottom: 2px solid #486292; width:525px; } #tickets th, td { padding: 3pt; } #tickets th { background-image:url(../images/bluegradv.gif); background-repeat:repeat-x; border-bottom: 2px solid #486292; text-align:left; padding-left:1em; } #tickets td { background-image:url(../images/creamtex25.gif); background-repeat:repeat-both; } /* The ABC explanation has headers to the left of instead of above the data cells. This id is nested inside #tickets.*/ #ticket_abc th { vertical-align:middle; padding-right: 0.5em; padding-left: 0.3em; background-image:url(../images/bluegradh.gif); background-repeat:repeat-y; border-right: 2px solid #486292; } /* _______________________Picture frame for the map of St Mike's____________________________________________*/ #pictureframe { border:2px solid #486292; width:489px; height:420px; margin-top:10px } /* __________________________________________The Links list_______________________________________________*/ #links ul { line-height: 300%; font-size: 80%; padding-top: 0; padding-right: 0; padding-bottom: 1em; padding-left: 3em; } #links ul li { list-style-type: disc; color:#486292; } /*__________________________________________________Special styles for the Past Programmes page________________________________________________*/ #pastprogs table { border-collapse:collapse; font-size: 60%; margin-bottom:2em; padding-bottom:1em; } #pastprogs th { background-image:url(../images/bluegradv.gif); background-repeat:repeat-x; text-align:left; line-height:200%; padding-left:0.5em; padding-right 2pt; border-top:2pt solid #486292; background-color:#CCCCCC; } #pastprogs td { border-bottom: 1pt solid #CCCCCC; } /*________________________________________ Tweaks - Miscellaneous class styles____________________________________________________________*/ .concert { border-top-width: thin; border-top-style: solid; border-top-color: #666666; padding-top: 0.2em; padding-bottom: 0.4em; } .float-left { float: left; margin-right: 10px; margin-bottom:20px; } /*This, applied to h5, positions a caption 270 pixels from the top of an adjacent photo*/ .align-bottom { vertical-align:bottom; padding-top: 270px; } /*This style slightly enlarges the space above a subheading.*/ .subhead { margin-bottom:0; margin-top:2em; } /*The next two styles are a pair that remove the margin between two lines of text*/ .closeup-upper { margin-bottom:0; } .closeup-lower { margin-top:0; } .closeup-lower-notsoclose { margin-top:2; } /*.closeup-upper a:link, a:visited, a:hover, a:active { color:#FFFFFF; }*/ /*.red { color:#990000; } */ /*This inserts a hoizontal rule above the element it's applied to.*/ .horizontalrule { border-top: 2px solid #486292; margin-top: 10px; margin-bottom: 0px; margin-right: 20px; } .shrink60 { font-size: 60%; } .photinset { float: left; margin-top: 1em; margin-right: 1em; } .noclear { clear: none; } .clear { clear: both; } #videopage table { font-size: 60%; border-collapse: collapse; } #videopage th { text-align:left; } #videoplayer { width: 540px; margin-top: -5px; margin-left: -15px; padding-top: 0px; background-image: url(../images/creamtex25.gif); } #videopage h2 { font-size:110%; color:#660000; } .artists { color:#666633; } #videopage th { color:#999999; } #nav_new { margin-top: 30px; width: 195px; } #nav_new p { font-size: 70%; color:#66000: } .coltext { color:#486292; } #playvideo { margin-left: 40px; } .ends { font-size: 80%; }