/* sizebar */
.cose-sizebar {
	margin:0 auto;
	height:20px;
	color:white;
	font-size:14px;
	text-align:center;
	cursor:pointer;
}
.cose-sizebar[data-size="max"] {
	background-color:#ddd;
}
.cose-sizebar[data-size="1024"] {
	max-width:1024px;
	background-color:#bbb;
}
.cose-sizebar[data-size="820"] {
	max-width:820px;
	background-color:#999;
}
.cose-sizebar[data-size="640"] {
	max-width:640px;
	background-color:#777;
}
.cose-sizebar[data-size="480"] {
	max-width:480px;
	background-color:#555;
}
.cose-sizebar[data-size="360"] {
	max-width:360px;
	background-color:#333;
}
/* board */
.cose-board {
	margin-bottom:20px;
	padding:10px 0;
	background-color:#eee;
}
.cose-sshow-ctar {
	margin:0 auto;
	max-width:360px;
}
/* console */
.cose-console {
	margin-bottom:20px;
	padding:5px;
	background-color:#ccc;
	text-align:center;
}
.cose-btn {
	padding:5px 10px;
	font-size:16px;
	min-width:100px;
	cursor:pointer;
}
/* settings */
.cose-settings {
	margin-bottom:20px;
	padding:5px;
	background-color:#ddd;
	text-align:center;
}

/* overlay */
.cose-overlay {
	position:fixed;
	top:0;
	bottom:0;
	left:0;
	right:0;
	background-color:rgba(0,0,0,0.3);
	overflow-x:hidden;
	overflow-y:scroll;
	overscroll-behavior:none;
}
.cose-dlgcard {
	box-sizing:border-box;
	xdisplay:table-cell;
	position:absolute;
	top:0;
	right:0;
	padding:20px;
	width:480px;
	width:280px;
	max-width:100%;
	min-height:100%;
	background-color:#fff;
	xfont-size:30px;
	transform:translate(100%,0);
	transition:transform 0.6s;
}
.cose-dlgcard-open {
	transform:translate(0%,0);
}
.cose-btn-open {
	transition:transform 1.6s;
	transform:translate(50px,0);
}