@font-face
{
	font-family:coppl;
	src:url(coppl.woff);
}

* {
	font-family: "Montserrat", sans-serif;
	font-optical-sizing: auto;
	font-weight: 400;
	font-style: normal;
}


body
{
	-webkit-text-size-adjust:none;
	border:20px;
	color:#000;
	font-size:16px;
	letter-spacing:.25em;
	margin:0 auto;
	padding-left:20px;
	padding-right:20px;
	padding-top:100px;
	text-align:center;
	width:640px;
}

h3
{
	font-size:26px;
	font-weight:400;
	letter-spacing:.45em;
}

h4
{
	padding: 15px 0;
	font-size:20px;
	font-weight:600;
	letter-spacing:.25em;
}

h5
{
	font-size:16px;
	font-weight:400;
	letter-spacing:.25em;
}

section
{
	display:block;
}

figure
{
	margin:0;
}

.top
{
	padding-top: 5px;
	line-height:0.2;
}

.middle
{
	letter-spacing:.1em;
	line-height:0.5;
}

.bottom
{
	letter-spacing:.1em;
	line-height:0.4;
	margin-top: 35px
}

.bottom .tel
{
	font-size:18px;
	letter-spacing:.25em;
	letter-spacing:.1em;
	line-height:0.4;
	margin-bottom: 45px;
}

.uppercase {
	text-transform: uppercase;
}

.text-bottom {
	font-size:16px;
	font-weight:400;
	letter-spacing:.25em;
}

#address
{
	letter-spacing:.13em;
}

#mail
{
	text-decoration: none;
	color: black;
}

#cardflip, #cardflip:active, #cardflip:focus{
	cursor:pointer;
	user-select:none;	
	-webkit-tap-highlight-color: transparent;
}

.footer
{
	font-family:Arial, sans-serif;
	font-size:12px;
}

#map-canvas
{
	height:290px;
	margin:5px;
	width:590px;
}

.container
{
	-moz-perspective:800px;
	-o-perspective:800px;
	-webkit-perspective:800px;
	height:300px;
	margin:0 auto 40px;
	perspective:800px;
	position:relative;
	width:600px;
}

#card
{
	-moz-transform-origin:right center;
	-moz-transform-style:preserve-3d;
	-moz-transition:0 .7s;
	-o-transform-origin:right center;
	-o-transform-style:preserve-3d;
	-o-transition:0 .7s;
	-webkit-transform-origin:right center;
	-webkit-transform-style:preserve-3d;
	-webkit-transition:0 .7s;
	height:100%;
	position:absolute;
	transform-origin:right center;
	transform-style:preserve-3d;
	transition:transform .7s;
	width:100%;
}

#card.flipped
{
	-moz-transform:translateX(-100%) rotateY(-180deg);
	-o-transform:translateX(-100%) rotateY(-180deg);
	-webkit-transform:translateX(-100%) rotateY(-180deg);
	transform:translateX(-100%) rotateY(-180deg);
}

#card figure
{
	-moz-backface-visibility:hidden;
	-moz-box-shadow:0 1px 0px rgba(0,0,0,0.3), 0 0 2px rgba(0,0,0,0.1) inset;
	-o-backface-visibility:hidden;
	-webkit-backface-visibility:hidden;
	-webkit-box-shadow:0 1px 0px rgba(0,0,0,0.3), 0 0 2px rgba(0,0,0,0.1) inset;
	backface-visibility:hidden;
	border-radius: 3px;
	box-shadow: 2px 2px 3px rgba(0,0,0,0.3), 0 0 0px 0px rgba(0,0,0,0.1) inset;
	display:block;
	height:100%;
	position:absolute;
	width:100%;
}

#card .front
{
	background:#f7f9ff;
}

#card .back
{
	-moz-transform:rotateY(180deg);
	-o-transform:rotateY(180deg);
	background:#EFFBF5;
	fafafa-webkit-transform:rotateY(180deg);
	transform:rotateY(180deg);
}