html, body {
	height: 100%;
	margin: 0;
}

body {
	user-select: none;
	-moz-user-select: none;
	-khtml-user-select: none;
	-webkit-user-select: none;
	-ms-user-select: none;
}

html {
	-ms-touch-action: manipulation;
}

.dropdown-menu > li > a {
	cursor: default;
}

#main-menu {
	margin-bottom: 0px;
}

	#main-menu .container {
		width: 100%;
	}

#modes-container {
	position: absolute;
	width: 100%;
	left: 0;
	top: 56px;
	right: 0;
	bottom: 0;
}

	#modes-container .modes-tab-pane {
		position: relative;
		height: 100%;
	}

#selectors-container {
	position: absolute;
	margin-left: 20px;
	width: 200px;
	height: 100%;
	overflow: hidden;
}

	#selectors-container ul.nav-pills {
		margin: 0 0 4px 0;
		font-size: 0.8em;
		line-height: 1em;
	}

		#selectors-container ul.nav-pills li {
			line-height: 12px;
		}

			#selectors-container ul.nav-pills li a {
				margin-right: 2px;
				margin-top: 2px;
				margin-bottom: 2px;
				padding-top: 8px;
				padding-bottom: 8px;
				padding-right: 5px;
				padding-left: 5px;
				line-height: 12px;
			}

#selectors-tab-content {
	position: absolute;
	top: 32px;
	left: 0;
	right: 0;
	bottom: -2px;
	overflow-y: scroll;
}

	#selectors-tab-content .selector-tab .item {
		position: relative;
	}

		#selectors-tab-content .selector-tab .item a {
			text-decoration: none;
			cursor: pointer;
			font-size: 1.5em;
			vertical-align: middle;
			display: table-cell;
		}

		#selectors-tab-content .selector-tab .item .item-info {
			position: absolute;
			left: 0;
			top: 0;
			right: 0;
			bottom: 0;
			width: 160px;
			height: 160px;
			color: gray;
		}

			#selectors-tab-content .selector-tab .item .item-info .name {
				position: absolute;
				left: 10px;
				top: 10px;
				font-size: 1em;
				z-index: 1;
			}

			#selectors-tab-content .selector-tab .item .item-info .attributes {
				position: absolute;
				left: 10px;
				bottom: 10px;
				font-size: 0.8em;
				line-height: 1.1em;
				text-align: left;
				z-index: 1;
			}

			#selectors-tab-content .selector-tab .item .item-info a.modify-button {
				position: absolute;
				right: 10px;
				bottom: 10px;
				padding-left: 0.5em;
				padding-top: 0.5em;
				font-size: 1.5em;
				z-index: 1;
			}

			#selectors-tab-content .selector-tab .item .item-info .topright-buttons {
				position: absolute;
				right: 10px;
				top: 10px;
				padding-left: 0.5em;
				padding-bottom: 0.5em;
				z-index: 1;
			}

				#selectors-tab-content .selector-tab .item .item-info .topright-buttons > a {
					font-size: 1.5em;
				}

		#selectors-tab-content .selector-tab .item a.celltype {
			position: relative;
			overflow: hidden;
			display: table-cell;
			text-align: center;
			vertical-align: middle;
			width: 170px;
			height: 170px;
			border: 5px solid white;
		}

			#selectors-tab-content .selector-tab .item a.celltype div {
				margin: -5px;
			}

			#selectors-tab-content .selector-tab .item a.celltype img {
				max-width: 160px;
				max-height: 160px;
			}

			#selectors-tab-content .selector-tab .item a.celltype:hover {
				border: 5px solid #0088cc;
			}

		#selectors-tab-content .selector-tab .item a#add-celltype-button.celltype {
			text-align: center;
			vertical-align: middle;
			font-size: 1em;
			border: 5px dashed lightgrey;
		}

			#selectors-tab-content .selector-tab .item a#add-celltype-button.celltype i {
				font-size: 2em;
			}

			#selectors-tab-content .selector-tab .item a#add-celltype-button.celltype:hover {
				border: 5px dashed #0088cc;
			}

#block-tab-left-pane {
	position: relative;
	height: 100%;
	width: 100%;
	float: left;
}

#block-tab-right-pane {
	position: absolute;
	height: 100%;
	width: 100%;
	float: right;
}

	#block-tab-right-pane .blockly-div {
		margin-left: 220px;
		position: absolute;
		left: 0;
		top: 0;
		right: 0;
		bottom: 0;
		-ms-touch-action: none;
	}

		#block-tab-right-pane .blockly-div svg.blocklySvg {
			overflow: hidden;
		}

#text-editor {
	position: absolute;
	left: 0;
	top: 0;
	right: 0;
	bottom: 0;
	font-size: 10pt;
}

#eobject-modal {
	position: absolute;
	top: 5%;
	left: 5%;
	width: 90%;
	height: 90%;
}

	#eobject-modal .modal-dialog {
		width: 100%;
		height: 100%;
		margin-top: 0px;
		margin-bottom: 0px;
	}

	#eobject-modal .modal-body {
		padding: 0px;
		height: 480px;
	}

#eobject-modal-preview {
	position: relative;
	width: 160px;
	height: 160px;
	background-color: white;
	border: 1px solid gray;
	overflow: hidden;
	margin-bottom: 8px;
}

#eobject-modal-celltype {
	position: absolute;
	-ms-touch-action: none;
}

	#eobject-modal-celltype img {
		width: 100%;
		height: 100%;
	}

#eobject-modal-form {
	margin-bottom: 0;
}

	#eobject-modal-form .control-group {
		margin-bottom: 8px;
	}

		#eobject-modal-form .control-group .control-label {
			width: 30%;
		}

		#eobject-modal-form .control-group .dropdown {
			display: inline-block;
		}

		#eobject-modal-form .control-group .controls {
			display: inline-flex;
		}

#eobject-modal-left-pane {
	position: relative;
	height: 80%;
	width: 50%;
	float: left;
}

#eobject-modal-right-pane {
	position: absolute;
	margin-left: 50%;
	height: 80%;
	width: 50%;
	float: left;
}

#eobject-modal-right-pane-inner {
	left: 0;
	top: 0;
	right: 0;
	bottom: 0;
	height: 480px;
	overflow-y: scroll;
}

#eobject_properties {
	width: 100%;
}

	#eobject_properties label {
		text-align: left;
	}

#preference-modal {
	width: 700px;
	margin-left: -350px;
}

	#preference-modal .modal-body form {
		margin-bottom: 0;
	}

		#preference-modal .modal-body form .control-group {
			margin-bottom: 8px;
		}

.emscripten {
	padding-right: 0;
	margin-left: auto;
	margin-right: auto;
	display: block;
}

div.emscripten {
	text-align: center;
}

div.emscripten_border {
	border: 1px solid black;
}

#emscripten_logo {
	display: inline-block;
	margin: 4px;
}

.spinner {
	height: 30px;
	width: 30px;
	margin: 0;
	margin-top: 20px;
	margin-left: 20px;
	display: inline-block;
	vertical-align: top;
	-webkit-animation: rotation .8s linear infinite;
	-moz-animation: rotation .8s linear infinite;
	-o-animation: rotation .8s linear infinite;
	animation: rotation 0.8s linear infinite;
	border-left: 5px solid rgb(235, 235, 235);
	border-right: 5px solid rgb(235, 235, 235);
	border-bottom: 5px solid rgb(235, 235, 235);
	border-top: 5px solid rgb(120, 120, 120);
	border-radius: 100%;
	background-color: rgb(189, 215, 46);
}

#emscripten-box {
	position: absolute;
	top: 0px;
}

#term-box {
	position: relative;
	height: 100%;
}

#term {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	font-size: small;
}

@-webkit-keyframes rotation {
	from {
		-webkit-transform: rotate(0deg);
	}

	to {
		-webkit-transform: rotate(360deg);
	}
}

@-moz-keyframes rotation {
	from {
		-moz-transform: rotate(0deg);
	}

	to {
		-moz-transform: rotate(360deg);
	}
}

@-o-keyframes rotation {
	from {
		-o-transform: rotate(0deg);
	}

	to {
		-o-transform: rotate(360deg);
	}
}

@keyframes rotation {
	from {
		transform: rotate(0deg);
	}

	to {
		transform: rotate(360deg);
	}
}

#status {
	display: inline-block;
	vertical-align: top;
	margin-top: 30px;
	margin-left: 20px;
	font-weight: bold;
	color: rgb(120, 120, 120);
}

#progress {
	height: 20px;
	width: 30px;
}

#controls {
	display: inline-block;
	float: right;
	vertical-align: top;
	margin-top: 30px;
	margin-right: 20px;
}