/* 


Orange: #FFBC1E;
Orange2: #CACACA;

CACACA
Orange3: #FFEB00
rot FA0000

red: red;
links:CACACA;

background bdb22 #0C7AFF; -->405BD2 --> #4D51A5

breakpoints xs | sm | md | lg | xl 
hidden-xs-down` = `d-none d-sm-block
https://medium.com/wdstack/bootstrap-4-hidden-visible-dd969a4c5854
https://www.onlinewebfonts.com/package/Rockwell_Std
eot ttf

RockwellStdExtraBold.ttf
RockwellStdExtraBold.eot
RockwellStd-Bold.ttf
RockwellStd-Bold.eot



li-stern_10.png
li-stern_14.png
li-stern_18.png
li-stern_32.png
li-stern_40.png
li-stern_60.png


transform: rotate(30deg);
transform: skew(20deg);
 */



@font-face {
 font-family: franklinlight;
 src: url("LibreFranklin-Light.eot"); 
 src: url("LibreFranklin-Light.ttf")
}

@font-face {
 font-family: franklinregular;
 src: url("LibreFranklin-Regular.eot"); 
 src: url("LibreFranklin-Regular.ttf")
}

@font-face {
 font-family: franklincond;
 src: url("franklin-gothic-medium-cond.eot"); 
 src: url("franklin-gothic-medium-cond.ttf")
}

@font-face {
 font-family: franklincondbold;
 src: url("franklin-gothic-condensed.eot"); 
 src: url("franklin-gothic-condensed.ttf")
}


@font-face {
 font-family: franklin;
 src: url("LibreFranklin-Medium.eot"); 
 src: url("LibreFranklin-Medium.ttf")
}
@font-face {
 font-family: franklinbold;
 src: url("LibreFranklin-Black.eot"); 
 src: url("LibreFranklin-Black.ttf")
}
@font-face {
 font-family: Rokkitt;
 src: url("Rokkitt-Regular.eot"); 
 src: url("Rokkitt-Regular.ttf")
}

@font-face {
 font-family: Rokkittbold;
 src: url("Rokkitt-Bold.eot"); 
 src: url("Rokkitt-Bold.ttf")
}

@font-face {
 font-family: rockwell;
 src: url("RockwellStd-Bold.eot"); 
 src: url("RockwellStd-Bold.ttf")
}

@font-face {
 font-family: rockwellbold;
 src: url("RockwellStdExtraBoldeot"); 
 src: url("RockwellStdExtraBold.ttf")
}




body {width: 100%;height: 100%;
    font-family: franklin,"Helvetica Neue",Helvetica,Arial,sans-serif;
    font-weight:200;color: #fff;background-color: #111;}
html {width: 100%;height: 100%;letter-spacing: 1px; }
h3,h4,h5,h6 {font-weight: 400;}
p { margin: 0 0 25px; font-size: 18px; line-height: 1.5; }
h4 {line-height: 130%;}
.letterspacing2 {letter-spacing: 2px; }
.letterspacing4 {letter-spacing: 4px; }
header.container * {width:100vw!important;padding:0;}


.all {  position:absolute;z-index:-1;opacity: 0.1;background: #555 url('../img/helmkopf17.png');
    background-position:center 100px;background-size:cover;background-repeat:no-repeat;
    background-attachment:fixed;width:100%;height:8000px;}

.intro.landscape {background: transparent url("../img/bdb25-www-quer_01.jpg") no-repeat center 0px;
        background-size:100vw;}
.intro.landscape-2 {background: transparent url("../img/bdb25-www-quer_02.png") no-repeat center 0px;
        background-size:100vw;}

ul.decimal li{
   list-style-type: decimal;}

.bdbslider {width:100%;margin:0;}

/* popover */
.popover-content{font-size:120%;color:black; }
a.poplink {color:silver!important; }
a.poplink:hover {color:orange!important; }
.popover, .popover2 {max-width: 500px;}

/* modal */



.bands img {padding-bottom:10px;}
a img:hover {-webkit-box-shadow: 4px 6px 45px 0px #666; box-shadow: 4px 6px 45px 0px #666;}
a img.schattenohne:hover {-webkit-box-shadow: 0 0 0 0 transparent; box-shadow: 0 0 0 0 transparent;filter: brightness(1.1);}

.example-image-link {padding: 0 5px;}
.franklincond {font-family: franklincond;}
.franklincondbold {font-family: franklincondbold;}

/* versuch Schrift */
a .orange {color: #FFBC1E;}
.franklincond {font-family: rockwell;} /* color:#FFEB00; */
.franklincondbold {font-family: rockwellbold;}





/* keyframes 


.franklincond {
  animation-name: fc;
  animation-duration: 2s;
  animation-iteration-count: 1;
}

@keyframes fc {
   from {transform: skew( 0deg, 0deg);}  
   to {transform: skew( -2deg, -10deg);}  
}

*/

/* abstand */
section {padding-top:100px;}
        @media(max-width:1024px){
section {padding-top:50px;}}

.padding20 {padding:20px 0;}
.padding0 {padding:0;margin:0;line-height: 1;}

.abstand20 {width:100%;height:20px;}
.abstand50 {width:100%;height:50px;}
.abstand100 {width:100%;height:100px;}
.abstand200 {width:100%;height:200px;}

.padding50 {padding:0 0% 0 0;}
.padding20 {padding:20px 0;}
.padding100 {padding:0 0 0 0;}
.padding00020 {padding:0 0 0 20px;}
.padding-top20 {padding:10px 0 0 0;}

.minheight {min-height:500px!important;}


.stern.left li {display: inline;
float: none;
position: static;}
.left {text-align:left;}
.center {text-align: center;}

.size12, .size16 ,.size18,.size22,.size28,
.size32,.size36,.size40,.size42,.size52,.size70
{line-height: 120%; text-transform: uppercase; }


.skew {position:relative; transform: skew(-0deg, -8deg);margin-bottom:20px;}
    @media(max-width:1200px) {
.skew {margin-bottom:20px;padding-right:0vw;}

.skew.exhibitors {padding-right:0;}}

.breit {width:100%;border:1px solid red!important;}


.size12, .size12footer {font-size:12px;}
.size16 {font-size:16px;}
.size18 {font-size:18px;}
.size22 {font-size:22px;}
.size28 {font-size:28px;}
  @media(max-width:1199px) { 
.size28 {font-size:24px;}}
.size32 {font-size:32px;}
.size36 {font-size:36px;}
.size40 {font-size:40px;}
.size42 {font-size:62px; padding:50px 0;z-index: -1;
background: transparent url('../img/brems.png')no-repeat 0px 20px;background-size:contain;}

  @media(max-width:1199px) { 
.size42 {min-height:100px;font-size:42px;}}
.size52 {font-size:52px;}
.size70 {font-size:52px;}
.aussteller {min-height:300px;text-align:left;}
.ausstellerbild {height:200px!important;}
.lowercase {text-transform: none;}
.uppercase, .uppercase li {text-transform: uppercase;}
.color333 {color:#bbb;}
.color000 {color:#000;}
.colorfff {color:#fff;}

#kontakt a:hover {color:#FFD000;}

.orange, div.orange a {color:#FFD000;line-height:120%;}
.orange:hover, .orange a:hover {color:white}

.acts li {overflow: hidden;}

.time {float:left;width:120px;font-size:14px;padding-top:5px;}
        @media(max-width:768px){
.time {width:100%;padding-top:0px}}

.franklinbold {font-family: franklinbold;letter-spacing: 0.2rem;}
.nowrap {text-wrap:nowrap;}

.partner {margin-top:-200px;}
    @media ( max-width:978px) { 
.partner {margin-top:-300px;}}
    @media ( max-width:760px) { 
.partner {margin-top:0px;}}

.logo-height {height:250px;display: flex; align-items: center;}
    @media(max-width:980px) {
.logo-height {height:150px;display: flex; align-items: center;}}
    @media(max-width:768px) {
.logo-height {height:120px;}}
        @media(max-width:768px){
.logo {height:400px;}}


.partner a {opacity:.7;}
.partner a:hover {opacity:1.0;}
.partner {width:1200px;}
    @media(max-width:1200px) {
.partner {width:100%;}}

footer a.franklincond {font-size:12px;}

li .active,
li.active ul li            a.page-scroll:hover,
li.active ul li.active     a.page-scroll,
ul.nav.responsive li       a.page-scroll:hover
 {color: #FFBC1E!important;}

.navbar-nav {font-size:22px;}
    @media(max-width:1199px) {
.navbar-nav {font-size:14px;}}
    @media(max-width:768px) {
.navbar-nav {font-size:30px;padding-left:10px;}}



#slogan {font-size:24px;}
.col-lg-8 {padding: 5px 0 10px 0;}
.size12footer {font-size:18px;opacity:0.5;}


.weisserschatten {-webkit-box-shadow: 4px 6px 45px 0px #333; box-shadow: 4px 6px 45px 0px #333;}
.textschatten {
-webkit-text-shadow: 0px 0px 5px rgba(0,0,0,0.2);
-moz-text-shadow: 0px 0px 5px rgba(0,0,0,0.2);
text-shadow: 0px 0px 5px rgba(0,0,0,0.2)}

.shadow15 {
-webkit-text-shadow: 0px 0px 15px rgba(0,0,0,1);
-moz-text-shadow: 0px 0px 15px rgba(0,0,0,1);
text-shadow: 0px 0px 15px rgba(0,0,0,1)}

.stern li { text-align: left;padding-left: 30px;background: transparent url('../img/li-stern_18.png')no-repeat 0 5px;
list-style-type: none;}
    @media(max-width:768px) {
.stern li { background: transparent url('../img/li-stern_14.png')no-repeat 6px 5px;padding-left: 30px;}}
p { margin: 0 0 35px; font-size: 20px; line-height: 1.6;}
.list_left {padding-left:30%;}}

a { color: #FDD03D;-webkit-transition: all .2s ease-in-out; -moz-transition: all .2s ease-in-out; transition: all .2s ease-in-out;}

a:hover,
a:focus { text-decoration: none; color: #FDD03D;}

.link_spez {color: #fff !important;	}

.light {font-weight: 400;}

.navbar-custom {margin-bottom: 0;
    border-bottom: 1px solid rgba(255,255,255,.3);
    text-transform: uppercase;
    font-family: franklincond,"Helvetica Neue",Helvetica,Arial,sans-serif;
    background-color: #111;
}

#navbutton {background: transparent url(../img/navbutton.png) 0 0;background-size:100% 100%; width:20px;height:20px;}}

.navbar-custom .nav li a {
    -webkit-transition: background .3s ease-in-out;
    -moz-transition: background .3s ease-in-out;
    transition: background .3s ease-in-out;
    padding-left: 10px;
    padding-right: 10px;}

.navbar-custom .nav li a:hover { color: rgba(250,55,55,1)!important;}
.top-nav-collapse {color:white;}
a .brand {color:#fff;} 
a .brand:hover {color:#CACACA;} 

a:active, a:focus {outline: none;} 

.navbar-custom .nav li a {
    padding-left: 5px;
    padding-right: 5px;color:white;}

.navbar-custom .nav li.active

@media(max-width:1024px) {
    /* nav.navbar .container, .top-nav-collapse {background:white!important;} */
.top-nav-collapse {color:black;}}

.navbar-custom .nav li a:hover {
    outline: 0;
    color: rgba(255,255,255,.8);
    background-color: transparent;}

.navbar-custom .nav li a:focus,
.navbar-custom .nav li a:active {
    outline: 0;background-color: transparent;}

.navbar-custom .nav li.active {
    outline: 0;}

.navbar-custom .nav li.active a {
    background-color: rgba(255,255,255,.3);}

.navbar-custom .nav li.active a:hover {
    color: #fff;}


@media(min-width:768px) {
    .navbar-custom {
        font-size: 80%;
        padding: 20px 0;
        border-bottom: 0;
        letter-spacing: 1px;
        background: 0 0;
        -webkit-transition: background .5s ease-in-out,padding .5s ease-in-out;
        -moz-transition: background .5s ease-in-out,padding .5s ease-in-out;
        transition: background .5s ease-in-out,padding .5s ease-in-out;}

    .navbar-custom.top-nav-collapse {
        padding: 0;
        border-bottom: 1px solid rgba(255,255,255,.3);
        background: #111;}}