@charset "utf-8"; 

html,
.page { height: 100%; background: #000 url("/account/static/images/lightweight-account-creation/background.00QQK.jpg") 50% 0 no-repeat; background-size: 2048px 1536px; }
body { height: 100%; margin: 0; padding: 0; font-family: Arial, Helvetica, sans-serif }
a { outline: none; text-decoration: none; color: #055A76 }
a:hover,
a:focus { text-decoration: underline }
img { border: none }
table { padding: 0; margin: 0; border-spacing: 0; border-collapse: collapse }

input[type="submit"]::-moz-focus-inner { border: 0; }

/*page wrapper*/
.minWidth { width: 1276px; height: 1px; border: 1px solid blue }
.positionWrapper { width: 1276px; margin: 0 auto; min-height: 810px; }
.page { width: 1276px; min-height: 700px; position: absolute; }

/*utility*/
.clear { clear: both }
.relative { position: relative }
#blackout { background: url("../../local-common/images/opacity-black.2R9Al.png"); height: 100%; width: 100%; position: fixed; z-index: 10; top: 0; left: 0; display: none }
.hiddenSubmit { width: 0; height: 0; border: none; margin: 0; padding: 0; line-height: 0; font-size: 1px }
img.blank { width: 1px; height: 1px; float: left }

/*video popup*/
#flashContainer { position: absolute; z-index: 11; width: 848px; border: 1px solid #222; background-color: #000; padding: 20px; display: none; height: 390px }
#flashContainer a.close { z-index: 30; display: block; position: absolute; right: 4px; top: 3px; width: 15px; height: 15px; background: url("/account/static/images/lightweight-account-creation/close.4dvLD.jpg") no-repeat }
#flashContainer a.close:hover,
#flashContainer a.close:focus { background-position: 0 -15px }
#videoCover { position: absolute; top: 0; left: 0; background-color: #000; width: 848px; height: 390px; z-index: 2; float: left }
#flashVideo { width: 848px; height: 390px; margin: 0 auto; z-index: 1; border: 1px solid #000 }
.requiresFlash { padding: 150px 0 0 0; width: 848px; text-align: center; color: #EEE }
.requiresFlash a { text-decoration: underline }

/* left col*/
.leftColumn { min-height: 700px; width: 600px; float: left }
img.signUp { width: 471px; height: 144px; margin: 0 0 0 125px }
div.gameWorld { background-repeat: no-repeat; width: 638px; height: 63px; position: relative; top: 416px; left: 1px; background-position: 139px 0 }
a.watchCinematic { display: block; width: 179px; height: 50px; background-repeat: no-repeat; position: relative; top: 416px; left: 182px }
a.watchCinematic:hover,
a.watchCinematic:focus { background-position: 0 -50px }
a.watchCinematic a.linkCover { display: block; width: 179px; height: 50px; position: absolute; top: 0; left: 0; z-index: 1 }
#cinematicIcon { display: block; width: 43px; height: 37px; position: relative; top: 7px; left: 8px; cursor: pointer; background: url("/account/static/images/lightweight-account-creation/cinematic-button.0DpPA.jpg") no-repeat }
a.learnMore { display: block; width: 179px; height: 50px; background-repeat: no-repeat; position: relative; top: 366px; left: 379px }
a.learnMore:hover,
a.learnMore:focus { background-position: 0 -50px }

/*right column*/
.rightColumn { min-height: 700px; width: 638px; float: left; }
.rightColumn h1.formHeader { color: #065979; letter-spacing: -1px; margin: 0 0 0 18px; text-align: center; width: 390px; }
.rightColumn p.formSubheader { font-size: 12px; color: #691304; margin: 2px 0 0 22px; padding: 0; font-weight: bold; width: 350px; }
.rightColumn p.simpleHeader { margin-bottom: 20px; margin-top: 10px; font-size: 16px; width: 305px; font-weight: bold; padding: 0 25px; }


/* top login */
.topLogin { height: 30px; position: relative; right: 200px; margin: 37px 0 0 0; border: 1px solid #693025; color: #bfc2b9; font-size: 11px; float: right; text-align: right; background: url("/account/static/images/lightweight-account-creation/top-login-bg.1bFTO.jpg") no-repeat }
.topLogin td.left { padding: 0 0 0 10px; line-height: 30px; white-space: nowrap }
.topLogin td.right { padding: 0 10px 0 0 }
a.signIn { background: url("/account/static/images/lightweight-account-creation/small-button-left.4Ye0S.gif") no-repeat; display: block; height: 20px; line-height: 20px; padding: 0 0 0 7px; float: right; margin: 0 0 0 5px }
a.signIn span { background: url("/account/static/images/lightweight-account-creation/small-button-right.0QRSa.gif") 100% 0 no-repeat; color: #FFC800; display: block; height: 20px; line-height: 20px; float: left; padding: 0 7px 0 0; white-space: nowrap }
a.signIn:hover,
a.signIn:focus { text-decoration: none; background-position: 0 -20px }
a.signIn:hover span,
a.signIn:focus span { background-position: 100% -20px; cursor: pointer }

/*returning visitor*/
#returningVisitor { margin-left: 25px; width: 330px; min-height: 540px; padding-top: 60px; }
#returningVisitor h1.formHeader { margin: 20px 0 0 30px; font-size: 28px }
.returningInformation { color: #691304; font-size: 18px; width: 350px; margin: 2px auto 0 }
.returningInformation .welcomeBack { margin-top: 27px }
.returningInformation ul { margin: 0; padding: 5px 0 0; list-style: none; font-size: 16px }
.returningInformation li { margin: 0 0 10px 15px; padding: 0 0 0 25px; list-style: none; font-weight: bold; background: url("/account/static/images/lightweight-account-creation/arrow.48OHl.gif") no-repeat 0 5px; color: #0a546f }
.returningInformation li p { color: #691304; font-size: 14px; font-weight: normal; padding: 0; margin: 3px 0 3px 0 }
a.login { background: url("/account/static/images/lightweight-account-creation/login.2fe26.jpg"); width: 215px; height: 50px; line-height: 50px; display: block; margin: 38px auto 0; text-align: center; color: #FFC800; font-size: 18px; font-weight: bold }
a.login:hover,
a.login:focus { background-position: 0 -50px; text-decoration: none }
.newAccount { border-top: 1px solid #caa05e; padding: 30px 20px 20px 0; font-size: 14px; margin-top: 40px; font-weight: bold; text-align: center }
.newAccount a { text-decoration: underline }
.newAccount a:hover,
.newAccount a:focus { text-decoration: none }

/* language specific */
body.fr-fr .newAccount { padding: 20px 20px 20px 0; margin-top: 20px }
body.fr-fr a.login { margin-top: 10px }
body.fr-fr h1.formHeader { letter-spacing: -2px }
body.de-de .newAccount { padding: 20px 20px 20px 0; margin-top: 20px }
body.de-de a.login { margin-top: 10px }
body.de-de h1.formHeader { font-size: 25px; letter-spacing: -2px }
body.de-de .signUpForm a.submit { font-size: 19px; letter-spacing: -1px }
body.es-es h1.formHeader { letter-spacing: -2px }
body.es-es .signUpForm a.submit { font-size: 19px; letter-spacing: -1px }
body.es-mx h1.formHeader { letter-spacing: -2px }
body.es-mx .signUpForm a.submit { font-size: 21px; letter-spacing: -1px }
body.ru-ru .newAccount { padding: 25px 20px 20px 0; margin-top: 25px }
body.ru-ru a.login { margin-top: 20px }
body.ru-ru #accountNote p { padding-left: 6px }
body.ru-ru h1.formHeader { font-size: 27px }

/*form graphics*/
.signUpForm { color: #691304; width: 504px; margin: 0 0 0; padding-top: 57px; padding-left: 30px; }
.signUpForm .backgroundExtension .accountInfo { margin-left: 34px }
.signUpForm .formBackground { background: url("/account/static/images/lightweight-account-creation/input-bg-repeat-y.2c2hJ.jpg") 149px 0 repeat-y }
.signUpForm .formTop { background: url("/account/static/images/lightweight-account-creation/input-bg-top.4a4Zd.jpg") 149px 0 no-repeat; padding-top: 13px }
.signUpForm .formBottom { background: url("/account/static/images/lightweight-account-creation/input-bg-bottom.0aeYm.jpg") 149px 100% no-repeat; padding-bottom: 13px }

/* Form parchment*/
#parchment-container { margin-top: 19px; position: relative; width: 488px; }
#parchment-container .parchment-top { min-height: 600px; background: url("/account/static/images/lightweight-account-creation/parchment/parchment-top.3uYNX.jpg") 0 0 no-repeat; }
#parchment-container .parchment-top-smoothener { background: url("/account/static/images/lightweight-account-creation/parchment/parchment-smoothener.0CJUi.png") no-repeat 36px 488px; min-height: 560px }
#parchment-container .wrapper-parchment-bottom { background: url("/account/static/images/lightweight-account-creation/parchment/parchment-bottom.3AMOQ.png") 0 100% no-repeat; }
#parchment-container .parchment-bottom { background: url("/account/static/images/lightweight-account-creation/parchment/parchment-bottom.3EiAe.jpg") 36px 100% no-repeat; padding-bottom: 40px; }
#parchment-container .parchment-bottom-edge { background: url("/account/static/images/lightweight-account-creation/parchment/parchment-bottom-bottom.1iJNq.png") 0 100% no-repeat; position: absolute; bottom: -37px; height: 37px; width: 488px; left: 3px; }


/*sign up table */
.accountInfo { width: 415px; margin: 0 }
#captcha td { text-align: center; padding: 15px 0 30px 0 }
.captcha-reloader, .captcha-reloader a { display: inline-block; font-size: 10px; font-weight: normal; line-height: 12px; text-align: left; }
#sec-string { cursor: pointer; }
#touAgreeRow label { color: #000; display: block; width: 200px }
#touAgreeRow td { padding-top: 15px; padding-bottom: 15px }
#touAgreeRow input { margin: 0; padding: 0 }
#touAgreeRow a { text-decoration: underline }
#touAgreeRow a:hover,
#touAgreeRow a:focus { text-decoration: none }
.cnTouAgreeRow td { padding-left: 60px; padding-right: 30px; }
.captcha-msg td { padding: 15px 30px 15px 60px; }
td.leftCol { text-align: right; padding: 3px 15px 3px 0; font-weight: bold; font-size: 14px; width: 147px; letter-spacing: -1px }
td.rightCol { font-size: 12px; padding: 3px 0 3px 0; color: #000 }
td.evenRow { padding-top: 0; padding-bottom: 5px }
#regionLabel { padding-right: 5px }
span.aboutRegions { font-size: 11px; font-weight: normal }
a.regionLink { color: #005783; text-decoration: underline }
a.regionLink:hover { text-decoration: none }
input.text, select.text { border: 2px solid #5b0508; background-color: #F8F4E8; height: 22px; padding: 4px 4px 4px; font-size: 14px; width: 193px; float: left }
select.text { height: 32px; padding: 6px 4px 2px; width: auto; margin-right: 3px; }
input.text:hover,
input.text:focus { background-color: #FFF }
.validField { width: 20px; height: 30px; float: left; display: none }
.checkboxBorder { border: 2px solid transparent; width: 13px; height: 13px; float: right }

/*country and sqa*/
#country { width: 162px; }
#secretQuestion { width:180px;}
#secretAnswer { width: 173px; }

/*invalid row*/
.invalid label { color: #F00 }
input.invalid, select.invalid, .invalid input { border: 2px solid #F00; padding: 5px 3px 1px }
.invalid .validField { background: url("/account/static/images/lightweight-account-creation/field-invalid.3rvQ0.png") 50% 50% no-repeat; display: block }
.invalid .checkboxBorder { border: 2px solid #F00 }
.invalid .checkboxBorder input { border: 0px; }
#touAgreeRow.invalid label { color: #F00 }
#touAgreeRow.invalid label a { color: #F00 }

/*submit button*/
.signUpForm .submit { color: #ffc800; display: block; width: 253px; height: 88px; line-height: 88px; font-size: 22px; text-align: center; font-weight: bold; background: url("/account/static/images/lightweight-account-creation/submit.04ECC.gif") no-repeat; margin: 25px auto 0; border: 0; cursor: pointer; }
.signUpForm .submit:hover { background-position: 0 -88px; text-decoration: none }

.signUpForm .submit.plainSubmit { background-image: url("/account/static/images/lightweight-account-creation/login.2fe26.jpg"); height: 50px; width: 215px; line-height: 30px }
.signUpForm .submit.plainSubmit:hover { background-position: 0 100% }

/*message box*/
.messageBox { margin: -30px 0 0 225px; position: absolute; width: 241px; background: url("/account/static/images/lightweight-account-creation/message-box/signuptooltip-tl.1iyl9.png") no-repeat scroll 0 0 }
.messageBox .background { background: url("/account/static/images/lightweight-account-creation/message-box/signuptooltip-br.4gYyh.png") no-repeat 100% 100%; padding: 0; position: relative; top: 10px }
.messageBox .arrowLeft { width: 9px; height: 16px; background: url("/account/static/images/lightweight-account-creation/message-box/arrow.0VfbT.png") 100% 0 no-repeat; float: left; position: relative; left: -6px; top: 7px }
.messageBox p { list-style-type: none; position: relative; top: -7px; margin: 0; font-size: 11px; font-weight: normal; padding: 2px 7px 4px 10px }
.messageBox ul { list-style-type: none; position: relative; top: -7px; margin: 0; font-size: 11px; font-weight: normal; padding: 2px 7px 4px 2px }
.messageBox li { color: #C00; list-style-type: none; padding: 0 0 0 17px; margin: 1px 2px; background: url("/account/static/images/lightweight-account-creation/invalid.0NqaD.gif") 0 2px no-repeat }
.messageBox li.invalid { color: #C00; background: url("/account/static/images/lightweight-account-creation/invalid.0NqaD.gif") 3px 2px no-repeat }
.messageBox li.valid { color: #060; background: url("/account/static/images/lightweight-account-creation/message-box/valid.2kDsA.gif") 2px 1px no-repeat }
#formValidation.messageBox { margin: -40px 0 0 404px; bottom: 0 }

#formValidation.message-alert { margin: -40px 0 0 350px; bottom: 0 }
.message-alert { position: absolute; margin: -27px 0 0 166px; width: 241px; border: 2px solid #b56e09;}
.message-alert .border { border: 1px solid #fff; background: #ffedc1; }
.message-alert .border .arrowLeft { float: left; position: relative; left: -9px; top: 4px; width: 9px; height: 16px; background: url("../../images/lightweight-account-creation/message-box/arrow.0VfbT.png") 100% 0 no-repeat; }
.message-alert .border p { list-style-type: none; margin: 0; font-size: 11px; font-weight: normal; padding: 4px 10px }
.message-alert ul { margin: 0; padding: 0; list-style-type: none; font-size: 11px; font-weight: normal; }
.message-alert li { color: #C00; list-style-type: none; padding: 0 0 0 17px; margin: 1px 2px; background: url("../../images/lightweight-account-creation/invalid.0NqaD.gif") 0 2px no-repeat }
.message-alert li.invalid { color: #C00; background: url("../../images/lightweight-account-creation/invalid.0NqaD.gif") 3px 2px no-repeat }
.message-alert li.valid { color: #060; background: url("../../images/lightweight-account-creation/message-box/valid.2kDsA.gif") 2px 1px no-repeat }


/* region selection */
#regionSelection { position: absolute; margin: 0; bottom: 37px; left: -30px }
#regionSelection label { display: block; font-size: 11px; padding: 1px 0 2px 15px; font-weight: bold; margin: 0; line-height: 12px }
#regionSelection .radio { margin: 0 4px 0 0; vertical-align: middle; padding: 0 }

/* locale-specific */
.fi-fi #dobDay,
.fi-fi #dobMonth,
.fi-fi #dobYear { font-size: 11px; }
