/*
Yahoo! reset
Copyright (c) 2007, Yahoo! Inc. All rights reserved.
Code licensed under the BSD License:
http://developer.yahoo.net/yui/license.txt
version: 2.4.1
*/
* { outline:none; }
html{color:#000;background:#FFF;}
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,p,blockquote,th,td{margin:0;padding:0;}
table{border-collapse:collapse;border-spacing:0;}
fieldset,img{border:0;}
address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal;}
li{list-style:none;}
caption,th{text-align:left;}
h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}
q:before,q:after{content:'';}
abbr,acronym {border:0;font-variant:normal;}
/* to preserve line-height and selector appearance */
sup {vertical-align:text-top;}
sub {vertical-align:text-bottom;}
input,textarea,select{font-family:inherit;font-size:inherit;font-weight:inherit;}
/*because legend doesn't inherit in IE */
legend{color:#000;}





/*
Yahoo! fonts
Copyright (c) 2007, Yahoo! Inc. All rights reserved.
Code licensed under the BSD License:
http://developer.yahoo.net/yui/license.txt
version: 2.4.1
*/
/**
 * Percents could work for IE, but for backCompat purposes, we are using keywords.
 * x-small is for IE6/7 quirks mode.
 */
body {font:13px/1.231 arial,helvetica,clean,sans-serif;*font-size:small;}
input,textarea,select{*font:100% arial,helvetica,clean,sans-serif;}
table {font-size:inherit;font:100%;}
/**
 * Bump up IE to get to 13px equivalent
 */
pre,code,kbd,samp,tt {font-family:monospace;*font-size:108%;line-height:100%;}





/*
Yahoo! base
Copyright (c) 2007, Yahoo! Inc. All rights reserved.
Code licensed under the BSD License:
http://developer.yahoo.net/yui/license.txt
version: 2.4.1
*/
/* base.css, part of YUI's CSS Foundation */
strong {
	/*bringing boldness back to the strong element*/
	font-weight:bold; 
}
abbr,acronym {
	/*indicating to users that more info is available */
	border-bottom:1px dotted #000;
	cursor:help;
} 
em {
	/*bringing italics back to the em element*/
	font-style:italic;
}
blockquote {
	/*giving blockquotes room to breath*/
	margin:1em;
}
ol,ul,dl {
	/*bringing lists on to the page with breathing room */
	margin-left:2.5em;
}
ol li {
	/*giving OL's LIs generated numbers*/
	list-style: decimal outside;	
}
ul li {
	/*giving UL's LIs generated disc markers*/
	list-style: disc outside;
}
dl dd {
	/*giving UL's LIs generated numbers*/
	margin-left:1em;
}
th,td {
	/*borders and padding to make the table readable*/
	/*border:1px solid #000;*/
	padding:.5em;
}
th {
	/*distinguishing table headers from data cells*/
	font-weight:bold;
	text-align:center;
}
caption {
	/*coordinated margin to match cell's padding*/
	margin-bottom:.5em;
	/*centered so it doesn't blend in to other content*/
	text-align:center;
}
p,fieldset,table,pre {
	/*so things don't run into each other*/
	margin-bottom:1em;
}
/* setting a consistent width, 160px; 
   control of type=file still not possible */
input[type=text],input[type=password],textarea{width:12.25em;*width:11.9em;}


/**
 * typography
 */

#wrapper {
	font-size: 93%; /* 12px */
}
#wrapper h1, h1 {
	font-size: 138.5%; /* 18px */
}
#wrapper h2 {
	font-size: 116%; /* 15px */
}
#wrapper h3 {
	font-size: 100%; /* 13px */
}

/* colors */
 
html, body {
	background: #fff;
	color: #000;
}

html.marketiframe, .marketiframe body {
	background: #fff;
}

html.blueberry, .blueberry body {
	background: #fff url(../images/assets/backgrounds/bb.png);
}

html.breakfast, .breakfast body {
	background: #fff url(../images/assets/backgrounds/breakfast.png);
}

html.brownsugarcinnamon, .brownsugarcinnamon body {
	background: #fff url(../images/assets/backgrounds/bsg.png);
}

html.cherry, .cherry body {
	background: #fff url(../images/assets/backgrounds/red.png);
}

html.strawberry, .strawberry body {
	background: #fff url(../images/assets/backgrounds/pink.png);
}

html.holiday1, .holiday1 body {
	background: #fff url(../images/assets/backgrounds/holiday1.png);
}

html.holiday2, .holiday2 body {
	background: #fff url(../images/assets/backgrounds/holiday2.png);
}

a {
	color: #c00;
}

a:hover {
	color: #000;
}

a:active {
	outline: none;
}

a:focus {
	-moz-outline-style: none;
}


/* headers */

.heading {
	margin-bottom: 15px;
	overflow: hidden;
	text-indent: -500em;
}

#hd_topgames {
	background: url(../images/hd_topgames.png) no-repeat;
	height: 26px;
}

#hd_allgames {
	background: url(../images/hd_allgames.png) no-repeat;
	height: 27px;
	margin: 30px 0;
}

#hd_topactivities {
	background: url(../images/hd_topactivities.png) no-repeat;
	height: 26px;
}
 
#hd_allactivities {
	background: url(../images/hd_allactivities.png) no-repeat;
	height: 27px;
	margin: 30px 0;
}

#hd_topvideos {
	background: url(../images/hd_topvideos.png) no-repeat;
	height: 26px;
}

#hd_allvideos {
	background: url(../images/hd_allvideos.png) no-repeat;
	height: 27px;
	margin: 30px 0;
}

#hd_also {
	background: url(../images/hd_also.png) no-repeat;
	height: 31px;
	margin: 30px 0;
}

#hd_games_large {
	background: url(../images/hd_games_large.png) no-repeat;
	height: 25px;
}

#hd_activities_large {
	background: url(../images/hd_activities_large.png) no-repeat;
	height: 25px;
}

#hd_videos_large {
	background: url(../images/hd_videos_large.png) no-repeat;
	height: 25px;
}

#hd_games {
	background: url(../images/hd_games.png) no-repeat;
	height: 14px;
}

#hd_activities {
	background: url(../images/hd_activities.png) no-repeat;
	height: 14px;
}

#hd_videos {
	background: url(../images/hd_videos.png) no-repeat;
	height: 14px;
}

#hd_mystuff {
	background: url(../images/hd_mystuff.png) no-repeat;
	height: 71px;
	margin: 0 20px 60px 20px;
}

#hd_mystuff_games {
	background: url(../images/hd_mystuff_games.png) no-repeat;
	cursor: pointer;
	height: 34px;
	margin: 10px auto 20px auto;
	width: 604px;
}

#hd_mystuff_activities {
	background: url(../images/hd_mystuff_activities.png) no-repeat;
	cursor: pointer;
	height: 34px;
	margin: 10px auto 20px auto;
	width: 609px;
}

#hd_mystuff_videos {
	background: url(../images/hd_mystuff_videos.png) no-repeat;
	cursor: pointer;
	height: 34px;
	margin: 10px auto 20px auto;
	width: 604px;
}

#hd_mystuff_avatars {
	background: url(../images/hd_mystuff_avatars.png) no-repeat;
	height: 14px;
	margin: 10px auto 20px auto;
	width: 274px;
}

#hd_mystuff_backgrounds {
	background: url(../images/hd_mystuff_backgrounds.png) no-repeat;
	height: 32px;
	margin: 10px auto 20px auto;
	width: 538px;
}

#hd_mystuff_goodies {
	background: url(../images/hd_mystuff_goodies.png) no-repeat;
	height: 33px;
	margin: 10px auto 20px auto;
	width: 404px;
}

#hd_mystuff_boosters {
	background: url(../images/hd_mystuff_boosters.png) no-repeat;
	height: 21px;
	width: 135px;
}

#hd_mystuff_levels {
	background: url(../images/hd_mystuff_levels.png) no-repeat;
	height: 21px;
	width: 92px;
}

#hd_mystuff_screensavers {
	background: url(../images/hd_mystuff_screensavers.png) no-repeat;
	height: 22px;
	width: 217px;
}

#hd_mystuff_music {
	background: url(../images/hd_mystuff_music.png) no-repeat;
	height: 22px;
	width: 80px;
}

#hd_mystuff_wallpaper {
	background: url(../images/hd_mystuff_wallpaper.png) no-repeat;
	height: 22px;
	width: 146px;
}

#hd_mystuff_icons {
	background: url(../images/hd_mystuff_icons.png) no-repeat;
	height: 21px;
	width: 79px;
}

#hd_market {
	background: url(../images/hd_market.png) no-repeat;
	height: 290px;
	margin: 10px auto 20px auto;
	width: 571px;
}


/**
 * layout
 */
 
.clearfix:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}

.clearfix {display: inline-block;}

/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */

.clearfix p, .clearfix ul, .clearfix ol, .clearfix dl { /* change bottom margin to bottom padding on child elements of clearfix because IE loses the bottom margin on floated elements */
	margin-bottom: 0;
	padding-bottom: 1em;
}

.game #wrapper, .activity #wrapper, .noflash #wrapper, .error404 #wrapper {
	background: #fff;
	width: 970px;
	height: 600px;
}

#wrapper {
	background: #fff url(../images/bg_wrapper.png) repeat-y;
	border: 1px solid #000;
	margin: 5px auto;
	overflow: auto;
	position: relative;
	width: 953px;
}


#wrapper-inner {
	overflow: auto;
	position: relative;
	width: 953px;
}

#sidebar {
	float: left;
	width: 222px;
}

#wrapper-content {
	float: right;
	min-height: 583px;
	overflow-x: hidden;
	overflow-y: visible;
	position: relative;
	width: 730px;
}

* html #wrapper-content {
	height: 583px;
}

#footer {
	margin: 0 auto;
	padding: 10px 0;
	width: 955px;
	font-size: 11px;
}

#footer .left {
	float: left;
}

#footer .right {
	float: right;
}

#footer .pu-notice {
	clear: both;
}

/* left sidebar */

#logo_pt {
	cursor: pointer;
}

#sidebar img {
	display: block;
}


#nav {
	height: 206px; /* IE6!!! */
	margin: 0 0 10px 5px;
	overflow: hidden; /* IE6!!! */
	padding: 0;
	width: 211px;
}

#nav li {
	list-style: none;
}

#nav a {
	display: block;
	overflow: hidden;
	text-indent: -5000em;
	width: 211px;
}

#nav_home {
	background-position: 0 0 !important;
	height: 27px;
}

#nav_home.on, #nav_home:hover {
	background-position: -220px 0 !important;
}

#nav_games {
	background-position: 0 -27px !important;
	height: 30px;
}

#nav_games.on, #nav_games:hover, .games #nav_games {
	background-position: -220px -27px !important;
}

#nav_activities {
	background-position: 0 -57px !important;
	height: 29px;
}

#nav_activities.on, #nav_activities:hover, .activities #nav_activities {
	background-position: -220px -57px !important;
}

#nav_poptube {
	background-position: 0 -86px !important;
	height: 29px;
}

#nav_poptube.on, #nav_poptube:hover, .videos #nav_poptube {
	background-position: -220px -86px !important;
}

#nav_market {
	background-position: 0 -116px !important;
	height: 29px;
}

#nav_market.on, #nav_market:hover, .market #nav_market {
	background-position: -220px -116px !important;
}

#nav_news {
	background-position: 0 -146px !important;
	height: 31px;
}

#nav_news.on, #nav_news:hover {
	background-position: -220px -146px !important;
}

#nav_login {
	background-position: 0 -177px !important;
	float: left;
	height: 29px;
	width: 106px !important;
}

#nav_login.on, #nav_login:hover {
	background-position: -220px -177px !important;
}

#nav_logout {
	background-position: 0 -206px !important;
	height: 29px;
}

#nav_logout.on, #nav_logout:hover {
	background-position: -220px -206px !important;
}

#nav_register {
	background-position: -106px -177px !important;
	float: right;
	height: 29px;
	width: 105px !important;
}

#nav_register.on, #nav_register:hover {
	background-position: -326px -177px !important;
}

#bt_mystuff {
	background-position: 0 0 !important;
	height: 22px;
	overflow: hidden;
	text-indent: -5000em;
	width: 120px;
}

#bt_mystuff.on, #bt_mystuff:hover {
	background-position: -130px 0 !important;
}

a.togglepanel {
	height: 24px;
	overflow: hidden;
	position: absolute;
	right: 0;
	text-indent: -5000em;
	top: 0;
	width: 32px;
}

.panelitems img {
	float: left;
	margin-right: 8px;
}

.panelitems h3, h2 {
	margin: 3px 0;
}

.panelitems h3 a {
	color: #000;
	text-decoration: none;
}

.panelitems h3 a:hover {
	color: #c00;
}

.panelitems p {
	font-size: 85%; /* 11px */
	margin: 3px 0;
}

/* content */

#content {
	margin: 20px;
}

.topitems {
	margin: 0 40px 20px 40px;
	overflow: auto;
}

.allitems {
	margin: 0 0 20px 0;
}

.topitem {
	float: left;
	margin: 0 10px 0 0;
	position: relative;
	width: 190px;
}

.allitem, .related {
	float: left;
	margin: 0 20px 20px 0;
	position: relative;
	width: 210px;
}

.relateditem {
	position: relative;
}

.item {
	margin-bottom: 10px;
}

.allitem img, .related .item img {
	float: left;
	margin-right: 3px;
}

.item h3 {
	margin: 3px 0;
}

.allitems .item h3, .related .item h3 {
	margin: 10px 0 3px 0;
}

.item h3 a {
	color: #000;
	text-decoration: none;
}

.item h3 a:hover, .item h3 a.hover {
	color: #c00;
}

.item p {
	clear: left;
	font-size: 85%; /* 11px */
	margin: 3px 0;
}

.item span.highlight {
	cursor: pointer;
	display: none;
	height: 61px;
	left: 0;
	position: absolute;
	top: 0;
	width: 61px;
}

.topitem span.highlight {
	height: 126px;
	width: 125px;
}

.panelitems span.highlight {
	height: 35px;
	left: 10px;
	top: 30px;
	width: 35px;
}

.item a.hover span.highlight {
	display: block;
}

.related-header {
	margin: 10px 0;
	text-align: center;
}

#related_games{
	margin-left:105px;
}

#related_videos {
	display:none;
}

/* my stuff page */

.mystuff #content {
	margin: 20px 0;
}

.mystuff .allitems {
	margin: 20px;
}

#bt_login {
	background-position: 0 0 !important;
	display: block;
	height: 41px;
	margin: 30px auto;
	overflow: hidden;
	text-indent: -5000em;
	width: 215px;
}

#bt_login:hover {
	background-position: 0 -50px !important;
}

#nav_mystuff {
	height: 54px; /* IE6!!! */
	margin: 0 0 10px 50px;
	overflow: hidden; /* IE6!!! */
	padding: 0;
	width: 680px;
}

#nav_mystuff li {
	float: left;
	list-style: none;
}

#nav_mystuff a {
	display: block;
	overflow: hidden;
	text-indent: -5000em;
}

#nav_mystuff_games {
	background-position: 0 -2px !important;
	height: 54px;
	width: 103px;
}

#nav_mystuff_games.on, #nav_mystuff_games:hover {
	background-position: 0 -66px !important;
}

#nav_mystuff_activities {
	background-position: -103px -2px !important;
	height: 54px;
	width: 120px;
}

#nav_mystuff_activities.on, #nav_mystuff_activities:hover {
	background-position: -103px -66px !important;
}

#nav_mystuff_videos {
	background-position: -223px 0 !important;
	height: 54px;
	width: 100px;
}

#nav_mystuff_videos.on, #nav_mystuff_videos:hover {
	background-position: -223px -64px !important;
}

#nav_mystuff_avatars {
	background-position: -323px 0 !important;
	height: 54px;
	width: 106px;
}

#nav_mystuff_avatars.on, #nav_mystuff_avatars:hover {
	background-position: -323px -64px !important;
}

#nav_mystuff_backgrounds {
	background-position: -429px 0 !important;
	height: 54px;
	width: 144px;
}

#nav_mystuff_backgrounds.on, #nav_mystuff_backgrounds:hover {
	background-position: -429px -64px !important;
}

#nav_mystuff_goodies {
	background-position: -573px 0 !important;
	height: 54px;
	width: 157px;
}

#nav_mystuff_goodies.on, #nav_mystuff_goodies:hover {
	background-position: -573px -64px !important;
}

p.mystuff_empty {
	display: none;
	margin-top: 30px;
	text-align: center;
}

.mystuff .allitem p {
	clear: left;
	padding: 10px 0 10px 2px;
}

a.removefrommystuff {
	display: block;
	height: 22px;
	overflow: hidden;
	text-indent: -500em;
	width: 83px;
}

#mystuff_avatars span.highlight {
	height: 126px;
	width: 125px;
}

#mystuff_avatars .item p {
	padding: 0;
	position: relative;
	top: -10px;
}

#mystuff_backgrounds span.highlight {
	height: 120px;
	width: 178px;
}

#mystuff_goodies span.highlight, .market #content span.highlight {
	height: 121px;
	width: 120px;
}

#mystuff_goodies h4.heading, .market #content h4 {
	clear: left;
	margin: 20px 40px;
}

#mystuff_goodies .allitem, .market #content .allitem {
	margin: 0 50px 10px 50px;
	text-align: center;
	width: 120px;
}


/*#mystuff_games, #mystuff_activities, #mystuff_videos, #mystuff_avatars, #mystuff_backgrounds {
	display: none;
}
*/
a.removefrommystuff:hover {
/*	background-position: 0 -28px; TODO hover state? */
}

a.seticon {
	display: block;
	height: 22px;
	margin: 0 6px;
	overflow: hidden;
	text-indent: -500em;
	width: 120px;
}

a.setbg {
	display: block;
	height: 22px;
	margin: 0 17px;
	overflow: hidden;
	text-indent: -500em;
	width: 143px;
}

/* market page */

#bt_getit {
	background-position: 0 0 !important;
	float: left;
	height: 26px;
	margin-right: 30px;
	overflow: hidden;
	text-indent: -5000em;
	width: 86px;
}

#bt_getit:hover {
	background-position: 0 -30px !important;
}

#bt_downloadnow {
	background-position: 0 0 !important;
	display: block;
	height: 26px;
	margin-right: 30px;
	overflow: hidden;
	text-indent: -5000em;
	width: 215px;
}

#bt_downloadnow:hover {
	background-position: 0 -30px !important;
}

#bt_playgame {
	background-position: 0 0 !important;
	display: block;
	height: 26px;
	margin-right: 30px;
	overflow: hidden;
	text-indent: -5000em;
	width: 215px;
}

#bt_playgame:hover {
	background-position: 0 -30px !important;
}

#bt_close {
	background-position: 0 0 !important;
	float: left;
	height: 26px;
	overflow: hidden;
	text-indent: -5000em;
	width: 86px;
}

#bt_close:hover {
	background-position: 0 -30px !important;
}


/* flyout panels */

#loginpanel, #registerpanel {
	background: url(../images/bg_login.gif) no-repeat;
	height: 543px;
	left: -600px;
	padding: 0 15px 0 85px;
	position: absolute;
	top: 20px;
	width: 500px;
}

#loginpanel p, #registerpanel p {
	margin: 15px 0 0 0;
	text-align: right;
}

#loginpanel iframe, #registerpanel iframe {
	height: 305px;
	margin-top: 10px;
	width: 450px;
}

#marketpanel {
	background: url(../images/bg_marketpanel.gif) no-repeat;
	height: 384px;
	left: 730px;
	padding: 10px 10px 0 25px;
	position: absolute;
	top: 100px;
	width: 280px;
}

#marketpanel iframe {
	height: 310px;
	width: 270px;
}

#banner {
	height: 543px;
	left: 730px;
	padding: 0;
	position: absolute;
	top: 20px;
	width: 360px;
	border: 1px solid black;
}

#stafpanel {
	background: #ffffff;
	height: 333px;
	left: -600px;
	position: absolute;
	top: 20px;
	width: 600px;
}