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

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


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

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

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


html, body {height:100%; width:100%; margin:0; padding:0;}
body {font-family:'Roboto', Arial, sans-serif; font-size:16px; font-weight:300; min-width:320px; color:#333; overflow:auto;}
#all {width:100%; overflow:hidden;}

section, header, footer, article {position:relative; display:block; width:auto; max-width:100%;}
div,* {box-sizing:border-box;}
strong {font-weight:500;}
img {height:auto; width:auto; max-width:100%;}
h1 {font-family:'Roboto Slab',Arial,sans-serif; font-size:2em; font-weight:normal; line-height:1.2em;}
h2, .h2 {font-family:'Roboto Condensed',Arial,sans-serif; font-size:2em; font-weight:normal; line-height:1.1em; padding:0.2em 0; margin:0.75em 0;}
h3, .h3 {font-family:'Roboto',Arial,sans-serif; font-size:1.4em; font-weight:500; line-height:1.1em; padding:0.2em 0; margin:0.8em 0 0.4em;}
.preHeadline {display:block; font-size:0.8em; font-weight:300; letter-spacing:1px; margin:0 0 0.3em;}
p {margin:0.7em 0; line-height:1.5em;}
ul {margin:0.7em 0; padding:0 0 0 1em;}
li {line-height:1.5em; margin:0 0 0.3em;}
a {color:#000;}
a.button, .button {display:inline-block; padding:0.35em 1.5em; font-weight:normal; text-align:center; text-decoration:none; color:#333; background-color:#f4f4f4; box-shadow: 0px 1px 3px rgba(0,0,0,0.2);}
#div.button {padding:0.35em 1.5em; font-weight:normal; text-decoration:none; color:#333; background-color:#fff;}
h2 a, h3 a, a.noDeco {text-decoration:none;}

.bgLightgray {background-color:#f4f4f4;}
.bgBlue {background-color:#FFC800;}
.bgYellow {background-color:#FFC800;}
.bgGreen {background-color:#99cc00;}
.bgLightgrayInner .container {background-color:#f4f4f4;}
.bgBlueInner .container {color:#fff; background-color:#FFC800;}
.bgGreenInner .container {background-color:#99cc00;}
.bgArrowWhite:before {content:""; display:block; position:absolute; top:0; left:50%; height:0; width:0; border-left: 15px solid transparent;  border-right: 15px solid transparent; border-top: 30px solid #fff; margin-left:-1em; z-index:10;}
.bordered {border:1px #9c0 solid;}

.fontWhite, .fontWhite a {color:#fff;}
.fontGreen, .fontGreen a {color:#9c0;}
.fontLarge {font-size:1.4em;}
.fontItalic {font-style:italic;}
.fontBold {font-family:'Roboto Condensed', Arial, sans-serif; font-weight:bold;}
.fontBold.fontLarge {font-size:1.6em;}
.noWrap {white-space:nowrap;}

.padding-top-bottom {padding-top:15px; padding-bottom:15px;}
.padding-top {padding-top:15px;}
.padding-bottom {padding-bottom:15px;}

a.teaserLayer {display:block; position:absolute; top:0; left:0; height:100%; width:100%;}
a.buttonGreen, .buttonGreen {color:#fff; background-color:#9c0;}
.noMargin {margin:0;}
.col-center li, .col-md-center li {text-align:left;}
ul.borderGray {padding-left:0;}
ul.borderGray li {list-style-type:none; margin:0; padding:0.3em; font-size:0.9em; border-top:1px #ccc solid;}
.col-center ul.borderGray li {text-align:center;}
.teaser {margin:0 -15px 15px; padding:15px;}
.hasTeaserLink {cursor:pointer;}
.editorLink {position:absolute; top:30px; right:10px; display:block; height:40px; width:40px; background-color:#505050; background-image:url(../img/edit.png); z-index:10;}

/* Header */
header {position:relative; width:100%; display:block; background-color:#fff; box-shadow: 0px 5px 8px 0px rgba(0,0,0,0.5); z-index:90;}
header .col {padding:0;}
header .bgYellow li a {display:block; font-size:0.9em; line-height:2.4em; padding:0.1em 1em; font-weight:bold; color:#fff; text-decoration:none;}
header .bgYellow a.act {color:#000;}
header .bgYellow a.phone {font-weight:normal; color:#000;}
a.phoneLink {display:inline-block; font-size:0.9em; line-height:2.4em; padding:0.1em 0 0.1em 32px; font-weight:normal; text-decoration:none; background-image:url(../img/icon_phone.gif); background-position:center left; background-repeat:no-repeat;}
header p {margin:0; padding:20px 0 0;}
.logo {display:block; float:left; width:auto; height:45px; margin:18px 0;}

/* Sprachnavigation */
ul.langNav {float:right; margin:0;}
.langNav li {float:left; margin:0; padding:0 0 0 0; list-style-type:none;}


/* Hauptnavigation */
#mainNav {position:fixed; top:0; left:100%; height:100%; width:100%; background-color:#fff; transition:left 0.3s; z-index:95;}
#mainNav nav {height:100%; overflow:auto;}
#mainNav ul {margin:2.5em 0 0; padding:0.3em 0 0; float:none;}
#mainNav li {float:none; padding:0;}
#mainNav li:after {display:none;}
#mainNav a {display:block; width:100%; padding:0.7em 0; text-align:center; text-decoration:none;}
#mainNav li ul {position:relative; top:0; left:0; width:auto;}
#mainNav li ul:before {display:none;}
#navOpen {display:block; position:absolute; top:3em; left:-48px; height:48px; width:48px; background-color:rgba(255,255,255,0.8); background-image:url(../img/burger.png); background-size:100%; background-repeat:no-repeat; cursor:pointer; z-index:95;}
#navClose {display:block; position:absolute; top:0; right:0; height:3em; width:3em; background-image:url('../img/close.png'); background-size:100%; background-repeat:no-repeat; cursor:pointer;}
.navOpened {overflow:hidden;}
.navOpened #mainNav {left:0;}

/* Header-Slideshow / -Bild */
.headerSlider {position:relative;}
.headerSlider .slider {position:absolute; top:0; opacity:0; overflow:hidden;}
.headerSlider .slider:first-child, .headerSlider .slider.slick-slide {position:relative; opacity:1;}
.headerSlider img.desktop {position:relative; display:block; width:auto; max-width:100%; height:auto; margin-top:-6em; margin-bottom:-6em;}
.headerSlider img.mobile {display:none;}
.sliderContent {position:absolute; top:3em; left:15px; width:80%;}
.sliderContent h2 {display:inline-block; font-family:'Roboto', Arial, sans-serif; font-size:1.5em; font-weight:500; margin:0; padding:0.35em; color:#000; background-color:rgba(255,255,255,0.8);}
.sliderContent p {margin:0; padding:0; width:auto; font-family:'Roboto Condensed', Arial, sans-serif; font-weight:bold; margin:1em 0;}
.sliderContent p:before {content:""; display:table; clear:both;}
.sliderContent p span {padding:0 0.3em; font-size:2em; line-height:1.5em; color:#fff; background-color:rgba(255,200,0,0.8); box-decoration-break:clone; -webkit-box-decoration-break:clone;}
.sliderContent a.button {display:inline-block; padding:0.35em 1.5em; text-decoration:none; background-color:#fff;}
.headerSlider .slick-slide .sliderContent {left:-100%; transition:left 1s;}
.headerSlider .slick-slide.slick-current .sliderContent {left:15px; transition:left 0;}

.slick-dots {position:absolute; bottom:1em; left:0; display:block; width:100%; padding:0; margin:0; list-style:none; text-align:center;}
.slick-dots li {position:relative; display:inline-block; margin:0 0.5em; padding:0; cursor: pointer;}
.slick-dots li button {font-size: 0; line-height: 0; display:block; width:20px; height:20px; cursor:pointer; color:transparent; border:0; outline:none; background:transparent;}
.slick-dots li button:hover, .slick-dots li button:focus {outline:none;}
.slick-dots li button:hover:before, .slick-dots li button:focus:before {opacity:1;}
.slick-dots li button:before {content:""; display:block; position:absolute; top:20%; left:20%; width: 60%; height: 60%; text-align:center; opacity:.75; background-color:#fff; border-radius:50%;}
.slick-dots li.slick-active button:before {background-color:#FFC800; opacity:1;}

/* Breadcrumbs */
.breadcrumbs ul {margin:0; padding:0; font-size:0.9em;}
.breadcrumbs li {list-style-type:none; display:inline-block; margin:2px; padding:0.3em 0;}
.breadcrumbs li:before {content:"/";  display:inline-block; padding-right:0.3em;}
.breadcrumbs li:first-child:before {display:none;}
.breadcrumbs a {text-decoration:none;}

.headline h1 {background-color:#f4f4f4; padding:0.2em 15px; margin-left:-15px; margin-right:-15px;}

/* Absatz zweispaltig */
.col-lg-6 h2 {margin-bottom:0.4em;}
.col-lg-6 h3 {font-family:'Roboto Condensed',Arial,sans-serif; font-weight:normal; line-height:1.1em; padding:0.2em 0; margin:0.75em 0;}

/* Bild-Slideshow */
.projectSlider {margin:0; padding:0 0 30px;}
.projectSlider .slider {float:left; width:50%; padding:0 15px 30px;}
.projectSlider .slider a {position:relative; display:block; background-image:url(../img/magnify.png); background-position:top left; background-repeat:no-repeat; cursor:pointer;}
.projectSlider .slider img {display:block; margin:0 auto;}
.projectSlider .slider .magnify {display:block; position:absolute; right:5px; bottom:5px; height:34px; width:38px; background-image:url(../img/magnify.png); background-repeat:no-repeat;}
.projectSlider .slider p {margin:0; padding:0.5em; background-color:#FFC800}
.projectSlider .slick-arrow {position:absolute; top:45%; left:15px; height:70px; width:40px; margin-top:-40px; background-color:rgba(255,255,255,0.6); background-image:url('../img/arrow_prev.png'); background-position:center center; background-repeat:no-repeat; cursor:pointer; z-index:10;}
.projectSlider .slick-next {left:auto; right:15px; background-image:url('../img/arrow_next.png');}
body.mfp-zoom-out-cur {overflow:hidden;}

/* Intro Unterseiten */
.mainList p {margin:1.5em 0;}
.mainList .bordered h2 {margin:0.5em 0;}
.mainList .bordered ul {position:relative; margin:0 0 1em; padding:0;}
.mainList .bordered ul:before {content:""; display:block; position:absolute; top:0; left:0; height:1em; width:1.6em; background-color:#fff; z-index:2}
.mainList .bordered ul:after {content:""; display:block; position:absolute; bottom:0; left:0; height:1em; width:1.6em; background-color:#fff; z-index:2}
.mainList .bordered li {position:relative; list-style-type:none; margin:0; padding:0.8em 0 0.8em 3em; font-size:0.9em;}
.mainList .bordered li:before {content:""; display:block; position:absolute; top:0; left:0.9em; height:100%; width:2px; background-color:#b8e62e;}
.mainList .bordered li:after {content:""; display:block; position:absolute; top:0.5em; left:0; height:1.5em; width:1.5em; background-color:#b8e62e; background-image:url('../img/check.png'); background-size:70%; background-repeat:no-repeat; background-position:center; border:2px #cf3 solid; border-radius:50%; z-index:3;}

/* Box Beratungsablauf */
.details .col {height:325px; padding:0 2em; font-size:0.85em;}
.details .col:before {content:""; display:block; height:92%; width:92%; position:absolute; top:0; left:4%; border:1px #9c0 solid;}
.details .col:after {content:""; display:block; height:92%; width:6%; position:absolute; top:0; right:-2%; background-image:url('../img/arrow_right.png'); background-size:100% auto; background-position:center; background-repeat:no-repeat;}
.details .col.arrowBottom:after {height:6%; width:100%; left:0; top:auto; bottom:2%; background-image:url('../img/arrow_bottom.png'); background-size:auto 100%;}
.details .col.arrowLeft:after {content:""; display:block; height:92%; width:6%; position:absolute; top:0; left:-1.7%; background-image:url('../img/arrow_left.png');}
.details h3 {font-size:1.15em; line-height:1.2em; color:#9c0;}
.details p {line-height:1.3em;}
.details p.result {position:absolute; left:2em; bottom:2em; margin-right:2em; font-weight:500;}
.details .col:before  {}

/* Barbar Stories */
.stories {font-size:0.9em;}
.stories .pic {padding:0; margin:-15px 0 0;}
.stories p.meta-text {font-size:0.9em; color:#9c0; margin:0;}
.stories article {padding-bottom:2.5em;}
.stories .buttonHolder {display:block; position:absolute; left:0; bottom:15px; width:100%; padding:0 15px; text-align:center;}
.stories .button {display:block;}
.pageNavigation {padding:15px 0 30px;}
.pageNavigation .col {padding:0;}
.pageNavigation .nav-previous {float:left;}
.pageNavigation .nav-next {float:right;}
.pageNavigation a {display:inline-block; padding:0.35em 1.5em; font-weight:500; text-align:center; text-decoration:none; color:#333; background-color:#eee;}

footer {font-size:0.8em; margin-bottom:2em;}
footer h2 {font-size:1.2em; text-transform:uppercase;}
footer ul {margin:0; padding:0;}
footer li {list-style-type:none; margin:0; padding:0;}
footer a {text-decoration:none;}
footer li a {display:inline-block; padding:0.2em;}
footer ul.social {margin-top:1.5em;}
footer .social li {display:inline-block; margin-right:0.3em;}
footer .social a {display:inline-block; color:#fff; background-color:#333; height:1.8em; width:1.8em; line-height:1.6em; text-align:center; border-radius:50%;}
#designerLinks {display:block; position:absolute; top:-15px; right:0; text-align:right;}
#designerLink {display:block; height:4.5em; width:4.5em; background-image:url('../img/Kjelldesign.svg');}
#cmsLink {position:absolute; bottom:0; right:110%; color:#999; font-size:0.75em; white-space:nowrap;}

@media screen and (min-width:991px){
  .scrolled #all {padding-top:145px;}
  .scrolled header {position:fixed; top:0; left:0; width:100%;}
  .scrolled .logo {margin:9px 0; height:32px;}
  .scrolled header .button {display:none;}
  .scrolled #navOpen {top:2.4em;}
  .teaserBox .row {margin-left:-15px; margin-right:-15px;}
  .teaser {margin:15px 0;}
}

@media screen and (min-width:1200px){
  body {font-size:18px;}
  .logo {height:55px;}
  header p {padding-top:24px;}
  #navOpen {top:3.3em;}
  .headerSlider img.desktop {margin-top:-6.5em; margin-bottom:-6.5em;}
  .sliderContent {width:75%;}
  a.button:hover, .button:hover {box-shadow: 0px 2px 6px rgba(0,0,0,0.5); transform:scale(1.05);}
  a.noDeco:hover {text-decoration:underline;}
  footer a:hover {text-decoration:underline;}
  .hasTeaserLink:hover h1, .hasTeaserLink:hover h2, .hasTeaserLink:hover h3, .hasTeaserLink:hover h1 a, .hasTeaserLink:hover h2 a, .hasTeaserLink:hover h3 a, .hasTeaserLink:hover .icon {color:#9c0;}
  .details .col {height:385px;}
  .details p {line-height:1.4em;}
  .details p.result {bottom:3em;}
  .team .pic {height:355px;}
  .references .pic {height:80px;}
}

@media screen and (max-width:990px) {
  .headerSlider img.desktop {margin:0;}
  .sliderContent {top:8em; left:0; width:96%; padding-right:15px; text-align:center;}
  .sliderContent h2 {display:block; width:20em; margin:0 auto;}
  .sliderContent p {display:block; width:30em; max-width:100%; margin:0 auto 1em;}
  .sliderContent p span {display:block; padding:0.5em 0.3em; font-family:'Roboto', Arial, sans-serif; font-size:1.3em; line-height:1.3em; font-weight:500;}
  .projectSlider .slider {width:33.3%;}
  .bgArrowWhite .container {padding-top:15px;}
  .details .col {height:auto; padding-bottom:1em; margin-bottom:30px; border:1px #9c0 solid;}
  .details .col:before {display:none;}
  .details .col:after, .details .col.arrowLeft:after, .details .col.arrowBottom:after {height:20px; width:100%; left:0; right:auto; bottom:auto; top:100%; background-image:url('../img/arrow_bottom.png'); background-size:auto 100%;}
  .details p.result {position:relative; left:auto; bottom:auto;}
  .references .noPic .pic {display:none;}
  .references .noPic h3 {border:none; margin:0;}
  .stories .teaser {margin:0 0 15px;}
  .stories .pic {margin:0; text-align:center;}
  .stories .pic img {margin:0 auto;}
  .stories .button {display:inline-block;}
  .col-md-center td {text-align:left;}
}

@media screen and (max-width:990px) and (orientation:portrait){
}

@media screen and (max-width:767px){
  .fontLarge {font-size: 1.2em;}
   h1, .h1, h2, .h2 {font-size:1.7em;}
  .sliderContent {top:3em;}
  .sliderContent h2 {font-size:1.2em; width:20em;}
  .sliderContent p {width:24em;}
  .projectSlider .slider {width:50%;}
}

@media screen and (max-width:575px){
  .header.bgBlue a span {display:none;}
  .headerSlider img.desktop {display:none;}
  .headerSlider img.mobile {display:block; height:auto; width:auto; max-width:100%; margin:0 auto;}
  .sliderContent {top:3em; font-size:0.9em;}
  .sliderContent h2 {font-size:1.2em; width:20em;}
  .sliderContent p {width:24em;}
  .projectSlider .slider {width:100%;}
  table, tbody, tr, td {display:block; width:auto !important;}
  tr {margin-bottom:0.3em;}
  .col-md-center td {text-align:center;}
  #designerLinks {top:130%; height:2.6em; width:100%; margin:0 0 auto;}
  #designerLink {position:absolute; top:0; right:50%; height:2.6em; width:2.6em; margin-right:-1.3em;}
  #cmsLink {position:absolute; right:0; bottom:0;}
}

@media screen and (max-width:359px){
  header .bgYellow li a {padding:0.1em 0.5em;}
}

@media print {
  body {font-size:14px;}
  header .bgYellow {position:absolute; top:0; left:0; height:1px; width:1px; overflow:hidden; display:none;}
  header {box-shadow:none;}
  .sliderContent {width:50%;}
}