html, body {
	height: 100%;
	margin: 0;
	padding: 0;
}
h1, .h1 {
    font-size: 22px;
}
h2, .h2 {
    font-size: 16px;
}
ul li{list-style:none;}

.google-map{ height:calc(0px + 100vh); }


.col-xs-12.col-sm-12.col-md-6.col-lg-6.leftservice {
    height: calc(0px + 100vh);
    overflow-y: scroll;
}


h3.firstHeading{ margin-top: 0; font-size: 18px !important; font-family: meno-banner, serif !important;
font-weight: 300; font-style: normal; text-align:center;}

#bodyContent p {
  font-family: proxima-nova, sans-serif !important;
  font-weight: 300 !important; text-align:center !important;
}



.active{
	/*background: #333333;*/
}
.map {
	height:100%;
}
.map-legend {
	text-align:center;
}
.location {
	padding:24px;
	border-left:16px solid #fff;
	border-right:16px solid #fff;
	background-size:cover;
	background-position:center center;
	position:relative;
	color:white;
}
.location-1 {
	border-bottom:8px solid white;
	background-color:#554738;
	background-image:url( '../coffee_bg.html');
}
.location-2 {
	border-top:8px solid white;
	background-color:#383838;
	background-image:url( '../office_bg.html');
}

.location::after {
	content:"";
	background-color:inherit;
	opacity:.65;
	position:absolute;
	left:0;
	right:0;
	top:0;
	bottom:0;
}
.location--inner {
	position:relative;
	z-index:1;
}
.location img {
	display:inline-block;
	margin:24px 0 12px;
	/* setting width and height instead results in a strange behavior in Safari */
	-webkit-transform:scale(2);
	transform:scale(2);	
}

@media screen and (min-width: 1024px) {
	
	.map, .map-legend {
		height:100%;
	}
	.desk-three-forth {
		float: left;
		width:75%;
	}
	.desk-one-forth {
		width:25%;
	}
	.map-legend, .location {
		display:flex;
		flex-direction:column;
	}
	.location {
		border-left:none;
		min-height:50%;
		justify-content:center;
		align-items:center	
	}
	.location-1 {
		border-top:16px solid white;
	}
	.location-2 {
		border-bottom:16px solid white;
	}
}

/* if using sprites */
.marker-icon {
	background-image:url("../arrows.html");
	display:inline-block;
	width:48px;
	height:48px;
	margin:24px 0 12px;
	/* setting background-size instead results in a strange behavior in Safari */
	-webkit-transform:scale(2);
	transform:scale(2);
}
.marker-office {
	background-position:48px 0;
}

.gm-style img {
   width: 100%;
   height:150px;
}

.sticky {
  position: -webkit-sticky; /* Safari */
  position: sticky;
  top: 0;
}


.container .inner p a{ color:#333;}