@font-face {
font-family:'Anaheim';
font-style:normal;
font-weight:400;
src: url('../fonts/anaheim-v7-latin-regular.eot'); 
src: local('Anaheim'), local('Anaheim-Regular'),
url('../fonts/anaheim-v7-latin-regular.eot?#iefix') format('embedded-opentype'), 
url('../fonts/anaheim-v7-latin-regular.woff2') format('woff2'), 
url('../fonts/anaheim-v7-latin-regular.woff') format('woff'), 
url('../fonts/anaheim-v7-latin-regular.ttf') format('truetype'), 
url('../fonts/anaheim-v7-latin-regular.svg#Anaheim') format('svg'); 
}

@font-face {
font-family: 'Assistant';
font-style: normal;
font-weight: 800;
src: url('../fonts/assistant-v18-latin-800.eot'); 
src: local(''),
url('../fonts/assistant-v18-latin-800.eot?#iefix') format('embedded-opentype'), 
url('../fonts/assistant-v18-latin-800.woff2') format('woff2'),
url('../fonts/assistant-v18-latin-800.woff') format('woff'), 
url('../fonts/assistant-v18-latin-800.ttf') format('truetype'), 
url('../fonts/assistant-v18-latin-800.svg#Assistant') format('svg'); 
}

*, *:after, *:before { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; padding:0; margin:0; }

html{
-moz-text-size-adjust: none;
-webkit-text-size-adjust: none;
text-size-adjust: none;
}

html, body, #wrap {height: 100%;}
body > #wrap {height: auto; min-height: 100%;} 

.bg, .portrait, .info { 
margin: 0;
position: absolute;
top: 50%;
left: 50%;
-ms-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}

body { font-family:'Anaheim'; font-size:17px; color:#555; }

a, a > * {-webkit-transition: all 0.5s ease 0s; -moz-transition: all 0.5s ease 0s; -o-transition: all 0.5s ease 0s; transition: all 0.5s ease 0s; text-decoration:none; color:#006cd9}
p { padding:8px } /* in der box */

b {color:#000}

.header {width:100%; text-align:center; position:relative; margin:0px auto;}
.logo {font-family: "Assistant"; font-size:16px; color:#111; float:right; padding: 80px; font-weight:800; letter-spacing:6px; text-align:right}
.hgsp-logo { padding:0; text-align:left; position:fixed; z-index:10; top:0; left:0}

h1, h2, h3, h4 {
font-family: "Assistant"; font-size:16px; font-weight:800; color:#000; letter-spacing:3px; padding:8px; text-transform: uppercase;	
}

h2, h3, h4 {
color:#444;		
}

.container { padding:0px; width:1080px; position:relative; margin:75px auto 50px auto;}
.col1-3 { width:300px; height:300px; margin:30px; float:left; } 
.col2-3 { width:300px; height:600px; margin:30px; float:left; } 
 

input[type=text] { 
width:100%;
height:30px; 
color:#002db3;
font-size:16px;
border:1px solid #ddd;
margin-bottom:10px;
padding:10px;
}

textarea { 
width:100%;
min-height:100px; 
color:#002db3;
font-size:16px;
border:1px solid #ddd;
margin-bottom:10px;
padding:10px;
}

.button {
color: #fff;
background: #323;
padding: 0 40px;
width:100%;
border:none;
line-height: 40px;
position: relative;
text-align: center;
letter-spacing: 1px;
display: inline-block;
text-decoration: none;
font-family: 'Anaheim', sans-serif;
text-transform: uppercase;
cursor:pointer;
font-size: 16px;
}



/*
([minimum size] + ([maximum size] - [minimum size]) * ((100vw - [minimum viewport width]) / ([maximum viewport width] - [minimum viewport width])));
*/

.footer {
float: left;
background: #fff;
font-size: 15px;
padding:50px;
color:#555;
width:100%;
text-align:center;
}


.umbruch {   
-moz-hyphens: auto;
-o-hyphens: auto;
-webkit-hyphens: auto;
-ms-hyphens: auto;
hyphens: auto;
}

.blue {
color:#000;	
}

.btn-flip {
opacity: 1;
outline: 0;
color: #fff;
line-height: 40px;
position: relative;
text-align: center;
letter-spacing: 1px;
display: inline-block;
text-decoration: none;
font-family: 'Anaheim', sans-serif;
text-transform: uppercase;
}
.btn-flip:hover:after {
opacity: 1;
-ms-transform: translateY(0) rotateX(0);
-o-transform: translateY(0) rotateX(0);
-webkit-transform: translateY(0) rotateX(0);
transform: translateY(0) rotateX(0);
}
.btn-flip:hover:before {
opacity: 0;
transform: translateY(50%) rotateX(90deg);
}
.btn-flip:after {
top: 0;
left: 0;
opacity: 0;
width: 100%;
color: #fff;
display: block;
transition: 0.8s;
position: absolute;
background: #908db8;
content: attr(data-back);
-ms-transform: translateY(-50%) rotateX(90deg);
-o-transform: translateY(-50%) rotateX(90deg);
-webkit-transform: translateY(-50%) rotateX(90deg);
transform: translateY(-50%) rotateX(90deg);
}
.btn-flip:before {
top: 0;
left: 0;
opacity: 1;
color: #fff;
display: block;
padding: 0 30px;
line-height: 40px;
transition: 0.5s;
position: relative;
background: #222;
content: attr(data-front);
-ms-transform: translateY(0) rotateX(0);
-o-transform: translateY(0) rotateX(0);
-webkit-transform: translateY(0) rotateX(0);
transform: translateY(0) rotateX(0);
}

.centered {
text-align:center;
}


.transitions-enabled.masonry,
.transitions-enabled.masonry .masonry-brick {
-webkit-transition-duration: 0.7s;
-moz-transition-duration: 0.7s;
-ms-transition-duration: 0.7s;
-o-transition-duration: 0.7s;
transition-duration: 0.7s;
}

.transitions-enabled.masonry {
-webkit-transition-property: height, width;
-moz-transition-property: height, width;
-ms-transition-property: height, width;
-o-transition-property: height, width;
transition-property: height, width;
}

.transitions-enabled.masonry  .masonry-brick {
-webkit-transition-property: left, right, top;
-moz-transition-property: left, right, top;
-ms-transition-property: left, right, top;
-o-transition-property: left, right, top;
transition-property: left, right, top;
}


/* disable transitions on container */
.transitions-enabled.infinite-scroll.masonry {
-webkit-transition-property: none;
-moz-transition-property: none;
-ms-transition-property: none;
-o-transition-property: none;
transition-property: none;
}

* html .clearfix { height:1%; }
.clearfix { display:block; }
.clearfix:after { content: "."; display:block; height:0; clear:both; visibility:hidden; }

footer { background:#fff; position:relative; color:#555; padding:55px; }


@media only screen and (max-width: 1160px) {
.leer, .logo, .bg {display:none;}
.container { padding:0px; width:360px; position:relative; margin:50px auto;}
.col1-3 { width:300px; padding-bottom:30px; height:auto;}
}

@media only screen and (max-width: 546px) {
.hgsp-logo {display:none;}
}