	.interactive-map{
		position: relative;
		text-align: center;
	}
	
	.interactive-svg{
		position: absolute;
		top:0;
		left: 0;
		height: 100%;
        width: 100%;
	}
	
	.interactive-img{
	
	}
	
	.office{
		opacity: .2;
		transition: .3s;
		position: relative;
	}

	.office_link::before{
		
	}

	.office::before{
		position: absolute;
		content: '';
	}

	
	.office:hover{
		/*opacity: 0.45;*/
        opacity: 0;
		cursor: pointer;
	}



	.interactive-map-modal{
		position: fixed;
		background: rgba(0,0,0,0.8);
		width: 100%;
		height: 100%;
		top: 0;
		left: 0;
		display: none;
		z-index: 999;
	}

	.interactive-map-modal-block{
		background: white;
		margin: 0 auto;
		margin-top: 30px;
		border-radius: 10px;
		padding: 10px;
		max-width: 900px;
    	width: 100%;
	}

	.interactive-map-modal-block-content{
		padding: 5px 30px 0px 5px;
		position: relative;
	}

	.interactive-map-close-modal{
		position: absolute;
		z-index: 99;
		display: block;
		background: url("/bitrix/templates/concept_kraken_s1/images/modal-close.png") center no-repeat;
		background-position: center;
		cursor: pointer;
		top: -10px;
		right: -40px;
		width: 22px;
		height: 22px;
		filter: alpha(opacity=80);
		-moz-opacity: .8;
		opacity: .8;
		background-size: contain;
		border-bottom: 0;
	}

	/*Контент модального окна*/
	.interactive-map-modal-content{
		display: flex;
	}

	.interactive-map-modal-content-left{
		width: 40%;
		align-items: center;
	}

	.interactive-map-modal-content-right{
		padding-left: 30px;
		padding-right: 0px;
		font-family: 'Tahoma';
		width: 60%;
		display: flex;
		align-items: center;
	}

	.interactive-map-modal-content-left > .img-block{
		overflow: hidden;
		width: 100%;
		height: 400px;
	}

	.interactive-map-modal-content-left > .img-block img{
		object-fit: cover;
		width: 100%;
		height: 100%;
	}

	.interactive-map-modal-content-right > .content-block{

	}

	
	.interactive-map-modal-content-right > .content-block > h4{
		font-size: 25pt;
		padding-top: 0px;
		margin-top: 0px;
		color: black;
		width: auto;
		padding-bottom: 15px;
		border-bottom: 3px solid #ff4d11;
	}

	@media screen and (max-width: 700px){
		.interactive-map-modal-content-right > .content-block > h4{
			font-size: 22pt;
			margin-top: 0px;
			position: relative;
			background: transparent;
			padding: 0px;
			top: auto;
			right: auto;
			text-align: center;
			color: royalblue;
			margin-bottom: 25px;
			border: none;
		}
	}


	.interactive-content-title{
		font-size: 12pt;
   		margin-bottom: 0;
	}

	@media screen and (max-width: 700px){
		.interactive-content-title{
			font-size: 12pt;
		}
	}

	.interactive-content-value{
			font-size: 12pt;
	}

	.interactive-content-main-btn{
		padding: 14px 10px;
		background-color: #ff4d11;
		-webkit-transition: background-color .3s;
		font-weight: normal;
		font-size: 15px;
		line-height: 15px;
		cursor: pointer;
		border: 0;
		white-space: nowrap;
		text-decoration: none !important;
		text-align: center;
		display: inline-block;
		max-width: 100%;
		text-overflow: ellipsis;
		color: white;
		font-weight: 600;
		letter-spacing: 0px;
		transition: .3s;
	
	}

	@media screen and (max-width: 700px){

		.interactive-content-main-btn{
			width: 100%;

		}

	}

	.interactive-content-main-btn:hover{
		color: whitesmoke;
		transition: .3s;
		background: #e75702;
	}

	.disabled {
		pointer-events: none;
		cursor: default;
		color: #999;
	}


/*Мобильные стили кастомного попапа*/
@media screen and (max-width: 700px){
	.interactive-map-modal-block{
		background: white;
		margin: 0 auto;
		margin-top: 60px;
		border-radius: 10px;
		padding: 0px;
		max-width: 900px;
		width: auto;
		margin-left: 20px;
		margin-right: 20px;
		height: 90%;
	}

	.interactive-map-modal-block-content {
		padding: 20px;
		position: relative;
		height: 100%;
	}

	.interactive-map-close-modal {
		position: absolute;
		z-index: 99;
		display: block;
		background: url(/bitrix/templates/concept_kraken_s1/images/modal-close.png) center no-repeat;
		background-position: center;
		cursor: pointer;
		top: -45px;
		right: calc(50% - 16px);
		width: 32px;
		height: 32px;
		opacity: .8;
		background-size: contain;
		border-bottom: 0;
		background-color: #a1a1a1;
		border-radius: 50px;
		padding: 10px;
		background-size: auto;
	}

	.interactive-map-modal-content {
		display: flex;
		flex-direction: column;

		height: 100%;
		overflow-y: scroll;
	}

	.interactive-map-modal-content-left {
		width: 100%;
		align-items: center;
	}

	.interactive-map-modal-content-right {
		padding-left: 0px;
		padding-right: 0px;
		font-family: 'Tahoma';
		width: 100%;
		display: flex;
		align-items: center;
		margin-top: 20px;
	}

	.interactive-map-modal-content-left > .img-block{
		overflow: hidden;
		display: flex;
		justify-content: center;
		align-items: center;
		height: 300px;
	}

	.interactive-map-modal-content-left > .img-block > img {
		width: 100%;
		background-size: cover;
		height: auto;
		overflow: hidden;
		background-repeat: no-repeat;
	}

}

/*Стиль блока с характеристиками офиса*/

.office-option-block{
	display: flex;
    justify-content: space-between;
    width: 100%;
    margin-bottom: 15px;
    margin-top: 15px;
}

.office-option-block{

}

.office-option-block > .option-block .interactive-content-title{
    font-size: 14pt;

}

.office-option-block > .option-block .interactive-content-value{
    font-size: 16pt;
}

.interactive-content-value > span{
	font-weight: 700;
	color: #202020;
}

.interactive-content-value > span > span{
	font-weight: 400;
	font-size: 14pt;
}


.office-option-block > .option-block .interactive-content-value > i{
    color: #076afe;
}

.interactive-content-block-btn{
	position: absolute;
    bottom: -10px;
    right: -10px;
}

.interactive-content-block-btn:before{
	content: '';
}

.interactive-content-block-btn > a{
	padding: 20px;
    padding-left: 30px;
    padding-right: 30px;
    font-size: 13pt;
    border-radius: 10px 0px 10px 0px;
}

#OFFICE_DESCRIPTION{
	margin-bottom: 80px;
}

@media screen and (max-width: 700px){

	.office-option-block > .option-block .interactive-content-value{
		font-size: 14pt;
	}

	.office-option-block{
		flex-wrap: wrap;
		background: #fbfbfb;
		padding: 15px;
		box-shadow: 0px 0px 5px #b5b1b1;
		margin-left: 4px;
		width: calc(100% - 7px);
		border-radius: 5px;
	}

	.interactive-content-block-btn{
		position: absolute;
		bottom: 0px;
		left: 0px;
		width: 100%;
	}

	.interactive-content-block-btn > a{
		width: 100%;
		border-radius: 0px 0px 10px 10px;
		padding: 15px;
	}



}


.interactive-modal-gallery{
	display: flex;
	margin-top: 10px;
	flex-wrap: wrap;
}

.gallery-item {
    width: calc(25% - 7.6px);
    padding: 0px;
    margin-right: 10px;
    margin-bottom: 5px;
}

.gallery-item:last-child{
	margin-right: 0px;
}

.gallery-item:nth-child(4),.gallery-item:nth-child(8),.gallery-item:nth-child(12){
	margin-right: 0px;
}

.gallery-item > .gallery-img > a{
	display: block;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 80px;
}

@media screen and (max-width: 700px){
	.gallery-item > .gallery-img > a {
		height: 65px;
	}
}

.gallery-item > .gallery-img > a > img{
	display: block;
    background-repeat: no-repeat;
    background-size: cover;
    object-fit: cover;
    width: 100%;
    height: 100%;
}




.interactive-modal-gallery{
	display: flex;
	margin-top: 10px;
	flex-wrap: wrap;
}

.gallery-item {
    width: calc(25% - 7.6px);
    padding: 0px;
    margin-right: 10px;
    margin-bottom: 5px;
}

.gallery-item:last-child{
	margin-right: 0px;
}

.gallery-item:nth-child(4),.gallery-item:nth-child(8),.gallery-item:nth-child(12){
	margin-right: 0px;
}

.gallery-item > .gallery-img > a{
	display: block;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 80px;
}

@media screen and (max-width: 700px){
	.gallery-item > .gallery-img > a {
		height: 65px;
	}
}

.gallery-item > .gallery-img > a > img{
	display: block;
    background-repeat: no-repeat;
    background-size: cover;
    object-fit: cover;
    width: 100%;
    height: 100%;
}

/*Стиль меню*/
.menu-active{
	background: #ff4d11!important;
	color: white!important;
	transition: .3s;
}

.menu-floor-block{
	padding-bottom: 25px;
}

.menu-floor-block-content{
	width: max-content;
	display: flex;
	justify-content: center;
	background: #ffffff;
	margin: 0 auto;
	margin-top: 20px;
	border-radius: 20px;
	box-shadow: 0px 0px 20px 0px #6e645d;
	background: #5a37f5;
}

.menu-floor-block-content > a{
	padding-left: 40px;
	padding-right: 40px;
	background: #f7f7f7;
	color: #303030;
	text-decoration: none;
	transition: .3s;
}

.menu-floor-block-content > a:hover{
	color: black;
	background: #ff9e6f;
}

.menu-floor-block-content > a:first-child{
	border-radius: 15px 0 0 15px; 
}

.menu-floor-block-content > a:last-child{
	border-radius: 0 15px 15px 0; 
}

.menu-floor-block-content > a > p{
	font-family: 'Tahoma';
	font-size: 30px;
	margin-top: 25px;
	margin-bottom: 25px;
}


@media screen and (max-width: 500px){
	.menu-floor-block-content > a > p {
		font-family: 'Tahoma';
		font-size: 18px;
		margin-top: 15px;
		margin-bottom: 15px;
	}

	.menu-floor-block-content > a {
		padding-left: 20px;
		padding-right: 20px;
		background: #f7f7f7;
		color: #303030;
		text-decoration: none;
		transition: .3s;
	}
}

/*Стиль инфо блока по цветам*/
.color-info-block{
	display: flex;
	justify-content: center;
	margin-top: 30px;
}

.color-info-block-first{
	display: flex;
	align-items: center;
	margin-right: 20px;
}

.color-info-block-first-text{
	margin: 0;
	margin-left: 10px;
}

.color-info-block-first-color{
	width: 60px;
	height: 30px;
	background: #00ff00;
}

.color-info-block-second{
	display: flex;
	align-items: center;
}

.color-info-block-second-text{
	margin: 0;
	margin-left: 10px;
}

.color-info-block-second-color{
	width: 60px;
	height: 30px;
	background: #ef5858;
}

@media screen and (max-width: 700px){
	.color-info-block-first-color{
		width: 20px;
		height: 20px;
	}
	.color-info-block-second-color{
		width: 20px;
		height: 20px;
	}

}

/*Подсказка к офису*/
.officeHintInfo{
	position: absolute;
	z-index: 10;
	padding: 10px;
	background: rgb(229, 255, 229);
	border-radius: 10px;
	box-shadow: lightgrey 0px 2px 5px;
	display: none;
}

.officeHintInfo > p:first-child{
	margin: 0;
}

.officeHintInfo > p:last-child{
	margin: 0;
	color: green;
	font-weight: 700;
}