/**

** OUTLINE **

a] GLOBALS
b] STRUCTURE
	1] header/nav
	2] body/form
	3] footer
c] IE
d] CAROUSEL
e] EXPERIMENTAL
	1] Text gradient (Webkit ONLY)		** DISABLED **

**/

/* ---- NOTE: temporary fix to COPPA block page for LOTROV approval ---- */
#sign-up-content {
	min-height: 350px;
}

/* -------------------------------------------------------- */
/* - GLOBALS ---------------------------------------------- */
/* -------------------------------------------------------- */
body {
	font: 13px Verdana, sans-serif;
}

body > section > * {
	margin: 0 auto;
	width: 1025px;
}

body, select, input, textarea {
	color: #333;
}

a {color:#1E6594;}

body > * {
	float: left;
	width: 100%;
}

/* Custom text-selection colors (remove any text shadows: twitter.com/miketaylr/status/12228805301) */
::-moz-selection {background: #fcd700; color: #fff; text-shadow: none;}
::-webkit-selection {background: #fcd700; color: #fff; text-shadow: none;}
::selection {background: #fcd700; color: #fff; text-shadow: none;}

/* hides placeholder text when field is active */
::-webkit-input-placeholder  { color: transparent !important; }
input:-moz-placeholder { color: transparent !important; }

a:link {
	-webkit-tap-highlight-color: #fcd700;
} 

ins {
	background-color: #fcd700; 
	color: #000; 
	text-decoration: none;
}

mark {
	background-color: #fcd700; 
	color: #000; 
	font-style: italic; 
	font-weight: bold;
}

h2, h3, h4, q { /*h1,  */
	text-shadow: 0 0 3px #000, 0 0 4px #000, 0 0 5px #000, 0 0 6px #000;
	color: #f2f0b8;
	filter: progid:DXImageTransform.Microsoft.Chroma(Color=#000000)
		progid:DXImageTransform.Microsoft.Glow(Strength=5, Color=#000000);
	font-family: Georgia, serif;
	font-variant: small-caps;
}



h1 {
	font-size:3.175em;
}

html[lang="de"] h1 {
  font-size: 2.65em;
}

h2 {
	font-size: 2.35em;
	text-align: center;
	line-height: 70px;
	width: 100%;
	/* float: left; */
	position: relative;
}

html[lang="fr"] h2,
html[lang="de"] h2 {
	line-height: 30px;
	margin: .6em 0;
}

html[lang="fr"] h2 {
	font-size: 2em;
}

h3 {
	font-size:2.5em;
	color:#f2f0b8;
}

h4 {
	font-size: 2.2em;
	line-height: 70px;
	font-weight: 700;
}

q {
	font-size: 2.2em;
	line-height: .9em;
	font-weight: 700;
	display:block;
	text-align: left;
	color: #EEEEEE;
}

cite {
	font-size: .7em;
}

/* - STRUCTURE -------------------------------------------- */

/* -------------------------------------------------------- */
/* - HEADER/NAV ------------------------------------------- */
/* -------------------------------------------------------- */
nav {
	background: #0E1342; /* older browsers */
	background-image: linear-gradient(bottom, #1D253F 44%, #0E1324 72%);
	background-image: -o-linear-gradient(bottom, #1D253F 44%, #0E1324 72%);
	background-image: -moz-linear-gradient(bottom, #1D253F 44%, #0E1324 72%);
	background-image: -webkit-linear-gradient(bottom, #1D253F 44%, #0E1324 72%);
	background-image: -ms-linear-gradient(bottom, #1D253F 44%, #0E1324 72%);
	background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0.44, #1D253F), color-stop(0.72, #0E1324));
	height: 26px;
	border-bottom: 1px solid #ffcc00;
	position: relative;
	z-index: 1000;
}

ul#flags li {
	float: left;
}

ul#flags li a {
	display: block;
	width: 24px;
	height: 14px;
	background: url(../images/flags/flags.jpg) no-repeat;
	text-indent: -9999px;
	margin: 6px 5px 0;
}

ul#flags a#en-us {background-position: 0 0;}
ul#flags a#en-gb {background-position: 0 -14px;}
ul#flags a#en-au {background-position: 0 -28px;}
ul#flags a#fr-fr {background-position: 0 -42px;}
ul#flags a#de-de {background-position: 0 -56px;}

nav > a { 
	text-decoration: none;
	float: right;
	line-height: 26px;
	font-size: .9em;
	margin-right: 5px;
	color: #fc3;
}

nav > a:hover {
	text-decoration: underline;
}

section#page-mid > * {
	position: relative;
	background: url(../images/logo-awards.png);
	background-repeat: no-repeat;
	background-size: 50%;
	background-position: left bottom;
}

header {
	/* display: table; */
}

header > a {
	position: absolute;
	left: 0;
	top: 20px;
	pointer-events: auto;
	display: block;
	width: 350px;
	height: 148px;
	background-image: url(../images/logo.png);
	background-repeat: no-repeat;
}

html[lang='fr'] header > a {
	background-image: url(../images/fr-FR/logo.png);
}

html[lang='de'] header > a {
	background-image: url(../images/de-DE/logo.png);
}

header img {
	display: block;
	margin-top:15px;
}

header h1 {
	float: right;
	position: relative;
	z-index: 1000;
	width: 55%;
	line-height: 1em;
	padding: 30px 0;
	padding-left: 50px;
	overflow: visible;
}

header h1 > span {
	margin: 20px 0 25px;
	float: left;
}

header h1 > strong {
	font-size: 1.2em;
	float: right;
}

html[lang="de"] header h1 > strong {
	font-size: 1em;
}

html[lang="fr"] header h1 > strong {
	font-size: .7em;
}

.divider-line {
	padding-left: 10px;
  margin: 10px auto;
}

#heading_download {
	margin-top: 10px;
}

#headtext {
	text-align: center;
	padding: 0;
	position: relative;
	display: block;
	border: none;
	outline: none;
	right: -40px;
	bottom: -40px;
  margin: 0 auto;
  padding-right: 40px;
}

html[lang="fr"] #headtext {
	bottom: -30px;
}

/* -------------------------------------------------------- */
/* - BODY/FORM -------------------------------------------- */
/* -------------------------------------------------------- */
#sign-up-content {
	margin: 0 auto;
	width: 1025px;
	position: relative;
	padding: 10px;
	overflow: hidden;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	clear:both;
}

#formtext {
	width: 100%;
	display: block;
	border: none;
	outline: none;
	/*height: 60px;*/
	text-align: center;
	padding: 0;
	position: relative;
}

#quote-wrapper {
	position: absolute;
	z-index: 10;
	bottom: 250px;
	left: 1%;
	width: 50%;
}

q > cite {
	float: right;
	font-style: normal;
	padding-right: 20px;
}

html[lang="fr"] q {
    font-size: 2em;
}

html[lang="de"] q {
   font-size: 2em;
}

aside {
	border: 4px solid #52555c;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px;
	-moz-box-shadow: 0 0 1px 1px rgba(255,255,255,.8) inset, 0 0 8px 2px rgba(0,0,0,1);
	-webkit-box-shadow: 0 0 1px 1px rgba(255,255,255,.8) inset, 0 0 8px 2px rgba(0,0,0,1);
	box-shadow: 0 0 1px 1px rgba(255,255,255,.8) inset, 0 0 8px 2px rgba(0,0,0,1);
	float: right;
	width: 40%;
	position:relative;
	z-index:50;
	right:50px;
}

aside > div#aside-inner {
	background: url(../images/form-texture.png) 0 0;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	padding: 0 12% 5%;
	float: left;
	min-height: 300px;
}

hr.faded {
	background-image: -webkit-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.75), rgba(0,0,0,0));
	background-image: -moz-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.75), rgba(0,0,0,0));
	background-image: -ms-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.75), rgba(0,0,0,0));
	background-image: -o-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.75), rgba(0,0,0,0)); 
}

form div[id^="c_"],
form div[id^="c_"] > div {
	position: relative;
	width: 100%;
}

#addthis_button_block {
  text-align: center;
  margin-top: 1.2em;
}

hr.faded {
	margin: .2em 0 1.2em;
	border: none;
	border: 0;
}

input[type="text"],
input[type="password"],
select {
	/* NOTE: Chrome browser does not render an rgba opacity correctly for <select> fields on PC's */
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	padding-left: 10px;
	-moz-box-shadow: 1px 1px 2px 2px rgba(0,0,0,.5) inset, 0 0 1px 1px rgba(255,255,255,.4);
	-webkit-box-shadow: 1px 1px 2px 2px rgba(0,0,0,.5) inset, 0 0 1px 1px rgba(255,255,255,.4);
	box-shadow: 1px 1px 2px 2px rgba(0,0,0,.5) inset, 0 0 1px 1px rgba(255,255,255,.4);
	background: rgba(0,0,0,.7);
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	height: 30px;
	/* line-height: 30px; Was causing a placeholder text alignment issue in Webkit browsers on text/password fields. Migrated style to target only select fields */
	margin-bottom: 1em;
	color: #FFF;
	border: none;
	font-weight: 700;
}

input[type="text"],
input[type="password"] {
	width: 100%;
}

input.pw-hide[type="text"] {
	position: absolute; 
	left: 0; 
	top: 0; 
	background: none; 
	border: none;
	-moz-box-shadow: none;
	-webkit-box-shadow: none;
	box-shadow: none;
}

.no-js input.pw-hide[type="text"] {
	display: none;
}

input.error,
select.error {
	border: 1px solid red;
}

input[type="checkbox"].error {
	outline: 2px solid red;
}

select {
	width: 32%;
	margin-left: 2%;
	padding: 4px 5px 3px 5px;
	overflow: hidden;
	text-overflow: ellipsis;
	line-height: 30px;
	background-color: #333;
}

/*#coppa > select:first-child {
	margin-left: 0;
}*/

#coppa > select:first-of-type {
	margin-left: 0;
}

#c_tos > div {
    position: absolute;
}

.chk-wrap {
	float: left;
	margin-bottom: 1em;
}

.chk-wrap > div { /* fixes layout issue related to extra 'error' divs around checkboxes */
	float: left;
}

label {
	width: 90%;
	float: right;
	display: inline;
	font-size: .85em;
	color: #000;
}

button,
button > span {
	background: url(../images/btn-bg-lotro-form.png) no-repeat 0 0;
}

a.btn-success {
	margin-top: 2em;
}

a.btn-success,
a.btn-success > span {
	background: url(../images/btn-bg-lotro-form-success.png) no-repeat 0 0;
}

button,
a.btn-success {
	width: 100%;
	display: block;
	border: none;
	outline: none;
	height: 75px;
	text-align: center;
	padding: 0;
	position: relative;
	left: -5px;
	text-decoration: none;
}

button > span,
a.btn-success > span {
	/* position: absolute; This was breaking old versions of FF ... weird */
	position: relative;
	display: block;
	left: 0;
	top: 0;
	height: 75px;
	width: 100%;
	padding-right: 10px;
	background-position: 100% -150px;
	-moz-box-shadow: 0 0 5px 5px rgba(0,0,0,.3);
	-webkit-box-shadow: 0 0 5px 5px rgba(0,0,0,.3);
	box-shadow: 0 0 5px 5px rgba(0,0,0,.3);
	border-radius: 6px;
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px;
	text-indent: 10px;
}

button:hover,
a.btn-success:hover {
	background-position: 0 -75px;
	cursor: pointer;
}

button:hover > span,
a.btn-success:hover > span {
	background-position: 100% -225px;
}

button:hover h4,
a.btn-success:hover h4 {
	color: #fffed6;
}

html[lang="de"] h4{
	line-height: 20px;
	padding-top: .6em;
	font-size: 2em;
}

html[lang="fr"] h4{
	line-height: 20px;
	padding-top: .7em;
	font-size: 1.6em;
}

noscript p {
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	width: 100%;
	background: #8D2B24;
	color: #CCCCCC;;
	padding: 1em;
	margin: 0 0 1em 0;
	text-align: center;
	border: 2px solid #4B1512;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	-moz-box-shadow: 0 0 2px 0 rgba(255, 255, 255, 0.25) inset, 0 0 2px 1px rgba(255, 255, 255, 0.5);
	-webkit-box-shadow: 0 0 2px 0 rgba(255, 255, 255, 0.25) inset, 0 0 2px 1px rgba(255, 255, 255, 0.5);
	box-shadow: 0 0 2px 0 rgba(255, 255, 255, 0.25) inset, 0 0 2px 1px rgba(255, 255, 255, 0.5);
}

/* -------------------------------------------------------- */
/* - FOOTER ----------------------------------------------- */
/* -------------------------------------------------------- */
#footer-wrap {
	position: relative;
	z-index: 1;
}

/* #footer-wrap::before {
	width: 1125px;
	height: 150px;
	background: url(../images/logo-awards.png) no-repeat left 50%;
	content: "";
	display: block;
	margin: 0 auto;
} */

#ie8-logo-awards {
	display: none;
}

.ie8 #footer-wrap::before {
	display: none;
}

.ie8 #ie8-logo-awards {
	display: block;
        text-align: center;
}

.ie8 section#page-mid > * {
	background: none;
}

.ie8 figure img#img {
	display: none;
}

footer{
	color: #666;
	font-size: 70%;
	text-align: justify;
	margin: 0 auto;
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
}

footer ul {
	text-align: center;
	padding-bottom: 1.7em;
	margin-top: 4em;
}

footer ul li {
	display: inline;
}

footer > div {
	display: table;
}

footer li a {
	margin: 0 .7em;
}

footer  p,
footer figure {
	display: table-cell;
	vertical-align: top;
}

footer p {
	padding: 0 20px;
	color: #CCCCCC;
}

footer figure#one::after {
	width: 70px;
	height: 1px;
	display: inline-block;
	content: '';
}

footer figure#rating::after {
	width: 210px;
	height: 1px;
	display: inline-block;
	content: '';
}

footer figure:first-of-type {
	text-align: right;
	float: left;
}

footer img#one {display: inline-block;}
img#img3 {display: none;}

footer figure:first-of-type img {
	display: none;
}

footer figure img {
	margin-bottom: 2em;
}

/* -------------------------------------------------------- */
/* - IE --------------------------------------------------- */
/* -------------------------------------------------------- */
.ie9 h4,
.ie8 h4 {
	line-height: 62px;
}

.ie8 aside {
	/* NOTE: The filter works in IE, but won't allow elements to display outside of the filtered area (pop ups/etc.) that live inside of an element contained in the filter
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#77787b', endColorstr='#e0e0e0',GradientType=1 ); /* IE6-8 fallback on horizontal gradient */

	background: #C9CACF;
	border: 3px solid #000;
}

.ie hr {
	border-top: 1px solid #666;
}

.ie8 input[type="text"],
.ie8 input[type="password"],
.ie8 select {
	background: #3d3e43;
	border: 2px solid black;
	color: #FFF;
	line-height: auto; /* line-height doesn't play nice with form fields in IE */
	padding-top: 5px; /* centers text vertically in older IE */
}

.ie8 select {
	width:30%;
}

.ie8 .chk-wrap > input[type="checkbox"] {
	float: left;
}

.ie9 button > span, a.btn-success > span {
  top: -1px;
    }

@-moz-document url-prefix() {
      button > span, a.btn-success > span {
      top: -1px;
      }
    }


/* -------------------------------------------------------- */
/* - CAROUSEL --------------------------------------------- */
/* -------------------------------------------------------- */
section#slideshow {
	display:none;
	height: 420px;
	position: relative;
}

.loading {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 88px;
	height: 73px;
	margin-left: -44px;
	margin-top: -36px;
}

.loading > * {
	background: url(../images/turbine-loader-sprite.png) no-repeat 0 0;
	position: absolute;
	width: 100%;
	height: 100%;
	opacity: 1;
}

.loading > span {
	height: auto;
	padding-top: 73px;
	font-weight: 700;
	color: #FFF;
	-webkit-animation: 	loadingOuter 1.5s infinite;
	-moz-animation: 		loadingOuter 1.5s infinite;
	-o-animation: 			loadingOuter 1.5s infinite;
	animation: 					loadingOuter 1.5s infinite;
}

.loading > span > span {
	position: absolute;
	width: 200px;
	left: -50px;
	top: 110%;
	text-align: center;
}
.loading > div {
	-webkit-animation: 	loadingBlade 0.7s infinite;
	-moz-animation: 		loadingBlade 0.7s infinite;
	-o-animation:	 			loadingBlade 0.7s infinite;
	animation: 					loadingBlade 0.7s infinite;
}

.loading > span {
	background-position: 100% 0;
}

.loading > div:nth-child(1) {
	background-position: 0 0;
	-webkit-animation-delay: 0s;
	-moz-animation-delay: 0s;
	-o-animation-delay: 0s;
	animation-delay: 0s;
}

.loading > div:nth-child(2) {
	background-position: -88px 0;
	-webkit-animation-delay: 0.1s;
	-moz-animation-delay: 0.1s;
	-o-animation-delay: 0.1s;
	animation-delay: 0.1s;
}

.loading > div:nth-child(3) {
	background-position: -176px 0;
	-webkit-animation-delay: 0.2s;
	-moz-animation-delay: 0.2s;
	-o-animation-delay: 0.2s;
	animation-delay: 0.2s;
}

.loading > div:nth-child(4) {
	background-position: -264px 0;
	-webkit-animation-delay: 0.3s;
	-moz-animation-delay: 0.3s;
	-o-animation-delay: 0.3s;
	animation-delay: 0.3s;
}

.loading > div:nth-child(5) {
	background-position: -352px 0;
	-webkit-animation-delay: 0.4s;
	-moz-animation-delay: 0.4s;
	-o-animation-delay: 0.4s;
	animation-delay: 0.4s;
}

.loading > div:nth-child(6) {
	background-position: -440px 0;
	-webkit-animation-delay: 0.5s;
	-moz-animation-delay: 0.5s;
	-o-animation-delay: 0.5s;
	animation-delay: 0.5s;
}

.loading > div:nth-child(7) {
	background-position: -528px 0;
	-webkit-animation-delay: 0.6s;
	-moz-animation-delay: 0.6s;
	-o-animation-delay: 0.6s;
	animation-delay: 0.6s;
}

.loading > div:nth-child(8) {
	background-position: -616px 0;
	-webkit-animation-delay: 0.7s;
	-moz-animation-delay: 0.7s;
	-o-animation-delay: 0.7s;
	animation-delay: 0.7s;
}

@-webkit-keyframes loadingOuter { 0% {opacity: 0.5;} 50% {opacity: 1;} 100% {opacity: 0.5;} }
@-moz-keyframes loadingOuter 		{ 0% {opacity: 0.5;} 50% {opacity: 1;} 100% {opacity: 0.5;} }
@-o-keyframes loadingOuter 			{ 0% {opacity: 0.5;} 50% {opacity: 1;} 100% {opacity: 0.5;} }
@keyframes loadingOuter					{ 0% {opacity: 0.5;} 50% {opacity: 1;} 100% {opacity: 0.5;} }

@-webkit-keyframes loadingBlade { 0% {opacity: 0;} 50% {opacity: 0.8;} 100% {opacity: 0;} }
@-moz-keyframes loadingBlade 		{ 0% {opacity: 0;} 50% {opacity: 0.8;} 100% {opacity: 0;} }
@-o-keyframes loadingBlade 			{ 0% {opacity: 0;} 50% {opacity: 0.8;} 100% {opacity: 0;} }
@keyframes loadingBlade					{ 0% {opacity: 0;} 50% {opacity: 0.8;} 100% {opacity: 0;} }

ul#screenshot_container {
  height:250px;
  width:459px;
	position: relative;
}

ul#screenshot_container > li {
	position: absolute;
	top: 0;
	left: 0;
}

ul#screenshot_container a {
	position: absolute;
	z-index: 1;
	display: block;
	height: 100%;
	width: 100%;
	top: 0;
	left: 0;
}

ul#screenshot_container img {
	position: relative;
	z-index: 2;
	-webkit-box-reflect: below 0px -webkit-gradient(linear, left top, left bottom, from(transparent), color-stop(50%, transparent), to(rgba(0,0,0,.2)));	
}

.screenshots-box {
	width: 459px;
	height:	250px;
	margin: 50px auto 3px;
	display: none;
	min-height: 250px;
}

.no-js .screenshots-box {
	display: none;
}

a#prev {
	background:url('../images/back.png') top left no-repeat;
	height:95px;
	width:50px;
	text-indent:-999999px;
	overflow: hidden;
	display:block;
	position: relative;
	top:-160px;
	left:-75px;
	z-index: 500;
}

a#advance {
	background:url('../images/forward.png') top left no-repeat;
	height:95px;
	width:50px;
	text-indent:-999999px;
	overflow: hidden;
	display:block;
	position: relative;
	top:-252px;
	right:-475px;
	z-index:500;
}

.hidden {
	display: none;
	visibility: hidden;
	width: 0px;
	height: 0px;
}

#screenshot-call h4 {
  text-align: center;
}

#month {
	margin-right: 3px;
}

#year {
	margin-left: 3px;
}

.chk-wrap .checkbox_field > div {
	float: left;
	width: auto;
}

.checkbox_field input {
	border: medium none;
	margin: 1px;
	padding: 0;
	width: auto;
}

.checkbox_field {
	margin-top: 10px;
	width: 280px;
}

.on {
	display: block;
}

.off {
	display: none;
}

div.error {
	border: 1px solid #CC0033 !important;
}

div.noerror {
	padding: 1px;
}

#overlay {
	background: url("../images/overlay.png") repeat scroll 0 0 transparent;
	height: 100%;
	left: 0;
	position: absolute;
	top: 0;
	width: 100%;
	display:none;
	
}

a.tip-control {
	bottom: 16px;
	display: none;
	float: left;
	left: -24px;
	position: absolute;
	z-index: 100;
	height: 21px;
	width: 21px;
	background: url(../images/error.png) no-repeat 0 0;
}

a.tip-control.error {
	display: block;
}

#c_tos > div,
#c_foreign_consent > div,
#c_receive_email > div {
	position: absolute;
}

div[id^="c_"] label {
	position: relative;
	z-index: 1;
}

#c_tos > div > div:first-child {
	float: left;
}

#c_foreign_consent a.tip-control.error,
#c_tos a.tip-control.error,
#c_receive_email a.tip-control.error {
	top: 0;
}

.tooltip::before {
	border-color: #CC0033 transparent;
	border-style: solid;
	border-width: 18px 20px 0 0;
	content: "";
	display: block;
	position: absolute;
	right: -21px;
	top: 5px;
	width: 0;
}

.tooltip {
	background: none repeat scroll 0 0 #262626;
	border: 1px solid #CC0033;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	-moz-box-shadow: 0 0 1px 1px rgba(255,255,255,.3) inset, 0 0 10px 0 rgba(0,0,0,1);
	-webkit-box-shadow: 0 0 1px 1px rgba(255,255,255,.3) inset, 0 0 10px 0 rgba(0,0,0,1);
	box-shadow: 0 0 1px 1px rgba(255,255,255,.3) inset, 0 0 10px 0 rgba(0,0,0,1);
	color: #CC0033;
	padding: 1em;
	position: absolute;
	left: -100%;
	top: 0;
	width: 100%;
	margin-left: -70px;
	margin-top: 15px;
	display: none;
}

.tooltip::after {
	border-color: #262626 transparent;
	border-style: solid;
	border-width: 18px 20px 0 0;
	content: "";
	display: block;
	position: absolute;
	right: -18px;
	top: 6px;
	width: 0;
}

.tooltip strong {
	font-size: 1em;
	color: #CC0033;
	text-shadow: none;
}

table, td, th {
	border-collapse: collapse;
}

#header {
	display: block;
	margin: 0 auto 20px;
	padding-top: 25px;
}

p {
	margin: 0 1.2em 1.2em;
}

p#not-eligible::before {
	position: absolute;
	top: 0;
	left: -40px;
	content: "";
	font-size: 2em;
	text-align: center;
	line-height: 30px;
	height: 30px;
	width: 30px;
	-moz-border-radius: 15px;
	-webkit-border-radius: 15px;
	border-radius: 15px;
	-moz-box-shadow: 0 0 5px 2px rgba(0,0,0,.4);
	-webkit-box-shadow: 0 0 5px 2px rgba(0,0,0,.4);
	box-shadow: 0 0 5px 2px rgba(0,0,0,.4);
	border: 1px solid rgba(255,255,255,.2);
	background: #f7ed31;
	background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIxJSIgc3RvcC1jb2xvcj0iI2Y3ZWQzMSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNlZmJlODEiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
	background: -moz-linear-gradient(top,  #f7ed31 1%, #efbe81 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(1%,#f7ed31), color-stop(100%,#efbe81));
	background: -webkit-linear-gradient(top,  #f7ed31 1%,#efbe81 100%);
	background: -o-linear-gradient(top,  #f7ed31 1%,#efbe81 100%);
	background: -ms-linear-gradient(top,  #f7ed31 1%,#efbe81 100%);
	background: linear-gradient(to bottom,  #f7ed31 1%,#efbe81 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f7ed31', endColorstr='#efbe81',GradientType=0 );
}

p#not-eligible::after {
	position: absolute;
	top: 3px;
	left: -37px;
	content: "!";
	color: red;
	font-size: 1.5em;
	text-shadow: 1px 1px 0 yellow;
	text-align: center;
	line-height: 24px;
	height: 24px;
	width: 24px;
	border-radius: 12px;
	border: 1px solid rgba(0,0,0,.2);
	background: #efbe81;
	background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2VmYmU4MSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9Ijk5JSIgc3RvcC1jb2xvcj0iI2Y3ZWQzMSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgPC9saW5lYXJHcmFkaWVudD4KICA8cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2dyYWQtdWNnZy1nZW5lcmF0ZWQpIiAvPgo8L3N2Zz4=);
	background: -moz-linear-gradient(top,  #efbe81 0%, #f7ed31 99%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#efbe81), color-stop(99%,#f7ed31));
	background: -webkit-linear-gradient(top,  #efbe81 0%,#f7ed31 99%);
	background: -o-linear-gradient(top,  #efbe81 0%,#f7ed31 99%);
	background: -ms-linear-gradient(top,  #efbe81 0%,#f7ed31 99%);
	background: linear-gradient(to bottom,  #efbe81 0%,#f7ed31 99%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#efbe81', endColorstr='#f7ed31',GradientType=0 );

}

p#not-eligible {
	margin: 1.2em;
	font-weight: 700;
	position: relative;
}

#high_res {
	display: block;
	margin: 20px auto;
}

.std_res {
	display: block;
	margin: 10px auto;
	visibility: hidden;
    height: 85px;
}

.download-button,
.upsell-button {
	display: block;
	margin: 0 auto;
	visibility: hidden;
    height: 85px;
}

a#pc-download-button-en-US {
  visibility: visible;
  background:url(../images/en-US/btn_download_pc_en_off.png) no-repeat top; 
  height:85px; 
  width:280px;
}

a#pc-download-button-en-US:hover {
  background-position: 0 -86px;
}

a#mac-download-button-en-US {
  visibility: visible;
  background:url(../images/en-US/btn_download_mac_en_off.png) no-repeat top; 
  height:85px; 
  width:280px;
}

a#mac-download-button-en-US:hover {
  background-position: 0 -86px;
}

a#pc-download-button-en-GB {
  visibility: visible;
  background:url(../images/en-GB/btn_download_pc_en_off.png) no-repeat top; 
  height:85px; 
  width:280px;
}

a#pc-download-button-en-GB:hover {
  background-position: 0 -86px;
}

a#mac-download-button-en-GB {
  visibility: visible;
  background:url(../images/en-GB/btn_download_mac_en_off.png) no-repeat top; 
  height:85px; 
  width:280px;
}

a#mac-download-button-en-GB:hover {
  background-position: 0 -86px;
}

a#pc-download-button-en-AU {
  visibility: visible;
  background:url(../images/en-AU/btn_download_pc_en_off.png) no-repeat top; 
  height:85px; 
  width:280px;
}

a#pc-download-button-en-AU:hover {
  background-position: 0 -86px;
}

a#mac-download-button-en-AU {
  visibility: visible;
  background:url(../images/en-AU/btn_download_mac_en_off.png) no-repeat top; 
  height:85px; 
  width:280px;
}

a#mac-download-button-en-AU:hover {
  background-position: 0 -86px;
}

a#pc-download-button-fr-FR {
  visibility: visible;
  background:url(../images/fr-FR/btn_download_pc_fr_off.png) no-repeat top; 
  height:85px; 
  width:280px;
}

a#pc-download-button-fr-FR:hover {
  background-position: 0 -86px;
}

a#mac-download-button-fr-FR {
  visibility: visible;
  background:url(../images/fr-FR/btn_download_mac_fr_off.png) no-repeat top; 
  height:85px; 
  width:280px;
}

a#mac-download-button-fr-FR:hover {
  background-position: 0 -86px;
}

a#pc-download-button-de-DE {
  visibility: visible;
  background:url(../images/de-DE/btn_download_pc_de_off.png) no-repeat top; 
  height:85px; 
  width:280px;
}

a#pc-download-button-de-DE:hover {
  background-position: 0 -86px;
}

a#mac-download-button-de-DE {
  visibility: visible;
  background:url(../images/de-DE/btn_download_mac_de_off.png) no-repeat top; 
  height:85px; 
  width:280px;
}

a#mac-download-button-de-DE:hover {
  background-position: 0 -86px;
}

a#learn-more-button-en-US {
  visibility: visible;
  background:url(../images/en-US/btn-learn-more-en.png) no-repeat top; 
  height:85px; 
  width:280px;
}

a#learn-more-button-en-US:hover {
  background-position: 0 -86px;
}

a#learn-more-button-en-GB {
  visibility: visible;
  background:url(../images/en-GB/btn-learn-more-en.png) no-repeat top; 
  height:85px; 
  width:280px;
}

a#learn-more-button-en-GB:hover {
  background-position: 0 -86px;
}

a#learn-more-button-en-AU {
  visibility: visible;
  background:url(../images/en-AU/btn-learn-more-en.png) no-repeat top; 
  height:85px; 
  width:280px;
}

a#learn-more-button-en-AU:hover {
  background-position: 0 -86px;
}

a#learn-more-button-fr-FR {
  visibility: visible;
  background:url(../images/fr-FR/btn-learn-more-fr.png) no-repeat top; 
  height:85px; 
  width:280px;
}

a#learn-more-button-fr-FR:hover {
  background-position: 0 -86px;
}

a#learn-more-button-de-DE {
  visibility: visible;
  background:url(../images/de-DE/btn-learn-more-de.png) no-repeat top; 
  height:85px; 
  width:280px;
}

a#learn-more-button-de-DE:hover {
  background-position: 0 -86px;
}


#waiting_queue {
	margin: 30px auto;
}

p.info {
	color: #FFFFFF;
	font-size: 12px;
	margin: 10px 20px;
	text-align: center;
}

p.offer-title {
	margin: 1.2em;
}

ul.offer-info {
  margin: 0 auto;
  width: 75%;
  padding-left: 25px;
}

.de-DE ul.offer-info,
.fr-FR ul.offer-info {
  width: 85%;
  padding-left: 25px;
}

ul.offer-info li {
  list-style: disc;
	font-weight: bold; 
}

#signup_type_add, #signup_type_create {
	border: medium none;
	margin: auto;
	padding-bottom: 5px;
	padding-top: 8px;
}

#append_subscription {
	padding-bottom: 5px;
	padding-top: 5px;
}

#signup_append_subheading {
	color: #DAA84A;
	font-size: 12px;
	margin: 2px auto;
	padding-bottom: 10px;
	text-align: center;
	width: 190px;
}

#signup_append_error {
	color: #CC0033;
	font-size: 12px;
	margin: 2px auto;
	padding-bottom: 10px;
	text-align: center;
	width: 190px;
}

/* hide date picker */
div[id="ui-datepicker-div"] {
	display: none;
}

/* -------------------------------------------------------- */
/* - EXPERIMENTAL ----------------------------------------- */
/* -------------------------------------------------------- */
/**
	The following styles target Webkit Browsers ONLY.
	With proper mirroring of text on the page, the styles
	create a gradient effect on the text strings.
**/
/*
@media screen and (-webkit-min-device-pixel-ratio:0) {
	h1::before,
	h1 > strong::before,
	h2::before,
	q::before,
	q > cite::before,
	h4::before {
		text-shadow: none;
		display: block;
		position: absolute;
		font-size: 1em;
	}
	
  h1::before {
		content: 'A New Hour Comes.';
		background: -webkit-gradient(linear, left top, left bottom, from(#ec8d32), color-stop(0.12, #ec8d32), color-stop(0.3, #f2f0b8), color-stop(0.6, #f2f0b8), color-stop(0.9, #ec8d32));
  	-webkit-background-clip: text;
	  -webkit-text-fill-color: transparent;
	}

	h1 > strong::before {
		content: 'Battle is at Hand!';
		background: -webkit-gradient(linear, left top, left bottom, from(#ec8d32), color-stop(0.05, #ec8d32), color-stop(0.3, #f2f0b8), color-stop(0.7, #f2f0b8), color-stop(0.9, #ec8d32));
		-webkit-background-clip: text;
	  -webkit-text-fill-color: transparent;
	}
	
	h2::before {
		content: 'Play Free Now!';
		background: -webkit-gradient(linear, left top, left bottom, from(#ec8d32), color-stop(0.3, #ec8d32), color-stop(0.5, #f2f0b8), color-stop(0.6, #f2f0b8), color-stop(0.7, #ec8d32));
		-webkit-background-clip: text;
	  -webkit-text-fill-color: transparent;
		text-align: center;
		width: 100%;
	}
	
	q::before {
		content: '\201C\2026 A Sublime MMO Experience.\201D';
		background: -webkit-gradient(linear, left top, left bottom, from(#ec8d32), color-stop(0.15, #ec8d32), color-stop(0.4, #f2f0b8), color-stop(0.7, #f2f0b8), color-stop(0.9, #ec8d32));
		-webkit-background-clip: text;
	  -webkit-text-fill-color: transparent;
	}
	
	q > cite::before {
		content: '\2013\0020 GameSpy';
		background: -webkit-gradient(linear, left top, left bottom, from(#ec8d32), color-stop(0.2, #ec8d32), color-stop(0.4, #f2f0b8), color-stop(0.6, #f2f0b8), color-stop(0.8, #ec8d32));
		-webkit-background-clip: text;
	  -webkit-text-fill-color: transparent;
		float: right;
	}
	
	button h4::before {
		content: 'Sign Up Today';
		background: -webkit-gradient(linear, left top, left bottom, from(#ec8d32), color-stop(0.3, #ec8d32), color-stop(0.5, #f2f0b8), color-stop(0.6, #f2f0b8), color-stop(0.7, #ec8d32));
		-webkit-background-clip: text;
	  -webkit-text-fill-color: transparent;
		text-align: center;
		width: 100%;
		text-indent: -10px;
	}
}
*/



#rotating-item-wrapper {
	  position: relative;
	  width:500px;
	}
  .rotating-item {
		display: none;
		position: absolute;
		width:100%;
		text-align: center;
	}