div.map.section {
	padding:0;
}

.mapboxgl-canvas-container.mapboxgl-touch-zoom-rotate.mapboxgl-touch-drag-pan .mapboxgl-canvas {
	outline:0;
}

#home-map {
	padding:0;
}

.mapboxgl-marker {
  cursor: pointer;	
}

.mapboxgl-ctrl-bottom-left,
.mapboxgl-ctrl-bottom-right {
	display:none;
}

.mapboxgl-marker .marker {
	background-color: var(--site-main-color);
  -webkit-mask-image: url(../images/marker.svg);
  mask-image: url(../images/marker.svg);
	-webkit-mask-size:contain;
	mask-size:contain;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
  width: 29px;
  height: 44px;
  cursor: pointer;
  position:relative;
	transition:all 200ms ease;
	will-change: transform;
}

.mapboxgl-marker.active .marker {
	transform:scale(1.6);
	position:relative;
  -webkit-mask-image: url(../images/close-b.svg);
  mask-image: url(../images/close-b.svg);
 	background-color: var(--site-main-color);
}

.mapboxgl-marker .marker > svg {
	position:relative;
	display:none;
	margin:10px auto;
	font-size:14px;
	top:6px;
	height:auto;
	color:#fff;
}

.mapboxgl-marker.active .marker > svg {
	display:block;
}

.mapboxgl-marker .marker:hover {
	background-color: #ba203f;
}

#mapbox_holder {
	position:relative;
	height:330px;
	padding-top:0;
	display:block;
	overflow:hidden;
}


#mapbox_viewport {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	display:block;
	background:#ddd;
}

#mapbox_details {
	position:absolute;
	z-index:1;
	top:0;
	left:0;
	width:100%;
	height:100%;
	display:block;
	opacity:0;
	padding:0;
	background:rgba(255,255,255,0.7);
	pointer-events:none;
	transition:opacity 500ms ease;
}

#mapbox_details > .container {
	height:100%;
}

#mapbox_title {
	margin-top:30px;
  padding-top:50px;
  padding-bottom:50px;
  background:var(--site-main-color);
  color:#fff;
  text-align:center;
}

#mapbox_title h1 {
	font-family:"Futura";
	font-weight:900;
  color:#fff;
	font-size:2rem;
	margin:0 0 1.5rem;
	text-transform: uppercase;
}

#mapbox_title p {
	font-family:"Futura Book";
	font-size:1.6rem;
	margin:0;
}

#mapbox_details_inner {
	height:80%;
	max-height:500px;
	max-width:100%;
	position:relative;
	z-index:3;
}

#mapbox_details_inner:before {
	content:"";
	top:100px;
	bottom:0;
	left:0;
	right:0;
	position:absolute;
	display:block;
	z-index:-1;
	background-color:var(--site-main-color);
}

#mapbox_details_content {
	position:absolute;
	bottom:25px;
	left:25px;
	color:#fff;
}

#mapbox_details h1 {
	margin:0;
	text-transform:uppercase;
	font-weight:600;
	line-height:1;
	margin-bottom:10px;
	margin-right:60px;
	font-size:1.15rem;
	display:block;
}

#mapbox_details h1 span {
	font-size:1.2rem;
	display:block;
	font-weight:300;
	margin-top:5px;
}

#mapbox_details div.adresse {
	max-height:60px;
	overflow:hidden;
	margin:5px 60px 0 0;
	font-size:0.8rem;
}

#mapbox_details div.telephone {
	margin:0 0 10px;
	font-size:0.8rem;
}

#mapbox_holder div.more > a {
	padding:5px 10px;
	font-size:.8rem;
}

#mapbox_controls {
	z-index:2;
	position:absolute;
	top:0;
	right:0;
	padding-right:0;
}

#mapbox_controls span {
	display:block;
	width:13px;
	height:13px;
	color:#bbbbbb;
	border-radius:50%;
	border:3px solid #bbbbbb;
	margin:0 auto;
	transition:all 200ms ease;
}

#mapbox_controls span + span {
	margin-top:10px;
}

#mapbox_controls span.active {
	border-color:#818181;
	background:#818181;
}

#mapbox_controls > div {
	outline:0;
	background:none;
	border-radius:50%;
	display:block;
	margin:10px;
	width:50px;
	height:50px;
	color:#bbbbbb;
	border:3px solid #bbbbbb;
	text-align:center;
	font-size:2rem;
	line-height:2rem;
	padding:5px;
	transition:all 200ms ease;
	background-color:rgba(255,255,255,0.8);
  background-image:url(../images/mapZoomPlus.png);
  background-size: 28px 28px;
  background-position:center center;
  background-repeat:no-repeat;
  opacity:0.5;
  cursor:pointer;
}

#mapbox_controls > div.mapZoomMinus {
  background-image:url(../images/mapZoomMinus.png);
}

#mapbox_controls > div.disabled {
	pointer-events: none;
	opacity:0.5;
}

#mapbox_controls > div:hover {
	opacity:1;
	color:#888;
	border:2px solid #888;
}

@media (min-width:768px) {
	#mapbox_holder {
		height:0;
		padding-top:40%;
	}

	.mapSquare #mapbox_holder {
			padding-top:100%;
	}

	#mapbox_details > .container {
		padding-left:15px;
		padding-right:15px;
	}

	#mapbox_details_inner {
		max-width:50%;
	}

	#mapbox_details_content {
    left: 100px;
	}

	#mapbox_controls {
		top:50%;
		transform:translateY(-50%);
		padding-right:30px;
	}

	#mapbox_controls > div {
		margin:20px 10px;
		width:60px;
		height:60px;
  	background-size: 32px 32px;
	}

	#mapbox_holder div.more > a {
		font-size:.9rem;
	}

}
/*# sourceMappingURL=map.css.map */