

.LocalAreas h2 { font-weight:600; font-size:2em; }
.AreaBox { width:46%; max-width:460px; margin:40px 0px 0px 0px; }
.AreaBox.AreaBox--left { float:left; clear:left; }
.AreaBox.AreaBox--right { float:right; clear:right; }
.AreaBox .AreaBox--image { position:relative; display:block; }
.AreaBox .AreaBox--image img { width:100%; max-width:460px; max-height:345px; }
.AreaBox .AreaBox--image .AreaBox--overlay { text-align:center; opacity:0; position:absolute; top:0; bottom:0; left:0; right:0; background:rgba(8,51,37,0.7);
	-webkit-transition:all .3s linear;
	-moz-transition:all .3s linear;
	-ms-transition:all .3s linear;
	-o-transition:all .3s linear;
	transition:all .3s linear;
}
.AreaBox .AreaBox--image:hover .AreaBox--overlay { opacity:1; }
.AreaBox .AreaBox--image .AreaBox--overlay .text { display:block; position:absolute; top:50%; left:50%; margin:-70px 0px 0px -70px; background:#1CA87B; color:#FFFFFF; font-family:'Roboto Slab', sans-serif; font-size:1.4em; text-transform:uppercase; width:100px; height:100px; padding:20px;
	-webkit-border-radius:50% 50% 50% 50%;
	-moz-border-radius:50% 50% 50% 50%;
	-ms-border-radius:50% 50% 50% 50%;
	-o-border-radius:50% 50% 50% 50%;
	border-radius:50% 50% 50% 50%;
}
.AreaBox .AreaBox--image .AreaBox--overlay .text span { display:block; line-height:20px; margin:25px 0px 0px 0px; }
.AreaBox .AreaBox--details { padding:20px 0px; text-align:left; }
.AreaBox .AreaBox--details h3 { font-family:'Roboto Slab', sans-serif; font-size:1.6em; text-transform:uppercase; color:#1CA87B; }
@media screen and (max-width:840px){
	.AreaBox .AreaBox--image .AreaBox--overlay { display:block; opacity:1; background:transparent; left:unset; top:unset; width:auto; height:auto; }
	.AreaBox .AreaBox--image .AreaBox--overlay .text { position:static; padding:10px; margin:0px; width:auto; height:auto;
		-webkit-border-radius:0% 0% 0% 0%;
		-moz-border-radius:0% 0% 0% 0%;
		-ms-border-radius:0% 0% 0% 0%;
		-o-border-radius:0% 0% 0% 0%;
		border-radius:0% 0% 0% 0%;
	}
	.AreaBox .AreaBox--image .AreaBox--overlay .text span { margin:0px; }
}
@media screen and (max-width:680px){
	.LocalAreas { text-align:center; }
	.AreaBox { width:100%; margin:40px auto 0px auto; }
	.AreaBox.AreaBox--left,
	.AreaBox.AreaBox--right { float:none; clear:both; }
}