/*
Theme Name: Knorkator
Description: Knorkator Childtheme based on Sparkling
Author: Elmar Becker
Author URI: http://www.trueunity.de
Template: sparkling
Version: 1.2

1.  Fonts
2.  Basic Settings
2.1  Headlines
2.2  Header
3.  Menüs
3.1  Allgemein
3.2  Main Menü
3.3  Footer Menü
3.4  Social Media Menü
4.  Content Area
4.1  Allgemeines
4.2  News
4.3  Konzerte - Termine
4.4  Videoeinbindung
4.5  Presse - Veranstalter
4.6  Download
5.  Formulare
5.1  Kontakt
5.2  Login
6.  Specials
6.1  Cookie Banner

7.   Media Queries
7.1  min-width: 375px - IPhone 6,7+ Portrait
7.2  max-width: 568px and orientation: landscape - 320 Landscape
7.3  max-width: 667px and orientation: landscape - IPhone 6,7+ - 375 Landscape
7.4  min-width: 768px - IPad Portrait
7.5  min-width: 820px - IPad Pro Portrait
7.6  min-width: 1024px - IPad Landscape
7.7  max-width: 1200px - Large Screens
7.8  min-width: 1201px - Large Screens
*/



/* ----------- Fonts ----------- */
@font-face {
    font-family: 'erasdust';
    src: url(inc/fonts/erasdust.ttf);
    font-style: normal;
}
@font-face {
    font-family: 'eraser';
    src: url(inc/fonts/eraser.ttf);
    font-style: normal;
    font-size: 100%;
}
@font-face {
    font-family: 'knorkatorsams';
    src: url(inc/fonts/knorkatorsams.ttf);
    font-style: normal;
    font-size: 100%;
}
@font-face {
    font-family: 'fontawesome-solid';
    src: url("inc/fonts/fa-solid-900.ttf") format("truetype");
    font-style: normal;
    font-weight: 900;
    font-display: block;
}
.fa,
.fas {
    font-family: 'fontawesome-solid';
    font-weight: 900;
}
@font-face {
    font-family: 'fontawesome-brands';
    src: url("inc/fonts/fa-brands-400.ttf") format("truetype");
    font-style: normal;
    font-weight: 400;
    font-display: block;
}
.fab {
    font-family: 'fontawesome-brands';
    font-weight: 400;
    font-size: 1.5em;
    color: #FFFFFF;
}


/* ----------- Basic Settings ----------- */
* {
    padding: 0;
    margin: 0;
}
.clearfix::after {
    content: "";
    clear: both;
    display: table;
}
html {
    font-size: 100%;
    min-height: 101%;
    scroll-behavior: smooth;
}
body {
    font-family: Helvetica, Arial, sans-serif;
    background-color: #00FFFF;
    font-size: 100%;
    margin: 0;
}
#page {
    max-width: 1024px;
    margin: 0 auto;
}
.col-md-8 {
    width: 94%;
    padding: 0;
}
header {
    margin-bottom: 0 !important;
}

/* Links allgemein */
a {
    line-height: 1.8em;
}
a, a:link, a:visited, a:active, a:focus {
    text-decoration: none !important;
}
a:hover, h2 > a:hover {
    text-decoration: underline;
}
img {
    max-width: 100%;
    height: auto;
}

/* Headlines */
h1 {
    font: normal 1.15rem "knorkatorsams", sans-serif;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    text-align: center;
    margin: 0;
    color: #29b5f5;
}
/*Veranstalter small sizes*/
.page-id-40 h1 {
    font: normal 0.9rem "knorkatorsams", sans-serif;
}
h2, .h2 {
    font: normal 1.025rem "knorkatorsams", sans-serif;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    margin: 0;
    color: #29b5f5;
}
h3, .h3, .wrapper-post > h3 {
    font: normal 0.95rem Helvetica, Arial, sans-serif;
    color: #FFFF00 !important;
    margin: 15px 0;
}

.wrapper-post > h3 {
	display: none;
}
div[id*="navi"]

p  {
    font-size: 0.8rem;
    font-weight: normal;
    line-height: 1.5em;
}
#content-pages > h1 {
    margin: -10px 0 20px 0;
}
#news h2,
#termine h2,
h2#datenschutz {
    margin: 20px 0;
}
h3#material {
    margin: 20px 0 5px 0;
}


/* ------------ Header ------------ */
#logo {
    margin: 10px 0 5px 0;
}
#logo img {
    float:left !important;
    height: 22px;
    width: auto;
}
#dmbdw  {
    font: normal 0.8325rem "erasdust", sans-serif;
    text-transform: uppercase;
    text-align: center;
    letter-spacing: 0.1em;
    color: #FF0000;
    font-size: 4.23vw ;
}
#title {
    font: normal 1.855rem/0.6em "knorkatorsams", sans-serif;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    text-align: center;
    padding: 5px 0 0 5px;
    font-size: 9.32vw;
}


/* ------------  Menüs ------------ */
/* Allgemein */
.collapse, .navbar-collapse {
    display: block ;
}
.navbar-default .navbar-collapse {
    border-top: 0;
}
.navbar-collapse {
    padding-right: 0;
    padding-left: 0;
   /* border-bottom: 1px solid #29b5f5 !important;*/
}
.navbar.navbar-default {
    max-width: 92%;
    margin: 0 auto;
    padding: 0;
}
.navbar-default {
   border-color: transparent;
}
.navbar-default > .container{
    padding-right: 0;
    padding-left: 0;
}
.navbar-fixed-bottom, .navbar-fixed-top {
    position: inherit;
}
.navbar-nav > li {
    display: inline;
    padding: 0;
}
.nav::after,
.nav::before  {
    content: none;
}
.nav > li > a {
    display: inline;
    padding: 10px 0 !important;
}
.navbar-default .navbar-nav > .active > a,
.navbar-default .navbar-nav > .active > a:focus,
.navbar-default .navbar-nav > .active > a:hover {
    background-color: transparent;
}

/* Main Menu */
#menu-mainmenu {
    display: inline-flex;
    justify-content: space-between;
    list-style: none;
    width: 100%;
    margin: 50px 0 30px 0;
    padding: 0 5px;
}
#menu-mainmenu a, #social-media-menu a {
    font-size: 0.8rem;
    text-decoration: none;
    padding: 0 0 3px 0;
}

/* Footer */
#footer-area {
    border-top: 1px solid #29b5f5;
    margin: 0 0 0 15px;
    max-width: 90%;
}
.site-info {
    padding: 0 5px;
}
#colophon {
    padding: 0;
}
#menu-footermenu {
    list-style: none;
    width: 100%;
    padding: 5px 15px 0 15px;
}
#menu-footermenu li {
    padding: 0 10px;
}
#menu-footermenu a {
    font-size: 0.65rem;
    text-decoration: none;
    margin: 0 0 0 0;
    line-height: 0.8em;
}
#menu-footermenu a:focus {
    color: #FFFF00;
}
.scroll-to-top {
    background: #000;
    color: #29b5f5;
    font-size: 18px;
    line-height: 32px;
    width: 35px;
    height: 35px;
    float: right;
    right: 4%;
    bottom: 14%;
    border: 1px solid  #29b5f5;
}
.scroll-to-top:hover,
.scroll-to-top:focus {
    background: #000;
    opacity: .8;
}

/* Social Media Menu */
#social-media-menu > ul {
    list-style: none;
    line-height: 1.5em;
    text-align: right;
    width: 100%;
    padding: 0 0 2px 0;
}
#social-media-menu > ul > li {
    display: inline;
    font-size: 0.7125rem;
    padding: 0 4px;
}
#social-media-menu > ul > li:last-child {
    padding: 0 0 0 6px;
}
.fa-amazon { font-size: 1.6em; }
.fa-youtube { font-size: 1.7em; }



/* ----------- Content Area -----------  */
.main-content-area {
    margin-top: 20px;
}

/* Ticketshop Link */
.top-section {
    font: normal 0.675em "knorkatorsams", sans-serif;
    letter-spacing: 0.15em;
    text-decoration: none;
    text-align: center;
    padding: 0;
    margin: 10px 0 0 0;
	display: none;
}
h1#ticketshop a {
    /*color: #29b5f5;
	color: #F00;*/	
}
h1#ticketshop > a:hover {
    color: #29b5f5;
    text-decoration: underline;
}


/* News */
.wrapper-post {
    margin: 10px 0 40px 0;
}
#news a {
    line-height: 1.8em;
}
#news a:link,
#news a:active,
#news a:visited,
#news a:focus {
    color: rgba(255, 255, 000, 1);
}
#news a:hover {
    color: rgba(255, 255, 000, 1);
    text-decoration: underline;
}

/* Konzerte Termine */
.konzerte {
    font-size: 0.75rem;
    min-height: auto;
    margin: 0 0 1.25em 0;
}
.terminfelder {
    display: inline-block;
    margin: 0 0 0 0;
}
.col3, .col4 {
    display: none;
}
.row3-termine {
    padding: 0 0 0 80px;
}
.terminfelder.datum {
    min-width: 80px;
}
.terminfelder.ort {
    font-weight: bold;
    color: #29b5f5;
    max-width: 140px;
    vertical-align: top;
}
.terminfelder.locationlink {
    min-width: 140px;
}
.locationlink a {
    color: #FFF;
}
.terminfelder.zusatzinfo {
    font-size: 85%;
    line-height: 1.3em;
    min-width: 180px;
}
.terminfelder.tour {
    font-size: 85%;
}
.terminfelder.ticket {
    float: right;
    clear: right;
    margin: 0;
    color: rgba(255, 130, 50, 1);
}
.terminfelder.ticket a {
    color: rgba(255, 130, 50, 1);
}
.terminfelder.soldout {
    float: right;
    clear: right;
    margin: 0;
    color: rgba(255, 255, 000, 1);
}


/* Videoeinbindung */
#video {
    padding: 0;
}
#video iframe {
    width: 100%;
    height: auto;
    margin: 0;
}
#video figure {
    margin: 0 0 -7px 0;
}
#h5vp_player .h5vp_player {
    border: 1px solid #FFF;
}

/* Presse - Veranstalter */
.kontaktinfos {
    margin: 30px -15px 0 0;
}

/* Downloads */
ul.jqueryFileTree {
    font-family: Helvetica, Arial, sans-serif !important;
    font-size: 0.8em !important;
    margin: 0 0 30px 0 !important;
}
ul.jqueryFileTree li {
    margin: 0 0 0 5px !important;
    white-space: inherit !important;
    font-size: 1em !important;
}
ul.jqueryFileTree li a {
    color: #FFFFFF;
}


/* ----------- Formulare ----------- */
/* Kontakt */
.wpcf7-form {
    margin: 40px 0 0 0;
}
label {
    font-weight: normal;
}
input, textarea {
    font-family: Helvetica, Arial, sans-serif;
    font-weight: normal;
    background-color: transparent;
    color: #FFFFFF !important;
    width: 100%;
    padding: 2px;
    margin: 2px 0 0 0;
    border-radius: 0 !important;
}
input {
    height: 2em;
}
input[type=checkbox] {
    width: auto;
    height: 1em;
}
input[type=submit] {
    background-color: transparent;
    font-weight: 600;
    letter-spacing: 1px;
    color: #FFF;
    width: auto;
    height: 2.35em;
    padding: 5px 10px;
    margin: 10px 0 0 0;
    border: 1px solid #FFF;
}
.wpcf7-checkbox .wpcf7-list-item {
    margin: 0 0 0 0;
}
.wpcf7-form p {
    white-space: normal !important;
}

/* Login */
.page-id-92 #content-pages > h1 {
    margin: 10px 0 20px 0;
}
.page-id-92 .main-content-area {
    margin: 0 0 70px 0;
}
.um-form {
    margin: 0 -15px 0 0;
}
.um-field-label label {
    font-size: 0.85rem;
    font-weight: normal;
    display: block;
    margin: 0 0 -2px 0;
}
.um-form-field {
    font-size: 0.9em;
    color: #FFFFFF !important;
    width: 95%;
    padding: 2px;
    border-radius: 0 !important;
}
.um-field-password {
    margin: 10px 0 0 0;
}
/* sende btn */
.um-center {
    text-align: center;
    margin: 10px 0 0 0;
}
#logoutbtn {
    background-color: transparent;
    letter-spacing: 1px;
    text-transform: uppercase;
    display: block;
    width: 85px;
    height: 2.35em;
    padding: 4px 10px 7px 10px;
    margin: 30px 0 0 0;
    border: 1px solid #FF8232 ;
}
#logoutbtn a {
    color: rgb(255,130,50);
}


/* ----------- Specials ----------- */
/* Cookie Banner */
#cookie-law-info-bar {
    position: none;
    left: none;
    text-align: center;
    width: 100%;
    z-index: 9999;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 auto;
    padding: 0 0;
    line-height: 1.3em;
}
.cli-bar-container {
    width: 105%;
    float: none;
    margin: 0 auto;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    justify-content: center;
    -webkit-box-align: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
    padding: 0;
}
.cli-style-v2 .cli-bar-message {
    width: 100%;
    text-align: left;
    font-size: 90%;
    margin: 0 20px 0 0;
}
.cli-plugin-button, .cli-plugin-button:visited {
    padding: 12px 12px;
    margin-left: 0;
    border: 1px solid #FFFFFF;
}

/* Preview Beiträge */
.post-inner-content {
    background-color: #000 !important;
    border: none !important;
}


/**** ------ MEDIA QUERIES ----------------- ****/
/**** ------ MEDIA QUERY 375px ----------------- ****/
@media screen and (min-width: 375px) {
#title {
    padding: 5px 0 0 5px;
 }
.page-id-40 h1 {
    font: normal 1rem "knorkatorsams", sans-serif;
 }
.top-section {
    margin: 20px 0 30px 0;
 }
#content-pages figure {
    margin: 0 0 40px 0;
 }
.terminfelder.zusatzinfo {
    min-width: 180px;
    max-width: 200px;
 }
.terminfelder.tour {
    min-width: 120px;
 }

#video iframe {
    width: 99%;
 }

/* Login */
.page-id-92 .main-content-area {
    margin: 0 0 140px 0;
 }
.um-form-field {
    width: 108%;
    margin: 5px auto;
 }
}


/**** ------ MEDIA QUERY 414px XR ----------------- ****/
@media screen and (min-width: 414px) {
.terminfelder {
    font-size: 100%;
 }
.terminfelder.locationlink {
    min-width: 230px;
 }
.terminfelder.zusatzinfo {
    font-size: 90%;
    min-width: 230px;
 }
}


/**** ------ MEDIA QUERY 568px - 320-landscape ----------------- ****/
@media screen and (max-width: 568px) and (orientation: landscape) {
 #menu-mainmenu {
    margin: 70px 0 20px 0;
 }

/* Konzerte Termine */
.col4 {
    display:none;
 }
.terminfelder.ort {
    min-width: 90px;
    max-width: 90px;
    margin: 0 20px;
 }
.terminfelder.locationlink.col3 {
    display: inline;
 }
.terminfelder.zusatzinfo.col3 {
    font-size: 100%;
    display: block;
    min-width: 300px;
    margin: 0 0 0 210px;
 }
.terminfelder.tour.col3 {
    font-size: 100%;
    max-width: 300px;
    display: block;
    margin: 0 0 0 210px;
 }
}


/**** ------ MEDIA QUERY 667px - 375-landscape ----------------- ****/
@media screen and (max-width: 667px) and (orientation: landscape) {
 #menu-mainmenu {
    margin: 70px 0 20px 0;
 }
.col4 {
    display:none;
 }
    #footer-area {
        max-width: 95%;
    }
.row3-termine {
    display:none;
 }
.terminfelder.ort {
    min-width: 90px;
    max-width: 90px;
    margin: 0 20px;
 }
.terminfelder.locationlink.col3 {
    display: inline;
 }
.terminfelder.zusatzinfo.col3 {
    font-size: 100%;
    display: block;
    min-width: 300px;
    margin: 0 0 0 210px;
 }
.terminfelder.tour.col3 {
    font-size: 100%;
    max-width: 300px;
    display: block;
    margin: 0 0 0 210px;
 }
}


/**** ------ MEDIA QUERY 768px ----------------- ****/
@media screen and (min-width: 768px) {
h1, .h1 {
    font: normal 1.7rem "knorkatorsams", sans-serif;
 }
.page-id-40 h1 {
    font: normal 1.7rem "knorkatorsams", sans-serif;
 }
h2, .h2 {
    font: normal 1.5rem "knorkatorsams", sans-serif;
 }
h3, .h3, .wrapper-post > h3 {
    font: normal 1.3rem Helvetica, Arial, sans-serif;
    margin: 20px 0;
 }
p {
    font-size: 1rem;
 }
.container {
    width: auto !important;
 }
.main-content-area {
    min-height: 520px;
 }
#logo {
    margin: 15px 0 10px 0;
 }
#logo img {
    height: 40px;
    width: auto;
 }
#dmbdw  {
    font-size: 2.125rem;
    margin: 15px 0 10px 0;
 }
#title {
    font-size: 4.825rem;
 }

.navbar.navbar-default {
    max-width: 100%;
 }
.navbar-default > .container{
    padding-right: 15px;
    padding-left: 15px;
 }
.navbar-header {
    float: none;
 }
.navbar-nav > li {
    padding: 0 12px 0 7px;
 }
#menu-mainmenu {
    margin: 50px 0 30px 0;
    padding: 50px 5px 0 5px;
 }
#menu-mainmenu a {
    font-size: 1.125rem;
 }

#footer-area {
    margin: 0 15px;
    max-width: 98%;
 }
#menu-footermenu {
    display: inline-flex;
    justify-content: space-between;
    list-style: none;
    width: 100%;
    padding: 15px 0 0 0;
 }
#menu-footermenu a {
    font-size: 0.9rem;
 }

#social-media-menu > ul {
    padding: 7px 0 2px 0;
 }
#social-media-menu a {
    font-size: 1.225rem;
 }
#social-media-menu > ul > li {
    padding: 0 6px;
 }

.fa-amazon {
    font-size: 1.5em;
 }
.fa-youtube {
    font-size: 1.65em;
 }

.col-md-8 {
    width: 95%;
 }

/* Konzerte Termine */
.konzerte {
    font-size: 1rem;
 }
.row3-termine {
    display:none;
 }
.terminfelder.datum {
    margin: 0 10px 0 0;
 }
.terminfelder.ort {
    min-width: 140px;
    margin: 0 20px;
 }
.terminfelder.locationlink.col3 {
    display: inline;
    margin: 0 0 0 10px;
 }
.terminfelder.zusatzinfo.col3 {
    font-size: 100%;
    display: block;
    min-width: 400px;
    margin: 0 0 0 280px;
 }
.terminfelder.tour.col3 {
    font-size: 100%;
    max-width: 300px;
    display: block;
    margin: 0 0 0 280px;
 }

#video iframe {
    width: 110%;
    height: 400px;
    margin: 0;
 }

input {
    width: 165%;
 }
textarea {
    width: 163%;
 }

/* Login */
.page-id-92 .main-content-area {
    margin: 0 0 80px 0;
 }
.um-88.um {
    margin: 0 auto;
 }
.um-field-label label {
    font-size: 1rem;
 }
.um-form-field {
    font-size: 1.1em;
    width: 95%;
 }
#logoutbtn {
    font-size: 1.1em;
    width: 103px;
    height: 2.35em;
    padding: 4px 10px;
 }


ul.jqueryFileTree {
    font-size: 1em !important;
    margin: 0 15px !important;
 }
UL.jqueryFileTree LI {
   /* font-size: 1.125em !important;*/
 }
}


/**** ------ MEDIA QUERY 820px ----------------- ****/
@media screen and (min-width: 820px) {
#dmbdw  {
    font-size: 2.275rem;
 }
#title {
    font-size: 5.155rem;
    text-align: center;
 }
#footer-area {
    margin: 40px 15px 0 15px;
    max-width: 98%;
 }
}


/**** ------ MEDIA QUERY 1024px ----------------- ****/
@media screen and (min-width: 1024px) {
#dmbdw  {
    font-size: 2.855rem;
 }
#title {
    font-size: 6.495rem;
    text-align: center;
 }
.page-id-92 .main-content-area {
    min-height: 0;
    padding: 0 0 50px 0;
 }
#menu-mainmenu {
    margin: 130px 0 30px 0;
    padding: 0 5px 0 5px;
 }

/* Footer Navigation */
.col-md-6 {
    width: 100%;
 }
#footer-area {
    width: 97%;
 }
#menu-footermenu {
    display: inline-flex;
    justify-content: space-between;
    list-style: none;
    width: 100%;
    padding: 15px 0 0 0;
 }
.terminfelder.zusatzinfo.col3 {
    display: none;
 }
.terminfelder.zusatzinfo.col4 {
    display: inline;
 }

#video iframe {
     width: 99.8%;
 }
}