/* CONTENTS 0. CONTENT CSS 1. FOOTER CSS 2. GALLERY CSS 3. HEADER CSS 4. HTML CSS 5. LAYOUT CSS 6. LEFT-COLUMN CSS 7. LIGHTBOX CSS 8. RIGHT-COLUMN CSS 9. ZZZ CSS Options for this file: ?debug=highlight, ?debug=files */ /******************************************************************************* 0. CONTENT CSS *******************************************************************************/ #content p, #content li { font-size: .9em; } #content .wrap-img { float: right; padding-top: 1em; } #content h2 { font-family: "Ravie", "Berlin Sans FB", "Cooper Black", "Elephant", "Arial Rounded MT Bold", sans-serif; font-size: 1.1em; font-weight: normal; padding: .25em 0; } #content h3 { font-family: sans-serif; font-size: 1em; font-style: italic; } #content h4 { font-family: "Ravie", "Berlin Sans FB", "Cooper Black", "Elephant", "Arial Rounded MT Bold", sans-serif; font-size: 1em; font-weight: normal; } #content .activity { margin: 0 0 1em 0; padding: .5em; } #content .activity h2 { background-color: #ff0; border: 1px solid #000; border-bottom: 0; color: #000; padding: .25em; margin: 0; width: 60%; } #content .activity p { margin-top: 0; } #content .activity .activity-content { background: #ccf url('/media/images/roundrect_bg.png') no-repeat scroll top right; border-bottom: 1px solid #000; border-left: 1px solid #000; padding: .25em; margin: 0; } #content .activity img { float: left; margin: 0 1em 0 0; } #content p.enquire { margin: 0 0 32px 0; } #content p.enquire a { background: transparent url('/media/images/enquire_bg.png') no-repeat scroll center center; color: #fff; display: block; float: right; height: 16px; line-height: 16px; text-align: center; width: 96px; } #content #main-activities { border-collapse: collapse; width: 100%; } #content #main-activities td { text-align: center; vertical-align: top; } #content #main-activities .images td img { float: none; height: 64px; margin: 0 auto; width: 100px; } #content #main-activities .titles td a { font-family: "Berlin Sans FB", "Cooper Black", "Elephant", "Arial Rounded MT Bold", sans-serif; color: #000; text-decoration: none; } #content p.error { color: #f00; font-weight: bold; } #content p.advisory { color: #f00; font-style: italic; } #content p.quote { color: #0049ff; font-weight: bold; } #content p.tip { border: 1px dashed #000; padding: 0.5em; background-color: #ddd; } /******************************************************************************* 1. FOOTER CSS *******************************************************************************/ #footer { background-color: #fff; color: #666; font-size: .8em; margin: 0; padding: 1em 0 1em 0; text-align: center; } #footer a { color: #555; } #footer p { margin: 0; } /******************************************************************************* 2. GALLERY CSS *******************************************************************************/ #gallery img { border: 0; margin: 0 auto; width: 200px; } /******************************************************************************* 3. HEADER CSS *******************************************************************************/ #header { background: transparent url('/media/images/header-top.png') no-repeat scroll top left; } #header h1 { visibility: hidden; height: 187px; margin: 0 0 .5em 0; padding: 0; } /******************************************************************************* 4. HTML CSS *******************************************************************************/ a:link, a:visited { color: #00f; } a img { border: 0; } body, html { font-family: "Liberation Sans", Arial, sans-serif; height: 100%; margin: 0; padding: 0; } body { background: #3a3a3a url('/media/images/bg.jpg') repeat-x scroll top center; } form input { margin: 0 .5em 0 0; vertical-align: middle; } /******************************************************************************* 5. LAYOUT CSS *******************************************************************************/ #wrapper { background: #fff url('/media/images/header-bottom.png') no-repeat scroll 0 187px; border-left: 1px solid #000; border-right: 1px solid #000; margin: 0 auto; min-width: 960px; width: 960px; } #header, #footer { clear: both; float: left; width: 100%; } #column-wrapper { height: 100%; height: auto !important; margin: 0 auto; min-height: 100%; } #left-column { float: left; padding: 0 10px; width: 220px; } #right-column { float: right; padding: 0 10px; width: 220px; } #content { padding: 10px; margin: 0 240px; } /******************************************************************************* 6. LEFT-COLUMN CSS *******************************************************************************/ #left-column { margin: -.5em 0 0 0; } #navigation, #helpful-stuff { border-left: 1px solid #000; border-right: 1px solid #000; } #left-column .menu-bottom { background: transparent url('/media/images/menu_bottom.png') no-repeat scroll bottom center; height: 12px; margin: 0 0 1em 0; } #left-column h2, #right-column .box h2 { background: transparent url('/media/images/menu_header.png') no-repeat scroll center center; color: #fff; font-size: 1.2em; height: 24px; margin: .25em 0 0 0; font-variant: small-caps; font-weight: bold; text-align: center; text-transform: lowercase; } #left-column ul { list-style-type: none; margin: 0 .5em; padding: 0 0 0 0; } #left-column ul ul { margin: 0; } #left-column ul a { background: transparent url('/media/images/menu_bg.png') repeat-x scroll top left; color: #fff; font-weight: bold; display: block; padding: .1em .5em; text-decoration: none; } #left-column ul a:hover, #left-column #current-nav { background: transparent url('/media/images/menu_hover_bg.png') repeat-x scroll top left; color: #fff; } #left-column #current-nav { font-weight: bold; } #left-column #current-subnav { color: #0049ff; } #left-column #current-subnav:hover { color: #fff; } #left-column #coverage { color: #fff; margin: 0 .5em; padding: .5em 0 1em 0; } #left-column #coverage ul { list-style-type: square; margin: 0 1em .5em 2em; } #left-column #coverage p { margin: 0 .5em; padding: 0 0 .5em 0; } /******************************************************************************* 7. LIGHTBOX CSS *******************************************************************************/ #lightbox{ position: absolute; left: 0; width: 100%; z-index: 100; text-align: center; line-height: 0;} #lightbox img{ width: auto; height: auto;} #lightbox a img{ border: none; } #outerImageContainer{ position: relative; background-color: #fff; width: 250px; height: 250px; margin: 0 auto; } #imageContainer{ padding: 10px; } #loading{ position: absolute; top: 40%; left: 0%; height: 25%; width: 100%; text-align: center; line-height: 0; } #hoverNav{ position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: 10; } #imageContainer>#hoverNav{ left: 0;} #hoverNav a{ outline: none;} #prevLink, #nextLink{ width: 49%; height: 100%; background-image: url(data:image/gif;base64,AAAA); /* Trick IE into showing hover */ display: block; } #prevLink { left: 0; float: left;} #nextLink { right: 0; float: right;} #prevLink:hover, #prevLink:visited:hover { background: url(/media/images/prevlabel.gif) left 15% no-repeat; } #nextLink:hover, #nextLink:visited:hover { background: url(/media/images/nextlabel.gif) right 15% no-repeat; } #imageDataContainer{ font: 10px Verdana, Helvetica, sans-serif; background-color: #fff; margin: 0 auto; line-height: 1.4em; overflow: auto; width: 100% ; } #imageData{ padding:0 10px; color: #666; } #imageData #imageDetails{ width: 70%; float: left; text-align: left; } #imageData #caption{ font-weight: bold; } #imageData #numberDisplay{ display: block; clear: left; padding-bottom: 1.0em; } #imageData #bottomNavClose{ width: 66px; float: right; padding-bottom: 0.7em; outline: none;} #overlay{ position: absolute; top: 0; left: 0; z-index: 90; width: 100%; height: 500px; background-color: #000; } /******************************************************************************* 8. RIGHT-COLUMN CSS *******************************************************************************/ #right-column { background-color: transparent; margin: 151px 0 0 0; } #right-column .box { background: #fff url('/media/images/box_bottom.png') no-repeat scroll bottom center; clear: both; color: #fff; margin: 0 0 1em 0; padding: 0 0 .75em 0; } #right-column .box a { color: #00f; } #right-column .box-content, #left-column #coverage, #left-column #on-tv { background: transparent url('/media/images/box_bg.jpg') repeat-x scroll top left; border-left: 1px solid #000; border-right: 1px solid #000; margin: 0 .5em; padding: .5em 0 0 0; } #left-column #on-tv { background: #fff; } #left-column #on-tv a img { display: block; margin: 0 auto; } #right-column .box-content { padding-bottom: .5em; } #right-column .box h2 { /* See LEFT COLUMN CSS */ } #right-column .box p, #right-column .box ul { font-size: .9em; margin: 0 .25em; padding: 0; } #right-column .box ul { list-style-type: none; margin: 0 1em; padding: 0; } #opening-times .day { display: block; float: left; width: 8em; } #map img { border: 1px solid #000; display: block; margin: 0 auto; } #welcome img { float: left; margin: 0 .5em 0 .5em; width: 32px; } #contact img { vertical-align: middle; } #right-column #twitter p { margin-bottom: .5em; } #on-the-web img, #twitter img { float: left; margin: 0 .25em; } #right-column #on-the-web p { margin: 0 0 .5em .25em; } #right-column .more-info { padding: .5em 0 0 0; text-align: right; } #right-column .more-info a, #contact a { text-decoration: none; } #right-column .more-info a:hover, #contact a:hover { text-decoration: underline; } /******************************************************************************* 9. ZZZ CSS *******************************************************************************/ #content .activity h2 { background: transparent url('/media/images/activity_header.png') no-repeat scroll top left !important; color: #fff !important; border: 0 !important; height: 32px !important; line-height: 24px !important; text-align: center !important; width: auto !important; } #content .activity-content { background-color: #fff !important; background-image: none !important; border: 0 !important; }