
	/* JQUERY MOBILE OVERRIDE */
		.ui-mobile .ui-page,
		.ui-page-header-fixed			{padding-top:0!important}
		.ui-header-fixed				{z-index:5000;}
		.ui-content						{position:relative; z-index:4000; margin:0; padding:0; }
		.ui-footer-fixed				{z-index:5000;}
		.ui-mobile label					{margin:0; display:block; }
	/* END JQUERY MOBILE OVERRIDE */

	
	
	/* HEADER */	
		.header							{padding-top:0!important; border-width:0!important;}		
		
		.hotCorner 						{color:white; padding-top: 20px;} /* for any text */
		.hotCorner .text					{display:block; color:white; text-decoration:none; margin:0; font-size:1.2em;}
		
		.leftHotCorner					{float:left; position:relative; display:block; width:100px; height:85px; background:url(/assets/images/design/hot-corner-left.png) 100% no-repeat;}
		.leftHotCorner .icon				{position:absolute; top:0; left:0;}
		.leftHotCorner .icon.active,
		.leftHotCorner .icon:hover		{color:#00a69b}
		
		.rightHotCorner					{float:right; position:relative; display:block; width: 100px; height: 85px; background:url(/assets/images/design/hot-corner-right.png) 0 no-repeat;}
		.rightHotCorner .icon			{position:absolute; top:0; right:0;}
		.rightHotCorner .icon.active,
		.rightHotCorner .icon:hover		{color:#00a69b}
		
		.hotCorner .icon					{color:white; text-decoration:none;}
		.hotCorner .icon-back			{font-size:2em;   padding:20px 30px 40px 10px;}
		.hotCorner .icon-question		{font-size:4em;   padding:15px 40px 20px 15px; font-family:'signikabold';}
		.hotCorner .icon-no				{font-size:2.5em; padding:15px 15px 30px 40px;}
	/* END HEADER */

	

	/* FOOTER */
		.footer								{background:black; padding:5px 0; overflow:hidden}
			.footer ul						{margin:0 0 0 20px; padding:0; list-style:none; overflow:hidden}
				.footer li					{margin:0; padding:0; list-style:none; float:left; background:url(/assets/images/design/menu-divider.png) 0 50% no-repeat; font-size:1em}
				.footer li:first-child		{background:none}
				.footer li.share				{float:right; padding-right:30px;}
				.footer li.share .icon-share	{margin:13px 0 0 5px;}
					
					
					.footer li a				{display:block; padding:10px; text-decoration:none; font-size:1.3em;}
	/* END FOOTER */	
	
	
	
	/* ERROR MESSAGES */
		.no-js div[data-role="page"]			{display:none;}
		.no-js div#js-error					{display:block!important;}
		.no-js div#js-error h1				{padding-top:150px}
                .js div#js-error                                {display: none!important;}
		#cookie-error h1						{padding-top:150px}
	/* ENDERROR MESSAGES */
	
	
	
	/* BACKGROUND SHARP / BLUR */
		.backgroundContainer				{position:fixed; top:0; left:0; width:100%; height:100%; overflow:hidden; z-index:-1;}
		
		.backgroundContainer .bkgnd-sharp	{position:absolute; top:0; left:0;}
		
		.backgroundContainer img.active		{opacity:0}
	/* END BACKGROUND SHARP / BLUR */
	
	
	
	/* ORIENTATION WARNING */
		.orientationWarning					{display:none; position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.8); z-index:100000; }
		.orientationWarning p				{text-align:center; font-size:5em; color:white;}
		
	/* END ORIENTATION WARNING */
	

	/* INITIALISE */
		html, body				{margin:0; padding:0; font-family:"Arial", sans-serif; width:100%; height:100%;}
	
		html						{font-size:62.5%;}
		
		body					{font-size:1.2em; background-color:black; -ms-touch-action: manipulation !important;}
		
		::-moz-selection		{background:none; text-shadow:none;}
		::selection 				{background:none; text-shadow:none;} 
		
		*						{font-family:'signikaregular';}
		strong					{font-family:'signikabold';}
		.uppercase				{text-transform:uppercase}
		
		.center					{text-align:center;}
		.textRight				{text-align:right;}
		.textLeft				{text-align:left;}
		
		.overflow				{overflow:hidden}
		.floatLeft				{float:left}
		.floatRight				{float:right}
		
		.title					{font-family:'signikasemibold'; font-size: 2.4em; text-transform:uppercase; text-align:center; margin:0 0 20px}
		
		.feedbackMessage		{position:absolute; top:70px; left:0px; width:100%; opacity:0; 
								-webkit-transition: all 500ms;
								-moz-transition: all 500ms;
								-ms-transition: all 500ms;
								transition: all 500ms;}
		.feedbackMessage.active	{opacity:1; top:10px; font-size:4.6em;}
		
		h1						{font-family:'signikasemibold'; font-size: 2.4em; text-transform:uppercase; text-align:center; margin:0 0 40px; color:white;}
		h1 .small				{font-size:70%}
		.subTitle				{font-family:'signikasemibold'; font-size:2em; text-transform:uppercase; text-align:center; margin:0 0 20px}
		
		p						{color:#fff; font-size: 1.8em; line-height:1.2em; margin:0 0 1.6em; padding:0;}
		.largeText				{font-size:3em}
		.smallText				{font-size:1.6em}
		a						{color:#fff; text-decoration:none}
		#about-hooked .ui-content a			{text-decoration:underline; }
		
		.m0						{margin:0;}
		
		.secondTitle			{display:none}
		.thirdTitle				{display:none}
		
		.offScreen				{position:absolute; top:-9999px; left:-9999px}
		
		.singleMarginBottom		{margin-bottom:20px!important}
		.doubleMarginBottom		{margin-bottom:40px!important}
		.tripleMarginBottom		{margin-bottom:60px!important}
		
		
		.pageContainer			{position:relative; width:700px; height:100%; margin:0 auto; padding: 35px 0 0;}
		
		.smallContainer60		{width:60%; margin:0 auto;}
		.smallContainer75		{width:75%; margin:0 auto;}
		
		.scrollContainer		{width:540px; height:580px; margin:0 auto;}
		.scrollContainer .inner	{width:500px; height:580px; padding:0 40px 0 0; /*overflow:auto;*/ outline:0}

		
		/* Custom scroll bars */
			.jspVerticalBar					{background:none; width:37px}
				.jspTrack					{margin:0 0 0 17px; background:rgba(255,255,255,0.5); width:1px;}
					.jspDrag				{margin:0 0 0 -2px; width:5px; background:white}
				
				.jspArrow					{background:none; text-indent:0}
				.jspArrow.jspDisabled		{background:none;}
				
				.jspArrowUp					{position:relative; color:white; font-size:3em; height:40px!important;}
				.jspArrowUp:before			{font-family: 'MOSI'; content: "\e629";}
				
				.jspArrowDown				{position:relative; color:white; font-size:3em; height:40px!important;}
				.jspArrowDown:before		{font-family: 'MOSI'; content: "\e627";}
			


		.logoContainer			{margin:0 auto 20px; text-align:center; width:235px; height:140px}
		.mosiLogoContainer		{margin:0 auto 40px; text-align:center; width:220px; height:78px}
		.responsiveImage		{width:100%; height:auto;}
	/* END INITIALISE */

	
	
	/* FORMS */
		input[type="text"],
		input[type="submit"],
		input[type="button"] 				{-webkit-appearance: none; border-radius:0}
			
		.formRowContainer				{margin-bottom:40px; overflow:hidden;}
		label							{cursor:pointer}
		
		.inlineForm						{overflow:hidden; padding:5px 0 0}
		.inlineForm input					{float:left;}
		.inlineForm label					{float:left; padding:4px 0 0; font-size:2em; color:white; width:150px; text-transform:uppercase;}
		
		.inlineCheckbox					{width:100%; margin:0 0 20px; color:white; font-size:2em}
		.inlineCheckbox .small			{font-size:65%; color:#ccc}
		
		.oversizedLabel					{float:none; margin:0; padding:0; font-size:2em; color:white; 
										text-transform:uppercase; display:block;}
		
		.oversizedCheckbox				{width:20px; height:20px; color:red}
		.oversizedRadiobox				{width:20px; height:20px}
		.oversizedSelect 				{font-size:2em; color:#555;}
		.selectFocus					{border:5px solid #00a69b!important}
		
		.oversizedTextInput				{width:100%; font-size:2em; color:#555; border:0; padding:15px; 
										-webkit-box-sizing:border-box; 
										   -moz-box-sizing:border-box; 
											 -o-box-sizing:border-box; 
												box-sizing:border-box;}		
		
		.oversizedTextarea				{width:100%; height:180px; font-size:2em; color:#555; border:0; padding:15px; 
										-webkit-box-sizing:border-box; 
										   -moz-box-sizing:border-box; 
											 -o-box-sizing:border-box; 
												box-sizing:border-box;}
		
		.oversizedFormButton			{padding:15px 40px 12px; border:0; font-size:2.2em; color:#fff; text-transform:uppercase; cursor:pointer;}
		.halfWidthFormButton			{width:48%; padding-left:0; padding-right:0; text-align:center;}
		
		.textCharCounter				{color:white; font-size:2em; margin:0; padding:0; line-height:inherit}
		
		/* Wrappers and Icons */
			.inputWrapper				{position:relative;}
				
				.clearIcon				{display:none; position:absolute; top:10px; right:0; width:40px; height:40px; margin:0; 
										background:url(formImages/clear.png) 50% 50% no-repeat; cursor:pointer; z-index:3;}
				.clearIconPadding		{padding-right:28px!important}
				
				.passwordIcon			{position:absolute; top:50%; right:5px; margin-top:-20px; width:35px; height:40px; background:url(formImages/wink.png) 5px 50% no-repeat; cursor:pointer; z-index:3;}
				.passwordIcon-show		{background-position:-40px 50%}
				.movePasswordIcon		{right:45px!important}
				
				.doubleIconPadding		{padding-right:80px!important}
	/* END FORMS */	
	
	
		
	/* COLOURS */
		.bkgnd-aqua							{background-color:#00a69b}
		.bkgnd-aqua.inactive				{background-color:#002926; cursor:default}
		.text-aqua							{color:#00a69b}
		.outline-aqua						{border:1px solid #00a69b}
		
		.bkgnd-light-orange					{background-color:#fbaf5d}
		.text-light-orange					{color:#fbaf5d!important}
		
		.bkgnd-dark-orange					{background-color:#e54d28}
		.bkgnd-dark-orange.inactive			{background-color:#662211;  cursor:default}
		.text-dark-orange					{color:#e54d28!important}
		
		.bkgnd-orange						{background-color:#f7941d}
		.text-orange						{color:#f7941d!important}
		
		.bkgnd-blue							{background-color:#00aeef}
		.text-blue							{color:#00aeef}
		
		.bkgnd-dark-grey					{background-color:#2e313c}
		
		.bkgnd-dark-slate					{background-color:#4e5369}
		
		.bkgnd-medium-slate					{background-color:#6c6e8a}
		
		.text-white							{color:#fff}
		
		.bkgnd-facebook-blue				{background-color:#5a7aaf}
		.bkgnd-twitter-blue					{background-color:#17b2ec}
	/* END COLOURS */
	
	
	
	/* ICON FONTS */
		.icon-music-note:before {content: "\e623";}
		.icon-in-a-row:before {content: "\e624";}
		.icon-stop-watch:before {content: "\e625";}
		.icon-right-arrow-outline:before {content: "\e628";}
		.icon-left-arrow-outline:before {content: "\e626";}
		.icon-up-arrow-outline:before {content: "\e629";}
		.icon-down-arrow-outline:before {content: "\e627";}
		.icon-left-headphone:before {content: "\e621";}
		.icon-right-headphone:before {content: "\e622";}
		.icon-padlock-closed-black:before {content: "\e620";}
		.icon-yes:before {content: "\e600";}
		.icon-violin:before {content: "\e601";}
		.icon-vinyl:before {content: "\e602";}
		.icon-twitter:before {content: "\e603";}
		.icon-trophy:before {content: "\e604";}
		.icon-top-arrow:before {content: "\e605";}
		.icon-speaker:before {content: "\e606";}
		.icon-share:before {content: "\e607";}
		.icon-scores:before {content: "\e608";}
		.icon-rock:before {content: "\e609";}
		.icon-right-arrow:before {content: "\e60a";}
		.icon-replay:before {content: "\e60b";}
		.icon-radio:before {content: "\e60c";}
		.icon-pause:before {content: "\e60d";}
		.icon-padlock-black:before {content: "\e60e";}
		.icon-no:before {content: "\e60f";}
		.icon-mute:before {content: "\e610";}
		.icon-music:before {content: "\e611";}
		.icon-microphone:before {content: "\e612";}
		.icon-logout:before {content: "\e613";}
		.icon-ipod:before {content: "\e614";}
		.icon-headphones:before {content: "\e615";}
		.icon-forward:before {content: "\e616";}
		.icon-facebook:before {content: "\e617";}
		.icon-email:before {content: "\e618";}
		.icon-cog:before {content: "\e619";}
		.icon-cloud-audio:before {content: "\e61a";}
		.icon-circle-arrows:before {content: "\e61b";}
		.icon-cd:before {content: "\e61c";}
		.icon-cassette:before {content: "\e61d";}
		.icon-back:before {content: "\e61e";}
		.icon-atom:before {content: "\e61f";}

	
		.icon-oversized						{font-size: 5em; color:white}
	/* END ICON FONTS */
	
	
	
	/* BUTTONS */
		/* Button wrapper for text */
		.buttonWrapper							{display:inline-block; margin:5px;}
		.buttonWrapper p							{margin:0; padding:0; text-align:center;}
	
		
		/* Half Round Buttons */
		.halfButtonContainer					{width:80px; margin:0 auto 10px; overflow:hidden}
			.leftHalf							{float:left; border-radius:200px 0 0 200px;}
			.rightHalf							{float:right; border-radius:0 200px 200px 0;}
			.halfRoundButton					{position:relative; width:40px; height:80px; color:white; text-decoration:none; text-align:center;}
			.halfRoundButton .icon				{position:absolute; left:50%; display:block;}
			
		
		/* Half Round Buttons */
		.oversizedHalfButtonContainer					{width:130px; margin:0 auto 10px; overflow:hidden}
			.oversizedLeftHalf							{float:left; border-radius:200px 0 0 200px;}
			.oversizedRightHalf							{float:right; border-radius:0 200px 200px 0;}
			.oversizedHalfRoundButton					{position:relative; width:65px; height:130px; color:white; text-decoration:none; text-align:center;}
			.oversizedHalfRoundButton .icon				{position:absolute; left:50%; display:block;}
		
		
		/* Generic round button classes */
		.roundButton							{position:relative; display:inline-block; margin:0 10px 7px; width:80px; height:80px; border-radius:200px; color:white; text-decoration:none; text-align:center;}
		.roundButton.active,
		.roundButton:hover						{transition-delay:50ms;
												-webkit-transition-delay:50ms;
												-ms-transform: scale(1.1);
												-webkit-transform: scale(1.1);
												transform: scale(1.1);}
		
		.roundButton.inactive:hover				{-ms-transform: scale(1);
												-webkit-transform: scale(1);
												transform: scale(1);}
		
		.roundButton .icon						{position:absolute; left:50%; display:block;}
		.roundButton p							{position:absolute; bottom:0; left:0; width:100%; margin:0; font-size: 1.8em; text-align:center}
		
		.roundButton.inactive,
		.roundButton.inactive p 					{color:#555}
		
		
		/* Oversized round buttons */
		.oversizedRoundButton					{width: 110px; height: 110px;}
		.oversizedRoundButton .icon				{}
		
		.oversizedRoundButton p					{bottom: 15px;}
		.oversizedRoundButton.singleText p		{bottom: 40px;}
		.oversizedRoundButton.doubleText p		{bottom: 26px;}
		
		.oversizedRoundButton .icon-yes			{top: 17%; font-size: 4em; margin-left: -24%;}
		.oversizedRoundButton .icon-no			{top:15%; font-size: 4em; margin-left: -22%;}
		
		
		/* Rect buttons */
		.rectButton								{display:inline-block; padding:20px 30px; text-decoration:none; text-transform:uppercase;}
		
		li .rectButton							{font-size:0.9em; width:100%; padding:20px 0}
		
		li .rectButton:hover						{transition-delay:50ms;
												-webkit-transition-delay:50ms;
												/*-ms-transform: scale(0.9);
												-webkit-transform: scale(0.9);
												transform: scale(0.9);*/}
		
		.rectButton span							{margin:0 0 0 10px}
		
		.gamePlaySelector a						{position:relative; background-color:none; color:#00a69b; border:1px solid #00a69b;}
		
		.gamePlaySelector a:hover				{background-color:white; color:#00a69b; border:1px solid white;}
		
		.gamePlaySelector a.active				{background-color:#00a69b; color:white; border:1px solid #00a69b;}
		.gamePlaySelector a.active:hover			{background-color:white; color:#00a69b; border:1px solid white}
		
		.gamePlaySelector .icon-headphones		{font-size:1.2em; position:absolute; left:5px; top:32%}
		.gamePlaySelector .icon-stop-watch		{font-size:1.4em; position:absolute; left:10px; top:25%;}
		.gamePlaySelector .icon-in-a-row			{font-size:1.4em; position:absolute; left:10px; top:26%;}
		.gamePlaySelector .icon-music-note		{font-size:1.6em; position:absolute; left:15px; top:22%;}
		
		
		
		/* Rect buttons with icon */
		.facebookButton 							{background:#5a7aaf url(/assets/images/design/icon-facebook-large.png) 12px 50% no-repeat;}
		.twitterButton 							{background:#17b2ec url(/assets/images/design/icon-twitter-large.png) 12px 50% no-repeat;}
		input.twitterButton[type=submit][disabled=disabled]	{background:#555 url(/assets/images/design/icon-twitter-large.png) 12px 50% no-repeat;}
		
		
		/* A/B Containers */
		.abContainer							{position:relative;}
		
		.abContainer .left						{position:absolute; top:20%; left:0;}
		.abContainer .right						{position:absolute; top:20%; right:0}
		
		.abContainer .small,
		.abContainer .large						{font-size:2.3em; margin:0; padding:0; text-align:center; color:white; text-transform:uppercase;}
		.abContainer .large						{font-size:4em;}
		
		.left-abContainer						{float:left; width:45%; overflow:hidden;}
		.left-abContainer .abOuterBorder			{margin:0 auto}
		
		.right-abContainer						{float:right; width:45%;}
		.right-abContainer .abOuterBorder		{margin:0 auto}
		
		
		/* Standard AB button */
		.abOuterBorder							{position:relative; border:3px solid transparent; width:90px; height:90px; border-radius:200px;}
		.abButton								{margin:5px 0 0 5px}
		


		.abButton .icon-right-arrow				{top:21%; font-size:4em; margin-left:-9%;}
		.abButton .icon-yes						{top:26%; font-size:3.4em; margin-left:-27%;}

		/* Active AB button */
		.abOuterBorder.activeRotator			{border:3px solid #fbaf5d;}
		.activeRotator .tickButton				{background-color:#fff}
		.activeRotator .eqButton					{background:#fff url(/assets/images/design/eq-orange.gif) 49% 42% no-repeat!important}
		

		.sequentialRotator .eqButton				{background:#fff url(/assets/images/design/eq-orange-sequential.gif) 49% 42% no-repeat!important}
		
		
		
		/* Creates animated pulse effect around button */
		.pulseRotator .eqButton					{-webkit-box-shadow: 0px 0px 1px 1px rgba(255, 255, 255, .75); -moz-box-shadow: 0px 0px 1px 1px rgba(255, 255, 255, .75); box-shadow: 0px 0px 1px 1px rgba(255, 255, 255, .75);
												-webkit-animation: glowEffect 2s infinite;
												-moz-animation: glowEffect 2s infinite;
												animation: glowEffect 2s infinite;}
		

		@-webkit-keyframes glowEffect 			{
													0%		{-webkit-box-shadow: 0px 0px 1px 1px rgba(255, 255, 255, .75); -moz-box-shadow: 0px 0px 1px 1px rgba(255, 255, 255, .75); box-shadow: 0px 0px 1px 1px rgba(255, 255, 255, .75);}
													50%		{-webkit-box-shadow: 0px 0px 15px 5px rgba(255, 255, 255, .75); -moz-box-shadow: 0px 0px 15px 5px rgba(255, 255, 255, .75); box-shadow: 0px 0px 15px 5px rgba(255, 255, 255, .75);}
													100%	{-webkit-box-shadow: 0px 0px 1px 1px rgba(255, 255, 255, .75); -moz-box-shadow: 0px 0px 1px 1px rgba(255, 255, 255, .75); box-shadow: 0px 0px 1px 1px rgba(255, 255, 255, .75);}
												}
		
		@-moz-keyframes glowEffect 				{
													0%		{-webkit-box-shadow: 0px 0px 1px 1px rgba(255, 255, 255, .75); -moz-box-shadow: 0px 0px 1px 1px rgba(255, 255, 255, .75); box-shadow: 0px 0px 1px 1px rgba(255, 255, 255, .75);}
													50%		{-webkit-box-shadow: 0px 0px 15px 5px rgba(255, 255, 255, .75); -moz-box-shadow: 0px 0px 15px 5px rgba(255, 255, 255, .75); box-shadow: 0px 0px 15px 5px rgba(255, 255, 255, .75);}
													100%	{-webkit-box-shadow: 0px 0px 1px 1px rgba(255, 255, 255, .75); -moz-box-shadow: 0px 0px 1px 1px rgba(255, 255, 255, .75); box-shadow: 0px 0px 1px 1px rgba(255, 255, 255, .75);}
												}
		
		@keyframes glowEffect 					{
													0%		{-webkit-box-shadow: 0px 0px 1px 1px rgba(255, 255, 255, .75); -moz-box-shadow: 0px 0px 1px 1px rgba(255, 255, 255, .75); box-shadow: 0px 0px 1px 1px rgba(255, 255, 255, .75);}
													50%		{-webkit-box-shadow: 0px 0px 15px 5px rgba(255, 255, 255, .75); -moz-box-shadow: 0px 0px 15px 5px rgba(255, 255, 255, .75); box-shadow: 0px 0px 15px 5px rgba(255, 255, 255, .75);}
													100%	{-webkit-box-shadow: 0px 0px 1px 1px rgba(255, 255, 255, .75); -moz-box-shadow: 0px 0px 1px 1px rgba(255, 255, 255, .75); box-shadow: 0px 0px 1px 1px rgba(255, 255, 255, .75);}
												}
		
		
		
		
		
		.sequentialRotator .icon-right-arrow,
		.activeRotator .icon-right-arrow			{display:none;}
		
		.activeRotator .icon-yes					{color:orange}
													
													
		/* Rotator selector */
		.rotatorSelectorContainer							{position:relative; width:156px; height:165px; margin:0 auto; text-align:center;}
		
			.rotatorSelectorContainer .corner				{position:absolute; top:8px; width:20px; height:20px;}
			.rotatorSelectorContainer .leftCorner			{left:14px; border-top:1px solid white; border-left:1px solid white}
			.rotatorSelectorContainer .rightCorner			{right:14px; border-top:1px solid white; border-right:1px solid white}
			
			.rotatorSelector								{opacity:0; position:relative; margin:20px 0 0; width:110px; height:110px; border:3px solid white; /* same size as oversized buttons */
															-webkit-transition-duration:0.5s; 
															-moz-transition-duration:0.5s; 
															-ms-transition-duration:0.5s;}
													
			.rotatorSelector.left							{opacity:1; width:150px; height:150px; margin:0; 
															-webkit-transform:rotate(-45deg); 
															-moz-transform:rotate(-45deg); 
															-ms-transform:rotate(-45deg);}
			
			.rotatorSelector.right							{opacity:1; width:150px; height:150px; margin:0; 
															-webkit-transform:rotate(45deg); 
															-moz-transform:rotate(45deg); 
															-ms-transform:rotate(45deg);}
			
				.rotatorSelector .icon-top-arrow				{opacity:0; position:absolute; top:-25px; left:36%; font-size:3em; 
															-webkit-transition-duration:0.5s; 
															-moz-transition-duration:0.5s; 
															-ms-transition-duration:0.5s;}
				.rotatorSelector .icon-top-arrow.active		{opacity:1}
		
			.rotatorSelectorContainer .intro					{width:100%;}
			.rotatorSelectorContainer p.singleText			{position:absolute; top:42%; text-align:center;}
			.rotatorSelectorContainer p.doubleText			{position:absolute; top:35%; text-align:center;}
			.rotatorSelectorContainer .oversizedRoundButton	{display:none; position:absolute; top:23px; left:23px; margin:0;}
			
		
		/* Genre buttons */
		.genreButtons							{width:100px; height:100px;}
		.genreButtons .icon-music				{top:25%; font-size:4em; margin-left:-28%}
		
		.genreButtons .icon-radio				{top:30%; font-size:4em; margin-left:-26%;}
		.genreButtons .icon-vinyl				{top:26%; font-size:4em; margin-left:-22%;}
		.genreButtons .icon-cassette				{top:32%; font-size:4em; margin-left:-25%;}
		
		.genreButtons .icon-cd					{top:27%; font-size:4em; margin-left:-23%;}
		.genreButtons .icon-ipod					{top:24%; font-size:4.4em; margin-left:-17%;}
		.genreButtons .icon-cloud-audio			{top:30%; font-size:4.6em; margin-left:-27%;}
		
		.genreButtons .icon-violin				{top:14%; font-size:6em; margin-left:-18%;}
		.genreButtons .icon-microphone			{top:28%; font-size:4.4em; margin-left:-28%}
		.genreButtons .icon-rock					{top:16%; font-size:5.4em; margin-left:-16%;}

		
		/* Circle Arrows */
		.circleArrows							{position:relative;  width: 162px; height: 162px; margin:0 auto}
		.circleArrows .icon-circle-arrows		{position:absolute; top:0; left:0; font-size: 13em; color:#fff}
		.circleArrows .roundButton				{margin: 19px 0 0 25px;}
		
		
		/* Speaker / Mute Icon */
		.icon-mute,
		.icon-speaker							{font-size:2.4em}
		
		
		/* Icons */
		.halfRoundButton .icon-twitter			{top:37%; font-size:2em; margin-left:-30%;}
		.halfRoundButton .icon-facebook			{top:33%; font-size:2.2em; margin-left:-12%;}
		
		.oversizedHalfRoundButton .icon-twitter	{top: 38%; font-size:3em; margin-left:-30%;}
		.oversizedHalfRoundButton .icon-facebook	{top: 35%; font-size:3.2em; margin-left:-12%;}
		
		.icon-twitter							{top:29%; font-size:3.3em; margin-left:-22%;}
		.icon-facebook							{top:25%; font-size:3.5em; margin-left:-13%;}
		
		
		
		.icon-email								{top:32%; font-size:3.5em; margin-left:-26%;}
		.icon-replay							{top:28%; font-size:3.5em; margin-left:-27%;}
		.icon-forward							{top:25%; font-size:3em; margin-left:-32%;}
		
		.skipLink								{display:inline-block; border:1px solid #00a69b; background:white; border-radius:3px; padding:0 10px;}
		.skipLink:hover							{display:inline-block; border:1px solid #00a69b; background:#00a69b; color:white}	
                
                .saveButton								{-webkit-transition: all 500ms;
                                                                                                -moz-transition: all 500ms;
                                                                                                -ms-transition: all 500ms;
                                                                                                transition: all 500ms;}
                .saveButton.active						{background:#00a69b;}
	/* END BUTTONS */		
	
	
	
	/* LISTS */
		.centeredList							{text-align:center; list-style-position:inside; padding:0}
		.noBullets								{margin:0; padding:0; list-style:none}
		li										{font-size:2em; margin:0 0 30px}
		li a										{text-decoration:none}
	/* END LISTS */
	
	
	
	/* DIVIDERS */
		.playBar								{margin:0 0 20px; background:url(/assets/images/design/green-narrow-divider.png) 50% 80% no-repeat;
												-webkit-background-size:100% 2px;
												-moz-background-size:100% 2px;
												-o-background-size:100% 2px;
												background-size:100% 2px;}
		.headBar								{margin:0 0 20px; background:url(/assets/images/design/green-large-divider.png) 50% 35% no-repeat;
												-webkit-background-size:100% 2px;
												-moz-background-size:100% 2px;
												-o-background-size:100% 2px;
												background-size:100% 2px;}
		.whiteDivider							{margin:20px 0 30px; height:5px; background:url(/assets/images/design/white-divider.png) 50% 80% no-repeat;
												-webkit-background-size:100% 2px;
												-moz-background-size:100% 2px;
												-o-background-size:100% 2px;
												background-size:100% 2px;}
	/* END DIVIDERS */


	
	/* TIMER */
		.counterContainer							{display:block; position:relative; margin:0 auto 20px; width:280px; height:280px; }
		.counterContainer .numberCount				{display:none; position:absolute; top:50%; left:0; margin:-80px 0 0 0; padding:0; width:100%; font-size:11em; color:#fbaf5d; font-family:'signikasemibold'; text-align:center;}
		
		.counterContainerSmall						{display:block; position:relative; margin:0 auto; width:100px; height:100px;}
		.counterContainerSmall .numberCount			{display:none; position:absolute; top:50%; left:0; margin:-20px 0 0 0; padding:0; width:100%; font-size:3em; color:#fbaf5d; font-family:'signikasemibold'; text-align:center;}
	/* END TIMER */
	
	
	
	/* INFO LEFT */
		.infoLeft								{overflow:hidden; margin:0 0 10px;}
		.infoLeft .details						{overflow:hidden;}
		.infoLeft p								{margin:0 0 0.2em}
		.infoLeft p.feature						{font-size:2.5em}
		
		.infoLeft .singleText					{margin-top:15px}
		
		.infoLeft.inactive						{}
		.infoLeft.inactive .icon-trophy			{color:#888!important}
		.infoLeft.inactive .details p			{color:#888!important}
		
		.infoLeft .icon-trophy					{float:left; font-size:3.4em; margin:0 20px 0 0}
		.infoLeft  .icon-padlock-closed-black	{float:left; margin:0 20px 0 0; font-size:4em}
	/* END INFO LEFT */
	
	
	
	/* GAME SCORE */
		.gameScoreContainer						{position:absolute; bottom:0; left:0;}
		.gameScoreContainer p					{margin:0; padding:0; font-size:2.8em;}
		.gameScoreContainer .gameCountdownTimer	{display:none;}
		.gameScoreContainer .gameScore			{}
	/* END GAME SCORE */
	
	
	/* OVERALL SCORE */
		.scoreContainer							{float:right; font-size:2.8em; margin:0; padding:0 10px 1px 0;}
		.scoreContainer span						{font-family:'signikabold';}
		.scoreContainer img						{margin:0 0 0 10px}
	/* END OVERALL SCORE */

			
			
	/* SCORE BREAKDOWN */
		.score-breakdown-container					{position:relative; width:215px; height:215px; margin:0 auto;  
													background:url(/assets/images/design/bkgnd-score-breakdown.png) 0 0 no-repeat;
													-webkit-background-size:100% 100%;
													-moz-background-size:100% 100%;
													-o-background-size:100% 100%;
													background-size:100% 100%;}
												
		.score-breakdown-container .chartContainer	{position:absolute; top:10px; left:-88px; width:390px!important; height:195px!important}
		.score-breakdown							{position:absolute; top:70px; left:0; width:100%; margin:0; font-family:'signikabold'; font-size:6.3em; text-align:center;}
	/* END SCORE BREAKDOWN */
			

	
	/* BONUS SCORE */
		.bonusScore								{width:200px; height:200px; margin:0 auto 60px; border:5px solid #fbaf5d; border-radius:400px}
		.bonusScore p							{font-family:'signikabold'; font-size:7em; text-align:center; margin:49px 0 0}
	/* END BONUS SCORE */
	
	
	
	/* SCORE CONTAINER */
		.leftScoresContainer					{float:left; width:44%}
		.scoreRow 								{margin:0 0 30px}
		.scoreRow p								{margin:0; padding:0;}
		.rightScoresContainer					{float:right; width:215px}
	/* END SCORE CONTAINER */
	
			
	/* GRAPH CONTAINER */		
		.graphContainer							{position:relative;  overflow:hidden; text-align:center}
			.graphContainer p					{margin:0; padding:0;}
			.graphContainer .percentage			{display:block; font-size:1.6em; line-height:1em}
			
			.left-graph-details					{position:absolute; top:20px; left:0; width:130px; }
			.right-graph-details				{position:absolute; top:20px; right:0; width:130px; }
			
			.chartContainer						{display:block; position:relative; margin:0 auto;  width:440px!important; height:220px!important}
	/* END GRAPH CONTAINER */		
			
			
			
	
	/* ACCOUNT ROW */	
		.accountRow	.account-detail				{float:left; width:60%; font-size:1.6em; }
		.accountRow	.account-edit				{float:left; font-size:1.7em; }
		
		.accountRow .icon-facebook				{font-size:1.5em; margin:-5px 0 0; padding:8px 4px 10px 14px}
	/* END ACCOUNT ROW */
	
	
	
	/* Toggle container */
		.toggleContainer  							{margin:-3px 0 0}
		.toggleContainer .ui-slider-switch 			{width:80px }
		div.ui-slider-switch							{margin:0; background:white; border-radius:20px;}
		.ui-slider-switch .ui-slider-label			{color:#555; top:1px}
		.ui-slider-inneroffset						{margin:1px 16px 0 18px}
		.ui-slider-switch .ui-btn.ui-slider-handle	{background:#00a69b; border-radius:20px}
			
			
			
	/* Equaliser */
		.eqContainer							{display:inline-block; margin:0 0 0 15px; width:36px; height:54px; background:url(/assets/images/design/eq-static.gif) 0 100% no-repeat; overflow:hidden}
		.eqContainer.active						{background:url(/assets/images/design/eq.gif) 0 100% no-repeat;}
			

	
	/* Swiper */
		.swipeContainer												{position:relative; height:750px;}
		
		.swiper-left-icon-container									{position:absolute; bottom:0px; left:0; display:block; width:180px; height:50px; text-align:center;}
		.swiper-left-icon-container .icon							{display:block; font-size:2.4em;}
		.swiper-left-icon-container .icon-left-arrow-outline			{position:absolute; left:0; top:7px; display:block; font-size:3em; }
		.swiper-left-icon-container span								{display:block; font-size:1.3em;}
		
		.swiper-right-icon-container								{position:absolute; bottom:0px; right:0; display:block; width:180px; height:50px; text-align:center;}
		.swiper-right-icon-container .icon							{display:block; font-size:2.4em;}
		.swiper-right-icon-container .icon-right-arrow-outline		{position:absolute; right:0; top:7px; display:block; font-size:3em;}
		.swiper-right-icon-container span							{display:block; font-size:1.3em;}
			
		
	
	/* Yes / No button align */
		.yesNoButtonAlign											{position:relative; width:100%; height:135px;}
		
		
		
		
		
	/* Oscillating Get Ready */
		.oscillatingGetReady						{opacity:0; margin:0 auto; height:336px}
		.oscillatingGetReady p						{margin:0; padding:70px 0 0; font-size:10em; text-align:center; }
		
	
	
	
	@media screen and (max-height:650px)
	{
		/* HEADER */	
			.hotCorner 							{padding-top:20px;}
			.hotCorner .text						{font-size:1.2em;}
			
			.leftHotCorner						{width:100px; height:85px; background:url(/assets/images/design/hot-corner-left.png) 100% no-repeat;}
			.leftHotCorner .icon					{top:0; left:0;}
			
			.rightHotCorner						{width:100px; height:85px; background:url(/assets/images/design/hot-corner-right.png) 0 no-repeat;}
			.rightHotCorner .icon				{top:0; right:0;}
			
			.hotCorner .icon-back				{font-size:2em;  padding:20px 30px 40px 10px;}
			.hotCorner .icon-question			{font-size:4em;  padding:15px 40px 20px 15px;}
			.hotCorner .icon-no					{font-size:2.5em; padding:15px 15px 30px 40px;}
		/* END HEADER */

		

		/* FOOTER */
			.footer								{padding:5px 0;}
				.footer ul						{margin:0 0 0 20px; padding:0;}
					.footer li					{background:url(/assets/images/design/menu-divider.png) 0 50% no-repeat; font-size:1em}
					.footer li.share				{padding-right:30px;}
					.footer li.share .icon-share	{margin:13px 0 0 5px;}
						
						
						.footer li a				{padding:6px; font-size:1.3em;}
		/* END FOOTER */	
		
		
		

		/* INITIALISE */
			
			body						{font-size:1.2em;}
				
			.title						{font-size:2.4em; margin:0 0 20px}
			h1							{font-size:2.4em; margin:0 0 40px;}
			.subTitle					{font-size:2em; margin:0 0 20px}
			
			p							{font-size:1.6em; line-height:1.2em; margin:0 0 1.2em; padding:0;}
			.largeText					{font-size:3em}
			.smallText					{font-size:1.6em}
			
			.pageContainer				{}
			
			.scrollContainer			{width:400px; height:420px;}
			.scrollContainer .inner		{width:360px; height:420px; padding:0 40px 0 0;}
				
			.logoContainer				{margin:0 auto 20px; width:170px; height:101px}
			.mosiLogoContainer			{margin:0 auto 40px; width:220px; height:78px}

		/* END INITIALISE */

		
		
		/* FORMS */
			.formRowContainer			{margin-bottom:40px}
			
			.inlineForm					{padding:5px 0 0}
			.inlineForm label				{padding:4px 0 0; font-size:2em; width:150px;}
			
			.oversizedLabel				{font-size:2em;}
			
			.oversizedCheckbox			{width:30px; height:30px;}
			.oversizedRadiobox			{width:30px; height:30px}
			.oversizedSelect 			{font-size:2em;}
			.selectFocus				{border:5px solid #00a69b!important}
			
			.oversizedTextInput			{width:100%; font-size:2em; padding:15px;}
			
			.oversizedTextarea			{width:100%; height:200px; font-size:2em; padding:15px;}
			
			.oversizedFormButton		{padding:15px 40px 12px; font-size:2.2em;}
			.halfWidthFormButton		{width:48%; padding-left:0; padding-right:0;}
			
			
			/* Wrappers and Icons */
				.clearIcon				{top:10px; right:0; width:40px; height:40px;}
				.clearIconPadding		{padding-right:28px!important}
				
				.passwordIcon			{top:50%; right:5px; margin-top:-20px; width:35px; height:40px; background:url(formImages/wink.png) 5px 50% no-repeat;}
				.passwordIcon-show		{background-position:-40px 50%}
				.movePasswordIcon		{right:45px!important}
				
				.doubleIconPadding		{padding-right:80px!important}
		/* END FORMS */	

		
		/* ICON FONTS */
			.icon-oversized							{font-size:4em;}
		/* END ICON FONTS */
		
		
		/* BUTTONS */
			/* Button wrapper for text */
			.buttonWrapper							{margin:5px;}
		
			
			/* Half Round Buttons */
			.halfButtonContainer					{width:80px; margin:0 auto 10px;}
				.leftHalf							{border-radius:200px 0 0 200px;}
				.rightHalf							{border-radius:0 200px 200px 0;}
				.halfRoundButton					{width:40px; height:80px;}			
			
			/* Half Round Buttons */
			.oversizedHalfButtonContainer			{width:130px; margin:0 auto 10px;}
				.oversizedLeftHalf					{border-radius:200px 0 0 200px;}
				.oversizedRightHalf					{border-radius:0 200px 200px 0;}
				.oversizedHalfRoundButton			{width:65px; height:130px;}		
			
			/* Generic round button classes */
			.roundButton							{margin:0 10px 7px; width:80px; height:80px; border-radius:200px;}		
			.roundButton p							{bottom:0; left:0; width:100%; font-size:1.8em;}
			
			
			/* Oversized round buttons */
			.oversizedRoundButton					{width:110px; height:110px;}
			
			.oversizedRoundButton p					{bottom:15px;}
			.oversizedRoundButton.singleText p		{bottom:40px;}
			.oversizedRoundButton.doubleText p		{bottom:26px;}
			
			.oversizedRoundButton .icon-yes			{top:17%; font-size:4em; margin-left:-24%;}
			.oversizedRoundButton .icon-no			{top:15%; font-size:4em; margin-left:-22%;}
			
			
			/* Rect buttons */
			.rectButton								{padding:20px 30px;}
			
			li .rectButton							{font-size:0.7em; padding:14px 0}
			
			.rectButton span							{margin:0 0 0 10px}

			.gamePlaySelector						{width:70%; margin:0 auto}
			.gamePlaySelector .icon-headphones		{font-size:1.2em; left:5px; top:32%}
			.gamePlaySelector .icon-stop-watch		{font-size:1.4em; left:10px; top:25%;}
			.gamePlaySelector .icon-in-a-row			{font-size:1.4em; left:10px; top:26%;}
			.gamePlaySelector .icon-music-note		{font-size:1.6em; left:15px; top:22%;}
			
			
			
			/* Rect buttons with icon */
			.facebookButton 							{background:#5a7aaf url(/assets/images/design/icon-facebook-large.png) 12px 50% no-repeat;}
			.twitterButton 							{background:#17b2ec url(/assets/images/design/icon-twitter-large.png) 12px 50% no-repeat;}
			
			
			/* A/B Containers */
			.abContainer .left						{top:20%; left:0;}
			.abContainer .right						{top:20%; right:0}
			
			.abContainer .small,
			.abContainer .large						{font-size:2.3em;}
			.abContainer .large						{font-size:4em;}
			
			.left-abContainer						{width:45%;}
			.right-abContainer						{width:45%;}
			
			
			/* Standard AB button */
			.abOuterBorder							{border:3px solid transparent; width:90px; height:90px; border-radius:200px;}
			.abButton								{margin:5px 0 0 5px}
			.abButton .icon-right-arrow				{top:21%; font-size:4em; margin-left:-9%;}
			.abButton .icon-yes						{top:26%; font-size:3.4em; margin-left:-27%;}

			/* Active AB button */
			.abOuterBorder.activeRotator			{border:3px solid #fbaf5d;}
			.activeRotator .eqButton					{background:#fff url(/assets/images/design/eq-orange.gif) 49% 42% no-repeat!important}
			
			.sequentialRotator .eqButton				{background:#fff url(/assets/images/design/eq-orange-sequential.gif) 49% 42% no-repeat!important}								
														
			/* Rotator selector */
			.rotatorSelectorContainer							{width:156px; height:165px;}
			
				.rotatorSelectorContainer .corner				{top:8px; width:20px; height:20px;}
				.rotatorSelectorContainer .leftCorner			{left:14px;}
				.rotatorSelectorContainer .rightCorner			{right:14px;}
				
				.rotatorSelector								{margin:20px 0 0; width:110px; height:110px; border:3px solid white;} /* same size as oversized buttons */
																
														
				.rotatorSelector.left							{width:150px; height:150px;}
				
				.rotatorSelector.right							{width:150px; height:150px;}
				
					.rotatorSelector .icon-top-arrow				{top:-25px; left:36%; font-size:3em;}
			
				.rotatorSelectorContainer p.singleText			{top:42%;}
				.rotatorSelectorContainer p.doubleText			{top:35%;}
				.rotatorSelectorContainer .oversizedRoundButton	{top:23px; left:23px;}
				
			
			/* Genre buttons */
			.genreButtons							{width:100px; height:100px;}
			.genreButtons .icon-music				{top:25%; font-size:4em; margin-left:-28%}
			
			.genreButtons .icon-radio				{top:30%; font-size:4em; margin-left:-26%;}
			.genreButtons .icon-vinyl				{top:26%; font-size:4em; margin-left:-22%;}
			.genreButtons .icon-cassette				{top:32%; font-size:4em; margin-left:-25%;}
			
			.genreButtons .icon-cd					{top:27%; font-size:4em; margin-left:-23%;}
			.genreButtons .icon-ipod					{top:24%; font-size:4.4em; margin-left:-17%;}
			.genreButtons .icon-cloud-audio			{top:30%; font-size:4.6em; margin-left:-27%;}
			
			.genreButtons .icon-violin				{top:14%; font-size:6em; margin-left:-18%;}
			.genreButtons .icon-microphone			{top:28%; font-size:4.4em; margin-left:-28%}
			.genreButtons .icon-rock					{top:16%; font-size:5.4em; margin-left:-16%;}

			
			/* Circle Arrows */
			.circleArrows							{width:162px; height:162px;}
			.circleArrows .icon-circle-arrows		{top:0; left:0; font-size:13em;}
			.circleArrows .roundButton				{margin:19px 0 0 25px;}
			
			
			/* Speaker / Mute Icon */
			.icon-mute,
			.icon-speaker							{font-size:2.4em}
			
			
			/* Icons */
			.halfRoundButton .icon-twitter			{top:37%; font-size:2em; margin-left:-30%;}
			.halfRoundButton .icon-facebook			{top:33%; font-size:2.2em; margin-left:-12%;}
			
			.oversizedHalfRoundButton .icon-twitter	{top:38%; font-size:3em; margin-left:-30%;}
			.oversizedHalfRoundButton .icon-facebook	{top:35%; font-size:3.2em; margin-left:-12%;}
			
			.icon-twitter							{top:29%; font-size:3.3em; margin-left:-22%;}
			.icon-facebook							{top:25%; font-size:3.5em; margin-left:-13%;}
			
			
			
			.icon-email								{top:32%; font-size:3.5em; margin-left:-26%;}
			.icon-replay							{top:28%; font-size:3.5em; margin-left:-27%;}
			.icon-forward							{top:25%; font-size:3em; margin-left:-32%;}
		/* END BUTTONS */		
		
		
		
		/* LISTS */
			li										{font-size:1.8em;}
		/* END LISTS */
		


		
		/* TIMER */
			.counterContainer							{margin:0 auto 20px; width:280px; height:280px;}
			.counterContainer .numberCount				{top:50%; left:0; margin:-80px 0 0 0; padding:0; width:100%; font-size:11em;}
			
			.counterContainerSmall						{width:100px; height:100px;}
			.counterContainerSmall .numberCount			{top:50%; left:0; margin:-20px 0 0 0; padding:0; width:100%; font-size:3em;}
		/* END TIMER */
		
		
		
		/* INFO LEFT */
			.infoLeft								{margin:0 0 10px;}
			.infoLeft p								{margin:0 0 0.2em}
			.infoLeft p.feature						{font-size:2.5em}
			
			.infoLeft .singleText					{margin-top:15px}

			
			.infoLeft .icon-trophy					{font-size:3.4em; margin:0 20px 0 0}
			.infoLeft .icon-padlock-closed-black	{margin:0 20px 0 0; font-size:4em}
		/* END INFO LEFT */
		
		
		
		/* GAME SCORE */
			.gameScoreContainer p					{font-size:2.8em;}
		/* END GAME SCORE */
		
		
		/* OVERALL SCORE */
			.scoreContainer							{font-size:2.8em; padding:0 10px 1px 0;}
			.scoreContainer img						{margin:0 0 0 10px}
		/* END OVERALL SCORE */

				
				
		/* SCORE BREAKDOWN */
			.score-breakdown-container					{width:215px; height:215px; background:url(/assets/images/design/bkgnd-score-breakdown.png) 0 0 no-repeat;}
													
			.score-breakdown-container .chartContainer	{top:10px; left:-88px; width:390px!important; height:195px!important}
		/* END SCORE BREAKDOWN */
				

		
		/* BONUS SCORE */
			.bonusScore						{width:200px; height:200px; margin:0 auto 60px; border:5px solid #fbaf5d; border-radius:400px}
			.bonusScore p					{font-size:7em;   margin:49px 0 0}
		/* END BONUS SCORE */
		
		
		
		/* SCORE CONTAINER */
			.leftScoresContainer			{width:44%}
			.scoreRow 						{margin:0 0 30px}
			.rightScoresContainer			{width:215px}
		/* END SCORE CONTAINER */
		
				
		/* GRAPH CONTAINER */		
			.graphContainer .percentage		{font-size:1.6em; line-height:1em}
			
			.left-graph-details				{top:20px; left:0; width:130px;}
			.right-graph-details			{top:20px; right:0; width:130px;}
			
			.chartContainer					{width:440px!important; height:220px!important}
		/* END GRAPH CONTAINER */		
				
		
		/* ACCOUNT ROW */	
			.accountRow	.account-detail		{width:60%; font-size:1.6em;}
			.accountRow	.account-edit		{font-size:1.7em;}
			
			.accountRow .icon-facebook		{font-size:1.5em; margin:-5px 0 0; padding:8px 4px 10px 14px}
		/* END ACCOUNT ROW */

		
		/* Toggle container */
			.toggleContainer 							{margin:-3px 0 0}
			.toggleContainer .ui-slider-switch 			{width:80px}
			div.ui-slider-switch							{border-radius:20px;}
			.ui-slider-switch .ui-slider-label			{top:1px}
			.ui-slider-inneroffset						{margin:1px 16px 0 18px}
			.ui-slider-switch .ui-btn.ui-slider-handle	{border-radius:20px}
				
		/* Equaliser */
			.eqContainer								{margin:0 0 0 15px; width:36px; height:54px; background:url(/assets/images/design/eq-static.gif) 0 100% no-repeat;}
			.eqContainer.active							{background:url(/assets/images/design/eq.gif) 0 100% no-repeat;}
		
		/* Swiper */
			.swipeContainer											{height:550px;}
			
			.swiper-left-icon-container								{bottom:0px; left:0;   width:180px; height:50px;}
			.swiper-left-icon-container .icon						{font-size:2.4em;}
			.swiper-left-icon-container .icon-left-arrow-outline		{left:0; top:7px;   font-size:3em;}
			.swiper-left-icon-container span							{font-size:1.3em;}
			
			.swiper-right-icon-container							{bottom:0px; right:0;   width:180px; height:50px;}
			.swiper-right-icon-container .icon						{font-size:2.4em;}
			.swiper-right-icon-container .icon-right-arrow-outline	{right:0; top:7px;   font-size:3em;}
			.swiper-right-icon-container span						{font-size:1.3em;}
				
		/* Yes / No button align */
			.yesNoButtonAlign										{width:100%; height:135px;}

		/* Oscillating Get Ready */
			.oscillatingGetReady						{height:336px}
			.oscillatingGetReady p						{padding:70px 0 0; font-size:10em;}
		
	}
				
				

				
				
				
	@media screen and (max-width:700px)
	{
		/* HEADER */	
			.hotCorner 							{padding-top:20px;}
			.hotCorner .text						{font-size:1.2em;}
			
			.leftHotCorner						{width:100px; height:85px; background:url(/assets/images/design/hot-corner-left.png) 100% no-repeat;}
			.leftHotCorner .icon					{top:0; left:0;}
			
			.rightHotCorner						{width:100px; height:85px; background:url(/assets/images/design/hot-corner-right.png) 0 no-repeat;}
			.rightHotCorner .icon				{top:0; right:0;}
			
			.hotCorner .icon-back				{font-size:2em;  padding:20px 30px 40px 10px;}
			.hotCorner .icon-question			{font-size:4em;  padding:15px 40px 20px 15px;}
			.hotCorner .icon-no					{font-size:2.5em; padding:15px 15px 30px 40px;}
		/* END HEADER */

		

		/* FOOTER */
			.footer								{padding:5px 0;}
				.footer ul						{margin:0 0 0 20px; padding:0;}
					.footer li					{background:url(/assets/images/design/menu-divider.png) 0 50% no-repeat; font-size:1em}
					.footer li.share				{padding-right:30px;}
					.footer li.share .icon-share	{margin:13px 0 0 5px;}
						
						
						.footer li a				{padding:6px; font-size:1.3em;}
		/* END FOOTER */	
		
		
		

		/* INITIALISE */
			
			body						{font-size:1.2em;}
				
			.title						{font-size:2.4em; margin:0 0 20px}
			h1							{font-size:2.4em; margin:0 0 40px;}
			.subTitle					{font-size:2em; margin:0 0 20px}
			
			p							{font-size:1.6em; line-height:1.2em; margin:0 0 1.2em; padding:0;}
			.largeText					{font-size:3em}
			.smallText					{font-size:1.6em}
			
			.singleMarginBottom			{margin-bottom:20px!important}
			.doubleMarginBottom			{margin-bottom:40px!important}
			.tripleMarginBottom			{margin-bottom:60px!important}
			
			
			.pageContainer				{width:90%; height:100%; margin:0 auto; padding: 60px 0 0;}
			
			.smallContainer60			{width:100%; margin:0 auto;}
			.smallContainer75			{width:100%; margin:0 auto;}
			
			.scrollContainer			{width:480px; height:500px;}
			.scrollContainer .inner		{width:440px; height:500px; padding:0 40px 0 0;}
				
			.logoContainer				{margin:0 auto 20px; width:190px; height:113px}
			.mosiLogoContainer			{margin:0 auto 40px; width:220px; height:78px}

		/* END INITIALISE */

		
		
		/* FORMS */
			.formRowContainer			{margin-bottom:40px}
			
			.inlineForm					{padding:5px 0 0}
			.inlineForm label				{padding:4px 0 0; font-size:2em; width:150px;}
			
			.oversizedLabel				{font-size:2em;}
			
			.oversizedCheckbox			{width:30px; height:30px;}
			.oversizedRadiobox			{width:30px; height:30px}
			.oversizedSelect 			{font-size:2em;}
			.selectFocus				{border:5px solid #00a69b!important}
			
			.oversizedTextInput			{width:100%; font-size:2em; padding:15px;}
			
			.oversizedTextarea			{width:100%; height:200px; font-size:2em; padding:15px;}
			
			.oversizedFormButton		{padding:15px 40px 12px; font-size:2.2em;}
			.halfWidthFormButton		{width:48%; padding-left:0; padding-right:0;}
			
			
			/* Wrappers and Icons */
				.clearIcon				{top:10px; right:0; width:40px; height:40px;}
				.clearIconPadding		{padding-right:28px!important}
				
				.passwordIcon			{top:50%; right:5px; margin-top:-20px; width:35px; height:40px; background:url(formImages/wink.png) 5px 50% no-repeat;}
				.passwordIcon-show		{background-position:-40px 50%}
				.movePasswordIcon		{right:45px!important}
				
				.doubleIconPadding		{padding-right:80px!important}
		/* END FORMS */	

		
		/* ICON FONTS */
			.icon-oversized							{font-size:4em;}
		/* END ICON FONTS */
		
		
		/* BUTTONS */
			/* Button wrapper for text */
			.buttonWrapper							{margin:5px;}
		
			
			/* Half Round Buttons */
			.halfButtonContainer					{width:80px; margin:0 auto 10px;}
				.leftHalf							{border-radius:200px 0 0 200px;}
				.rightHalf							{border-radius:0 200px 200px 0;}
				.halfRoundButton					{width:40px; height:80px;}			
			
			/* Half Round Buttons */
			.oversizedHalfButtonContainer			{width:130px; margin:0 auto 10px;}
				.oversizedLeftHalf					{border-radius:200px 0 0 200px;}
				.oversizedRightHalf					{border-radius:0 200px 200px 0;}
				.oversizedHalfRoundButton			{width:65px; height:130px;}		
			
			/* Generic round button classes */
			.roundButton							{margin:0 10px 7px; width:80px; height:80px; border-radius:200px;}		
			.roundButton p							{bottom:0; left:0; width:100%; font-size:1.8em;}
			
			
			/* Oversized round buttons */
			.oversizedRoundButton					{width:110px; height:110px;}
			
			.oversizedRoundButton p					{bottom:15px;}
			.oversizedRoundButton.singleText p		{bottom:40px;}
			.oversizedRoundButton.doubleText p		{bottom:26px;}
			
			.oversizedRoundButton .icon-yes			{top:17%; font-size:4em; margin-left:-24%;}
			.oversizedRoundButton .icon-no			{top:15%; font-size:4em; margin-left:-22%;}
			
			
			/* Rect buttons */
			.rectButton								{padding:20px 30px;}
			
			li .rectButton							{font-size:0.8em; padding:18px 0}
			
			.rectButton span							{margin:0 0 0 10px}

			.gamePlaySelector						{width:55%; margin:0 auto}
			.gamePlaySelector .icon-headphones		{font-size:1.2em; left:5px; top:32%}
			.gamePlaySelector .icon-stop-watch		{font-size:1.4em; left:10px; top:25%;}
			.gamePlaySelector .icon-in-a-row			{font-size:1.4em; left:10px; top:26%;}
			.gamePlaySelector .icon-music-note		{font-size:1.6em; left:15px; top:22%;}
			
			
			
			/* Rect buttons with icon */
			.facebookButton 							{background:#5a7aaf url(/assets/images/design/icon-facebook-large.png) 12px 50% no-repeat;}
			.twitterButton 							{background:#17b2ec url(/assets/images/design/icon-twitter-large.png) 12px 50% no-repeat;}
			
			
			/* A/B Containers */
			.abContainer .left						{top:20%; left:0;}
			.abContainer .right						{top:20%; right:0}
			
			.abContainer .small,
			.abContainer .large						{font-size:2.3em;}
			.abContainer .large						{font-size:4em;}
			
			.left-abContainer						{width:45%;}
			.right-abContainer						{width:45%;}
			
			
			/* Standard AB button */
			.abOuterBorder							{border:3px solid transparent; width:90px; height:90px; border-radius:200px;}
			.abButton								{margin:5px 0 0 5px}
			.abButton .icon-right-arrow				{top:21%; font-size:4em; margin-left:-9%;}
			.abButton .icon-yes						{top:26%; font-size:3.4em; margin-left:-27%;}

			/* Active AB button */
			.abOuterBorder.activeRotator			{border:3px solid #fbaf5d;}
			.activeRotator .eqButton					{background:#fff url(/assets/images/design/eq-orange.gif) 49% 42% no-repeat!important}
			
			
			.sequentialRotator .eqButton				{background:#fff url(/assets/images/design/eq-orange-sequential.gif) 49% 42% no-repeat!important}
			
														
			/* Rotator selector */
			.rotatorSelectorContainer							{width:156px; height:165px;}
			
				.rotatorSelectorContainer .corner				{top:8px; width:20px; height:20px;}
				.rotatorSelectorContainer .leftCorner			{left:14px;}
				.rotatorSelectorContainer .rightCorner			{right:14px;}
				
				.rotatorSelector								{margin:20px 0 0; width:110px; height:110px; border:3px solid white;} /* same size as oversized buttons */
																
														
				.rotatorSelector.left							{width:150px; height:150px;}
				
				.rotatorSelector.right							{width:150px; height:150px;}
				
					.rotatorSelector .icon-top-arrow				{top:-25px; left:36%; font-size:3em;}
			
				.rotatorSelectorContainer p.singleText			{top:42%;}
				.rotatorSelectorContainer p.doubleText			{top:35%;}
				.rotatorSelectorContainer .oversizedRoundButton	{top:23px; left:23px;}
				
			
			/* Genre buttons */
			.genreButtons							{width:100px; height:100px;}
			.genreButtons .icon-music				{top:25%; font-size:4em; margin-left:-28%}
			
			.genreButtons .icon-radio				{top:30%; font-size:4em; margin-left:-26%;}
			.genreButtons .icon-vinyl				{top:26%; font-size:4em; margin-left:-22%;}
			.genreButtons .icon-cassette				{top:32%; font-size:4em; margin-left:-25%;}
			
			.genreButtons .icon-cd					{top:27%; font-size:4em; margin-left:-23%;}
			.genreButtons .icon-ipod					{top:24%; font-size:4.4em; margin-left:-17%;}
			.genreButtons .icon-cloud-audio			{top:30%; font-size:4.6em; margin-left:-27%;}
			
			.genreButtons .icon-violin				{top:14%; font-size:6em; margin-left:-18%;}
			.genreButtons .icon-microphone			{top:28%; font-size:4.4em; margin-left:-28%}
			.genreButtons .icon-rock					{top:16%; font-size:5.4em; margin-left:-16%;}

			
			/* Circle Arrows */
			.circleArrows							{width:162px; height:162px;}
			.circleArrows .icon-circle-arrows		{top:0; left:0; font-size:13em;}
			.circleArrows .roundButton				{margin:19px 0 0 25px;}
			
			
			/* Speaker / Mute Icon */
			.icon-mute,
			.icon-speaker							{font-size:2.4em}
			
			
			/* Icons */
			.halfRoundButton .icon-twitter			{top:37%; font-size:2em; margin-left:-30%;}
			.halfRoundButton .icon-facebook			{top:33%; font-size:2.2em; margin-left:-12%;}
			
			.oversizedHalfRoundButton .icon-twitter	{top:38%; font-size:3em; margin-left:-30%;}
			.oversizedHalfRoundButton .icon-facebook	{top:35%; font-size:3.2em; margin-left:-12%;}
			
			.icon-twitter							{top:29%; font-size:3.3em; margin-left:-22%;}
			.icon-facebook							{top:25%; font-size:3.5em; margin-left:-13%;}
			
			
			
			.icon-email								{top:32%; font-size:3.5em; margin-left:-26%;}
			.icon-replay							{top:28%; font-size:3.5em; margin-left:-27%;}
			.icon-forward							{top:25%; font-size:3em; margin-left:-32%;}
		/* END BUTTONS */		
		
		
		
		/* LISTS */
			li										{font-size:1.8em;}
		/* END LISTS */
		


		
		/* TIMER */
			.counterContainer							{margin:0 auto 20px; width:280px; height:280px;}
			.counterContainer .numberCount				{top:50%; left:0; margin:-80px 0 0 0; padding:0; width:100%; font-size:11em;}
			
			.counterContainerSmall						{width:100px; height:100px;}
			.counterContainerSmall .numberCount			{top:50%; left:0; margin:-20px 0 0 0; padding:0; width:100%; font-size:3em;}
		/* END TIMER */
		
		
		
		/* INFO LEFT */
			.infoLeft								{margin:0 0 10px;}
			.infoLeft p								{margin:0 0 0.2em}
			.infoLeft p.feature						{font-size:2.5em}
			
			.infoLeft .singleText					{margin-top:15px}

			
			.infoLeft .icon-trophy					{font-size:3.4em; margin:0 20px 0 0}
			.infoLeft .icon-padlock-closed-black	{margin:0 20px 0 0; font-size:4em}
		/* END INFO LEFT */
		
		
		
		/* GAME SCORE */
			.gameScoreContainer p					{font-size:2.8em;}
		/* END GAME SCORE */
		
		
		/* OVERALL SCORE */
			.scoreContainer							{font-size:2.8em; padding:0 10px 1px 0;}
			.scoreContainer img						{margin:0 0 0 10px}
		/* END OVERALL SCORE */

				
				
		/* SCORE BREAKDOWN */
			.score-breakdown-container					{width:215px; height:215px; background:url(/assets/images/design/bkgnd-score-breakdown.png) 0 0 no-repeat;}
													
			.score-breakdown-container .chartContainer	{top:10px; left:-88px; width:390px!important; height:195px!important}
		/* END SCORE BREAKDOWN */
				

		
		/* BONUS SCORE */
			.bonusScore						{width:200px; height:200px; margin:0 auto 60px; border:5px solid #fbaf5d; border-radius:400px}
			.bonusScore p					{font-size:7em;   margin:49px 0 0}
		/* END BONUS SCORE */
		
		
		
		/* SCORE CONTAINER */
			.leftScoresContainer			{width:44%}
			.scoreRow 						{margin:0 0 30px}
			.rightScoresContainer			{width:215px}
		/* END SCORE CONTAINER */
		
				
		/* GRAPH CONTAINER */		
			.graphContainer .percentage		{font-size:1.6em; line-height:1em}
			
			.left-graph-details				{top:20px; left:0; width:130px;}
			.right-graph-details			{top:20px; right:0; width:130px;}
			
			.chartContainer					{width:440px!important; height:220px!important}
		/* END GRAPH CONTAINER */		
				
		
		/* ACCOUNT ROW */	
			.accountRow	.account-detail		{width:60%; font-size:1.6em;}
			.accountRow	.account-edit		{font-size:1.7em;}
			
			.accountRow .icon-facebook		{font-size:1.5em; margin:-5px 0 0; padding:8px 4px 10px 14px}
		/* END ACCOUNT ROW */

		
		/* Toggle container */
			.toggleContainer 							{margin:-3px 0 0}
			.toggleContainer .ui-slider-switch 			{width:80px}
			div.ui-slider-switch							{border-radius:20px;}
			.ui-slider-switch .ui-slider-label			{top:1px}
			.ui-slider-inneroffset						{margin:1px 16px 0 18px}
			.ui-slider-switch .ui-btn.ui-slider-handle	{border-radius:20px}
				
		/* Equaliser */
			.eqContainer								{margin:0 0 0 15px; width:36px; height:54px; background:url(/assets/images/design/eq-static.gif) 0 100% no-repeat;}
			.eqContainer.active							{background:url(/assets/images/design/eq.gif) 0 100% no-repeat;}
		
		/* Swiper */
			.swipeContainer											{height:670px;}
			
			.swiper-left-icon-container								{bottom:0px; left:0;   width:180px; height:50px;}
			.swiper-left-icon-container .icon						{font-size:2.4em;}
			.swiper-left-icon-container .icon-left-arrow-outline		{left:0; top:7px;   font-size:3em;}
			.swiper-left-icon-container span							{font-size:1.3em;}
			
			.swiper-right-icon-container							{bottom:0px; right:0;   width:180px; height:50px;}
			.swiper-right-icon-container .icon						{font-size:2.4em;}
			.swiper-right-icon-container .icon-right-arrow-outline	{right:0; top:7px;   font-size:3em;}
			.swiper-right-icon-container span						{font-size:1.3em;}
				
		/* Yes / No button align */
			.yesNoButtonAlign										{width:100%; height:135px;}

		/* Oscillating Get Ready */
			.oscillatingGetReady						{height:336px}
			.oscillatingGetReady p						{padding:70px 0 0; font-size:9em;}	
	
	}
	

	




	/* S5 (It's the height that's more important)*/
	@media screen and (max-width:480px) and (max-height:580px)
	{
	
		/* HEADER */	
			.hotCorner 							{padding-top:20px;}
			.hotCorner .text						{font-size:1.2em;}
			
			.leftHotCorner						{width:80px; height:70px; background:url(/assets/images/design/hot-corner-left.png) 100% no-repeat;}
			.leftHotCorner .icon					{top:0; left:0;}
			
			.rightHotCorner						{width:80px; height:70px; background:url(/assets/images/design/hot-corner-right.png) 0 no-repeat;}
			.rightHotCorner .icon				{top:0; right:0;}
			
			.hotCorner .icon-back				{font-size:1.4em;  padding:15px 20px 25px 8px}
			.hotCorner .icon-question			{font-size:2.8em;  padding:15px 25px 10px 15px}
			.hotCorner .icon-no					{font-size:1.5em; padding:14px 11px 25px 25px}
		/* END HEADER */

		

		/* FOOTER */
			.footer								{padding:3px 0;}
				.footer ul						{margin:0 0 0 5px; padding:0;}
					.footer li					{background:url(/assets/images/design/menu-divider.png) 0 50% no-repeat; font-size:1em}
					.footer li.share				{padding-right:5px;}
					.footer li.share .icon-share	{margin:13px 0 0 5px;}
						
						
						.footer li a				{padding:4px 10px; font-size:1.2em;}
		/* END FOOTER */	
		
		
		

		/* INITIALISE */
			
			body						{font-size:1.2em;}
				
			.title						{font-size:2em; margin:0 0 10px}
			h1							{font-size:2em; margin:0 0 20px;}
			.subTitle					{font-size:1.6em; margin:0 0 10px}
			
			p							{font-size:1.4em; line-height:1em; margin:0 0 1em; padding:0;}
			.largeText					{font-size:2.2em}
			.smallText					{font-size:1.6em}
			
			.singleMarginBottom			{margin-bottom:10px!important}
			.doubleMarginBottom			{margin-bottom:20px!important}
			.tripleMarginBottom			{margin-bottom:30px!important}
			
			
			.pageContainer				{width:90%; height:100%; margin:0 auto; padding:50px 0 0; overflow:hidden;}
			
			.smallContainer60			{width:100%; margin:0 auto;}
			.smallContainer75			{width:100%; margin:0 auto;}
			
			.scrollContainer			{width:300px; height:310px;}
			.scrollContainer .inner		{width:260px; height:310px; padding:0 40px 0 0;}
				
			.logoContainer				{margin:0 auto 20px; width:130px; height:78px}
			.mosiLogoContainer			{margin:0 auto 40px; width:140px; height:50px}

		/* END INITIALISE */

		
		
		/* FORMS */
			.formRowContainer			{margin-bottom:20px}
			
			.inlineForm					{padding:5px 0 0}
			.inlineForm label				{padding:4px 0 0; font-size:1.3em; width:95px;}
			
			.oversizedLabel				{font-size:1.4em;}
			
			.oversizedCheckbox			{width:20px; height:20px;}
			.oversizedRadiobox			{width:20px; height:20px}
			.oversizedSelect 			{font-size:1.8em;}
			.selectFocus				{border:5px solid #00a69b!important}
			
			.oversizedTextInput			{width:100%; font-size:2em; padding:15px;}
			
			.oversizedTextarea			{width:100%; height:200px; font-size:1.6em; padding:15px;}
			
			.oversizedFormButton		{padding:9px 25px 6px; font-size:1.6em;}
			.halfWidthFormButton		{width:48%; padding-left:0; padding-right:0;}
			
			
			/* Wrappers and Icons */
				.clearIcon				{top:10px; right:0; width:40px; height:40px;}
				.clearIconPadding		{padding-right:28px!important}
				
				.passwordIcon			{top:50%; right:5px; margin-top:-20px; width:35px; height:40px; background:url(formImages/wink.png) 5px 50% no-repeat;}
				.passwordIcon-show		{background-position:-40px 50%}
				.movePasswordIcon		{right:45px!important}
				
				.doubleIconPadding		{padding-right:80px!important}
				
			/* Uniform Form styling*/
				div.selector span			{height:15px; margin:0; padding:4px; font-size:1.4em; background:#fff url(/assets/images/design/icon-select-arrow-small.gif) no-repeat 97% 50%;}
											
				div.selector select		{height:32px; font-size:1.4em}
		/* END FORMS */	

		
		/* ICON FONTS */
			.icon-oversized							{font-size:2.8em;}
		/* END ICON FONTS */
		
		
		/* BUTTONS */
			/* Button wrapper for text */
			.buttonWrapper							{margin:0 0 5px;}
		
			
			/* Half Round Buttons */
			.halfButtonContainer					{width:66px; margin:0 auto 10px;}
				.leftHalf							{border-radius:200px 0 0 200px;}
				.rightHalf							{border-radius:0 200px 200px 0;}
				.halfRoundButton					{width:33px; height:66px;}			
			
			/* Half Round Buttons */
			.oversizedHalfButtonContainer			{width:70px; margin:0 auto 10px;}
				.oversizedLeftHalf					{border-radius:200px 0 0 200px;}
				.oversizedRightHalf					{border-radius:0 200px 200px 0;}
				.oversizedHalfRoundButton			{width:35px; height:70px;}
			
			/* Generic round button classes */
			.roundButton							{margin:0 10px 7px; width:66px; height:66px; border-radius:200px;}		
			.roundButton p							{bottom:0; left:0; width:100%; font-size:1.5em;}
			
			
			/* Oversized round buttons */
			.oversizedRoundButton					{width:85px; height:85px;}
			
			.oversizedRoundButton p					{bottom:12px;}
			.oversizedRoundButton.singleText p		{bottom:31px;}
			.oversizedRoundButton.doubleText p		{bottom:22px;}
			
			.oversizedRoundButton .icon-yes			{top:17%; font-size:2.6em; margin-left:-18%;}
			.oversizedRoundButton .icon-no			{top:18%; font-size:2.6em; margin-left:-17%;}
			
			
			/* Rect buttons */
			.rectButton								{padding:20px 30px;}
			
			li .rectButton							{font-size:0.7em; padding:10px 0}
			
			.rectButton span							{margin:0 0 0 10px}

			.gamePlaySelector						{width:70%; margin:0 auto}
			.gamePlaySelector .icon-headphones		{font-size:1em; left:5px; top:32%}
			.gamePlaySelector .icon-stop-watch		{font-size:1.2em; left:10px; top:25%;}
			.gamePlaySelector .icon-in-a-row			{font-size:1.2em; left:10px; top:26%;}
			.gamePlaySelector .icon-music-note		{font-size:1.4em; left:15px; top:22%;}
			
			
			
			/* Rect buttons with icon */
			.facebookButton 							{background:#5a7aaf url(/assets/images/design/icon-facebook-small.png) 12px 50% no-repeat;}
			.twitterButton 							{background:#17b2ec url(/assets/images/design/icon-twitter-small.png) 12px 50% no-repeat;}
			
			
			/* A/B Containers */
			.abContainer .left						{top:20%; left:0;}
			.abContainer .right						{top:20%; right:0}
			
			.abContainer .small,
			.abContainer .large						{font-size:2.3em;}
			.abContainer .large						{font-size:3em;}
			
			.left-abContainer						{width:45%;}
			.right-abContainer						{width:45%;}
			
			
			/* Standard AB button */
			.abOuterBorder							{border:3px solid transparent; width:76px; height:76px; border-radius:200px;}
			.abButton								{margin:5px 0 0 5px}
			.abButton .icon-right-arrow				{top:21%; font-size:3.3em; margin-left:-9%;}
			.abButton .icon-yes						{top:26%; font-size:3.4em; margin-left:-27%;}

			/* Active AB button */
			.abOuterBorder.activeRotator			{border:3px solid #fbaf5d;}
			.activeRotator .eqButton					{background:#fff url(/assets/images/design/eq-orange.gif) 49% 42% no-repeat!important}
			
			
			.sequentialRotator .eqButton				{background:#fff url(/assets/images/design/eq-orange-sequential.gif) 49% 42% no-repeat!important}
			
														
			/* Rotator selector */
			.rotatorSelectorContainer							{width:106px; height:106px;}
			
				.rotatorSelectorContainer .corner				{top:0px; width:20px; height:20px;}
				.rotatorSelectorContainer .leftCorner			{left:0px;}
				.rotatorSelectorContainer .rightCorner			{right:0px;}
				
				.rotatorSelector								{margin:20px 0 0; width:85px; height:85px; border:3px solid white;} /* same size as oversized buttons */
																
														
				.rotatorSelector.left							{width:101px; height:101px;}
				
				.rotatorSelector.right							{width:101px; height:101px;}
				
					.rotatorSelector .icon-top-arrow				{top:-25px; left:36%; font-size:3em;}
			
				.rotatorSelectorContainer p.singleText			{top:42%;}
				.rotatorSelectorContainer p.doubleText			{top:35%;}
				.rotatorSelectorContainer .oversizedRoundButton	{top:11px; left:11px;}
				
			
			/* Genre buttons */
			.genreButtons							{width:70px; height:70px;}
			.genreButtons .icon-music				{top: 22%; font-size: 3em; margin-left: -23%;}
			
			.genreButtons .icon-radio				{top: 31%; font-size: 3em; margin-left: -24%;}
			.genreButtons .icon-vinyl				{top: 24%; font-size: 3em; margin-left: -24%;}
			.genreButtons .icon-cassette				{top: 30%; font-size: 3em; margin-left: -27%;}
			
			.genreButtons .icon-cd					{top: 25%; font-size: 3em; margin-left: -23%;}
			.genreButtons .icon-ipod					{top: 23%; font-size: 3.2em; margin-left: -16%;}
			.genreButtons .icon-cloud-audio			{top:30%; font-size:4.6em; margin-left:-27%;}
			
			.genreButtons .icon-violin				{top: 13%; font-size: 4em; margin-left: -16%;}
			.genreButtons .icon-microphone			{top:28%; font-size:4.4em; margin-left:-28%}
			.genreButtons .icon-rock					{top:16%; font-size:5.4em; margin-left:-16%;}

			
			/* Circle Arrows */
			.circleArrows							{width:118px; height:118px;}
			.circleArrows .icon-circle-arrows		{top:0; left:0; font-size:9.7em;}
			.circleArrows .roundButton				{margin:13px 0 0 17px;}
			
			
			/* Speaker / Mute Icon */
			.icon-mute,
			.icon-speaker							{font-size:2.4em}
			
			
			/* Icons */
			.halfRoundButton .icon-twitter			{top:37%; font-size:1.7em; margin-left:-30%;}
			.halfRoundButton .icon-facebook			{top:33%; font-size:2em; margin-left:-12%;}
			
			.oversizedHalfRoundButton .icon-twitter	{top:35%; font-size:1.8em; margin-left:-30%;}
			.oversizedHalfRoundButton .icon-facebook	{top:31%; font-size:2.2em; margin-left:-12%;}
			
			.icon-twitter							{top:29%; font-size:3.3em; margin-left:-22%;}
			.icon-facebook							{top:25%; font-size:3.5em; margin-left:-13%;}
			
			
			
			.icon-email								{top:32%; font-size:3.5em; margin-left:-26%;}
			.icon-replay							{top:28%; font-size:2.8em; margin-left:-27%;}
			.icon-forward							{top:26%; font-size:2.3em; margin-left:-30%;}
		/* END BUTTONS */		
		
		
		
		/* LISTS */
			li										{font-size:1.5em; margin:0 0 10px}
		/* END LISTS */
		


		
		/* TIMER */
			.counterContainer							{margin:0 auto 20px; width:201px; height:201px;}
			.counterContainer .numberCount				{top:50%; left:0; margin:-40px 0 0 0; padding:0; width:100%; font-size:7em;}
			
			.counterContainerSmall						{width:100px; height:100px;}
			.counterContainerSmall .numberCount			{top:50%; left:0; margin:-17px 0 0 0; padding:0; width:100%; font-size:3em;}
		/* END TIMER */
		
		
		
		/* INFO LEFT */
			.infoLeft								{margin:0 0 10px;}
			.infoLeft p								{margin:0 0 0.2em}
			.infoLeft p.feature						{font-size:2.2em}
			
			.infoLeft .singleText					{margin-top:15px}

			
			.infoLeft .icon-trophy					{font-size:2.2em; margin:0 20px 0 0}
			.infoLeft .icon-padlock-closed-black	{margin:0 20px 0 0; font-size:4em}
		/* END INFO LEFT */
		
		
		
		/* GAME SCORE */
			.gameScoreContainer p					{font-size:2.2em;}
		/* END GAME SCORE */
		
		
		/* OVERALL SCORE */
			.scoreContainer							{font-size:2.2em; padding:0 10px 1px 0;}
			.scoreContainer img						{margin:0 0 0 10px}
		/* END OVERALL SCORE */

				
				
		/* SCORE BREAKDOWN */
			.score-breakdown-container					{width:130px; height:130px; background:url(/assets/images/design/bkgnd-score-breakdown.png) 0 0 no-repeat;
														background:url(/assets/images/design/bkgnd-score-breakdown.png) 0 0 no-repeat;
														-webkit-background-size:100% 100%;
														-moz-background-size:100% 100%;
														-o-background-size:100% 100%;
														background-size:100% 100%;}
													
			.score-breakdown-container .chartContainer	{top:10px; left:-45px; width:220px!important; height:110px!important}
			.score-breakdown							{top:48px; left:0; width:100%; font-size:3.7em;}
		/* END SCORE BREAKDOWN */
				

		
		/* BONUS SCORE */
			.bonusScore						{width:145px; height:145px; margin:0 auto 20px; border:5px solid #fbaf5d; border-radius:400px}
			.bonusScore p					{font-size:6em;   margin:37px 0 0}
		/* END BONUS SCORE */
		
		
		
		/* SCORE CONTAINER */
			.leftScoresContainer			{width:50%}
			.scoreRow 						{margin:0 0 30px}
			.rightScoresContainer			{width:50%}
		/* END SCORE CONTAINER */
		
				
		/* GRAPH CONTAINER */		
			.graphContainer .percentage		{font-size:1.6em; line-height:1em}
			
			.left-graph-details				{top:30px; left:0; width:75px;}
			.right-graph-details			{top:30px; right:0; width:75px;}
			
			.chartContainer					{width:280px!important; height:140px!important}
		/* END GRAPH CONTAINER */		
				
		
		/* ACCOUNT ROW */	
			.accountRow	.account-detail		{width:60%; font-size:1.6em;}
			.accountRow	.account-edit		{font-size:1.7em;}
			
			.accountRow .icon-facebook		{font-size:1.5em; margin:-5px 0 0; padding:8px 4px 10px 14px}
		/* END ACCOUNT ROW */

		
		/* Toggle container */
			.toggleContainer 							{margin:-3px 0 0}
			.toggleContainer .ui-slider-switch 			{width:80px}
			div.ui-slider-switch							{border-radius:20px;}
			.ui-slider-switch .ui-slider-label			{top:1px}
			.ui-slider-inneroffset						{margin:1px 16px 0 18px}
			.ui-slider-switch .ui-btn.ui-slider-handle	{border-radius:20px}
				
		/* Equaliser */
			.eqContainer								{margin:0 0 0 15px; width:36px; height:54px; background:url(/assets/images/design/eq-static.gif) 0 100% no-repeat;}
			.eqContainer.active							{background:url(/assets/images/design/eq.gif) 0 100% no-repeat;}
		
		/* Swiper */
			.swipeContainer											{height:425px;}
			
			.swiper-left-icon-container								{bottom:5px; left:0; width:120px; height:35px;}
			.swiper-left-icon-container .icon						{font-size:2em;}
			.swiper-left-icon-container .icon-left-arrow-outline		{left:0; top:7px; font-size:2em;}
			.swiper-left-icon-container span							{font-size:1em;}
			
			.swiper-right-icon-container							{bottom:5px; right:0; width:120px; height:35px;}
			.swiper-right-icon-container .icon						{font-size:2em;}
			.swiper-right-icon-container .icon-right-arrow-outline	{right:0; top:7px; font-size:2em;}
			.swiper-right-icon-container span						{font-size:1em;}
				
		/* Yes / No button align */
			.yesNoButtonAlign										{width:100%; height:125px;}

		/* Oscillating Get Ready */
			.oscillatingGetReady						{height:250px;}
			.oscillatingGetReady p						{padding:30px 0 0; font-size:7em;}
	}


	
	
	/* iphone 5 / win phone 8 */
	@media screen and (max-width:480px) and (max-height:490px)
	{
		/* HEADER */	
			.hotCorner 							{padding-top:20px;}
			.hotCorner .text						{font-size:1.2em;}
			
			.leftHotCorner						{width:70px; height:60px; background:url(/assets/images/design/hot-corner-left.png) 100% no-repeat;}
			.leftHotCorner .icon					{top:0; left:0;}
			
			.rightHotCorner						{width:70px; height:60px; background:url(/assets/images/design/hot-corner-right.png) 0 no-repeat;}
			.rightHotCorner .icon				{top:0; right:0;}
			
			.hotCorner .icon-back				{font-size:1.3em;  padding:12px 20px 25px 4px}
			.hotCorner .icon-question			{font-size:2.1em;  padding:10px 25px 10px 10px}
			.hotCorner .icon-no					{font-size:1.3em; padding:12px 6px 25px 25px}
		/* END HEADER */

		

		/* FOOTER */
			.footer								{padding:3px 0;}
				.footer ul						{margin:0 0 0 5px; padding:0;}
					.footer li					{background:url(/assets/images/design/menu-divider.png) 0 50% no-repeat; font-size:1em}
					.footer li.share				{padding-right:5px;}
					.footer li.share .icon-share	{margin:13px 0 0 5px;}
						
						
						.footer li a				{padding:4px 10px; font-size:1.2em;}
		/* END FOOTER */	
		
		
		

		/* INITIALISE */
			
			body						{font-size:1.2em;}
				
			.title						{font-size:1.5em; margin:0 0 10px}
			h1							{font-size:1.5em; margin:0 0 20px;}
			.subTitle					{font-size:1.2em; margin:0 0 10px}
			
			p							{font-size:1.2em; line-height:1em; margin:0 0 1em; padding:0;}
			.largeText					{font-size:2em}
			.smallText					{font-size:1.6em}
			
			.singleMarginBottom			{margin-bottom:10px!important}
			.doubleMarginBottom			{margin-bottom:20px!important}
			.tripleMarginBottom			{margin-bottom:30px!important}
			
			
			.pageContainer				{width:90%; height:100%; margin:0 auto; padding:30px 0 0; overflow:hidden;}
			
			.smallContainer60			{width:100%; margin:0 auto;}
			.smallContainer75			{width:100%; margin:0 auto;}
			
			.scrollContainer			{width:300px; height:290px;}
			.scrollContainer .inner		{width:260px; height:290px; padding:0 40px 0 0;}
			

			
			/* Custom scroll bars */
				.jspVerticalBar					{width:37px}
					.jspTrack					{margin:0 0 0 12px;}
						.jspDrag				{margin:0 0 0 -2px;}
					
					.jspArrowUp					{font-size:2em; height:25px!important;}
					.jspArrowDown				{font-size:2em; height:25px!important;}
			
			
			
			.logoContainer				{margin:0 auto 20px; width:110px; height:66px}
			.mosiLogoContainer			{margin:0 auto 40px; width:110px; height:39px}

		/* END INITIALISE */

		
		
		/* FORMS */
			.formRowContainer			{margin-bottom:20px}
			
			.inlineForm					{padding:5px 0 0}
			.inlineForm label				{padding:4px 0 0; font-size:1.1em; width:95px;}
			
			.oversizedLabel				{font-size:1.2em;}
			
			.oversizedCheckbox			{width:20px; height:20px;}
			.oversizedRadiobox			{width:20px; height:20px}
			.oversizedSelect 			{font-size:1.8em;}
			.selectFocus				{border:5px solid #00a69b!important}
			
			.oversizedTextInput			{width:100%; font-size:2em; padding:15px;}
			
			.oversizedTextarea			{width:100%; height:200px; font-size:1.6em; padding:15px;}
			
			.oversizedFormButton		{padding:9px 25px 6px; font-size:1.6em;}
			.halfWidthFormButton		{width:48%; padding-left:0; padding-right:0;}
			
			
			/* Wrappers and Icons */
				.clearIcon				{top:10px; right:0; width:40px; height:40px;}
				.clearIconPadding		{padding-right:28px!important}
				
				.passwordIcon			{top:50%; right:5px; margin-top:-20px; width:35px; height:40px; background:url(formImages/wink.png) 5px 50% no-repeat;}
				.passwordIcon-show		{background-position:-40px 50%}
				.movePasswordIcon		{right:45px!important}
				
				.doubleIconPadding		{padding-right:80px!important}
				
			/* Uniform Form styling*/
				div.selector span			{height:15px; margin:0; padding:4px; font-size:1.2em; background:#fff url(/assets/images/design/icon-select-arrow-small.gif) no-repeat 97% 50%;}
											
				div.selector select		{height:32px; font-size:1.2em}
		/* END FORMS */	

		
		/* ICON FONTS */
			.icon-oversized							{font-size:2.6em;}
		/* END ICON FONTS */
		
		
		/* BUTTONS */
		
			
		
			/* Button wrapper for text */
			.buttonWrapper							{margin:0 0 5px;}
		
			
			/* Half Round Buttons */
			.halfButtonContainer					{width:66px; margin:0 auto 10px;}
				.leftHalf							{border-radius:200px 0 0 200px;}
				.rightHalf							{border-radius:0 200px 200px 0;}
				.halfRoundButton					{width:33px; height:66px;}			
			
			/* Half Round Buttons */
			.oversizedHalfButtonContainer			{width:70px; margin:0 auto 10px;}
				.oversizedLeftHalf					{border-radius:200px 0 0 200px;}
				.oversizedRightHalf					{border-radius:0 200px 200px 0;}
				.oversizedHalfRoundButton			{width:35px; height:70px;}
			
			/* Generic round button classes */
			.roundButton							{margin:0 10px 7px; width:66px; height:66px; border-radius:200px;}		
			.roundButton p							{bottom:0; left:0; width:100%; font-size:1.5em;}
			
			
			/* Oversized round buttons */
			.oversizedRoundButton					{width:85px; height:85px;}
			
			.oversizedRoundButton p					{bottom:12px;}
			.oversizedRoundButton.singleText p		{bottom:31px;}
			.oversizedRoundButton.doubleText p		{bottom:22px;}
			
			.oversizedRoundButton .icon-yes			{top:17%; font-size:2.6em; margin-left:-18%;}
			.oversizedRoundButton .icon-no			{top:18%; font-size:2.6em; margin-left:-17%;}
			
			
			/* Rect buttons */
			.rectButton								{padding:20px 30px;}
			
			li .rectButton							{font-size:0.6em; padding:10px 0}
			
			.rectButton span							{margin:0 0 0 10px}

			.gamePlaySelector						{width:70%; margin:0 auto}
			.gamePlaySelector .icon-headphones		{font-size:1em; left:5px; top:32%}
			.gamePlaySelector .icon-stop-watch		{font-size:1.2em; left:10px; top:25%;}
			.gamePlaySelector .icon-in-a-row			{font-size:1.2em; left:10px; top:26%;}
			.gamePlaySelector .icon-music-note		{font-size:1.4em; left:15px; top:22%;}
			
			
			
			/* Rect buttons with icon */
			.facebookButton 							{background:#5a7aaf url(/assets/images/design/icon-facebook-small.png) 12px 50% no-repeat;}
			.twitterButton 							{background:#17b2ec url(/assets/images/design/icon-twitter-small.png) 12px 50% no-repeat;}
			
			
			/* A/B Containers */
			.abContainer .left						{top:20%; left:0;}
			.abContainer .right						{top:20%; right:0}
			
			.abContainer .small,
			.abContainer .large						{font-size:2.3em;}
			.abContainer .large						{font-size:3em;}
			
			.left-abContainer						{width:45%;}
			.right-abContainer						{width:45%;}
			
			
			/* Standard AB button */
			.abOuterBorder							{border:3px solid transparent; width:76px; height:76px; border-radius:200px;}
			.abButton								{margin:5px 0 0 5px}
			.abButton .icon-right-arrow				{top:21%; font-size:3.3em; margin-left:-9%;}
			.abButton .icon-yes						{top:26%; font-size:3.4em; margin-left:-27%;}

			/* Active AB button */
			.abOuterBorder.activeRotator			{border:3px solid #fbaf5d;}
			.activeRotator .eqButton					{background:#fff url(/assets/images/design/eq-orange.gif) 49% 42% no-repeat!important}
			
			
			.sequentialRotator .eqButton				{background:#fff url(/assets/images/design/eq-orange-sequential.gif) 49% 42% no-repeat!important}
			
														
														
			/* Rotator selector */
			.rotatorSelectorContainer							{width:106px; height:106px;}
			
				.rotatorSelectorContainer .corner				{top:0px; width:20px; height:20px;}
				.rotatorSelectorContainer .leftCorner			{left:0px;}
				.rotatorSelectorContainer .rightCorner			{right:0px;}
				
				.rotatorSelector								{margin:20px 0 0; width:85px; height:85px; border:3px solid white;} /* same size as oversized buttons */
																
														
				.rotatorSelector.left							{width:101px; height:101px;}
				
				.rotatorSelector.right							{width:101px; height:101px;}
				
					.rotatorSelector .icon-top-arrow				{top:-25px; left:36%; font-size:3em;}
			
				.rotatorSelectorContainer p.singleText			{top:42%;}
				.rotatorSelectorContainer p.doubleText			{top:35%;}
				.rotatorSelectorContainer .oversizedRoundButton	{top:11px; left:11px;}
				
			
			/* Genre buttons */
			.genreButtons							{width:70px; height:70px;}
			.genreButtons .icon-music				{top: 22%; font-size: 3em; margin-left: -23%;}
			
			.genreButtons .icon-radio				{top: 31%; font-size: 3em; margin-left: -24%;}
			.genreButtons .icon-vinyl				{top: 24%; font-size: 3em; margin-left: -24%;}
			.genreButtons .icon-cassette				{top: 30%; font-size: 3em; margin-left: -27%;}
			
			.genreButtons .icon-cd					{top: 25%; font-size: 3em; margin-left: -23%;}
			.genreButtons .icon-ipod					{top: 23%; font-size: 3.2em; margin-left: -16%;}
			.genreButtons .icon-cloud-audio			{top:30%; font-size:4.6em; margin-left:-27%;}
			
			.genreButtons .icon-violin				{top: 13%; font-size: 4em; margin-left: -16%;}
			.genreButtons .icon-microphone			{top:28%; font-size:4.4em; margin-left:-28%}
			.genreButtons .icon-rock					{top:16%; font-size:5.4em; margin-left:-16%;}

			
			/* Circle Arrows */
			.circleArrows							{width:118px; height:118px;}
			.circleArrows .icon-circle-arrows		{top:0; left:0; font-size:9.7em;}
			.circleArrows .roundButton				{margin:13px 0 0 17px;}
			
			
			/* Speaker / Mute Icon */
			.icon-mute,
			.icon-speaker							{font-size:2.4em}
			
			
			/* Icons */
			.halfRoundButton .icon-twitter			{top:37%; font-size:1.7em; margin-left:-30%;}
			.halfRoundButton .icon-facebook			{top:33%; font-size:2em; margin-left:-12%;}
			
			.oversizedHalfRoundButton .icon-twitter	{top:35%; font-size:1.8em; margin-left:-30%;}
			.oversizedHalfRoundButton .icon-facebook	{top:31%; font-size:2.2em; margin-left:-12%;}
			
			.icon-twitter							{top:29%; font-size:3.3em; margin-left:-22%;}
			.icon-facebook							{top:25%; font-size:3.5em; margin-left:-13%;}
			
			
			
			.icon-email								{top:32%; font-size:3.5em; margin-left:-26%;}
			.icon-replay							{top:28%; font-size:2.8em; margin-left:-27%;}
			.icon-forward							{top:26%; font-size:2.3em; margin-left:-30%;}
		/* END BUTTONS */		
		
		
		
		/* LISTS */
			li										{font-size:1.5em; margin:0 0 10px}
		/* END LISTS */
		


		
		/* TIMER */
			.counterContainer							{margin:0 auto 20px; width:201px; height:201px;}
			.counterContainer .numberCount				{top:50%; left:0; margin:-40px 0 0 0; padding:0; width:100%; font-size:7em;}
			
			.counterContainerSmall						{width:100px; height:100px;}
			.counterContainerSmall .numberCount			{top:50%; left:0; margin:-17px 0 0 0; padding:0; width:100%; font-size:3em;}
		/* END TIMER */
		
		
		
		/* INFO LEFT */
			.infoLeft								{margin:0 0 10px;}
			.infoLeft p								{margin:0 0 0.2em}
			.infoLeft p.feature						{font-size:2.2em}
			
			.infoLeft .singleText					{margin-top:15px}

			
			.infoLeft .icon-trophy					{font-size:2.2em; margin:0 20px 0 0}
			.infoLeft .icon-padlock-closed-black	{margin:0 20px 0 0; font-size:4em}
		/* END INFO LEFT */
		
		
		
		/* GAME SCORE */
			.gameScoreContainer p					{font-size:2.2em;}
		/* END GAME SCORE */
		
		
		/* OVERALL SCORE */
			.scoreContainer							{font-size:2.2em; padding:0 10px 1px 0;}
			.scoreContainer img						{margin:0 0 0 10px}
		/* END OVERALL SCORE */

				
				
		/* SCORE BREAKDOWN */
			.score-breakdown-container					{width:130px; height:130px; background:url(/assets/images/design/bkgnd-score-breakdown.png) 0 0 no-repeat;
														background:url(/assets/images/design/bkgnd-score-breakdown.png) 0 0 no-repeat;
														-webkit-background-size:100% 100%;
														-moz-background-size:100% 100%;
														-o-background-size:100% 100%;
														background-size:100% 100%;}
													
			.score-breakdown-container .chartContainer	{top:10px; left:-45px; width:220px!important; height:110px!important}
		/* END SCORE BREAKDOWN */
				

		
		/* BONUS SCORE */
			.bonusScore						{width:145px; height:145px; margin:0 auto 20px; border:5px solid #fbaf5d; border-radius:400px}
			.bonusScore p					{font-size:6em;   margin:37px 0 0}
		/* END BONUS SCORE */
		
		
		
		/* SCORE CONTAINER */
			.leftScoresContainer			{width:50%}
			.scoreRow 						{margin:0 0 30px}
			.rightScoresContainer			{width:50%}
		/* END SCORE CONTAINER */
		
				
		/* GRAPH CONTAINER */		
			.graphContainer .percentage		{font-size:1.6em; line-height:1em}
			
			.left-graph-details				{top:30px; left:0; width:75px;}
			.right-graph-details			{top:30px; right:0; width:75px;}
			
			.chartContainer					{width:280px!important; height:140px!important}
		/* END GRAPH CONTAINER */		
				
		
		/* ACCOUNT ROW */	
			.accountRow	.account-detail		{width:60%; font-size:1.6em;}
			.accountRow	.account-edit		{font-size:1.7em;}
			
			.accountRow .icon-facebook		{font-size:1.5em; margin:-5px 0 0; padding:8px 4px 10px 14px}
		/* END ACCOUNT ROW */

		
		/* Toggle container */
			.toggleContainer 							{margin:-3px 0 0}
			.toggleContainer .ui-slider-switch 			{width:80px}
			div.ui-slider-switch							{border-radius:20px;}
			.ui-slider-switch .ui-slider-label			{top:1px}
			.ui-slider-inneroffset						{margin:1px 16px 0 18px}
			.ui-slider-switch .ui-btn.ui-slider-handle	{border-radius:20px}
				
		/* Equaliser */
			.eqContainer								{margin:0 0 0 15px; width:36px; height:54px; background:url(/assets/images/design/eq-static.gif) 0 100% no-repeat;}
			.eqContainer.active							{background:url(/assets/images/design/eq.gif) 0 100% no-repeat;}
		
		/* Swiper */
			.swipeContainer											{height:388px;}
			
			.swiper-left-icon-container								{bottom:5px; left:0; width:120px; height:35px;}
			.swiper-left-icon-container .icon						{font-size:1.7em;}
			.swiper-left-icon-container .icon-left-arrow-outline		{left:0; top:7px; font-size:1.7em;}
			.swiper-left-icon-container span							{font-size:1em;}
			
			.swiper-right-icon-container							{bottom:5px; right:0; width:120px; height:35px;}
			.swiper-right-icon-container .icon						{font-size:1.7em;}
			.swiper-right-icon-container .icon-right-arrow-outline	{right:0; top:7px; font-size:1.7em;}
			.swiper-right-icon-container span						{font-size:1em;}
				
		/* Yes / No button align */
			.yesNoButtonAlign										{width:100%; height:118px;}

		/* Oscillating Get Ready */
			.oscillatingGetReady						{height:243px;}
			.oscillatingGetReady p						{padding:90px 0 0; font-size:5em;}
	}

	
	
	
	/* iPhone 4 and below */			
	@media screen and (max-width:480px) and (max-height:380px)
	{
		/* HEADER */	
			.hotCorner 							{padding-top:20px;}
			.hotCorner .text						{font-size:1.2em;}
			
			.leftHotCorner						{width:55px; height:60px; background:url(/assets/images/design/hot-corner-left.png) 100% no-repeat;}
			.leftHotCorner .icon					{top:0; left:0;}
			
			.rightHotCorner						{width:55px; height:60px; background:url(/assets/images/design/hot-corner-right.png) 0 no-repeat;}
			.rightHotCorner .icon				{top:0; right:0;}
			
			.hotCorner .icon-back				{font-size:1.1em;  padding:8px 20px 25px 3px}
			.hotCorner .icon-question			{font-size:1.9em;  padding:6px 25px 10px 7px}
			.hotCorner .icon-no					{font-size:1.1em; padding:8px 6px 24px 20px}
		/* END HEADER */

		

		/* FOOTER */
			.footer								{padding:3px 0;}
				.footer ul						{margin:0 0 0 5px; padding:0;}
					.footer li					{background:url(/assets/images/design/menu-divider.png) 0 50% no-repeat; font-size:1em}
					.footer li.share				{padding-right:5px;}
					.footer li.share .icon-share	{margin:13px 0 0 5px;}
						
						
						.footer li a				{padding:3px 8px; font-size:1em;}
		/* END FOOTER */	
		
		
		

		/* INITIALISE */
			
			body						{font-size:1.2em;}
				
			.title						{font-size:1.2em; margin:0 0 10px}
			h1							{font-size:1.2em; margin:0 0 10px;}
			.subTitle					{font-size:1em; margin:0 0 10px}
			
			p							{font-size:1em; line-height:1em; margin:0 0 1em; padding:0;}
			.largeText					{font-size:2em}
			.smallText					{font-size:1.6em}
			
			.singleMarginBottom			{margin-bottom:10px!important}
			.doubleMarginBottom			{margin-bottom:20px!important}
			.tripleMarginBottom			{margin-bottom:30px!important}
			
			
			.pageContainer				{width:90%; height:100%; margin:0 auto; padding:30px 0 0; overflow:hidden;}
			
			.smallContainer60			{width:100%; margin:0 auto;}
			.smallContainer75			{width:100%; margin:0 auto;}
			
			.scrollContainer			{width:300px; height:220px;}
			.scrollContainer .inner		{width:260px; height:220px; padding:0 40px 0 0;}
			

			
			/* Custom scroll bars */
				.jspVerticalBar					{width:37px}
					.jspTrack					{margin:0 0 0 12px;}
						.jspDrag				{margin:0 0 0 -2px;}
					
					.jspArrowUp					{font-size:2em; height:25px!important;}
					.jspArrowDown				{font-size:2em; height:25px!important;}
			
			
			
			.logoContainer				{margin:0 auto 10px; width:95px; height:57px}
			.mosiLogoContainer			{margin:0 auto 10px; width:95px; height:34px}

		/* END INITIALISE */

		
		
		/* FORMS */
			.formRowContainer			{margin-bottom:20px}
			
			.inlineForm					{padding:5px 0 0}
			.inlineForm label				{padding:4px 0 0; font-size:1.1em; width:95px;}
			
			.oversizedLabel				{font-size:1.2em;}
			
			.oversizedCheckbox			{width:20px; height:20px;}
			.oversizedRadiobox			{width:20px; height:20px}
			.oversizedSelect 			{font-size:1.8em;}
			.selectFocus				{border:5px solid #00a69b!important}
			
			.oversizedTextInput			{width:100%; font-size:2em; padding:15px;}
			
			.oversizedTextarea			{width:100%; height:200px; font-size:1.6em; padding:15px;}
			
			.oversizedFormButton		{padding:9px 25px 6px; font-size:1.6em;}
			.halfWidthFormButton		{width:48%; padding-left:0; padding-right:0;}
			
			
			/* Wrappers and Icons */
				.clearIcon				{top:10px; right:0; width:40px; height:40px;}
				.clearIconPadding		{padding-right:28px!important}
				
				.passwordIcon			{top:50%; right:5px; margin-top:-20px; width:35px; height:40px; background:url(formImages/wink.png) 5px 50% no-repeat;}
				.passwordIcon-show		{background-position:-40px 50%}
				.movePasswordIcon		{right:45px!important}
				
				.doubleIconPadding		{padding-right:80px!important}
				
			/* Uniform Form styling*/
				div.selector span			{height:15px; margin:0; padding:4px; font-size:1.2em; background:#fff url(/assets/images/design/icon-select-arrow-small.gif) no-repeat 97% 50%;}
											
				div.selector select		{height:32px; font-size:1.2em}
		/* END FORMS */	

		
		/* ICON FONTS */
			.icon-oversized							{font-size:2.6em;}
		/* END ICON FONTS */
		
		
		/* BUTTONS */
			/* Button wrapper for text */
			.buttonWrapper							{margin:0 0 5px;}
		
			
			/* Half Round Buttons */
			.halfButtonContainer					{width:52px; margin:0 auto 10px;}
				.leftHalf							{border-radius:200px 0 0 200px;}
				.rightHalf							{border-radius:0 200px 200px 0;}
				.halfRoundButton					{width:26px; height:52px;}
			
			/* Half Round Buttons */
			.oversizedHalfButtonContainer			{width:60px; margin:0 auto 10px;}
				.oversizedLeftHalf					{border-radius:200px 0 0 200px;}
				.oversizedRightHalf					{border-radius:0 200px 200px 0;}
				.oversizedHalfRoundButton			{width:30px; height:60px;}
			
			/* Generic round button classes */
			.roundButton							{margin:0 10px 7px; width:52px; height:52px; border-radius:200px;}		
			.roundButton p							{bottom:0; left:0; width:100%; font-size:1.1em;}
			
			
			/* Oversized round buttons */
			.oversizedRoundButton					{width:65px; height:65px;}
			
			.oversizedRoundButton p					{bottom:10px;}
			.oversizedRoundButton.singleText p		{bottom:24px;}
			.oversizedRoundButton.doubleText p		{bottom:18px;}
			
			.oversizedRoundButton .icon-yes			{top:17%; font-size:2em; margin-left:-18%;}
			.oversizedRoundButton .icon-no			{top:18%; font-size:2em; margin-left:-17%;}
			
			
			/* Rect buttons */
			.rectButton								{padding:20px 30px;}
			
			li .rectButton							{font-size:0.6em; padding:7px 0}
			
			.rectButton span							{margin:0 0 0 10px}

			.gamePlaySelector						{width:49%; margin:0 auto}
			.gamePlaySelector .icon-headphones		{font-size:1em; left:-5px; top:32%}
			.gamePlaySelector .icon-stop-watch		{font-size:1.2em; left:0px; top:25%;}
			.gamePlaySelector .icon-in-a-row			{font-size:1.2em; left:0px; top:26%;}
			.gamePlaySelector .icon-music-note		{font-size:1.4em; left:0px; top:22%;}
			
			
			
			/* Rect buttons with icon */
			.facebookButton 							{background:#5a7aaf url(/assets/images/design/icon-facebook-small.png) 12px 50% no-repeat;}
			.twitterButton 							{background:#17b2ec url(/assets/images/design/icon-twitter-small.png) 12px 50% no-repeat;}
			
			
			/* A/B Containers */
			.abContainer .left						{top:20%; left:0;}
			.abContainer .right						{top:20%; right:0}
			
			.abContainer .small,
			.abContainer .large						{font-size:2.3em;}
			.abContainer .large						{font-size:3em;}
			
			.left-abContainer						{width:45%;}
			.right-abContainer						{width:45%;}
			
			
			/* Standard AB button */
			.abOuterBorder							{border:3px solid transparent; width:62px; height:62px; border-radius:200px;}
			.abButton								{margin:5px 0 0 5px}
			.abButton .icon-right-arrow				{top:21%; font-size:2.4em; margin-left:-9%;}
			.abButton .icon-yes						{top:26%; font-size:3.4em; margin-left:-27%;}

			/* Active AB button */
			.abOuterBorder.activeRotator			{border:3px solid #fbaf5d;}
			.activeRotator .eqButton					{background:#fff url(/assets/images/design/eq-orange-small.gif) 49% 42% no-repeat!important}
			
			
			.sequentialRotator .eqButton				{background:#fff url(/assets/images/design/eq-orange-small-sequential.gif) 49% 42% no-repeat!important}
			
														
														
			/* Rotator selector */
			.rotatorSelectorContainer							{width:86px; height:86px;}
			
				.rotatorSelectorContainer .corner				{top:0px; width:20px; height:20px;}
				.rotatorSelectorContainer .leftCorner			{left:0px;}
				.rotatorSelectorContainer .rightCorner			{right:0px;}
				
				.rotatorSelector								{margin:20px 0 0; width:65px; height:65px; border:3px solid white;} /* same size as oversized buttons */
																
														
				.rotatorSelector.left							{width:80px; height:80px;}
				
				.rotatorSelector.right							{width:80px; height:80px;}
				
					.rotatorSelector .icon-top-arrow				{top:-19px; left:36%; font-size:2em;}
			
				.rotatorSelectorContainer p.singleText			{top:42%;}
				.rotatorSelectorContainer p.doubleText			{top:35%;}
				.rotatorSelectorContainer .oversizedRoundButton	{top:10px; left:10px;}
				
			
			/* Genre buttons */
			.genreButtons							{width:55px; height:55px;}
			.genreButtons .icon-music				{top: 22%; font-size: 2.5em; margin-left: -26%;}
			
			.genreButtons .icon-radio				{top: 30%; font-size: 2.5em; margin-left: -28%;}
			.genreButtons .icon-vinyl				{top: 24%; font-size: 2.5em; margin-left: -24%;}
			.genreButtons .icon-cassette				{top: 30%; font-size: 2.5em; margin-left: -28%;}
			
			.genreButtons .icon-cd					{top: 25%; font-size: 2.5em; margin-left: -23%;}
			.genreButtons .icon-ipod					{top: 23%; font-size: 2.5em; margin-left: -16%;}
			.genreButtons .icon-cloud-audio			{top:30%; font-size:4.6em; margin-left:-27%;}
			
			.genreButtons .icon-violin				{top: 13%; font-size: 3.4em; margin-left: -17%;}
			.genreButtons .icon-microphone			{top:28%; font-size:4.4em; margin-left:-28%}
			.genreButtons .icon-rock					{top:16%; font-size:5.4em; margin-left:-16%;}

			
			/* Circle Arrows */
			.circleArrows							{width:105px; height:110px;}
			.circleArrows .icon-circle-arrows		{top:0; left:0; font-size:8em;}
			.circleArrows .roundButton				{margin:13px 0 0 17px;}
			
			
			/* Speaker / Mute Icon */
			.icon-mute,
			.icon-speaker							{font-size:2.4em}
			
			
			/* Icons */
			.halfRoundButton .icon-twitter			{top:37%; font-size:1.3em; margin-left:-30%;}
			.halfRoundButton .icon-facebook			{top:33%; font-size:1.6em; margin-left:-12%;}
			
			.oversizedHalfRoundButton .icon-twitter	{top:35%; font-size:1.8em; margin-left:-30%;}
			.oversizedHalfRoundButton .icon-facebook	{top:31%; font-size:2.2em; margin-left:-12%;}
			
			.icon-twitter							{top:29%; font-size:3.3em; margin-left:-22%;}
			.icon-facebook							{top:25%; font-size:3.5em; margin-left:-13%;}
			
			
			
			.icon-email								{top:32%; font-size:3.5em; margin-left:-26%;}
			.icon-replay							{top:27%; font-size:2.3em; margin-left:-28%;}
			.icon-forward							{top:25%; font-size:1.9em; margin-left:-30%;}
		/* END BUTTONS */		
		
		
		
		/* LISTS */
			li										{font-size:1.3em; margin:0 0 12px}
		/* END LISTS */
		

		/* DIVIDERS */
		.playBar									{margin:0 0 10px}
		.whiteDivider								{margin:10px 0 15px;}

		
		/* TIMER */
			.counterContainer							{margin:0 auto 20px; width:170px; height:170px;}
			.counterContainer .numberCount				{top:50%; left:0; margin:-28px 0 0 0; padding:0; width:100%; font-size:5em;}
			
			.counterContainerSmall						{width:80px; height:80px;}
			.counterContainerSmall .numberCount			{top:50%; left:0; margin:-15px 0 0 0; padding:0; width:100%; font-size:2.7em;}
		/* END TIMER */
		
		
		
		/* INFO LEFT */
			.infoLeft								{margin:0 0 10px;}
			.infoLeft p								{margin:0 0 0.2em}
			.infoLeft p.feature						{font-size:2em}
			
			.infoLeft .singleText					{margin-top:15px}

			
			.infoLeft .icon-trophy					{font-size:2.2em; margin:0 20px 0 0}
			.infoLeft .icon-padlock-closed-black	{margin:0 20px 0 0; font-size:4em}
		/* END INFO LEFT */
		
		
		
		/* GAME SCORE */
			.gameScoreContainer p					{font-size:1.8em;}
		/* END GAME SCORE */
		
		
		/* OVERALL SCORE */
			.scoreContainer							{font-size:1.8em; padding:0 10px 1px 0;}
			.scoreContainer img						{margin:0 0 0 10px}
		/* END OVERALL SCORE */

				
				
		/* SCORE BREAKDOWN */
			.score-breakdown-container					{width:130px; height:130px; background:url(/assets/images/design/bkgnd-score-breakdown.png) 0 0 no-repeat;
														background:url(/assets/images/design/bkgnd-score-breakdown.png) 0 0 no-repeat;
														-webkit-background-size:100% 100%;
														-moz-background-size:100% 100%;
														-o-background-size:100% 100%;
														background-size:100% 100%;}
													
			.score-breakdown-container .chartContainer	{top:10px; left:-45px; width:220px!important; height:110px!important}
			.score-breakdown							{top:45px; left:0; width:100%; font-size:4em;}
		/* END SCORE BREAKDOWN */
				

		
		/* BONUS SCORE */
			.bonusScore						{width:120px; height:120px; margin:0 auto 20px; border:5px solid #fbaf5d; border-radius:400px}
			.bonusScore p					{font-size:5em;   margin:33px 0 0}
		/* END BONUS SCORE */
		
		
		
		/* SCORE CONTAINER */
			.leftScoresContainer			{width:50%}
			.scoreRow 						{margin:0 0 13px}
			.rightScoresContainer			{width:50%}
		/* END SCORE CONTAINER */
		
				
		/* GRAPH CONTAINER */		
			.graphContainer .percentage		{font-size:1.6em; line-height:1em}
			
			.left-graph-details				{top:30px; left:0; width:75px;}
			.right-graph-details			{top:30px; right:0; width:75px;}
			
			.chartContainer					{width:280px!important; height:140px!important}
		/* END GRAPH CONTAINER */		
				
		
		/* ACCOUNT ROW */	
			.accountRow	.account-detail		{width:60%; font-size:1.6em;}
			.accountRow	.account-edit		{font-size:1.7em;}
			
			.accountRow .icon-facebook		{font-size:1.5em; margin:-5px 0 0; padding:8px 4px 10px 14px}
		/* END ACCOUNT ROW */

		
		/* Toggle container */
			.toggleContainer 							{margin:-3px 0 0}
			.toggleContainer .ui-slider-switch 			{width:80px}
			div.ui-slider-switch							{border-radius:20px;}
			.ui-slider-switch .ui-slider-label			{top:1px}
			.ui-slider-inneroffset						{margin:1px 16px 0 18px}
			.ui-slider-switch .ui-btn.ui-slider-handle	{border-radius:20px}
				
		/* Equaliser */
			.eqContainer								{margin:0 0 0 15px; width:36px; height:54px; background:url(/assets/images/design/eq-static.gif) 0 100% no-repeat;}
			.eqContainer.active							{background:url(/assets/images/design/eq.gif) 0 100% no-repeat;}
		
		/* Swiper */
			.swipeContainer											{height:315px;}
			
			.swiper-left-icon-container								{bottom:5px; left:0; width:100px; height:30px;}
			.swiper-left-icon-container .icon						{font-size:1.4em;}
			.swiper-left-icon-container .icon-left-arrow-outline		{left:0; top:8px; font-size:1.4em;}
			.swiper-left-icon-container span							{font-size:0.8em;}
			
			.swiper-right-icon-container							{bottom:5px; right:0; width:100px; height:30px;}
			.swiper-right-icon-container .icon						{font-size:1.4em;}
			.swiper-right-icon-container .icon-right-arrow-outline	{right:0; top:8px; font-size:1.4em;}
			.swiper-right-icon-container span						{font-size:0.8em;}
				
		/* Yes / No button align */
			.yesNoButtonAlign										{width:100%; height:97px;}

		/* Oscillating Get Ready */
			.oscillatingGetReady						{height:207px;}
			.oscillatingGetReady p						{padding:70px 0 0; font-size:5em;}	
	}
	
	
	
	
	
	
	
	
	
	