body {
	background-color: #A4A4A4;
	color: black;
	padding: 0;
}
a {
	text-decoration: none;
	color: black;
}
.wrapper_spacer {
	background-color: #424242;
	padding: 3px;
	margin: 70px auto;
	border: 2px solid black;
	width: 70%;
	border-radius: 4px;
	box-shadow: 0 0 30px 5px grey;
}
.wrapper {
	background-color: #BDBDBD;
	border: 2px solid black;
	border-radius: 4px;
}
.header {
	background-color: #848484;
	border: 1px solid black;
	margin: 6px 10px;
	padding-left: 20px;
}
.menu_top {
	display: flex;
}
.menu_button_spacer {
	background-color: #424242;
	padding: 1px;
	border-right: 1px solid black;
	width: 15%;
}
.menu_buttons {
	padding: 5px;
	background-color: #A4A4A4;
	text-align: center;
	border: 1px solid black;
	border-radius: 4px;
	box-shadow: 0 0 4px grey inset;
}
.main {
	display: flex;
}
.main_left {
	background-color: #BDBDBD;
	width: 15%;
	min-height: 600px;
}
.spacer {
	height: 3px;
	background-color: #848484;
	border-bottom: 1px solid black;
	border-top: 1px solid black;
 }
 .spacer_main_left_button {
	height: 3px;
	background-color: #848484;
	border-bottom: 1px solid black;
 }
 .spacer_bottom {
	height: 3px;
	background-color: #848484;
	border-top: 1px solid black;
 }
 .main_left_button_spacer {
	background-color: #424242;
	padding: 1px;
	border-right: 1px solid black;
 }
.main_left_buttons {
	padding: 5px;
	background-color: #BDBDBD;
	text-align: center;
	border: 1px solid black;
	border-radius: 4px;
	box-shadow: 0 0 3px grey inset;
}
.main_spacer_index {
	background-color: #424242;
	padding: 3px;
	width: 100%;
	min-height: 600px;
}
.main_mid_spacer {
	background-color: #424242;
	padding: 3px;
	width: 70%;
	min-height: 600px;
}
.main_mid_index {
	background-color: #BDBDBD;
	border: 1px solid black;
	padding: 5px;
	box-shadow: 0 0 5px grey inset;
	min-height: 606px;
}
.main_mid {
	background-color: #D8D8D8;
	border: 1px solid black;
	padding: 5px;
	box-shadow: 0 0 5px grey inset;
	min-height: 606px;
}
#index_name_spacer {
	background-color: #424242;
	padding: 1px;
}
.index_name {
	padding: 5px;
	background-color: #A4A4A4;
	text-align: center;
	border: 1px solid black;
	vertical-align: middle;
	font-size: 20px;
	box-shadow: 0 0 4px grey inset;
}
.form_spacer {
	background-color: #424242;
	padding: 2px;
    margin: 0 auto;
    margin-top: 200px;
	border: 1px solid black;
	border-radius: 3px;
	width: 300px;
}
.login_spacer {
	display: flex;
}
#index_form {
	margin: 0;
	box-shadow: 0 0 3px grey inset;
}
#reg_form {
	margin: 0;
	box-shadow: 0 0 3px grey inset;
}
.select_reg {
	padding: 5px;
	margin-top: 10px;
	width: 250px;
}
#username {
	margin-bottom: 10px;
	width: 250px;
	padding: 5px 7px;
}
#password {
	width: 250px;
	padding: 5px 7px;
}
.button {
	background-color: #BDBDBD;
	padding: 5px 7px;
	border: 1px solid black;
}
#form {
	background-color: #D8D8D8;
	border: 1px solid black;
	border-top: 0;
	box-shadow: 0 0 5px grey inset;
}
.form_box {
	padding: 20px;
	width: 250px;
}
#login_button {
	margin-top: 10px;
	margin-bottom: 10px;
	width: 250px;
}
#register_button {
	width: 233px;
	height: 17px;
	text-align: center;
	font-size: 12px;
	margin-top: 10px;
}
.main_right_spacer {
	min-width: 15%;
	padding: 2px;
	background-color: #424242;
	min-height: 600px;
}
.main_right {
	background-color: #BDBDBD;
	padding: 13px 5px 5px 5px;
	border-radius: 4px;
	border: 1px solid black;
	min-height: 600px;
}

.main_right_selector {
	width: 112px;
	margin: 0 auto;
	background-color: #424242;
	padding: 1px;
	border-radius: 50px 3px 3px 3px;
	border: 1px solid black;
}
.char_pic_background { 
	background-color: #848484;
	border-right: 1px solid black;
	border-left: 1px solid black;
	border-top: 1px solid black;
	padding: 2px;
	border-radius: 50px 3px 0 0;
}
.char_pic_spacer {
	padding: 1px;
	border-radius: 49px 5px 50px 5px;
	background-color: #424242;
	border: 1px solid black;
}
.char_pic {
	border: 1px solid black;
	width: 100px;
	height: 100px;
	background-color: black;
	border-radius: 48px 5px 49px 5px;
	
}
.char_pic img {
	box-shadow: 0 0 10px 15px black inset;
	border-radius: 48px 5px 49px 5px;	
}
.username_spacer {
	padding: 2px;
	margin-bottom: 5px;
	border: 1px solid black;
	background-color: #424242;
}
.username {
	background-color: #D8D8D8;
	padding: 2px;
	font-size: 12px;
}
.status_value {
	border-right: 1px solid black;
	border-left: 1px solid black;
	border-bottom: 1px solid black;
	padding: 2px;
	background-color: #848484;
	border-radius: 0 0 3px 3px;
}
.status_spacer {
	padding: 1px;
	background-color: #424242;
	border: 1px solid black;
	margin-bottom: 1px;
	border-radius: 3px;
}
.hp {
	border: 1px solid black;
	height: 15px;
	padding: 1px;
	background-color: #F6CECE;
	border-radius: 3px;
	text-align: center;
	font-size: 11px;
	box-shadow: 0 0 4px #FA5858 inset;
}
.mana {
	border: 1px solid black;
	height: 15px;
	padding: 1px;
	background-color: #CECEF6;
	border-radius: 3px;
	text-align: center;
	font-size: 11px;
	box-shadow: 0 0 4px #5882FA inset;
}
.exp {
	border: 1px solid black;
	height: 15px;
	padding: 1px;
	background-color: #F5F6CE;
	border-radius: 3px;
	text-align: center;
	font-size: 11px;
	box-shadow: 0 0 4px #F4FA58 inset;
}
.generalinformation_spacer {
	margin-top: 15px;
	padding: 2px;
	background-color: #424242;
	border: 1px solid black;
}
.generalinformation {
	padding: 3px 5px;
	background-color: #D8D8D8;
	border-radius: 4px;
	border: 1px solid black;
	box-shadow: 0 0 3px grey inset;
  }
.tab {
	white-space: pre;
}
.spacer_main_left_mid,.spacer_main_mid_right {
	width: 3px;
	border-right: 1px solid black;
	border-left: 1px solid black;
	background-color: #848484;
}
.spacer_main_left {
	width: 3px;
	border-right: 1px solid black;
	background-color: #848484;
}
.spacer_main_right {
	width: 3px;
	border-left: 1px solid black;
	background-color: #848484;
}
.menu_bottom {
	display: flex;
	background-color: #D8D8D8;
}
.menu_bottom_button_spacer {
	background-color: #424242;
	padding: 1px;
	border-right: 1px solid black;
	width: 25%;
}
.menu_bottom_buttons {
	padding: 5px;
	background-color: #A4A4A4;
	text-align: center;
	border: 1px solid black;
	border-radius: 4px;
	box-shadow: 0 0 4px grey inset;
}
