@charset "UTF-8";
/* RESET */
/* Allgemein (!WICHTIG!)*/
*{padding:0;margin:0;}
html{font-size:1em;}
body{font-size:100%;-webkit-text-size-adjust:100%;}
a img,:link img,:visited img{border:0;}
img{display:block;}
/* Floating aufheben (!WICHTIG!) */
.clearfix:before, .clearfix:after{content:"";display:table;}
.clearfix:after{clear:both;}
.clearfix{*zoom:1;}

/* Individuel (Links und Überschriften-Fettungen h1 - h5) */
a{text-decoration:none;color:inherit;border-bottom:1px solid rgba(255,255,255,0);}
a:hover{border-bottom:1px solid #000000;}
a.aktiv:hover{border-bottom:1px solid rgba(255,255,255,0);}
a.aktiv{text-decoration:none;font-weight:400;}
h1,h2,h3,h4{font-weight:400;}

/* HILFSKLASSEN */
/* Keine Umrandung bei Click auf einen Link/Anker */
a:active,a:focus{outline:none;}
/* Telefon-Nummern Mobile */
a[href^=tel]{color:inherit;text-decoration:none;margin:0;padding:0;}
/* Rahmen um Link setzen */
.link-kasten{padding:10px 30px;border:1px solid #000;display:inline-block;margin-top:10px;}
/* Text-Formatierungen */
.grossbuchstaben{text-transform:uppercase;}
.kleinbuchstaben{text-transform:lowercase;}
.mittig{text-align:center;}
.sperren{letter-spacing:0.05em;}
.stauchen{letter-spacing:-0.01em;}
.stauchen03{letter-spacing:-0.03em;}
.block{text-align:justify;}
/* Cursor für die Felder zur Texterweiterung */
.weiterlesen,.einklappen{cursor:pointer;}
.weiterlesen,.einklappen{display:none;}

/* Elemente für mobile */
.tauchauf,.tauchauf-pad,.tauchauf-phone,.form-text{display:none!important;line-height:0px;}

/* Element aus der Flexbox befreien */
.flex-aus{-webkit-flex-basis:100%;flex-basis:100%;}

/* Fonts */
/* lato-300 - latin */
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 300;
  src: url('fonts/lato-v23-latin-300.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('fonts/lato-v23-latin-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/lato-v23-latin-300.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/lato-v23-latin-300.woff') format('woff'), /* Modern Browsers */
       url('fonts/lato-v23-latin-300.ttf') format('truetype'), /* Safari, Android, iOS */
       url('fonts/lato-v23-latin-300.svg#Lato') format('svg'); /* Legacy iOS */
}

/* lato-regular - latin */
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 400;
  src: url('fonts/lato-v23-latin-regular.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('fonts/lato-v23-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/lato-v23-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/lato-v23-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('fonts/lato-v23-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('fonts/lato-v23-latin-regular.svg#Lato') format('svg'); /* Legacy iOS */
}

/* lato-700 - latin */
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 700;
  src: url('fonts/lato-v23-latin-700.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('fonts/lato-v23-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/lato-v23-latin-700.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/lato-v23-latin-700.woff') format('woff'), /* Modern Browsers */
       url('fonts/lato-v23-latin-700.ttf') format('truetype'), /* Safari, Android, iOS */
       url('fonts/lato-v23-latin-700.svg#Lato') format('svg'); /* Legacy iOS */
}


/* FARBEN */
/* Farben - Text */
.farbe-weiss{color:#FFFFFF;}
.farbe-grau{color:#E7E7E7;}
.farbe-schwarz{color:#000000;}
/* Farben - Text-Auswahl */
::-moz-selection{background:#000000;color:#FFFFFF;text-shadow:none;}
::selection{background:#000000;color:#FFFFFF;text-shadow:none;}
/* Farben - Hintergründe */
.farbe-hg-weiss{background-color:#FFFFFF;}
.farbe-hg-weiss-transparent{background-color:rgba(255,255,255,0.95);}
.farbe-hg-verlauf{background-image:linear-gradient(to right, #ECE9E6 0%, #FFFFFF 51%, #ECE9E6 100%);transition:0.5s;transition-property:all;transition-duration:0.5s;transition-timing-function:ease;transition-delay:0s;background-size:200% auto;}
.farbe-hg-verlauf:hover{background-position:right center;}
.farbe-hg-grau{background-color:#E7E7E7;}
.farbe-hg-schwarz{background-color:#000000;}

/* Fixe Hintergründe */
.cd-scrolling-bg{min-height:100%;}
.cd-fixed-bg{min-height:100%;background-size:cover;background-attachment:fixed;background-repeat:no-repeat;background-position:center center;}
.cd-fixed-bg.cd-bg-1{background-image:url(img/hg-fix-logo-lichtblick.svgz);background-color:white;}

/* Body */
body{position:relative;font-family:'Lato',sans-serif;font-weight:300;font-size:15px;line-height:25px;color:#000000;padding-top:100px;}
.rahmen-navi{display:block;width:100%;max-width:1000px;margin:0 auto;}
.rahmen{display:block;width:100%;max-width:960px;margin:0 auto;}
.rahmen800{display:block;width:100%;max-width:800px;margin:0 auto;}
.rahmen800 img{width:100%;}
.rahmen600{display:block;width:100%;max-width:600px;margin:0 auto;}
.rahmen400{display:block;width:100%;max-width:400px;margin:0 auto;}
.rahmen400 img{width:100%;}
.minwidth180{min-width:180px;}
h1{font-size:24px;line-height:29px;}
h2{font-size:21px;line-height:26px;}
h3{font-size:18px;line-height:24px;}
h4{font-size:21px;line-height:26px;}
.bu{font-size:12px;line-height:17px;}

/* Header */
header{position:fixed;top:0;z-index:1000;width:100%;border-bottom:1px solid #000000;}
.logo{display:inline-block;margin:5px 35px 5px 20px;height:90px;width:200px;float:left;}

/* Karriere Listen */
.karriere ul{margin-left:15px;}

/***  Navis  ***/
/*  Hauptnavi */
header nav{display:inline-block;float:left;margin-top:58px;}
#hauptnavi {display:inline-block;}
#hauptnavi li{display:inline-block;position:relative;}
#hauptnavi li a{margin:5px 40px;}
/* Unterliste in der Hauptnavigation */
#hauptnavi ul{position:absolute;top:25px;z-index:999;opacity:0;-webkit-transition:opacity .25s ease .1s;-moz-transition:opacity .25s ease .1s;-o-transition:opacity .25s ease .1s;-ms-transition:opacity .25s ease .1s;transition:opacity .25s ease .1s;display:none;list-style:none;}
#hauptnavi ul.ausrichtung-punkt1{left:-51px;}
#hauptnavi li:hover > ul{display:block;opacity:1;}
#hauptnavi ul li{overflow:hidden;float:none;margin:0;padding:0;-webkit-transition:height .25s ease .1s;-moz-transition:height .25s ease .1s;-o-transition:height .25s ease .1s;-ms-transition:height .25s ease .1s;transition:height .25s ease .1s;display:block;}
#hauptnavi ul li a{display:block;padding:5px 20px;margin:0;}
#hauptnavi ul.ausrichtung-punkt1 li a{width:215px;}
#hauptnavi ul li a.aktiv,#hauptnavi ul li a:hover{background:#000000;color:#FFFFFF;}
#hauptnavi li:hover > ul li{overflow:visible;padding:0;}
/* Footernavi */
footer nav{display:inline-block;}
footer nav ul{display:inline-block;}
footer nav ul li{display:inline-block;}
footer nav ul li a{margin:5px 30px;}

/* Slider Startseite */
.slider{position:relative;width:100%;}
.slider .slide{display:block;background-size:cover;min-height:416px;}
/* Teasertext */
.slider .slide article{display:block;float:left;width:32%;min-height:425px;background:rgba(255, 255, 255, 0.7);}
.slider .slide h1{display:block;font-size:32px;line-height:40px;margin:50px 50px 10px 50px;}
.slider .slide a{display:inline-block;font-size:20px;line-height:22px;padding:10px 50px 10px 50px;}
.slider .slide a:hover{border-bottom:none;}
/* Slider-Bilder */
.slide01{background:url(img/slider/Wandsbeker-Chaussee-96-Wohnungsbau.jpg) left no-repeat;}
.slide02{background:url(img/slider/Hafencity-Universitaet-Hamburg-praxisnahe-Vorlesung.jpg) center no-repeat;}
.slide03{background:url(img/slider/Sachverstaendige-Messung-Wand-Feuchtigkeit.jpg) right no-repeat;}
/* Navigations-Elemente */
/* Bullets */
.slider .bullet-nav{position:absolute;height:105px;width:15px;left:10px;top:calc(50% - 53px);}
.slider .bullet-nav span{background:url(img/slider/thumbnail.svgz) center no-repeat;display:block;margin:10px 0;width:15px;height:15px;cursor:pointer;}
.slider .bullet-nav span.bulletAktiviert{background:url(img/slider/thumbnail-active.svgz) center no-repeat;}

/* Vollbild */
.vollbild img{width:100%;}

/* Halbbild */
.halbbild img{width:50%;}

/* Einspalter */
.spalt1{margin:40px auto;}
.spalt1 h1{margin:0 15px 15px 15px;}
.spalt1 h2{margin:0 15px 15px 15px;}
.spalt1 p{margin:0 15px 15px 15px;}
.spalt1 li{margin:0 15px 0 29px;}

/* Video */
video{margin:0 auto;display:block;width:calc(100% - 10px);max-width:680px;}
video controls{cursor:pointer;}
/*.spalt1 video{margin-bottom:20px;max-width:790px;}*/

/* 2-Spalter */
.teaser-projekt{margin:40px 0;display:-webkit-flex;display:flex;-webkit-flex-direction:row;flex-direction:row;}
.teaser-projekt figure{-webkit-flex:6;-ms-flex:6;flex:6;}
.teaser-projekt figure img{width:100%;}
.teaser-projekt section{-webkit-flex:4;-ms-flex:4;flex:4;display:-webkit-flex;display:flex;-webkit-flex-direction:column;flex-direction:column;justify-content:center;align-items:center;}
.teaser-projekt section h2{margin:15px 15px 0 15px;}
.teaser-projekt section p{margin:0 15px 15px 15px;}

.teaser-leistungen{display:-webkit-flex;display:flex;-webkit-flex-direction:row;flex-direction:row;-webkit-flex-wrap:wrap;flex-wrap:wrap;}
.teaser-leistungen section{-webkit-flex:1;-ms-flex:1;flex:1;}
.teaser-leistungen section figure{width:50%;margin:0 auto;}
.teaser-leistungen section figure img{width:calc(100% - 30px);margin:0 15px 15px 15px;}
.teaser-leistungen section h4{margin:20px 15px 15px 15px;}
.teaser-leistungen section p{margin:15px 15px 15px 15px;}

.teaser-karriere figure,.teaser-nordstory figure{width:50%;float:left;}
.teaser-karriere figure img{width:90%;margin:100px 5%;}
.teaser-nordstory figure img{width:90%;margin:10px 5% 30px 5%;}
.teaser-karriere section,.teaser-nordstory section{width:50%;float:left;}
.teaser-karriere section h2{margin:100px 15px 15px 15px;}
.teaser-nordstory section h2{margin:10px 15px 15px 15px;}
.teaser-karriere section p,.teaser-nordstory section p{margin:15px 15px 15px 15px;}

.teaser-stellenangebot{display:-webkit-flex;display:flex;-webkit-flex-direction:row;flex-direction:row;-webkit-flex-wrap:wrap;flex-wrap:wrap;}
.teaser-stellenangebot h1{margin:0 15px 20px 15px;}
.teaser-stellenangebot section{-webkit-flex:1;-ms-flex:1;flex:1;border:1px solid #000;margin:0 15px 20px 15px;}
.teaser-stellenangebot section figure{width:50%;margin:0 auto;}
.teaser-stellenangebot section figure img{width:calc(100% - 30px);margin:0 15px 15px 15px;}
.teaser-stellenangebot section h2{margin:20px 15px 15px 15px;}
.teaser-stellenangebot section p{margin:15px 15px 15px 15px;}

/* 3-Spalter */
.spalt3{padding:20px 0;}
.spalt3 section{width:30%;float:left;margin:20px 1.5%;}
.spalt3 section figure{width:70%;margin:0 auto;}
.spalt3 section figure img{width:100%;margin-bottom:20px;border-radius:190px;box-shadow:5px 5px 15px 0px #CCC;border-width:1px;border-style:solid;}
/* ohne Rahmen, Schatten und kleinere Icons*/
.spalt3 section figure.ohne-rahmen-schatten{width:40%;margin:0 auto;}
.spalt3 section figure.ohne-rahmen-schatten img{width:100%;margin-bottom:20px;border-radius:190px;box-shadow:none;border:none;}
.spalt3 section h2{margin:25px 0;}
.weitere-presse{margin-bottom:25px;}

/* Projekte */
.projektblock figure{width:calc(50% - 30px);margin:15px;float:left;}
.projektblock figure img.grossesBild{width:calc(100% - 2px);}
.projektblock figure img{width:calc(50% - 2px);float:left;border:1px solid #000;}
.projektblock div{width:calc(50% - 30px);margin:15px;float:left;}
.projektblock div h1{margin-bottom:20px;}
.projektblock div p{margin-bottom:20px;}
.projektblock div h2{margin-bottom:20px;font-size:20px;}
.projektblock table{border-collapse:collapse;}
.projektblock table td{border-bottom:1px solid #000;padding:5px 20px 5px 0;vertical-align:top;}
.projektblock table td.ohneRand{border-bottom:none;}

/* Team */
.portraits{display:-webkit-flex;display:flex;-webkit-flex-direction:row;flex-direction:row;-webkit-flex-wrap:wrap;flex-wrap:wrap;justify-content:space-around;margin:20px auto;}
.team-gf{display:-webkit-flex;display:flex;-webkit-flex-direction:row;flex-direction:row;}
.team-gf div{-webkit-flex:1;-ms-flex:1;flex:1;}
.team-gf figure{width:60%;margin:0 auto;}
.portraits p{margin:15px;line-height:19px;flex-grow:1;flex-shrink:0;flex-basis:calc(25% - 30px);}
.portraits h3{margin-top:20px;}

/* Störer (Hinweis) */
.stoerer-rahmen{position:fixed;top:0;left:0;justify-content:center;align-items:center;width:100%;height:100%;z-index:1001;}
.stoerer{font-size:16px;padding:25px 25px 25px 25px;width:calc(100% - 50px);max-width:600px;position:relative;opacity:0;background:rgba(255,255,255,0.9);margin:0 auto;top:110px;display:none;}
.stoerer .kreuz{position:absolute;top:10px;right:10px;width:10px;height:10px;background:url(img/x-fenster-schliessen.svgz) center no-repeat;cursor:pointer;}
.stoerer figure{}
.stoerer figure img{display:inline-block;width:210px;}
.stoerer p{margin-bottom:25px;}
.stoerer-aktiv{}
.stoerer-sichtbar{opacity:1;display:block;}

/* Footer */
footer{padding:50px 0;}

.impressum h3,.datenschutz h3{margin-left:15px;}

/* !!!!!!!!!!!!! */
/* Media Queries */
@media(max-width:960px){
.tauchauf{display:inherit!important;}
.verschwinde{display:none;}
#hauptnavi {border:solid 2px;color:#FFFFFF;}
/* Automatische Texttrennung für mobile Geräte */
h1,h2,h3,h4,h5,p,ul,li,a{hyphens:auto;-moz-hyphens:auto;-ms-hyphens:auto;-webkit-hyphens:auto;}
/* Sandwich-Navigation */
#stulle{width:60px;height:60px;position:fixed;background:url(img/icon-sandwich.svgz) center no-repeat;bottom:18px;right:calc(50% - 30px);z-index:901;cursor:pointer;}
#stulle.scrolled{-webkit-transform:translate3d(0,78px,0);-moz-transform:translate3d(0,78px,0);transform:translate3d(0,78px,0);}
header nav{display:block;float:none;margin-top:0;position:fixed;width:200px;bottom:80px;right:calc(50% - 100px);background-color:#000000;color:#FFFFFF;text-align:center;}
body{cursor:pointer;}
/* Navis */
header nav ul{display:block;padding-top:12px;}
header nav ul li{display:block;padding:8px 0 5px 0;}
header nav ul li a{margin:5px 8px;}
/* Teasertext */
.slider .slide article{width:44%;}
/* 2-Spalter */
.teaser-karriere section h2{margin-top:50px;}
}

@media(max-width:920px){
/* Formular */
.formular .adresse{width:100%;float:none;text-align:center;padding-top:20px;}
.formular .adresse img{width:25%;margin:0 auto;}
}

@media(max-width:768px){
.tauchauf-pad{display:inherit!important;}
.verschwinde-pad{display:none;}
/* Teasertext */
.slider .slide article{width:76%;}
.slider .slide h1{margin-top:100px;}
/* 3-Spalter */
.spalt3 section{width:70%;float:none;margin:20px 15%;}
.spalt3 section figure{width:50%;margin:0 auto;}
/* 2-Spalter */
.teaser-projekt,.teaser-leistungen{-webkit-flex-direction:column;flex-direction:column;}
.reihenfolge{-webkit-flex-direction:column-reverse;flex-direction:column-reverse;}
.teaser-karriere figure,.teaser-nordstory figure{width:100%;float:none;}
.teaser-karriere figure img{width:60%;margin:50px 20%;}
.teaser-karriere section,.teaser-nordstory section{width:100%;float:none;}
.teaser-leistungen figure{width:100%;float:none;}
.teaser-leistungen figure img{width:calc(100% - 80px);margin:50px 40px;}
.teaser-leistungen section{width:100%;float:none;}
.teaser-leistungen section h4{margin:20px 15px 15px 15px;}
.teaser-leistungen section p{margin:15px 15px 15px 15px;}
/* Projekte */
.projektblock figure{width:calc(100% - 30px);float:none;}
.projektblock div{width:calc(100% - 30px);float:none;}
}

@media(max-width:600px){
.tauchauf-phone{display:inherit!important;}
.verschwinde-phone{display:none!important;}
/* Body */
body{font-size:17px;line-height:28px;}
/* Slider Startseite */
.slider .slide h1{margin-top:50px;font-size:25px;line-height:27px;}
/* 3-Spalter */
.spalt3 section figure{width:90%;}
/* Footer */
footer nav ul li{display:block;}
footer nav ul li a{margin:5px 30px;display:block;}
}

@media(max-width:480px){
/* Slider Startseite */
.slider .slide article{width:100%;}
/* 2-Spalter */
.teaser-karriere figure img{width:80%;margin:50px 10%;}
.teaser-stellenangebot{-webkit-flex-direction:column;flex-direction:column;}
/* Team */
.team-gf{-webkit-flex-direction:column;flex-direction:column;}
.team-gf figure{width:60%;margin:0 auto;}
.portraits p{margin:15px;line-height:19px;flex-grow:1;flex-shrink:0;flex-basis:calc(50% - 30px);}
}