/* Reset the whole shebang */
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;
}
*:focus {
	outline: none;
}
*::-moz-focus-inner {
	border: none;
}
/* 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;
}
/* All reset now, thank you */
.clearfix:after {
	visibility: hidden;
	display: block;
	font-size: 0;
	content: " ";
	clear: both;
	height: 0;
}
.clearfix { display: inline-block; }
/* start commented backslash hack */
* html .clearfix { height: 1%; }
.clearfix { display: block; }
/* close commented backslash hack */
/* IE6 png fix */
img, div, a, input, h1, h2, h3, h4, h5, h6, ol, ul, li {
	behavior: url(http://magicbelles.com/css/iepngfix.htc)
}
/* IE6 png fixed */
#sm2-container {
	width: 50px;
	height: 50px;
	position: absolute;
	top: 0;
	left: 0;
	float: left;
	z-index: 1000;
}
.swf_unblocked, .swf_loaded {
	margin-left: -100px;
}
html {
	height: 100%;
}
body {
	font: normal 62.5% 'MuseoSans500', "Helvetica Neue", Helvetica, Arial, Geneva, sans-serif;
	height: 100%;
	color: #ce137b;
}
/* little fix for iPhone width */
@media screen and (max-device-width: 480px) {
body {
-webkit-text-size-adjust: none;
}
}

.hideMe {
	visibility: hidden;
	display: none;
	margin: 0;
	padding: 0;
	height: 0;
	width: 0;
}
#page {
	position: relative;
	min-height: 100%;
	height: 100%;
	height: auto !important;
}
html>body #page {
	height: auto !important;
}
a {
	color: #ce137b;
	text-decoration: none;
	-webkit-transition: color .25s linear;
	-moz-transition: color .25s linear;
	-ms-transition: color .25s linear;
	-o-transition: color .25s linear;
	transition: color .25s linear;
}
a:hover {
	color: #662d91;
	text-decoration: none;
	-webkit-transition: color .25s linear;
	-moz-transition: color .25s linear;
	-ms-transition: color .25s linear;
	-o-transition: color .25s linear;
	transition: color .25s linear;
}

#header {
	width: 1000px;
	margin: 0 auto;
	height: 170px;
}
em, i {
	font-family: 'MuseoSans500Italic', "Helvetica Neue", Helvetica, Arial, Geneva, sans-serif;
	font-style: normal;
}
h1 {
	text-indent: -9999px;
	background: url(../images/mainlogo.png) no-repeat;
	float: left;
	margin: 0;
	padding: 0;
}
h1 a {
	width: 270px;
	height: 170px;
	display: block;
}
h2 {
	text-indent: -3300px;
}
/* nav classes */
#nav ul, nav ul {
	float: left;
	background: url(../images/startrail.png) no-repeat;
	width: 730px;
	height: 170px;
	list-style-type: none;
	margin: 0;
	padding: 0;
}
#nav ul li, nav ul li {
	float: left;
	height: 170px;
	display: block;
}
#nav ul li a, nav ul li a {
	height: 170px;
	display: block;
}
#nav ul li.meetthebelles, nav ul li.meetthebelles {
	width: 104px;
}
#nav ul li.magicmusic, nav ul li.magicmusic {
	width: 104px;
}
#nav ul li.fairyfans, nav ul li.fairyfans {
	width: 105px;
}
#nav ul li.makesandbakes, nav ul li.makesandbakes {
	width: 105px;
}
#nav ul li.colouringfun, nav ul li.colouringfun {
	width: 102px;
}
#nav ul li.gamesandstories, nav ul li.gamesandstories {
	width: 105px;
}
#nav ul li.fairyplayclub, nav ul li.fairyplayclub {
	width: 105px;
}

.meetthebelles {
	background: url(../images/navmatrix.png) no-repeat 0 5px;
}
.magicmusic {
	background: url(../images/navmatrix.png) no-repeat -104px 5px;
}
.fairyfans {
	background: url(../images/navmatrix.png) no-repeat -208px 5px;
}
.makesandbakes {
	background: url(../images/navmatrix.png) no-repeat -313px 5px;
}
.colouringfun {
	background: url(../images/navmatrix.png) no-repeat -418px 5px;
}
.gamesandstories {
	background: url(../images/navmatrix.png) no-repeat -520px 5px;
}
.fairyplayclub {
	background: url(../images/navmatrix.png) no-repeat -625px 5px;
}
.meetthebelles:hover, .meetthebelleson:hover {
	background: url(../images/navmatrix.png) no-repeat 0 -165px;
}
.magicmusic:hover, .magicmusicon:hover {
	background: url(../images/navmatrix.png) no-repeat -104px -165px;
}
.fairyfans:hover, .fairyfanson:hover {
	background: url(../images/navmatrix.png) no-repeat -208px -165px;
}
.makesandbakes:hover, .makesandbakeson:hover {
	background: url(../images/navmatrix.png) no-repeat -313px -165px;
}
.colouringfun:hover, .colouringfunon:hover {
	background: url(../images/navmatrix.png) no-repeat -418px -165px;
}
.gamesandstories:hover, .gamesandstorieson:hover {
	background: url(../images/navmatrix.png) no-repeat -520px -165px;
}
.fairyplayclub:hover, .fairyplayclubon:hover {
	background: url(../images/navmatrix.png) no-repeat -625px -165px;
}
.meetthebelles:active, .meetthebelleson {
	background: url(../images/navmatrix.png) no-repeat 0 -335px;
}
.magicmusic:active, .magicmusicon {
	background: url(../images/navmatrix.png) no-repeat -104px -335px;
}
.fairyfans:active, .fairyfanson {
	background: url(../images/navmatrix.png) no-repeat -208px -335px;
}
.makesandbakes:active, .makesandbakeson {
	background: url(../images/navmatrix.png) no-repeat -313px -335px;
}
.colouringfun:active, .colouringfunon {
	background: url(../images/navmatrix.png) no-repeat -418px -335px;
}
.gamesandstories:active, .gamesandstorieson {
	background: url(../images/navmatrix.png) no-repeat -520px -335px;
}
.fairyplayclub:active, .fairyplayclubon {
	background: url(../images/navmatrix.png) no-repeat -625px -335px;
}
/* end nav classes */
.textbox {
	width: 310px;
	min-height: 350px;
	float: left;
	position: relative;
	margin-left: 0;
	margin-right: 0;
	overflow: visible;
}
.texttop {
	width: 310px;
	height: 26px;
}
.textmiddle {
	padding-right: 30px;
	padding-left: 30px;
	width: 255px;
	min-height: 362px;
	margin-top: -1px;
}
.textbottom {
	width: 310px;
	height: 26px;
	margin-top: -1px;
}

.textbox p {
	color: #fff;
	line-height: 1.5;
	padding-bottom: .75em;
	margin-bottom: 0;
	font-size: 1.5em;
	font-weight: normal;
	font-style: normal;
}

a.twist img {
     -moz-transition: all 0.25s ease-out;  
       -o-transition: all 0.25s ease-out;  
  -webkit-transition: all 0.25s ease-out;  
          transition: all 0.25s ease-out;
	display: inline-block;
}
a.twist img:hover {
     -moz-transform: rotate(5deg);  
       -o-transform: rotate(5deg);  
  -webkit-transform: rotate(5deg);  
      -ms-transform: rotate(5deg);  
          transform: rotate(5deg);  
      -moz-transition: all 0.25s ease-out;  
       -o-transition: all 0.25s ease-out;  
  -webkit-transition: all 0.25s ease-out;  
          transition: all 0.25s ease-out;  	
}
a.backtwist img {
     -moz-transition: all 0.25s ease-out;  
       -o-transition: all 0.25s ease-out;  
  -webkit-transition: all 0.25s ease-out;  
          transition: all 0.25s ease-out;
	display: inline-block;
}
a.backtwist img:hover {
     -moz-transform: rotate(-3deg);  
       -o-transform: rotate(-3deg);  
  -webkit-transform: rotate(-3deg);  
      -ms-transform: rotate(-3deg);  
          transform: rotate(-3deg);  
     -moz-transition: all 0.25s ease-out;  
       -o-transition: all 0.25s ease-out;  
  -webkit-transition: all 0.25s ease-out;  
          transition: all 0.25s ease-out;  	
}
/* modifiers */
.floatleft {
	float: left;
}
.floatright {
	float: right;
}
.clearleft {
	clear: left;
}
.clearright {
	clear: right;
}
.shadowed {
	-moz-box-shadow: 0px 0px 5px rgba(0,0,0,0.5);
	-webkit-box-shadow: 0px 0px 5px rgba(0,0,0,0.5);
	box-shadow: 0px 0px 5px rgba(0,0,0,0.5);
}
.shadowedbig {
	-moz-box-shadow: 0px 0px 10px rgba(0,0,0,0.75);
	-webkit-box-shadow: 0px 0px 10px rgba(0,0,0,0.75);
	box-shadow: 0px 0px 10px rgba(0,0,0,0.75);
}
.stroked {
	border: 5px solid #fff;
}
.dashed {
	border: 2px dashed #ce137b;
}
.rounded {
	-moz-border-radius: 20px;
	-khtml-border-radius: 20px;
	-webkit-border-radius: 20px;
	border-radius: 20px;
}
.roundedsmall {
	-moz-border-radius: 10px;
	-khtml-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px;
}
.rotatedright {
     -moz-transform: rotate(5deg);  
       -o-transform: rotate(5deg);  
  -webkit-transform: rotate(5deg);  
      -ms-transform: rotate(5deg);  
          transform: rotate(5deg);  
}
.rotatedleft {
     -moz-transform: rotate(-2deg);  
       -o-transform: rotate(-2deg);  
  -webkit-transform: rotate(-2deg);  
      -ms-transform: rotate(-2deg);  
          transform: rotate(-2deg);  
}
/* end modifiers */

.dottedtop {
	width: 238px;
	height: 23px;
	background: url(../images/dottedtop.png) no-repeat;
	display: block;
}
.dottedmiddle {
	background: url(../images/dottedmiddle.png) repeat-y 0 top;
	width: 198px;
	padding-right: 20px;
	padding-left: 20px;
	color: #662d91;
	font-size: 1.6em;
	line-height: 1.33;
	text-align: center;
}
.dottedbottom {
	width: 238px;
	height: 23px;
	background: url(../images/dottedbottom.png) no-repeat;
	display: block;
}

#ribbon {
	width: 1000px;
	height: 210px;
	float: left;
	margin-top: -80px;
	background: url(../images/pinkribbon.png) no-repeat;
	position: relative;
}
.subnav {
	height: 210px;	
}
ul.subnav li {
	float: left;
}

#push {
	height: 100px;
	clear: both;
	margin: 0;
}
#footer {
	position: absolute;
	bottom: 0;
	background: white url(../images/bgfooter.png) repeat-x center top;
	min-height: 50px;
	width: 100%;
	margin: 0;
	padding: 45px 0 0;
}
#footer p {
	width: 1000px;
	text-align: center;
	line-height: 1.25;
	margin-right: auto;
	margin-left: auto;
}
p.links {
	font-size: 1.3em;
	margin-top: .5em;
	margin-bottom: .5em;
}
.privacyLink {
	text-transform: uppercase;
}
a.privacyLink {
	color: #EC5835;
}

p.copyright {
	font-size: 1em;
	margin-bottom: 1em;
}
.facebookLike {
	margin-left: 10px;
	padding-top: 5px;
	margin-bottom: -5px;
}
.kidsafeFooter {
	float: right;
	padding-right: 10px;
}
.languageSwitcher {
	display: none;
	right: -103px;
	width: 125px;
	padding: 5px 5px 0;
	-moz-border-radius: 5px;
	-khtml-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	opacity: 0.5;
}
.languageSwitcher:hover {
	opacity: 1;
}
.languageSwitcher ul {
	font-size: 1.2em;
}
.languageSwitcher ul li {
	height: 22px;
	padding-top: 2px;
	display: block;
	padding-left: 30px;
	margin-top: 1px;
}
li.GB, li.BR, li.ES, li.FR {
	opacity: 0.5;
}
li.GBon, li.BRon, li.ESon, li.FRon {
	opacity: 1;
}
li.GB:hover, li.BR:hover, li.ES:hover, li.FR:hover {
	opacity: 1;
}
li.GB, li.GBon {
	background: url(../images/GB.png) no-repeat;
}
li.BR, li.BRon {
	background: url(../images/BR.png) no-repeat;
}
li.ES, li.ESon {
	background: url(../images/ES.png) no-repeat;
}
li.FR, li.FRon {
	background: url(../images/FR.png) no-repeat;
}
/*
.languageOther {
	position: fixed;
	bottom: 10px;
	background-color: #aae1fa;
	background-color: rgba(170,225,250,0.75);
	border: 2px solid #662d91;
}
*/
.languageHome, .languageOther {
	position: fixed;
	top: 30px;
	background-color: #fff;
	background-color: rgba(255,255,255,0.75);
	border: 2px solid #fff;
}

.backarrow {
	font-size: 1.5em;
	position: absolute;
	float: left;
	top: 33%;
	left: -120px;
	width: 120px;
	min-height: 70px;	
	padding-right: 60px;
	margin-left: -0.5em;
	background: url(../images/backtriangle.png) no-repeat center right;
}
.backlink {
	border: 2px solid white;
	padding-top: 0.5em;
	padding-left: 1em;
	padding-right: 0.5em;
	padding-bottom: 0.5em;
			box-shadow: 0px 0px 10px rgba(0,0,0,0.25);
	-webkit-box-shadow: 0px 0px 10px rgba(0,0,0,0.25);
			border-radius: 10px;
	-webkit-border-radius: 10px;
	background-color: #ed85b7;
	background-image: -webkit-gradient(linear, left top, left bottom, from(#ed85b7), to(#e973ab));
	background-image: -webkit-linear-gradient(top, #ed85b7, #e973ab);
	background-image:    -moz-linear-gradient(top, #ed85b7, #e973ab);
	background-image:      -o-linear-gradient(top, #ed85b7, #e973ab);
	background-image:         linear-gradient(to bottom, #ed85b7, #e973ab);
}
a.clubButton {
	float: right;
	display: block;
	position: relative;
	z-index: 10;
	height: 175px;
	width: 175px;
	background: url(../images/clubstar.png) no-repeat 0 0;
	margin-top: -190px;
	margin-left: 20px;
	text-indent: -9999px;
}
a.clubButton:hover {
	background: url(../images/clubstar.png) no-repeat 0 -175px;
}
a.albumButton {
	float: left;
	display: block;
	position: relative;
	z-index: 11;
	height: 175px;
	width: 175px;
	background: url(../images/albumstar.png) no-repeat 0 0;
	margin-top: -190px;
	margin-left: 20px;
	text-indent: -9999px;
}
a.albumButton:hover {
	background: url(../images/albumstar.png) no-repeat 0 -190px;
}
a.appButton {
	float: right;
	display: block;
	position: relative;
	z-index: 11;
	height: 175px;
	width: 175px;
	background: url(../images/appstar.png) no-repeat 0 0;
	margin-top: -190px;
	margin-left: 20px;
	text-indent: -9999px;
}
a.appButton:hover {
	background: url(../images/appstar.png) no-repeat 0 -190px;
}
.promo {
	width: 100%;
	height: 110px;
	position: fixed;
	z-index: 1000;
	bottom: 0;
	left: 0;
	background: url(../images/storytimebg.png) repeat-x;
	text-align: center;
}
.promo a {
	text-align: center;
	padding: 0;
	margin: 0;
	width: 1000px;
	height: 110px;
}
.promo a img {
	margin-bottom: 0;
}
.promo button {
	border: none;
	left: 0;
}