:root
{
	--pad: 5px;
	
	--padding: 10px;
	
	--slate: rgba(30, 30, 30, 0.95);
	
	--dark_slate: rgba(0, 0, 0, 0.95);
	
	--banner_padding: 40px;
	
	--trex_red: #A21C1C;
	
	--red: #A21C1C;
	
	--light_red: rgba(199, 119, 119, 0.9);
	
	--dark_red: #6D0404;
	
	--trex_dark_red: #6D0404;
	
	--dark_green: rgba(40, 85, 70, 0.95);
	
	--green: rgba(91, 121, 114, 0.9);
	
	--light_green: rgba(124, 148, 142, 0.9);
	
	--blue: rgba(85, 130, 170, 0.9);
	
	--light_blue: rgba(109, 150, 191, 0.9);
}

a
{
	color: #333333;
	
	text-decoration: underline;
	
	cursor: pointer;
}

a:hover
{
	text-decoration: none;
}

body
{
	background-color: #333333;
	
	margin: 0px !important;
	
	padding: 0px;
	
	width: 100%;
	
	/*font-family: Verdana, sans-serif;*/
	
	/*font-family: Georgia, serif;*/
	
	font-family: "Trebuchet MS", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Tahoma, sans-serif;
	
	color: #FFFFFF;
	
	overflow-y: hidden;
}

div
{
	display: inline-block;
	
	font-size: 14px;
}

input
{
	padding: 4px;
	
	border: solid 1px #ccc;
	
	font-family: "Trebuchet MS", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Tahoma, sans-serif;
	
	font-size: 14px;
}

table
{
	border-spacing: 0px;
	
    border-collapse: separate;
	
	font-size: 14px;
}

tbody td
{
	padding: var(--padding);
}

tbody tr
{
	background-color: rgba(0, 0, 0, 0.02);
}

tbody tr:nth-child(odd of .market_inventory_row)
{
	background-color: rgba(0, 0, 0, 0.08);
}

tbody tr:nth-child(odd of .market_inventory_row):hover
{
	background-color: rgba(255, 255, 255, 0.1);
}

textarea
{
	padding: 4px;
	
	border: solid 1px #ccc;
	
	font-family: "Trebuchet MS", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Tahoma, sans-serif;
	
	font-size: 14px;
}

th
{
	padding: var(--padding);
	
	background-color: rgba(0, 0, 0, .15);
}

/*thead tr:first-of-type th:first-of-type
{
	border-top-left-radius: var(--padding);
}

thead tr:first-of-type th:last-of-type
{
	border-top-right-radius: var(--padding);
}

tr:last-of-type td:first-of-type 
{
	border-bottom-left-radius: var(--padding);
}

tr:last-of-type td:last-of-type 
{
	border-bottom-right-radius: var(--padding);
}*/

#body
{
	font-size: 0px;
	
	overflow-y: hidden;
}

#background
{
	background-image: url("../assets/images/farm-md.jpg");
	
	background-repeat: no-repeat;
	
	background-size: cover;
	
	background-position: center;
	
	position: fixed;
	
	z-index: 1;
}

#content
{
	display: block;
	
	position: relative;
	
	z-index: 10;
	
	/*background-color: rgba(255, 255, 255, 0.9);*/
	
	/*background-color: var(--dark_slate);*/
	
	color: #333333;
	
	font-size: 0px;
	
	overflow-y: auto;
	
	height: calc(100% - 52px);
}

.content_container
{
	display: block;
	
	margin: 0 auto;
	
	width: calc(100% - 40px);
	
	max-width: 1000px;
	
	background-color: rgba(255, 255, 255, 0.5);
	
	border-radius: 10px;
	
	padding: 10px;
	
	margin-top: 10px;
	
	margin-bottom: 10px;
}

#header
{
	position: relative;
	
	display: block;
	
	z-index: 10;
	
	background-color: var(--dark_slate);
	
	width: calc(100% - 10px);
	
	padding: 5px;
	
	-webkit-user-select: none;
	
	-ms-user-select: none;
	
	user-select: none;
	
	height: 42px;
}

#header_logo
{
	vertical-align: middle;
	
	height: 42px;
}

#header_text
{
	vertical-align: middle;
	
	font-size: 16px;
	
	font-weight: bold;
	
	margin-left: 10px;
}

#header_menu
{
	background-color: var(--slate);
	
	z-index: 15;
	
	position: absolute;
	
	right: 0px;
	
	text-align: right;
	
	-webkit-user-select: none;
	
	-ms-user-select: none;
	
	user-select: none;
	
	display: none;
}

.header_menu_button
{
	width: 100px;
	
	display: block;
	
	padding: 10px;
	
	padding-right: 20px;
	
	font-size: 16px;
	
	font-weight: bold;
	
	cursor: pointer;
}

.header_menu_button:hover
{
	background-color: rgba(255, 255, 255, 0.2);
}

#header_menu_container
{
	position: relative;
	
	float: right;
	
	cursor: pointer;
}

#header_menu_logo
{
	vertical-align: middle;
	
	height: 42px;
}

#header_menu_text
{
	vertical-align: middle;
	
	font-size: 16px;
	
	font-weight: bold;
	
	margin-right: 10px;
}

#left_view_button
{
	display: none;
	
	position: absolute;
	
	height: 50px;
	
	width: 50px;
	
	left: 0px;
	
	top: 0px;
}

#navbar
{
	display: block;
	
	position: relative;
	
	background-color: var(--dark_slate);
	
	text-align: right;
	
	/*padding: 10px 10px 10px 10px;*/
}

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

#market_toolbar
{
	width: 100%;
	
	height: 35px;
	
	background-color: var(--slate);
	
	vertical-align: middle;
}

#market_desktop
{
	width: 100%;
	
	height: calc(100% - 35px);
	
	background-color: rgba(255, 255, 255, 0.9);
	
	vertical-align: top;
}

/*#market_info_container
{
	position: absolute;
	
	background-color: rgba(255, 255, 255, .2);
	
	padding: var(--padding);
	
	border-radius: var(--padding);
	
	top: var(--padding);
	
	height: calc(100% - 4 * var(--padding));
	
	right: calc(var(--padding));
	
	width: calc(100% - 350px - 7 * var(--padding));
	
	overflow-x: hidden;
	
	overflow-y: scroll;
	
	-ms-overflow-style: none;
  
	scrollbar-width: none;
}

#market_info_container::-webkit-scrollbar
{
	display: none;
}*/

#market_tree_container
{
	position: absolute;
	
	background-color: rgba(255, 255, 255, .2);
	
	padding: var(--padding);
	
	border-radius: var(--padding);
	
	width: 350px;
	
	top: var(--padding);
	
	height: calc(100% - 4 * var(--padding));
	
	overflow-x: hidden;
	
	overflow-y: scroll;
	
	-ms-overflow-style: none;
  
	scrollbar-width: none;
}

#market_tree_container::-webkit-scrollbar
{
	display: none;
}

#market_tree_container .tree_node
{
	display: block;
	
	padding: calc(1.5 * var(--padding));
	
	border-radius: var(--padding);
}

#market_tree_container .tree_node:hover
{
	background-color: rgba(0, 0, 0, .05);
}

#market_tree_container .tree_node.selected
{
	background-color: var(--dark_green);
	
	color: white;
}

#modal
{
	display: none;
	
	z-index: 20;
	
	background-color: rgba(10, 10, 10, 0.95);
	
	position: fixed;
	
	top: calc(5%);
	
	left: calc(50% - 270px);
	
	text-align: center;
	
	overflow-y: auto;
	
	height: calc(90%);
	
	width: calc(90%);
	
	max-width: 540px;
	
	-webkit-user-select: none;
	
	-ms-user-select: none;
	
	user-select: none;
}

#modal_button
{
	position: absolute;
	
	bottom: 0;
	
	left: 0;
	
	background-color: var(--dark_green);
	
	width: calc(100% - 2 * var(--padding));
	
	padding: var(--padding);
	
	height: 30px;
	
	display: flex;
	
	align-items:center;
	
    justify-content:center;
	
	cursor: pointer;
	
	font-size: 18px;
	
	font-weight: bold;
}

#modal_button:hover
{
	background-color: var(--green);
}

#modal_button.blue
{
	background-color: var(--blue);
}

#modal_button.blue:hover
{
	background-color: var(--light_blue);
}

#modal_button.red
{
	background-color: var(--red);
}

#modal_button.red:hover
{
	background-color: var(--light_red);
}

#modal_button.three_button
{
	width: calc(33.3% - 2 * var(--padding));
}

#modal_button.two_button
{
	width: calc(50% - 2 * var(--padding));
}

#modal_close
{
	position: absolute;
	
	top: 0;
	
	right: 0;
	
	display: flex;
	
	align-items:center;
	
    justify-content:center;
	
	padding: var(--padding);
	
	width: 30px;
	
	height: 30px;
	
	background-color: var(--red);
	
	font-size: 18px;
	
	font-weight: bold;
	
	cursor: pointer;
}

#modal_close:hover
{
	background-color: var(--dark_red);
}

#modal_content
{
	position: absolute;
	
	top: 50px;
	
	left: 0;
	
	width: 100%;
	
	height: calc(100% - 100px);
	
	text-align: center;
	
	overflow-x: hidden;
	
	overflow-y: scroll;
	
	-ms-overflow-style: none;
  
	scrollbar-width: none;
}

#modal_content::-webkit-scrollbar
{
	display: none;
}

#modal_content .inventory_row
{
	white-space: nowrap;
	
	text-overflow: ellipsis;
}

#modal_content .inventory_row.desired
{
	background-color: var(--dark_green);
}

#modal_content .inventory_row input
{
	padding: 3px;
	
	font-size: 12px;
}

#modal_content #trade_options
{
	height: calc(100% - 120px);
	
	overflow-x: hidden;
	
	overflow-y: scroll;
	
	-ms-overflow-style: none;
  
	scrollbar-width: none;
}

#modal_content #trade_options::-webkit-scrollbar
{
	display: none;
}

#modal_content #trade_summary
{
	height: 120px;
	
	background-color: rgba(255, 255, 255, 0.1);
	
	font-size: 14px;
	
	position: absolute;
	
	bottom: 0px;
	
	left: 0px;
}

#modal_header
{
	height: 50px;
	
	width: 100%;
	
	position: absolute;
	
	top: 0;
	
	left: 0;
}

#modal_title
{
	position: absolute;
	
	top: 0;
	
	left: 0;
	
	display: flex;
	
	align-items:center;
	
    justify-content:center;
	
	background-color: rgba(255, 255, 255, 0.2);
	
	font-size: 18px;
	
	font-weight: bold;
	
	padding: var(--padding);
	
	width: calc(100% - 50px - 2 * var(--padding));
	
	height: 30px;
}

#modal a
{
	color: var(--light_red);
}

#modal a:hover
{
	color: var(--red);
}

#modal tbody tr
{
	background-color: rgba(100, 100, 100, .1);
	
	cursor: default;
}

#modal tbody tr:nth-child(odd)
{
	background-color: rgba(100, 100, 100, .2);
}

#modal tbody tr .clickable:hover
{
	cursor: pointer;
	
	background-color: rgba(100, 100, 100, .3);
}

#modal td.bg_dark_green.clickable:hover
{
	background-color: var(--green); 
}

#modal th
{
	background-color: rgba(100, 100, 100, .4);
}

#overlay
{
	display: block;
	
	position: relative;
	
	z-index: 10;
}

#page
{
	width: 100%;
	
	display: block;
	
	position: relative;
	
	background-color: rgba(255, 255, 255, 0.9);
	
	color: #333333;
	
	padding-top: var(--banner_padding);
}

.article
{
	display: inline-block;
	
	margin-top: var(--padding);
	
	width: calc(100% - 2 * var(--padding));
	
	background-color: rgb(190, 210, 190);
	
	padding: var(--padding);
	
	border-radius: var(--padding);
}

.article.toggled
{
	background-color: rgb(190, 210, 190);
}

.article_date
{
	font-size: 12px;
	
	display: block;
}

.article_header
{
	width: calc(100% - 150px - var(--padding));
	
	text-align: left;
}

.article_headline
{
	font-weight: bold;
	
	display: block;
	
	margin-top: var(--padding);
}

.article_toggle
{
	width: calc(100% - 2 * var(--padding));
	
	padding: var(--padding);
	
	border-radius: 10px;
	
	background-color: rgb(180, 200, 180);
	
	cursor: pointer;
}

.article_toggle:hover
{
	background-color: rgb(170, 190, 170);
}

.article_thumbnail
{
	float: left;
	
	margin-right: var(--padding);
}

.article_thumbnail img
{
	width: 150px;
	
	border-radius: 10px;
}

.article_summary
{
	
}

.article_text
{
	background-color: rgb(180, 200, 180);
	
	padding: var(--padding);
	
	margin-top: var(--padding);
	
	border-radius: 10px;
	
	text-align: left;
}

.avatar
{
	border-radius: 50%;
}

.avatar_container
{
	width: calc(25% - 2 * var(--padding));
}

.avatar_container.selected
{
	background-color: var(--dark_green);
}

.avatar_container img
{
	width: 100%;
}

.bg_black_0
{
	background-color: rgba(0, 0, 0, 1.0);
}

.bg_black_0.clickable:hover
{
	background-color: rgba(0, 0, 0, .9);
}

.bg_black_1
{
	background-color: rgba(0, 0, 0, .1);
}

.bg_black_1.clickable:hover
{
	background-color: rgba(0, 0, 0, .2);
}

.bg_black_3
{
	background-color: rgba(0, 0, 0, .3);
}

.bg_black_3.clickable:hover
{
	background-color: rgba(0, 0, 0, .4);
}

.bg_black_5
{
	background-color: rgba(0, 0, 0, .5);
}

.bg_black_5.clickable:hover
{
	background-color: rgba(0, 0, 0, .6);
}

.bg_black_7
{
	background-color: rgba(0, 0, 0, .7);
}

.bg_black_7.clickable:hover
{
	background-color: rgba(0, 0, 0, .8);
}

.bg_blue_0
{
	background-color: rgba(80, 120, 170, 1.0);
}

.bg_blue_0.clickable:hover
{
	background-color: rgba(80, 120, 170, 0.9);
}

.bg_blue_1
{
	background-color: rgba(80, 120, 170, .1);
}

.bg_blue_1.clickable:hover
{
	background-color: rgba(80, 120, 170, .2);
}

.bg_blue_3
{
	background-color: rgba(80, 120, 170, .3);
}

.bg_blue_3.clickable:hover
{
	background-color: rgba(80, 120, 170, .4);
}

.bg_blue_5
{
	background-color: rgba(80, 120, 170, .5);
}

.bg_blue_5.clickable:hover
{
	background-color: rgba(80, 120, 170, .6);
}

.bg_blue_7
{
	background-color: rgba(80, 120, 170, .7);
}

.bg_blue_7.clickable:hover
{
	background-color: rgba(80, 120, 170, .8);
}

.bg_green_0
{
	background-color: rgba(110, 180, 110, 1.0);
}

.bg_green_0.clickable:hover
{
	background-color: rgba(110, 180, 110, 0.9);
}

.bg_green_1
{
	background-color: rgba(110, 180, 110, .1);
}

.bg_green_1.clickable:hover
{
	background-color: rgba(110, 180, 110, .2);
}

.bg_green_3
{
	background-color: rgba(110, 180, 110, .3);
}

.bg_green_3.clickable:hover
{
	background-color: rgba(110, 180, 110, .4);
}

.bg_green_5
{
	background-color: rgba(110, 180, 110, .5);
}

.bg_green_5.clickable:hover
{
	background-color: rgba(110, 180, 110, .6);
}

.bg_green_7
{
	background-color: rgba(110, 180, 110, .7);
}

.bg_green_7.clickable:hover
{
	background-color: rgba(110, 180, 110, .8);
}

.bg_red_0
{
	background-color: rgba(230, 70, 70, 1.0);
}

.bg_red_0.clickable:hover
{
	background-color: rgba(230, 70, 70, 0.9);
}

.bg_red_1
{
	background-color: rgba(230, 70, 70, .1);
}

.bg_red_1.clickable:hover
{
	background-color: rgba(230, 70, 70, .2);
}

.bg_red_3
{
	background-color: rgba(230, 70, 70, .3);
}

.bg_red_3.clickable:hover
{
	background-color: rgba(230, 70, 70, .4);
}

.bg_red_5
{
	background-color: rgba(230, 70, 70, .5);
}

.bg_red_5.clickable:hover
{
	background-color: rgba(230, 70, 70, .6);
}

.bg_red_7
{
	background-color: rgba(230, 70, 70, .7);
}

.bg_red_7.clickable:hover
{
	background-color: rgba(230, 70, 70, .8);
}

.bg_white_0
{
	background-color: rgba(255, 255, 255, 1.0);
}

.bg_white_0.clickable:hover
{
	background-color: rgba(255, 255, 255, 0.9);
}

.bg_white_1
{
	background-color: rgba(255, 255, 255, .1);
}

.bg_white_1.clickable:hover
{
	background-color: rgba(255, 255, 255, .2);
}

.bg_white_3
{
	background-color: rgba(255, 255, 255, .3);
}

.bg_white_3.clickable:hover
{
	background-color: rgba(255, 255, 255, .4);
}

.bg_white_5
{
	background-color: rgba(255, 255, 255, .5);
}

.bg_white_5.clickable:hover
{
	background-color: rgba(255, 255, 255, .6);
}

.bg_white_7
{
	background-color: rgba(255, 255, 255, .7);
}

.bg_white_7.clickable:hover
{
	background-color: rgba(255, 255, 255, .8);
}

.bgc0
{
	background-color: transparent;
}

.bgc1
{
	background-color: rgba(46, 139, 87, .1);
}

.bgc2
{
	background-color: rgba(46, 139, 87, .2);
}

.bgc3
{
	background-color: rgba(46, 139, 87, .3);
}

.bgc4
{
	background-color: rgba(46, 139, 87, .4);
}

.bg_dark_green
{
	background-color: var(--dark_green);
}

.bg_dark_green.clickable:hover
{
	background-color: var(--green);
}

.bg_dark_red
{
	background-color: var(--dark_red);
}

.bg_dark_red.clickable:hover
{
	background-color: var(--red);
}

.bg_green
{
	background-color: var(--green);
}

.bg_light_blue
{
	background-color: var(--light_blue);
}

.bg_light_blue.clickable:hover
{
	background-color: var(--blue);
}

.bg_light_green
{
	background-color: var(--light_green);
}

.bg_light_green.clickable:hover
{
	background-color: var(--green);
}

.bg_light_red
{
	background-color: var(--light_red);
}

.bg_light_red.clickable:hover
{
	background-color: var(--red);
}

.bg_red
{
	background-color: var(--red);
}

.bg_red.clickable:hover
{
	background-color: var(--dark_red);
}

.break 
{
	flex-basis: 100%;
	
	height: 0;
}

.button
{
	padding: 15px 25px 15px 25px;
	
	font-family: Georgia, serif;
	
	font-size: 16px;
	
	font-weight: bold;
	
	color: #FFFFFF;
	
	border: none;
	
	border-radius: 0px;
}

.button:hover
{
	cursor: pointer;
	
	background-color: var(--dark_slate);
}

.button_header
{
	border-radius: var(--padding);
	
	background-color: rgb(220, 220, 220);
	
	display: inline-block;
	
	width: calc(100% - 2 * var(--padding));
	
	max-width: 1200px;
	
	padding: var(--padding);
	
	cursor: pointer;
	
	font-size: 24px;
	
	font-weight: bold;
}

.button_header:hover
{
	background-color: rgb(200, 220, 200);
}

.button_red
{
	padding: 15px 25px 15px 25px;
	
	background-color: var(--trex_red);
	
	font-family: Georgia, serif;
	
	font-size: 16px;
	
	font-weight: bold;
	
	color: #FFFFFF;
	
	border: none;
	
	border-radius: 0px;
}

.button_red:hover
{
	cursor: pointer;
	
	background-color: var(--trex_dark_red);
}

.center
{
	text-align: center;
}

.center_vertical
{
	display: flex;
	
	align-items: center;
}

.clickable
{
	cursor: pointer;
}

.clickable:hover
{
	background-color: rgba(255, 255, 255, 0.1);
}

.clickable.hover_bg_dark:hover
{
	background-color: rgba(0, 0, 0, 0.1);
}

.column_left
{
	width: calc(100%);
	
	float: left;
	
	table-layout: fixed;
}

.column_right
{
	width: calc(100%);
	
	float: right;
	
	table-layout: fixed;
}

.col_left
{
	display: inline-block;
	
	width: calc(30%);
	
	text-align: right;
	
	vertical-align: top;
	
	padding-right: 20px;
}

.col_right
{
	display: inline-block;
	
	width: calc(65%);
	
	text-align: left;
}

.container
{
	display: inline-block;
	
	position: relative;
	
	vertical-align: top;
}

.currency_wrap
{
	position: relative;
}

.currency_wrap input
{
	padding-left: 12px !important;
}
	
.currency_code
{
	position: absolute;
	
	left: 3px;
	
	top: 2px;
	
	color: black;
	
	/*font-family: "Trebuchet MS", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Tahoma, sans-serif;*/
	
	/*font-family: Georgia, serif;*/
	
	font-size: 14px;
}

.currency_text
{
	border: solid 0px #ccc;
	
	font-family: "Trebuchet MS", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Tahoma, sans-serif;
	
	font-size: 14px;
}

.dashboard
{
	display: block;
	
	position: relative;
	
	width: 100%;
	
	height: 100%;
	
	font-size: 0px;
	
	-webkit-user-select: none;
	
	-ms-user-select: none;
	
	user-select: none;
	
	overflow-x: hidden;
	
	overflow-y: hidden;
}

.dashboard #left_view
{
	background-color: rgba(255, 255, 255, 0.9);
	
	display: inline-block;
	
	position: relative;
	
	height: 100%;
	
	width: 400px;
	
	font-size: 14px;
	
	border-right: solid 0px rgba(0, 0, 0, .8);
}

.dashboard #left_view .canvas
{
	background-color: rgba(0, 0, 0, 0.1);
}

.dashboard .widget_search
{
	height: 100%
}

.dashboard .module
{
	display: inline-block;
	
	position: relative;
	
	width: 100%;
	
	height: 100%;
	
	overflow: hidden;
	
	font-size: 0px;
}

.dashboard .module .toolbar
{
	display: none;
	
	align-items: center;
	
	justify-content: left;
	
	position: relative;
	
	width: calc(100%);
	
	height: 50px;
	
	background-color: rgba(0, 0, 0, 0.8);
	
	vertical-align: middle;
	
	color: white;
}

.dashboard .module .canvas
{
	display: block;
	
	position: relative;
	
	width: calc(100%);
	
	height: calc(100%);
	
	overflow-x: hidden;
	
	overflow-y: auto;
	
	-ms-overflow-style: none;
  
	scrollbar-width: none;
	
	font-size: 0px;
}

.dashboard .module .canvas::-webkit-scrollbar
{
    display: none;
}

.dashboard .module .canvas tbody
{
	overflow-y: scroll;
	
	-ms-overflow-style: none;
  
	scrollbar-width: none;
}

.dashboard .module .canvas tbody::-webkit-scrollbar
{
    display: none;
}

.dashboard .module .canvas #market_tree
{
	display: block;
	
	position: relative;
	
	width: calc(100%);
}

.dashboard .module .canvas .selection_data
{
	height: calc(100% - 50px);
	
	width: 100%;
}

.dashboard .module .canvas .selection_summary
{
	width: 100%;
	
	height: 230px;
	
	display: none;
	
	position: relative;
}

.dashboard .module .canvas .selection_summary .selection_summary_graphs
{
	vertical-align: top;
	
	width: calc(100% - 410px);
	
	height: calc(100%);
	
	position: relative;
	
	/*background-color: rgba(0, 0, 0, 0.1);*/
}

.dashboard .module .canvas .selection_summary .selection_summary_graphs canvas
{
	/*width: calc(50%) !important;
	
	height: calc(100%) !important;*/
	
	/*background-color: rgba(0, 0, 0, 0.1);*/
}

.dashboard .module .canvas .selection_summary .selection_summary_text
{
	vertical-align: top;
	
	width: calc(400px);
	
	height: calc(100% - 10px);
	
	padding: 5px;
	
	/*background-color: rgba(0, 0, 0, 0.1);*/
}

.dashboard .module .canvas .selection_summary .selection_summary_text .left
{
	width: calc(50% - 20px);
	
	padding: 10px;
	
	text-align: right;
}

.dashboard .module .canvas .selection_summary .selection_summary_text .right
{
	width: calc(50% - 10px);
	
	padding: 5px;
}

.dashboard .module .canvas .selection_title
{
	width: 100%;
	
	height: 50px;
	
	/*background-color: rgba(0, 0, 0, 0.1);*/
	
	font-weight: bold;
	
	color: white;
	
	display: flex;
	
	justify-content: center;
	
	align-items: center;
	
	position: relative;
}

.dashboard .module .canvas #selection_viewer
{
	height: 100%;
	
	width: 100%;
	
	overflow: hidden;
	
	font-size: 0px;
}

.dashboard .module .canvas .tree_node
{
	display: block;
	
	position: relative;
	
	width: calc(100% - 28px);
	
	padding: 14px;
	
	cursor: pointer;
	
	white-space: nowrap;
	
	text-overflow: ellipsis;
}

.dashboard .module .canvas .tree_node .title_div
{
	white-space: nowrap;
	
	text-overflow: ellipsis;
}

.dashboard .module .canvas .tree_node:hover
{
	background-color: rgba(0, 0, 0, .1);
}

.dashboard .module .canvas .tree_node.selected
{
	background-color: rgba(0, 0, 0, .2);
}

.dashboard .module .container
{
	overflow-y: scroll;
	
	-ms-overflow-style: none;
  
	scrollbar-width: none;
}

.dashboard .module .container::-webkit-scrollbar
{
    display: none;
}

.dashboard .module .widget_search
{
	height: 100%;
	
	width: 100%;
}

.dashboard .module .map_button
{
	display: none;
}

.dashboard #right_view
{
	background-color: rgba(255, 255, 255, 0.9);
	
	display: inline-block;
	
	position: relative;
	
	height: 100%;
	
	width: calc(100% - 400px);
	
	font-size: 14px;
	
	overflow: hidden;
}

/*
.dashboard
{
	display: inline-block;
	
	border-radius: 10px;
	
	padding: var(--padding);
	
	background-color: rgba(46, 139, 87, .1);
	
	width: calc(100% - 4 * var(--padding));
	
	margin-top: var(--padding);
}

.dashboard .element
{
	padding: var(--padding);
	
	background-color: rgba(46, 139, 87, .1);
	
	border-radius: 10px;
	
	width: calc(100% - 2 * var(--padding));
	
	margin-top: var(--padding);
	
	overflow-x: auto;
}

.dashboard .element.clear
{
	background-color: transparent;
}

.dashboard .element.bgc0
{
	background-color: transparent;
}

.dashboard .element.bgc1
{
	background-color: rgba(46, 139, 87, .1);
}

.dashboard .element.bgc2
{
	background-color: rgba(46, 139, 87, .2);
}

.dashboard .element.bgc3
{
	background-color: rgba(46, 139, 87, .3);
}

.dashboard .element.bgc4
{
	background-color: rgba(46, 139, 87, .4);
}

.dashboard .element:first-child
{
	margin-top: 0px;
}

.dashboard .clickable:hover
{
	background-color: rgba(46, 139, 87, .3);
}

.dashboard .element.half
{
	width: calc(50% - 2.5 * var(--padding));
}

.dashboard .element.half + .element.half
{
	margin-left: var(--padding);
}

.dashboard .item
{
	padding: var(--padding);
	
	background-color: rgba(46, 139, 87, .1);
	
	border-radius: 10px;
}

.dashboard .title
{
	font-size: 18px;
	
	font-weight: bold;
	
	padding: calc(1 * var(--padding));
	
	width: calc(100% - 2 * var(--padding));
}

.dashboard > .title
{
	padding: 20px;
	
	width: calc(100% - 2 * var(--padding));
}*/

.fh
{
	height: 100%;
}

.fh_hh
{
	height: 100%;
}

.flex_block
{
	display: flex;
	
	flex-wrap: wrap;
	
	position: relative;
}

.flex_center
{
	display: inline-flex;
	
	align-items: center;
}

.flex_inline
{
	display: inline-flex;
	
	flex-wrap: wrap;
	
	position: relative;
}

.flex_inline_center
{
	display: inline-flex;
	
	justify-content: center;
	
	align-items: center;
	
	position: relative;
}

.flex_hcenter
{
	justify-content: center;
}

.flex_hleft
{
	justify-content: left;
}

.flex_hright
{
	justify-content: right;
}

.flex_vbottom
{
	align-items: bottom;
}

.flex_vcenter
{
	align-items: center;
}

.flex_vtop
{
	align-items: top;
}

.flex_center.text_center
{
	display: inline-flex;
	
	align-items: center;
	
	justify-content: center;
}

.fw
{
	width: 100%;
}

.fw.pad
{
	width: calc(100% - 2 * var(--padding));
}

.fw.pad2
{
	width: calc(100% - 4 * var(--padding));
}

.fw.pad3
{
	width: calc(100% - 6 * var(--padding));
}

.fw_hw
{
	width: 100%;
}

.fullwidth
{
	width: 100%;
}

.fullwidth_padded
{
	width: calc(100% - 2 * var(--padding));
	
	padding: var(--padding);
}

.hidden
{
	display: none;
}

.hw
{
	width: 50%;
}

.hw.pad
{
	width: calc(50% - 2 * var(--padding));
}

.hw.pad2
{
	width: calc(50% - 4 * var(--padding));
}

.hw.pad3
{
	width: calc(50% - 6 * var(--padding));
}

.hw_fw
{
	width: 50%;
}

.image_32
{
	max-height: 32px;
	
	max-width: 32px;
}

.image_256
{
	max-height: 256px;
	
	max-width: 256px;
}

.infocard
{
	display: none;
	
	clear: left;
	
	width: 100%;
	
	text-align: center;
	
	margin-top: var(--padding);
}

.infocard img
{
	border-radius: var(--padding);
	
	width: 100%;
}

a.leaflet-popup-close-button
{
	background-color: var(--light_red) !important;
	
	border-bottom-left-radius: 5px !important;
	
	border-bottom-right-radius: 5px !important;
	
	color: WHITE !important;
	
	position: absolute !important;
	
	top: 100% !important;
	
	width: calc(100% - 10px) !important;
	
	padding: 5px !important;
}

a.leaflet-popup-close-button:hover
{
	background-color: var(--red) !important;
}

.leaflet-popup-content
{
	margin: 0px;
	
	padding: 0px;
	
	width: 200px;
}

.leaflet-popup-content .position_container
{
	width: 100%;
	
	font-family: "Trebuchet MS", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Tahoma, sans-serif;
	
	font-size: 12px;
	
	cursor: pointer;
}

.leaflet-popup-content .position_container:hover
{
	background-color: #DDDDDD
}

.leaflet-popup-content .positions_container
{
	width: 100%;
	
	max-height: 400px;
}

.leaflet-popup-content-wrapper
{
	border-top-left-radius: 5px !important;
	
	border-top-right-radius: 5px !important;
	
	border-bottom-left-radius: 0px !important;
	
	border-bottom-right-radius: 0px !important;
}

.leaflet-popup-tip-container
{
	display: none;
}
/*
.leaflet-tooltip
{
	position: absolute;
	padding: 5px;
	background-color: rgba(0, 0, 0, 0.5);
	border: 0px solid #000;
	border-radius: 4px;
	color: #000;
	white-space: nowrap;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	pointer-events: none;
	box-shadow: 0 1px 3px rgba(0,0,0,0.4);
}*/

.leaflet-tooltip div
{
	display: block;
}

.leaflet-tooltip-left
{
	margin-right: 10px;
}
.leaflet-tooltip-right
{
	margin-left: 30px;
}

.leaflet-tooltip-left:before
{
	display: none;
	
	right: 0;
}
.leaflet-tooltip-right:before
{
	display: none;
	
	left: 0;
}

.list .list_item:last-child
{
	margin-bottom: 0px;
}

.list .toggled
{
	background-color: rgba(0, 0, 0, 0.2);
}

.list_item
{
	border-radius: var(--padding);
	
	background-color: rgba(0, 0, 0, 0.1);
	
	display: inline-block;
	
	width: calc(100% - 2 * var(--padding));
	
	padding: var(--padding);
	
	cursor: pointer;
	
	margin-bottom: 10px;
}

.list_item:hover
{
	background-color: rgba(0, 0, 0, 0.2);
}

.list_simple
{
	background-color: rgb(220, 220, 220);
	
	border-radius: var(--padding);
	
	width: calc(100% - 4 * var(--padding));
	
	padding: var(--padding);
	
	max-width: 1200px;
	
	display: inline-block;
}

.list_simple_container
{
	
}

.list_simple_header
{
	width: calc(100% - 2 * var(--padding));
	
	border-radius: var(--padding);
	
	padding: var(--padding);
	
	cursor: pointer;
	
	font-size: 24px;
	
	font-weight: bold;
}

.list_simple_header:hover
{
	background-color: rgb(190, 210, 190);
}

.list_simple_item
{
	width: calc(100% - 2 * var(--padding));
	
	border-radius: var(--padding);
	
	padding: var(--padding);
	
	cursor: pointer;
	
	font-size: 18px;
}

.list_simple_item:hover
{
	background-color: rgb(190, 210, 190);
}

.map_marker
{
	width: 0px !important;
	
	height: 0px !important;
	
	border: none !important;
}

.map_marker .icon
{
	position: absolute;
	
	width: 35px;
	
	height: 35px;
	
	bottom: 0px;
	
	background-image: url('../assets/images/corn_bordered.png');
	
	background-size: contain;
}

.map_marker .icon_market
{
	position: absolute;
	
	width: 35px;
	
	height: 35px;
	
	bottom: 0px;
	
	background-image: url('../assets/images/market/icons/market_icon.png');
	
	background-size: contain;
}

.map_marker .icon_market_inactive
{
	position: absolute;
	
	width: 35px;
	
	height: 35px;
	
	bottom: 0px;
	
	background-image: url('../assets/images/market/icons/market_icon_inactive.png');
	
	background-size: contain;
}

.map_marker .icon .listing_counter
{
	position: absolute;
	
	width: 16px;
	
	height: 16px;
	
	bottom: 0px;
	
	right: 0px;
	
	background-color: WHITE;
	
	border-radius: 50%;
	
	border: 1px solid #333333;
	
	font-size: 10px;
}

.map_marker .icon:hover
{
	background-image: url('../assets/images/corn.png');
}

.margin_bottom
{
	margin-bottom: var(--padding);
}

.margin_top
{
	margin-top: var(--padding);
}

.margin_right_10
{
	margin-right: 10px;
}

.node
{
	position: relative;
}

.node.l1
{
	width: calc(10%);
}

.node.l2
{
	width: calc(20%);
}

.node.l3
{
	width: calc(30%);
}

.node.l4
{
	width: calc(40%);
}

.node.l5
{
	width: calc(50%);
}

.node.l6
{
	width: calc(60%);
}

.node.l7
{
	width: calc(70%);
}

.node.l8
{
	width: calc(80%);
}

.node.l9
{
	width: calc(90%);
}

.node.l10
{
	width: calc(100%);
}

.node.l1.pad
{
	width: calc(10% - 2 * var(--padding));
}

.node.l2.pad
{
	width: calc(20% - 2 * var(--padding));
}

.node.l3.pad
{
	width: calc(30% - 2 * var(--padding));
}

.node.l4.pad
{
	width: calc(40% - 2 * var(--padding));
}

.node.l5.pad
{
	width: calc(50% - 2 * var(--padding));
}

.node.l6.pad
{
	width: calc(60% - 2 * var(--padding));
}

.node.l7.pad
{
	width: calc(70% - 2 * var(--padding));
}

.node.l8.pad
{
	width: calc(80% - 2 * var(--padding));
}

.node.l9.pad
{
	width: calc(90% - 2 * var(--padding));
}

.node.l10.pad
{
	width: calc(100% - 2 * var(--padding));
}

.node.l1.pad2
{
	width: calc(10% - 2 * var(--padding));
}

.node.l2.pad2
{
	width: calc(20% - 4 * var(--padding));
}

.node.l3.pad2
{
	width: calc(30% - 4 * var(--padding));
}

.node.l4.pad2
{
	width: calc(40% - 4 * var(--padding));
}

.node.l5.pad2
{
	width: calc(50% - 2 * var(--padding));
}

.node.l6.pad2
{
	width: calc(60% - 4 * var(--padding));
}

.node.l7.pad2
{
	width: calc(70% - 4 * var(--padding));
}

.node.l8.pad2
{
	width: calc(80% - 4 * var(--padding));
}

.node.l9.pad2
{
	width: calc(90% - 4 * var(--padding));
}

.node.l10.pad2
{
	width: calc(100% - 4 * var(--padding));
}

.node_container
{
	width: 100%;
	
	position: relative;
}

.no_scroll
{
	overflow-x: hidden !important;
	
	overflow-y: hidden !important;
}

.no_select
{
	-webkit-user-select: none;
	
	-ms-user-select: none;
	
	user-select: none;
}

.no_wrap
{
	overflow: hidden;
	
	white-space: nowrap;
	
	text-overflow: ellipsis;
	
	flex-wrap: nowrap;
}

.pad
{
	padding: var(--padding);
}

.pad2
{
	padding: calc(2 * var(--padding));
}

.pad3
{
	padding: calc(3 * var(--padding));
}

.pad_bottom
{
	padding-bottom: var(--padding);
}

.profile_container
{
	font-size: 0px;
	
	width: 100%;
}

.profile_container .about
{
	padding: var(--padding);
	
	width: calc(70% - 2 * var(--padding));
}

.profile_container .data
{
	padding: var(--padding);
	
	width: calc(70% - 2 * var(--padding));
}

.profile_container .image_container
{
	width: calc(30%);
	
	min-width: 148px;
	
	text-align: right;
}

.profile_container .image_container img
{
	width: 128px;
	
	padding: var(--padding);
	
	border-radius: 15%;
	
	margin-top: var(--padding);
}

.profile_container .info_container
{
	padding: var(--padding);
	
	width: calc(70% - 2 * var(--padding));
	
	font-size: 0px;
	
	vertical-align: top;
	
	max-width: calc(100% - 148px - 2 * var(--padding));
}

.profile_container .label
{
	padding: var(--padding);
	
	width: calc(30% - 2 * var(--padding));
	
	text-align: right;
	
	vertical-align: top;
}

.project_summary
{
	overflow: auto;
}

.project_summary img
{
	float: left;
	
	border-radius: var(--padding);
	
	margin-right: calc(2 * var(--padding));
	
	width: 150px;
}

.result_list
{
	width: 100%;
	
	font-size: 0px;
}

.result_list .result_row
{
	width: 100%;
	
	background-color: transparent;
}

.result_list .result_row:nth-of-type(odd)
{
	background-color: rgba(0, 0, 0, .05);
}

.result_list .result_row.clickable:hover
{
	background-color: rgba(0, 0, 0, .15);
}

.rounded
{
	border-radius: var(--padding);
}

.round_top
{
	border-top-left-radius: var(--padding);
	
	border-top-right-radius: var(--padding);
}

.round_bottom
{
	border-bottom-left-radius: var(--padding);
	
	border-bottom-right-radius: var(--padding);
}

/*thead tr:first-of-type th:first-of-type
{
	border-top-left-radius: var(--padding);
}

thead tr:first-of-type th:last-of-type
{
	border-top-right-radius: var(--padding);
}

tr:last-of-type td:first-of-type 
{
	border-bottom-left-radius: var(--padding);
}

tr:last-of-type td:last-of-type 
{
	border-bottom-right-radius: var(--padding);
}*/

.row
{
	display: block;
	
	width: calc(100% - 50px);
	
	background-color: rgba(255, 255, 255, 0.7);
	
	margin-top: 10px;
	
	padding: 25px;
	
	border-radius: 10px;
}

.row:first-child
{
	margin-top: 0px;
}

.scroll
{
	overflow-y: scroll;
	
	-ms-overflow-style: none;
  
	scrollbar-width: none;
}

.scroll::-webkit-scrollbar
{
	display: none;
}

.slate
{
	background-color: var(--slate);
}

.slate_dark
{
	background-color: var(--dark_slate);
}

.system_message
{
	position: fixed;
	
	top: 50%;
	
	left: 50%;
	
	transform: translate(-50%, -50%);
	
	z-index: 100;
	
	padding: 50px;
	
	background-color: var(--dark_green);
	
	border-radius: 5px;
	
	color: white;
	
	font-size: 18px;
	
	font-weight: bold;
}

.text_0
{
	font-size: 0px; 
}

.text_10
{
	font-size: 10px; 
}

.text_12
{
	font-size: 12px; 
}

.text_14
{
	font-size: 14px; 
}

.text_16
{
	font-size: 16px; 
}

.text_18
{
	font-size: 18px; 
}

.text_20
{
	font-size: 20px; 
}

.text_22
{
	font-size: 22px; 
}

.text_24
{
	font-size: 24px; 
}

.text_26
{
	font-size: 26px; 
}

.text_28
{
	font-size: 28px; 
}

.text_36
{
	font-size: 36px; 
}

.text_bold
{
	font-weight: bold;
}

.text_normal
{
	font-weight: normal;
}

.text_center
{
	text-align: center;
}

.text_italic
{
	font-style: italic;
}

.text_left
{
	text-align: left;
}

.text_right
{
	text-align: right;
}

.text_underline
{
	text-decoration: underline;
}

.text_white
{
	color: white;
}

.toggled
{
	background-color: rgb(200, 220, 200);
}

.tooltip
{
	position: relative;
}

.widget_search
{
	
}

.widget_search .search_input
{
	position: relative;
	
	display: block;
	
	margin: 0px;
	
	padding: 10px;
	
	height: calc(100% - 20px);
	
	width: calc(100% - 20px);
	
	border: none;
	
	outline: none;
}

.search_results
{
    position: absolute;
	
	top: 0px;
	
	display: none;
	
	list-style-type: none;
	
	background-color: rgb(255, 255, 255);
	
	z-index: 20;
	
	margin: 0px;
	
	padding: 0px;
	
	color: #333333;
	
	max-height: 100%;
	
	border-top: 1px solid #333333;
	
	width: 100%;
}

.search_results .result
{
	padding: 10px;
	
	width: calc(100% - 20px);
}

.search_results .result:hover
{
	background-color: rgb(180, 180, 180);
	
	cursor: pointer;
}

.tooltip::before,
.tooltip::after
{
	--scale: 0;
	
	--arrow_size: 12px;
	
	--tooltip_color: var(--dark_green);
	
	position: absolute;
	
	top: -.25rem;
	
	left: 50%;
	
	transform: translateX(-50%) translateY(var(--translate_y, 0)) scale(var(--scale));
	
	transition: 100ms transform;
	
	transform-origin: bottom center;
}

.tooltip::before
{
	--translate_y: calc(-100% - var(--arrow_size));
	
	padding: calc(2 * var(--padding));
	
	content: attr(data-tooltip);
	
	background: var(--tooltip_color);
	
	border-radius: var(--padding);
	
	width: max-content;
	
	max-width: 70%;
	
	color: white;
	
	text-align: center;
}

.tooltip::after
{
	--translate_y: calc(-1 * var(--arrow_size));
	
	content: '';
	
	border: var(--arrow_size) solid transparent;
	
	border-top-color: var(--tooltip_color);
	
	transform-origin: top center;
}

.tooltip:hover::before,
.tooltip:hover::after
{
	--scale: 1;
}

.w200
{
	width: 200px;
}

.width_parent
{
	width: 100%;
}

@media only screen and (max-width: 900px) 
{
	#left_view_button
	{
		display: inline-flex;
	}
	
	.col_left
	{
		width: calc(100% - 2 * var(--padding));
		
		text-align: left;
		
		padding: var(--padding);
		
		padding-bottom: 0px;
	}

	.col_right
	{
		width: calc(100% - 2 * var(--padding));
		
		padding: var(--padding);
	}
	
	.dashboard #left_view .market_tree .map_button
	{
		display: inline-flex;
	}
	
	.dashboard #left_view .market_tree .widget_search
	{
		width: calc(100% - 50px);
	}
	
	.dashboard #left_view
	{
		background-color: rgba(255, 255, 255, 0.95);
		
		display: none;
		
		position: absolute;
		
		height: 100%;
		
		width: 100%;
		
		right: 0px;
		
		z-index: 100;
	}
	
	.dashboard #left_view.visible
	{
		display: block;
	}
	
	.dashboard #left_view .widget_search
	{
		width: calc(100% - 50px);
	}
	
	.dashboard #right_view
	{
		display: block;
		
		position: absolute;
		
		height: 100%;
		
		width: 100%;
		
		left: 0px;
		
		z-index: 50;
	}
	
	.fh_hh
	{
		height: 50%;
	}
	
	.hw_fw
	{
		width: 100%;
	}
	
	
	/*
	
	#left_view_button
	{
		display: block;
	}
	
	.dashboard #left_view
	{
		display: block;
		
		position: relative;
		
		height: 250px;
		
		width: 100%;
		
		border-bottom: solid 2px rgba(0, 0, 0, .8);
	}
	
	.dashboard #right_view
	{
		display: block;
		
		position: relative;
		
		height: calc(100% - 251px);
		
		width: 100%;
	}
	
	.dashboard .module #selection_viewer
	{
		overflow-y: scroll;
	
		-ms-overflow-style: none;
	  
		scrollbar-width: none;
	}

	.dashboard .module #selection_viewer::-webkit-scrollbar
	{
		display: none;
	}*/
}

@media only screen and (max-width: 600px) 
{
	#modal
	{
		top: 0px;
		
		left: 0px;
		
		height: calc(100%);
		
		width: calc(100%);
	}
	
	.col_left
	{
		padding: 0px;
		
		width: 100%;
	}

	.col_right
	{
		margin-top: 10px;
		
		padding: 0px;
		
		width: 100%;
	}
	
	.image_32.scaled
	{
		max-height: 24px;
		
		max-width: 24px;
		
		margin-right: 5px;
	}
	
	.margin_right_10.scaled
	{
		margin-right: 5px;
	}
	
	.text_10.scaled
	{
		font-size: 8px;
	}
	
	.text_14.scaled
	{
		font-size: 12px;
	}
	
	.text_16.scaled
	{
		font-size: 14px;
	}
	
	.text_18.scaled
	{
		font-size: 15px;
	}
	
	/*
	
	.dashboard .module #selection_viewer .selection_summary
	{
		width: 100% !important;
		
		height: fit-content;
	}
	
	.dashboard .module #selection_viewer .selection_summary_graphs
	{
		width: 100% !important;
		
		display: block !important;
	}
	
	.dashboard .module #selection_viewer .selection_summary_graph_container
	{
		width: 100% !important;
		
		height: 200px;
		
		display: block !important;
	}
	
	.dashboard .module #selection_viewer .selection_summary_text
	{
		width: 100%;
		
		display: block;
	}
	
	.dashboard .module #selection_viewer .hw
	{
		width: 100% !important;
		
		display: block !important;
		
		height: 300px !important;
	}
	
	.row
	{
		padding: 10px;
		
		width: calc(100% - 20px);
	}
	
	.project_summary img
	{
		float: none;
		
		border-radius: var(--padding);
		
		margin-right: 0px;
		
		margin-bottom: 20px;
		
		width: calc(100%);
	}
	
	.system_message
	{
		position: fixed;
		
		top: 50%;
		
		left: 50%;
		
		transform: translate(-50%, -50%);
		
		z-index: 100;
		
		padding: 20px;
		
		background-color: var(--dark_green);
		
		border-radius: 5px;
		
		color: white;
		
		font-size: 16px;
		
		font-weight: bold;
	}*/
}


/* Sunburst CSS*/

.axis .tick text, .axisText {
    fill: #A0A0A0;
    font-size: 8px;
}


.axis line {
    display: none;
}

.axis path {
    stroke: #A0A0A0;
}
.linePath {
    fill: transparent;
}

#tooltipTitle{
    font-weight: bold;
    text-transform: uppercase;
    color: #333333;
}
.tooltipSvg{
    width: 200px;
    height: 150px;
}
#chartDiv{
    padding: 0;
    margin: 0;
    font-family: Arial;
    font-size: 12px;
}

.centreLabel{
    text-anchor: middle;
    font-weight: bold;
    font-size: 18px;
}

.sunburstTooltip{
    visibility: hidden;
    border: 1px solid grey;
    border-radius: 4px;
    position: absolute;
    text-align: center;
    padding: 3px;
    background: white;
    pointer-events: none;
    font-size: 1em;
    width: auto;
    height:auto;
    color: white;
    margin-right: 40px;
}