/* ------------------------------------------------------------------- Race For Life 2007 stylesheet: global styles ------------------------------------------------------------------- */ /* Body, wrapper and general formatting -------------------------------------------------------------------------- */ body { font: normal normal normal 62.5% "Arial", sans-serif; margin: 0; padding: 0; text-align: center; } #wrapper { width: 770px; margin: 0 auto; text-align: left; color: #013499; } form, fieldset { margin: 0; padding: 0; border: 0; } a { color: #c06; } a img { border: 0; } input, select, textarea { font: 1em Arial; } img.fRight { float: right; margin: 0 0 1em 1em; } .center {text-align:center} hr { margin: 1em 0; border: 0; height: 1px; background-color: #c06; color: #c06; } /* Main header - logos and site search -------------------------------------------------------------------------- */ #header { background: #f5cce0; margin: 0 0 18px 0; padding: 0 0 5px 0; } #header div { background: #db3485; padding: 0 0 5px 0; } #header div div { background: #013499; padding: 0; } #header img { vertical-align: bottom; } #header #logo1 { text-align: left; float: left; } #header #logo2 { text-align: center; padding: 0 160px 0 0; } /* #header #search { padding: 20px 10px 0 0; font-size: 1.2em; color: #fff; } #header #search label, #header #search input { vertical-align: middle; } #header #search input { font: 1.1em "Arial", sans-serif; } */ /* Left col - main menu, etc -------------------------------------------------------------------------- */ #leftcol { width: 160px; float: left; } #leftcol ul { margin: 0 0 1.5em 0; padding: 0; list-style: none; } #leftcol ul li { margin: 0 0 1px 0; } #leftcol ul li a { font-size: 1.5em; font-weight: bold; text-decoration: none; color: #fff; display: block; background: #c06 url(/images/mainmenu-bg.gif) no-repeat scroll 97% 50%; } #leftcol ul li.on a, #leftcol ul li a:hover { background-color: #013499; } #leftcol ul li.on a { background: #013499 url(/images/mainmenu-bg-on.gif) no-repeat scroll 97% 50%; } #leftcol ul li.on ul { margin: 0; padding: 0; } #leftcol ul li.on ul li a { font-size: 1.1em; font-weight: normal; color: #c06; background: none; } #leftcol ul li.on ul li a span { display: block; padding: 0 0 0 15px; background: #fff url(/images/mainmenu-submenu-bg.gif) no-repeat center left; } #leftcol ul li.on ul li a:hover { text-decoration: underline; } #leftcol ul li a span.one { display: block; background: url(/images/mainmenu-topleftbg.gif) no-repeat scroll top left; } #leftcol ul li a span.two { display: block; background: url(/images/mainmenu-toprightbg.gif) no-repeat scroll top right; } #leftcol ul li a span.three { display: block; background: url(/images/mainmenu-bottomleftbg.gif) no-repeat scroll bottom left; } #leftcol ul li a span.four { display: block; background: url(/images/mainmenu-bottomrightbg.gif) no-repeat scroll bottom right; } #leftcol ul li a span.five { display: block; padding: 3px 25px 3px 8px; } #leftcol ul li.submenu a span.three, #leftcol ul li.submenu a span.four { background: none; } #leftcol ul li.on div.one { background: url(/images/mainmenu-submenu-dot.gif) repeat-y top left; } #leftcol ul li.on div.two { background: url(/images/mainmenu-submenu-dot.gif) repeat-x bottom left; } #leftcol ul li.on div.three { background: url(/images/mainmenu-submenu-dot.gif) repeat-y top right; } #leftcol ul li.on div.four { background: url(/images/mainmenu-submenu-topleft.gif) no-repeat top left; } #leftcol ul li.on div.five { background: url(/images/mainmenu-submenu-topright.gif) no-repeat top right; } #leftcol ul li.on div.six { background: url(/images/mainmenu-submenu-btmright.gif) no-repeat bottom right; } #leftcol ul li.on div.seven { background: url(/images/mainmenu-submenu-btmleft.gif) no-repeat bottom left; padding: 5px; } #leftcol form { margin: 1.5em 0 0 0; } #leftcol form label { margin: 0 0 .3em .3em; display: block; font: bold 1.1em "Arial"; } #leftcol form select { width: 140px; font: 1em "Arial"; } #leftcol form select optgroup label {} #leftcol form select, #leftcol form input { vertical-align: middle; } form .mandatory{color:#c06;} #leftcol .tesco { width: 87px; margin: 12em auto 0 auto; font: 1.1em "Arial"; text-transform: lowercase; } #leftcol li.on ul li.on a{font-weight:bold !important;color:#013499;} /* Middle col - main content area -------------------------------------------------------------------------- */ #middlecol { width: 420px; padding: 0 20px; font-size: 1.3em; float: left; } #middlecol h1 { margin: 0 0 10px 0; font-size: 2em; font-weight: normal; color: #c06; } #middlecol h2 { margin: 10px 0; font-size: 1em; } #middlecol h2.big { margin: 10px 0; font-size: 1.3em; } /* #middlecol .videoembed { width: 181px; background: url(/images/videoembedbg.gif) no-repeat scroll top left; padding: 4px 0 0 0; float: right; } */ .videoembed { width: 212px; padding: 0px; float: right; margin:0px 0px 5px 10px} .videoembed p{padding:10px;margin-top:10px;border:1px solid #c06} #middlecol .aligncenter { text-align: center; } #middlecol .alignright { text-align: right; } #middlecol .col2 { width: 50%; float: left; } #middlecol .col3 { width: 33%; float: left; } #middlecol .pagenav { margin: 1em 0; } #middlecol .pagenav .pagenav1 { width: 66%; float: left; } #middlecol .pagenav .pagenav2 { width: 17%; float: left; text-align: right; } #middlecol .pagenav .pagenav3 { width: 17%; float: left; text-align: right; } #middlecol a.backtotop { background: url(/images/backtotop.gif) no-repeat center left; padding: 0 0 0 15px; text-decoration: none; } #middlecol a.backapage { background: url(/images/backapage.gif) no-repeat center left; padding: 0 0 0 25px; text-decoration: none; } #middlecol a.forward { background: url(/images/arrowright.gif) no-repeat center right; padding: 0 25px 0 0; } #middlecol .arrowlist { margin: 1em; padding: 0; list-style: none; } #middlecol .arrowlist li { margin: 0 0 1em 0; padding: 0 0 0 20px; background: url(/images/arrowlist.gif) no-repeat center left; } #middlecol .arrowlist li a { font-weight: bold; color: #013499; } #middlecol p.raceclosed { background: url(/images/raceclosed.gif) no-repeat center left; padding: .9em 0 .9em 40px; color: #c06; } #middlecol .payinLeft { width: 10%; float: left; } #middlecol .payinRight { width: 90%; float: left; } #middlecol form.sortby { margin: 1em 0; } #middlecol form.sortby input, #middlecol form.sortby select { vertical-align: middle; } #middlecol .forumtable table { border-left: 1px solid #c06; border-right: 1px solid #c06; } #middlecol .forumtable table tr th { padding: .5em; border-top: 1px solid #c06; border-bottom: 1px solid #c06; } #middlecol .forumtable table tr td { background: #ffe6f2; padding: .5em; font-size: .85em; } #middlecol .forumtable table tr.second td { background: #fff; } #middlecol .forumtable table.message tr th { width: 20%; border: 0; vertical-align: top; } #middlecol .forumtable table.message tr td { background: #fff; font-size: 1em; vertical-align: top; } #middlecol .forumtable h2 { font-size: 1.1em; margin: 0; color: #fff; } #middlecol .forumtable .forumwrapper1 { background: #c06 url(/images/forumtable-topleft.gif) no-repeat top left; } #middlecol .forumtable .forumwrapper2 { background: url(/images/forumtable-topright.gif) no-repeat top right; padding: .5em; } #middlecol .forumtable .forumwrapper3 { background: url(/images/forumtable-bottom.gif) repeat-x bottom left; } #middlecol .forumtable .forumwrapper4 { background: url(/images/forumtable-bottomleft.gif) no-repeat bottom left; } #middlecol .forumtable .forumwrapper5 { background: url(/images/forumtable-bottomright.gif) no-repeat bottom right; padding-bottom: 12px; } #middlecol .forumtable.findarace .forumwrapper2 { padding: 0; } #middlecol .forumtable.findarace table { border: 0; } #middlecol .forumtable.findarace table tr th { border: 0; color: #fff; } #middlecol .forumtable.findarace table tr td { font-size: 1em; } #middlecol .forumtable.findarace table tr td.left { border-left: 1px solid #c06; } #middlecol .forumtable.findarace table tr td.right { border-right: 1px solid #c06; } #middlecol .forumtable .holder { border-left: 1px solid #c06; border-right: 1px solid #c06; padding: .5em; } #middlecol .forumtable form { border-left: 1px solid #c06; border-right: 1px solid #c06; padding: .5em; } #middlecol .forumtable form label { width: 35%; margin: 0 0 .5em 0; float: left; font-weight: bold; } #middlecol .forumtable form input, #middlecol .forumtable form select { margin: 0 0 .5em 0; border: 1px solid #ccc; font: 1em Arial; } input.submit{border:none !important;vertical-align:middle} #middlecol .forumtable form textarea { margin: 0 0 .5em 0; border: 1px solid #ccc; font: 1em Arial; } #middlecol .formrequired { color: #c06; } #middlecol form.selectforum input, #middlecol form.selectforum select { vertical-align: middle; } #middlecol .forumtable form.findarace label { float: none; } #middlecol .forumtable form.findarace input, #middlecol .forumtable form.findarace select { vertical-align: middle; } #middlecol .forumtable form.findarace .small { font-size: .85em; } #middlecol .forumtable form .privacy{margin:10px 0px 10px 0px;} #middlecol .forumtable form .privacy label { width: 94%; float: right; font-weight: bold;} #middlecol .sitemap { margin: 1em 0; } #middlecol .sitemap ul { margin: 0 2em 1em 2em; padding: 1em 0 0 0; } #middlecol .sitemap a { color: #013499; } #middlecol .sitemap .sitemap1 { background: #f5cce0 url(/images/sitemap/top.gif) repeat-x top left; } #middlecol .sitemap .sitemap2 { background: url(/images/sitemap/right.gif) repeat-y top right; } #middlecol .sitemap .sitemap3 { background: url(/images/sitemap/left.gif) repeat-y top left; } #middlecol .sitemap .sitemap4 { background: url(/images/sitemap/topleft.gif) no-repeat top left; } #middlecol .sitemap .sitemap5 { background: url(/images/sitemap/topright.gif) no-repeat top right; } #middlecol .sitemap .sitemap6 { background: url(/images/sitemap/bottom.gif) repeat-x bottom left; } #middlecol .sitemap .sitemap7 { background: url(/images/sitemap/bottomright.gif) no-repeat bottom right; } #middlecol .sitemap .sitemap8 { background: url(/images/sitemap/bottomleft.gif) no-repeat bottom left; } #middlecol .sitemap .sitemapbtm1 { background: #fff url(/images/sitemap/bottom-white.gif) repeat-x bottom left; } #middlecol .sitemap .sitemapbtm2 { background: url(/images/sitemap/right-white.gif) repeat-y top right; } #middlecol .sitemap .sitemapbtm3 { background: url(/images/sitemap/left-white.gif) repeat-y top left; } #middlecol .sitemap .sitemapbtm4 { background: url(/images/sitemap/bottomleft-white.gif) no-repeat bottom left; } #middlecol .sitemap .sitemapbtm5 { background: url(/images/sitemap/bottomright-white.gif) no-repeat bottom right; } #middlecol .error .pad { padding: .5em; } #middlecol .error { margin: 1em 0; color: #c06; } #middlecol .error .error1 { background: #fff url(/images/forumtable-top-white.gif) repeat-x top left; } #middlecol .error .error2 { background: url(/images/forumtable-right-white.gif) repeat-y top right; } #middlecol .error .error3 { background: url(/images/forumtable-left-white.gif) repeat-y top left; } #middlecol .error .error4 { background: url(/images/forumtable-topleft-white.gif) no-repeat top left; } #middlecol .error .error5 { background: url(/images/forumtable-topright-white.gif) no-repeat top right; } #middlecol .error .error6 { background: url(/images/forumtable-bottom.gif) repeat-x bottom left; } #middlecol .error .error7 { background: url(/images/forumtable-bottomright.gif) no-repeat bottom right; } #middlecol .error .error8 { text-align: center; background: url(/images/forumtable-bottomleft.gif) no-repeat bottom left; } #middlecol .error ul,#middlecol .error li{list-style:none;} #middlecol div.image { float:right;margin-left:10px;} /* Right col - poll/spotlight/quotebox, page tools etc -------------------------------------------------------------------------- */ #rightcol { width: 150px; float: left; } #rightcol .quotebox {width:145px; margin: 0 0 1em 0; font: 1.2em "Arial"; color: #c06; background: #fbebf3 url(/images/quotebox-topleft.gif) no-repeat scroll top left; text-align: center; } #rightcol .quotebox div { background: url(/images/quotebox-topright.gif) no-repeat scroll top right; } #rightcol .quotebox div div { background: url(/images/quotebox-bottomleft.gif) no-repeat scroll bottom left; } #rightcol .quotebox div div div { padding: 10px; background: url(/images/quotebox-bottomright.gif) no-repeat scroll bottom right; } #rightcol .quotebox .openquote { margin-right: 5px; } #rightcol .quotebox .closequote { margin: 2px 0 0 2px; vertical-align: top; } #rightcol .quotebox .author { margin: 3px 0 0 0; padding: 0; font-size: .9em; color: #013499; text-align: right; background: none; } #rightcol .spotlight {width:145px; margin: 0 0 1em 0; color: #013499; background: #fbebf3 url(/images/quotebox-bottomleft.gif) no-repeat scroll bottom left; } #rightcol .spotlight div { background: url(/images/quotebox-bottomright.gif) no-repeat scroll bottom right; } #rightcol .spotlight div.image { background: none; border-bottom: 3px solid #db3485; } #rightcol .spotlight div.image img { vertical-align: bottom; } #rightcol .spotlight div.title { padding: 10px 10px 5px 10px; font: 1.2em "Arial"; background: none; border-top: 3px solid #f5cce0; } #rightcol .spotlight div.text { padding: 5px 10px 10px 10px; font: 1.2em "Arial"; background: none; } #rightcol .poll { margin: 0 0 1em 0; color: #013499; background: #fbebf3 url(/images/quotebox-bottomleft.gif) no-repeat scroll bottom left; } #rightcol .poll div { background: url(/images/quotebox-bottomright.gif) no-repeat scroll bottom right; } #rightcol .poll div.title { font: 1.2em "Arial"; background: none; background: #c06 url(/images/poll-topleft.gif) no-repeat scroll top left; color: #fff; border-bottom: 3px solid #f5cce0; } #rightcol .poll div.title div { padding: 7px 7px 5px 7px; background: url(/images/poll-topright.gif) no-repeat scroll top right; } #rightcol .poll div.text { padding: 5px 7px 7px 7px; font: 1.1em "Arial"; background: none; } #rightcol .poll div.text div { background: none; } #rightcol .poll div.text .options { padding: 4px 0; } #rightcol .poll div.text .option { margin: 3px 0; background: none; } #rightcol .poll div.text label { width: 83%; padding-top: 2px; vertical-align: bottom; float: right; } #rightcol .poll div.text input { vertical-align: bottom; float: left; } #rightcol .poll div.text input.submit { font: 1em "Arial"; background: #013499; border: 1px solid #013499; color: #fff; } #rightcol .buttons { margin: 1em 0; } #rightcol .pagetools { width:145px; margin: 0 0 1em 0; font: 1.1em "Arial"; color: #c06; background: #dbe2f1 url(/images/pagetools-topleft.gif) no-repeat scroll top left; } #rightcol .pagetools div { background: url(/images/pagetools-topright.gif) no-repeat scroll top right; } #rightcol .pagetools div div { background: url(/images/pagetools-bottomleft.gif) no-repeat scroll bottom left; } #rightcol .pagetools div div div { padding: 10px; background: url(/images/pagetools-bottomright.gif) no-repeat scroll bottom right; } #rightcol .pagetools ul { margin: 0; padding: 0; list-style: none; } #rightcol .pagetools ul li{ margin:0px 0px 10px 0px;} #rightcol .pagetools ul li a{ margin: 0; padding: 0px 0 2px 24px; } #rightcol .pagetools li a.email { background: url(/images/pagetools-email.gif) no-repeat scroll top left; } #rightcol .pagetools li a.enews { background: url(/images/pagetools-enews.gif) no-repeat scroll top left; } #rightcol .pagetools li a.print { background: url(/images/pagetools-print.gif) no-repeat scroll top left; } #rightcol .pagetools li a.pdf { background: url(/images/pagetools-pdf.gif) no-repeat scroll top left; } #rightcol .pagetools li a.help { background: url(/images/pagetools-help.gif) no-repeat scroll top left; } #rightcol .pagetools ul li a { color: #000; text-decoration: underline; } /* Homepage -------------------------------------------------------------------------- */ #homepage { width: 590px; padding: 0 0 0 20px; float: left; } #homepage .splashpic { border-bottom: 3px solid #f5cce0; } #homepage .splashpic div { border-bottom: 3px solid #db3485; } #homepage .splashpic img { vertical-align: bottom; } #homepage .startboxes { margin: 1em 0; } #homepage .startbox { width: 190px; float: left; background: #dbe2f1 url(/images/pagetools-topleft.gif) no-repeat scroll top left; } #homepage .startbox.middle { margin: 0 10px; } #homepage .startbox h1 { font: 1.9em "Arial"; margin: 0 0 5px 0; color: #012f8b; } #homepage .startbox div { background: url(/images/pagetools-topright.gif) no-repeat scroll top right; } #homepage .startbox div div { background: url(/images/pagetools-bottomleft.gif) no-repeat scroll bottom left; } #homepage .startbox div div div { background: url(/images/pagetools-bottomright.gif) no-repeat scroll bottom right; padding: 5px; } #homepage .startbox div div div div { padding: 0; background: #c06 url(/images/home-start-inner-topleft.gif) no-repeat scroll top left; } #homepage .startbox div div div div div { padding: 0; background: transparent url(/images/home-start-inner-topright.gif) no-repeat scroll top right; } #homepage .startbox div div div div div { padding: 0; background: transparent url(/images/home-start-inner-topright.gif) no-repeat scroll top right; } #homepage .startbox div div div div div div { padding: 0; background: transparent url(/images/home-start-inner-bottomleft.gif) no-repeat scroll bottom left; } #homepage .startbox div div div div div div div { padding: 4px; background: transparent url(/images/home-start-inner-btmright.gif) no-repeat scroll bottom right; } #homepage .startbox input { vertical-align: middle; } #homepage .startbox input.textinput { width: 145px; font: 1.2em "Arial"; } #homepage .startbox a { font: bold 1.3em "Arial"; display: block; color: #fff; text-decoration: none; } #homepage .startbox a.alternate { font: 1.9em "Arial"; margin: 0 0 5px 0; color: #012f8b; } #homepage .startbox.twothirds { margin: 0 0 0 10px; width: 390px; } #homepage .startbox a span.one { display: block; background: #c06 url(/images/home-start-inner-topright.gif) no-repeat scroll top right; } #homepage .startbox a span.two { display: block; background: url(/images/home-start-inner-btmright.gif) no-repeat scroll bottom right; } #homepage .startbox a span.three { display: block; background: url(/images/home-start-inner-bottomleft.gif) no-repeat scroll bottom left; } #homepage .startbox a span.four { display: block; background: url(/images/home-start-inner-topleft.gif) no-repeat scroll top left; } #homepage .startbox a span.five { display: block; padding: 6px 5px; background: url(/images/home-start-arrow.gif) no-repeat scroll 97% 50%; } #homepage .introtext { width: 390px; font: 1.3em "Arial"; margin: 0 10px 0 0; float: left; } #homepage .introtext ul { margin: 0 0 10px 0; padding: 0; list-style: none; } #homepage .introtext ul li { background: url(/images/home-entrantstodate.gif) no-repeat scroll center left; padding: 4px 0 4px 20px; font-weight: bold; } #homepage .introtext ul li span { color: #c06; } #homepage .featurebox { width: 190px; float: left; background: #fbebf3 url(/images/quotebox-bottomleft.gif) no-repeat scroll bottom left; } #homepage .featurebox div { background: url(/images/quotebox-bottomright.gif) no-repeat scroll bottom right; } #homepage .featurebox div.image { background: none; border-bottom: 3px solid #db3485; text-align:center;} #homepage .featurebox div.image img {vertical-align: bottom; } #homepage .featurebox div.title { padding: 10px 10px 5px 10px; font: 1.2em "Arial"; background: none; border-top: 3px solid #f5cce0; } #homepage .featurebox div.text { padding: 5px 10px 10px 10px; font: 1.2em "Arial"; background: none; } #homepage .featurebox div.buttonlink { padding: 0 10px 10px 10px; text-align: right; } #entrantstodate { margin: 2em 0 -8em 0; font-size: 1.4em; font-weight: bold; background: url(/images/homepage-entrantstodate.gif) no-repeat bottom center; padding: 0 0 75px 0; border-bottom: 1px solid #c4d0e6; } #entrantstodate span { display: block; color: #cd0065; } #middlecol .merchcol { width: 33%; float: left; text-align: center; } #middlecol .forumtable table#merch { border-bottom: 1px solid #c06; } #middlecol .forumtable table#merch th.section { background: #ffe6f2; color: #c06; border-bottom: 0; } #middlecol .forumtable table#merch th.type { border: 0; } #middlecol .forumtable .merchbottom strong { color: #c06; } #middlecol .forumtable .merchbottom input { float: right; border: 0; } #middlecol .enternow ul{ width:250px; list-style:none; padding:0px; margin:0px auto 0px auto; } #middlecol .enternow ul li{ float:left; margin:0px 20px 0px 0px; text-align:center; } #middlecol .enternow ul li .arrow { background:url(/images/arrowright.gif) no-repeat center left; padding: 0 0 0 25px; } #middlecol input.checkbox, #middlecol input.radio{border:none!important; vertical-align:top;} /* Footer -------------------------------------------------------------------------- */ #footer { margin: 1em 0; font-size: 1.1em; text-align: center; } #footer hr { color: #f5cce0; background-color: #f5cce0; } #footer ul { margin: 1em 0; padding: 0; list-style: none; } #footer ul li { display: inline; padding: 0 5px 0 3px; border-right: 1px solid #f5cce0; } #footer ul li.last { border: 0; } #footer a.ext { color: #013499; } #footer .tesco2 {text-align: left; padding:0px; margin-left:30px; margin-top:0px; margin-bottom:0px; font: 1.0em "Arial"; text-transform: lowercase; } /* Clear fixes -------------------------------------------------------------------------- */ .clearfix:after, #header div div:after, #footer:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; } .clearfix, #header div div, #footer {display: inline-block;} /* Hides from IE-mac \*/ * html .clearfix, * html #header div div, * html #footer {height: 1%;} .clearfix, #header div div, #footer {display: block;} /* End hide from IE-mac */ /* IE Mac fixes -------------------------------------------------------------------------- */ /*\*//*/ #middlecol { width: 410px; } #rightcol .poll div.text input.submit { width: 35px; } /**/ .accessKeyJumper{ float:left; display:inline; width:0px; }