:root {
  --main_background:#002b36;
  --main_color:#839496;
  --green:#859900;
  --orange:#cb4b16;
  --red:#dc322f;
  --purple:#6c71c4;
  --gray:#586e75;
  --lightteal:#93a1a1;
  --lightgray:#777;
  --large:24pt;
  --normal:18pt;
  --small:16pt;
  --tiny:14pt;
  --tiniest:12pt;
}

body{
	background-color:var(--main_background);
	font-size:var(--normal);
	color:var(--main_color);
	font-family: 'Jost', sans-serif;
	margin:0;
	padding:0;
	overflow: auto;
	scrollbar-width: none; /* Firefox */
	-ms-overflow-style: none;  /* Internet Explorer 10+ */

	touch-action: auto;
	-webkit-touch-callout: none; /* iOS Safari */
		-webkit-user-select: none; /* Chrome/Safari/Opera */
		 -khtml-user-select: none; /* Konqueror */
			 -moz-user-select: none; /* Firefox */
				-ms-user-select: none; /* Internet Explorer/Edge */
						user-select: none; /* Non-prefixed version, currently
																	not supported by any browser */
}

body::-webkit-scrollbar { /* WebKit */
    width: 0;
    height: 0;
}

button.system{
	background-color:var(--main_background);
	font-size:var(--small);
	color:var(--main_color);
	border:2px solid var(--main_color);
	margin:0;
	padding:2px 5px;
	cursor: pointer;
}
button.system:disabled{
	background-color:var(--gray);
	font-size:var(--small);
	color:var(--lightteal);
	border:2px solid var(--main_color);
	margin:0;
	padding:2px 5px;
	cursor: default;
}
button.system_small{
	background-color:var(--main_background);
	font-size:var(--tiny);
	color:var(--main_color);
	border:2px solid var(--main_color);
	margin:0;
	padding:2px 5px;
	cursor: pointer;
}

button.button1{
	background-color:var(--main_background);
	font-size:var(--normal);
	color:var(--main_color);
	border:2px solid var(--main_color);
	margin:0;
	padding:2px 5px;
	cursor: pointer;
}
button.button1:disabled{
	background-color:var(--gray);
	font-size:var(--normal);
	color:var(--lightteal);
	border:2px solid var(--main_color);
	margin:0;
	padding:2px 5px;
	cursor: default;
}

button.button_prestige_show{
	background-color:var(--main_background);
	font-size:var(--tiny);
	color:var(--lightteal);
	border:2px solid var(--lightteal);
	margin:0;
	padding:2px 5px;
	cursor: pointer;
}
button.button_prestige_show:disabled{
	background-color:var(--gray);
	font-size:var(--tiny);
	color:var(--main_background);
	border:2px solid var(--main_color);
	margin:0;
	padding:2px 5px;
	cursor: default;
}

button.button_autofriend{
	background-color:var(--main_background);
	font-size:var(--tiniest);
	color:var(--lightteal);
	border:2px solid var(--lightteal);
	margin:0;
	padding:2px 5px;
	cursor: pointer;
}
button.button_autofriend:disabled{
	background-color:var(--gray);
	font-size:var(--tiniest);
	color:var(--main_background);
	border:2px solid var(--main_color);
	margin:0;
	padding:2px 5px;
	cursor: default;
}

button.button_abort{
	background-color:var(--main_background);
	font-size:var(--tiniest);
	color:var(--gray);
	border:2px solid var(--gray);
	margin:0;
	padding:2px 5px;
	cursor: pointer;
}
button.button_abort:hover{
	background-color:var(--main_background);
	font-size:var(--tiniest);
	color:var(--lightteal);
	border:2px solid var(--lightteal);
	margin:0;
	padding:2px 5px;
	cursor: pointer;
}


button.button_prestige2_upgrade{
	background-color:var(--main_background);
	font-size:var(--tiny);
	color:var(--lightteal);
	border:2px solid var(--lightteal);
	margin:0;
	padding:2px 5px;
	cursor: pointer;
}
button.button_prestige2_upgrade:disabled{
	background-color:var(--gray);
	font-size:var(--tiny);
	color:var(--main_background);
	border:2px solid var(--main_color);
	margin:0;
	padding:2px 5px;
	cursor: default;
}
button.fix{
	background-color:var(--main_background);
	font-size:var(--tiny);
	color:var(--main_color);
	border:2px solid var(--gray);
	margin:0;
	padding:2px 5px;
	cursor: pointer;
}

button{
	font-family: 'Jost', sans-serif;
  	font-optical-sizing: auto;
	font-weight: normal;
	font-style: normal;
	border-radius: 0.5vw;
}

button:active{transform: scale(98%);}



.large{font-size:var(--large);}
.normal{font-size:var(--normal);}
.small{font-size:var(--small);}
.tiny{font-size:var(--tiny);}

.main_background{color:var(--main_background);}
.main_color{color:var(--main_color);}
.red{color:var(--red);}
.pink{color:var(--pink);}
.orange{color:var(--orange);}
.purple{color:var(--purple);}
.green{color:var(--green);}
.teal{color:var(--teal);}
.lightteal{color:var(--lightteal);}
.gray{color:var(--gray);}
.blue{color:var(--blue);}
.yellow{color:var(--yellow);}

.large_purple{font-size:var(--large);color:var(--purple);}
.large_orange{font-size:var(--large);color:var(--orange);}
.large_lightteal{font-size:var(--large);color:var(--lightteal);}
.large_green{font-size:var(--large);color:var(--green);}
.small_purple{font-size:var(--small);color:var(--purple);cursor:pointer;}
.small_red{font-size:var(--small);color:var(--red);cursor:pointer;}
.small_green{font-size:var(--small);color:var(--green);cursor:pointer;}
.small_lightteal{font-size:var(--small);color:var(--lightteal);cursor:pointer;}
.tiny_gray{font-size:var(--tiny);color:var(--gray);}

a.lv_discord:link { color:var(--main_color); text-decoration:none;padding:0; margin: 0;}
a.lv_discord:visited { color:var(--main_color); text-decoration:none;padding:0; margin:0;}
a.lv_discord:hover { color:var(--main_color); text-decoration:none;padding:0; margin:0;}

a.lv_site:link { color:var(--orange); text-decoration:none;padding:0; margin: 0;}
a.lv_site:visited { color:var(--orange); text-decoration:none;padding:0; margin:0;}
a.lv_site:hover { color:var(--orange); text-decoration:none;padding:0; margin:0;}


div.story{
  margin: 0;
  padding: 15px 15px;
  width: 50%;
}

div.tagline{
  margin: 0;
  padding: 15px 15px;
}


table.borderless_container_0{
  padding: 0;
  border: 0px solid var(--main_color);
  border-spacing: 50px;
  margin: 0 -50px;
}
table.borderless_container_0 td{
  vertical-align: top;
}

table.borderless_container_1{
  margin: 0;
  padding: 15px 15px;
  width:30%;
}

table.borderless_container_2{
  margin: 0;
  padding: 15px 15px;
}
table.borderless_container_2 td.prestige{
  color: var(--gray);
  font-size: var(--small);
}

table.borderless_container_3{
  font-size:var(--normal);
  margin: 0 0 0 15px;
  padding: 0;
  border-collapse: collapse;
  width:25%;
}
table.borderless_container_3 td.store_item{
  border: 1px solid var(--main_color);
  text-align: center;
  vertical-align: top;
  padding: 10px;
}

table.borderless_container_4{
  font-size:var(--normal);
  margin: 0 0 0 15px;
  padding: 0;
  border-collapse: collapse;
  width:100%;
}
table.borderless_container_4 td.store_item{
  border: 1px solid var(--main_color);
  text-align: center;
  vertical-align: top;
  padding: 10px;
}
table.borderless_container_4 td.centered_item{
  border: 1px solid var(--main_color);
  text-align: center;
  vertical-align: center;
  padding: 10px;
}
table.borderless_container_4 td.empty{
  border: 0px solid var(--main_color);
  text-align: center;
  vertical-align: top;
  padding: 0 0 30px 0;
}
table.borderless_container_4 td.map_caption{
  border: 0px solid var(--main_color);
  text-align: center;
  vertical-align: top;
  padding: 0;
}


table.borderless_container_5{
  font-size:var(--small);
  margin: 15px 0 0 auto;
  padding: 0;
  border-collapse:collapse;
  width:50%;
  border: 0px solid #fff;
}
table.borderless_container_5 td.store_item{
  border: 1px solid var(--main_color);
  text-align: center;
  vertical-align: center;
  padding: 1px 10px 5px 10px;
}

#label_bananas{
  font-weight: bold;
}


path{
  fill:var(--main_color);
  cursor: pointer;
}
path:hover {
  stroke-width:10px;
  stroke:var(--lightgray);
}
path.selected{
  cursor: default;
  fill: var(--orange);
}
path.selected:hover{
  cursor: default;
  stroke-width:0px;
}
path.complete{
  opacity: 0.5;
  cursor: default;
}
path.complete:hover{
  stroke-width:0px;
  cursor: default;
}












div.footer {
  box-sizing: border-box;
	font-size: var(--info);
	position: fixed;
	bottom: 0%;
	margin: 0 auto 0 auto;
  padding: 5px 0px;
	width:100%;
  color: var(--gray);
	background-color: var(--main_background);
  border: 0px solid var(--gray);
  border-top: 2px solid var(--main_color);
}
.footer_item1{
	width: 100%;
	margin: none;
	padding: none;
	padding-right: 7px;
	padding-left: 5px;
	border-right: 1px solid #555;
}

.footer_item2{/*last element*/
	width: 100%;
	margin: none;
	padding: none;
	padding-right: 7px;
	padding-left: 5px;
	border-right: 0px solid #555;
}

.signature{
	border: 0px solid #777;
	float: right;
	margin-right: 0px;
}

table.settings{
  width:35%;
	vertical-align:top;
	border:0px solid var(--main_color);
	border-collapse: separate;
	border-spacing: 2px;
	color: var(--main_color);
  background-color:var(--main_background);
  margin: 0px;
  padding: 0px;
}
table.settings td{
  border:1px solid var(--gray);
  padding: 2px;
  text-align: center;
}
table.settings td.empty{
  border:0px solid var(--main_color);
  padding: 2px;
  text-align: center;
}
div.textarea{
	margin: auto;
	padding: 0px;
  	font-size: var(--small);
	color:var(--main_color);
  	background-color:var(--main_background);
	width: 350px;
	height: 30px;
	text-align: justify;
	word-break:break-all;
	border: 2px solid var(--main_color);
	overflow: hidden;
}


table.settings_confirm{
	width: 50%;
	margin: 20px auto;
	padding: 0px;
	border-collapse: collapse;
	border: 0px;
	font-size: var(--tiny);
	text-align: center;
}
table.settings_confirm td{
	border:0px solid var(--main_color);
}
table.settings_confirm td.text_right{
	text-align: right;
}
table.settings_confirm td.text_left{
	text-align: left;
}



div.pb_background{
  background-color:var(--main_background);
  border: 0px solid var(--gray);
}
div.pb_eat{
  background-color:var(--gray);
  color:var(--main_background);
  height:30px;
  width:0%;
}
div.pb_regular{
  background-color:var(--gray);
  color:var(--main_background);
  height:20px;
  width:0%;
  margin: 15px 0
}


input.lever{
	-webkit-appearance: none;
  height: 15px;
  background: var(--lightteal);
  outline: none;
  opacity: 1;
  -webkit-transition: .2s;
  transition: opacity .2s;
}

input.lever::-webkit-slider-thumb{
	-webkit-appearance: none; /* Override default look */
 appearance: none;
 border-radius: 0px;
 width: 15px; /* Set a specific slider handle width */
 height: 15px; /* Slider handle height */
 background: var(--gray); /* Blue background */
 cursor: pointer; /* Cursor on hover */
}

input.lever::-moz-range-thumb {
	border-radius: 0px;
  width: 15px; /* Set a specific slider handle width */
  height: 15px; /* Slider handle height */
  background: var(--gray); /* Blue background */
  cursor: pointer; /* Cursor on hover */
}