html {
 background-color: transparent;
}

body {
 background: none repeat scroll 0 0 transparent;
}

body.referral {
 background: url(https://www.runescape.com/img/main/splash/splash_create/create_account_friend_bg.jpg) center top no-repeat;
}

#container {
 position: relative;
 width: 876px;
 height: 632px;
 margin: 50px auto;
}

#logo {
 position: absolute;
 top: -47px;
 left: 218px;
}

#top {
 height: 41px;
 background: url("https://www.runescape.com/img/main/splash/splash_create/bg-top.png") center top no-repeat;
}

#middle {
 height: 632px;
 background: url("https://www.runescape.com/img/main/splash/splash_create/create_account_v2.png") center top no-repeat;
}

#bottom {
 height: 5px;
 background: url("https://www.runescape.com/img/main/splash/splash_create/bg-bottom.png") center top no-repeat;
}

#create {
 background: url("https://www.runescape.com/img/main/splash/splash_create/content-bg.png") left top no-repeat;
 height: 475px;
    position: absolute;
    right: 17px;
    top: 75px;
    width: 374px;
}

.referral #create {
 height: 478px;
 top: 85px;
}

#create p {
 text-align: center;
 margin-bottom: 15px;
 clear: both;
 width: 290px;
}

#create p.emailRemind {
    width: 320px;
}

h3#mainTitle.Gradient {
 margin: 6px auto 30px;
 height: 34px;
}

h3#mainTitle.Gradient .G0,
h3#mainTitle.Gradient .G1,
h3#mainTitle.Gradient .G2,
h3#mainTitle.Gradient .G3,
h3#mainTitle.Gradient .G4,
h3#mainTitle.Gradient .G5,
h3#mainTitle.Gradient .G6 {
 font-size: 22px;
 width: 374px;
 text-align: center;
}

h3#mainTitle .mask,
h3#mainTitle .rightUnderscore,
h3#mainTitle .leftUnderscore {
 display: none;
}

h3#mainTitle.download {
 margin-bottom: 50px;
}

#breadcrumb {
 position: relative;
 top: 7px;
}

.downArrow {
 display: block;
 margin: 0 auto;
}

.playNowBtn, .downloadNowBtn {
 display: block;
 width: 249px;
 height: 48px;
 margin: 15px auto;
 background: url('https://www.runescape.com/img/main/splash/splash_create/button-playNow.png') left center;
}

.downloadNowBtn {
 background-image: url('https://www.runescape.com/img/main/splash/splash_create/button-downloadNow.png');
}

.playNowBtn:hover, .downloadNowBtn:hover{
 background-position: right center;
}


form#creation_form {
 margin-left: 43px;
    position: relative;
    top: -2px;
    width: 283px;
}

.referral form#creation_form {
 top: -7px;
}

form#creation_form div {
 position: relative;
 clear: both;
}

form#creation_form input.largeField,
form#creation_form input#age {
 height: 28px;
 line-height: 28px;
 margin: 12px 0 0 0;
 padding: 0 10px;
 border: none;
 color: #000;
}

form#creation_form input#age.disabled {
 opacity: 0.25;
 filter: alpha(opacity=25);
}

form#creation_form div#ageDiv {
 display: inline-block;
 width: 100%;
 border-bottom: 1px solid #666;
 padding-bottom: 10px;
 margin-bottom:-5px;
}

form#creation_form p {
 margin-bottom: 0;
 color: #999;
 font-size: 10px;
}

form#creation_form div#ageDiv label {
 float: left;
 margin-top: 14px;
 width: 193px;
}

form#creation_form input.largeField {
 background: url("https://www.runescape.com/img/main/splash/splash_create/input-bg.png") 0 0 no-repeat;
 width: 263px;
}

form#creation_form input#age {
 background: url("https://www.runescape.com/img/main/splash/splash_create/input-bgSmall.png") 0 0 no-repeat;
 width: 65px;
 float: right;
}

form#creation_form div.options {
 width: 280px;
 float: left;
 margin-top: 14px;
 margin-bottom: 5px;
}

form#creation_form div.options div {
 display: block;
 margin-bottom: -9px;
}

form#creation_form div.options label {
 color: #999;
 font-size: 10px;
 position: absolute;
 
  line-height: 20px;
 
}

form#creation_form input#submit {
 display: block;
 width: 249px;
 height: 48px;
 border: none;
 background: url("https://www.runescape.com/img/main/splash/splash_create/button-joinNow.png") 0 0 no-repeat;
 text-indent: -9999px;
 margin: 8px auto 0;
 font-size: 0;
 line-height: 0;
}

form#creation_form input#submit:hover {
 background-position: -249px 0;
 cursor: pointer;
}

form#creation_form #PlayNowWrapperPlayFB {
 display: block;
 width: 156px;
 height: 25px;
 margin: 10px auto 2px;
}

span.hint,
span.hint.play {
 display: block;
 width: 20px;
 height: 20px;
 background: url(https://www.runescape.com/img/main/splash/splash_create/input-question.png) 0 0 no-repeat;
 position: absolute;
 top: 15px;
 right: 12px;
 z-index: 1;
}

span.hint.play {
 top: 39px;
}

span.hint:hover {
 cursor: pointer;
}

.hint,
form#creation_form div.hint,
.hint.play {
 top: 8px;
 right: -137px;
 position: absolute;
}

.hint.play {
 top: 33px;
}

.hint .middle,
.inputError .middle {
 line-height: 16px;
}

.inputError,
form#creation_form div.inputError {
 position: absolute;
 top: 8px;
 left: -230px;
}

.inputError .top {
 background-image: url(https://www.runescape.com/img/global/error/errorTopFlip.png);
}

.inputError .middle {
 background-image: url(https://www.runescape.com/img/global/error/errorMiddleFlip.png);
}

.inputError .bottom {
 background-image: url(https://www.runescape.com/img/global/error/errorBottomFlip.png);
}

.inputError.error {
 display: block !important;
}

.inputError .bottom,
.inputError .top {
 background-position: 0px top;
}
.inputError {
 width: 230px;
}



.yellowTitle {
 color: #f3b13f;
 margin-bottom: 25px !important;
 clear: both;
}

.yellow {
 color: #f3b13f;
}
.largerYellow {
    font-size: 16px;
    margin-top: 5px;
    display: block;
}
.notArrivedMessage {
    width: 250px;
}

h3.Gradient.DoubleFlourish {
 margin: 25px 0 0 0px;
}

/*h3.Gradient.DoubleFlourish.play {
 margin: 25px 0 0 5px;
}
h3.Gradient.DoubleFlourish.email {
 margin: 25px 0 0 65px;
}
h3.Gradient.DoubleFlourish.noMargin {
 margin: 25px 0 0 -8px;
}*/

.playFooter {
 font-size: 11px;
 padding-top: 40px;
}
.createFooter {
    font-size: 11px;
 padding-top: 10px;
}

.createFooter.download {
 padding-top: 20px;
}

.playFooter {
 padding-top: 10px;
}

.createFooter a,
.playFooter a {
 color: #F3B13F;
}

.button {
 display: block;
 width: 249px;
 height: 48px;
 text-indent: -9999px;
 margin: 15px auto 10px;
}

.playPara {
 padding: 25px 0;
}


img#download-icon {
 margin: 0 101px;
}

a.button.download {
 margin: 0 auto 30px;
}

div#hint-container {
 position: absolute;
 right: 34px;
 top: 210px;
}

h3.Gradient.DoubleFlourish.unable {
 margin-left: -10px;
}

form#creation_form p#tandc {
 clear: both;
 font-size: 9px;
 padding-top: 10px;
}

.TrackingPixel {
 width: 0;
 height: 0;
}