
#account_page {width: 600px; height: 800px; margin: auto; border: 1px solid grey; position: relative;}
#account_title {amrgin: auto; text-align: center; height: 80px; line-height: 80px; 
    font-weight: bolder; font-size: 2em;}

#account_content {width: 80%; margin: auto; }
#account_content > div {margin: 10px auto 10px auto; text-align: center; }

#login_form {display: none;}
#login_name {text-align: center; font-weight: bold; font-style: italic; font-size: 1.3em; margin: 10px auto;}
#login_name_f {width: 250px; border: 1px solid gray; height: 1.2em; line-height: 1.2em; margin: 10px auto;}
#login_email {text-align: center; font-weight: bold; font-style: italic; font-size: 1.3em; margin: 10px auto;
    display: none;}
#login_email_f {width: 250px; border: 1px solid gray; height: 1.2em; line-height: 1.2em; margin: 10px auto;
    display: none;}
#login_pass {text-align: center; font-weight: bold; font-style: italic; font-size: 1.3em; margin: 10px auto;}
#login_pass_f {width: 250px; border: 1px solid gray; height: 1.2em; line-height: 1.2em; margin: 5px auto;}
#login_check {text-align: center; font-weight: bold; font-style: italic; font-size: 1.3em; margin: 10px auto; 
    display: none;}
#login_check_f {width: 250px; height: 1.2em; line-height: 1.2em; margin: 5px auto; display: none;}
#login_check_fi {width: 250px; border: 1px solid gray; height: 1.2em; line-height: 1.2em;
    margin: 5px auto;}

#login_enter {width: 125px; border: 1px solid grey; border-radius: 5px 5px 5px; box-shadow: 5px 5px 5px;
    height: 1.3em; line-height: 1.3em; font-size: 1.2em; font-weight: bold; cursor: pointer; margin: 25px auto}
#login_back {width: 125px; border: 1px solid grey; border-radius: 5px 5px 5px; box-shadow: 5px 5px 5px;
    height: 1.3em; line-height: 1.3em; font-size: 1.2em; font-weight: bold; cursor: pointer; 
    margin: 25px auto; display: none;}
#logout {width: 100px; border: 1px solid grey; border-radius: 5px 5px 5px; box-shadow: 5px 5px 5px;
    height: 1.2em; line-height: 1.2em; font-size: 1.1em; font-weight: bold; cursor: pointer; margin: 10px auto}
#login_reg {width: 125px; border: 1px solid grey; border-radius: 5px 5px 5px; box-shadow: 5px 5px 5px;
    height: 1.3em; line-height: 1.3em; font-size: 1.2em; font-weight: bold; cursor: pointer; margin: 25px auto}
#login_register {width: 125px; border: 1px solid grey; border-radius: 5px 5px 5px; box-shadow: 5px 5px 5px;
    height: 1.3em; line-height: 1.3em; font-size: 1.2em; font-weight: bold; cursor: pointer; margin: 25px auto; 
    display: none;}

#account_info {display: none;}
#login_message {color: red; font-weight: bold; font-size: 1.1em; margin: 10px auto; text-align: center;}
#acc_info_head {display: table; margin: 10px auto 0px; width: 100%;}
#acc_info_head > div {display: table-cell; width: 33%; font-weight: bold; sonf-size: 1.1em;}

#acc_info_head > div:nth-child(1) {width: 35%; text-align: left;}
#acc_info_head > div:nth-child(2) {width: 20%; text-align: center;}
#acc_info_head > div:nth-child(3) {width: 30%; text-align: left;}
#acc_info_head > div:nth-child(4) {width: 15%; text-align: center;}



#ship_info {margin: 20px auto 0px;}
#ship_tech_title, #ship_weapon_title, #ship_support_title {width: 150px; border: 1px solid grey; border-radius: 5px 5px 5px;
    cursor: pointer;font-size: 1.3em; font-weight: bold;}
#ship_tech, #ship_weapon, #ship_support {width: 100%; overflow: hidden; display: none;}
.ship_inner {width: 100%; display: flex; flex-direction: column;}
#ship_menu {display: table; width: 100%;}
#ship_menu > div {display: table-cell; width: 50%; }


.ship_inner > div {display: table; width: 100%; margin: 10px auto; font-size: 1.2em; font-weight: bold; }
.ship_inner > div > div {display: table-row; }
.ship_inner > div > div > div {display: table-cell; height: 1.4em;}
.ship_inner > div > div > div:nth-child(1) {width: 50%; text-align: left;}
.ship_inner > div > div > div:nth-child(2) {width: 20%; text-align: right; padding-right: 0.5em; }
.ship_inner > div > div > div:nth-child(3) {width: 10%; text-align: left;}
.ship_inner > div > div > div:nth-child(4) {width: 10%; }
.ship_inner > div > div > div:nth-child(5) {width: 10%; }


#act_selector {width: 100%; margin: 10px auto 5px; }
.act_selector {width: 110px; cursor: pointer; border: 1px solid grey; border-radius: 5px 5px 5px; margin: auto 10px auto; display: inline-block;
    font-weight: bold; font-size: 1.2em; line-height: 1.3em; }

#missions_info {display: none; margin: 10px auto; height: 700px; overflow-y: scroll; }
#missions_info_title {font-weight: bold; font-size: 1.3em; }

#missions_cont {width: 100%; margin: 10px auto 15px; }
#missions_cont > div {display: table; width: 100%;}
.mission_tr {display: table-row; line-height: 2em;}
.mission_tr > div {display: table-cell;}
.mission_tr > div:nth-child(1) {width: 5%;}
.mission_tr > div:nth-child(2) {width: 25%; text-align: left;}
.mission_tr > div:nth-child(3) {width: 50%; line-height: 1em; text-align: left; font-style: italic; padding-bottom: 10px;}
.mission_tr > div:nth-child(4) {width: 20%;  vertical-align: middle;}
.mission_tr > div:nth-child(4) > div {}

.m_start_btn {cursor: pointer; border: 1px solid grey; width: 85px; border-radius: 5px 5px 5px; text-align: center;
    float: right; height: 1.1em; line-height: 1.1em;}
.m_nostart {opacity: 0.5;}

.click_upgr {cursor: pointer; border: 1px solid grey; border-radius: 5px 5px 5px; line-height: 1.1em; height: 1.1em; width: 1.5em;}

#upgrade_dialog {position: absolute; width: 75%; border: 1px solid grey; background-color: #f5f5f5; border-radius: 10px 10px 10px; 
    font-size: 1.3em; display: flex; flex-direction: column; }

#upgr_dialog_inner > div {margin: auto; line-height: 1.3em; height: 1.3em; text-align: center; display: table; width: 100%;}
#upgr_dialog_inner > div > div {display: table-cell;}
#upgr_dialog_inner > div > div:nth-child(1) {width: 50%; text-align: right; padding-right: 5px;}
#upgr_dialog_inner > div > div:nth-child(2) {width: 25%; text-align: right; padding-left: 5px;}
#upgr_dialog_inner > div > div:nth-child(3) {width: 25%; text-align: left; padding-left: 5px;}
#upgr_dialog_inner > div:nth-child(7)  {width: 40%; text-align: center; }
#upgr_dialog_inner > div:nth-child(1) {font-weight: bold; line-height: 2em; height: 2em; font-size: 1.5em;}
#upgr_dialog_inner > div:nth-child(2) {font-style: italic; line-height: 1.1em; height: 1.1em; font-size: 1.1em; padding-bottom: 30px;}
#upgr_dialog_inner > div:nth-child(7)  {width: 100%; }
#upgr_dialog_inner > div:nth-child(7) > div  {width: 100%; text-align: center; font-style: italic; color: red; margin: 5px auto;}
#upgr_ok {margin: 25px auto 35px; border: 1px solid grey; width: 30%; text-align: center; font-weight: bold;
    border-radius: 5px 5px 5px; cursor: pointer; line-height: 1.5em; height: 1.5em; }

#upgr_dialog_msg {width: 60%; height: 150px; text-align: center; font-style: bold; font-weight: italic; margin: 50px auto;}
#upgr_description {width: 90%; font-style: italic; margin: 10px auto;}

#help_info {display: none;}
#help_inner {width: 99%; white-space: pre-wrap; font-style: italic; text-align: justify; margin: 5px auto; overflow-y: scroll;
    font-size: 1.1em; padding: 2em; height: 600px;}

#user_message_send {display: none; flex-direction: row; }
#user_message_send > div:nth-child(1) {width: 75%; }
#user_message_send > div:nth-child(1) > textarea {width: 90%; }
#user_message_send > div:nth-child(2) {width: 20%; vertical-align: middle; text-align: center;}
#user_message_btn {cursor: pointer; border: 1px solid grey; border-radius: 3px 3px 3px; line-height: 1.1em; vertical-align: middle;
    font-size: 1em; height: 1.1em; padding: 5px; }