/*######################################## Project: Version: Last change: Designed by: Big Click Studios - www.bigclick.com.au #########################################*/ /*------------------------------------------------------------------ [Table of contents] 1. GLOBAL STYLES 2. HEADER STYLES 3. COLUMN STRUCTURE 4. CONTENT STYLES 5. RIGHT CONTENT STYLES 6. FOOTER STYLES 7. CONTACT, FORM 8. MISCELLANEOUS # ------------------------------------------------------------------*/ /*--------------------------------------- 1. GLOBAL STYLES - reset, html, body, wrap -----------------------------------------*/ * {margin: 0; padding: 0;} html {background: #8CB36F url(/img/layout/html-bg.gif) 0px 593px repeat-x;} body {background: url(/img/layout/body-bg.jpg) 0 54px repeat-x; font-size: 62.5%; padding-bottom: 50px; font-family: helvetica, arial, sans-serif;} #wrap {background: url(/img/layout/wrap-bg.png) center 54px no-repeat;} /*--------------------------------------- 2. HEADER STYLES - branding, logo, top nav, header, whats on -----------------------------------------*/ /* Branding */ #branding { background: url(/img/layout/nav-bg2.png) repeat-x; height: 76px; position: relative; z-index: 500;} /* Logo */ a#logo { position: absolute; left: 50%; top: 0px; background: url(/img/layout/logo.png); display: block; height: 175px; text-indent: -9999px; width: 256px; z-index: 600; margin-left: -500px;} #edge { position: absolute; left: 0px; top: 48px; background: url(/img/layout/edge.png) repeat-x; height: 18px; width: 100%; z-index: 600;} /* Top Nav */ #nv { margin: 0 auto; width: 996px; } #nv ul { list-style: none; margin: 0 0 0 580px; padding-top: 18px; } #nv ul li { position: relative; float: left; display: block; height: 28px; margin-left: 4px; } #nv ul li a { display: block; text-decoration: none; color: #FFF; font-family: helvetica, arial, sans-serif; font-size: 1.4em; text-transform: uppercase; padding: 0 0 0 10px; font-weight: bold; cursor: pointer; } #nv ul li a:link, #nv ul li a:visited { background: url(/img/layout/nav-tab-lt.gif) bottom left no-repeat; } #nv ul li a:hover, #nv ul li a:active, #nv ul li#current a:link, #nv ul li#current a:visited , #nv ul li#current a:hover , #nv ul li#current a:active { background: url(/img/layout/nav-tab-lt.gif) top left no-repeat; } #nv ul li a span { display: inline-block; line-height: 28px; padding-right: 10px; } #nv ul li a:link span, #nv ul li a:visited span { background: #FF802D url(/img/layout/nav-tab-rt.gif) bottom right no-repeat; } #nv ul li a:hover span, #nv ul li a:active span, #nv ul li#current a:link span, #nv ul li#current a:visited span, #nv ul li#current a:hover span, #nv ul li#current a:active span { background: #4CA3CA url(/img/layout/nav-tab-rt.gif) top right no-repeat; } #nv ul li ul { display: none; position: absolute; top: 28px; left: 0; margin: 0; background: none; } #nv ul li > ul { top: auto; left: auto; } #nv ul li:hover ul, #nv ul li.sfHover ul { display: block; } /* Drop Down */ #nv li ul { list-style: none; padding: 13px 0 0 0; width: 180px;} #nv li ul li { background: transparent url(/img/layout/dd-li-bg.png) no-repeat; padding: 0; display: block; margin: 0; height: 35px; width: 180px; } #nv li ul li.last { background: transparent url(/img/layout/dd-li-last-bg.png) no-repeat; padding: 0; display: block; margin: 0; height: 54px; } #nv li ul li a:link, #nv li ul li a:visited, #nv li ul li a:hover, #nv li ul li a:active, #nv ul li#current ul li a:link, #nv ul li#current ul li a:visited, #nv ul li#current ul li a:hover, #nv ul li#current ul li a:active { padding: 0; width: 180px; height: 33px; line-height: 33px; margin-bottom: 2px; display: block; background: none; color: #0F83FF; font-size: 1.3em; font-family: trebuchet MS; text-align: center; } #nv li:hover ul a:hover, #nv li.sfHover ul a:hover, #nv li#current:hover ul a:hover { background: url(/img/layout/dd-li-bg-over.gif) top center repeat-y; color: #0F83FF; } #nv li.about-tab ul { left: -55px; } #nv li.event-tab ul { left: -55px; } #nv li.sponsors-tab ul { left: -40px; } /* Header */ #hd-bg { background: url(/img/layout/header-bg.png) center 0px no-repeat; height: 234px; margin-top: -45px; position: relative; z-index: 100;} #hd-one-col-bg { background: url(/img/layout/header-one-col-bg.png) center 0px no-repeat; height: 234px; margin-top: -45px; position: relative; z-index: 100;} #hd { margin: 0 auto; width: 996px; position: relative; } #hd-home { margin: 0 auto; position: relative; height: 556px; } #hd-home-intro-wrap { padding-top: 106px; width: 600px; z-index: 1000; position: relative;} #hd-home-intro-wrap h1 { color: #FFF; font-family: helvetica, arial, sans-serif; font-size: 3.5em; margin-bottom: 16px; } #hd-home-intro-wrap p { color: #157AA8; font-family: helvetica, arial, sans-serif; font-size: 1.7em; font-weight: bold; width: 500px; line-height: 140%;} #hd-home-intro-wrap p a { display: block; width: 165px; height: 37px; background: url(/img/layout/learn-more.png); text-indent: -9999px; margin-top: 12px; cursor:pointer; background-position:top;} #hd-home-intro-wrap p a:hover { background-position:bottom; cursor:pointer;} /* Whats On and Countdown */ #whats-on-outer-wrap { position: absolute; bottom: 0px; left: 0; width: 100%; z-index: 2000; background: url(/img/layout/whats-on-bg.png) center 0px no-repeat; height: 215px; } #whats-on-wrap { margin: 0 auto; width: 996px; height: 215px; overflow: hidden;} #whats-on { float: left; margin: 28px 0 0 42px; display: inline; width: 570px;} #whats-on h2 { background: url(/img/layout/whats-on-hd.gif) no-repeat; text-indent: -9999px; width: 190px; height: 23px; margin: 0 0 10px 0; } #whats-on a.thumb { float: left; display: block; margin: 0 14px 0 0;} #whats-on a.thumb img { display: block; border: 4px solid #E6AF22; } #whats-on h3 { color: #FF5509; font-size: 1.5em; margin: 0 0 6px 0; font-family: helvetica, arial, sans-serif; } #whats-on h3 a{ color: #FF5509; margin: 0 0 6px 0; font-family: helvetica, arial, sans-serif; text-decoration:none;} #whats-on p { color: #666; font-size: 1.5em; margin: 0; font-family: helvetica, arial, sans-serif; line-height: 120%; } #when-its-on { float: right; margin: 28px 30px 0 0; display: inline; width: 292px; } #when-its-on p { color: #157AA8; font-size: 1.8em; margin: 0 0 4px 0; font-family: helvetica, arial, sans-serif; text-align: center; font-weight: bold; } #when-its-on p.time { font-size: 1.4em; margin: 0 0 10px 0; } #countdown { height: 52px; background: url(/img/layout/countdown-bg.gif); margin-bottom: 11px; } #countdownSwf {position: relative; top: -8px; left: -8px;} /*--------------------------------------- 3. COLUMN STRUCTURE - including content background -----------------------------------------*/ #ct-wrap { background: url(/img/layout/content-wrap-bg.png) center 320px repeat-x; } #ct-wrap-home { background: url(/img/layout/content-wrap-bg.png) center 0px repeat-x; } #ct-bg { background: url(/img/layout/content-bg.png) center 0px repeat-y; } #ct { margin: 0 auto; width: 996px; overflow: hidden;} #ct-one-col { margin: 0 auto; width: 900px; background: #FFF; padding: 32px 0;} #ct-left { float: left; width: 630px; margin: 32px 0 0 19px; display: inline; } #ct-right {float: right; width: 300px; margin: 6px 31px 0 0; display: inline;} #ct-wrap-home #ct-left { margin-top: 6px; } /*--------------------------------------- 4. LEFT COLUMN STYLES - header, copy, lists, images -----------------------------------------*/ /* Headers */ #ct-left h1 {margin: 0 40px 34px 37px;} #ct-one-col h1 {margin: 0 0 34px 0;} #ct-one-col h2 { color: #4CA3CA; font-size: 1.8em; margin: 0 40px 16px 37px; font-family: helvetica, arial, sans-serif; } #ct-left h1.about-hd {width: 243px; height: 45px; background: url(/img/layout/about-hd.gif); text-indent: -9999px;} #ct-left h1.sponsors-hd {width: 281px; height: 58px; background: url(/img/layout/sponsors-hd.gif); text-indent: -9999px;} #ct-one-col h1.timetable-hd {width: 193px; height: 43px; background: url(/img/layout/timetable-hd.gif); text-indent: -9999px;} #ct-left h2 { color: #4CA3CA; font-size: 1.8em; margin: 0 40px 16px 37px; font-family: helvetica, arial, sans-serif; } #ct-left h2.sponsor-nm-rights { padding: 0 10px; width: 590px; height: 36px; line-height: 36px; color: #FFF; background: url(/img/layout/spons-hd-bg-blue.gif) no-repeat; margin: 0 0 16px 28px;} #ct-left h2.sponsor-platinum { padding: 0 10px; width: 590px; height: 36px; line-height: 36px; color: #FFF; background: url(/img/layout/spons-hd-bg-platinum.gif) no-repeat; margin: 0 0 16px 28px;} #ct-left h2.sponsor-gold { padding: 0 10px; width: 590px; height: 36px; line-height: 36px; color: #FFF; background: url(/img/layout/spons-hd-bg-gold.gif) no-repeat; margin: 0 0 16px 28px;} #ct-left h2.sponsor-silver { padding: 0 10px; width: 590px; height: 36px; line-height: 36px; color: #FFF; background: url(/img/layout/spons-hd-bg-silver.gif) no-repeat; margin: 0 0 16px 28px;} #ct-left h2.sponsor-bronze { padding: 0 10px; width: 590px; height: 36px; line-height: 36px; color: #FFF; background: url(/img/layout/spons-hd-bg-bronze.gif) no-repeat; margin: 0 0 16px 28px;} #ct-left h2.sponsor-in-kind { padding: 0 10px; width: 590px; height: 36px; line-height: 36px; color: #FFF; background: url(/img/layout/spons-hd-bg-green.gif) no-repeat; margin: 0 0 16px 28px;} /* Text */ #ct-one-col p { color: #666; font-size: 1.5em; margin: 0 40px 24px 37px; font-family: helvetica, arial, sans-serif;; line-height: 140%; } #ct-left p { color: #666; font-size: 1.5em; margin: 0 40px 24px 37px; font-family: helvetica, arial, sans-serif;; line-height: 140%; } #ct-left p a { color: #EE7824;} #ct-left ul li a { color: #EE7824;} #ct-left h3 a { color: #4CA3CA !important; text-decoration: none;} #ct-left h3 a:hover { color: #FF5509 !important; text-decoration: none;} /* Sponsor Spotlight */ #sponsor-spotlight { margin: 0 0 40px 15px; padding: 10px 20px 10px 10px; width: 570px; background: url(/img/layout/spons-spot-bg.png) no-repeat; height: 179px; } #sponsor-spotlight h2 { background: url(/img/layout/spons-spot-hd.gif) no-repeat; text-indent: -9999px; width: 173px; height: 29px; margin: 0 0 8px 0; } #sponsor-spotlight a.thumb { float: left; display: block; margin: 0 14px 0 0;} #sponsor-spotlight a.thumb img { display: block; border: solid 4px #bcdceb;} #sponsor-spotlight h3 { color: #0F83FF; font-size: 1.5em; margin: 0 0 6px 0; font-family: helvetica, arial, sans-serif; } #sponsor-spotlight h3 a{ color: #0F83FF; margin: 0 0 6px 0; font-family: helvetica, arial, sans-serif; text-decoration: none;} #sponsor-spotlight p { color: #666; font-size: 1.5em; margin: 0; font-family: helvetica, arial, sans-serif; line-height: 120%; } /* Teasers */ #teasers { list-style: none; margin: 0 0 0 15px; width: 612px; overflow: hidden; } #teasers li { float: left; width: 288px; margin: 0 14px 18px 0; overflow: hidden; height: 150px; } #teasers li .teaser-content { float: right; width: 217px; } #ct-left #teasers li h2 { margin: 0 0 4px 0; text-indent: -9999px; height: 28px; } #teasers li h2.days-att { background: url(/img/layout/days-att-hd.gif) no-repeat; width: 211px; } #teasers li h2.timetable { background: url(/img/layout/timetable-hm-hd.gif) no-repeat; width: 92px; } #teasers li h2.history { background: url(/img/layout/history-hd.gif) no-repeat; width: 210px; } #teasers li h2.watch-movie { background: url(/img/layout/watch-movie-hd.gif) no-repeat; width: 217px; } #teasers li h2.info-stalls { background: url(/img/layout/info-stalls-hd.gif) no-repeat; width: 169px; } #teasers li h2.play-games { background: url(/img/layout/play-games-hd.gif) no-repeat; width: 172px; } #ct-left #teasers li p { color: #666; font-size: 1.5em; margin: 0 0 6px 0; font-family: helvetica, arial, sans-serif; line-height: 120%; } #ct-left #teasers li p a { color: #FF4D03; font-weight: bold; text-decoration: none; } #teasers li a.icon { float: left; display: block; width: 62px; margin: 0; } #teasers li a.days-att { background: url(/img/layout/days-att-icon.gif) top right no-repeat; height: 54px; } #teasers li a.timetable { background: url(/img/layout/timetable-icon.gif) top right no-repeat; height: 62px; } #teasers li a.history { background: url(/img/layout/history-icon.gif) top right no-repeat; height: 61px; } #teasers li a.watch-movie { background: url(/img/layout/movie-icon.gif) top right no-repeat; height: 57px; } #teasers li a.info-stalls { background: url(/img/layout/info-stalls-icon.gif) top right no-repeat; height: 60px; } #teasers li a.play-games { background: url(/img/layout/games-icon.gif) top right no-repeat; height: 62px; } /* Sponsors Lists */ ul.sponsors-w-text { list-style: none; background: url(/img/layout/list-dashes.gif) top left repeat-x; margin: 0 auto 24px auto; padding-top: 1px; width: 626px;} ul.sponsors-w-text li { padding: 12px 12px 12px 28px; width: 586px; overflow: hidden; background: url(/img/layout/list-dashes.gif) bottom left repeat-x; } ul.sponsors-w-text li.alt { background: #F5F9FA url(/img/layout/list-dashes.gif) bottom left repeat-x; } ul.sponsors-w-text li h3 { color: #0F83FF; margin-bottom: 8px; padding-top: 5px;font-family: helvetica, arial, sans-serif; font-size: 1.5em; } #ct-left ul.sponsors-w-text li p { margin: 0 16px 0 0; font-family: helvetica, arial, sans-serif; line-height: 120%; } ul.sponsors-w-text li img{ display: block; float: left; margin: 0 12px 0 0; border: solid 4px #bcdceb; } ul.sponsors-w-text li p a { margin: 5px 12px 0 0; } ul.sponsors-sec li img { display: block; border: solid 4px #bcdceb;} ul.sponsors-wout-text { list-style: none; margin: 0 0 24px 28px; width: 584px; overflow: hidden;} ul.sponsors-wout-text li { float: left; margin: 0 9px 10px 0;} ul.sponsors-only-text { list-style: none; margin: 0 0 20px 38px; width: 570px; overflow: hidden; } ul.sponsors-only-text li { float: left; width: 256px; padding-left: 14px; background: url(/img/layout/bullet.gif) center left no-repeat; margin: 0 10px 6px 0; color: #666; font-size: 1.5em; font-family: helvetica, arial, sans-serif;} /* Time Table */ table#timetable { width: 900px; } table#timetable th { line-height: 46px; background: url(/img/layout/timetable-hd-bg-left.png) top left no-repeat; padding-left: 3px; color: #4CA3CA; font-size: 1.8em; font-family: helvetica, arial, sans-serif; } table#timetable th span { display: inline-block; height: 46px; width: 100%; line-height: 46px; background: url(/img/layout/timetable-hd-bg-right.png) top right no-repeat;} table#timetable td table tr td {color: #666;font-family: helvetica, arial, sans-serif; font-size: 14px;; border: 2px solid #FFF;} table#timetable td.stg-1, table#timetable a.stg-1 { background: #D8EBF3;} table#timetable td.stg-2, table#timetable a.stg-2 { background: #E0F3DD;} table#timetable td.stg-3, table#timetable a.stg-3 { background: #F3DFCE;} table#timetable td.stg-4, table#timetable a.stg-4 { background: #F3D8DE;} table#timetable td.stg-5, table#timetable a.stg-5 { background: #E7E8F3;} table#timetable a:hover{background-color:#FFF;} table#timetable td em {font-style: normal; font-weight: bold; display: block; margin-bottom: 4px;color: #555;} /*--------------------------------------- 5. RIGHT COLUMN STYLES - big block links, latest news -----------------------------------------*/ /* Big Block Links */ .big-block {display: block; width: 300px; text-indent: -9999px; margin-bottom: 12px;} .sponsor {height: 125px; background: url(/img/layout/dora-ad.png);} .sponsor2 {height: 125px; background: url(/img/layout/roary-ad.png);} /* Latest News */ .latest-news-hd {width: 300px; height: 36px; background: url(/img/layout/latest-news-hd.png); text-indent: -9999px;} ul.latest-news-list {list-style: none; background: url(/img/layout/latest-news-list-bg.png) bottom left no-repeat; padding-bottom: 5px;} ul.latest-news-list li {padding: 14px; border-left: 1px solid #ABC1CC; border-right: 1px solid #ABC1CC; background: #FFF url(/img/layout/list-dashes.gif) bottom left repeat-x;} ul.latest-news-list li.last {background: #FFF;} ul.latest-news-list li h4 {margin-bottom: 10px; font-family: helvetica, arial, sans-serif; font-size: 1.4em; } ul.latest-news-list li h4 a {text-decoration: none; color: #0F83FF;} ul.latest-news-list li p {color: #666; line-height: 130%; font-size: 1.3em; font-family: helvetica, arial, sans-serif; margin-bottom: 0;} /* Social Networking */ #social-links { width:300px; height:150px; margin-top:10px; } #social-links .float-left { float:left; margin-right:20px; } /*--------------------------------------- 6. FOOTER STYLES - footer -----------------------------------------*/ #ft-bg { background: url(/img/layout/footer-bg.png) center 0px no-repeat; position: relative; height: 200px; } #ft-one-col-bg { background: url(/img/layout/footer-one-col-bg.png) center 0px no-repeat; position: relative; height: 200px; } #ft { margin: 0 auto; width: 996px; padding-top: 130px;} /* Footer Nav */ #ft ul.nv { float: left; list-style: none; width: 500px; overflow: hidden; padding-left: 20px;} #ft ul.nv li { float: left; margin-right: 24px;} #ft ul.nv li a { text-decoration: none; color: #FFF; font-family: helvetica, arial, sans-serif; font-size: 1.4em; text-transform: uppercase; } /* Site Validation and Credit Links */ #ft ul.site-check { float: right; list-style: none; width: 316px; overflow: hidden; padding-right: 8px;} #ft ul.site-check li { float: left; margin-right: 12px;} #ft ul.site-check li a { display: block; height: 47px; text-indent: -9999px;} #ft ul.site-check li a.bc-lnk { width: 120px; background: url(/img/layout/bc-logo.gif);} #ft ul.site-check li a.css-lnk { width: 80px; background: url(/img/layout/css.gif) top left no-repeat;} #ft ul.site-check li a.html-lnk { width: 80px; background: url(/img/layout/html.gif) top left no-repeat;} /* Legal Notices */ #ft ul.legals { float: left; list-style: none; width: 500px; overflow: hidden; padding: 20px 0px 0px 20px;} #ft ul.legals li { float: left; margin-right: 20px;} #ft ul.legals li a { text-decoration: none; color: #FFF; font-family: helvetica, arial, sans-serif; font-size: 1em; text-transform: uppercase; } /*--------------------------------------- 7. CONTACT, FORM - input, text area, submit button, custom layout -----------------------------------------*/ div#form-wrap { color: #666; font-size: 1.5em; margin: 0 40px 24px 37px; font-family: trebuchet MS; line-height: 140%; width:560px; overflow: hidden } div#form-wrap label { width:400px; display:block; } div#form-wrap select { width:210px; border:2px solid #4CA3CA; background:#dcf2fc; padding:3px; color: #333333; font-size: 1.0em; line-height: 140%; font-family: trebuchet MS; } div#form-wrap input { width:200px; border:2px solid #4CA3CA; background:#dcf2fc; padding:3px; color: #333333; font-size: 1.0em; line-height: 140%; font-family: trebuchet MS; } div#form-wrap textarea { width:360px; border:2px solid #4CA3CA; background:#dcf2fc; padding:3px; color: #333333; font-size: 1.0em; line-height: 140%; font-family: trebuchet MS; } div#form-wrap input:focus, div#form-wrap textarea:focus { border:2px solid #4CA3CA; background:#fff; } div#form-wrap .lcol { width: 160px; padding: 5px 0 5px 0; float: left; } div#form-wrap .rcol { width: 260px; padding: 5px 0 5px 0; float: left; } div#form-wrap .rcol textarea { width: 270px; height: 122px } #serviceForm label.error { display: inline; margin-left: 10px; width: auto; color: red;} #serviceForm input.error { border: 2px solid red; } #serviceForm textarea.error { border: 2px solid red; } #serviceForm select.multiple { margin-top: 10px } #serviceForm select.error { border: 2px solid red; } em.red { color: red;} .submit-button{margin: 0 40px 24px 37px; width: 150px;} /*--------------------------------------- 8. MISCELLANEOUS -----------------------------------------*/ /*Added Styles */ ul.contentList { list-style: none; margin: 0 0 20px 38px; width: 570px; overflow: hidden; } ul.contentList li { padding-left: 14px; background: url(/img/layout/bullet.gif) center left no-repeat; margin: 0 10px 6px 0; color: #666; font-size: 1.5em; font-family: helvetica, arial, sans-serif;} #content{ display: none;} #content2{ display: none;} #content3{ display: none;} .performerImage{ margin:0 40px 10px 37px; float: left;} .performerImage img{ border: solid 4px #e6af23;} .externalButton { display: block; width: 165px; height: 37px; background-image: url('/img/layout/button.png'); text-align: center; line-height: 36px; color: white !important; font-weight: bold; text-decoration: none !important; } .externalButton:hover { background-position: bottom; color: white !important; text-decoration: none !important;} .moreLink{clear: both; float: right;} ul.sponsors-w-text h2 a { text-decoration: none; color: #4CA3CA; margin-left: -10px; } #whats-on h3 a:hover, p a:hover {color: #4CA3CA !important;} #sponsor-spotlight h3 a:hover, h4 a:hover, .sponsor-link:hover { !important;} #balloons {width:100%; height: 560px; position: absolute; top: 62px;} #home-kids{position: absolute; z-index: 500; left: 460px; top: -30px; } .special-wrap{width: 968px; margin: 0 auto;} #toggle, #toggle2, #toggle3, #toggle4, #toggle5{cursor:pointer;} #KDO-logo{float: right;} .timetable tr td a{ padding: 8px 8px 20px 8px; display: block; text-decoration: none; color: #666; } .noLink{ padding: 8px 8px 20px 8px; } #download{border: none !important;} .timetable-hd2{ color: #4CA3CA; font-size: 1.8em; margin: 0 40px 16px 0; font-family: helvetica, arial, sans-serif; } /* End Added Styles */ a { outline: none; color:#FF4D03; } img {border: none;}