/* 
    Document   : user
    Created on : 2012. 2. 9, 오후 6:07:59
    Description: Styles for the user pages
*/

/*************** Styling for all user forms ***************/
.agree_checkbox{
        color:#D10000;
        padding-bottom: 10px;
        width: 721px;
}
.error_center{
        margin: auto auto;
        color:red;
        font-size:small;
}
.terms {
        width: 700px;
        height: 200px;
        overflow: visible;
        margin-left: 16px;
        border: 1px solid black;
}
#terms_of_service_iframe {
        border-style: none;
        width: 100%;
        height: 100%;
}
#privacy_policy_iframe {
        border-style: none;
        width: 100%;
        height: 100%;
}
.register_label_holder {
        width: 150px;
        float: left;
        padding-left: 150px;
}
.register_header {
        width: 721px;
}
.captcha_display {
        font-size: large;
        float: left;
        padding-left: 250px;
        font-weight: bold;
}
#register_form { 
        background: url('../images/layout/general/sign_up_frame.png') no-repeat;
        background-size: 721px 100%;
        padding: 120px 0;
        text-align: center;
        background /*\**/: none\9;
        z-index /*\**/: 10\9; /* IE8 Hack */
        position /*\**/: absolute\9; /* IE8 Hack */
        top /*\**/: 0\9; /* IE8 Hack */
        left /*\**/: 0\9; /* IE8 Hack */
}
.register_label {
        text-decoration: none;
        width : 150px;
        margin-left:40px;
        font: 14px/100% Charlemagne Std;
        font-weight: bold;
        text-transform: uppercase;
        margin: 0 2px;
        padding: .5em .5em .55em;
        text-shadow: 0 1px 1px rgba(0,0,0,.3);
        -webkit-border-radius: .5em; 
        -moz-border-radius: .5em;
        border-radius: .5em;
        -webkit-box-shadow: 0 1px 2px rgba(0,0,0,.2);
        -moz-box-shadow: 0 1px 2px rgba(0,0,0,.2);
        box-shadow: 0 1px 2px rgba(0,0,0,.2);
        color: black;
        border: solid 1px #af7778;
        background: #e1ccca;
}
.register_input {
        float: right;
        width: 400px;
        padding: 3px 20px 0 0;
        text-align: left;
}
.register_fixed_field { width: 721px; }
.constraints { font-size: small; padding: 10px; }
.user input[type="text"], .user input[type="password"] { width: 180px; }
.user .field { height: 42px; }
.user .captcha_field #captcha_image{ text-align: left; }
/* Forget pw*/
#forgetpw #label { float: left; width: 400px; text-align: right; }
#forgetpw #input { float: right; width: 400px; }
#forgetpw input[type="text"] { margin: 10px 0; }
#forgetpw .error { float: none; width: auto; }
/* Registration form */
.birthday select { width: 100px; }
.registration-submit-button input[type="submit"] { width: 150px; }
#recaptcha_image { width: 100%; margin: auto auto; }
#recaptcha_field { width: 100%; margin: auto auto; }
#recaptcha_response_field { width: 200px; float:none; }
#recaptcha_div .error {
        float: none;
        width: 400px;
        margin: auto auto;
}
#privacy_email_message {
        width: 700px;
        text-align: left;
        font-size: small;
        padding: 0 20px 0 20px;
        margin: auto auto;
        color: red;
}
#privacy_email_message a { text-decoration: underline; color: blue; }

#captch_input { width: 39%; display: inline-block; float: left; }
#captcha_image { display: inline-block; float: left; }
#captcha_error { display: inline-block; float: left; width: 30% }
.error {
        float: right;
        font-size: small;
        width: 200px;
}
select#gender {
        width:150px;
}
/*************** End styling for all user forms ***************/
/*************** Styling for the login form ***************/
.login_input .error { width: auto; }
#login_form {
        margin: auto auto;
        width: 530px;
        height: 338px;
        background: url('../images/layout/general/login_frame.png') no-repeat;
        background-size: cover;
        text-align: center;
}
#login_title_wraper .error { color: red; display: inline; float: none; font-size: 12px; }
#login_title {
        font-weight: bold;
        padding-top: 66px;
        padding-bottom: 0;
        font-size: 21px;
        text-shadow: -1px 0 white, 0 1px white, 1px 0 white, 0 -1px white;
}

#login_labels {
        float: left;
        width: 118px;
        padding-left: 90px;
        padding-right: 22px;
}
#login_inputs {
        float: left;
        width: 150px;
        height: 91px;
        padding-right: 34px;
}
#login_content{ height: 95px; }
.login_label {
        text-decoration: none;
        font: 17px/100% Charlemagne Std;
        text-transform: uppercase;
        font-weight: bold;
        margin: 0 2px 7px;
        padding: .5em .5em .55em;
        text-shadow: 0 1px 1px rgba(0,0,0,.3);
        -webkit-border-radius: .5em; 
        -moz-border-radius: .5em;
        border-radius: .8em;
        -webkit-box-shadow: 0 1px 2px rgba(0,0,0,.2);
        -moz-box-shadow: 0 1px 2px rgba(0,0,0,.2);
        box-shadow: 0 1px 2px rgba(0,0,0,.2);
        color: black;
        border: solid 2px #af7778;
        background: #e1ccca;
}
.login_input { padding: 4px 0 6px; width: 170px; }
.login_input input[type="text"], input[type="password"]{
        width: 150px;
        height: 25px;
        margin-top: 2px;
        margin-bottom: 2px;
}

#login_btns { width: 100%; display: inline-block; }
#rmbme{
        font-size: small;
        height: 23px;
}
#forgetpw a{
        font-size: small;
        color: #453FFC;
}
#forgetpw a:hover{
        color: red;
}
/*************** End styling for the login form ***************/
/*************** Styling for the referral page ***************/
#referral_content_right{
        float: right;
        width: 620px;
        min-height: 600px;
        margin-right: 10px;
        border: 2px #a1ae6c solid;
        background-image: url('../images/referral/referral bg.png');
}

#referral_content_right #referral_intro{
        font-size: x-large;
        color: #FFFEC9;
        font-weight: bold;
}
#referral_content_right #referral_desc{
        font-size: small;
        text-align: left;
        color: #FFFEC9;
        font-weight: bold;
        padding-top: 10px;
        padding-left: 20px;
}
#referral_content_right #referral_list{
        font-size: small;
        text-align: left;
        background-color: #FFFEC9;
        font-weight: bold;
        width: 500px;
        margin: auto auto;
        min-height: 400px;
        margin-top: 30px;
        padding-left: 20px;
        opacity: 0.6;
        overflow: scroll;
        filter: alpha(opacity=60); /* For IE8 and earlier */
}
#referral_content_right .referee{
        margin-top: 10px;
        font-size: medium;
}
#referral_content_right .referee a:hover{
        color:blue;
}
#reward_success_bg{
        background-image: url('../images/dandelive/congrats_bg.jpg');
        color: #FFFEC9;
        width: 600px;
        min-height: 400px;
}
#reward_success_bg h3{
        color: black;
}

.notice { font-size: 12px; }
.alt_link { padding: 10px; display: inline-block; }
.alt_link a { font-weight: bold; color: blue; text-decoration: underline; }
/*************** End styling for the referral page ***************/
/*************** My account styling ***************/
.my_account label { float: left; width: 170px; text-align: left; }
.my_account select { float: left; width: 150px; }
.my_account input[type="text"], .my_account input[type="password"] { width: 180px; float: left; }
.my_account.submit-button { float: left; }
.my_account .field { height: 30px; width: 100%;}
form.my_account { display: inline-block; float: none; position: relative; width: 69%; }
.my_info label { float: left; width: 80px; text-align: left; }
.my_info select { float: left; width: 140px; }
.my_info {width: 250px; margin: auto auto;}

.account-nav{
        list-style: none;
        margin: 0;
        padding: 0;
        border: none;
}
.user_content_right_box{
        background-color: white;
        border: 2px solid #adadad;
        -moz-border-radius-topright: 20px;
        border-top-right-radius: 20px;
        -moz-border-radius-bottomleft: 20px;
        border-bottom-left-radius: 20px;
        -moz-border-radius-bottomright: 20px;
        border-bottom-right-radius: 20px;
        width: 580px;
        white-space: normal;
}
.submit_link  input[type="text"]{
        width: 300px;
}
/*************** End my account styling ***************/
/**************** IE8 styling ***************/
.content_box.user_views {
        position /*\**/: relative\9; /* IE* Hack */
}
#register_frame_ie_image {
	position: absolute; 
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
        z-index: 0;
}
#register_frame_ie_image img {
	width: 780px;
	height: 1300px;
}
/**************** End IE8 styling ***************/