.szz-map-with-pins{
	margin: 3rem auto;
	
}
.szz-map-with-pins__map-container,
.szz-map-with-pins__pin-visual-placeholder,
.zz-map-with-pins__map-img-container
{
	position:relative;
}
.szz-map-with-pins__map,
.szz-map-with-pins__pin-visual{
	position:absolute;
	top: 0;
	width:100%;
	height:100%;
	max-width:100%;
	max-height:100%;
	min-width:100%;
	min-height:100%;
	object-fit: cover;
	-o-object-fit: cover;
}
.szz-map-with-pins__pin-item{
	position: absolute;
	z-index:10;
}
.szz-map-with-pins__pin-marker{
	border-radius: 50%;
	width:1.5rem;
	height: 1.5rem;
	background-color:var(--primary-light);
	border: 4px solid var(--semi-white);
	box-shadow: var(--box-shadow);
	transition: transform .5s ease-out;
}
.szz-map-with-pins__pin-item--desktop:hover > .szz-map-with-pins__pin-meta-container--desktop{

	display:block;
	
}
.szz-map-with-pins__pin-item--desktop:hover > .szz-map-with-pins__pin-marker--desktop{
	transform: scale(1.8);
}
@keyframes szz-map-with-pins--fade-out{
	from{ 
		opacity:0;
		bottom: 3rem;
	}
	to{
		opacity:1;
		bottom: 1.5rem;
	}
}
.szz-map-with-pins__pin-meta-container--desktop{
	position:absolute;
	bottom: 1.5rem;
	max-width:20rem;
	width: max-content;
	left:50%;
	transform: translateX(-50%);
	padding:1rem;
	border-radius: .5rem;
	background-color: var(--semi-white);
	border: 1px solid var(--gray-50);
	box-shadow: var(--box-shadow);
	display:none;
	animation: szz-map-with-pins--fade-out .5s ease-out;
}
.szz-map-with-pins__pin-meta-container--desktop:after{
	content:'';
	width:1rem;
	height:1rem;
	background-color: var(--semi-white);
	border: 1px solid var(--gray-50);
	transform: translateX(-50%) rotate(45deg);
	border-width: 0 1px 1px 0px;
	bottom: -.5rem;
	position:absolute;
	left: 50%;
}
.szz-map-with-pins__pin-description>*{
	font-family: "Archivo";
	font-size: .875rem;
	line-height:1.5;
	margin-bottom: .25rem;
}
.szz-map-with-pins__pin-visual-placeholder--desktop{
	margin-bottom:1rem;
	width: 18rem;
}
.szz-map-with-pins__pin-visual-placeholder{
	border-radius: .25rem;
}
.szz-map-with-pins__pin-title--desktop{
	margin-bottom:.5rem;
}
.szz-map-with-pins__map-img-container{
	border-radius: .5rem;
	border: 1px var(--gray-50);
	box-shadow: var(--box-shadow);
}

/*-----mobile-----*/
.szz-map-with-pins__map-container--mobile{
	position:relative;
	width:40%;
	margin: 0 auto -1rem;
	z-index:10;
}
.szz-map-with-pins__slider-container{
	overflow: hidden;
	height: 100vw;
	max-height:32rem;
	position:relative;
}
.szz-map-with-pins__slider-keeper{
	display:flex;
	position:absolute;
	top:0;
	left:0;
	height:100%;
	overflow: hidden;
    transition: transform var(--move-ch-shape);
}
.szz-map-with-pins__pin-meta-container--mobile{
	width:100vw;
	padding: 0 1rem;
}
.szz-map-with-pins__pin-visual-placeholder--mobile{
	margin: 0 auto 1rem;
	max-width:90vw;
}
.szz-map-with-pins__pin-title--mobile{
	margin-bottom:.5rem;
	text-align:center;
}
.szz-map-with-pins__pin-description--mobile{
	width: max-content;
	max-width:100%;
	margin: 0 auto;
	opacity: .75;
	text-align:center;
}
.szz-map-with-pins__pin-visual-placeholder--empty-mobile{
	min-height:56vw;
	max-height: 360px;
}
.szz-map-with-pins__pin-marker--mobile{
	width:.75rem;
	height:.75rem;
	border-width: 2px;
}
.szz-map-with-pins__pin-marker--mobile.active{
	transform: scale(1.8);
}
.szz-map-with-pins__arrow path{
	fill: var(--black);
}
.szz-map-with-pins__arrow {
	position: absolute;
	z-index: 2;
	cursor: pointer;
	top: 50%;
	transform: translateY(-50%);
	width: 2rem;
	height: 2rem;
	padding: 0.25rem;
	border-radius: 50%;
	background-color: var(--semi-white);
	border: 1px solid var(--gray-50);
	box-shadow: var(--box-shadow);
	transition: var(--change-color-fade);
}
.szz-map-with-pins__pin-item--desktop:hover{
	z-index:40;
}


.szz-map-with-pins__arrow.inactive,
.szz-map-with-pins__arrow.inactive:hover {
	background-color: var(--semi-white);
	cursor: default;
	opacity: 0.5;
}

.szz-map-with-pins__arrow svg {
	width: 100%;
	height: 100%;
}

.szz-map-with-pins__arrow--left {
	left: 0.5rem;
}

.szz-map-with-pins__arrow--right {
	right: 0.5rem;
}
.szz-map-with-pins__map-wrapper--mobile{
	position:relative;
}
.szz-map-with-pins__map-wrapper--mobile:before{
	content:'';
	width:100%;
	height:80%;
	top:20%;
	left:0;
	border-top: 1px solid var(--gray-40);
		border-bottom: 1px solid var(--gray-40);
	position:absolute;
	background-color: var(--gray-30);
}
@media (max-width: 960px){
	.szz-map-with-pins__caption{
		margin-top: .75rem;
	}
}


/*------progress map-------*/
.szz-map-with-pins__map--progress{
	transition: transform var(--move-ch-shape);
	position:absolute;
	top:0;
	width:100%;
	height: 100%;
}
.szz-map-with-pins__pin-item--progress{
	transition: transform var(--move-ch-shape);
}
.szz-map-with-pins__progress-item{
	max-width: 80%;
	margin: 0 auto;
	position:relative;
	z-index: 1;
	padding-top: 0vh;
	padding-bottom: 100vh;
}
.szz-map-with-pins__map-img-container--progress{
	border-radius:0;
	background-color: var(--black);
	
}
.szz-map-with-pins__map-container--progress{
	overflow:hidden;
}
.szz-map-with-pins__pin-meta-container--progress{
	padding: 5vw;
	border-radius: .5rem;
	background: var(--semi-white);
	border: 1px solid var(--gray-50);
	box-shadow:var(--box-shadow);
	opacity:.9;
}
.szz-map-with-pins__pin-meta-container--progress>*:last-child{
	margin-bottom:0;
}
.szz-map-with-pins__pin-visual-placeholder--progress{
	margin-bottom: 1rem;
}
.szz-map-with-pins__pin-title--progress{
	margin-bottom: .5rem;
}
.szz-map-with-pins__pin-marker--progress{
	width: 1rem;
	height: 1rem;
	border-width: 2px;
	transition: transform var(--move-ch-shape);
}
.szz-map-with-pins__pin-marker--active>.szz-map-with-pins__pin-marker--progress{
	transform: scale(2);
}
.szz-map-with-pins__pin-marker--active{
	z-index:11;
}
.szz-map-with-pins__pin-marker--active>.szz-map-with-pins__pin-meta-container--adress{
	display: flex;
	padding: .5rem;
	font-size:.875rem;
}
.szz-map-with-pins__pin-description--progress>p{
	color:black;
}
.szz-map-with-pins__map-container--progress{
	background: var(--gray-50);
	box-shadow:var(--box-shadow);
}
.szz-map-with-pins__progressive-operator{
	transition: transform var(--move-ch-shape);
}
@media only screen and (min-width: 960px){
	.szz-map-with-pins__pin-marker--progress{
	width: 1.5rem;
	height: 1.5rem;
	border-width: 4px;
	
}
	.szz-map-with-pins__progress-item{
		max-width: 400px;
		
	}
	.szz-map-with-pins__pin-meta-container--progress{
		padding: 1.5rem;
	}
	.szz-map-with-pins__map-img-container--progress{
	border-radius:.5rem;
	}
	.szz-map-with-pins__pin-marker--active>.szz-map-with-pins__pin-marker--progress{
		transform: scale(3);
	}
	.szz-map-with-pins__map-container--progress{
		border-radius: .5rem;
		border:1px solid var(--gray-70);
	}
}





