/*
 *  SquadChess.com
 *  
 *  CSS display configuration.
 *  
 *  Created by Scott Johnstone 
 *  ©2022 Austere Games
 *  
 *  info@squadchess.com
 * 
 */


#top {
	height: 50px;
	display: flex;
	flex-flow: row wrap;
	justify-content: flex-start;
	align-items: center;	
	font-size: min(3vw, 3vh);
	padding-left: 1vh;
	background: #877f70;
}

#top a:hover {
	text-decoration: underline;
}






#main {
	position: absolute;
	top: 50px;
	bottom: 30px;
	width: 100%;
	display: flex;
	overflow: hidden;
	background: #eee;
}

#left {
	height: 100%;
	display: flex;
	flex-flow: column;
	overflow-x: hidden;
	overflow-y: auto;
	box-shadow: 0 0 10px #222;
}

.tree_tab,
.tree_item {
	width: 100%;
	text-align: left;
	cursor: pointer;
}

.tree_tab {
	padding: min(1vw, 1vh);
	font-size: min(3vw, 3vh);
	background: #e5dfd5;
    border-bottom: 1px solid #222;
}

.tree_tab:hover {
	background: #edeae6;
}

.tree_tab_sel,
.tree_tab_sel:hover {
	background: #fff8ec;
}

.tree_list_container {
	display: flex;
	flex-flow: column;
	border-bottom: 1px solid #222;
	display: none;
}

.tree_item {
	padding: min(0.5vw, 0.5vh) min(2vw, 2vh);
	font-size: min(2.5vw, 2.5vh);
}

.tree_item:hover {
	background: #fff;
}

.tree_item_sel {
	background: #f9f9f9;
	font-weight: bold;
}







#right {
	height: 100%;
	flex-grow: 1;
}





#bottom {
	position: fixed;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 30px;
	background: #877f70;
	display: flex;
	flex-flow: row;
	justify-content: space-between;
	align-items: center;
    font-size: min(2.6vw, 2.6vh);
}

#bot_nav_comm a {
	color: #eee;
}

#bottom div {
	margin: 0 2vw;
}