html,
body
{
	margin:0;
	padding:0px;
	width:100%;
	height:100%;
	font-size: medium;
	position: relative;
	color: white;
	background-color: rgb(31, 32, 32);
	font-family: "League Spartan", sans-serif;
	font-optical-sizing: auto;
	font-style: normal;
	font-weight: 500;
}
div,
span {
  box-sizing: content-box;
  text-shadow: 1px 1px 2px #000000;
}

button
{
	background-color: #c3c3c3;
	font-size: larger;
	font-family: "League Spartan", sans-serif;
	font-optical-sizing: auto;
	font-style: normal;
	font-weight: 500;
	padding-top: 5px;
	text-shadow: 0px 0px 1px #6e6e6e;
	border-radius: 5px;
}

.help {
	cursor: help;
	text-align: center;
}

#new_content
{
	display: block;
	min-width: 1260px;
	min-height: 760px;
	width: 100%;
	height: 100%;
	margin: 1%;
	padding: 0px;
	position: absolute;
	top: 0;
	left: 0;
	overflow: hidden;
	unicode-bidi: isolate;
}

#tick_progress_bar {
	width: 98%;
	background-color: rgb(31, 32, 32);
	border-radius: 10px;
	border:#000 2px solid;
 }
 
 #tick_progress_inside {
	width: 100%;
	height: 15px;
	background: linear-gradient(179deg, #454545, #6b6b6b);
	border-radius: 10px;
	transition-duration: 100ms;
 }

 #tick_info
 {
	display: flex;
	flex-direction: column;
	justify-content: center;
	width: 98%;
 }

.task_window
{
	border-top-color: black;
	border-top-style: solid;
	border-top-width: 1px;
	border-bottom-color: black;
	border-bottom-style: solid;
	border-bottom-width: 1px;
	width: 100%;
	height: 75%;
}

.player_info_group
{
	border-top-color: black;
	border-top-style: solid;
	border-top-width: 1px;
	border-bottom-color: black;
	border-bottom-style: solid;
	border-bottom-width: 1px;
	background: rgb(31, 32, 32);
	font-size: larger;
}

.player_info_element
{
	display: flex;
	justify-content: space-between;
	padding-top: 4px;
	padding-left: 3px;
	padding-right: 3px;
	background-repeat: no-repeat;
	background: linear-gradient(90deg, #454545, #6b6b6b);
	background-size: 100% 100%;
	transition-duration: 150ms;
}

#info_panel
{
	border: black 2px solid;
	border-radius: 8px;
	float: left;
	width: 20%;
	height: calc(90%);
	background-color: #3c3c3c;
}

#main_panel
{
	border: black 2px solid;
	border-radius: 8px;
	display: flex;
	flex-direction: column;
	float: left;
	width: 50%;
	height: calc(90%);
	background-color: #3c3c3c;
}

.vertical_spacer
{
	width: 2px;
	height: calc(90%);
	display: flex;
	flex-direction: column;
	float: left;
}

#player_battle_data, 
#monster_battle_data
{
	text-align: center;
	vertical-align: middle;
	width: 49.5%;
}

#battle_looking_for_enemy
{
	display: none;
}

#healing_window
{
	display: none;
	flex-wrap: wrap;
	align-content: center;
	justify-content: center;
	text-align: center;
	flex-direction: column;
}

#battle_window
{
	display: none;
}

#battle_window_battle
{
	display: none;
	flex-direction: column;
	width: 100%;
	height: 100%;
}

#questing_window
{
	display: none;
	flex-direction: column;
}

#training_window
{
	display: none;
	flex-wrap: wrap;
	align-content: center;
	justify-content: center;
}

#training_table
{
	width: 100%;
	height: 100%;
}

#control_buttons
{
	height: 10%;
	width: 100%;
	display: flex;
	align-items: flex-end;
	padding-bottom: 3px;
	column-gap: 2px;
}

.questing_slider_button_info
{
	display: flex;
	flex-direction: column;
	align-items: center;
}

#questing_window_exhaustion
{
	display: flex;
	flex-direction: column;
	align-content: center;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
	height: 30%;
	width: 100%;
}

#questing_window_info
{
	display: flex;
	flex-direction: column;
	align-content: center;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
	height: 50%;
	width: 100%;
}

#questing_window_slider
{
	display: flex;
	flex-direction: column;
	align-content: center;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
	height: 20%;
	width: 100%;
}

#questing_window_slider_info
{
	display: flex;
	justify-content: space-around;
	flex-wrap: wrap;
	align-content: center;
	flex-direction: row;
	width: 70%;
}

#questing_progress_bar {
	width: 50%;
	background-color: rgb(31, 32, 32);
	border-radius: 10px;
	border:#000 2px solid;
 }
 
#questing_progress_bar_inside {
	width: 0%;
	height: 15px;
	background: linear-gradient(179deg, #454545, #6b6b6b);
	border-radius: 10px;
	transition-duration: 200ms;
}

.equipment_slot
{
	display: flex;
	height: 10%;
	border-bottom:#000 solid 1px;
}

.equipment_slot_info
{
	display: flex;
	justify-content: center;
	align-items: center;
	border-left: black solid 1px;
}

#select_zone_scrolling_list
{
	width: 80%;
	overflow-y: auto;
	border-left:#000 solid 1px;
	border-right:#000 solid 1px;
}

#battle_window_select_zone
{
	display: flex; 
	width: 100%; 
	height: 100%; 
	justify-content: center;
}

.battle_window_select_zone_element
{
	height: 5%; 
	display: flex; 
	align-items: center;
	border-bottom:#000 solid 1px;
}

.battle_data
{
	display: flex;
	flex-direction: column;
	align-items: center;
	width: 100%;
}

.battle_health_bar
{
	width: 80%;
	background-color: rgb(31, 32, 32);
	border-radius: 10px;
	border:#000 2px solid;
}

.battle_health_bar_inside
{
	width: 100%;
	height: 15px;
	background: linear-gradient(90deg, rgb(151, 58, 58), rgb(153, 100, 100));
	border-radius: 10px;
	transition-duration: 150ms;
}

.battle_window_drops_statistic
{
	width: 100%; 
	height: 50%; 
	display: flex; 
	justify-content: center;
}

.smith_item_select
{
	width: 20%;
	height: 100%;
}

.smith_item_select_button
{
	display: flex;
	flex-direction: column;
	width: 100%;
	height: 100%;
	align-items: center;
	justify-content: center;
}

.smith_item_select_text
{
	display:flex;
	justify-content:center;
	align-items:center;
	color:white;
	height: 70%;
	width: 100%;
}

.smith_border_1px
{
	border:#000 1px solid;
	border-radius: 5px;
}

.space
{
	margin: 10px 0 10px 0;
}

.smith_enabledButton
{
	font-size: larger;
	font-family: "League Spartan", sans-serif;
	font-optical-sizing: auto;
	font-style: normal;
	font-weight: 500;
	padding-top: 5px;
	border-radius: 5px;

	background-color: #c3c3c3;
	color: white;
	text-shadow: 1px 1px 2px #000000;
}

.smith_disabledButton
{
	font-size: larger;
	font-family: "League Spartan", sans-serif;
	font-optical-sizing: auto;
	font-style: normal;
	font-weight: 500;
	padding-top: 5px;
	border-radius: 5px;

	background-color: #3c3c3c;
	border-color: #000;
	color: black;
	text-shadow: 0px 0px 1px #6e6e6e;
}