/* BOX */
.cnt-box{
	display:flex; flex-direction:column;
	border-radius:6px; border:1px solid #b5b5b5; /*box-shadow:3px 3px 10px #888; position:absolute;*/
	background-color:#fff; margin:0; color:#777; font-family:Tahoma; font-size:1em; 
	position:absolute;
}

	.cnt-box.cnt-shadow{box-shadow:3px 3px 10px #888;}

	.cnt-box .cnt-bar{
		order:1; display:flex; flex-direction:row; align-items:center; flex-wrap:nowrap; flex-shrink:0;
		color:#555; font-weight:bold; background-color:#fff; border-top-left-radius:6px; border-top-right-radius:6px; 
		-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 */
	}
		.cnt-box .cnt-bar.cnt-collapsed {border-radius:6px; border-bottom:none;}
		.cnt-box .cnt-bar .cnt-bar-content{flex-grow:1; flex-wrap:nowrap; overflow:hidden; padding:10px; font-size:1.2em; }
		.cnt-box .cnt-bar .cnt-bar-content *{white-space:nowrap;}

		.cnt-box .cnt-bar .cnt-cmd{display:flex; align-items:center; flex-shrink:0; padding:5px; align-self:flex-start;}
		.cnt-box .cnt-bar .cnt-cmd > *:not(:last-child) {margin-right:4px;}
		.cnt-box .cnt-bar .cnt-cmd a{text-decoration:none; cursor:pointer; font-size:1.3em;}

	.cnt-box .cnt-header{order:2; padding:10px; border-bottom:1px dotted #ccc; background-color:#f9f9f9; }
	.cnt-box .cnt-content{order:3; padding:10px; overflow:auto !important; background-color:#FFF; flex-grow:1; flex-shrink:1;}

	.cnt-box .cnt-footer{order:4; padding:10px; display:flex; flex-shrink:0; flex-grow:0; overflow:hidden; border-top:1px solid #ddd;}
	/* Workaround for padding issue with flexbox 
	.cnt-box .cnt-footer > div{padding:10px;} 
		*/

	.cnt-box.cnt-resize{-webkit-box-shadow:0 0 9px 2px #666; -moz-box-shadow: 0 0 9px 2px #666; box-shadow: 0 0 9px 2px #CDCD9E;}
	.cnt-box.cnt-resize-hover{-webkit-box-shadow: 0 0 9px 2px #999; -moz-box-shadow: 0 0 9px 2px #999; box-shadow: 0 0 9px 2px #ccc;}
	.cnt-box-ph{border:dashed 3px #ccc; height:15px; }

	.cnt-box .cnt-b-radius{border-bottom-left-radius:6px; border-bottom-right-radius:6px; }
	.cnt-box .cnt-t-radius{border-top-left-radius:6px; border-top-right-radius:6px; }

/* http://www.w3schools.com/howto/tryit.asp?filename=tryhow_css_modal_bottom */
.cnt-box-modal {
	display:none; position:fixed; z-index:1; left:0; top:0; width:100%; height:100%; overflow:auto; background-color:rgb(0,0,0); background-color:rgba(0,0,0,0.4); 
	-webkit-animation-name: fadeIn; -webkit-animation-duration: 0.4s; animation-name: fadeIn; animation-duration: 0.4s}

/* Box styles */
.cnt-box.box-system{}
.cnt-box.box-system .cnt-bar{background-color:#eaeaea; border-bottom:1px solid #ddd;}
.cnt-box.box-system .cnt-bar .cnt-bar-content{padding:5px; font-size:1.2em; }
.cnt-box.box-system .cnt-bar .cnt-cmd{align-self:flex-start; line-height:1;}
.cnt-box.box-system .cnt-bar .cnt-cmd a{font-size:1.2em;}
.cnt-box.box-system .cnt-content{padding-left:15px;}

.cnt-box-pop{background-color:transparent; padding:0; border:none; }
.cnt-box-pop .cnt-content{padding:0;}
.cnt-box-pop .cnt-panel{margin:0;}