@CHARSET "UTF-8";

.dragable {
	position: absolute;
	background: black;
	margin-left: 6px;
}

.ww30 .dragable {
	margin-left: 7px;
}

.dragable:hover {
	outline: 2px solid yellow;
}

.dragable.selected {
	outline: 2px solid red;
	z-index: 10000 !important;
}

.dragable.transformation {
	outline: 2px solid #6495ED;
}

.dragable.floor {
	margin-top: -3px;
	background: SaddleBrown;
}

.dragable.ledge {
	margin-top: -3px;
	background: SaddleBrown;
}

.dragable.bar {
	/*padding: 0 3px;*/
	/*margin-left: -3px;*/
	margin-left: 0px;
	margin-top: -3px;
	background: SaddleBrown;
}

/* view types */

.view_backdrop .dragable.floor,
.view_backdrop .dragable.door,
.view_backdrop .dragable.rail {
	display: none !important;
	/*opacity: 0.1;*/
}

.view_nofront .dragable.door {
	display: none !important;
}

.view_nofront .dragable.drawer {
	display: block;
}

/* door */

.dragable table {
	width: 100%;
	height: 100%;
}

.dragable.door table td {
	background: darkorange;
	background: white;
	opacity: 0.5;
}

.dragable.door table td.bottom, div.door table td.right {
	background: black;
	opacity: 0.3;
}

.dragable.door table td.left, div.door table td.right {
	width: 2px;
}

.dragable.door table td.top, div.door table td.bottom {
	height: 2px;
}

.dragable.door {
	background: url("../img/wood1.jpg");
	z-index: 3;
	/*display: none;*/
	/*
	margin-left: 4px;
	padding-right: 4px;
	*/
}

.ww30 .dragable.door {
	/*margin-left: 5px;*/
	/*padding-right: 5px;*/
}

.dragable.door > table {
	position: absolute;
}

.dragable.door.double table {
	background: url("../img/divider.png") repeat-y center;
}

.dragable.door table td.center {
	background: url("../img/handle.png") no-repeat 10px 75%;
	opacity: 1;
}

.dragable.door.right table td.center {
	background: url("../img/handle_right.png") no-repeat right 75%;
}

.dragable.door.double table td.center {
	background: url("../img/handle_double.png") no-repeat center 75%;
}

.dragable.door.double.border table td.center {
	background: url("../img/handle_double_narrow.png") no-repeat center 75%;
}

.dragable.door.double.border.alu table:first-child td.center {
	background: url("../img/handle_double.png") no-repeat center 75%;
}

.dragable.door.drawer table td.center {
	background: url("../img/handle_bottom.png") no-repeat center 90%;
}

.dragable.door.border table.woodborder td.center,
.dragable.door.border table.aluborder td.center {
	background: none;
}

.dragable.door .aluborder td {
	opacity: 1 !important;
}

.dragable.door .aluborder td.topleft {
	width: 6px;
	height: 6px;
	background: url("../img/textures/texture_alu_top_left.png") no-repeat;
}

.dragable.door .aluborder td.top {
	height: 6px;
	width: 45%;
	background: url("../img/textures/texture_alu_top.png") repeat-x;
}

.dragable.door .aluborder td.topright {
	width: 6px;
	height: 6px;
	background: url("../img/textures/texture_alu_top_right.png") no-repeat;
}

.dragable.door .aluborder td.left {
	width: 6px;
	background: url("../img/textures/texture_alu_left.png") repeat-y;
}

.dragable.door .aluborder td.right {
	width: 6px;
	background: url("../img/textures/texture_alu_left.png") repeat-y;
}

.dragable.door .aluborder td.bottomleft {
	width: 6px;
	height: 6px;
	background: url("../img/textures/texture_alu_bottom_left.png") no-repeat;
}

.dragable.door .aluborder td.bottom {
	height: 6px;
	background: url("../img/textures/texture_alu_top.png") repeat-x;
}

.dragable.door .aluborder td.bottomright {
	width: 6px;
	height: 6px;
	background: url("../img/textures/texture_alu_bottom_right.png") no-repeat;
}

/* bar */

.dragable.bar table td.top {
	height: 1px;
	background: white;
	opacity: 0.5;
}

.dragable.bar table td.right {
	width: 1px;
	background: black;
	opacity: 0.5;
}

.dragable.bar table td.left {
	width: 1px;
	background: white;
	opacity: 0.5;
}

/* ledge */

.dragable.ledge table td.top {
	height: 1px;
	background: white;
	opacity: 0.5;
}

.dragable.ledge table td.bottom {
	height: 1px;
	background: black;
	opacity: 0.5;
}

.dragable.ledge table td.right {
	width: 1px;
	background: black;
	opacity: 0.5;
}

.dragable.ledge table td.left {
	width: 1px;
	background: white;
	opacity: 0.5;
}

/* floor */

.dragable.floor table td.top,
.dragable.base table td.top {
	/*height: 1px;*/
	padding-top: 1px;
	background: white;
	opacity: 0.5;
}

.dragable.floor table td.bottom {
	height: 1px;
	background: black;
	opacity: 0.5;
}

.dragable.floor {
	/*
	-moz-box-shadow: 0px 6px 7px 0px #000;
	-webkit-box-shadow: 0px 6px 7px 0px #000;
	box-shadow: 0px 6px 7px 0px #000;
	*/
}

.dragable.rail {
	background: url("../img/rail.png") !important;
}

.dragable.invalid {
	background: url("../img/textures/texture_error.png") !important;
}

.dragable.door .woodborder,
.dragable.door .aluborder {
	position: absolute;
	top:0;
	left:0;
}

.dragable.door .woodborder td.left,
.dragable.door .woodborder td.right {
	width: 12px;
	background: url("../img/textures/texture_wood_border_v.png") #DAA671;
	opacity: 1;
}

.dragable.door .woodborder td.middle {
	width: 24px;
	background: url("../img/textures/texture_wood_border_v.png") #DAA671;
	opacity: 1;
	display: none; /* only visible for double doors */
}

.dragable.door .aluborder td.middle {
	display: none;
}

.dragable.door.double .woodborder td.middle,
.dragable.door.double .aluborder td.middle {
	display: table-cell;
}

.dragable.door .woodborder td.top,
.dragable.door .woodborder td.bottom {
	height: 12px;
	background: url("../img/textures/texture_wood_border_h.png") #DAA671;
	opacity: 1;
}
.dragable.door .glass_front {
	background: url("../img/textures/texture_glass.png");
	position: absolute;
	top:0;
	left:0;
	width: 100%;
	height: 100%;
}

.dragable {
	/*overflow: hidden;*/
}

.dragable .warning {
	background: url("../img/icon_warning.png");
	width: 16px;
	height: 16px;
	position: absolute;
	right: 2px;
}

.dragable .comment {
	position: absolute;
	left: 2px;
	top: 0;
	background: url("../img/icon_comment.png");
	width: 16px;
	height: 16px;
	z-index: 2000;
}

div.grid .row:hover .cell {
	/*border-bottom-color: red;*/
}

div.grid .line {
	display: none;
	height: 1px;
	width: 100%;
	background: red;
	position: absolute;
	top: 50px;
	z-index: 2000;
}

.distance_measure {
	display: none;
	position: absolute;
	z-index: 2000;
	margin-left: -26px;
}

.distance_measure table {
	height: 100%;
	width: 64px;
}

.distance_measure td.center {
	height: 1px;
	font-size: 13px;
	line-height: 100%;
	color: red;
	text-align: center;
}

.distance_measure td.up {
	background: url("../img/arrows_vertical_red.png") no-repeat top;
}

.distance_measure td.down {
	background: url("../img/arrows_vertical_red.png") no-repeat bottom;
}