/* ---------------------------------------------------------------------------- DEFAULT STYLES ---------------------------------------------------------------------------- */ html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, input, button, hr { margin: 0; padding: 0; font-size: 1em; } ul { list-style: none; } h1, h2, h3, h4, h5, h6 { font-weight: normal; } img, embed, form, fieldset { margin: 0; padding: 0; border: 0; vertical-align: bottom; } a:link { text-decoration: underline; color: #4082d0; } a:visited {text-decoration: underline; color: #4082d0;} a:hover { text-decoration: none; } .hide { position: absolute; left: -10000px; } body { font: 62.5% Tahoma, Arial, sans-serif, sans-serif; background: #FFF; color: #000; line-height: 1; } input, select, textarea { font-family: Tahoma, Arial, sans-serif, sans-serif; } .breakout { font-weight: bold; font-style: italic; color: #6699cc; font-family:verdana; } /* ---------------------------------------------------------------------------- HEADER ---------------------------------------------------------------------------- */ #header { background: url(../images/header-bg.png) bottom left repeat-x; width: 100%; overflow: hidden; } #header .container { width: 970px; margin: 0 auto; padding: 7px 0 0 0; overflow: hidden; position: relative; } #header a { text-decoration: none; } #header a:hover { text-decoration: underline; } #header #logo { float: left; display: block; width: 229px; height: 100px; font-size: 1.6em; overflow: hidden; position: relative; color: #312b64; font-weight: bold;} #header #logo span.img{ display: block; width: 229px; height: 100px; position: absolute; top: 0; left: 0; background: url(../images/header-logo.png) top left no-repeat; } #header #logo img { display: none; width: 229px; height: 100px; } /* ---------------------------------------------------------------------------- PRIMARY NAVIGATION ---------------------------------------------------------------------------- */ #primary-nav { float: right; overflow: hidden; margin-top: 16px; width:auto;clear:none;} #primary-nav li { float: left; margin-left: 4px; } #primary-nav li a { display: block; color: #FFF; font-size: 1.4em; background: url(../images/primary-nav-left.png) top left no-repeat; text-shadow: #2a5e91 1px -1px 2px; white-space: nowrap; } #primary-nav li a span { margin-left: 3px; display: block; padding: 23px 13px 10px 9px; background: url(../images/primary-nav-right.png) top right no-repeat; } #primary-nav li.kidzone a span { padding: 23px 20px 10px 13px; background: url(../images/primary-nav-right-kidzone.png) top right no-repeat;} #primary-nav li.kidzone {position: relative; left: -1px; margin-left: 5px;} /* Active menu items set with body class */ .internal #primary-nav li.home a, .internal #primary-nav li.working-with-children a, .internal #primary-nav li.resources a, .internal #primary-nav li.kid-stats a, .internal #primary-nav li.our-work-for-kids a, .internal #primary-nav li.about-us a, .kidzone #primary-nav li.kidzone a { color: #312b64; text-shadow: none; background: url(../images/primary-nav-left-on.png) top left no-repeat; } .internal #primary-nav li.home a span, .internal #primary-nav li.working-with-children a span, .internal #primary-nav li.resources a span, .internal #primary-nav li.kid-stats a span, .internal #primary-nav li.our-work-for-kids a span, .internal #primary-nav li.about-us a span { background: url(../images/primary-nav-right-on.png) top right no-repeat; } .kidzone #primary-nav li.kidzone a span { background: url(../images/primary-nav-right-kidzone-on.png) top right no-repeat; } /* ---------------------------------------------------------------------------- TEXT LINKS + SEARCH ---------------------------------------------------------------------------- */ #tools {float: right; margin: 22px 5px 0 0; } ul.links { float: right; padding: 6px 0; } ul.links li { display: inline; font-size: 1.2em; padding: 2px 10px 2px 6px; background: url(../images/tools-line.gif) center right no-repeat; } ul.links li a { color: #6c5a18; } ul.links li.last { background: none; } .gsc-search-box { display:none; } #googleSearchForm #googleSearchField { font-size:1.2em; padding:4px 4px 4px 4px; border:1px solid #9E99C9; width: 240px; } #tools form { float: right; position: relative; overflow: hidden; } #tools form input#search-field { padding: 4px 26px 4px 4px; font-size: 1.2em; color: #666666; border: 1px solid #9e99c9; background: #FFF url(../images/tools-search.gif) center right no-repeat; } #tools form input#search-submit { position: absolute; right: 0; width: 26px; height: 50px; } #googleSearchFormSubmit {font-size:1.4em;} /* Google search results */ .gsc-search-box .gsc-input input {width:200px;border:1px solid #9E99C9;color:#666666;font-size:1.2em;padding:4px 4px 4px 4px;margin:0 5px 0 0;} .gsc-control-cse {font-size:1.2em;line-height:1.4;margin:0 0 1em 0;} .gsc-result {border-bottom:1px solid #D4CEEE;padding:10px 0;} .gsc-result .gsc-result {padding:0;border:0;} .gsc-result a.gs-title {font-weight:bold;} .gsc-result .gs-snippet {margin:5px 0;} .gsc-result .gs-visibleUrl {color:#666666;} .gsc-results .gs-watermark, .gsc-results .gs-visibleUrl-short, .gsc-resultsHeader, .gsc-wrapper .gsc-adBlock, .gsc-tabsAreaInvisible, .gsc-branding {display:none;} .gsc-cursor-box {padding:10px 0;font-size:1.1em;} .gsc-cursor-page { color:#4082D0; cursor:pointer; display:inline; margin-right:8px; } .gsc-cursor-current-page { color:#000; font-weight:bold; text-decoration:none; } /* .gsc-wrapper {font-size:1.2em;line-height:1.4;margin:0 0 1em 0;} div .gs-title { margin:1em 0 0 0; font-weight:bold; } div .gs-visibleUrl-short { display:none; } div .gs-watermark { display:none; } .gsc-cursor-page { color:#000000; cursor:pointer; display:inline; margin-right:8px; text-decoration:underline;} .gsc-cursor-current-page { color:#A90A08; font-weight:bold; text-decoration:none; } .gsc-resultsHeader {display:none;} .gsc-input {width:200px;} .gs-visibleUrl {color:#666666;border-bottom:1px solid #D4CEEE;padding-bottom:10px;} */ /*.gsc-adBlock { display:none; }*/ /* ---------------------------------------------------------------------------- FOOTER ---------------------------------------------------------------------------- */ #footer { float: left; clear:left; background: url(../images/footer-bg.png) top left repeat-x; margin-top: 20px; width: 100%; overflow: hidden; } #footer .container { width: 960px; margin: 0 auto; padding: 17px 0 15px 0; overflow: hidden; position: relative; } #footer a { text-decoration: none; } #footer a:hover { text-decoration: underline; } #footer ul.links { float: none; } div.footerPrint { display:none; } /* ---------------------------------------------------------------------------- INTRO/HEADLINE AREA ---------------------------------------------------------------------------- */ /* Default intro styles (interior pages */ #intro { position: relative; background: url(../images/intro-bg-interior.png) top left repeat-x; padding-top: 3px; } #intro .container { width: 960px; overflow: hidden; margin: 0 auto; padding: 55px 0 30px 0; } #intro h1 { font-size: 2.4em; color: #528cd0; line-height: 1.2; margin-left: 215px; } /* Intro styles for home and kidzone pages */ .home #intro { background: url(../images/intro-bg-home.png) top left repeat-x; } .home #intro .container { width: 945px; margin: 0 auto; padding: 35px 0 65px 15px; background: url(../images/intro-pic-home.png) right 0 no-repeat; } .home #intro h1 { font-size: 2em; color: #766836; line-height: 1.2; margin-left: 0; } .home #intro p { font-size: 1.2em; color: #4082d0; margin-top: 10px; } /* .kidzone #intro .container { min-height: 99px; } */ #intro .container { padding: 20px 0 45px 15px; } #intro.kz-landing-intro .container { padding: 12px 0 35px 15px; } /*.kidzone #intro h1 { margin-top: 2.9em; } */ #intro h1.kz-heading { font-size: 1.6em; margin-top: 0; } #intro h1.kz-heading img { float: left; } #intro h1.kz-heading span { display: block; float: left; width: 260px; margin: 30px 0 0 15px; } /* Intro photos for each page */ .home #intro-pic { background: url(../images/intro-pic-home.jpg) 50% 0px no-repeat; } .internal #intro-pic { background: url(../images/intro-pic-about.jpg) 50% 0px no-repeat; } .kidzone #intro-pic { background: url(../images/intro-pic-kidzone.jpg) 50% -14px no-repeat; } /* ---------------------------------------------------------------------------- MAIN/FRAME AREA ---------------------------------------------------------------------------- */ #main:after {visibility: hidden;display: block;font-size: 0;content: " ";clear: both;height: 0;} * html #main {zoom: 1;} /* IE6 */ *:first-child+html #main {zoom: 1;} /* IE7 */ #main { background: url(../images/main-bg.png) top left repeat-x; } #main .container { width: 960px; margin: 0 auto; } #frame { background: #FFF; background: url(../images/frame-bg.png) top left no-repeat; position: relative; top: -20px; width: 740px; overflow: hidden; /* margin-bottom: -10px; */ /* margin-left: 215px; */ /* float:left; */float:right;} .home #main { background: url(../images/main-bg-home.png) top left repeat-x; } .home #frame { background: #FFF; background: url(../images/frame-bg-home.png) top left no-repeat; position: relative; top: -30px; padding: 25px 20px 0 20px; width: 920px; overflow: hidden; margin-bottom: -20px; margin-left: 0; } .home #frame .column { width: 449px; } .home #frame .left { float: left; } .home #frame .right { float: right; } /* ---------------------------------------------------------------------------- BREADCRUMB + SHARING TOOLS ---------------------------------------------------------------------------- */ #frame-top { border-bottom: 1px solid #efedf6; padding: 12px; font-size: 1.2em; color: #5a377c; width: 716px; overflow: hidden; } #frame-top a { text-decoration: none; } #frame-top a:hover { text-decoration: underline; } #breadcrumb { width: 460px; float: left; } #breadcrumb ol { display: inline; line-height: 1.2em; } #breadcrumb li { display: inline; padding: 0 14px 0 4px; background: url(../images/breadcrumb.gif) right 60% no-repeat; } #breadcrumb li.last { color: #333; background: none; padding-right: 0; } #page-tools { float: right; width: 240px; text-align: right; margin: -3px 0; } #page-tools li { display: inline; padding: 0 0 0 10px; } #page-tools li a { color: #000; } #page-tools li.text-size { text-transform: uppercase; padding-left: 2px; } #page-tools li.text-size-large { font-size: 1.4em; } #page-tools li.text-size span { position: absolute; left: -10000px; } /* ---------------------------------------------------------------------------- CONTENT STYLES ---------------------------------------------------------------------------- */ .home #frame h2 { font-size: 1.8em; color: #705ec7; border-bottom: 1px solid #d4ceee; padding-bottom: 0.4em; margin-bottom: 0.8em; } #content { margin-left: 1px; padding: 15px; float: left; width: 488px; } #content.wide { width: 710px; } #content h2 { font-size: 1.8em; color: #705ec7; margin: 0.8em 0; } /* #content h2 { font-size: 1.8em; color: #705ec7; margin: 1.6em 0 0.8em 0; } */ #content h3 { font-size: 1.3em; color: #705ec7; font-weight: bold; margin: 2em 0 1em 0; } #content h4 { font-size: 1.1em; color: #705ec7; font-weight: bold; margin: 1em 0 1em 0; } #content p { font-size: 1.2em; line-height: 1.4; margin: 0 0 1em 0; } /* #content img { float:left; margin: 0 10px 10px 0; vertical-align: middle; } */ #content img.left { float:left; margin: 0 10px 10px 0; vertical-align: middle; } #content img.right { float:right; margin: 0 0 10px 10px; vertical-align: middle; } #content ul { padding-left: 10px; } #content ul li { background: url(../images/bullet.gif) 0 0.6em no-repeat; padding-left: 15px; font-size: 1.2em; line-height: 1.4em; margin: 0.8em 0; } #content ul li li { font-size: 1em; } #content ol {padding-left:30px;} #content ol li {font-size:1.2em;margin:0 0 0.5em 0;} #content table { font-size: 1.2em; line-height: 1.4; margin: 0 0 1em 0; } #content ul.compact li { margin: 0.2em 0; background-position: 0 0.5em; } #content ul.siteMap li { font-size: 1.8em; background: none; padding-left: 0; } #content ul.siteMap ul { margin-bottom: 1.8em; } #content ul.siteMap li li { font-size: .7em; font-weight: 800; background: url(../images/bullet.gif) 0 0.6em no-repeat; padding-left: 15px; } #content ul.siteMap li li a { color: #4082d0; text-decoration:none; } #content ul.siteMap li li ul { margin-top: 0.8em;} #content ul.siteMap li li li { font-size: 1em; font-weight: normal; margin: 0; } #content ul.siteMap li li li ul { margin-top: 0.2em;} #listDiv { float: left; clear: left; width: 100%; } #content #listDiv ul { padding: 0;} #content #listDiv li { padding: .8em 0; margin:0; background:none; border-top: 1px solid #D4CEEE; } #content #listDiv li a { font-weight: 800; } #content #listDiv .date, #content #listDiv em { font-style: normal; color: #666; } #content ol.pagination { border-top: 1px solid #D4CEEE; padding: .8em 0 0; text-align: center; } #content ol.pagination li { padding: 0; display: inline; background: none; border:none; } #content #listDiv ol.pagination li { border:none; } #content #listDiv ol.pagination li a { font-weight: normal; padding: 0 5px; } #content #listDiv ol.pagination li.paging_on a { color: #000; font-weight: 800; text-decoration: none; } #content #listDiv ol.pagination li.previous a { padding-left: 12px; background: url(../images/previous.png) 0 .25em no-repeat; } #content #listDiv ol.pagination li.next a { padding-right: 12px; background: url(../images/next.png) 100% .25em no-repeat; } /* ---------------------------------------------------------------------------- INTERIOR SIDEBAR ---------------------------------------------------------------------------- */ #side { margin-right: 1px; padding: 15px 15px 15px 0; float: right; width: 190px; } #side h2 { font-size: 1.6em; color: #705ec7; border-bottom: 1px solid #d4ceee; padding-bottom: 0.4em; margin-bottom: 0.8em; } #side ul.related { margin-bottom: 2.4em;float:left;width:100%; } #side ul.related li {float: left; font-size: 1.1em; line-height: 1.2; color: #333; overflow: hidden; width: 100%; margin-bottom:1em; } #side ul.related li span { display: block; float: right; padding-top: 3px; width: 125px; } #side ul.related li a { display: block; padding-bottom: 0.2em; } #side ul.related li img { float: left; } #side ul.new li { width: 100%; overflow: hidden; margin-bottom: 1em; } #side ul.new li a { text-decoration: none; display: block; } #side ul.new li a:hover span.title { text-decoration: underline; } #side ul.new li span.title { font-weight: bold; display: block; font-size: 1.2em; color: #528cd0; margin-bottom: 7px; } #side ul.new li img { float: left; } #side ul.new li span.text { display: block; float: right; font-size: 1.1em; color: #6c5a18; line-height: 1.3; width: 125px; } /* ---------------------------------------------------------------------------- INTERIOR MENU ---------------------------------------------------------------------------- */ #menu { float: left; position: relative; width: 198px; top: -75px; border-top: 1px solid #fdbe1f; border-left: 1px solid #fdbe1f; border-right: 1px solid #fdbe1f; } #menu li { background: #ffe175; border-bottom: 1px solid #fdce56; } #menu li a { display: block; padding: 0.7em 0.7em 0.7em 1.8em; font-size: 1.2em; line-height: 1.2; color: #312b64; text-shadow: #FFF 1px 1px 2px; text-decoration: none; background: url(../images/menu-closed.gif) 0.7em center no-repeat; } #menu li a:hover { text-decoration: underline; } #menu li.open { background: #fff5d2; border-bottom: none; } #menu li.open a { background: url(../images/menu-open.gif) 0.7em center no-repeat; } #menu li.open ul { border-top: 1px solid #fee194; } #menu li.open ul li { background: #FFF; border-bottom: none; } #menu li.open ul li a { background: none; text-shadow: none; } #menu li.open li.open ul { padding-left: 10px; } /* ---------------------------------------------------------------------------- KIDZONE SECTION ---------------------------------------------------------------------------- */ #kz-content { margin-left: 1px; padding-top: 15px; padding-bottom: 15px; width: 738px; overflow: hidden; } #kz-content .column { width: 359px; } #kz-content .left { float: left; } #kz-content .right { float: right; } #kz-content h2 { margin-left: 12px; text-indent: -10000px; } #kz-content h2.what { width: 327px; height: 31px; background: url(../images/kz-header-what.png) top left no-repeat; margin-bottom: 14px; } #kz-content h2.play { width: 213px; height: 36px; background: url(../images/kz-header-play.png) top left no-repeat; margin-bottom: 6px; } #kz-content .blue a, #kz-content .purple a { display: block; padding: 0.2em 1em 0.2em 4.5em; font-size: 1.3em; line-height: 1.2; text-decoration: none; color: #333; } #kz-content .blue a:hover span, #kz-content .purple a:hover span { text-decoration: underline; } #kz-content .blue .top { background: url(../images/kz-blue-top.png) top left no-repeat; padding-top: 24px; } #kz-content .blue .bottom { font-size: 1px; height: 28px; background: url(../images/kz-blue-bottom.png) top left no-repeat; } #kz-content .blue a { background: url(../images/kz-blue-star.gif) 1em 0.2em no-repeat; } #kz-content .blue a span { color: #3278af; font-size: 1.3em; } #kz-content .purple { margin: -12px 0 -10px 0; } #kz-content .purple .top { background: url(../images/kz-purple-top.png) top left no-repeat; padding-top: 24px; } #kz-content .purple .bottom { font-size: 1px; height: 28px; background: url(../images/kz-purple-bottom.png) top left no-repeat; } #kz-content .purple a { background: url(../images/kz-purple-star.gif) 1em 0.2em no-repeat; } #kz-content .purple a span { color: #312b64; font-size: 1.3em; } #kz-content .purple-play { height: 180px; background: url(../images/kz-purple-play.png) top left no-repeat; } #kz-content .purple-play ul { margin-left: 10px; width: 349px; overflow: hidden; } #kz-content .purple-play li { float: left; } #kz-content .purple-play a { background: none; padding: 0 10px; } #kz-content .purple-play a img { margin-bottom: 5px; } #kz-content .kz { margin: -25px 10px 0 0; } .kidzone #kidzone-menu { position:relative; float: left; width: 215px; margin: -75px 0 0 -10px; } .kidzone #kidzone-menu.ks-landing {position:relative; margin: -126px 0 0 -10px; } #kidzone-menu li { margin-bottom: 4px; width: 100%; overflow: hidden; } #kidzone-menu li a.resources { width: 175px; } #kidzone-menu li ul { background: #FFF; position: relative; top: -2px; left: 8px; clear: left; border-left: 1px solid #fdce56; border-right: 1px solid #fdce56; border-bottom: 1px solid #fdce56; padding-top: 2px; } #kidzone-menu li ul li { width: auto; padding: 0.7em 0.8em 0.7em 2em; } #kidzone-menu li ul li a { line-height: 1.1; color: #312b64; font-size: 1.2em; text-decoration: none; } #kidzone-menu li ul li a:hover { text-decoration: underline; } #kidzone-menu li ul li.active { font-weight: bold; background: #fff5d2 url(../images/menu-kidzone.gif) 0.8em 55% no-repeat; } /* ---------------------------------------------------------------------------- HOMEPAGE FEATURES ---------------------------------------------------------------------------- */ /* Working with children check */ .working label { font-size: 1.6em; color: #766836; } .working select { width: 57%; margin-left: 10px; color: #666; padding: 2px; border: 1px solid #c5d8eb; background: #ecf3fa; } .working ul { width: 100%; overflow: hidden; margin-top: 16px; } .working ul li { float: left; margin-right: 4px; width: 147px; min-height: 80px; } .working ul li a { display: block; padding: 5px; color: #FFF; text-decoration: none; } .working ul li a:hover { text-decoration: underline; } .working ul li a span.title { padding: 7px 10px 10px 22px; display: block; font-size: 1.6em; margin-bottom: 5px; } .working ul li a span.text { font-size: 1.1em; display: block; padding: 0 10px 5px 10px; line-height: 1.2; } .working ul li.blue { background: url(../images/working-blue-bg.png) top left no-repeat; } .working ul li.blue a { background: url(../images/working-blue-bottom.png) bottom left no-repeat; } .working ul li.blue a span.title { background: #3a86c3 url(../images/working-blue-arrow.gif) 10px 45% no-repeat; border-right: 1px solid #5c9ed3; border-bottom: 1px solid #5c9ed3; text-shadow: #2a5e91 1px -1px 2px; } .working ul li.yellow { background: url(../images/working-yellow-bg.png) top left no-repeat; } .working ul li.yellow a { background: url(../images/working-yellow-bottom.png) bottom left no-repeat; color: #312b64; } .working ul li.yellow a span.title { background: #ffc83f url(../images/working-yellow-arrow.gif) 10px 45% no-repeat; border-right: 1px solid #ffe79d; border-bottom: 1px solid #ffe79d; text-shadow: #FFF 1px -1px 2px; } .working ul li.purple { background: url(../images/working-purple-bg.png) top left no-repeat; margin-right: 0; } .working ul li.purple a { background: url(../images/working-purple-bottom.png) bottom left no-repeat; } .working ul li.purple a span.title { background: #705ec7 url(../images/working-purple-arrow.gif) 10px 45% no-repeat; border-right: 1px solid #9688d5; border-bottom: 1px solid #9688d5; text-shadow: #5c4da3 1px -1px 2px; } /* What's popular */ .popular { margin-top: 3.6em; width: 100%; overflow: hidden; } .popular h2 { margin-bottom: 0 !important; } .popular img { border: 3px solid #dfdced; float: left; margin-top: 1.6em; } .popular ul { float: left; width: 303px; } .popular li { font-size: 1.2em; padding: 16px; color: #333; background: url(../images/popular-line.png) bottom left no-repeat; overflow: hidden; width: 270px; line-height: 1.2; } .popular li a { display: block; padding-bottom: 0.2em; } .popular li img { border: none; float: left; margin: 0; } .popular li span { display: block; width: 200px; float: left; padding-left: 15px; padding-top: 3px; } .popular li.last { background: none; } /* What's new */ .new .carousel { margin-left: 1px; width: 100%; overflow: hidden; } .new .jcarousel { width: 410px !important; float: left; } .js .new .jcarousel { width: 409px !important; } .new .carousel-button { overflow: hidden; display: block; float: left; width: 19px; height: 120px; background: red; text-indent: -10000px; outline: none; } .new .carousel-button:hover { background-position: bottom left !important; } .new .carousel-button-prev { background: url(../images/carousel-prev.png) top left no-repeat; } .new .carousel-button-next { margin-left: -1px; background: url(../images/carousel-next.png) top left no-repeat; } .new .carousel ul { height: 120px; overflow: visible; } .js .new .carousel ul { height: 120px; overflow: hidden; } .new .carousel li { float: left; height: 160px; width: 205px; background: url(../images/carousel-line.png) right center no-repeat; overflow: hidden; } .js .new .carousel li { height: 120px; } .new .carousel li.carousel-news { background: url(../images/icon-news-small.png) no-repeat 5px 30px; } .new .carousel li.carousel-events { background: url(../images/icon-events-small.png) no-repeat 5px 30px; } .new .carousel li.carousel-speeches { background: url(../images/icon-speeches-small.png) no-repeat 5px 30px; } .new .carousel li.carousel-lawspolicies { background: url(../images/icon-lawpolicies-small.png) no-repeat 5px 30px; } .new .carousel li.carousel-jobs { background: url(../images/icon-jobs-small.png) no-repeat 5px 30px; } .new .carousel li.carousel-publications { background: url(../images/icon-publications-small.png) no-repeat 5px 30px; } .new .carousel li.carousel-faqs { background: url(../images/icon-faqs-small.png) no-repeat 15px 30px; } .new .carousel li.carousel-whatsPopular { background: url(../images/icon-whatspopular-small.png) no-repeat 5px 30px; } .new .carousel li.carousel-haveyoursay { background: url(../images/icon-speaker-small.png) no-repeat 5px 30px; } .new .carousel li.carousel-survey { background: url(../images/icon-poll-small.png) no-repeat 5px 30px; } .new .carousel li.carousel-feedbackeditions { background: url(../images/icon-feedbackmag-small.png) no-repeat 5px 30px; } .new .carousel li.carousel-feedbackarticles { background: url(../images/icon-feedbackmag-small.png) no-repeat 5px 30px; } .new .carousel li a { text-decoration: none; display: block; /* height: 120px; */ /*padding: 0 15px;*/ padding: 0 10px; } .new .carousel li a:hover span.title, .new .carousel li a:focus span.title, .new .carousel li a:active span.title { text-decoration: underline; } .new .carousel li a:hover span.title, .new .carousel li a:focus span.title, .new .carousel li a:active span.title { text-decoration: underline; } .new .carousel li span.title { display: block; font-size: 1.6em; color: #528cd0; margin-bottom: 14px; } .new .carousel li span.text { display: block; float: right; font-size: 1.2em; color: #6c5a18; line-height: 1.3; width: 140px; /* width: 100px; */ } .new .carousel li span.date { display: block; float: right; font-size: 1.1em; font-weight: 800; color: #6c5a18; width: 140px; padding-top: .6em; /* width: 100px; */ } .new .carousel li span.more { display: block; float: right; font-size: 1.2em; color: #528cd0; width: 140px; padding: .8em 5px 0 0; text-align: right; } /* What's in the kidZone */ .kzhome { /* margin-top: 3em; */ width: 100%; overflow: hidden; margin-bottom:10px; } .kzhome h2 { width: 354px; height: 64px; background: url(../images/kz-header-home.png) top left no-repeat; border-bottom: none !important; margin-bottom: 0 !important; padding-bottom: 0 !important; position: relative; } .kzhome h2 a {position: absolute; top: 0; right: 0; width: 354px; height: 64px; text-indent: -10000px; } .kzhome ul { margin-top: -8px; width: 100%; overflow: hidden; height: 90px; background: url(../images/kz-home-bg.png) top center no-repeat; } .kzhome li { float: left; padding: 9px 1px; } /* ---------------------------------------------------------------------------- KIDZONE BUTTONS ---------------------------------------------------------------------------- */ /* Default styles (a float must be set on .kz for correct rendering) */ .kz { font-size: 1.4em; text-align: center; color: #312b64; text-shadow: #FFF 0 1px 2px; text-decoration: none; position: relative; cursor: pointer; float: left; z-index: 1000; } .kz:hover { text-decoration: underline; } .kz span { display: block; } .kz span.top { padding: 10px 15px 0 15px; line-height: 1.1; } .kz span.bottom { font-size: 1px; height: 13px; } .kz span.corner { width: 9px; height: 9px; position: absolute; font-size: 1px; z-index: 1000; } .kz span.tl, .kz span.tr { background: url(../images/kz-corner-top.png) top left no-repeat; } .kz span.bl, .kz span.br { background: url(../images/kz-corner-bottom.png) top left no-repeat; } /* Styles for each button shape */ #kz-home-panels {background:url(/images/kz-home-panel.png) no-repeat left top;min-height:37px;} #kz-home-panels a {float:left;padding:11px 10px 0 10px;text-align:center;font-size:1.1em;text-decoration:none;color:#fff;} #kz-home-panels a.kzh1 { width: 190px; } #kz-home-panels a.kzh2 { width: 87px;color:#312B64; } #kz-home-panels a.kzh3 { width: 112px;color:#312B64; } #kz-home-panels a:hover {text-decoration:underline;} .kz1 { width: 236px; float: right; } .kz1 span.top { background: url(../images/kz1-top.png) top left no-repeat; } .kz1 span.bottom { height: 21px; background: url(../images/kz1-bottom.png) bottom left no-repeat; } .kz1 span.tl { top: 5px; left: 4px; } .kz1 span.tr { top: 4px; right: 6px; } .kz1 span.bl { bottom: 14px; left: 4px; } .kz1 span.br { bottom: 10px; right: 9px; } .kz.participatewithus { width: 187px; } .kz.participatewithus span.top { background: url(../images/kz2-top.png) top left no-repeat; } .kz.participatewithus span.bottom { background: url(../images/kz2-bottom.png) bottom left no-repeat; } .kz.participatewithus span.tl { top: 4px; left: 5px; } .kz.participatewithus span.tr { top: 4px; right: 7px; } .kz.participatewithus span.bl { bottom: 7px; left: 5px; } .kz.participatewithus span.br { bottom: 5px; right: 10px; } .kz.games { margin-left: 12px; width: 107px; } .kz.games span.top { background: url(../images/kz3-top.png) top left no-repeat; } .kz.games span.bottom { background: url(../images/kz3-bottom.png) bottom left no-repeat; } .kz.games span.tl { top: 4px; left: 5px; } .kz.games span.tr { top: 4px; right: 10px; } .kz.games span.bl { bottom: 6px; left: 4px; } .kz.games span.br { bottom: 5px; right: 7px; } .kz.feedbackmag { width: 159px; } .kz.feedbackmag span.top { background: url(../images/kz4-top.png) top left no-repeat; } .kz.feedbackmag span.bottom { background: url(../images/kz4-bottom.png) bottom left no-repeat; } .kz.feedbackmag span.tl { top: 5px; left: 4px; } .kz.feedbackmag span.tr { top: 4px; right: 6px; } .kz.feedbackmag span.bl { bottom: 7px; left: 5px; } .kz.feedbackmag span.br { bottom: 7px; right: 7px; } .kz.kidspoll { margin-left: 20px; width: 110px; } .kz.kidspoll span.top { background: url(../images/kz5-top.png) top left no-repeat; } .kz.kidspoll span.bottom { background: url(../images/kz5-bottom.png) bottom left no-repeat; } .kz.kidspoll span.tl { top: 4px; left: 6px; } .kz.kidspoll span.tr { top: 4px; right: 8px; } .kz.kidspoll span.bl { bottom: 7px; left: 5px; } .kz.kidspoll span.br { bottom: 6px; right: 7px; } .kz.haveyoursay { margin-left: 10px; width: 147px; } .kz.haveyoursay span.top { background: url(../images/kz6-top.png) top left no-repeat; } .kz.haveyoursay span.bottom { background: url(../images/kz6-bottom.png) bottom left no-repeat; } .kz.haveyoursay span.tl { top: 5px; left: 5px; } .kz.haveyoursay span.tr { top: 5px; right: 8px; } .kz.haveyoursay span.bl { bottom: 7px; left: 5px; } .kz.haveyoursay span.br { bottom: 5px; right: 11px; } .kz.outandaboutwithkids { margin-left: 1px; width: 211px; } .kz.outandaboutwithkids span.top { background: url(../images/kz7-top.png) top left no-repeat; } .kz.outandaboutwithkids span.bottom { background: url(../images/kz7-bottom.png) bottom left no-repeat; } .kz.outandaboutwithkids span.tl { top: 4px; left: 6px; } .kz.outandaboutwithkids span.tr { top: 4px; right: 6px; } .kz.outandaboutwithkids span.bl { bottom: 7px; left: 5px; } .kz.outandaboutwithkids span.br { bottom: 6px; right: 8px; } .kz.toldus { width: 187px; } .kz.toldus span.top { background: url(../images/kz8-top.png) top left no-repeat; } .kz.toldus span.bottom { background: url(../images/kz8-bottom.png) bottom left no-repeat; } .kz.toldus span.tl { top: 4px; left: 5px; } .kz.toldus span.tr { top: 4px; right: 6px; } .kz.toldus span.bl { bottom: 7px; left: 5px; } .kz.toldus span.br { bottom: 6px; right: 7px; } li.kz-resources { margin-left: 24px; } li.kz-resources ul { width: 158px; } /* .kz.resources { width: 175px; } */ .kz.resources span.top { background: url(../images/kz9-top.png) top left no-repeat; } .kz.resources span.bottom { background: url(../images/kz9-bottom.png) bottom left no-repeat; } .kz.resources span.tl { top: 4px; left: 6px; } .kz.resources span.tr { top: 4px; right: 7px; } .kz.resources span.bl { bottom: 7px; left: 5px; } .kz.resources span.br { bottom: 6px; right: 6px; } .kz.yprg { margin-left: 7px; width: 174px; } .kz.yprg span.top { background: url(../images/kz10-top.png) top left no-repeat; } .kz.yprg span.bottom { background: url(../images/kz10-bottom.png) bottom left no-repeat; } .kz.yprg span.tl { top: 5px; left: 6px; } .kz.yprg span.tr { top: 5px; right: 8px; } .kz.yprg span.bl { bottom: 7px; left: 5px; } .kz.yprg span.br { bottom: 6px; right: 18px; } .kz.youngpeopleadvisorygroup { margin-left: 7px; width: 174px; } .kz.youngpeopleadvisorygroup span.top { background: url(../images/kz10-top.png) top left no-repeat; } .kz.youngpeopleadvisorygroup span.bottom { background: url(../images/kz10-bottom.png) bottom left no-repeat; } .kz.youngpeopleadvisorygroup span.tl { top: 5px; left: 6px; } .kz.youngpeopleadvisorygroup span.tr { top: 5px; right: 8px; } .kz.youngpeopleadvisorygroup span.bl { bottom: 7px; left: 5px; } .kz.youngpeopleadvisorygroup span.br { bottom: 6px; right: 18px; } .kz.kidzonesubscribe { width: 173px; } .kz.kidzonesubscribe span.top { background: url(../images/kz11-top.png) top left no-repeat; } .kz.kidzonesubscribe span.bottom { background: url(../images/kz11-bottom.png) bottom left no-repeat; } .kz.kidzonesubscribe span.tl { top: 4px; left: 5px; } .kz.kidzonesubscribe span.tr { top: 4px; right: 6px; } .kz.kidzonesubscribe span.bl { bottom: 7px; left: 5px; } .kz.kidzonesubscribe span.br { bottom: 6px; right: 7px; } .kz.competitions { margin-left: 10px; width: 147px; } .kz.competitions span.top { background: url(../images/kz6-top.png) top left no-repeat; } .kz.competitions span.bottom { background: url(../images/kz6-bottom.png) bottom left no-repeat; } .kz.competitions span.tl { top: 5px; left: 5px; } .kz.competitions span.tr { top: 5px; right: 8px; } .kz.competitions span.bl { bottom: 7px; left: 5px; } .kz.competitions span.br { bottom: 5px; right: 11px; } .kz.posterdesigncompetition { width: 159px; color:#fff; text-shadow: 0 1px 2px #666;} .kz.posterdesigncompetition span.top { background: url(../images/kzblue-top.png) top left no-repeat; } .kz.posterdesigncompetition span.bottom { background: url(../images/kzblue-bottom.png) bottom left no-repeat; height:18px;} .kz.posterdesigncompetition span.tl { top: 5px; left: 4px; background: url(../images/kzblue-corner-top.png) top left no-repeat; } .kz.posterdesigncompetition span.tr { top: 4px; right: 6px; background: url(../images/kzblue-corner-top.png) top left no-repeat; } .kz.posterdesigncompetition span.bl { bottom: 7px; left: 5px; background: url(../images/kzblue-corner-bottom.png) top left no-repeat; } .kz.posterdesigncompetition span.br { bottom: 7px; right: 7px; background: url(../images/kzblue-corner-bottom.png) top left no-repeat; } .kz.winanipod { margin-left: 10px; width: 147px; color:#fff; text-shadow: 0 1px 2px #666;} .kz.winanipod span.top { background: url(../images/kzgreen-top.png) top left no-repeat; } .kz.winanipod span.bottom { background: url(../images/kzgreen-bottom.png) bottom left no-repeat; height:17px; } .kz.winanipod span.tl { top: 5px; left: 5px; background: url(../images/kzgreen-corner-top.png) top left no-repeat;} .kz.winanipod span.tr { top: 5px; right: 8px; background: url(../images/kzgreen-corner-top.png) top left no-repeat;} .kz.winanipod span.bl { bottom: 7px; left: 5px; background: url(../images/kzgreen-corner-bottom.png) top left no-repeat;} .kz.winanipod span.br { bottom: 5px; right: 11px; background: url(../images/kzgreen-corner-bottom.png) top left no-repeat;} /* ---------------------------------------------------------------------------- GENERIC FORM STYLES ---------------------------------------------------------------------------- */ .form-btn { font-size: 1.2em; margin-left:5px; padding: 3px 2px; color:#fff; background: #8f82cc url(../images/form-btn.png) top left repeat-x; border: 1px solid #705EC7; text-shadow:1px -1px 2px #5C4DA3; } #content .thisFormElem { float: left; clear: both; width: 100%; margin-bottom: .8em; } #content .thisFormTxt { float: left; width: 35%; margin: 0 .5em 0 0; } #content .thisFormField { float: left; width: 55%; } #content .thisFormFieldCheckBox { float: left; width: 55%; } #content .errorTxt { color: #FDBE1F; } #content span.error { color: #0000ff; } #content p.field label { color: #4082d0; } #content p.field input { padding: 4px; color: #666666; border: 1px solid #9e99c9; } #content p.field .submitBtn input { color: #fff; border: none; border-left: 1px solid #3072a6; border-bottom: 1px solid #3072a6; } #content p.field .submitBtn input:hover, #content p.field .submitBtn input:focus, #content p.field .submitBtn input:active { color:#312B64; border-color: #fdbe1f; } #content .thisFormTxt label { float: left; padding: 6px 0; width: 100%; font-size: 1.2em; color: #4082d0; } #content .thisFormTxtWide label { float: left; padding: 6px 0; width: 100%; font-size: 1.2em; color: #4082d0; } #content .thisFormField input, #content .thisFormField textarea { float: left; padding: 4px; font-size: 1.2em; color: #666666; border: 1px solid #9e99c9; width: 100%; } #content .thisFormField textarea { height: 160px; } #content .thisFormField select { margin: 2px 4px 6px 0; border: 1px solid #9E99C9; } #content .thisFormFieldCheckBox { float: left; padding: 4px; font-size: 1.2em; color: #666666; } #content .thisFormFieldCheckBox input { margin: 0 6px 4px 0;} #content .thisFormFieldCheckBoxWide { float: left; padding: 4px; font-size: 1.2em; color: #666666; } #content .thisFormFieldCheckBoxWide div { float: left; clear: both; width: 100%; margin-bottom: 4px; } #content .thisFormFieldCheckBoxWide input { margin: 0 6px 4px 0;} #content .hint { float: right; clear:both; width: 100%; margin-top: .2em; font-size: 1.2em; color: #666666; line-height:1.2em; } #content .submitBtn input { width: auto; padding:4px 8px; color: #fff; background: url(../images/form-submit.png) top right; border: none; border-left: 1px solid #3072a6; border-bottom: 1px solid #3072a6; } #content .submitBtn input:hover, #content .submitBtn input:focus, #content .submitBtn input:active { color:#312B64; background: url(../images/form-submit.png) right 85px; border-color: #fdbe1f;} #content .dataTable .thisFormField,submitBtn {width: 691px;} #content .dataTable .submitBtn input {float: none; width: 50px; margin: 0 auto;} #content select.quantityList { border: 1px solid #9E99C9; } /* Form Error */ #content div.errorMsg { margin: 0 0 2.4em; padding:10px 10px 5px 10px; border: 1px solid #ff0000; } #content div.errorMsg ul { margin: 0 0 5px 14px; list-style: disc; } #content div.errorMsg li { margin: 0; padding: 0; background: none; color: #ff0000; } #content div.errorMsg p { color: #ff0000; font-weight: 800; } #content p.error { color: #ff0000; font-weight: 800; } #content div.statusMsg { margin: 0 0 2.4em; padding:10px 10px 5px 10px; border: 1px solid #57a240; } #content div.statusMsg ul { margin: 0 0 5px 14px; list-style: disc; } #content div.statusMsg li { margin: 0; padding: 0; background: none; color: #57a240; } #content div.statusMsg p { color: #57a240; font-weight: 800; } /* Table styles */ /* styles for data csv files */ .dataTable { border-width: 2px; border-style: solid; border-collapse: collapse; border-color :#555; } .dataTable td {padding:4px;border-width: 1px; border:1px solid #555;} .dataTableTopHeader { text-align: center; font-family: verdana, helvetica, arial; font-size: 12px; font-weight: bold; color: #FFF; background: #C09BE8; border-bottom-width: 1px; border-bottom-style: solid ; border-bottom-color: #555; border-right-width: 1px; border-right-style: solid ; border-right-color: #555; } .dataTableTopSubHeaderMiddle { text-align: center; font-family: verdana, helvetica, arial; font-size: 10px; background: #E6EFF9; border-bottom-width: 1px; border-bottom-style: solid ; border-bottom-color: #555; border-right-width: 1px; border-right-style: solid ; border-right-color: #555; } .dataTableTopSubHeader { text-align: center; font-family: verdana, helvetica, arial; font-size: 10px; background: #E6EFF9; border-bottom-width: 1px; border-bottom-style: solid ; border-bottom-color: #555; border-right-width: 1px; border-right-style: solid ; border-right-color: #555; } .dataTableCellWhite { background: #FFFFFF; border-bottom-width: 1px; border-bottom-style: solid ; border-bottom-color: #555; border-right-width: 1px; border-right-style: solid ; border-right-color: #555;text-align:left !important; } .dataTableData, .dataTableCellWhite { font-family: verdana, helvetica, arial;font-size: 10px;border-bottom-width: 1px; border-bottom-style: solid ; border-bottom-color: #555; border-right-width: 1px; border-right-style: solid ; border-right-color: #555; text-align:center;vertical-align:top; }/* background: #E6EFF9;*/ .dataTableLeftHeader { text-align: left; font-family: verdana, helvetica, arial; font-size: 11px; border-bottom-width: 1px; border-bottom-style: solid ; border-bottom-color: #555; border-right-width: 1px; border-right-style: solid ; border-right-color: #555; width:auto; vertical-align:top; background-color:#D8D8EB; }/*background: #C5C5E2;*/ .dataTableLeftHeaderVar1 { text-align: left; font-family: verdana, helvetica, arial; font-size: 11px; border-bottom-width: 1px; border-bottom-style: solid ; border-bottom-color: #555; border-right-width: 1px; border-right-style: solid ; border-right-color: #555; width:325px; vertical-align:top; background-color:#D8D8EB; }/*background: #C5C5E2;*/ .dataTableLeftHeaderVar2 { text-align: left; font-family: verdana, helvetica, arial; font-size: 11px; border-bottom-width: 1px; border-bottom-style: solid ; border-bottom-color: #555; border-right-width: 1px; border-right-style: solid ; border-right-color: #555; width:150px; vertical-align:top; background-color:#D8D8EB; }/*background: #C5C5E2;*/ .dataTableLeftSubHeader { text-align: left; font-family: verdana, helvetica, arial; font-size: 11px; border-bottom-width: 1px; border-bottom-style: solid ; border-bottom-color: #555; border-right-width: 1px; border-right-style: solid ; border-right-color: #555; width:110px; vertical-align:top; background-color:#FFF4FA;}/*background: #FFEAF4;*/ .dataTableTopSubHeader_three { text-align: center; font-family: verdana, helvetica, arial; font-size: 10px; background: #E6EFF9; border-bottom-width: 1px; border-bottom-style: solid ; border-bottom-color: #555; border-right-width: 1px; border-right-style: solid ; border-right-color: #555; } .dataTableRightHeader_three { padding-left:20px !important; padding-right:20px !important; text-align: left; font-family: verdana, helvetica, arial; font-size: 11px; border-bottom-width: 1px; border-bottom-style: solid ; border-bottom-color: #555; border-right-width: 1px; border-right-style: solid ; border-right-color: #555; width:310px; vertical-align:top; background-color:#FFF4FA; }/*background: #C5C5E2;*/ .dataTableLeftSubHeader_three { text-align: left; font-family: verdana, helvetica, arial; font-size: 11px; border-bottom-width: 1px; border-bottom-style: solid ; border-bottom-color: #555; border-right-width: 1px; border-right-style: solid ; border-right-color: #555; width:10px; vertical-align:top; background-color:#FFF4FA;}/*background: #FFEAF4;*/ .dataTableCenterHeader_three { text-align: center; font-family: verdana, helvetica, arial; font-size: 11px; border-bottom-width: 1px; border-bottom-style: solid ; border-bottom-color: #555; border-right-width: 1px; border-right-style: solid ; border-right-color: #555; width:110px; vertical-align:top; background-color:#FFF4FA; }/*background: #C5C5E2;*/ .dataTable .survey-submit {width:100px;height:25px;display:block;} /* CMS Clean-up */ #content ul p, #content p p, #content h2 p, #content h3 p, #content h4 p { font-size: 1em; margin:0; padding: 0; line-break:1em; } /* Kids Polls */ .poll-form {font-size:1.2em;} /* News Feed */ #mw-news-feed {clear:both;float:left;width:100%;} #mw-news-feed .controlBack {float:left;} #mw-news-feed .control {text-align:right;} #mw-news-feed ul {font-size:1.1em;line-height:1.3em;} #mw-news-feed ul li {margin:0 0 10px 0;} #mw-news-feed ul li .title {margin:0 0 5px 0;/*font-size:1.1em;*/} #mw-news-feed ul li .date {color:#666;margin:0 0 3px 0;} #mw-news-feed ul li .ingress {}