/* */ /* add dummy class here for reddot css stripper issue */ .dummyLayout {} /* ______________________________________________________________________________ File: LAYOUT.CSS Description: Contains layout CSS code Created: 30/3/07 GraemeH Applies To: All pages Sections: PAGE WRAPPER - HEADER - PAGE BODY - HOME/LANDING PAGES - FOOTER - ______________________________________________________________________________ */ /*////////////////////// PAGE WRAPPER NOTES: Wrapper is used to set width within both header and main-body sections //////////////////////*/ body.fluid .wrapper { width:auto; min-width:770px; max-width:1100px; margin:0 auto; } /* NOTES: put position:relative on this and it causes problems with dd menus in IE6 The flexible width for IE6 is controlled in ie6.css */ body.fluid-small .wrapper { width:auto; min-width:320px; max-width:1100px; margin:0 auto; } body.fixed .wrapper { width:770px; margin:0 auto; } /* NOTES: put position:relative on this and it causes problems with dd menus in IE6 */ /*////////////////////// HEADER //////////////////////*/ #divHeader { background-color:#4C5F87; } #divHeader .wrapper { /* background:url("../images/bg/bg-header-bar.jpg") repeat-x; */ } #divHeader .open-decoration { background-image: url("bg-decorn-top-left.jpg"); background-repeat:repeat-y; } #divHeader .close-decoration { background-image: url("bg-decorn-top-right.jpg"); background-repeat:repeat-y; background-position:100% 0; padding:0 10px; } #divTopStrip { position:relative; width:100%; background:#000E31 url('bg-header-home.jpg') 100% 100% no-repeat; border-top:6px solid #FFBF00; height:110px; } body.banner-home #divTopStrip { background-image:url('bg-header-home.jpg'); } body.banner-aboutus #divTopStrip { background-image:url('bg-header-aboutus.jpg'); } body.banner-newsandevents #divTopStrip { background-image:url('bg-header-news.jpg'); } body.banner-thoroughbred #divTopStrip { background-image:url('bg-header-thoroughbreds.jpg'); } body.banner-harness #divTopStrip { background-image:url('bg-header-harness.jpg'); } body.banner-greyhound #divTopStrip { background-image:url('bg-header-greyhounds.jpg'); } body.banner-wagering #divTopStrip { background-image:url('bg-header-wagering.jpg'); } body.banner-racingclub #divTopStrip { background-image:url('bg-header-racingclub.jpg'); } #divLogo { float:left; width:260px; } #divHeaderMain { margin-left:280px; position:relative; top:0; color:#ddd; font-size:.75em; text-align:right; } #divHeaderMain .links-offset { width:320px; margin:6px 37px 0 auto; } #divHeaderMain .first { display:none; } #divHeaderMain a { color:#ddd; font-weight:normal; } #divSearch { position:absolute; right:5px; top:34px; color:#fff; width:300px; } #divSearch label { display:block; font-weight:normal; font-size:.85em; float:left; width:80px; margin:3px; text-align:right; } #divSearch .body { margin:0 15px 0 110px; } #q { width:134px; float:left; margin:5px 0 0 0; } #hypSearchGo { display:block; text-decoration:none; float:right; /* position:relative; top:-1px; */ } #hypSearchGo span { display:none; } #divTopStrip_Abbrev { padding:0; } #divTopStrip_Abbrev a { display:block; float:right; color:#fff; font-weight:normal; margin:0 12px 6px 12px; width:200px; text-align:right; padding:0 20px; text-decoration:none; background-image:url('icon-close-window.gif'); background-position:right; background-repeat:no-repeat; } /*////////////////////// PAGE BODY //////////////////////*/ #divMainBody.wrapper { background:url("bg-content-region-fade.gif") repeat-x; padding:0; } .home #divMainBody.wrapper, .landing #divMainBody.wrapper { background:url("bg-home-landing-contentfade.gif") repeat-x; } .home #divMainBody.wrapper { background-position:0 153px; } #divMainBody .open-decoration { background-image: url("bg-decorn-mid-left.jpg"); background-repeat:repeat-y; } #divMainBody .close-decoration { background-image: url("bg-decorn-mid-right.jpg"); background-repeat:repeat-y; background-position:100% 0; padding:0 10px; position:relative; } #divMainBody .content-offset { padding:0 15px 12px 15px; font-size:.85em; position:relative; border-top:1px solid #ccc; } .home #divMainBody .content-offset { border-top:1px solid #DEDEDE; } /* fluid width layout order */ .fluid #divMajor { margin:0 210px 0 0; padding:0 12px 0 0; } .fluid #divMinor { float:right; width:209px; padding-top:0 !important; padding-top:10px; position:relative; overflow:hidden; /* prevents oversize content from disrupting the layout */ } .stand-alone #divMajor { margin:0; padding:0 12px 0 0; } /*////////////////////// HOME/LANDING PAGES //////////////////////*/ #divFeatureImages { border-bottom:1px solid #fff; padding-bottom:10px; clear:both; position:relative; background:#FFBF00 url('bg-home-feature-strip.gif') repeat-x; } #divFeatureImages span { display:none; } #divFeatureImages .centre-box { width:750px; margin:0 auto; } h1.home-title, h1.landing-title { display:none; } /*////////////////////// FOOTER //////////////////////*/ #divFooter { } #divFooter .open-decoration { background-image: url("bg-decorn-mid-left.jpg"); background-repeat:repeat-y; } #divFooter .close-decoration { background-image: url("bg-decorn-mid-right.jpg"); background-repeat:repeat-y; background-position:100% 0; padding:0 10px; } #divFooter .main { background-color:#0B3856; font-size:.71em; color:#fff; padding:6px 10px; } #divFooter span.first { display:none; } #divFooter span.copyright { display:block; float:left; } #divFooter .links-cluster { float:right; width:50%; text-align:right; } #divFooter .links-cluster a { color:#fff; } /*////////////////////// SPECIALISED PAGES //////////////////////*/ /* redirect page main section formatting */ .redirect-main { margin:20px; border:1px solid #eee; } /*////////////////////// MENU STYLES //////////////////////*/ /* drop down menu list display */ #divMenuBar { width:100%; background-color:#0B3856; z-index:20; position:relative; top:0; left:0; } ul#nav { position:relative; top:0; left:0; } ul#nav, ul#nav ul { margin: 0; padding: 0; list-style:none; display:block; float:left; z-index:21; font-size:1em; } /* set the z-index of top level menu items so that they don't overlap when large text setting is used */ #liMH1 { z-index:36; } #liMH2 { z-index:35; } #liMH3 { z-index:34; } #liMH4 { z-index:33; } #liMH5 { z-index:32; } #liMH6 { z-index:31; } #liMH7 { z-index:30; } ul#nav li.top { position:relative; display:block; float:left; } /* NOTES: no width assigned - this allows it to be determined according to content */ ul#nav li.top .cleaner { /* IE6 Bug */ width:1em; } ul#nav li a.top { position:relative; display:block; /* no float for FireFox, IE7+ */ float:none !important; float:left; padding:.25em .75em .25em .75em; font-size:1.05em; color:#fff; line-height:1.5em; text-decoration:none; /* IE6 Bug */ border-right:0; background:#0B3856 url('bg-menu-edge.gif') repeat-y; } ul#nav li a.first-top { background-image:none; } ul#nav li.selected a.top { background-color:#567; } ul#nav li a.top:hover, ul#nav li:hover a.top, ul#nav li.over a.top, ul#nav li.selected a.top:hover { background-color:#708698; text-decoration:none; } /* --- DROP DOWNS --- */ ul#nav li ul { display:none; position:absolute; left:0; top:2.05em; width:10em; border-top:1px solid #ccc; } ul#nav li ul li { position: relative; display:block; width:100%; float:left; } ul#nav li>ul { top:auto; left:auto; } ul#nav li li a, ul#nav li li a:hover { display:block; text-decoration:none; color:#fff; padding:.25em; font-size:.85em; border:1px solid #ccc; background-color: #0B3856; border-top:0; } ul#nav li li a:hover { background-color:#708698; } ul#nav li:hover ul, ul#nav li.over ul { display:block; } /* The magic */ /*////////////////////// NAVIGATION ITEMS //////////////////////*/ #divBreadcrumb { padding:5px 0; } #divBreadcrumb a { } #divSubNavGroup_divs { border:1px solid #DD7A00; position:relative; margin-top:10px !important; margin-top:6px; overflow:hidden; } #divSubNavGroup_divs h3 { margin:0; padding:4px 0 4px 6px; background-color:#DD7A00; color:#fff; font-weight:600; position:relative; font-size:1.1em; } #divSubNavGroup_divs div.link-group { margin:0; padding:0; position:relative; list-style-type:none; } #divSubNavGroup_divs div.sub-nav-set { font-size:.95em; } #divSubNavGroup_divs div.link-group div#divFirstSubNavItem { border-top:0px; /* here because of irrational IE bug */ } #divSubNavGroup_divs div.link-group div.item { padding:0px; margin:0; border-top:1px solid #fff; display:block; position:relative; overflow:hidden; width:100%; } #divSubNavGroup_divs div.link-group div.item a { display:block; background-repeat:no-repeat; background-position:5px .5em; text-decoration:none; } #divSubNavGroup_divs div.link-group div.item a:hover { text-decoration:underline; } /* hierarchy - current page link background image */ #divSubNavGroup_divs div.link-group div.current { background-image:url('bg-stripe-rhnav-level1.gif'); background-position:2px 0; background-color:#4F5C6B; } #divSubNavGroup_divs div.link-group div.link-group div.current { background-image:url('bg-stripe-rhnav-level2.gif'); background-color:#B1B7BD; /* border-top:1px solid #fff; */ } #divSubNavGroup_divs div.link-group div.link-group div.link-group div.current { background-image:url('bg-stripe-rhnav-level3.gif'); background-color:#D8DBDE; } /* hierarchy - current page link arrow and offset */ #divSubNavGroup_divs div.link-group div.current .curr-page-link { font-weight:bold; color:#fff; display:block; padding:2px 0 2px 6px; background-repeat:no-repeat; background-position:5px .6em; } #divSubNavGroup_divs div.link-group div.link-group div.current .curr-page-link { padding-left:20px; background-image: url('arr-blue-tri-sml.xprnt.gif'); color:#13568E; } #divSubNavGroup_divs div.link-group div.link-group div.link-group div.current .curr-page-link { padding-left:34px; background-image:url('arr-tri-orange-sml-xprnt.gif'); background-position:19px .6em; } #divSubNavGroup_divs div.link-group div.link-group div.link-group div.link-group div.current .curr-page-link { padding-left:48px; background-image:url('arr-tri-orange-sml-xprnt.gif'); background-position:33px .6em; } /* hierarchy - background colouring */ #divSubNavGroup_divs div.link-group { background-color:#63859E; /* #5F8CA0; /* #7A96AF; /* #54809E; /* #8BA3B9; */ } #divSubNavGroup_divs div.link-group div.link-group { background-color:#DDE5EB; } #divSubNavGroup_divs div.link-group div.link-group div.link-group { background-color:#EEF1F5; } #divSubNavGroup_divs div.link-group div.link-group div.link-group div.link-group { background-color:#fff; } /* hierarchy - link colouring and offset */ #divSubNavGroup_divs div.link-group a { color:#fff; padding:2px 2px 2px 6px; } #divSubNavGroup_divs div.link-group div.link-group a { color:#13568E; padding:2px 2px 2px 20px; background-image: url('arr-blue-tri-sml.xprnt.gif'); } #divSubNavGroup_divs div.link-group div.link-group div.link-group a { padding:2px 2px 2px 34px; background-image: url("arr-tri-orange-sml-xprnt.gif"); background-position:20px .5em; } #divSubNavGroup_divs div.link-group div.link-group div.link-group div.link-group a { padding:2px 2px 2px 48px; background-image: url("arr-tri-orange-sml-xprnt.gif"); background-position:34px .5em; } .navlinks-end { /* IE blends the end of the list with the next div - this separator stops it... */ height:1px; clear:both; width:100%; font-size:0; line-height:0; padding:0; margin:0; } /* add dummy class here for reddot css stripper issue */ .dummyData {} /* ______________________________________________________________________________ File: DATA.CSS Description: Contains generic CSS for formatting site data sections Created: 30/3/07 GraemeH Applies To: All pages Sections: GLOBAL/DATA STYLES FORM STYLES GENERIC/UTILITY STYLES ______________________________________________________________________________ */ /*////////////////////// GLOBAL/DATA STYLES //////////////////////*/ /* --- content channels --- */ .box,.embedded { position:relative; margin:10px 0; background-color:#fff; border:1px dotted #aaa; padding:1px; width:auto; } .embedded { border:0; padding:0; } .box h2.header { padding:4px 15px 2px 6px; position:relative; background:#7D9EB6 url('bg-channel-header.gif') repeat-y; color:#fff; margin:0; } #divMinor .box h2.header { background:#7D9EB6 url('bg-channel-header-minor.gif') repeat-y; /* shorter gradient required for RH channels */ } body.content #divMinor .box h2.header { font-size:1.25em; color:#666666; } .box a.header, .box span.header { /* view all link */ color:#fff; display:block; width:6em; position:absolute; right:6px; top:4px; padding:2px 26px 2px 0; text-decoration:none; background:url('arr-red-bluebg-major.gif') no-repeat right; margin:1px; text-align:right; } #divMinor .box a.header { background-image:url('arr-red-bluebg-minor.gif'); } .box .main-body { position:relative; padding:6px; } .box .main-body .more-link { font-style:italic; } .box .linked-image-set a { display:block; margin:0 0 6px 0; } body.content #divMinor .box .header { background:#E0E0E0 none; /* channels on RH side for content page have grey header box */ } .landing-feature { position:relative; margin:10px 0; background-color:#000E31; background-image:url('bg-landing-feature.gif'); } /*--- news listing ---*/ .news-list h4 { float:right; color:#999; font-weight:normal; font-size:.95em; width:125px; text-align:right; } .news-list h3 { position:relative; background-repeat:no-repeat; background-position:left; padding:2px 0 2px 35px; margin-right:135px; } .news-list h3.corporate { background-image:url('icon-code-corporate-med.gif'); } .news-list h3.thoroughbred { background-image:url('icon-code-thoroughbred-med.gif'); } .news-list h3.harness { background-image:url('icon-code-harness-med.gif'); } .news-list h3.greyhound { background-image:url('icon-code-greyhound-med.gif'); } .news-list h3.wagering { background-image:url('icon-code-wagering-med.gif'); } .news-list p.body { display:block; padding:0; clear:both; } /*--- events listing - brief format (as used on landing pages) ---*/ .events-list-brief { /* see ie6.css */ } .events-list-brief h3 { float:left; padding:0 0 0 2.95em; margin:0; font-weight:normal; font-size:1em; width:9.25em; background-repeat:no-repeat; /* border:1px solid #fff; clear:left; */ } /* common icons for std list and list-brief */ .events-list h3.corporate, .events-list-brief h3.corporate { background-image:url('icon-code-corporate-med.gif'); } .events-list h3.thoroughbred, .events-list-brief h3.thoroughbred { background-image:url('icon-code-thoroughbred-med.gif'); } .events-list h3.harness, .events-list-brief h3.harness { background-image:url('icon-code-harness-med.gif'); } .events-list h3.greyhound, .events-list-brief h3.greyhound { background-image:url('icon-code-greyhound-med.gif'); } .events-list h3.wagering, .events-list-brief h3.wagering { background-image:url('icon-code-wagering-med.gif'); } .events-list-brief p.body { /* venue */ display:block; padding:0; margin:0 0 0 13em; } .events-list-brief .spacer { margin:0; height:5px; padding:0; line-height:0; font-size:0; clear:both; } /*--- events listing - summary format ---*/ .events-list { /* see ie6.css */ } .events-list h3 { padding:0 0 0 35px; margin:4px 0 7px 0; background-repeat:no-repeat; /* border:1px solid #fff; clear:left; */ } .events-list h4 { padding:0 0 0 35px; margin:0; width:auto; font-size:1em; background-repeat:no-repeat; /* border:1px solid #fff; clear:left; */ color:#666; } .events-list p.body { /* venue */ display:block; padding:0; margin:0 0 0 35px; clear:both; color:#666; } .events-list .spacer { margin:0; height:5px; padding:0; line-height:0; font-size:0; clear:both; } .events-list em { /* display:block; float:left; clear:right; padding:0; margin:0; */ } /*--- formatted lists ---*/ ul.bullets, ul.bullets-tri, ul.links, ul.std-icons { padding:0; margin:0; list-style-type:none; } ul.bullets li, ul.bullets-tri li, ul.links li { padding:0 0 0 10px; margin:0; position:relative; background-position:0 3px; background-repeat:no-repeat; clear:both; } ul.bullets li { background-image:url('bullet-sq-orange-sml.gif'); background-position:0 8px; } ul.bullets-tri li { background-image:url('arr-blue-tri-sml.gif'); } ul.links li { background-image:url('arr-blue-tri-sml.gif'); } ul.std-icons li { display:block; padding:2px 0 2px 20px; margin:0; position:relative; background-position:0 3px; background-repeat:no-repeat; clear:both; } ul.std-icons li.gallery { background-image:url('icon-gallery-small.gif'); } ul.std-icons li.video { background-image:url('icon-video-small.gif'); } ul.std-icons li.audio { background-image:url('icon-audio-small.gif'); } ul.std-icons li.internal { background-image:url('icon-internal-link-small.gif'); } ul.std-icons li.external { background-image:url('icon-external-link-small.gif'); } ul.indent { margin-left:8px; } .contact { } .contact h3 { padding:0; margin:4px 0 !important; font-size:1em; line-height:.5em; } .contact p { padding:0; line-height:1em; margin:4px 0 12px 0; } /*--- formatted tables ---*/ table.layout { border-collapse:collapse; } table.layout td { vertical-align:top; padding:3px; } table.layout td p { margin-top:0; margin-bottom:4px; padding:0; } table.layout th { vertical-align:top; padding:3px; } table.layout th.row { text-align:right; } table.layout th.contact-label { width:8em; } table.tbl-data-std { border-collapse:collapse; width:auto; margin:1px; } /* --- row and cell headers --- */ table.tbl-data-std .rowHeader td, table.tbl-data-std td.cellHeader, table.tbl-data-std td.cellSubHeader { vertical-align:top; background-color:#777; color:#fff; font-weight:bold; } table.tbl-data-std td.cellHeader, table.tbl-data-std td.cellSubHeader { text-align:right; white-space:nowrap; background-color:#13568E; /* #7D9EB6; */ } table.tbl-data-std tr td.cellSubHeader, table.tbl-data-std tr.alt td.cellSubHeader { background-color:#F0C691; color:#000; } table.tbl-data-std tr.alt td { background-color:#eef; } table.tbl-data-std td { vertical-align:top; padding:2px 8px; } table.tbl-data-std td.num-data { text-align:right; } table.tbl-data-std td.str-data { text-align:center; } table.tbl-data-std td.gen-data { text-align:left; } table.tbl-data-std .rowSeparator { background-color:#ddd; color:#333; } .info-page-updated { color:#666; font-size:.9em; } .paging-control { background-color:#eee; padding:4px 0 0 0; } .page-list { margin:4px; border:5px solid #eee; } .page-list a { border: 1px solid #aaa; padding:4px; } .page-list strong { border: 1px solid #000; background-color:#708698; padding:3px; color:#fff; } /* selected page */ .paging-control option { padding-right:3px !important; } /* fix error in Firefox */ h1 span.date { float:right; color:#999; font-weight:normal; font-size:.7em; margin-top:3px; } .img-holder { display:block; text-align:center; } .img-holder img, .img-holder object { display:block; margin:0 auto; } /* flash */ .img-holder h4 { font-style:normal; color:#555; font-weight:normal; font-size:0.9em; text-align:center; line-height:1em; } .gallery-holder { } .gallery-holder .img-holder { display:block; float:left; width:111px; margin:5px; border:1px dotted #aaa; background-color:#eee; } .gallery-holder .img-holder .img-body { display:block; height:105px; } .gallery-holder .img-holder h4 { margin:0 auto; border-top:1px dotted #aaa; background-color:#ccc; padding:5px; color:#555; font-weight:normal; height:42px; overflow:hidden; } .links li span.descr { font-style:italic; color:#777; } /*--sitemap--*/ .sitemap ul { padding:0; margin:2px 10px 2px 15px; list-style-type:none; } .sitemap li { padding:0 0 0 15px; margin:0; position:relative; background-position:0 5px; background-repeat:no-repeat; clear:both; background-image:url('arr-blue-tri-sml.gif'); } /*-- search--*/ .search-results { } .search-results .score { display:block; float:right; color:#999; font-style:italic; width:85px; margin-top:5px; } .search-results h4 { background-position:0 0; margin:10px 85px 0 0; } .search-results p { clear:both; margin:3px 0 0 0; } .search-results .highlight { color:#f00; font-weight:bold; } .search-results a.link { display:block; padding:0 0 0 10px; margin:0; position:relative; background-position:0 5px; background-repeat:no-repeat; clear:both; background-image:url('arr-blue-tri-sml.gif'); font-style:italic; } .search-results p.intro { font-style:italic; color:#666; } /*////////////////////// FORM STYLES //////////////////////*/ form.form-std { margin:6px 0 0 0; padding:6px; } form.form-std .warning-box { background-color:#ffffcc; padding:1em; border: #75736E solid 1px; position:relative; } .form-std .field { margin:10px 0 0 0; clear:both; width:100%; } .form-std label { width:12em; display:block; float:left; font-weight:bold; text-align:right; margin:0 1em 10px 0; clear:both; } .form-std .input-text { float:left; } .form-std .input-submit { margin-left:13em; clear:both; } .form-std fieldset { border: #aaa solid 1px; } .form-std fieldset legend { background:#13568E; border:#aaa solid 1px; padding:1px 10px; margin:0 10px; color:#fff; } #paraWarningMsg { display:none; } /*////////////////////// GENERIC/UTILITY STYLES //////////////////////*/ hr.sepr { border-top:1px dotted #aaa; color:#fff; height:0; border-bottom:0; } .extent { position:relative; width:100%; padding:0; overflow:hidden; } /* NOTES: used to hide content that is too wide */ .align-left { text-align:left; } .align-right { text-align:right; } .align-center, align-centre { text-align:center; } img.align-left { float:left; margin-right:10px; position:relative; margin-top:4px; } img.align-right { float:right; margin-left:10px; position:relative; margin-top:4px; } .indent { margin-left:10px !important; } .indent .indent { margin-left:20px !important; } .indent .indent .indent { margin-left:30px !important; } .margin-top-none { margin-top:0 !important; } .cleaner { font-size:0; line-height:0; height:0; clear:both; } .jolt-left { float:left; width:100%; position:relative; padding:0; margin:0; overflow:hidden; } .jolt-right { float:right; width:100%; position:relative; padding:0; margin:0; overflow:hidden; } .width-entry-field { } .height-1 { height:1px } .height-spacer { height:10px; } .height-spacer-sml { height:5px; } .float-left { float:left; } .float-right { float:left; } .border-std { border:1px dotted #aaa; } table.border-std td { border:1px dotted #aaa; } .summary { } p.summary { margin:5px 0 0 0; } .aux { font-style:italic; } p.aux { margin:5px 0 0 0; } .content #divMinor .hideRHCol_Content, .print-only, .hidden { display:none; } .ie6-cleaner { display:none; } /*////////////////////// IMPLEMENTATION STYLES /////////////////////*/ .highlightBlock { background-color:#999; color:#fff; font-weight:bold; }