#drawing-history {
	float	: right;
	margin	: 0;
}
#drawing-history li { display: inline-block; }
#drawing-history a { color: #5b5b5b; }
#drawing-history a.disabled { opacity: .5; }
#drawing-history a.disabled:hover {
	color	: #5b5b5b;
	cursor	: default;
}


.canvas-container, #world-canvas {
	/*background	: url('../../i/drawing-bg.png') left top;*/
	border		: #000 1px solid;
	box-sizing	: border-box;
	float		: left;
	margin-top	: 1vh;
	padding-top	: 47.5%;
}
.canvas-container {
	overflow	: hidden;
	padding		: 0;
}
.canvas-container > canvas {
	border	: none !important;
	float	: none !important;
	margin	: 0 !important;
	padding	: 0 !important;
	width	: 100% !important;
}

#world-toolbox {
	box-sizing		: border-box;
	float			: right;
	margin-top		: -2.5vw;
	padding-left	: .75vw;
	width			: 8%;
}
#world-toolbox strong {
	display		: block;
	margin-top	: 1vh;
}
#world-toolbox ul {
	list-style	: none;
	margin		: 0;
	padding		: 0;
}
#world-toolbox li {
	background-position	: center;
	background-repeat	: no-repeat;
	background-size		: contain;
	border				: lightgray solid;
	border-width		: .1vw;
	box-sizing			: border-box;
	cursor				: pointer;
	margin				: .75vh 0 1.25vh;
	padding-top			: -webkit-calc(100% - 2vh);
	padding-top			: calc(100% - 2vh);
	transition			: all .5s;
}
#world-toolbox li:hover, #world-toolbox li.selected {
	background-color	: lightgray;
	border-color		: gray;
}

#world-toolbox li[data-shape=Rect] { background-image: url('../../i/shapes/rect.png'); }
#world-toolbox li[data-shape=Triangle] { background-image: url('../../i/shapes/triangle.png'); }
#world-toolbox li[data-shape=Circle] { background-image: url('../../i/shapes/circle.png'); }

#world-toolbox li[data-color] {
	padding-top	: -webkit-calc(50% - 2vh);
	padding-top	: calc(50% - 2vh);
}
#world-toolbox li[data-color=orange] { background: orange; }
#world-toolbox li[data-color=purple] { background: purple; }
#world-toolbox li[data-color=green] { background: green; }
#world-toolbox li[data-color=yellow] { background: yellow; }
#world-toolbox li[data-color=red] { background: red; }
#world-toolbox li[data-color=blue] { background: blue; }
#world-toolbox li[data-color=pink] { background: #ff68b3; }
#world-toolbox li[data-color=white] { background: white; }
#world-toolbox li[data-color=black] { background: black; }

#world-toolbox li[data-tool] {
	border-color	: #fff;
	margin-bottom	: 0;
	padding			: 0;
}
#world-toolbox li[data-tool] a { color: #5b5b5b; }
#world-toolbox li[data-tool]:hover { background-color: transparent; }


.panel h3 {
    font-size		: 2.5vw;
	margin-bottom	: 0;
}
#gallery {
	list-style	: none;
	margin		: 0 -1vw;
	padding		: 0;
}
#gallery li {
	box-sizing		: border-box;
	display			: inline-block;
	padding			: 1vw;
	vertical-align	: top;
	width			: 33.33%;
}
#gallery img {
	border	: #000 1px solid;
	width	: 100%;
}