div.debugging
{
    background-color: White;
    color: Red;
}

/* v1.0 | 20080212 */


/*
RESET
*/

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
{
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent;
}

body
{
    line-height: 1;
}
ol, ul
{
    list-style: none;
}
blockquote, q
{
    quotes: none;
}
blockquote:before, blockquote:after, q:before, q:after
{
    content: '';
    content: none;
}

/* remember to define focus styles! */
:focus
{
    outline: 0;
}

/* remember to highlight inserts somehow! */
ins
{
    text-decoration: none;
}
del
{
    text-decoration: line-through;
}

/* tables still need 'cellspacing="0"' in the markup */
table
{
    border-collapse: collapse;
    border-spacing: 0;
}

a
{
    color: #75550b;
}

/*

TYPOGRAPHY

*/
p, div#footer ul
{
    font-size: 1.6em;
    line-height: 1.4em;
    margin-bottom: 1em;
}
/* displayed at 14px */
h1
{
    font-size: 3.2em;
}
h2
{
    font-size: 2.6em;
}
h3
{
    font-size: 2.6em;
}

h1.title-games, h1.title-makeandcolour, h1.title-videos, h2.title-didyouknow, h2.title-dino, h2.title-gallery, h2.title-cool-stuff-blue, h2.title-competition-blue, h2.title-grownup, h2.title-freeevents, h2.title-competitions, h1.title-cool-stuff, h2.title-ourvenues
{
    text-indent: -999px;
    overflow: hidden;
    display: block;
}

h1.title-games
{
    background: url(/kids/graphics/title-games.jpg) no-repeat;
    height: 32px;
    width: 390px;
}
h1.title-makeandcolour
{
    background: url(/kids/graphics/title-makeandcolour.jpg) no-repeat;
    height: 36px;
    width: 320px;
}
h1.title-videos
{
    background: url(/kids/graphics/title-videos.jpg) no-repeat;
    height: 36px;
    width: 161px;
}
h1.title-cool-stuff
{
    background: url(/kids/graphics/title-cool-stuff.jpg) no-repeat;
    height: 36px;
    width: 186px;
}


h2.title-didyouknow
{
    background: url(/kids/graphics/title-didyouknow.jpg) no-repeat;
    height: 30px;
    width: 206px;
}

h2.title-dino
{
    background: url(/kids/graphics/title-dino-quest.jpg) no-repeat;
    height: 30px;
    width: 206px;
}

h2.title-cool-stuff-blue
{
    background: url(/kids/graphics/title-cool-stuff-blue.jpg) no-repeat;
    height: 30px;
    width: 148px;
}
h2.title-gallery
{
    background: url(/kids/graphics/title-gallery.jpg) no-repeat;
    height: 30px;
    width: 166px;
}
h2.title-competition-blue
{
    background: url(/kids/graphics/title-competition-blue.jpg) no-repeat;
    height: 30px;
    width: 166px;
}
h2.title-grownup
{
    background: url(/kids/graphics/title-grown-up.jpg) no-repeat;
    height: 30px;
    width: 202px;
}
h2.title-ourvenues
{
    background: url(/kids/graphics/title-ourvenues.png) no-repeat transparent;
    height: 19px;
    width: 177px;
}
h2.title-competitions
{
    background: url(/kids/graphics/title-competitons.png) no-repeat transparent left;
    height: 33px;
    width: 190px;
}
h2.title-freeevents
{
    background: url(/kids/graphics/title-freeevents.png) no-repeat transparent;
    height: 26px;
    width: 164px;
}

/*

UTILITIES 

*/

body
{
    width: 100%;
    font-size: 62.5%;
    font-family: "Helvetica Neue" ,Helvetica,Arial;
    color: black;
}
.clear-fix
{
    clear: both;
}



/*

BG SWITCHER

*/

#bg-switcher
{
    background: url(/kids/graphics/bg-switcher.png) transparent no-repeat;
    position: absolute;
    top: 0px;
    right: 10px;
    width: 300px;
    height: 113px;
}

#bg-switcher .inner
{
    padding: 55px 0 0 45px;
}

a.art, a.space, a.space, a.pirates, a.jungle, a.egypt, a.dino
{
    display: block;
    width: 33px;
    height: 35px;
    float: left;
    margin-right: 3px;
}

a.art
{
    background: url(/kids/graphics/btn-bg-art.png) no-repeat transparent top;
}
a.art:hover
{
    background: url(/kids/graphics/btn-bg-art.png) no-repeat transparent bottom;
}

a.space
{
    background: url(/kids/graphics/btn-bg-space.png) no-repeat transparent top;
}
a.space:hover
{
    background: url(/kids/graphics/btn-bg-space.png) no-repeat transparent bottom;
}

a.pirates
{
    background: url(/kids/graphics/btn-bg-pir.png) no-repeat transparent top;
}
a.pirates:hover
{
    background: url(/kids/graphics/btn-bg-pir.png) no-repeat transparent bottom;
}

a.jungle
{
    background: url(/kids/graphics/btn-bg-jun.png) no-repeat transparent top;
}
a.jungle:hover
{
    background: url(/kids/graphics/btn-bg-jun.png) no-repeat transparent bottom;
}

a.egypt
{
    background: url(/kids/graphics/btn-bg-egypt.png) no-repeat transparent top;
}
a.egypt:hover
{
    background: url(/kids/graphics/btn-bg-egypt.png) no-repeat transparent bottom;
}

a.dino
{
    background: url(/kids/graphics/btn-bg-dino.png) no-repeat transparent top;
}
a.dino:hover
{
    background: url(/kids/graphics/btn-bg-dino.png) no-repeat transparent bottom;
}



body
{
    background: url(/kids/graphics/bg-art.jpg) repeat-x top center white;
}
body.space
{
    background: #000000;
}
body.dino
{
    background: blue;
}
body.egypt
{
    background: blue;
}
body.pirates
{
    background: blue;
}
body.fish
{
    background: blue;
}





/*

LAYOUT

*/

.wrapper
{
    margin: 0 auto;
    width: 860px;
}
.inner
{
    padding: 10px 10px 0 10px;
}
.inner-zero-left
{
    padding-left: 0px;
}
.inner-zero-right
{
    padding-right: 0px;
}
.inner-zero-top
{
    padding-top: 0px;
}
.inner-zero-bottom
{
    padding-bottom: 0px;
}

.col-660
{
    width: 660px;
    float: left;
}
.col-640
{
    width: 640px;
    float: left;
}
.col-300
{
    width: 300px;
    float: left;
}
.col-320
{
    width: 320px;
    float: left;
}
.col-390
{
    width: 390px;
    float: left;
}
.col-480
{
    width: 480px;
    float: left;
}

.col-574
{
    width: 574px;
    float: left;
}
.col-286
{
    width: 286px;
    float: left;
}
.col-860
{
    width: 860px;
    float: left;
}



/*

HEADER

*/

#header
{
    background: url(/kids/graphics/hdr-blobs.png) no-repeat transparent bottom;
    width: 860px;
    height: 230px;
    position: relative;
}
#flashHead
{
    width: 657px;
    height: 150px;
    position:absolute;
    top:80px;
    left:203px;
    z-index:2;
    padding:0;
    margin:0;
    border:0px solid red;
}
#logo
{
    display: block;
    position: absolute;
    top: 10px;
    left: 30px;
}
#intro
{
    text-indent: -999px;
    overflow: hidden;
    background: url(/kids/graphics/bubble-intro.png) no-repeat transparent;
    width: 294px;
    height: 124px;
    float: left;
    position: absolute;
    top: 30px;
    left: 160px;
}


/*

NAV 

*/

ul#nav
{
    list-style-type: none;
    color: black;
}
ul#nav li
{
    float: left;
    margin-right: 6px;
}
ul#nav li a
{
    display: block;
    height: 62px;
    text-indent: -999px;
    overflow: hidden;
}
ul#nav li.end, .end
{
    margin-right: 0px;
}

.nav-home
{
    background: url(/kids/graphics/nav-home.png) no-repeat transparent top;
    width: 133px;
    height: 62px;
}
.nav-home:hover
{
    background: url(/kids/graphics/nav-home.png) no-repeat transparent bottom;
    width: 133px;
    height: 62px;
}

.nav-games
{
    background: url(/kids/graphics/nav-games.png) no-repeat transparent top;
    width: 281px;
    height: 62px;
}
.nav-games:hover
{
    background: url(/kids/graphics/nav-games.png) no-repeat transparent bottom;
    width: 281px;
    height: 62px;
}

.nav-make
{
    background: url(/kids/graphics/nav-make.png) no-repeat transparent top;
    width: 245px;
    height: 62px;
}
.nav-make:hover
{
    background: url(/kids/graphics/nav-make.png) no-repeat transparent bottom;
    width: 245px;
    height: 62px;
}

.nav-videos
{
    background: url(/kids/graphics/nav-videos.png) no-repeat transparent top;
    width: 163px;
    height: 62px;
}
.nav-videos:hover
{
    background: url(/kids/graphics/nav-videos.png) no-repeat transparent bottom;
    width: 163px;
    height: 62px;
}



/*

CONTENT

*/


#content
{
    background: url(/kids/graphics/bg-cardboard.jpg) repeat-y;
    width: 860px;
}


/*

MAIN

*/

.main-rpt
{
    background: url(/kids/graphics/main-rpt.png) no-repeat transparent bottom;
    width: 554px;
    min-height: 380px;
    height: auto !important;
    height: 380px;
}
.main-rpt .inner
{
    padding: 0 60px 0px 50px;
}
.main-top
{
    background: url(/kids/graphics/main-top.png) no-repeat transparent top;
    width: 554px;
    height: 100px;
    color: white;
}
.main-top .inner
{
    padding: 30px 0px 0px 30px;
}

.main-rpt-940
{
    background: url(/kids/graphics/main-rpt-940.png) no-repeat transparent bottom;
    width: 840px;
    min-height: 363px;
    height: auto !important;
    height: 363px;
}
.main-top-940
{
    background: url(/kids/graphics/main-top-940.png) no-repeat transparent top;
    width: 840px;
    height: 100px;
    color: white;
}
.main-top-940 .inner
{
    padding: 30px 0px 0px 30px;
}
.main-rpt-940 .inner
{
    padding: 10px 50px 70px 50px;
}


.main-rpt h2, .main-rpt-940 h2
{
    color: #0069bf;
}


a.thumb
{
    display: block;
    height: 165px;
    width: 165px;
    background: #0069bf;
}

.game-item
{
    width: 185px;
    float: left;
    margin-bottom: 10px;
}
.game-item .inner
{
    padding: 0px 10px 0px 10px;
}




/*

IDTABS

*/

.usual
{
    position: relative;
}

ul.idTabs
{
    float: left;
    margin-right: 10px;
    width: 122px;
    position: absolute;
    z-index: 4;
}
ul.idTabs li
{
    display: block;
    margin-bottom: 10px;
}
ul.idTabs li a
{
    display: block;
    height: 90px;
    width: 132px;
    margin-bottom: 0;
}

.usual ul li a.joypad
{
    background: url(/kids/graphics/icon-joypad.png) no-repeat top;
}
.usual ul li a.joypad.selected
{
    background: url(/kids/graphics/icon-joypad.png) no-repeat bottom;
}

.usual ul li a.brush
{
    background: url(/kids/graphics/icon-brush.png) no-repeat top;
}
.usual ul li a.brush.selected
{
    background: url(/kids/graphics/icon-brush.png) no-repeat bottom;
}

.usual ul li a.camera
{
    background: url(/kids/graphics/icon-camera.png) no-repeat top;
}
.usual ul li a.camera.selected
{
    background: url(/kids/graphics/icon-camera.png) no-repeat bottom;
}


.usual ul a
{
    text-transform: uppercase;
    display: block;
}
/*.usual ul li a.selected					{background: blue; border: none;}*/
.usual ul a:hover
{
}

#tab-games h2
{
    color: #0069bf;
}
#tab-make h2
{
    color: #37A400;
}
#tab-videos h2
{
    color: #FF543F;
}

.items
{
    float: right;
    width: 314px;
    margin-bottom: 50px;
}
#tab-games, #tab-make, #tab-videos
{
    float: left;
    width: 340px;
    position: relative;
}

a.img-container
{
    display: block;
    background: #0069bf;
    height: 200px;
    width: 314px;
    margin-bottom: 10px;
    color: white;
}


/*

SIDEBAR

*/

.sidebar-item
{
    background: url(/kids/graphics/side-rpt.png) no-repeat transparent bottom left;
    width: 266px;
    min-height: 103px;
    height: auto !important;
    height: 103px;
    color: white;
    position: relative;
}
.sidebar-item.btm
{
    background: url(/kids/graphics/side-rpt-btm.png) no-repeat transparent bottom left;
    width: 266px;
    min-height: 113px;
    height: auto !important;
    height: 113px;
}
.sidebar-item .inner
{
    padding: 0 100px 45px 20px;
}
.sidebar-top
{
    background: url(/kids/graphics/side-top.png) no-repeat transparent top;
    width: 266px;
    height: 30px;
}

a.admit1
{
    background: url(/kids/graphics/side-admit1.png) no-repeat transparent right;
    display: block;
    width: 266px;
    height: 140px;
    position: absolute;
    top: -20px;
    left: 0px;
}
a.admit1:hover
{
    background: url(/kids/graphics/side-admit1-hvr.png) no-repeat transparent right;
}
a.comp
{
    background: url(/kids/graphics/side-comp.png) no-repeat transparent right;
    display: block;
    width: 266px;
    height: 140px;
    position: absolute;
    top: -20px;
    left: 0px;
}
a.comp:hover
{
    background: url(/kids/graphics/side-comp-hvr.png) no-repeat transparent right;
}

.sidebar-item p
{
    margin-bottom: 0em;
}
.sidebar-item h2
{
    margin-bottom: 0.2em;
}

.sidebar-slide-item
{
    background: url(/kids/graphics/side-slide-rpt.png) no-repeat transparent bottom;
    width: 266px;
    min-height: 108px;
    height: auto !important;
    height: 88px;
    color: white;
}
.sidebar-slide-top
{
    background: url(/kids/graphics/side-slide-top.png) no-repeat transparent top;
    width: 266px;
    height: 65px;
}
.sidebar-slide-top .inner
{
    padding: 20px 0 0 20px;
}


/*

CAROUSEL

*/

#carousel .inner
{
    padding: 0px 0px 0px 22px;
}
#carousel_container
{
}
#carousel_inner
{
    position: relative;
    float: left; /* important for inline positioning */
    width: 150px; /* important (this width = width of list item(including margin) * items shown */
    overflow: hidden; /* important (hide the items outside the div) */
}
#carousel_ul
{
    position: relative;
    left: -150px; /* important (this should be negative number of list items width(including margin) */
    list-style-type: none;
    margin: 0px;
    padding: 0px;
    width: 9999px; /* important */
}
#carousel_ul li
{
    float: left; /* important for inline positioning of the list items */
    width: 140px; /* fixed width, important */
    padding: 0px;
    height: 60px;
    margin-left: 5px;
    margin-right: 5px;
}
#carousel_ul li img
{ .margin-bottom:-4px;/* IE is making a 4px gap bellow an image inside of an anchor (<a href...>) so this is to fix that*/cursor:pointer;border:0px;}
#left_scroll, #right_scroll
{
    float: left;
    height: 44px;
    width: 27px;
    margin-top: 10px;
    margin-left: 2px;
    margin-right: 2px;
}
#left_scroll img, #right_scroll img
{
    cursor: pointer;
}


/*

BOTTOM

*/

.speech-container
{
    margin-top: 20px;
    margin-bottom: 20px;
}
.speech-container h2
{
    color: #0069bf;
    margin-bottom: 0.25em;
}
.speech-top
{
    background: url(/kids/graphics/speech-top.png) no-repeat transparent top;
    width: 860px;
    height: 26px;
}
.speech-btm
{
    background: url(/kids/graphics/speech-btm-top.png) no-repeat transparent bottom;
    width: 860px;
    border:0px solid blue;
}
.speech-btm2
{
    background: url(/kids/graphics/speech-btm-bottom.png) no-repeat transparent;
    width: 860px;
    height: 184px;
    border:0px solid red;
}

.blobLink
{
    border:0px solid red;
    width:149px;
    height:98px;
    margin-left:70px;
    float:left;
}

.blobLink2
{
    border:0px solid red;
    width:149px;
    height:110px;
    margin-left:110px;
    float:left;
}

.blobLink3
{
    border:0px solid red;
    width:160px;
    height:98px;
    margin-left:150px;
    float:left;
}

#blobs-shelf .blobLink
{
    margin-left:78px;
    
}

#blobs-shelf .blobLink2
{
    margin-left:100px;
}

#blobs-shelf .blobLink3
{
    margin-left:132px;
}

.bubble-container
{
    padding-bottom: 42px;
}

.bubble-container .inner
{
    padding: 0px 30px;
}

.bubble-container .img-container
{
    display: block;
    height: 110px;
    width: 216px;
    background: #0069bf;
    overflow: hidden;
    margin-bottom: 10px;
}


#blobs-shelf
{
    background: url(/kids/graphics/blobs-shelf.png) no-repeat;
    height: 183px;
    margin-top: 20px;
}


/*

FOOTER

*/

#footer
{
    color: #312300;
    font-size: 0.8em;
}
#footer .inner
{
    padding: 10px 40px 40px 40px;
}
#footer p
{
    float: left;
}
#footer ul
{
    float: right;
}
#footer ul li
{
    float: left;
    color: #312300;
}
#footer ul li a
{
    color: #312300;
    text-decoration: none;
    margin-left: 10px;
}
#footer ul li a:hover
{
    color: #312300;
    text-decoration: underline;
    cursor: pointer;
}

div#flashcontent
{
    padding-bottom:15px;
}