/* HTML5 */
article, aside, details, figcaption, figure, footer, header, hgroup, nav, section { display: block; }
audio, canvas, video { display: inline-block; }
audio:not([controls]) { display: none; }
[hidden] { display: none; }

/* base */
html { font-size: 100%; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%;}
form { margin: 0; }
input, select, textarea { font-size: 100%; margin: 0; vertical-align: baseline; }
input { line-height: normal; }
input::-moz-focus-inner { border: 0; padding: 0; }
input[type="search"] { -webkit-appearance: textfield; box-sizing: content-box; }
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; }
input[type="submit"] { -webkit-appearance: none; }
a {color:#000; text-decoration:none; -webkit-transition:all 0.3s ease-out; -moz-transition:all 0.3s ease-out; -o-transition:all 0.3s ease-out; transition:all 0.3s ease-out; display:inline-block;}
a.no_transit {-webkit-transition:none; -moz-transition:none; -o-transition:none; transition:none;}
*:focus  { outline: 0; }
img { border: 0; -ms-interpolation-mode: bicubic; vertical-align:middle; }
svg:not(:root) { overflow: hidden; }
table { border-collapse: collapse; border-spacing: 0; }
html { overflow-y: scroll; }
ul, ol { margin: 0; padding: 0 ; }
nav ul, ul { list-style: none; list-style-image: none; }
.clearfix:before, .clearfix:after { content: " "; display: table; }
.clearfix:after, .clear { clear: both; }
/* nur safari */
* {-webkit-tap-highlight-color: rgba(0,0,0,0);}

/* header font */
@font-face { font-family:'header'; src: url('fonts/header-webfont.woff2') format('woff2'), url('fonts/header-webfont.woff') format('woff'); font-weight:normal; font-style:normal; }

/* allgemein */
* { margin:0; padding:0; border:0; }
html,body { height:100%; }
body { background:#f9f7f5; font-family: 'Open Sans', Arial, Helvetica, sans-serif; font-weight:400; font-size:13px; line-height:18px; color:#222; }
.invisible {display:none}
h1, h2, h3, h4, h5 {font-family:'header';font-weight:normal;}
.red {color:#dc4f31;}

/* sticky footer */
.wrap_it { display:table; height:100%; width:100%;}
.row { display:table-row; height:1px; }
.push { height:auto; }

.center {position:relative; max-width:1200px; margin:auto; }
.center_inner {position:relative; padding:0 20px;}
.interim .center_inner {text-align:center;}
.interim h1 {font-size:40px; line-height:42px; color:#dc4f31; margin:5% 0 30px;}

.logo {padding:10% 0 0;}
.logo img {width:500px; height:auto;}


/* fade in beim scrollen */
.onscroll { opacity: 1; -webkit-transition: opacity .7s ease-in, margin-top .7s ease-out; transition: opacity .7s ease-in, margin-top .7s ease-out; }
.onscroll-hidden { opacity: 0; margin-top:20px; }
/* sonst animationen */
.animated { -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; animation-fill-mode: both; }
.fadeInLeft { -webkit-animation-name: fadeInLeft; animation-name: fadeInLeft; }
@keyframes fadeInLeft { 0% { opacity: 0; transform: translateX(-20px); } 100% { opacity: 1; transform: translateX(0); } } 
@-webkit-keyframes fadeInLeft { 0% { opacity: 0; -webkit-transform: translateX(-20px); } 100% { opacity: 1; -webkit-transform: translateX(0); } } 
.fadeInUp { -webkit-animation-name: fadeInUp; animation-name: fadeInUp; }
@keyframes fadeInUp { 0% { opacity: 0; transform: translateY(10px); } 100% { opacity: 1; transform: translateY(0); } } 
@-webkit-keyframes fadeInUp { 0% { opacity: 0;-webkit-transform: translateY(10px); } 100% { opacity: 1; -webkit-transform: translateY(0); } }

/* footer */
footer .footer_top {border-top:1px solid #ccc;padding:10px 0;color:#999;}
footer a {color:#666;position:relative; }
footer a:hover {color:#222;}
.imprint {padding:0 0 20px; color:#666; display:none;}
.imprint h4 {margin-top:10px;}


/* responsive schnickschnack */
@media (max-width: 1200px) { 
	.center {width:100%; }
}

@media (max-width: 768px) {
.interim h1 {margin:50px 0 30px;}
}
@media (max-width: 600px) {
	.logo img {width:100%; height:auto;}
}
@media (max-width: 500px) {

}
@media (max-height: 800px) {
	.logo {padding:5% 0 0;}
}