/* 
 * Projekt: JazzClub Minden e.V. 2015
 * Author:  Schiffel IT-Service GmbH
 * Datum:   21.11.2014
 */
 
/* import webfont */
@import url(http://fonts.googleapis.com/css?family=Oxygen:400,300,700);
 
/* default definitions */ 
body { 
  background:url(../img/bg-bodyv3.jpg) no-repeat fixed; 
  background-position:center center; 
  background-size:cover; 
  margin:0; 
  padding:0; 
  font-family: 'Oxygen', sans-serif; 
  color:#222;

}
 
a { 
  color:#666; 
  text-decoration:none; 
}

a:hover { 
  color:#333; 
  text-decoration:none; 
}

a.nohover:hover { 
  color:#666; 
}
 
img { border:0; }
 
h1 { 
  font-weight:300; 
  margin-top:0;
  font-size: 28px;
}
h2 { font-weight:300; font-size:24px; }
h3 { font-weight:300; font-size:21px; margin-bottom:10px !important; }

.logo { 
  display:inline; 
  font-size:24px;
  font-weight: 300;
}
.logo img { 
  margin-right: 10px; 
  float:left; 
}

/*.tx-gbevents-pi1 .pic img {
  max-width:338px;
  max-height:250px;
}*/
 
.socials { font-size:38px; }
.socials a { color:#fff; }

.homefix { margin-top:73px; }
 
.clear { clear:both; visibility:hidden; }

.newsletter_field { width:100%; }
 
/* header */
 
header { 
  position:fixed; 
  top:0px; 
  left:0px; 
  /*background:url(../img/header-bg.png);*/
  width:100%; 
  padding:10px;  
  z-index:100;
}

.headerfade {
  position: fixed;
  top: 0;
  opacity: 0.5;
  left:0;
  width: 100%;
  height: 75px;
  background: #222;
  z-index: 88;
}

.article .header h3 a:hover {
  color:#666;
}

/*.article .header h3 a {
  cursor:default;
}*/

header a { color:#fff; }
header a:hover { color:#fff; }
header a.nohover:hover { color:#fff; }
header a.active {
  color: #f5da24;
  border-bottom: 1px solid #f5da24;
}


.nav { margin-top:11px; }

.navbar-toggle .icon-bar { 
  background:#fff; 
}

.navbar-nav > li > a { 
  padding-top:7px; 
  padding-bottom:5px; 
}

.wrapper-event .content {
  z-index:500;
  position:relative;
}

.navbar-brand { float:none; }

.nav > li > a:hover, .nav > .open > a:hover { 
  border-bottom: 1px solid #fff;
  background: transparent;
  color: #fff;
}

@media(max-width:398px) {
  .logo {
    font-size: 20px;
  }
}

@media(max-width:360px) {
  .logo {
    font-size: 16px;
  }
}

@media(max-width:324px) {
   .hidden-header-xs {
    display:none;
  }
  
  .logo {
    font-size: 24px;
  }
}
 

/* slider */
#slider { height:450px; max-height:450px; }
 
/* content */
main { padding:50px 0px; margin-top:73px; text-align:justify; }
main .container {  
  background:url(../img/main-bg.png);
  /*background: white;*/
  padding:25px 50px; 
}
main img { margin:15px 0; }
main img.left { float:left; margin-right:15px; }
main img.right { float:right; margin-left:15px; }
main article { text-align:justify; }
.sponsoring img {
  width: 12%;
}


.news .footer span { display:inline; }

@media(min-width:1200px) {
 .tabs-v .tab:nth-child(3n+1) { margin-left:0; }
 .tabs-v .tab:nth-child(4n+4) { margin-left:31px; }
}

@media(max-width:1199px) {
  .tabs-v { margin:20px auto; text-align:center; }
}

.tabs-v .tab { 
  display:inline-block; 
  width:380px; 
  margin:20px 0px; 
  padding:20px; 
  border:1px solid #ccc;
  background: #fff;
}

.tabs-v .tab .header { 
  font-size:18px; 
  height:40px; 
  text-align:center; 
  margin-bottom:0px; 
}

.tabs-v .tab .pic { 
  margin-bottom:0px; 
  text-align: center;
}
.tabs-v .tab .content { 
  height:120px; 
  overflow:hidden; 
  margin-bottom:20px; 
}
.tabs-v .tab .action { text-align:center; margin:0; }

.btn { 
  background:#333; 
  border:1px solid #333; 
  color:#fff; 
  padding:6px 30px; 
}

.btn:hover {
  background: #fff;
  border: 1px solid #f5b61f;
  color: #333;
 }

 .tabs-h .tab { border:1px solid #999; margin-bottom:25px; height:525px; }
 .tabs-h .tab .date { background:#d1d1d1; float:left; width:20%; height:525px; padding:20px; font-size:40px; font-weight:300; text-align:center; }
 .tabs-h .tab .content { float:left; width:60%; height:525px; padding:20px; }
 .tabs-h .tab .content .header { font-size:18px; }
 .tabs-h .tab .content .text { height:120px; overflow: hidden; }
 .tabs-h .tab .action { float:left; width:20%; height:525px; padding:20px; }
 .tabs-h .tab .action .btn { background:#f5f5f5; border:1px solid #999; color:#333; padding:4px 12px; }

 .event-cal-mon { font-size:18px; text-align:center; }
 .event-cal { border-spacing: 5px; border-collapse: separate; margin-bottom:25px; }
 .event-cal { width:100%; background:#ffffd4; }
 .event-cal td { text-align:center; padding:0px; }
 .event-cal thead { font-weight:bold; }

 .wrapper-event .pics { width:20%; float:left; font-size:40px; font-weight:300; text-align:center; background:#d1d1d1; min-height:500px; }
 .wrapper-event .content { width:80%; float:left; padding:20px; }
 .wrapper-event .content .header { font-size:18px; }

 td.event { background:#ffcc00; }
 td.event a { color:#000; }

@media(max-width:550px) {
 .wrapper-event .pics { font-size:20px; padding-top:20px; }
 .tabs-h .tab .date { font-size:12px; padding-left:13px; padding-top:20px; }
 .tabs-h .tab .action { padding-left:0; }
 .tabs-h .tab .action a.btn { font-size:12px; }
 .tabs-h .tab .action .btn { display:block; width:45px; padding-left:0; padding-right:0; text-align:center; }
 .tabs-h .tab .action .btn:nth-child(2) { margin-top:15px; }
}

.headfix {
    margin-top: 15px;
    float: none;
    display: inline-block;
}

.dropdown-menu > li > a.active {
    text-decoration: none;
    color: black;
    border: 0;
  }
 
 /* footer */
 footer { 
   background: rgba(0,0,0,0.5);
   color:#fff; 
   padding:25px 50px;
 }

 footer a { color:#ccc; }

 footer a:hover { 
   color:#fff; 
 }

 footer .logo { font-size:16px; }
 footer .h1 { font-size:24px; font-weight:300; margin:0; margin-bottom:25px; padding:0; }
 footer ul { list-style-type:square; margin:0; padding:0; padding-left:15px; }
 footer li { margin:0; margin-bottom:10px; padding:0; }
 @media(max-width:991px) {
  .col-sm-6, .col-xs-12 { margin-bottom:20px; }
 }


@media (max-width: 992px) {
    header {
      padding-left: 0;
      padding-right: 0;
    }
    
    .logo img {
      margin-left: 10px;
    }
  
    .navbar-header {
        float: none;
    }
  
    .navbar-left,.navbar-right {
        float: none !important;
    }
  
    .navbar-toggle {
        display: block;
    }
  
    .navbar-collapse {
        border-top: none;
        box-shadow: none;
    }
    .navbar-fixed-top {
      top: 0;
      border-width: 0 0 1px;
  }
    .navbar-collapse.collapse {
        display: none!important;
    }
    .navbar-nav {
        float: none!important;
        margin-top: 15px;
  }
  .navbar-nav>li {
        float: none;
    }
    .navbar-nav>li>a {
        padding-top: 10px;
        padding-bottom: 10px;
    }
    .collapse.in{
      display:block !important;
  }
  
  .nav > li > a.active {
    border-bottom: none;
    color: #f5da24;
  }
  
  .nav > li > a, .nav > .open > a {
    background: #222;
    color: #fff;
    border: none;
  }

  .nav > li > a:hover, .nav > .open > a:hover { 
    border-bottom: none;
    background: #222;
    color: #f5da24;
  }
  
  .dropdown-menu {
    padding: 0;
  }
  
  .dropdown-menu > li > a {
    color: #fff;
     background: #222; 
  }
  .dropdown-menu > li > a:hover,
  .dropdown-menu > li > a:focus {
    color: #f5da24;
    text-decoration: none;
  }
  .dropdown-menu > .active > a,
  .dropdown-menu > .active > a:hover,
  .dropdown-menu > .active > a:focus {
    color: #fff;
    text-decoration: none;
    background-color: #337ab7;
    outline: 0;
  }
  
  .navbar-right {
    margin-left: -15px;
  }
  
  #c68 {
    display: none;
  }
  
  .tabs-v .tab .content { 
  height: auto;  
  }

  .tabs-v .tab .header { 
    height: auto;
  }
}

hr {
  margin-top: 20px;
  margin-bottom: 20px;
  border: 0;
  border-top: 1px solid #ccc;
}

@media (max-width: 500px) {
  main .container {
    padding: 25px 25px;
    padding-bottom: 25px;
  }
  
  main {
    margin-top: 25px;
  }
  
  .tabs-v .tab {
    width: 100%;
    text-align: justify;
  }
  
  .tabs-v .tab .pic img {
    max-width: 100%;
    height: auto;
  }
}

@media (max-width: 992px) {
  #c28 {
    text-align: center;
  }
}