@charset "utf-8";

.tree-canvas-container, .controls-container{
	width: 500px;
	max-width: 100%;
	margin-left: auto;
	margin-right: auto;
	background-color: black;
}


.tree-canvas-container{
	display: block;
	height: 600px;
	/*border: 1px solid black;*/
	background-image: url(comp.jpg);
    background-size:     cover;
    background-repeat:   no-repeat;
    background-position: center center;  
}

span.ui-selectmenu-button{
	width: 250px !important;
	max-width: 49.5% !important;
	display: block;
	margin-left: 0px;
	margin-right: 0px;
	float: right;
}

span.ui-selectmenu-button#tree-multi-button{
	float: left;	
}


.tree-container .controls-container{
	color: #777;
}

.controls-container{
	padding-bottom: 1em;
}

.tree-sliders-container{
	padding-left: 1em;
	padding-right: 1em;
}

.controls-container p{
	margin-top: 0.6em;
	margin-bottom: 0.3em;
		
}

form#tree-canvas-form{
	display: block;
	overflow: auto;
}


#tree-angle-0s{
	visibility: hidden;	
}

@media all and (max-width: 619px){
	.tree-canvas-container, .controls-container{
		width: 75vw;
	}
	
	.tree-canvas-container{
		height: 90vw;
	}
	
	span.ui-selectmenu-button{
		width: 98% !important;
		max-width: 98% !important;
		margin-left: auto;
		margin-right: auto;
		float: none;
		display: block;
	}
	
	span.ui-selectmenu-button#tree-multi-button{
		float: none;	
	}
}