/* Stylesheet The Magic Lantern Society - www.magiclantern.org.uk Author: Mark Butterworth Table of Contents 1. defaults 2. structure 3. links and navigationigation 4. accesskey navigation 5. fonts 6. images 7. forms 8. tables */ /* --------- 1. defaults  --------- */ #skipnavigation {/* skip-navigationigation container - hide off screen */ position: absolute; left: -12.5em} /*  --------- 2. structure  --------- */ #main { margin-left: 0.425em; padding: .5em; } #header_wrapper { width:100%; height: 6.625em; background: #c0c0c0; } #search_container { font-family: Arial, sans-serif; font-size: 100%; font-weight:bold; position:absolute; top: 5.6em; right: 19.5em; } #logo img { border: none; } #headerimage_container { position:absolute; top: 0; right: 0; } #footer { border-top: .0625em solid #000000; background: #c0c0c0; } .clearing { height: 0; clear: both; } #centred { text-align:center; } /* ================================================================  This copyright notice must be untouched at all times. The original version of this stylesheet and the associated (x)html is available at http://www.cssplay.co.uk/menus/doors_drop_line_three.html Copyright (c) 2005-2007 Stu Nicholls. All rights reserved. This stylesheet and the associated (x)html may be modified in any  way to fit your requirements. =================================================================== */ #navigation { margin:.375em 0 1.25em 0; float:left;  width:100%;  height:auto;  background:#f1f7fb url("bottom.gif") repeat-x bottom;  position:relative; } /* for IE7 only */ #navigation { margin-bottom: 2em; } #navigation .choice, #navigation .chosen { margin:0;  padding:0;  list-style:none;  display:block; } #navigation li { display:inline;  margin:0;  padding:0; height:auto; } #navigation .choice a, #navigation .chosen a { display:block;  height:1.7125em;  float:left;  background: url("left.gif") no-repeat left top;  padding:0 .375em 0 .1875em;  border-bottom:.0625em solid #000000;  text-decoration:none;  font-size:100%;  line-height:1.65em;  white-space:nowrap;  margin-left:.125em; } * html #navigation .choice a,  * html #navigation .chosen a { width:.0625em; } #navigation .choice a b,  #navigation .chosen a b { height:100%;  display:block;  background:url("right.gif") no-repeat right top;  padding:0 .475em 0 .475em;  color:#000000; font-weight:normal; } #navigation .choice a:hover,  #navigation .choice li:hover a { background-position:0 -4.875em;  border-color:#000000;  cursor:pointer; } #navigation .choice a:hover b,  #navigation .choice li:hover a b { background-position:100% -4.875em;  border-color:#000000;  color:#000000; } #navigation .sub { display:none; } /* for IE5.5 and IE6 only */ #navigation table { position:absolute;  border-collapse:collapse;  left:0;  top:0;  font-size:100%; } #navigation .chosen a { background-position:0 -4.875em;  border-color:#000000; } #navigation .chosen a b { background-position:100% -4.875em;  color:#0000ff; } #navigation .sub li a:hover,  #navigation .choice a:hover .sub li a:hover,  #navigation .choice li:hover .sub li a:hover { color:#000000;  text-decoration:underline; } #navigation .sub_active .chosen_sub a {  color:#0000ff;  text-decoration:none; } #navigation .sub_active .chosen_sub a:hover {  color:#0000ff;  text-decoration:none; } #navigation .sub_active a:hover { color:#000000;  text-decoration:underline; } #navigation .choice li a:hover .sub,  #navigation .choice li:hover .sub { display:block;  position:absolute;  width:64em; /* -- change this value to cover longest sub-menu  --*/ top:1.7125em;  left:0;  background:#c0c0c0;  margin-top:.0625em;  padding:0;  z-index:100;  border-bottom: 0.3875em solid #f1f7fb; } #navigation .sub,  #navigation .sub_active { margin:0;  padding:0;  list-style:none; } #navigation .sub_active { display:block;  position:absolute;  width:100%;  top:1.7125em;  left:0;  background:#c0c0c0;  margin-top:.0625em;  padding:0;  z-index:10;  color:#000000;  border-bottom:0.3875em solid #f1f7fb; } * html #navigation .sub_active, * html #navigation .choice a:hover .sub { z-index:-1;  margin-top:0;  } #navigation .sub_active a { height:1.5625em;  float:left;  text-decoration:none;  line-height:1.5em;  white-space:nowrap;  font-weight:normal; } #navigation .sub_active a,  #navigation .choice a:hover .sub li a,  #navigation .choice li:hover .sub li a { display:inline;  background:#c0c0c0 url("assets/pagelayout/separator.gif") top right no-repeat;  padding:.2em 1em; margin:0;  font-size:100%;  width:auto;  white-space:nowrap;  font-weight:normal;  border:0;  color:#000000;  height:1.5625em;  line-height:1.5em;  } /* -- Bottom navigationigation --*/ ul#bottom_navigation { margin:0 0 3.25em 0; list-style-type: none; background: #e0dbc5; float: left; width: 100%; } ul#bottom_navigation li { display: inline; } ul#bottom_navigation a { display: block; float: right; padding: .4em .6em; text-decoration: none; color: #000000; background: #e0dbc5; border-right: .0625em solid #ffffff; } ul#bottom_navigation a:hover { color: #000000; text-decoration: underline; } ul#bottom_navigation .picked a, ul#bottom_navigation .picked a:hover li a ul#bottom_navigation .picked li:hover li a { color: #0000ff; text-decoration:none; } /* ---------- 4. accesskey navigation ---------- */ #accessnav { color: #c0c0c0; font-size: .0625em; line-height: .0625em; background-color: #c0c0c0; } #accessnav a:link, #accessnav a:visited, #accessnav a:hover, #accessnav a:active { color: #c0c0c0; text-decoration: none; background-color: #c0c0c0; } /* ---------- 5. fonts ---------- */ html { font-family: Arial, sans-serif; font-size: 100%; } h1 {/* main heading */ font: normal 1.5em/1.1em Arial, sans-serif; margin-bottom: .625em; margin-top: .3125em; } h2 {   /* image captions */ font: bold 0.8em/1.0em Arial, sans-serif; margin-top: 0.55em; margin-bottom: .125em; color: #000000; text-align:center; } h3 { /* sub heading 3 */ font: 0.8em/1em Arial, sans-serif; } h4 { /* menu heading 1 */ font: 1em Arial, sans-serif; } h5 { /* sub heading 2 */ font: 1em Arial, sans-serif; } h6 { /* Main Menu label, positioned offscreen - for accessibility needs only */ position: absolute; left: -200em;  top:-20em; } P { /* normal text */ font: 1.05em/1.2em Arial, sans-serif; margin-bottom: 0.8em; } /* ---------- 6. images ---------- */ div.imagecaption_right { float: right; width: 17.5em; padding-bottom: .5em; } div.imagecaption_right img { margin-left: 1em; border: .0625em solid #000000; } div.imagecaption_left { float: left; width: 17.5em; padding-bottom: 0.5em; } div.imagecaption_left img { margin-left: 1em; border: .0625em solid #000000; } /* --------- 7. forms  --------- */ #contact-form label { float:left; width: 6.4em; margin-left: 1.2em; } #contact-form div { clear:left; margin: 0.4em 0 0.6em 0; } #contact-form fieldset { border: .0625em solid #92B8CE; } #contact-form legend { color: #000000; } #contact-form fieldset label { margin-left: 1.1em; } #contact-form .txt { width: 27.5em; border: .0625em solid #89B1CA; margin-left: 1.2em; } #contact-form textarea.txt { width: 28.2em; } #contact-form .btn { border: .125em solid #e0dbc5; background-color: #e0dbc5; color: #000000; padding: 0.4em; font-weight:bold; } #contact-form div.submit { text-align: center; } /* --------- 8. tables --------- */ table.srlist { border: 1px solid #737a80; border-collapse: collapse; } table.srlist th { border: 1px solid #737a80; background-color: #c0c0c0; padding: 0.2em; color: #000000; } table.srlist td { font: 0.9em Arial, sans-serif; padding: 0.2em; border: 1px solid #737a80; } table.srlist tr { background-color: #efefef; } table.srlist tr.evens { background-color: #cecece; } table.srlist tr:hover, table.srlist tr.hilite { background-color: #ffffff; color: #000000; } table.srlisthead { width: 99%; border: 1px solid #737a80; border-collapse: collapse; } table.srlisthead th { border: 1px solid #737a80; background-color: #c0c0c0; padding: 0.2em; color: #000000; } table.srlisthead td { font: 1.2em Arial, sans-serif; text-align:center; font-weight:bold; padding: 0.2em; border: 1px solid #737a80; } table.srlisthead tr { background-color: #efefef; } table.srlisthead tr.evens { background-color: #cecece; } .center {  text-align: center; } .center table {  margin-left: auto; margin-right: auto; text-align: left; } /* End */