/* ----------------------------------------------------- Kellogg's 'Microsite Name' (http://www.kelloggs.co.uk/whatson/micrositename) SCREEN style sheet author: mN -> hello@madebymn.co.uk version: 2008.07 ----------------------------------------------------- CONTENTS: 1. GLOBAL 2. TYPOGRAPHY 3. GENERAL LAYOUT 4. HEADER 5. NAVIGATION 6. CONTENT 6.1. HOME PAGE 6.2. KELLOGG’S AND SWIMMING 6.2.1. SWIM ACTIVE 6.2.2. ASA 6.2.3. SWIMTASTIC AWARDS 6.3. MEET TEEM KELLOGG’S 6.4. SWIM CHALLENGE 6.5. POOL LOCATOR 7. FOOTER ----------------------------------------------------- */ /* =1. GLOBAL */ html {font-family: Arial, Verdana, sans-serif;} body {background: #1190dc url(../images/global/background.jpg) no-repeat; background-position: top center; color: #666;} /* =2. TYPOGRAPHY */ h1,h2,h3,h4,h5 {font-family: Arial, Helvetica, Arial, sans-serif;} p {font-size: 1.2em; line-height: 1.1em; margin-bottom: 18px;} #sidebar p {font-size: 1.1em; margin-bottom: 18px;} #sidebar p.intro {font-size: 1.2em;} #primary p.intro {font-size: 1.4em; color: #0072b9;} #content a {color: #015990; text-decoration: none; font-weight: bold;} #content a:hover {text-decoration: underline;} #content h2 {color: #0072b9; font-size: 1.5em; text-transform: uppercase; font-family: "Avant Garde", "Century Gothic", "Helvetica", "Arial"; } /* =3. GENERAL LAYOUT */ div#outer {width: 960px; margin: auto;} div#inner {width: 920px; margin: auto; background: #fff; position: relative; padding-bottom: 8px;} div#header, div#container, div#footer {width: 100%; margin: auto;} p.more{ position:absolute; bottom:18px; right:4px; width:52px; height: 8px; } p.more a{ display:block; height:18px; width:52px; text-indent:-9999px; background: url('../images/global/button_more.gif') no-repeat; } /* =4. HEADER */ div#header {position: absolute; height: 55px; width: 916px; left: 2px;} div#header p {position: absolute; top: 19px; left: -27px; z-index: 9; } div#header p a {background: url(../images/global/kelloggs.png) no-repeat; width: 119px; height: 35px; display: block; text-indent: -9999px;} div#breadcrumb {float: right; font-size: 1.1em; min-height: 18px; height: auto!important; height: 18px; margin: 6px 6px 0 0;} div#breadcrumb h5 {float: left; color: #666; font-weight: normal; font-family: Arial, Verdana, sans-serif;} div#breadcrumb ul {float: left;} div#breadcrumb ul li {float: left; margin: 0 0 0 10px; padding: 0 0 0 7px;background: url(../images/global/arrow_red.gif) no-repeat 0 50%;} div#breadcrumb a {color: #666; text-decoration: none; float: left;} div#breadcrumb.blue, div#breadcrumb.blue a, div#breadcrumb.blue h5 {color: #fff;} div#breadcrumb a:hover {text-decoration: underline;} div#breadcrumb ul li ul li ul li a, div#breadcrumb.blue ul li ul li ul li a {color: #d8040c;} /* =5. NAVIGATION */ div#navigation {position: absolute; top: 23px; left: 92px;width: 824px; min-height: 36px; height: auto!important; height: 36px; float: left; z-index: 8; } div#navigation ul {padding: 0px 0px 0px 15px; height:29px;background: url(../images/global/header_nav_bg.png) repeat-x;} div#navigation ul li {float: left; height: 27px; margin: 0;} div#navigation ul li#navHome{} div#navigation ul li a{ display:block; height:27px; text-indent:-9999px;background: url('../images/global/navigation/navigation.gif') no-repeat; z-index: 9; position: relative;} div#navigation ul li#navHome a{ width:58px; background-position: -00px 0px; } div#navigation ul li#navHome a:hover { background-position: -0px -27px; } div#navigation ul li#navHome a.selected{ background-position: -0px -54px; } div#navigation ul li#navHome a:active{ background-position: -0px -54px; } div#navigation ul li#navKSwim a{ width:166px; background-position: -58px 0px; } div#navigation ul li#navKSwim a:hover { background-position: -58px -27px; } div#navigation ul li#navKSwim a.selected{ background-position: -58px -54px; } div#navigation ul li#navKSwim a:active{ background-position: -58px -54px; } div#navigation ul li#navTeam a{ width:160px; background-position: -224px 0px ; } div#navigation ul li#navTeam a:hover { background-position: -224px -27px; } div#navigation ul li#navTeam a.selected{ background-position: -224px -54px; } div#navigation ul li#navTeam a:active{ background-position: -224px -54px; } div#navigation ul li#navChallenge a{ width:85px; background-position: -384px 0px; } div#navigation ul li#navChallenge a:hover { background-position: -384px -27px; } div#navigation ul li#navChallenge a.selected{ background-position: -384px -54px; } div#navigation ul li#navChallenge a:active{ background-position: -384px -54px; } div#navigation ul li#navPool a{ width:105px;background-position: -469px 0px; } div#navigation ul li#navPool a:hover { background-position: -469px -27px; } div#navigation ul li#navPool a.selected{ background-position: -469px -54px; } div#navigation ul li#navPool a:active{ background-position: -469px -54px; } div#subnav {position: absolute; left: -0px; top: 46px; min-height: 28px; height: auto!important; height: 28px; width: 808px; padding-left: 108px; background: #fff; filter:alpha(opacity=80); -moz-opacity:.80; opacity:.80; z-index: 7;} div#subnav ul li {float: left; margin-top: 10px; padding:0 10px; border-right: 1px solid #666666; text-transform:capitalize; } div#subnav ul li a { text-decoration:none; color:#333; font-weight:normal; font-size: 1.1em; } div#subnav ul li a:hover { color:#000; } div#subnav ul li a#selected { color:#000; font-weight:bold; } /* =6. CONTENT */ div#content {width: 916px; margin: auto;} /* BANNERS */ div#banner {margin: auto; width: 916px; margin-bottom: 17px; z-index: 1;} #page-home div#banner {height: 365px; margin-bottom: 0;} #page-home div#banner h1 a { display:block; width:916px; height:364px; background: url(../images/home/banner.jpg) no-repeat left top; text-indent:-9999px; } #page-kelloggsandswimming div#banner {height: 303px; background: url(../images/kelloggs-and-swimming/banner.jpg) no-repeat; text-indent: -9999px; } #page-kelloggsandswimming.asa div#banner {height: 250px; background: url(../images/kelloggs-and-swimming/asa/banner.jpg) no-repeat; text-indent: -9999px; } #page-kelloggsandswimming.swim-active div#banner {height: 247px; background: url(../images/kelloggs-and-swimming/swim-active/banner.jpg) no-repeat; text-indent: -9999px; } #page-kelloggsandswimming.swimtastic-awards div#banner {height: 220px; background: url(../images/kelloggs-and-swimming/swimtastic-awards/banner.jpg) no-repeat; text-indent: -9999px; } #page-poollocator div#banner {height: 401px; background: url(../images/pool-locator/banner.jpg) no-repeat; text-indent: -9999px; } #page-swimchallenge div#banner {height: 265px; background: url(../images/swim-challenge/banner.jpg) no-repeat; text-indent: -9999px; } #page-teamkelloggs div#banner {height: 303px; background: url(../images/team-kelloggs/landing/banner.jpg) no-repeat; text-indent: -9999px; } #page-teamkelloggs.profile-olivia div#banner {height: 420px; background: url(../images/team-kelloggs/profile/banner-olivia.jpg) no-repeat; text-indent: -9999px; } #page-teamkelloggs.profile-nick div#banner {height: 420px; background: url(../images/team-kelloggs/profile/banner-nick.jpg) no-repeat;text-indent: -9999px; } #page-teamkelloggs.profile-sam div#banner {height: 420px; background: url(../images/team-kelloggs/profile/banner-sam.jpg) no-repeat; text-indent: -9999px; } #page-teamkelloggs.profile-cassie div#banner {height: 444px; background: url(../images/team-kelloggs/profile/banner-cassie.jpg) no-repeat; text-indent: -9999px; } /* “LOZENGES” */ div.lozenge {width: 274px; background: url(../images/global/lozenge_tile.jpg) repeat-y;} div.lozenge div.lozenge-inner {width: 274px; background: url(../images/global/lozenge_bg.jpg) no-repeat; min-height: 99px; height: auto!important; height: 99px;} div.lozenge div.lozenge-inner {width: 274px; background: url(../images/global/lozenge_bg.jpg) no-repeat; min-height: 99px; height: auto!important; height: 99px;} div.lozenge div.lozenge-bottom {width: 274px; height: 7px; background: url(../images/global/lozenge_bottom.jpg) no-repeat; font-size: 0;} div.orange, div.orange div.lozenge-inner, div.orange div.lozenge-bottom {background-position: -274px 0;} div.blue, div.blue div.lozenge-inner, div.blue div.lozenge-bottom {background-position: -548px 0;} div.red, div.red div.lozenge-inner, div.red div.lozenge-bottom {background-position: -822px 0;} /* COLUMN WIDTHS*/ div#primary {width: 550px; float: left; margin-left: 18px; padding-right: 18px; border-right: 1px solid #d7ecf9; display: inline;} div#sidebar {width: 298px; float: right; display: inline; margin-right: 18px;} /* WHEN PRIMARY COLUMN IS *EVEN* WIDER */ .alt div#primary {width: 652px; float: left; margin-left: 18px; padding-right: 18px; border-right: 1px solid #d7ecf9; display: inline;} .alt div#sidebar {width: 190px; float: right; margin-right: 18px;} div#sidebar div.sidebar-bg, div#sidebar2 div.sidebar-bg {background: url(../images/kelloggs-and-swimming/swim-active/sidebar_bg.jpg) repeat-x; width: 272px; padding: 0 9px; margin: 0 0 0 5px; min-height: 48px; height:auto!important; min-height: 48px;} div#sidebar div.sidebar-bg img {margin: auto;} /* =6.1. HOME */ #page-home div#tickerContainer {position:absolute; left:108px; overflow:hidden; width:805px;} #home-page div#banner {position: relative; text-indent: 9999px;} #home-page div#banner div#banner-holder {display: block; height: 100%; width: 100%; z-index: 2;} #page-home div#newsticker {width: 916px; margin: auto; min-height: 33px; height: auto!important; height: 33px; position: relative; margin-bottom: 2px;} #page-home div#newsticker h2 {width: 108px; height: 33px; background: url(../images/home/newsticker_ends.gif); position: absolute; left: 0; text-indent: -9999px;} #page-home div#newsticker #tickerEnd {width: 6px; height: 33px; background: url(../images/home/newsticker_ends.gif) -108px 0; position: absolute; right: 0;} #page-home div#newsticker ul {width: 10000px; min-height: 33px; height: auto!important; height: 33px; overflow: hidden; float: left; margin: 0 0 0 0px; background: url(../images/home/newsticker_bg.gif) repeat-x; display: inline;} #page-home div#newsticker ul li {float: left; clear: both; padding-top:8px; } #page-home div#newsticker ul li .tickerItem { padding-right: 30px; line-height:14px; float: left;} #page-home div#newsticker ul li .more { background-image:url(../images/global/button_more.gif); display:block; float:left; width:52px; height:17px; } #page-home div#mainpromo { width: 449px; min-height: 198px; height: auto!important; height: 198px; background: url(../images/home/main_promo_bg.jpg) no-repeat; float: left; margin-right: 5px;} #page-home div#mainpromo h2 { display:block; width:175px; height:27px; background:transparent url(../images/home/main_promo_title.jpg) no-repeat left top; text-indent:-9999px; } #page-home div#mainpromo p { float:left; margin:127px 0 0 13px; width:245px; font-size:1.1em; } #page-home div#mainpromo a { display:block; float:left; margin:133px 0 0 18px; width:122px; height:17px; background: url(../images/home/main_promo_link.gif) no-repeat left bottom; text-indent:-9999px; } #page-home div#pod-diaries {width: 228px; float: left; margin-right: 7px; background:transparent url(../images/home/pod_diaries_bg_repeat.jpg) repeat-y left top; } #page-home div#pod-diaries h2 {width: 228px; height: 101px; background: url(../images/home/pod_diaries_bg.jpg) no-repeat left top; text-indent: -9999px; margin-bottom: 9px;} #page-home div#pod-diaries div#pod-diaries-quotes {width: 228px; min-height: 50px; height: auto!important; height: 50px; margin-top:-74px; margin-bottom: 6px;} #page-home div#pod-diaries div#pod-diaries-quotes blockquote {margin: 0 10px 0 13px; font-size: 1.1em; line-height: 1.3em; padding-top: 16px;} #page-home div#pod-diaries a {display: block; height: 96px; width: 228px; background: url(../images/home/pod_diaries_link.jpg); text-indent: -9999px; font-size: 1px;} #page-home div#pod-didyouknow {width: 227px; background: url(../images/home/pod_didyouknow_tile.gif); float: left; margin-bottom: 2px; text-align: center; } #page-home div#pod-didyouknow h2 { width: 227px; height: 30px; background: url(../images/home/pod_didyouknow_bg.gif); text-indent: -9999px; float: left;} #page-home div#pod-didyouknow ul {margin: 0 6px 12px 4px; } #page-home div#pod-didyouknow ul li {font-size: 1.3em; color: #fff; text-transform: uppercase; font-family: "Avant Garde", "Century Gothic", "Helvetica", "Arial"; line-height: 1.3em;} #page-home div#pod-find { width: 227px; background: url(../images/home/pod_find_tile.gif); float: left;} #page-home div#pod-find h2 {width: 227px; height: 30px; background: url(../images/home/pod_find_bg.gif); text-indent: -9999px; float: left; } #page-home div#pod-find div {width: 227px; height: 11px; background: url(../images/home/pod_find_bg.gif) 0 -30px; font-size: 1px;} #page-home div#pod-find label { margin:0 0 5px 22px; font-size:1.1em; float: left;} #page-home div#pod-find #location { margin:5px 0 5px 22px; float:left; } #page-home div#pod-find #submit { display:block; float:left; width:17px; height:17px; margin:8px 0 0 8px; text-indent:-9999px; } /* =6.2. KELLOGG’S AND SWIMMING */ #page-kelloggsandswimming div#primary p.intro { margin-bottom: 18px;} #page-kelloggsandswimming div#primary p span { color:#0072B9; font-size:1.2em; } #page-kelloggsandswimming div#primary strong a:hover {color: #009dff; text-decoration: none;} #page-kelloggsandswimming div#primary div#swim4life {margin-top: 30px; border-top: 1px dotted #ccc; padding: 30px 0; position: relative;} #page-kelloggsandswimming div#primary div#swim4life p { padding-left: 200px; padding-top:18px; } #page-kelloggsandswimming div#primary div#swim4life p img {position: absolute; top:38px; left: 0;} #page-kelloggsandswimming div#primary div#swim4life p a {color: #666; font-weight: normal;} #page-kelloggsandswimming div#primary div#swim4life p a:hover {text-decoration: none;} #page-kelloggsandswimming div#sidebar ul li {width: 306px; height: 79px; } #page-kelloggsandswimming div#sidebar ul li h3 {display: none;} #page-kelloggsandswimming div#sidebar ul li a {display: block; width: 100%; height: 100%; text-indent: -9999px;} #page-kelloggsandswimming div#sidebar ul li a{background: url(../images/kelloggs-and-swimming/landing/pods.gif) no-repeat; width: 306px; height: 79px;} #page-kelloggsandswimming div#sidebar ul li#pod_swim_active a{} #page-kelloggsandswimming div#sidebar ul li#pod_swim_active a:hover {background-position: -306px 0;} #page-kelloggsandswimming div#sidebar ul li#pod_asa a{background-position: 0 -79px;} #page-kelloggsandswimming div#sidebar ul li#pod_asa a:hover{background-position: -306px -79px;} #page-kelloggsandswimming div#sidebar ul li#pod_swimtastic a{background-position: 0 -158px;} #page-kelloggsandswimming div#sidebar ul li#pod_swimtastic a:hover{background-position: -306px -158px;} /* =6.2.1. SWIM ACTIVE */ #page-kelloggsandswimming.swim-active div#primary div.wrap {position: relative; top: -30px; margin-bottom: -30px;} #page-kelloggsandswimming.swim-active div#primary div#main {margin-top: 20px; padding: 20px 0 0 0;} #page-kelloggsandswimming.swim-active div#primary div#main h2 {margin-bottom: 5px;} #page-kelloggsandswimming.swim-active div#sidebar {width: 302px; margin-right: 16px;} #page-kelloggsandswimming.swim-active div#sidebar h2#title-westmidlands {width:302px; height: 42px; background: url(../images/kelloggs-and-swimming/swim-active/title_sidebar.jpg); text-indent: -9999px;} #page-kelloggsandswimming.swim-active div#sidebar h2#title-southwest {width:302px; height: 42px; background: url(../images/kelloggs-and-swimming/swim-active/title_southwest.jpg); text-indent: -9999px;} #page-kelloggsandswimming.swim-active div#sidebar div#sidebar-photo {margin: -10px 0 10px -3px; } #page-kelloggsandswimming.swim-active #main {margin-bottom: 10px;} #page-kelloggsandswimming.swim-active #watch_video{ width:548px; height:332px;background: url(../images/kelloggs-and-swimming/swim-active/watch_programme_holder.jpg) no-repeat; margin:10px 0;} #page-kelloggsandswimming.swim-active div#photos {padding-right: 290px; background: url(../images/kelloggs-and-swimming/swim-active/photos.jpg) no-repeat top right; min-height: 284px; height: auto!important; height: 284px;} #page-kelloggsandswimming.swim-active #video a { display:block; width:550; height:330px; text-indent:-9999px; background:transparent url(../images/kelloggs-and-swimming/swim-active/video-alt.jpg) no-repeat left top; } /* =6.2.2. ASA */ #page-kelloggsandswimming.asa div#primary div.wrap {position: relative; top: -30px; margin-bottom: -30px;} #page-kelloggsandswimming.asa div#primary div#latest-news {margin-top: 20px; border-top: 1px dotted #ccc; padding: 20px 0;} #page-kelloggsandswimming.asa div#primary div#latest-news h2 {margin-bottom: 22px;} #page-kelloggsandswimming.asa div#primary div#latest-news ul li {border-bottom: 1px dotted #ccc; padding: 8px 0 8px 0px; position: relative; float: left; clear: both; width: 100%; } /* When images are available then: padding: 8px 0 8px 0px; */ #page-kelloggsandswimming.asa div#primary div#latest-news ul li h3 {color: #0072b9; text-transform: uppercase; font-size: 1.4em; font-weight: normal; margin-top: 12px;} #page-kelloggsandswimming.asa div#primary div#latest-news ul li small {margin-bottom: 8px; display: block;} #page-kelloggsandswimming.asa div#primary div#latest-news ul li img {position: absolute; top: 8px; left: 0; background: #0072b9;} #page-kelloggsandswimming.asa div#primary div#latest-news ul li p {margin: 0;} #page-kelloggsandswimming.asa div#primary div#latest-news ul li a { display:block; width:52px; height:19px; float:right; background:transparent url(../images/kelloggs-and-swimming/asa/more-button.jpg) no-repeat left top; text-indent:-9999px; clear: both; margin-bottom: 10px;} #page-kelloggsandswimming.asa #asa_logo{ text-align:center;padding:10px 20px 10px 0; } #page-kelloggsandswimming.asa #latest-news-pagination{ text-align:center; } #page-kelloggsandswimming.asa #latest-news-pagination ul{ height:18px; margin: 0 auto; text-align:center;} #page-kelloggsandswimming.asa #latest-news-pagination ul li{ height:18px; line-height:18px; width:18px;display:inline; } #page-kelloggsandswimming.asa #latest-news-pagination ul li a{ display:inline-block; height:18px; width:18px;cursor:pointer;font-weight:normal; color:#666666; } #page-kelloggsandswimming.asa #latest-news-pagination ul li.current a{ text-decoration:underline; } #page-kelloggsandswimming.asa #latest-news-pagination ul li.prev a, #page-kelloggsandswimming.asa #latest-news-pagination ul li.next a{ text-indent:-9999px;} #page-kelloggsandswimming.asa #latest-news-pagination ul li.prev a{ background: url(../images/global/button_back.gif) no-repeat; } #page-kelloggsandswimming.asa #latest-news-pagination ul li.next a{ background: url(../images/global/button_next.gif) no-repeat; } #page-kelloggsandswimming.asa div#sidebar div#sidebar-logo {margin: 0 auto 20px auto;} #page-kelloggsandswimming.asa div#sidebar div#sidebar-photo {margin: -10px auto 10px auto;} /* =6.2.3. SWIMTASTIC AWARDS */ #page-kelloggsandswimming.swimtastic-awards div#primary {border: 0; margin-top: -14px;} #page-kelloggsandswimming.swimtastic-awards div#primary div.wrap {position: relative; top: 0px; margin-bottom: 0px;} #page-kelloggsandswimming.swimtastic-awards #main {margin-bottom: 10px;} #page-kelloggsandswimming.swimtastic-awards #watch_video{ width:548px; height:332px;background: url(../images/kelloggs-and-swimming/swim-active/watch_programme_holder.jpg) no-repeat; margin:10px 0;} #page-kelloggsandswimming.swimtastic-awards div#sidebar {width: 313px; margin-right: 16px;} #page-kelloggsandswimming.swimtastic-awards div#sidebar p {font-size: 1.2em; line-height: 17px; margin-bottom: 17px;} #page-kelloggsandswimming.swimtastic-awards div#sidebar p.intro {color: #0072b9; font-size: 1.4em; line-height: 17px;} #page-kelloggsandswimming.swimtastic-awards div#sidebar h2 {width:302px; height: 42px; background: url(../images/kelloggs-and-swimming/swimtastic-awards/title_sidebar.jpg); text-indent: -9999px;} #page-kelloggsandswimming.swimtastic-awards div#sidebar div#sidebar-photo {width: 312px; height: 132px; background: url(../images/kelloggs-and-swimming/swimtastic-awards/sidebar_photo.png); margin: -5px 0 10px -20px; display: block!important; display:none;} #page-kelloggsandswimming.swimtastic-awards div#sidebar form {width: 246px; clear: both; float: left; margin-bottom: 10px;} #page-kelloggsandswimming.swimtastic-awards div#sidebar form input.text {width: 100%;} #page-kelloggsandswimming.swimtastic-awards div#sidebar form input#submit {float: right;} #page-kelloggsandswimming.swimtastic-awards div#sidebar div.sidebar_intro p.word_icon{font-size:1.2em; padding-left:32px; background: url(../images/kelloggs-and-swimming/swimtastic-awards/word_icon.jpg) no-repeat;min-height:30px; height: auto !important; height:30px; } #page-kelloggsandswimming.swimtastic-awards div#sidebar div.sidebar_contact{float: left; clear: both; border-top: 1px dotted #ccc; padding-top: 10px; width: 100%;} #page-kelloggsandswimming.swimtastic-awards div#sidebar div.sidebar_contact p{ } #page-kelloggsandswimming.swimtastic-awards div#sidebar div#sidebar-details {float: left; clear: both; border-top: 1px dotted #ccc; padding-top: 10px; width: 100%; } #page-kelloggsandswimming.swimtastic-awards div#sidebar div#sidebar-details p { line-height:1.4em; } #page-kelloggsandswimming.swimtastic-awards div#sidebar div#sidebar-details p#closing {padding: 6px; background: #d75757; color: #fff; font-size: 1.4em; line-height:1.1em; } #page-kelloggsandswimming.swimtastic-awards div#secondary {clear: both; float: left; margin: 0 16px; display: inline; border-top: 1px dotted #ccc; padding-top: 10px; width: 880px;} #page-kelloggsandswimming.swimtastic-awards div#secondary div.lozenge, #page-kelloggsandswimming.swimtastic-awards div#secondary div.lozenge * {background: none;} #page-kelloggsandswimming.swimtastic-awards div#secondary div.intro{ padding:10px 0 10px 320px; background: url(../images/kelloggs-and-swimming/swimtastic-awards/awards_image.jpg) no-repeat; min-height:145px; height:auto !important; height: 145px;} #page-kelloggsandswimming.swimtastic-awards div#secondary div.intro h2{ padding-bottom: 10px; } #page-kelloggsandswimming.swimtastic-awards div#secondary div.left {float: left; width: 550px; margin: 0!important;} #page-kelloggsandswimming.swimtastic-awards div#secondary div.left div.wide {float: left; margin-bottom: 18px; position: relative; display: inline; clear: both;} #page-kelloggsandswimming.swimtastic-awards div#secondary div.left div.wide div.lozenge-inner {padding-top: 48px;background: url(../images/kelloggs-and-swimming/swimtastic-awards/pod_wide_top.png); width: 550px;} #page-kelloggsandswimming.swimtastic-awards div#secondary div.left div.wide div.lozenge-inner div.copy {float: left; width:320px; margin-left: 11px; display: inline;} #page-kelloggsandswimming.swimtastic-awards div#secondary div.left div.wide div.lozenge-bottom {width: 550px; background: url(../images/kelloggs-and-swimming/swimtastic-awards/pod_wide_bottom.png); width: 550px; height: 28px;} #page-kelloggsandswimming.swimtastic-awards div#secondary div.left div.orange div.lozenge-inner {padding-top: 38px;background: url(../images/kelloggs-and-swimming/swimtastic-awards/pod_wide_top.png) -550px 0; width: 550px;} #page-kelloggsandswimming.swimtastic-awards div#secondary div.left div.orange div.lozenge-bottom {width: 550px; background: url(../images/kelloggs-and-swimming/swimtastic-awards/pod_wide_bottom.png) -550px 0; width: 550px; height: 28px;} #page-kelloggsandswimming.swimtastic-awards div#secondary div.right {width: 313px; float: right; margin: 0px;} #page-kelloggsandswimming.swimtastic-awards div#secondary div.right div.lozenge {width: 313px; margin: auto 0;} #page-kelloggsandswimming.swimtastic-awards div#secondary div.right div.lozenge {float: left; margin-bottom: 18px; position: relative; display: inline; clear: both;} #page-kelloggsandswimming.swimtastic-awards div#secondary div.right div.lozenge div.lozenge-inner {padding-top: 38px;background: url(../images/kelloggs-and-swimming/swimtastic-awards/pod_narrow_top.png); width: 313px;} #page-kelloggsandswimming.swimtastic-awards div#secondary div.right div.lozenge div.lozenge-inner div.copy {float: left; width: 290px;} #page-kelloggsandswimming.swimtastic-awards div#secondary div.right div.lozenge div.lozenge-bottom {width: 313px; background: url(../images/kelloggs-and-swimming/swimtastic-awards/pod_narrow_bottom.png); width: 313px; height: 28px;} #page-kelloggsandswimming.swimtastic-awards div#secondary div.right div.orange div.lozenge-inner {padding-top: 38px;background: url(../images/kelloggs-and-swimming/swimtastic-awards/pod_narrow_top.png) -313px 0; width: 313px;} #page-kelloggsandswimming.swimtastic-awards div#secondary div.right div.orange div.lozenge-bottom {width: 313px; background: url(../images/kelloggs-and-swimming/swimtastic-awards/pod_narrow_bottom.png) -313px 0; width: 313px; height: 28px;} #page-kelloggsandswimming.swimtastic-awards div#secondary div div div div.wrap {padding: 0 11px; } #page-kelloggsandswimming.swimtastic-awards div#secondary div div div.lozenge-inner div.copy p {line-height: 16px;} #page-kelloggsandswimming.swimtastic-awards div#secondary div div div.lozenge-inner div.copy p.intro {font-size: 1.4em; line-height: 18px;} #page-kelloggsandswimming.swimtastic-awards div#secondary div div div.lozenge-inner div.photo {float: left; margin: 0px 0 20px 0; display: inline;} #page-kelloggsandswimming.swimtastic-awards div#secondary div div div.lozenge-inner div.photo#photo_a {background: url(../images/kelloggs-and-swimming/swimtastic-awards/photo_a.jpg); width: 182px; height: 273px;} #page-kelloggsandswimming.swimtastic-awards div#secondary div div div.lozenge-inner div.photo#photo_b {background: url(../images/kelloggs-and-swimming/swimtastic-awards/photo_b.jpg); width: 182px; height: 273px;} #page-kelloggsandswimming.swimtastic-awards div#secondary div div div.lozenge-inner div.photo#photo_c {background: url(../images/kelloggs-and-swimming/swimtastic-awards/photo_c.jpg); width: 181px; height: 273px;} #page-kelloggsandswimming.swimtastic-awards div#secondary div div div.lozenge-inner div.photo#photo_d {background: url(../images/kelloggs-and-swimming/swimtastic-awards/photo_d.jpg); width: 290px; height: 207px;} #page-kelloggsandswimming.swimtastic-awards div#secondary div div div.lozenge-inner div.photo#photo_e {background: url(../images/kelloggs-and-swimming/swimtastic-awards/photo_e.jpg); width: 290px; height: 193px;} #page-kelloggsandswimming.swimtastic-awards div#secondary div.lozenge h3 {position: absolute; top: -8px; left: -6px; text-indent: -9999px;} #page-kelloggsandswimming.swimtastic-awards div#secondary div.lozenge#pod_a h3 {background: url(../images/kelloggs-and-swimming/swimtastic-awards/banner_a.png) no-repeat; width: 561px; height: 84px;} #page-kelloggsandswimming.swimtastic-awards div#secondary div.lozenge#pod_b h3 {background: url(../images/kelloggs-and-swimming/swimtastic-awards/banner_b.png) no-repeat; width: 561px; height: 83px;} #page-kelloggsandswimming.swimtastic-awards div#secondary div.lozenge#pod_c h3 {background: url(../images/kelloggs-and-swimming/swimtastic-awards/banner_c.png) no-repeat; width: 563px; height: 83px;} #page-kelloggsandswimming.swimtastic-awards div#secondary div.lozenge#pod_d h3 {background: url(../images/kelloggs-and-swimming/swimtastic-awards/banner_d.png) no-repeat; width: 325px; height: 83px;} #page-kelloggsandswimming.swimtastic-awards div#secondary div.lozenge#pod_e h3 {background: url(../images/kelloggs-and-swimming/swimtastic-awards/banner_e.png) no-repeat; width: 325px; height: 83px;} /* #page-kelloggsandswimming.swimtastic-awards div#swim4life-container { margin-left:30px; float:left; width:400px; background:transparent url(../images/kelloggs-and-swimming/swimtastic-awards/swim4life-logo.gif) no-repeat left 51px; float: left; border: 1px solid red;} #page-kelloggsandswimming.swimtastic-awards div#swim4life-container p { display:block; padding:54px 0 54px 203px; width:328px; } */ #page-kelloggsandswimming.swimtastic-awards div#swim4life {margin-top: 00px; margin-left: 0!important; margin-left: 30px; padding: 0 30px 30px 30px; position: relative; width: 500px; float: left; } #page-kelloggsandswimming.swimtastic-awards div#swim4life p { padding-left: 200px; padding-top:12px; } #page-kelloggsandswimming.swimtastic-awards div#swim4life p img {position: absolute; top:8px; left: 30px;} #page-kelloggsandswimming.swimtastic-awards div#swim4life p a {color: #666; font-weight: normal;} #page-kelloggsandswimming.swimtastic-awards div#swim4life p a:hover {text-decoration: none;} #page-kelloggsandswimming.swimtastic-awards #video a { display:block; width:550; height:330px; text-indent:-9999px; background:transparent url(../images/kelloggs-and-swimming/swimtastic-awards/video-alt.jpg) no-repeat left top; } /* =6.3. MEET TEEM KELLOGG’S */ /* =6.3.1. LANDING PAGE */ #page-teamkelloggs.landing div#primary { margin-bottom:25px; } #page-teamkelloggs.landing div#primary div.wrap {position: relative; margin-bottom: -17px;} #page-teamkelloggs.landing div#primary div.wrap #main { margin-top:32px; } #page-teamkelloggs.landing div#primary div.chat-box { margin-bottom:8px; } #page-teamkelloggs.landing div#primary div.chat-box p { margin:0; font-size: 1.4em;} #page-teamkelloggs.landing div#primary div.chat-box p.date { color:#666; font-size:1.1em; margin-top:11px; } #page-teamkelloggs.landing div#primary div.chat-box div.boxred p { color:#fff; } #page-teamkelloggs.landing div#primary div.chat-box div.boxred p.date { color:#fff; } #page-teamkelloggs.landing div#primary div.chat-box div.box-content { padding:11px; min-height:62px; } #page-teamkelloggs.landing div#primary div.left img { float:left; } #page-teamkelloggs.landing div#primary div.right img { float:right; } #page-teamkelloggs.landing div#primary div.left div.boxblue { position:relative; float:left; width:278px; margin-left:10px; color:#333; } #page-teamkelloggs.landing div#primary div.left div.boxblue div.arrow { position:absolute; top:19px; left:-8px; width:8px; height:13px; } #page-teamkelloggs.landing div#primary div.right div.boxblue { position:relative; float:right; width:278px; margin-right:10px; color:#333; } #page-teamkelloggs.landing div#primary div.right div.boxblue div.arrow { position:absolute; top:19px; left:278px; width:8px; height:13px; } #page-teamkelloggs.landing div#primary div.chat-box div.boxblue { background:#7ed3f7 url(../images/team-kelloggs/landing/chat-box-blue-top.gif) no-repeat left top; } #page-teamkelloggs.landing div#primary div.chat-box div.boxblue div.box-content { background:transparent url(../images/team-kelloggs/landing/chat-box-blue-bottom.gif) no-repeat left 100%; } #page-teamkelloggs.landing div#primary div.left div.boxblue div.arrow { background:transparent url(../images/team-kelloggs/landing/chat-box-blue-arrow-left.gif) no-repeat left top; } #page-teamkelloggs.landing div#primary div.right div.boxblue div.arrow { background:transparent url(../images/team-kelloggs/landing/chat-box-blue-arrow-right.gif) no-repeat left top; } #page-teamkelloggs.landing div#primary div.left div.boxyellow { position:relative; float:left; width:278px; margin-left:10px; color:#333; } #page-teamkelloggs.landing div#primary div.left div.boxyellow div.arrow { position:absolute; top:19px; left:-8px; width:8px; height:13px; } #page-teamkelloggs.landing div#primary div.right div.boxyellow { position:relative; float:right; width:278px; margin-right:10px; color:#333; } #page-teamkelloggs.landing div#primary div.right div.boxyellow div.arrow { position:absolute; top:19px; left:278px; width:8px; height:13px; } #page-teamkelloggs.landing div#primary div.chat-box div.boxyellow { background:#feef39 url(../images/team-kelloggs/landing/chat-box-yellow-top.gif) no-repeat left top; } #page-teamkelloggs.landing div#primary div.chat-box div.boxyellow div.box-content { background:transparent url(../images/team-kelloggs/landing/chat-box-yellow-bottom.gif) no-repeat left 100%; } #page-teamkelloggs.landing div#primary div.left div.boxyellow div.arrow { background:transparent url(../images/team-kelloggs/landing/chat-box-yellow-arrow-left.gif) no-repeat left top; } #page-teamkelloggs.landing div#primary div.right div.boxyellow div.arrow { background:transparent url(../images/team-kelloggs/landing/chat-box-yellow-arrow-right.gif) no-repeat left top; } #page-teamkelloggs.landing div#primary div.left div.boxred { position:relative; float:left; width:278px; margin-left:10px; color:#333; } #page-teamkelloggs.landing div#primary div.left div.boxred div.arrow { position:absolute; top:19px; left:-8px; width:8px; height:13px; } #page-teamkelloggs.landing div#primary div.right div.boxred { position:relative; float:right; width:278px; margin-right:10px; color:#333; } #page-teamkelloggs.landing div#primary div.right div.boxred div.arrow { position:absolute; top:19px; left:278px; width:8px; height:13px; } #page-teamkelloggs.landing div#primary div.chat-box div.boxred { background:#ee4b50 url(../images/team-kelloggs/landing/chat-box-red-top.gif) no-repeat left top; } #page-teamkelloggs.landing div#primary div.chat-box div.boxred div.box-content { background:transparent url(../images/team-kelloggs/landing/chat-box-red-bottom.gif) no-repeat left 100%; } #page-teamkelloggs.landing div#primary div.left div.boxred div.arrow { background:transparent url(../images/team-kelloggs/landing/chat-box-red-arrow-left.gif) no-repeat left top; } #page-teamkelloggs.landing div#primary div.right div.boxred div.arrow { background:transparent url(../images/team-kelloggs/landing/chat-box-red-arrow-right.gif) no-repeat left top; } #page-teamkelloggs.landing div#primary div.left div.boxorange { position:relative; float:left; width:278px; margin-left:10px; color:#333; } #page-teamkelloggs.landing div#primary div.left div.boxorange div.arrow { position:absolute; top:19px; left:-8px; width:8px; height:13px; } #page-teamkelloggs.landing div#primary div.right div.boxorange { position:relative; float:right; width:278px; margin-right:10px; color:#333; } #page-teamkelloggs.landing div#primary div.right div.boxorange div.arrow { position:absolute; top:19px; left:278px; width:8px; height:13px; } #page-teamkelloggs.landing div#primary div.chat-box div.boxorange { background:#f4ac32 url(../images/team-kelloggs/landing/chat-box-orange-top.gif) no-repeat left top; } #page-teamkelloggs.landing div#primary div.chat-box div.boxorange div.box-content { background:transparent url(../images/team-kelloggs/landing/chat-box-orange-bottom.gif) no-repeat left 100%; } #page-teamkelloggs.landing div#primary div.left div.boxorange div.arrow { background:transparent url(../images/team-kelloggs/landing/chat-box-orange-arrow-left.gif) no-repeat left top; } #page-teamkelloggs.landing div#primary div.right div.boxorange div.arrow { background:transparent url(../images/team-kelloggs/landing/chat-box-orange-arrow-right.gif) no-repeat left top; } #page-teamkelloggs.landing div#sidebar { width: 302px; margin-right: 16px; } #page-teamkelloggs.landing div#sidebar h2 {width:302px; height: 42px; background: url(../images/team-kelloggs/landing/title_sidebar.jpg); text-indent: -9999px;} #page-teamkelloggs.landing div#sidebar div.sidebar-bg {background: url(../images/team-kelloggs/landing/sidebar_bg.jpg);} #page-teamkelloggs.landing div#sidebar ul { margin:11px 0 0 4px; } #page-teamkelloggs.landing div#sidebar ul li a { display:block; width: 298px; height: 55px; margin-bottom: 0px; text-indent:-9999px; background: url(../images/team-kelloggs/landing/pods.gif);} #page-teamkelloggs.landing div#sidebar ul li#side-link-olivia a {background-position: 0 0;} #page-teamkelloggs.landing div#sidebar ul li#side-link-cassie a {background-position: 0 -55px;} #page-teamkelloggs.landing div#sidebar ul li#side-link-nick a {background-position: 0 -110px;} #page-teamkelloggs.landing div#sidebar ul li#side-link-sam a {background-position: 0 -165px;} #page-teamkelloggs.landing div#sidebar ul li#side-link-olivia a:hover {background-position: -298px 0;} #page-teamkelloggs.landing div#sidebar ul li#side-link-cassie a:hover {background-position: -298px -55px;} #page-teamkelloggs.landing div#sidebar ul li#side-link-nick a:hover {background-position: -298px -110px;} #page-teamkelloggs.landing div#sidebar ul li#side-link-sam a:hover {background-position: -298px -165px;} #page-teamkelloggs div#sidebar #pod-pool-locator { display:block; margin:20px 0; width:308px; height:91px; background:transparent url(../images/global/pod-pool-locator.jpg) no-repeat left top; text-indent:-9999px; } #page-teamkelloggs div#sidebar #pod-asa { display:block; width:308px; height:81px; background:transparent url(../images/global/pod-asa.jpg) no-repeat left top; text-indent:-9999px; } #page-teamkelloggs.landing div#primary div.wrap a#recent { margin:38px 0 19px 0; display:block; float:left; width:57px; height:17px; text-indent:-9999px; background:transparent url(../images/team-kelloggs/landing/btn-recent.gif) no-repeat left top; } #page-teamkelloggs.landing div#primary div.wrap a#earlier { margin:38px 0 19px 0; display:block; float:right; width:58px; height:17px; text-indent:-9999px; background:transparent url(../images/team-kelloggs/landing/btn-earlier.gif) no-repeat left top; } /* =6.3.2. PROFILE PAGE */ #page-teamkelloggs div#banner a { display:block; position:absolute; width:208px; height:29px; top:121px; left:694px; text-indent:-9999px; background:transparent url(../images/team-kelloggs/profile/twitter-link.jpg) no-repeat left top; } #page-teamkelloggs div#sidebar div.chat-box { margin-bottom:5px; width:278px; margin-left:-3px;} #page-teamkelloggs div#sidebar div.chat-box p { margin:0; } #page-teamkelloggs div#sidebar div.chat-box p.date { color:#666; font-size:1.1em; margin-top:11px; } #page-teamkelloggs div#sidebar div.chat-box div.red p { color:#fff; } #page-teamkelloggs div#sidebar div.chat-box div.red p.date { color:#fff; } #page-teamkelloggs div#sidebar div.chat-box div.box-content { padding:11px 11px 0 11px; min-height:62px; } #page-teamkelloggs div#sidebar div.chat-box div.box { position:relative; } #page-teamkelloggs div#sidebar div.chat-box div.box div.arrow { position:absolute; top:19px; left:-8px; width:8px; height:13px; } #page-teamkelloggs div#sidebar div.chat-box div.orange { background:transparent url(../images/team-kelloggs/profile/chat-box-orange-top.png) no-repeat left top; } #page-teamkelloggs div#sidebar div.left div.orange div.arrow { background:transparent url(../images/team-kelloggs/profile/chat-box-orange-arrow.png) no-repeat left top; } #page-teamkelloggs div#sidebar div.chat-box div.blue { background:transparent url(../images/team-kelloggs/profile/chat-box-blue-top.png) no-repeat left top; } #page-teamkelloggs div#sidebar div.left div.blue div.arrow { background:transparent url(../images/team-kelloggs/profile/chat-box-blue-arrow.png) no-repeat left top; } #page-teamkelloggs div#sidebar div.chat-box div.yellow { background:transparent url(../images/team-kelloggs/profile/chat-box-yellow-top.png) no-repeat left top; } #page-teamkelloggs div#sidebar div.left div.yellow div.arrow { background:transparent url(../images/team-kelloggs/profile/chat-box-yellow-arrow.png) no-repeat left top; } #page-teamkelloggs div#sidebar div.chat-box div.red { background: transparent url(../images/team-kelloggs/profile/chat-box-red-top.png) no-repeat left top; } #page-teamkelloggs div#sidebar div.left div.red div.arrow { background:transparent url(../images/team-kelloggs/profile/chat-box-red-arrow.png) no-repeat left top;} /* =6.3.2.1 OLIVIA */ #page-teamkelloggs.profile-olivia div#primary, #page-teamkelloggs.profile-olivia div#sidebar {position: relative; top: -215px; margin-bottom: -215px;} #page-teamkelloggs.profile-olivia div.wrap { padding:18px 0 0 0; } #page-teamkelloggs.profile-olivia div.wrap ul#stats { margin-bottom:46px; width:300px; font-size:1.2em; } #page-teamkelloggs.profile-olivia div.wrap ul#stats li { line-height:1.4em; margin-bottom:2px; } #page-teamkelloggs.profile-olivia div.wrap ul#stats li span { font-size:1.22em; color:#0072b9; } #page-teamkelloggs.profile-olivia div.wrap h3 { margin-bottom:3px; font-size:1.4em; font-weight:normal; color:#0072b9; } #page-teamkelloggs.profile-olivia div.wrap p { font-size:1.1em; line-height:1.2em; } #page-teamkelloggs.profile-olivia div#sidebar { width: 302px; margin-right: 16px; } #page-teamkelloggs.profile-olivia div#sidebar h2 {width:302px; height: 40px; background: url(../images/team-kelloggs/profile/sidebar_title_olivia.gif) no-repeat left top; text-indent: -9999px;} #page-teamkelloggs.profile-olivia div#sidebar div.chat-box div.chat-box-bottom { width:278px; height:6px; background:transparent url(../images/team-kelloggs/profile/chat-box-blue-bottom.png) no-repeat left top; } #page-teamkelloggs.profile-olivia div#sidebar a#recent { margin:2px 0 19px 0; display:block; float:left; width:57px; height:17px; text-indent:-9999px; background:transparent url(../images/team-kelloggs/landing/btn-recent.gif) no-repeat left top; } #page-teamkelloggs.profile-olivia div#sidebar a#earlier { margin:2px 0 19px 0; display:block; float:right; width:58px; height:17px; text-indent:-9999px; background:transparent url(../images/team-kelloggs/landing/btn-earlier.gif) no-repeat left top; } #page-teamkelloggs.profile-olivia div#sidebar h3 { margin:10px 0 0 0; width:302px; height: 40px; background: url(../images/team-kelloggs/profile/sidebar_title_achievements.gif) no-repeat left top; text-indent: -9999px;} #page-teamkelloggs.profile-olivia div#sidebar h4 { line-height:1.4em; font-size:1.2em; font-weight:bold; } #page-teamkelloggs.profile-olivia div#sidebar p { font-size:1.2em; font-weight:normal; } /* =6.3.2.2 NICK */ #page-teamkelloggs.profile-nick div#primary, #page-teamkelloggs.profile-nick div#sidebar {position: relative; top: -215px; margin-bottom: -215px;} #page-teamkelloggs.profile-nick div.wrap { padding:18px 0 0 0; } #page-teamkelloggs.profile-nick div.wrap ul#stats { margin-bottom:46px; width:300px; font-size:1.2em; } #page-teamkelloggs.profile-nick div.wrap ul#stats li { line-height:1.4em; margin-bottom:2px; } #page-teamkelloggs.profile-nick div.wrap ul#stats li span { font-size:1.22em; color:#0072b9; } #page-teamkelloggs.profile-nick div.wrap h3 { margin-bottom:3px; font-size:1.4em; font-weight:normal; color:#0072b9; } #page-teamkelloggs.profile-nick div.wrap p { font-size:1.1em; line-height:1.2em; } #page-teamkelloggs.profile-nick div#sidebar { width: 302px; margin-right: 16px; } #page-teamkelloggs.profile-nick div#sidebar h2 {width:302px; height: 40px; background: url(../images/team-kelloggs/profile/sidebar_title_nick.gif) no-repeat left top; text-indent: -9999px;} #page-teamkelloggs.profile-nick div#sidebar div.chat-box div.chat-box-bottom { width:278px; height:6px; background:transparent url(../images/team-kelloggs/profile/chat-box-yellow-bottom.png) no-repeat left top; } #page-teamkelloggs.profile-nick div#sidebar a#recent { margin:2px 0 19px 0; display:block; float:left; width:57px; height:17px; text-indent:-9999px; background:transparent url(../images/team-kelloggs/landing/btn-recent.gif) no-repeat left top; } #page-teamkelloggs.profile-nick div#sidebar a#earlier { margin:2px 0 19px 0; display:block; float:right; width:58px; height:17px; text-indent:-9999px; background:transparent url(../images/team-kelloggs/landing/btn-earlier.gif) no-repeat left top; } #page-teamkelloggs.profile-nick div#sidebar h3 { margin:10px 0 0 0; width:302px; height: 40px; background: url(../images/team-kelloggs/profile/sidebar_title_achievements.gif) no-repeat left top; text-indent: -9999px;} #page-teamkelloggs.profile-nick div#sidebar h4 { line-height:1.4em; font-size:1.2em; font-weight:bold; } #page-teamkelloggs.profile-nick div#sidebar p { font-size:1.2em; font-weight:normal; } /* =6.3.2.3 SAM */ #page-teamkelloggs.profile-sam div#primary, #page-teamkelloggs.profile-sam div#sidebar {position: relative; top: -215px; margin-bottom: -215px;} #page-teamkelloggs.profile-sam div.wrap { padding:18px 0 0 0; } #page-teamkelloggs.profile-sam div.wrap ul#stats { margin-bottom:46px; width:300px; font-size:1.2em; } #page-teamkelloggs.profile-sam div.wrap ul#stats li { line-height:1.4em; margin-bottom:2px; } #page-teamkelloggs.profile-sam div.wrap ul#stats li span { font-size:1.22em; color:#0072b9; } #page-teamkelloggs.profile-sam div.wrap h3 { margin-bottom:3px; font-size:1.4em; font-weight:normal; color:#0072b9; } #page-teamkelloggs.profile-sam div.wrap p { font-size:1.1em; line-height:1.2em; } #page-teamkelloggs.profile-sam div#sidebar { width: 302px; margin-right: 16px; } #page-teamkelloggs.profile-sam div#sidebar div.sidebar-bg {margin-bottom: 2px; margin-left: 5px; } #page-teamkelloggs.profile-sam div#sidebar h2 {width:302px; height: 40px; background: url(../images/team-kelloggs/profile/sidebar_title_sam.gif) no-repeat left top; text-indent: -9999px;} #page-teamkelloggs.profile-sam div#sidebar div.chat-box div.chat-box-bottom { width:278px; height:6px; background:transparent url(../images/team-kelloggs/profile/chat-box-red-bottom.png) no-repeat left top; } #page-teamkelloggs.profile-sam div#sidebar a#recent { margin:2px 0 19px 0; display:block; float:left; width:57px; height:17px; text-indent:-9999px; background:transparent url(../images/team-kelloggs/landing/btn-recent.gif) no-repeat left top; } #page-teamkelloggs.profile-sam div#sidebar a#earlier { margin:2px 0 19px 0; display:block; float:right; width:58px; height:17px; text-indent:-9999px; background:transparent url(../images/team-kelloggs/landing/btn-earlier.gif) no-repeat left top; } #page-teamkelloggs.profile-sam div#sidebar h3 { margin:10px 0 0 0; width:302px; height: 40px; background: url(../images/team-kelloggs/profile/sidebar_title_achievements.gif) no-repeat left top; text-indent: -9999px;} #page-teamkelloggs.profile-sam div#sidebar h4 { line-height:1.4em; font-size:1.2em; font-weight:bold; } #page-teamkelloggs.profile-sam div#sidebar p { font-size:1.2em; font-weight:normal; } /* =6.3.2.4 CASSIE */ #page-teamkelloggs.profile-cassie div#primary, #page-teamkelloggs.profile-cassie div#sidebar {position: relative; top: -229px; margin-bottom: -229px;} #page-teamkelloggs.profile-cassie div.wrap { padding:18px 0 0 0; } #page-teamkelloggs.profile-cassie div.wrap ul#stats { margin-bottom:46px; width:300px; font-size:1.2em; } #page-teamkelloggs.profile-cassie div.wrap ul#stats li { line-height:1.4em; margin-bottom:2px; } #page-teamkelloggs.profile-cassie div.wrap ul#stats li span { font-size:1.22em; color:#0072b9; } #page-teamkelloggs.profile-cassie div.wrap h3 { margin-bottom:3px; font-size:1.4em; font-weight:normal; color:#0072b9; } #page-teamkelloggs.profile-cassie div.wrap p { font-size:1.1em; line-height:1.2em; } #page-teamkelloggs.profile-cassie div#sidebar { width: 302px; margin-right: 16px; } #page-teamkelloggs.profile-cassie div#sidebar h2 {width:302px; height: 40px; background: url(../images/team-kelloggs/profile/sidebar_title_cassandra.gif) no-repeat left top; text-indent: -9999px;} #page-teamkelloggs.profile-cassie div#sidebar div.chat-box div.chat-box-bottom { width:278px; height:6px; background:transparent url(../images/team-kelloggs/profile/chat-box-orange-bottom.png) no-repeat left top; } #page-teamkelloggs.profile-cassie div#sidebar a#recent { margin:2px 0 19px 0; display:block; float:left; width:57px; height:17px; text-indent:-9999px; background:transparent url(../images/team-kelloggs/landing/btn-recent.gif) no-repeat left top; } #page-teamkelloggs.profile-cassie div#sidebar a#earlier { margin:2px 0 19px 0; display:block; float:right; width:58px; height:17px; text-indent:-9999px; background:transparent url(../images/team-kelloggs/landing/btn-earlier.gif) no-repeat left top; } #page-teamkelloggs.profile-cassie div#sidebar h3 { margin:10px 0 0 0; width:302px; height: 40px; background: url(../images/team-kelloggs/profile/sidebar_title_achievements.gif) no-repeat left top; text-indent: -9999px;} #page-teamkelloggs.profile-cassie div#sidebar h4 { line-height:1.4em; font-size:1.2em; font-weight:bold; } #page-teamkelloggs.profile-cassie div#sidebar p { font-size:1.2em; font-weight:normal; } /* =6.4. SWIM HUB */ #page-swimchallenge.landing #header { z-index:10; } #page-swimchallenge.landing #banner { position:absolute; left:2px; background:transparent url(../images/swim-hub/banner-landing.png) no-repeat left top; height:303px; } #page-swimchallenge.landing #content { padding:267px 0 0 0; } #page-swimchallenge.landing #primary { float:none; display:block; border:none; width:623px; } #page-swimchallenge.landing #secondary { margin:0 0 20px 8px; } #page-swimchallenge.landing #secondary ul li { display:block; float:left; height:126px; } #page-swimchallenge.landing #secondary ul a { display:block; height:126px; text-indent:-9999px; } #page-swimchallenge.landing #front-crawl { width:224px; background:transparent url(../images/swim-hub/landing/stroke-front-crawl.gif) no-repeat left top; } #page-swimchallenge.landing #front-crawl:hover { background-position:right top; } #page-swimchallenge.landing #backstroke { width:226px; background:transparent url(../images/swim-hub/landing/stroke-backstroke.gif) no-repeat left top; } #page-swimchallenge.landing #backstroke:hover { background-position:right top; } #page-swimchallenge.landing #breaststroke { width:226px; background:transparent url(../images/swim-hub/landing/stroke-breaststroke.gif) no-repeat left top; } #page-swimchallenge.landing #breaststroke:hover { background-position:right top; } #page-swimchallenge.landing #butterfly { width:225px; background:transparent url(../images/swim-hub/landing/stroke-butterfly.gif) no-repeat left top; } #page-swimchallenge.landing #butterfly:hover { background-position:right top; } #page-swimchallenge.landing #poll { margin:0 0 0 7px; } #page-swimchallenge #pod-pool-locator { display:block; margin:40px 0 0; width:308px; height:91px; background:transparent url(../images/global/pod-pool-locator.jpg) no-repeat left top; text-indent:-9999px; } #page-swimchallenge #sidebar #pod-pool-locator { margin:30px 0 20px; } #page-swimchallenge #pod-asa { display:block; width:308px; height:81px; background:transparent url(../images/global/pod-asa.jpg) no-repeat left top; text-indent:-9999px; } /* =6.4.1 FRONT CRAWL */ #page-swimchallenge.front-crawl #banner { background:transparent url(../images/swim-hub/banner-front-crawl.jpg) no-repeat left top; height:205px; } #page-swimchallenge.front-crawl #primary #pdf-link { display:block; margin:28px 0 18px 0; width:550px; height:64px; background:transparent url(../images/swim-hub/front-crawl/pdf-link.gif) no-repeat left top; text-indent:-9999px; } #page-swimchallenge.front-crawl #primary h3 { color:#0072B9; font-size:1.4em; font-weight:normal; padding:1px 0 4px; } #page-swimchallenge.front-crawl #primary ul { margin:0 0 18px 0; padding:0 0 0 14px; list-style-type:disc; list-style-position:outside; font-size:1.2em; line-height:1.3em; } #page-swimchallenge.front-crawl #sidebar h2 { display:block; width:300px; height:38px; text-indent:-9999px; background:transparent url(../images/swim-hub/front-crawl/sidebar-title.jpg) no-repeat left top; } #page-swimchallenge.front-crawl #sidebar .sidebar-bg { margin:0 0 0 5px; padding:0 7px 0 11px; } #page-swimchallenge.front-crawl #sidebar .sidebar-bg img { margin:30px 0 15px; } #page-swimchallenge.front-crawl #sidebar .sidebar-bg p { text-align:center; } /* =6.4.2 BACKSTROKE */ #page-swimchallenge.backstroke #banner { background:transparent url(../images/swim-hub/banner-backstroke.jpg) no-repeat left top; height:205px; } #page-swimchallenge.backstroke #primary #pdf-link { display:block; margin:28px 0 18px 0; width:550px; height:64px; background:transparent url(../images/swim-hub/backstroke/pdf-link.gif) no-repeat left top; text-indent:-9999px; } #page-swimchallenge.backstroke #primary h3 { color:#0072B9; font-size:1.4em; font-weight:normal; padding:1px 0 4px; } #page-swimchallenge.backstroke #primary ul { margin:0 0 18px 0; padding:0 0 0 14px; list-style-type:disc; list-style-position:outside; font-size:1.2em; line-height:1.3em; } #page-swimchallenge.backstroke #sidebar h2 { display:block; width:300px; height:38px; text-indent:-9999px; background:transparent url(../images/swim-hub/backstroke/sidebar-title.gif) no-repeat left top; } #page-swimchallenge.backstroke #sidebar .sidebar-bg { margin:0 0 0 5px; padding:0 7px 0 11px; } #page-swimchallenge.backstroke #sidebar .sidebar-bg img { margin:30px 0 15px; } #page-swimchallenge.backstroke #sidebar .sidebar-bg p { text-align:center; } /* =6.4.3 BACKSTROKE */ #page-swimchallenge.breaststroke #banner { background:transparent url(../images/swim-hub/banner-breaststroke.jpg) no-repeat left top; height:205px; } #page-swimchallenge.breaststroke #primary #pdf-link { display:block; margin:28px 0 18px 0; width:550px; height:64px; background:transparent url(../images/swim-hub/breaststroke/pdf-link.gif) no-repeat left top; text-indent:-9999px; } #page-swimchallenge.breaststroke #primary h3 { color:#0072B9; font-size:1.4em; font-weight:normal; padding:1px 0 4px; } #page-swimchallenge.breaststroke #primary ul { margin:0 0 18px 0; padding:0 0 0 14px; list-style-type:disc; list-style-position:outside; font-size:1.2em; line-height:1.3em; } #page-swimchallenge.breaststroke #sidebar h2 { display:block; width:302px; height:37px; text-indent:-9999px; background:transparent url(../images/swim-hub/breaststroke/sidebar-title.gif) no-repeat left top; } #page-swimchallenge.breaststroke #sidebar .sidebar-bg { margin:0 0 0 6px; padding:0 7px 0 11px; } #page-swimchallenge.breaststroke #sidebar .sidebar-bg img { margin:30px 0 15px; } #page-swimchallenge.breaststroke #sidebar .sidebar-bg p { text-align:center; } /* =6.4.4 BUTTERFLY */ #page-swimchallenge.butterfly #banner { background:transparent url(../images/swim-hub/banner-butterfly.jpg) no-repeat left top; height:205px; } #page-swimchallenge.butterfly #primary #pdf-link { display:block; margin:28px 0 18px 0; width:550px; height:64px; background:transparent url(../images/swim-hub/butterfly/pdf-link.gif) no-repeat left top; text-indent:-9999px; } #page-swimchallenge.butterfly #primary h3 { color:#0072B9; font-size:1.4em; font-weight:normal; padding:1px 0 4px; } #page-swimchallenge.butterfly #primary ul { margin:0 0 18px 0; padding:0 0 0 14px; list-style-type:disc; list-style-position:outside; font-size:1.2em; line-height:1.3em; } #page-swimchallenge.butterfly #sidebar h2 { display:block; width:302px; height:37px; text-indent:-9999px; background:transparent url(../images/swim-hub/butterfly/sidebar-title.gif) no-repeat left top; } #page-swimchallenge.butterfly #sidebar .sidebar-bg { margin:0 0 0 6px; padding:0 7px 0 11px; } #page-swimchallenge.butterfly #sidebar .sidebar-bg img { margin:30px 0 15px; } #page-swimchallenge.butterfly #sidebar .sidebar-bg .shift-image1 { margin:30px 0 15px -10px; } #page-swimchallenge.butterfly #sidebar .sidebar-bg .shift-image2 { margin:30px 0 15px -20px; } #page-swimchallenge.butterfly #sidebar .sidebar-bg p { text-align:center; } /* =6.4.6 HINTS AND TIPS */ #page-swimchallenge.hint-and-tips #left-panel { width:586px; float:left; border-right:1px solid #D7ECF9; } #page-swimchallenge.hint-and-tips #primary { float:none; display:block; border:none; } #page-swimchallenge.hint-and-tips #banner { background:transparent url(../images/swim-hub/banner-hints.jpg) no-repeat left top; height:213px; } #page-swimchallenge.hint-and-tips #secondary { float:none; margin-left:1px; padding-right:9px; width:576px; } #page-swimchallenge.hint-and-tips #secondary .inner { position:relative; background: url(../images/swim-hub/hints/hints-sec-bg.gif) no-repeat left top; } #page-swimchallenge.hint-and-tips #secondary h2 { display:block; margin:0 0 7px 0; width:575px; height:27px; text-indent:-9999px; } #page-swimchallenge.hint-and-tips #secondary h2#wear { background:transparent url(../images/swim-hub/hints/hints-title-what-wear.gif) no-repeat left top; } #page-swimchallenge.hint-and-tips #secondary .inner p { padding:0 18px; } #page-swimchallenge.hint-and-tips #secondary h3 { color:#0072B9; font-size:1.4em; font-weight:normal; padding:0 18px 2px; } #page-swimchallenge.hint-and-tips #secondary #p-swimming { position:relative; float:left; width:347px; } #page-swimchallenge.hint-and-tips #secondary #image-swimming { position:relative; float:right; margin:0 3px 0 0;} #page-swimchallenge.hint-and-tips #secondary #image-trunks { position:relative; float:left; margin:0 0 10px 13px; } #page-swimchallenge.hint-and-tips #secondary #p-trunks { position:relative; float:right; width:359px; } #page-swimchallenge.hint-and-tips #secondary h2#eat { background:transparent url(../images/swim-hub/hints/hints-title-what-eat.gif) no-repeat left top; margin:0 0 7px 1px; } #page-swimchallenge.hint-and-tips #secondary #p-cornflakes { position:relative; float:left; width:343px; } #page-swimchallenge.hint-and-tips #secondary #p-cornflakes h3 { padding:0 0 2px 18px; } #page-swimchallenge.hint-and-tips #secondary #image-cornflakes { position:relative; float:right; } #page-swimchallenge.hint-and-tips #secondary ul { margin:0 0 18px 0; padding:0 0 0 32px; list-style-type:disc; list-style-position:outside; font-size:1.2em; line-height:1.1em; } #page-swimchallenge.hint-and-tips #secondary #image-shake { position:relative; margin:0 0 0 20px; float:left; } #page-swimchallenge.hint-and-tips #secondary #p-shake { position:relative; float:right; width:417px;} #page-swimchallenge.hint-and-tips #secondary #p-shake p { margin:0; } #page-swimchallenge.hint-and-tips #secondary #p-shake ul { padding:0 0 0 31px; } #page-swimchallenge.hint-and-tips #sidebar { background:none; min-height:0; height:0; width:297px; } #page-swimchallenge.hint-and-tips #sidebar h2 { display:block; width:301px; height:36px; background:transparent url(../images/swim-hub/hints/sidebar-title.gif) no-repeat left top; text-indent:-9999px; } #page-swimchallenge.hint-and-tips #sidebar .sidebar-bg { width:280px; margin:0; padding:4px 0 0 14px; background:transparent url(../images/swim-hub/hints/sidebar-bg.gif) no-repeat left top; } #page-swimchallenge.hint-and-tips #sidebar .chat-box { margin-bottom:5px; width:278px; margin-left:-3px;} #page-swimchallenge.hint-and-tips #sidebar .chat-box p { margin:0; } #page-swimchallenge.hint-and-tips #sidebar .chat-box .box-content { padding:9px 11px 5px 11px;} #page-swimchallenge.hint-and-tips #sidebar .chat-box .box-orange { position:relative; background:transparent url(../images/swim-hub/hints/chat-box-orange-top.png) no-repeat left top; float: left; clear: both; width: 100%;} #page-swimchallenge.hint-and-tips #sidebar .chat-box .bottom-orange { width:278px; height:5px; background:transparent url(../images/swim-hub/hints/chat-box-orange-bottom.png) no-repeat left top; } #page-swimchallenge.hint-and-tips #sidebar .chat-box .box-yellow { position:relative; background: url(../images/swim-hub/hints/chat-box-yellow-top.png) no-repeat 0 0; float: left; clear: both; width: 100%;} #page-swimchallenge.hint-and-tips #sidebar .chat-box .bottom-yellow { width:278px; height:5px; background:transparent url(../images/swim-hub/hints/chat-box-yellow-bottom.png) no-repeat left top; } #page-swimchallenge.hint-and-tips #sidebar .chat-box .box-blue { position:relative; background:transparent url(../images/swim-hub/hints/chat-box-blue-top.png) no-repeat left top; float: left; clear: both; width: 100%;} #page-swimchallenge.hint-and-tips #sidebar .chat-box .bottom-blue { width:278px; height:5px; background:transparent url(../images/swim-hub/hints/chat-box-blue-bottom.png) no-repeat left top; } /* =6.5. POOL LOCATOR */ #page-poollocator div#primary {border: 0; width: 670px;} #page-poollocator div#primary div.wrap {position: relative; top: -118px; margin-bottom: -118px;} #page-poollocator div#primary p.intro {margin-bottom: 20px;} #page-poollocator div#primary div.narrow {width: 550px;} #page-poollocator div#primary div#results {border-top: 1px dotted #ccc; margin-top: 20px; padding: 20px 0;} #page-poollocator div#primary div#results div#results-top {width: 670px; height: 6px; background: url(../images/pool-locator/results_top.png) no-repeat; font-size: 0;} #page-poollocator div#primary div#results div#results-search {padding: 13px 26px; min-height: 74px; height: auto!important; height: 74px; background: url(../images/pool-locator/results_bg.png) repeat-x; margin-bottom: 20px;} #page-poollocator div#primary div#results div#results-search input#location {width: 440px; margin-top: 15px;} #page-poollocator div#primary div#results div#results-search input#search {margin-left: 60px; width: 103px; height: 36px; background: url(../images/pool-locator/button_search.gif); border: 0; text-indent: -9999px; position: relative; top: 12px;} #page-poollocator div#primary div#results div#results-list h2 {margin-bottom: 10px;} #page-poollocator div#primary div#results div#results-list ol {border-bottom: 1px dotted #ccc;} #page-poollocator div#primary div#results div#results-list ol li {border-top: 1px dotted #ccc; padding: 15px 60px 13px 0; position:relative;} #page-poollocator div#primary div#results div#results-list ol li small {margin-bottom: 2px; font-size: 1.2em;} #page-poollocator div#primary div#results div#results-list ol li p {margin-bottom: 2px;} #page-poollocator div#primary div#results div#results-list ol li p.title { font-size:1.4em; color:#015990; } #page-poollocator div#primary div#results div#results-list ol li a {font-weight: normal;} /* =6. FOOTER */ div#footer {float: left; clear: both; background: #fff; width: 926px; margin-top: 0px; margin: auto; position: relative; left: 17px;} div#footer-a {color: #666; padding: 8px 0px; width: 920px; margin: -0px 3px 0 3px; clear: both; float: left; display: inline; border-top: 1px solid #f8f8f8; position: relative; top: -1px;} div#footer-a p, div#footer-a li{ font-size: 1.1em; } div#footer-a a { color: #666; text-decoration: none;} div#footer-a a:hover {text-decoration: underline;} div#footer-a p#copyright {float: left; margin: 0 0 0 5px;} div#footer-a ul#footernav {float: left; margin: 0 0 0 10px;} div#footer-a ul#footernav li {float: left; margin: 0 0 0 8px; } div#footer-a ul#footernav li a {padding: 0 0 0 10px;background: url(../images/global/arrow_red.gif) no-repeat 0 50%;}