#render-slavutich{
	position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    overflow: hidden;
    min-width: 1024px;
    min-height: 604px;
}

.bg_fon_slavutich{
	position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
}
/* POP UP FILTER */
.filter{
	text-decoration: none;
	/*width:154px;
	height: 154px;*/
	width: 171px;
    height: 171px;
	border-radius: 50%;
	background-color: #378bcd;
	position: absolute;
    /*top: 310px;*/
    top: 32%;
    left: 50px;
    background-image: url(../../images/podbor_icon.png);
    background-repeat: no-repeat;
    background-position: center 31px;
    text-transform: uppercase;
    transform: scale(0.9);
    transition: all .2s linear;
	z-index: 5;	
	/*visibility: hidden;*/
}
.filter:hover{
	transform: scale(1);
	
}
.filter p{
	color: white;
    text-align: center;
    margin-top: 82px;
    font-family: 'open_sanssemibold';
}

/* SELECT FLOOR */
.select_floor{
	position: absolute;
    right: 9%;
    top: 220px;
	max-width: 216px;
	background-color: white;
    border-radius: 4px;
    background-image: url(../../images/select_floor.png);
    background-repeat: no-repeat;
	background-position: 7px;
}

.select_floor p{
	font-size: 35.5px;
    color: white;
	font-family: 'open_sanssemibold';
	text-transform: uppercase;
	color: #009bdf;
    padding: 5px 15px 5px 58px;
    line-height: 0.9;
}
.select_floor .small {
	font-size: 29.5px;
}
/* HOUSE MARKER */
.house_marker{
	/*
	font-family: 'open_sanssemibold';
	background:url(../../images/icon_number_house_2.png);
	width: 73px;
    height: 102px;
    position: absolute;
    color: white;
    font-size: 56px;
    text-align: center;*/
	font-family: 'open_sanssemibold';
    background: url(../../images/icon_number_house_3.png);
	background-position: center;
    /*width: 101px;
    height: 128px;*/
    width: 54px;
    height: 67px;
    position: absolute;
    color: white;
    /*font-size: 56px;*/
    font-size: 34px;
    text-align: center;
	/*margin-top: -128px;
    margin-left: -50.5px;*/
    margin-left: -27px;
    margin-top: -67px;
}
.house_marker p:first-child{
	
   /* margin-top: 14px;*/
	
}
.house_marker p:last-child{
    text-transform: uppercase;
    /*font-size: 13px;*/
    display: inline-block;
    vertical-align: top;
    /*margin-top: 9px;*/
    font-size: 10px;
    margin-top: 7px;
    
}
/* MARKERS */
.markerSVG{
	position: absolute;
	/*display: block!important;*/
	display: none;
	color: white;
    background: rgba(24,137,200,0.90);	
    width: 93px;
    height: 61px;
    text-align: center;
    text-transform: uppercase; 
	font-family: 'open_sanssemibold'; 
    line-height: 1.1;
	border-radius: 4px;	      
    /*margin-top: 27px;*/
    margin-left: -46.5px;
    pointer-events: none;
}
.markerSVG p:first-child{
	font-size:16px;
	display: inline-block;
    margin-top: 10px;
}
.markerSVG p:nth-child(2){
	font-size:26px;
}
.markerSVG div{
	position: absolute;
	right: -8px;	
    bottom: -7px;
    background: #f89200;
    width: 25px;
    height: 18px;
    border-radius: 11px;
    font-size: 14px;
    line-height: 1.3;
    text-align: center;
}
.markerSVG_2 div{
	right: 0;
    left: -9px;
}
.house_marker_show{
	background:url(../../images/icon_number_house_hover.png);
	background-position: center;
}

.pop_up_floor {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translateX(-50%) translateY(-40%) scale(0);
    width: 60%;
    max-width: 1077px;
    background-color: #FFF;
    border-radius: 8px;
    padding: 20px;
    box-sizing: border-box;
    z-index: -50;
    opacity: 0;
}

.pop_up_floor.show {
    transform: translateX(-50%) translateY(-40%) scale(1);
    z-index: 999;
    opacity: 1;
}

.pop_up_floor_but_wrap {
    text-align: center;
    width: calc(100% - 70px);
    margin: auto;
}

.but_toggle_floor {
    color: #019cdf;
    font-size: 16px;
    text-transform: uppercase;
    outline: none;
    background-color: transparent;
    border: 2px solid #019cdf;
    border-radius: 6px;
    padding: 5px 10px;
    margin: 0 5px;
    cursor: pointer;
    outline: none;
    transition: all 0.2s ease-in-out;
}

.but_toggle_floor.active,
.but_toggle_floor:hover {
    background-color: #07316d;
    border: 2px solid #07316d;
    color: #FFF;
}

.close_pop_up_floor {
    position: absolute;
    top: 20px;
    right: 20px;
    width: 30px;
    height: 30px;
    background-image: url(../../images/icon-close-popup.png);
    background-repeat: no-repeat;
    background-position: center;
    background-color: transparent;
    border: 2px solid #019cdf;
    border-radius: 6px;
    cursor: pointer;
    outline: none;
    transition: all 0.2s ease-in-out;
}

.close_pop_up_floor:hover {
    border: 2px solid #07316d;
}

.floor_type {
    position: absolute;
    top: 0;
    left: 0;
    transform: scale(0);
    opacity: 0;
    pointer-events: none;
    margin-top: 20px;
    display: flex;
    justify-content: space-around;
    height: 60vh;
    max-height: 570px;
}

.show_floor {
    position: static;
    transform: scale(1);
    opacity: 1;
    pointer-events: auto;
}

.floor_type > div {
    position: relative;
}

.mini_floor_wrap {
    display: flex;
    justify-content: center;
    align-items: center;
}

.mini_floor_wrap {
    width: 20%;
}

.mini_floor_wrap img {
    width: 100%;
    max-width: 177px;
}

.pop_up_floor_img_wrap {
    width: 70%;
}
.pop_up_floor_img_wrap img {
    max-width: 100%;
    max-height: 100%;
}

/* *** FLOOR *** */
#render-slavutich-floor{
	position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    overflow: hidden;
    min-width: 1024px;
    min-height: 604px;	
}
.container_floor{
	position: absolute;
	width:100%;
 	height: calc(100% - (72px));
 	top: 72px;
}
.river1:after{	
	content: url('../../images/zatoka.png');
    position: absolute;
    left: 137px;
    right: 0;
    margin: auto;
    text-align: center;
	
}
.river1:before{
	font-family: 'open_sanssemibold';
	content: "Затока";
    position: absolute;
    top: 18px;
    left: 36%;
    text-transform: uppercase;
    color: #139fda;
    font-size: 14px;
}
.river2:after{
    content: url('../../images/dnipro.png');
    position: absolute;
    top: 282px;
}
.river2:before{
	font-family: 'open_sanssemibold';
	content: "Дніпро";
    position: absolute;
    top: 481px;
    left: 30px;
    text-transform: uppercase;
    color: #139fda;
    font-size: 14px;

}
.river3:before{
	content: "Дніпро";
}

.back_to_houses{
    position: absolute;
    top: 62px;
    left: 66px;
}
.back_to_houses .arrow{
	display: inline-block;
	background:url(../../images/back_to_houses.png);
	width: 44px;
    height: 65px;
    transition: all 0.2s linear;
}
.back_to_houses .arrow:hover{
	opacity: 0.5;
}

.back_to_houses .number{
	font-family: 'open_sanssemibold';
	display: inline-block;
	width: 89px;
	height: 59px;
	vertical-align: top;
	color:#009ae6;
	text-align: center;
	text-transform: uppercase;
    line-height: 1.4;
    border: 3px solid #009ae6;
    border-radius: 5px;
}
.back_to_houses .number p:last-child{
	font-size:27px;
}
.change_number{
	font-family: 'open_sanssemibold';
	width: 96px;
    height: 59px;
    background: #22487d;
    display: inline-block;
    vertical-align: top;
    border-radius: 5px;
    color: white;
    text-transform: uppercase;
    text-align: center;
    line-height: 1.4;
    border: 3px solid #22487d;
    position: relative;
}
.change_number .arrow_up{
	position: absolute;
	background:url(../../images/arrow_up_flats.png) no-repeat;
	width: 32px;
    height: 19px;
    top: -26px;
    left: 34px;
}
.change_number .arrow_down{
	position: absolute;
	background:url(../../images/arrow_up_flats.png) no-repeat;
	transform: rotate(180deg);
	width: 32px;
    height: 19px;
	left: 34px;
	bottom:-25px;
	transition: all 0.2s linear;
}
.change_number .arrow_down:hover,.change_number .arrow_up:hover{
	opacity: 0.5;
}

.change_number p:nth-child(2){
	font-size: 27px;
}
.compas_slav{
	position: absolute;
	background:url(../../images/compas.png);
	width: 72px;
    height: 73px;
    left: 29%;
    top: 7%;
    pointer-events: none;
}
.floor_slav{
	position: absolute;
    height: 646px;
    width: 884px;
    left: 50%;
    margin-left: -386px;
    top: 50%;
    /*margin-top: -323px;*/
	margin-top: -288px;

}
@media (max-width:1375px){
	.floor_slav{
	    left: 56%;
	}
	.compas_slav{
		left: 326px;
	    top: 56px;
	}
}

@media (max-width:1150px), (max-height:850px){
	.floor_slav {
	    width: 758px;
	    height: 554px;
	    margin-left: -321px;
	    margin-top: -292px;
		top: 56%;
	}
.marker_flat div:first-child {
    	font-size: 24px;
    }
}
@media (max-height:750px){
	.floor_slav {
	    width: 678px;
	    height: 495px;
	    margin-top: -259px;
		margin-left: -264px;
	}
	.marker_flat_prodano{
		font-size:14px!important;
	}
	.marker_flat{
		height: auto!important;
		min-width:51px!important;
	}
	.marker_flat div:first-child{
		padding: 0 4px!important;
	  	padding-bottom: 8px!important;
	}
	.marker_flat div:first-child {
    font-size: 24px;
}

}
@media (max-height:650px){
	.floor_slav {
	    width: 564px;
	    margin-left: -235px;
	    margin-top: -209px;
	    height: 412px;
	}
		.marker_flat{
		min-width:51px!important;
	}
}


.genplan_slav{
    font-family: 'open_sanssemibold';
    text-transform: uppercase;
    color: #0d2e4f;
    position: absolute;
    /*background: url(../../images/gen_plan_2.png) no-repeat 0 29px;*/
    /*width: 166px;*/
    width: 177px;
    /*height: 190px;*/
    left: 129px;
    bottom: 7%;
}

.floor_plan_mini {
    width: 100%;
    max-width: 177px;
    margin-bottom: 40%;
}

.genplan_slav div{
	float: left;
	margin-right: 6px;
}
.gen_plan_container{
	width:166px;
	height:156px;
	position: relative;
}
.gen_plan_container img{
	width: 100%;
}
@media (max-height:840px), (max-width:1270px){
	.gen_plan_container{
		width:120px;
		height:113px;
	}
}
#img_floor{
	position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
	width: 100%;
}
.floor_text{
	font-family: 'open_sanssemibold';
	position: absolute;
	bottom: -37px;
    left: 65px;
    text-transform: uppercase;
	color: #0d2e4f;
    font-size: 13px;
 	display: none;
}
.floor_text:before{
	position: absolute;
	content: url('../../images/arrow_right_plan.png');
	left: -32px;
    top: -7px;
}
.numberHouse{
	width:13px;
	height: 25px;
	
}
.number_house_1{
	/*background:url(../../images/number_house_1.png) no-repeat;*/
	/*font-size: 22px;*/
	font-size: 18px;
    line-height: 0.8;
    color:#009bdf;
}
.marker_flat{
    font-family: 'open_sanssemibold';
    text-transform: uppercase;
    position: absolute;
    padding: 5px;
    background: rgba(23,60,113,0.89);
    border-radius: 5px;
	line-height: 1.2;
	text-decoration: none;
	/*margin-left: -7px;*/
	height: 74px;
	min-width: 60px;
	/*margin-left: -37px;
    margin-top: -101px;*/
   /* display: none;*/
    /*display: block!important;*/
}
.marker_flat div:first-child{
	font-size:28px;
	color:white;
	position: relative;
	/*margin-bottom: 6px;*/
	padding: 7px 4px;
	text-align: center;
	padding-top: 3px;
}
.marker_flat div:first-child:after{
	position: absolute;
	content: url('../../images/wave.png');
	left: 0;
    right: 0;
    text-align: center;
    bottom: -8px;
}
.marker_flat_hover, .marker_flat:hover {
	background:#18a2de; 
	opacity : 0.89;
}
.color_white, .marker_flat:hover .square2{
	color:white!important;
}
.before_wave:before, .marker_flat:hover div:first-child:before{
	content: url('../../images/wave_white.png');
    left: 0;
    right: 0;
    text-align: center;
    bottom: -8px;
    position: absolute;
	z-index: 1;

}
.marker_flat_rezerv{
	
	text-transform: uppercase;
	text-decoration: none;
	color:#378bcd;
	font-size: 21px;
	position: absolute;
    bottom: -31px;
    left: -2px;
}

.square1{
    font-size: 18px;
    color:white;
    text-align: center;
}
.square2{
	font-size: 18px;
	color: #0689ca;
	text-align: center;
}

.marker_flat_prodano{
	font-family: 'open_sanssemibold';
	text-transform: uppercase;
	text-decoration: none;
	color:#378bcd;
	font-size: 21px;
	position: absolute;
    /*margin-left: -53px;
    margin-left: -19px;*/
	margin-left: -20px;
}


/* FLAT */
.flat_slav{
    position: absolute;
    height: 637px;
    width: 800px;
    left: 50%;
    margin-left: -400px;
    top: 50%;
    margin-top: -323px;
    text-align: center;
}
.flat_slav img{
	height:100%;
}
.compas_flat_slav{
    position: absolute;
    background: url(../../images/compas.png);
    width: 72px;
    height: 73px;
    left: 30%;
    top: 10%;
    z-index: 5;
}

.flat_text{
	margin-top: 15px;
}
.flat_text div{
	width:50%;
	float: left;
	font-family: 'open_sanssemibold';

    text-transform: uppercase;
    color: #0d2e4f;
    font-size: 13px;
}



.flat_text_1{
	position: relative;
    /*bottom: -37px;*/
    left: 65px;
    text-transform: uppercase;
    color: #0d2e4f;
    font-size: 13px;

}
.flat_text_1:before{
	position: absolute;
	content: url('../../images/condicioner.png');
	margin-left: -43px;
    top: -3px;
}
.flat_text_2{
	position: relative;
}
.flat_text_2:before{
    position: absolute;
    content: url('../../images/arrow_right_plan.png');
    margin-left: -32px;
    top: -7px;
}
.information{
	position: absolute;
    right: 5%;
    top: 13%;
}
.informationTitle{
	color:#009bdf;
	font-size: 93px;
	font-family: 'open_sanssemibold';
	text-transform: uppercase;
	padding-left: 10px;
}
.informationMiddle{
	font-family: 'open_sanssemibold';
	display: inline-block;
    background: #0884c8;
    width: 100%;
    border-radius: 5px;
    color: white;
    text-transform: uppercase;
}
.infLeft{
	float: left;
	font-size: 14px;
	padding: 13px 25px;
    line-height: 1.5;
    text-align: right;
}
.infRight{
	padding: 13px 17px;
    line-height: 1.5;
    text-align: right;
    /*height: 51px;*/
    display: inline-block;
    background: #22487d;
    border-radius: 5px;
    float: right;
}
.infRight p sup{
	font-size: 10px;
}
table{
	font-family: 'open_sanssemibold';
	width: 100%;
    display: inline-block;
	margin: 5px 0;
    color:#494949;
	font-size: 14px;
}
#krpanoSWFObject table{
	display: table;
}
table td{
	padding: 3px 0;
}
table tr>td:first-child{
    color: #22487d;
    width: 30px;
    text-align: right;
}
table tr>td:nth-child(2){
	width: 165px;
    padding-left: 12px;
    
}
table tr>td:last-child{
	text-align: right;
	padding-right: 5px;
}
table tr td sup{
	font-size: 10px;
}
.buttons a{
	text-decoration: none;
	color: white;
	font-size: 13px;
	
}
.download_plan{
	display:inline-block;
	font-family: 'open_sanssemibold';
	text-transform: uppercase;
	width: 152px;
    border-radius: 5px;
    background: #22487d;
    transition: all 0.2s linear;
}
.download_plan:hover, .zayava:hover{
	opacity: 0.5;
}
.download_plan a{
	padding: 11px;
	padding-left: 43px;
    background-image: url(../../images/download_icon.png);
    background-repeat: no-repeat;
	background-position: 10px center;
	display: block;
}
.zayava{
    display: inline-block;
    font-family: 'open_sanssemibold';
    text-transform: uppercase;
    width: 134px;
    border-radius: 5px;
    background: #22487d;
	transition: all 0.2s linear;
}
.zayava a{
	padding: 11px;
	padding-left: 43px;
    background-image: url(../../images/zayava.png);
    background-repeat: no-repeat;
	background-position: 10px center;
	display: block;
}
/* genplan */
.markerBig {
    height: 41px;
  

}

.textRight {
    display: none;
    height: 100%;
    padding: 0 10px;
    line-height: 1;
    background-color: #ffffff;
    color: #33598a;
    font-family: 'PFDinTextCondPro-Medium';
    /*font-size: 16px;*/
    font-size: 13px;
    text-transform: uppercase;
    font-family: 'open_sanssemibold';
    flex-direction: column;
    justify-content: center;
    /*display: flex;*/
    text-align: left;
}
.imgRight:hover + .textRight {
    display: block;
    display: flex;
	border-radius: 5px;
    margin-left: -6px;
    max-width: 228px;
}
.textSmall{
	border-radius:5px;
	font-family: 'open_sanssemibold';
	max-width: 191px;
    display: flex;
    text-align: left;
    line-height: 1;
	flex-direction: column;
    justify-content: center;
	/*font-size: 16px;*/
	font-size: 13px;
    padding: 7px 10px;
}
.room_number{
    position: absolute;
    background: #22487d;
    color: white;
    border-radius: 50%;
    font-size: 16px;
    padding: 3px 3px;
    font-family: 'open_sanssemibold';
    width: 20px;
    height: 20px;
    line-height: 1.2;
	margin-left: -13px;
    /*display:none;*/
}








@media (max-width:1360px), (max-height:850px){
	.markerBig {
	    height: 35px;
	}
	.imgRight, .imgLeft{
    	transform: scale(0.8);
	}
	.textRight {
	    margin-top: 5px;
	    margin-left: -9px!important;
	    height: 95%;
	}
}

@media (max-height:800px), (max-width:1395px){
	.flat_slav {
		width: 474px;
		height: 381px;
		margin-top: -174px;
		margin-left: -274px;
    }
    .flat_slav img{
		max-width:474px;
		max-height:381px;
	}
    
    
    
    /*.information {
		right: 1%;
    }
    .infLeft {
		padding: 13px 16px;
    }
    .infRight {
    	padding: 9px 6px;
	}
    .informationTitle {
	    font-size: 65px;
    }
    .zayava {
    	width: 117px;
	}
	.download_plan {
    	width: 138px;
    }
    .download_plan a,.zayava a {
	    padding: 6px;
	    padding-left: 33px;
	    background-position: 6px center;
    }
    table tr>td:nth-child(2) {
    	width: 150px;
    }*/
    .flat_text div {
    	font-size: 11px;
    }
 	.information {
		right: 1%;
    }
    .infLeft {
		padding: 13px 16px;
    }
    .infRight {
    	padding: 13px 6px;
	}
    .informationTitle {
	    font-size: 65px;
    }
    .zayava {
    	width: 117px;
	}
	.download_plan {
    	width: 138px;
    }
    .download_plan a,.zayava a {
	    padding: 6px;
	    padding-left: 33px;
	    background-position: 6px center;
    }
    table tr>td:nth-child(2) {
    	width: 150px;
    }
	
}

@media (max-height:880px) and (max-width:1200px), (max-width:1200px){
	
	
	
}



@media (max-height:840px), (max-width:1270px){
	
	/*.floor_slav {
	    width: 470px;
	    height: 343px;
	    margin-left: -100px;
	    margin-top: -170px;
	}*/
	/*.compas_slav {
		left: 36%;
	    top: 13%;
    }*/
	.genplan_slav {
        bottom: 7%;
		width: 120px;
	}	
	.marker_flat div:first-child {
    	/*font-size: 24px;*/
    }
    .marker_flat div:first-child:after,.marker_flat div:first-child:before {
        transform: scale(0.8);
    	left: -5px!important;
    }
   
}