/* ====-==-=--=----=-------- ---- -- -  -    -
** Sets viewport to width of device.
** ========-====-==-=--=----=-------- ---- -- -  -    -
*/
@-ms-viewport { width: device-width; }
@-o-viewport { width: device-width; }
@viewport { width: device-width; }


/* ====-==-=--=----=-------- ---- -- -  -    -
** custom fonts
** ========-====-==-=--=----=-------- ---- -- -  -    -
*/
@font-face
{
	font-family: 'Quando';
	src: url(font/Quando-Regular.ttf) format('truetype');
	font-weight: normal;
	font-style: normal;
}



/* ====-==-=--=----=-------- ---- -- -  -    -
** basics
** ========-====-==-=--=----=-------- ---- -- -  -    -
*/
body, body *
{
	position: relative;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}

body
{
	margin: 0;
	padding: 0 2.5%;
	background: #dae8e9 url(img/struktur499x499.jpg) 50% top repeat;
	color: #788588;
	font: 1em/1.0 Georgia, 'New Century Schoolbook', 'Nimbus Roman No9 L', serif;
	-webkit-text-size-adjust: 100%;
	-ms-text-size-adjust: 100%;
}

img
{
	max-width: 100%;
	border: 0;
	-ms-interpolation-mode: bicubic;
}

h1, h2 { text-rendering: optimizeLegibility; }

h1
{
	margin: 0;
	padding: 0;
	text-align: center;
	font-size: 2em;
	line-height: 1;
}

h1 span
{
    display: block;
	font: 0/0 a;
    text-shadow: none;
    color: transparent;
}

h2
{
	margin: 0;
	padding: 0;
	font-family: 'Quando', Georgia, serif;
	font-size: 1.5em;
	font-weight: normal;
	line-height: 1.25;
	text-align: center;
}

.header
{
	padding: 1.5em 0 1em 0;
}

.main
{
	max-width: 64em;
	margin: 0 auto;
	border: 2px dotted #fff;
	border-radius: 1.125em;
}

.main-inner
{
	padding: 0.5em;
	background: #fff;
	border-radius: 1em;
}

.offer
{
	overflow: hidden;
}

.call-to-action
{
	padding: 0.75em 0.75em 1.5em 0.75em;
	overflow: hidden;
}

.call-to-action p
{
	text-align: center;
}

.actions
{
	text-align: center;
}

.action
{
	display: inline-block;
	padding: 0.5em;
}

.action label
{
	display: block;
	padding: 0 0 0.5em 0.5em;
	color: #85aa1f;
	font-size: 0.75em;
	text-align: left;
}

.action-email label
{
	color: #2a8795;
}

.action a,
.action span
{
	display: block;
	padding: 1em;
	border: 1px solid #7cac21;
	border-radius: 0.25em;
	background-color: #85aa1f;
	background-image: linear-gradient(bottom, rgb(116,148,27) 30%, rgb(151,193,35) 100%);
	background-image: -o-linear-gradient(bottom, rgb(116,148,27) 30%, rgb(151,193,35) 100%);
	background-image: -moz-linear-gradient(bottom, rgb(116,148,27) 30%, rgb(151,193,35) 100%);
	background-image: -webkit-linear-gradient(bottom, rgb(116,148,27) 30%, rgb(151,193,35) 100%);
	background-image: -ms-linear-gradient(bottom, rgb(116,148,27) 30%, rgb(151,193,35) 100%);
	background-image: -webkit-gradient(
		linear,
		left bottom,
		left top,
		color-stop(0.3, rgb(116,148,27)),
		color-stop(1, rgb(151,193,35))
	);
	color: #fff;
	text-decoration: none;
	font-family: Arial, sans-serif;
	z-index: 1;
}

.action-email a,
.action-email span
{
	background-color: #2a8795;
	border: 1px solid #487d87;
	background-image: linear-gradient(bottom, rgb(38,122,135) 30%, rgb(48,154,170) 100%);
	background-image: -o-linear-gradient(bottom, rgb(38,122,135) 30%, rgb(48,154,170) 100%);
	background-image: -moz-linear-gradient(bottom, rgb(38,122,135) 30%, rgb(48,154,170) 100%);
	background-image: -webkit-linear-gradient(bottom, rgb(38,122,135) 30%, rgb(48,154,170) 100%);
	background-image: -ms-linear-gradient(bottom, rgb(38,122,135) 30%, rgb(48,154,170) 100%);
	background-image: -webkit-gradient(
		linear,
		left bottom,
		left top,
		color-stop(0.3, rgb(38,122,135)),
		color-stop(1, rgb(48,154,170))
	);
}

.picture
{
	padding: 0.75em;
	text-align: center;
}

.we-are
{
	text-align: center;
	line-height: 1.25em;
}

.we-are b
{
	color: #acb800;
	font-size: 2em;
	line-height: 0.25;
	vertical-align: bottom;
}

.footer
{
	max-width: 64em;
	padding-right: 5%;
}

.footer-inner
{
	height: 128px;
	background: url(img/lurar199x128.png) right top no-repeat;
}



/* ====-==-=--=----=-------- ---- -- -  -    -
** 48em+ ~= 768px+
** ========-====-==-=--=----=-------- ---- -- -  -    -
*/
@media only screen and (min-width: 48em)
{
	h2
	{
		text-align: left;
	}
	.header
	{
		padding: 2em 0 1.5em 0;
	}
	.call-to-action
	{
		width: 50%;
		float: right;
		padding: 1em 1em 1em 0.5em;
	}
	.call-to-action p
	{
		text-align: left;
	}
	.actions
	{
		text-align: left;
	}
	.picture
	{
		width: 50%;
		float: left;
		padding: 1em 0.5em 1em 1em;
	}
}



/* ====-==-=--=----=-------- ---- -- -  -    -
** Internet Explorer 8 (and older)
** ========-====-==-=--=----=-------- ---- -- -  -    -
*/
.ie8 h2
{
	text-align: left;
}
.ie8 .header
{
	padding: 2em 0 1.5em 0;
}
.ie8 .call-to-action
{
	width: 46%;
	float: right;
	padding: 1em 2% 1em 1%;
}
.ie8 .call-to-action p
{
	text-align: left;
}
.ie8 .actions
{
	text-align: left;
}
.ie8 .picture
{
	width: 46%;
	float: left;
	padding: 1em 1% 1em 2%;
}
