/* ---------------------------------------------------------------- * FILE: style.css * ---------------------------------------------------------------- * Author: Dave Musgrove * Template: Oldham & Royton Harriers * ---------------------------------------------------------------- */ /* ---------------------------------------------------------------- * BODY * ---------------------------------------------------------------- */ html { font-size: 100%; } body { height: 100%; margin: 40px 0; padding: 0; font-family: Arial, Helvetica, sans-serif; } /* ---------------------------------------------------------------- * BODY > TEXT * ---------------------------------------------------------------- */ p { font-size: 13px; color: #000; margin: 0; } a { color: #900; text-decoration: none; } a:hover { color: #000; } img { border: 0; } img.right { margin: 5px 0 5px 10px; } img.left { margin: 5px 10px 5px 0; } h1, h2, h3, h4, h5, h6 { margin: 0 0 8px 0; font-family: Arial, Helvetica, sans-serif; color: #900; } h1 { font-size: 20px; margin: 20px 0; } h2 { font-size: 16px; margin: 20px 0 4px 0; color: #000; } h3 { font-size: 15px; } h4 { font-size: 14px; } h5 { font-size: 13px; margin: 15px 0 0 0; } h6 { font-size: 11px; margin: 0 0 5px; 0; } .news-text p { color: #900; } pre, code, blockquote { display: block; margin: 25px 0; padding: 15px; } blockquote { padding-top: 0; padding-bottom: 20px; } blockquote > div { padding: 1px; } blockquote p { margin-bottom: 0; } /* ---------------------------------------------------------------- * LAYOUT > CONTAINERS * ---------------------------------------------------------------- */ #wrap { width: 760px; margin: 0 auto; } #header { height: 103px; background: #900; } #content { margin: 0 0 40px 0; } #content2 { margin: 0 0 40px 0; background: url(../images/bg-map.png) no-repeat; height: 468px; padding: 0 0 0 400px; } #sponsors { height: 45px; margin: 0 0 10px 0; } #sponsors img { float: left; } #footer { border-top: 2px solid #900; padding: 5px 0; height: 20px; } #footer p { color: #666; font-size: 9px; margin: 0 0 8px 0; float: right; } #footer p a { color: #900; } #footer p a:hover { color: #000; } #footer p.copyright { float: left; } /* ---------------------------------------------------------------- * LAYOUT > MENU * ---------------------------------------------------------------- */ #menu { font-size: 12px; border-bottom: 1px solid #900; height: 35px; } #menu ul { padding: 0; margin: 10px 0px; width: 100%; } #menu ul li { display: inline; } #menu ul li a { padding: 3px 10px; color: #000; text-decoration: none; floar: left; border-right: 1px solid #900; font-weight: bold; } #menu ul li a:hover { background-color: #900; color: #fff; } #menu ul li a.last { border-right: #fff; } /* ---------------------------------------------------------------- * LAYOUT > TABLES * ---------------------------------------------------------------- */ #fixtures { width: 650px; border: 0; font-size: 12px; color: #000; font-weight: bold; } #fixtures tr td.event { border-right: 1px solid #900; width: 440px; padding: 5px 0; } #fixtures tr td.event a { color: #900; } #fixtures tr td.event a:hover { color: #000; } #fixtures tr td.details { width: 98px; padding: 5px 0; text-align: right; } #fixtures tr td.details a { color: #000; } #fixtures tr td.details a:hover { color: #900; } #fixtures tr td.results { width: 98px; padding: 5px 0; text-align: right; color: #e6b7ba; } #fixtures tr td.results a { color: #900; } #fixtures tr td.results a:hover { color: #000; } /* ---------------------------------------------------------------- * LAYOUT > NEWS * ---------------------------------------------------------------- */ .news-block { margin: 0 0 30px 0; } .news-block h2 { background: #a00; color: #fff; display: inline; padding: 6px 8px; font-size: 16px; } .news-block h3 { background: #000; color: #fff; display: inline; padding: 6px 8px; font-size: 16px; margin-left: -4px; } .news-block a h4 { background: #ddd; color: #a00; padding: 6px 8px; font-size: 11px; width: 100px; margin: 8px 0 0 0; } .news-block a:hover h4 { color: #fff; background: #000; } .news-block a h5 { background: #ddd; color: #a00; display: inline; padding: 6px 8px; font-size: 11px; width: 100px; margin: 8px 0 0 0; } .news-block a:hover h5 { color: #fff; background: #000; } .news-block p { margin: 10px 0 10px 0; color: #000; padding: 8px 8px; margin: 6px 0 -8px 0; } .news-block .data { background: #eee; } .news-block p a { color: #a00; font-weight: bold; text-decoration: underline; } .news-block p a:hover { color: #000; } .news-block2 { margin: 0 0 30px 0; } .news-block2 h2 { background: #a00; color: #fff; display: inline; padding: 6px 8px; font-size: 16px; margin-left: -4px;} .news-block2 h3 { background: #000; color: #fff; display: inline; padding: 6px 8px; font-size: 16px; } .news-block2 a h4 { background: #ddd; color: #a00; display: inline; padding: 10px 8px 8px 8px; font-size: 11px; width: 100px; margin: 8px 0 0 0; } .news-block2 a:hover h4 { color: #fff; background: #000; } .news-block2 p { margin: 10px 0 10px 0; color: #000; background: #eee; padding: 8px 8px; margin: 6px 0 -8px 0; } .news-block2 p a { color: #a00; font-weight: bold; text-decoration: underline; } .news-block2 p a:hover { color: #000; } .main-image { width: 320px; height: 227px; border: 1px solid #000; text-align: center; overflow: hidden; } .thumb-image { width: 100px; height: 71px; border: 1px solid #000; margin: 8px 8px 0 0; float: left; background-position: center center; background-repeat: no-repeat; } .thumb-btn { width: 100px; height: 71px; } #column01 { width: 420px; margin: 0 10px 0 0; float: left; } #column02 { width: 330px; float: left; padding: 55px 0 0 0; } .clear { clear: both; font-size: 0; line-height: 0; } /* _Gallery ==========================================*/ .thumb-pic { width: 160px; height: 120px; margin: 10px 10px 0 0; border: 3px solid #a00; float: left; background-color: #000; background-position: center center; background-repeat: no-repeat; overflow: hidden; } .thumb-pic img { width: 160px; height: 120px; } .albums { margin: 20px 20px 0 0; float: left; } /* _Lightbox ==========================================*/ #lightbox{ background-color:#eee; padding: 10px; border-bottom: 2px solid #666; border-right: 2px solid #666; } #lightboxDetails{ font-size: 0.8em; padding-top: 0.4em; } #lightboxCaption{ float: left; } #keyboardMsg{ float: right; } #closeButton{ top: 5px; right: 5px; } #lightbox img{ border: none; } #overlay img{ border: none; } #overlay{ background-image: url(../images/overlay.png); } * html #overlay{ background-color: #000; back\ground-color: transparent; background-image: url(../images/spacer.gif); filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../images/overlay.png", sizingMethod="scale"); }