@font-face {
    font-family: 'Roboto Condensed';
    src: local('Roboto Condensed'), local('Roboto Condensed'),
            url('fonts/RobotoCondensed-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
  }




wow:first-child {
    visibility: hidden;
}

.col-xs-1, .col-sm-1, .col-md-1, .col-lg-1, .col-xs-2, .col-sm-2, .col-md-2, .col-lg-2, .col-xs-3, .col-sm-3, .col-md-3, .col-lg-3, .col-xs-4, .col-sm-4, .col-md-4, .col-lg-4, .col-xs-5, .col-sm-5, .col-md-5, .col-lg-5, .col-xs-6, .col-sm-6, .col-md-6, .col-lg-6, .col-xs-7, .col-sm-7, .col-md-7, .col-lg-7, .col-xs-8, .col-sm-8, .col-md-8, .col-lg-8, .col-xs-9, .col-sm-9, .col-md-9, .col-lg-9, .col-xs-10, .col-sm-10, .col-md-10, .col-lg-10, .col-xs-11, .col-sm-11, .col-md-11, .col-lg-11, .col-xs-12, .col-sm-12, .col-md-12, .col-lg-12 {
    position: relative;
    min-height: 1px;
    padding-right: 7.5px !important;
    padding-left: 7.5px !important;
    float:left;
}

.row {margin-right: -7.5px !important; margin-left: -7.5px !important;}

@media screen and (min-width: 1500px) {
.container {width: 1470px; max-width: 1470px !important;}
}



.container-small {
      padding-right: 15px;
    padding-left: 15px;
    width: 100%;
    margin-right: auto;
    margin-left: auto;
}


@media (min-width:576px) {
 .container-small {max-width:500px;}
}
@media (min-width:768px) {
  .container-small {max-width:630px;}
}
@media (min-width:992px) {
  .container-small {max-width:800px;}
}
@media (min-width:1200px) {
 .container-small {max-width:1000px;}
}



body, html {height:100%;}

body {
    background: #fff;
    color: #6a4e40 !important;
  font-family: 'Trebuchet MS', serif !important;
    font-size:16px !important;
    outline: none !important;
    line-height: 22px !important;
}

a {outline: none; color:#8b9295;}
a:hover {text-decoration: none;}
.btn-link {color:#7b8285; border:2px solid #7b8285; margin: 20px 0px 0 4px}
.btn-link:hover {color:#abb2b5;  border:2px solid #abb2b5;}

h1, .h1, h2, .h2, h3, .h3 {font-family: 'Roboto Condensed', sans-serif;}

.h1, h1 {
    font-size: 28px;
}


h2, .h2 {font-size:1.6rem;}
b, strong {font-weight: bold;}

span.weiss {color:rgba(255,255,255,1);}
span.fastweiss {color:rgba(255,255,255,0.5);}
.mt15 {margin-top: 15px;}

iframe {width:100%; height:600px;}

.fazit {border: 1px solid rgba(0,0,0,.1); font-weight: normal; padding:20px 20px 0 20px; margin-bottom: 50px; background: rgb(95 147 173 / 79%); color: #fff;}


.table td, .table th {vertical-align: middle !important; font-size: 13px; font-weight: normal;}

.img-responsive {width:100%; height:auto;}

.esd-eigenschafts-icons {color: #979c9e;}
.esd-eigenschafts-icons img {max-width: 107px; height:auto; margin-bottom: 10px;}
@media screen and (max-width: 576px) {
    .esd-eigenschafts-icons img {max-width: 150px; height:auto; margin-bottom: 10px;}
}
.icon_box {padding:30px 20px; margin-top: 20px; background: #f2f2f2;}

 @media (min-width: 991px) {
.col-ck-5er {max-width:20%;}
 }


.fl {float:left;}
.hundert {width:100%;}
.mt15 {margin-top: 15px;}
.ja, .nein {max-width: 20px; height:auto;}


.divider {border-bottom: 1px solid rgba(255, 255, 255, 0.5); border-top: 1px solid rgba(0, 0, 0, 0.2); margin: 30px 0;}

a, li, .glyphicon {transition: 0.3s ease-in-out} 


.slide {float:left; width:100%;}

.datenschutzerkl_kontakt {
    width: 100%;
    float: left;
    text-align: justify;
    color: #8c8c8c;
    padding: 9px;
    background: #f2f2f2;
    border: 1px solid #ccc;
    border-radius: 5px;
    margin: 0 0 9px 8px;
    line-height: 1;}

small {line-height: 1;}

hr.greenline {border-top: 2px solid #bbc2c5;}

textarea.form-control {height: 205px !important;} 
label {font-weight: normal !important;}
input#Postleitzahl {width:110px;}

.logo {display:inherit !important; max-width:250px; height:auto; margin: 10px auto 0;}
.logofooter {max-width: 100%; height:auto;}
.outline {outline:none !important;}




.form-group {margin-bottom:15px;}

/* HEADER */ 
.skippy {display: block; padding: 1em; color: #fff; text-align: center; background-color: #563d7c; outline: 0;}
.bd-navbar {position: -webkit-sticky; position: sticky; top: 0; z-index: 1071;}
.bd-navbar {min-height: 4rem; 
background: #6d92a4; 
background: -moz-linear-gradient(left,  #6d92a4 0%, #6d92a4 50%, #6d92a4 100%); 
background: -webkit-linear-gradient(left,  #6d92a4 0%,#6d92a4 50%,#6d92a4 100%); 
background: linear-gradient(to right,  #6d92a4 0%,#6d92a4 50%,#6d92a4 100%); 
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#6d92a4', endColorstr='#6d92a4',GradientType=1 );
}
.navbar-dark .navbar-brand {color: #fff;}
.btn-bd-download {font-weight: 600; color: #ffe484; border-color: #ffe484;}
.ml-md-auto, .mx-md-auto {margin-left: auto !important;}
.flex-row { -ms-flex-direction: row !important; flex-direction: row !important;}
.dropdown, .dropleft, .dropright, .dropup {position: relative;}
.bd-navbar .navbar-nav-svg {display: inline-block; width: 1rem; height: 1rem; vertical-align: text-top;}
.btn-bd-download {font-weight: 600; color: #ffe484 !important; border-color: #ffe484 !important;}
.btn-bd-download:active, .btn-bd-download:hover {color: #2a2730 !important; background-color: #ffe484;  border-color: #ffe484;}
#svglogo {height:40px; width:40px;}
#esdsvg {height:20px; width:20px;}
@media screen and (max-width: 991px) {.ml-md-auto {margin-left: 0 !important;}}


/* main aufbau */

.bd-toc {position: -webkit-sticky; position: sticky; top: 4rem; height: calc(100vh - 4rem); overflow-y: auto;}
.bd-toc {-ms-flex-order: 2; order: 2; padding-top: 1.5rem; padding-bottom: 1.5rem; font-size: .875rem;}
@media screen and (min-width: 1200px) { .d-xl-block {display: block !important;}}

/*  content  */

.bd-masthead {position: relative; padding: 3rem 15px; padding-top: 3rem; padding-bottom: 3rem;}
.bd-text-pink-bright {color: #444;}
.bd-masthead h1 {font-size: 3.5rem; line-height: 1;} 
.brighter {color:#8b9295;}

.mb-4, .my-4 {margin-bottom: 1.5rem !important;}
.lead {font-size: 1.0rem !important; font-weight: 300;}
.karton {max-width: 300px; height:auto; margin:0 auto 20px;}
.karton img {width:100%; height:auto;}
@media screen and (max-width: 460px) {
    .bd-masthead h1 {font-size: 2.5rem;}
    .lead {font-size: .9rem !important;}
}

.verpackungsdesign {background: #e9f1f5; padding:100px 0;}
.verpackungsdesign h2 {font-size: 28px;}


.verpackungsdesign_dark {background: #6d92a4; padding:100px 0; color:#fff;}
.verpackungsdesign_dark h2 {font-size: 28px; color:#fff;}
.verpackungsdesign_dark .brighter {color: #c0ebf2;}


.gefache_dunkeldark {background: #2d5264; padding:100px 0; color:#fff;}
.gefache_dunkeldark h2 {font-size: 28px; color:#fff;}
.gefache_dunkeldark .brighter {color: #c0ebf2;}




.einkaufstueten {background: #ffffff; padding:100px 0; }
.einkaufstueten h2 {font-size:26px; margin-bottom: 0px;font-size: 2.5rem;}
.einkaufstueten h3 {font-size:20px; margin-top: 0px; margin-bottom: 30px;}
.einkaufstueten p {}


.ESD-Verpackungen {background: #eaeaea; padding:50px 0;}
.ESD-Verpackungen h2 {font-size:26px; margin-bottom: 0px;font-size: 2.5rem;}
.ESD-Verpackungen h3 {font-size:20px; margin-top: 0px; margin-bottom: 30px;}

.baumarkt {background: #ffffff; padding:50px 0;}

.mt40 {margin-top: 40px;}
.mb40 {margin-bottom: 40px;}

h1, .h1, h2, .h2, h3, .h3 {margin-top: 1rem; font-weight: 300; font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";}
@media screen and (max-width: 767px) {
h1, .h1 {font-size: 1.75rem;}
}
.bd-title {margin-bottom: .5rem; color: rgba(0,0,0,.75); font-size: 3rem;}

.bd-lead {font-size: 1.2rem; font-weight: 100; line-height: 1.4; color: rgba(0,0,0,.75);}



/* Navigation */
li {list-style: none; line-height: 1.6;}
#bd-docs-nav ul li a {font-size: 90%; color: rgba(0,0,0,.7);}
.bd-toc-item ul {padding-left: 24px !important;}
.bd-toc-link {display: block; padding: .25rem 1rem; font-weight: 600; color: rgba(0,0,0,.65);}
.bd-toc-item.active > .bd-sidenav {display: block;}
.bd-toc-item.active > .bd-toc-link {color: rgba(0,0,0,.85);}
/* .bd-sidenav {display: none !important;} */
.bd-toc-item.active > .bd-sidenav {display: block !important;}
.bd-sidebar .nav > .active:hover > a, .bd-sidebar .nav > .active > a {font-weight: 600; color: rgba(0,0,0,.85); background-color: transparent;}
.bd-sidebar .nav > li {width: 100%; list-style: none;}
.bd-sidebar .nav > li > a { display: block; padding: .25rem 1.5rem; font-size: 90%; color: rgba(0,0,0,.65);}
.bd-sidebar .nav > .active:hover > a, .bd-sidebar .nav > .active > a {font-weight: 600; color: rgba(0,0,0,.85); background-color: transparent;}
#bd-docs-nav {margin-top:40px;}
@media screen and (min-width: 768px) {
.bd-links {display: block !important;}
}



/* buttons */

.btn-success {color: #fff; background-color: #789932; border-color: #789932;}
.btn-success:hover {color: #fff; background-color: #8bb13a; border-color: #8bb13a;}



.flex-container {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    width: 100%;
}

.flex-item {}



.img-responsive {width: 100%; height: auto;}



#slide40 {padding:70px 0; background: #777777; color:#fff;}
#slide40 h3 {margin-bottom: 40px;}

#slide60 {padding:50px 0; background:#000; color:rgba(255,255,255,.5);}
#slide60 h3 {color:rgba(255,255,255,.5); font-size:20px;}

#slide1 .slide1texte {margin:200px 0 0 0;}

.bigpic {margin:15px 0 25px 0;}

.icon_box small {color:#979c9e;}

time {
    width: 140px;
    padding: 7px 0 4px;
    text-align: center;
    color: #fff;
    background: #86afc1;
    display: block;
    margin-top: 30px;
    border-top-left-radius: 14px;
    border-top-right-radius: 14px;

}
.timeline {border-top:1px solid #86afc1; width:100%; height:1px; margin-bottom: 50px;}

@media screen and (min-width: 1500px) {
.container {width: 1270px; max-width: 1270px !important;}
}

.ESD-Logo {max-width: 150px;height: auto;float: none; margin-right: 20px;}

p {text-align: justify;}

iframe {width:100%; height:350px;}

}


/* flex-configuraion */

.flex-container {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    width: 100%;
    padding: 7.5px;
    flex-wrap: wrap;
}

.flex-container > * {
  flex-grow: 1;
  flex-shrink: 1;
  flex-basis: 300px;
}

.flex-item {padding: 4px;}


@media (max-width:576px) {
  .flex-container  {display:block;}
  .flex-container > * {flex-basis: 250px;}
}

.mt-18 {margin-top: -15px;}

/* flex-configuraion ends */

.grafic {text-align: center;}
.werbebutton {background-color: #6d92a4; display: inline; padding:8px 15px; color:#fff;}
.werbebutton:hover{color:#fff;}