﻿@charset "utf-8";
/* CSS Document */

* {
	padding:0;
	margin:0;
	-webkit-font-smoothing: subpixel-antialiased;
	font-family: 'Open Sans', Arial, Helvetica, sans-serif;
}

html {
	height:100%;}

body {
	height:100%;
	background:#fff;
	min-width:1000px;
	}

.clear {
	clear:both;}

.clearfix:after {
	content:'';
	display:block;
	clear:both;	
}

img {
	display:block;
	}

a img {
	border:0;}

input, select, textarea {
	outline:none;}

input[type="submit"], label {
	cursor:pointer;}

textarea {
	overflow:auto;}
	
a {
	-webkit-transition:color 0.2s ease;
	-moz-transition:color 0.2s ease;
	-o-transition:color 0.2s ease;
	-ms-transition:color 0.2s ease;
	transition:color 0.2s ease;
	outline:none;
}

a:hover {
	text-decoration:none;}
	
.in {
	width:980px;
	margin:0 auto;}

#container {
	min-height:100%;
	overflow:hidden;
	position:relative;
}

#constructor {
	width:980px;
	margin:0 auto;
	padding-top:30px;
	position:relative;
}
#tools {
	float:right;
	margin-right:-14px;
	}
#tools .scroll {
	width:275px;
	height:560px;
	margin-bottom:10px;
	overflow:auto;
}
#tools .tools_inner {
	width:260px;}
#tools .tools_block {
	margin-bottom:5px;}
#tools .tools_block .header {
	padding:2px 5px;
	font-size:14px;
	color:#fff;
	background:#aaa;}
#tools .tools_block .object_list {
	display:none;
	padding:5px;
	font-size:11px;}
#tools .tools_block:first-child .object_list {
	display:block;}
#tools .tools_block .object_list > li {
	list-style:none;
	margin-bottom:5px;}
#tools .tools_block .object_list > li .dropdown .note {
	text-align:center;}
#tools .tools_block .object_list > li .dropdown .parameters {
	width:224px;
	text-align:right;
	padding-bottom:5px;
	padding-left:20px;
	border-bottom:1px solid #999;
	margin:0 auto 5px;}
#tools .inputs {
	padding:5px 0;
	margin-bottom:5px;
	}
#tools input[type='text'] {
	height:24px;
	line-height:24px;
	padding:0 5px;
	border:1px solid #bbb;
	width:50px;
	margin-right:20px;
	margin-left:5px;
	text-align:center;}
#tools input[type='text'].error {
	border-color: red;}
	
#tools input[type='submit'] {
	border:0;
	width:80px;
	height:26px;
	line-height:26px;
	color:#fff;
	background:	green;
	margin-right:20px;
}
#tools .tool {
	color:#333;}
#tools .tool:hover {
	color:green;
	}
#tools .tool.active {
	color:green;
	text-decoration:none;
	font-weight:bold;}
#tools .tool.obj.active, #wall_object.active {
	/*
	padding-left:10px;
	border-left:2px solid green;
	*/}

#tools .fl {
	display:inline-block;
	vertical-align:top;
	width:80px;
	text-align:center;}	
#tools .tool .img {
	display:block;
	height:50px;
	line-height:50px;
}	
#tools .tool .img img {
	max-width:100%;
	max-height:100%;
	vertical-align:middle;
	display:inline-block;
	margin-bottom:2px;
	
}
	
#room_object {}
#wall_object {}
#doorway_object {}
#window_object {}
#interdoor_object {}
#open_interdoor_object {}
#close_interdoor_object {}
#wc_object {}
#bathroom_object {}
#kitchen_table_object {}
#stove_object {}
#delete_tool {}
#rotation_tool {}
#field {
	margin-right:320px;
	width:700px;
	height:600px;
	position:relative;
	overflow:hidden;
	border:2px solid #73b5ff;
	-moz-user-select: none;
	-webkit-user-select: none; 
	-ms-user-select: none;
	user-select: none;
	}
#field_inner {
	width:6000px;
	height:6000px;
	position:absolute;
	top:300px;
	left:350px;
	margin:-3000px 0 0 -3000px;
	cursor: move;
	cursor: -moz-grab;
	cursor: -webkit-grab;
	}
#field_inner.dragging {
	cursor: move;
	cursor: -moz-grabbing;
	cursor: -webkit-grabbing;
}
#field_inner.editable_mode {
	cursor:default;}
#field_inner.label_mode, #field_inner.label_mode .room {
	cursor:text;}
#wrapper {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	background:#efefef;}
#wrapper .horiz_line {
	width:100%;
	left:0;
	background:#dcdcdc;
	position:absolute;}
#wrapper .vert_line {
	height:100%;
	top:0;
	background:#dcdcdc;
	position:absolute}
#work_space {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	z-index:2;
	}

	
#work_space .room {
	position:absolute;
	background:#efefef;
	border-color:#000;
	border-style:solid;
	-webkit-transition:background-color 0.2s ease;
	-moz-transition:background-color 0.2s ease;
	-o-transition:background-color 0.2s ease;
	-ms-transition:background-color 0.2s ease;
	transition:background-color 0.2s ease;
	font-size:10px;
	cursor:default;
	z-index:0;}
.editable_mode #work_space .room, .editable_mode #work_space .room *, .editable_mode #work_space .label, .editable_mode #work_space .label textarea, .room_styler_mode #work_space .room {
	cursor:pointer;
}
.room.hover, .room.edit_active {
	z-index:100 !important;}
.editable_mode #work_space .room .edit_active {
	cursor: move;
	cursor: -moz-grab;
	cursor: -webkit-grab;
}
.editable_mode #work_space .room .edit_active.ui-draggable-dragging {
	cursor: move;
	cursor: -moz-grabbing;
	cursor: -webkit-grabbing;
}
#field_inner.drowing, #field_inner.drowing #work_space .room {
	cursor:crosshair;}
#work_space .room.bad_position {
	background:red;}
.room .data {
	padding:1px 2px;
	background:#fff;
	position:relative;
	z-index:1000;
	max-width:100%;
	position:absolute;
	left:0;
	top:0;}
.room .data span {
	margin-left:5px;
	display:inline-block;
}
.room .data span:first-child {
	margin-left:0;
}
.room .data span:after {
	content:',';}
.room .data span:last-child:after, .room .data span.last:after {
	display:none;}

.room div {
	position:absolute;
	box-sizing:border-box;
	-moz-box-sizing:border-box;
	background-size:100% 100%;
	background-repeat:no-repeat;
	}	
.room .ui-resizable-handle {
	background-size:auto;}
	

/* wall */
#work_space .wall {
	background:#000;}

/* window_object */		
#work_space .window_object.left, #work_space .window_object.right {
	background-image:url(../img/window_vert.png);
}
#work_space .window_object.top, #work_space .window_object.bottom {
	background-image:url(../img/window_hor.png);
}

/* open_interdoor_object */	
#work_space .open_interdoor_object.left, #work_space .open_interdoor_object.right {
	background-image:url(../img/open_door_vert.png);
}
#work_space .open_interdoor_object.top, #work_space .open_interdoor_object.bottom {
	background-image:url(../img/open_door_hor.png);
}

/* wide_open_interdoor_object */	
#work_space .wide_open_interdoor_object.left, #work_space .wide_open_interdoor_object.right {
	background-image:url(../img/wide_open_door_vert.png);
}
#work_space .wide_open_interdoor_object.top, #work_space .wide_open_interdoor_object.bottom {
	background-image:url(../img/wide_open_door_hor.png);
}

	
/* close_interdoor_object */
#work_space .close_interdoor_object.left {
	background-image:url(../img/door_left.png);
}
#work_space .close_interdoor_object.right {
	background-image:url(../img/door_right.png);
}
#work_space .close_interdoor_object.top {
	background-image:url(../img/door_top.png);
}
#work_space .close_interdoor_object.bottom {
	background-image:url(../img/door_bottom.png);
}


/* close_interdoor_object */
#work_space .doorway_object.left {
	background-image:url(../img/out_door_left.png);
}
#work_space .doorway_object.right {
	background-image:url(../img/out_door_right.png);
}
#work_space .doorway_object.top {
	background-image:url(../img/out_door_top.png);
}
#work_space .doorway_object.bottom {
	background-image:url(../img/out_door_bottom.png);
}


/* wc_object */
#work_space .wc_object.left {
	background-image:url(../img/wc_left.png);
}
#work_space .wc_object.right {
	background-image:url(../img/wc_right.png);
}
#work_space .wc_object.top {
	background-image:url(../img/wc_top.png);
}
#work_space .wc_object.bottom {
	background-image:url(../img/wc_bottom.png);
}

/* bathroom_object */
#work_space .bathroom_object.left {
	background-image:url(../img/bath_left.png);
}
#work_space .bathroom_object.right {
	background-image:url(../img/bath_right.png);
}
#work_space .bathroom_object.top {
	background-image:url(../img/bath_top.png);
}
#work_space .bathroom_object.bottom {
	background-image:url(../img/bath_bottom.png);
}

/* kitchen_object */
#work_space .kitchen_object.left {
	background-image:url(../img/kitchen_left.png);
}
#work_space .kitchen_object.right {
	background-image:url(../img/kitchen_right.png);
}
#work_space .kitchen_object.top {
	background-image:url(../img/kitchen_top.png);
}
#work_space .kitchen_object.bottom {
	background-image:url(../img/kitchen_bottom.png);
}

/* big_bed_object */
#work_space .big_bed_object.left {
	background-image:url(../img/big_bed_left.png);
}
#work_space .big_bed_object.right {
	background-image:url(../img/big_bed_right.png);
}
#work_space .big_bed_object.top {
	background-image:url(../img/big_bed_top.png);
}
#work_space .big_bed_object.bottom {
	background-image:url(../img/big_bed_bottom.png);
}

/* small_bed_object */
#work_space .small_bed_object.left {
	background-image:url(../img/small_bed_left.png);
}
#work_space .small_bed_object.right {
	background-image:url(../img/small_bed_right.png);
}
#work_space .small_bed_object.top {
	background-image:url(../img/small_bed_top.png);
}
#work_space .small_bed_object.bottom {
	background-image:url(../img/small_bed_bottom.png);
}

#work_space .wc_room_object {
	background-image:url(../img/wc.png);
	}
#work_space .work_room_object {
	background-image:url(../img/worktable.png);
	}
#work_space .shelf_room_object {
	background-image:url(../img/shelf.png);
	}
#work_space .kitchen_room_object {
	background-image:url(../img/kitchen.png);
	}
#work_space .wherehouse_room_object {
	background-image:url(../img/self.png);
	}
	
#work_space .stairs_object.left, #work_space .stairs_object {
	background-image:url(../img/ladder_left.png);}
#work_space .stairs_object.right {
	background-image:url(../img/ladder_right.png);}
#work_space .stairs_object.bottom {
	background-image:url(../img/ladder_bottom.png);}
#work_space .stairs_object.top {
	background-image:url(../img/ladder_top.png);}

	
#tooltip {
	position:absolute;
	padding:2px 5px;
	border-radius:3px;
	color:#fff;
	background:rgba(0,0,0,.7);
	font-size:10px;
	z-index:1000;
	display:none;}
	
.left_wall {
	border-left-color:green;}
.top_wall {
	border-top-color:green;}
.right_wall {
	border-right-color:green;}
.bottom_wall {
	border-bottom-color:green;}
	
#save_img {
	margin-bottom: 5px;
	padding: 5px 10px;
	width:47%;
	margin-right:3%;
	box-sizing:border-box;
	-moz-box-sizing:border-box;
	font-size: 16px;
	color: #fff;
	background: green;
	float:left;
	text-align:center;}
#remove_all {
	margin-bottom: 5px;
	padding: 5px 10px;
	width:44%;
	box-sizing:border-box;
	-moz-box-sizing:border-box;
	font-size: 16px;
	color: #fff;
	background: red;
	float:left;
	text-align:center;
}
#obj_tools {
	position:absolute;
	right:0;
	top:0;
	padding:3px 3px 1px;
	border:1px solid #bbb;
	border-top:0;
	border-right:0;
	background:#fff;
	z-index:1000;
	display:none;
	}
#obj_tools > li {
	list-style:none;
	margin-bottom:2px;
	position:relative;}
#obj_tools > li > a {
	display:block;
	text-decoration:none;
	width:32px;
	height:32px;
	opacity:0.5;
	filter:alpha(opacity=50);
	box-sizing:border-box;
	-moz-box-sizing:border-box;
	cursor:default;}
#obj_tools > li.active > a {
	opacity:1;
	cursor:pointer;
	filter:alpha(opacity=100);}
#obj_tools > li > .remove_obj {
	background:url(../img/delete.png) no-repeat;}

#obj_tools > li > .move_obj {
	background:url(../img/move.png) no-repeat;}
.room_bg {
	display:none;
	padding-top:5px;
}
.room_bg.visible {
	display:block;
	opacity:0.5;
	filter:alpha(opacity=50);
}
.room_bg.visible.active {
	opacity:1;
	filter:alpha(opacity=100);
}
.room_bg > li {
	list-style:none;
	padding:3px 0;
}

.room_bg > li a {
	display:inline-block;
	text-decoration:none;
	white-space:nowrap;
	font-size:12px;}
.room_bg > li:hover a {
	color:green;}
.room_bg > li a .img {
	width:32px;
	height:32px;
	display:inline-block;
	margin-right:5px;
	vertical-align:middle;
	border:1px solid #ccc;}
.room_bg > li.active a .img {
	border:1px solid green;}
.room_bg > li.active a {
	color:green;
}
.room_bg > li a.bg0 .img, #work_space .room.bg0, .floor_type > a.bg0 {
	background-color:#efefef;
	background-image:none;
}
.room_bg > li a.bg1 .img, #work_space .room.bg1, .floor_type > a.bg1 {
	background-image:url(../img/plitka.png);
	background-color:transparent;
}
.room_bg > li a.bg2 .img, #work_space .room.bg2, .floor_type > a.bg2 {
	background-image:url(../img/parket.png);
	background-color:transparent;}
	
#notification {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	background:rgba(0,0,0,.6);
	z-index:2000;
	display:none;
	}
#notification .popup {
	width:300px;
	background:#fff;
	border-radius:5px;
	padding:20px;
	text-align:center;
	position:absolute;
	top:50%;
	left:50%;
	margin-left:-170px;
	margin-top:-50px;}
#notification .popup .text {
	margin-bottom:10px;
	font-size:12px;
	color:#666;}
#notification .popup .submit a {
	display:inline-block;
	width:70px;
	height:24px;
	line-height:24px;
	font-size:12px;
	margin:0 3px;
	text-decoration:none;
	text-transform:uppercase;
	color:#fff;
	}
#notification .popup .submit .ok {
	background:green;}
#notification .popup .submit .cancel {
	background:red;}
	
.room .room_object_place {
	border:2px dashed red;
	box-sizing:border-box;
	-moz-box-sizing:border-box;
	background:rgba(255, 0, 0, 0.2)}
	
.room .room_object_place.success {
	border-color:green;
	background:rgba(0, 255, 0, 0.2)}
	
.next_step {
	width:120px;
	height:26px;
	line-height:26px;
	color:#fff;
	background:red;
	display:block;
	margin:0 auto;
	text-align:center;
	text-decoration:none;
	text-transform:uppercase;}
	
.next_step_error, .big_size_error {
	padding:5px 0;
	color:red;
	text-align:center;
	display:none;}
	
#edit_object {
	padding-left:40px;
	background:url(../img/target.png) left center no-repeat;
	display:inline-block;
	line-height:32px;}
	
.room.hover, .editable_mode .room .hover, .editable_mode .label.hover {
	box-shadow:2px 2px 0 green, 2px -2px 0 green, -2px 2px 0 green, -2px -2px 0 green;
} 
.edit_active {
	box-shadow:2px 2px 0 red, 2px -2px 0 red, -2px 2px 0 red, -2px -2px 0 red !important;
} 

#arrow_case {
	position:absolute;
	bottom:0;
	left:0;
	width:300px;
	padding:5px;
	background:rgba(0,0,0,.5);
	display:none;
	z-index:10;}
#arrow_case img {
	float:left;}
#arrow_case p {
	font-size:12px;
	color:#fff;
	margin-left:90px;
	padding-top:5px;
	}
	
.rooms_list {
	display:none;
	margin-bottom:5px;
	/*
	max-height:136px;
	overflow:auto;
	*/
	padding-top:5px;
}
.rooms_list table {
	width:100%;
	border-spacing:0;
	border-collapse:collapse;
}
.rooms_list table tr:hover td {
	background-color:#efefef;
}
.rooms_list table td {
	border:1px solid #e5e5e5;
	padding:1px 5px 5px;
	font-size:12px;
	text-align:center;
	vertical-align:bottom;
}
.rooms_list table .del_room {
	width:16px;
	height:16px;
	display:block;
	margin:0 auto;
	background:url(../img/delete.png) no-repeat;
	background-size:100%;}
	
.add_more {
	margin-right:10px;
	font-size:12px;
	color:green;
	display:none;
}

.settings {
	width:230px;
	margin:5px auto 0;
	border:1px solid #999;
	margin-bottom:5px;
	padding:5px 10px;}
.settings label {
	font-size:12px;}
	
.label {
	border:1px solid transparent;
	position:absolute;
	width:200px;
	z-index:1000;
	margin-top:-12px;
	margin-left:-5px;}

.label.active {
	background:#fff;
	border:1px solid #bbb;}	
	
.label textarea {
	width:100%;
	font-size:12px;
	color:red;
	padding:5px;
	box-sizing:border-box;
	-moz-box-sizing:border-box;
	resize:vertical;
	border:0;
	display:block;
}
.label textarea[disabled]{
	background:none;
	resize:none;}
	
#field .logo {
	position:absolute;
	top:0;
	left:0;
	width:200px;
	display:none;
}
#field .logo  img {
	max-width:100%;
}
#field .desc {
	position:absolute;
	bottom:10px;
	right:10px;
	display:none;
	max-width:350px;
}
#field .desc p {
	font-size:13px;
	color:#000;
	margin-bottom:5px;}

.site_overlay {
	position:fixed; 
	top:0;
	left:0;
	width:100%;
	height:100%;
	background-color: rgba(0,0,0,.9);
	display:none;
	z-index:3000;
}
.site_overlay.wait {
	background-image: url(../img/preloader_black_bg.gif);
	background-position:center center;
	background-repeat: no-repeat;
}
.data_popup {
	position:fixed;
	top:50%;
	left:50%;
	width:400px;
	padding:20px;
	background:#fff;
	border-radius:5px;
	box-shadow:0 0 10px #000;
	margin:-107px 0 0 -220px;
	display:none;
	z-index:3001;
}
.data_popup .header{
	font-size:14px;
	font-weight:bold;
	margin-bottom:15px;
	text-align:center;
}
.data_popup .input {
	margin-bottom:10px;
	text-align:right;
	font-size:12px;
}
.data_popup .input input {
	width:260px;
	height:30px;
	line-height:30px;
	border:1px solid #ccc;
	font-size:12px;
	color:#000;
	margin-left:10px;
	padding:0 10px;
}
.data_popup .input input.error {
	border-color:red;
}
.data_popup .submit {
	text-align:center;
	padding-top:10px;
}
.data_popup .btn {
	display:inline-block;
	height:30px;
	line-height:30px;
	text-decoration:none;
	text-transform:uppercase;
	width:100px;
	font-size:12px;
	color:#fff;
}
.data_popup .btn + .btn {
	margin-left:10px;
}
.data_popup .btn.ok {
	background:green;
}
.data_popup .btn.cancel {
	background:red;}