inset css3 - Mapas Google no resultado

dabblet.css

/**
 * inset css3 - Mapas Google no resultado
 */
body {
min-height: 100%;
}

.container {
display: block; 
height: 306px; 
position: relative; 
width: 424px; 
cursor: default;
}

.content {
background: #f4f3ef;
height: 100%;
}

/* Content-1: span (Google style) */
.faux-border {
bottom:0;
display:block;
left:0;
pointer-events:none;
position:absolute;
right:0;
top:0;
box-shadow:inset 0 1px 3px #aaa;
}

/* Content-2: pseudo-element */

#content-2:after {
content: '';
bottom:0;
display:block;
left:0;
pointer-events:none;
position:absolute;
right:0;
top:0;
box-shadow:inset 0 1px 3px #aaa;
}

/* Content-3: directly on element */
#content-3 {
bottom:0;
display:block;
left:0;
pointer-events:none;
position:absolute;
right:0;
top:0;
box-shadow:inset 0 1px 3px #aaa;
}

dabblet.html

<div class="container">
	<div class="content" id="content-1"></div>
	<span class="faux-border"></span>
</div>

<hr>

<div class="container">
	<div class="content" id="content-2"></div>
</div>
<hr>

<div class="container">
	<div class="content" id="content-3"></div>
</div>

settings.json

{"view":"split-vertical","prefixfree":"1","page":"html"}