@font-face {
    font-family: 'ArrrowsRegular';
    src: url('arrrows-regular-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}
* {
    margin:0;
    padding:0;
}
body, p, input, textarea {
    font-family: 'Vollkorn', serif;
    font-style:italic;
    font-weight:400;
    line-height:1.8em;
    letter-spacing:.03em;
}
body { background:#DFCBBD; }

a { color:#777; }
h1, h2, h3, h4, h5, h6 {
    margin:0;
    padding:0;
    font-size:1.2em;
    line-height:3;
}
h1 {
    text-transform:uppercase;
    text-align:center;
    font-style:normal;
    font-weight:400;
    letter-spacing:.26em;
    font-size:2.6em;
    line-height:2em;
}
h2, h3, h4, h5, h6, header li a, .ps-caption-content, legend {	
    text-transform:uppercase;
    font-family: 'Lato', sans-serif;
    font-style:normal;
}
h6 {
    line-height:1.75em;
}

strong {
    font-weight:normal;
}

header {
    text-align:center;
    color:#fff;
    background:url(img/buehne-06.jpg) 35% 25% no-repeat;
    padding:100px 0 0;
}

header h1 {
    line-height:1.25;
    padding:.55em 0 .55em 46%;
    -moz-text-shadow: 0px 0px 5px #000, 0px 0px 50px #000, 0px 0px 20px #f00;
    -webkit-text-shadow: 0px 0px 5px #000, 0px 0px 50px #000, 0px 0px 20px #f00;
    text-shadow: 0px 0px 5px #000, 0px 0px 10px #000, 0px 0px 20px #f00;
}
header h3 {
    font-size:.9em;
    letter-spacing:.15em;
    color:#fff;
    line-height:1;
    padding:0 0 0 46%;
    -moz-text-shadow: 0px 0px 5px #000, 0px 0px 50px #000, 0px 0px 20px #f00;
    -webkit-text-shadow: 0px 0px 5px #000, 0px 0px 50px #000, 0px 0px 20px #f00;
    text-shadow: 0px 0px 5px #000, 0px 0px 10px #000, 0px 0px 20px #f00;
}
blockquote cite { 
    font-size:.74em;
    text-transform:uppercase;
    letter-spacing:.1em;
    font-style:normal;
}
nav ul {
    background:rgba(50,0,0,.2);
    margin:180px 0 0 0;
    border-top:2px solid rgba(217,180,180,.35);
}
nav ul li {
    display:inline-block;
}
nav ul li + li {
    padding-left:1.5em;
}
nav a {
    display:block;
    text-decoration:none;
    color:#fff;
    font-size:.85em;
    font-weight:700;
    letter-spacing:.09em;
    line-height:50px;
}
nav a:hover { text-decoration:underline; }

#topscroller {
    position: fixed;
    bottom: 0px;
    right: 0px;
    margin: 20px;
    font-weight: normal; 
    font-size: 30px;
    font-style: normal;
    font-family: 'ArrrowsRegular';
}
#topscroller a {
    text-decoration: none;
}

#wrapper {
    text-align:center;
    max-width:1280px;
    margin:0 auto;

}

article p, #konzerte strong, #konzerte small { line-height:20px; }

#konzerte strong {
    display:inline-block;
    width:30%;
    padding-right:2%;
    padding-bottom:2em;
    text-align:right;
    vertical-align:top;
}
#konzerte strong span { display:block; }
#konzerte {
    font-size:0;
    background:#fff;
    margin:0 auto;
}
#konzerte article {
    vertical-align:bottom;
    text-align:left;
    font-size:14px;
    margin:0 auto;
    min-height:100px;
    padding:2% 2%;
    display:block;
    width:80%;
    border-top:2px solid #f0f0dd;
}
#konzerte h2 {
    color:#ccb295;
    font-size:40px;
    line-height:4em;
    letter-spacing:.03em;
}
#konzerte h3 {
    letter-spacing:.05em;
    line-height:1.5em;
    display:inline-block;
    vertical-align:top;
    width:30%;
}
#konzerte p {
    display:inline-block;
    width:34%;
    vertical-align:top;
    padding-bottom:2em;
}
#konzerte article small {
    display:inline-block; 
    color:#666;
    line-height:1.5em;
    text-align:right;
    vertical-align:bottom;
    width:99%;
}

#vita h2 {
    color:#fff;
    font-size:2em;
}
#vita article {
    padding:6%;
    background:#ffdfba;
    /* #d9b4b4; */
}
#vita p {
    margin:0 auto;
    max-width:33em;
    line-height:1.75em;
}
@media all and (min-width:840px) {
    #vita article {
        margin-left:50%;
    }
    #vita { 
        background:url(anano_05.jpg) -300px 0% no-repeat #ababab;
    }
}

#medien {	
    padding:3% 3%;
    background:#fff;
}
#medien article {
    clear:both;
    padding:6em 0 0 0;
}
#medien h3 {
    line-height:2.5em;
    color:#d9b4b4;
}
#medien h3 { font-size:4em; }
#medien h5 { font-size:1em; }
#medien .karneval { max-width:75%; margin-left:auto; margin-right:auto; }
#medien .karneval img { width:100%; }
#medien .karneval div { float:left; width:40%; padding-right:2em; }
#medien .karneval h4 {line-height: 1.4em;margin: 1em auto 1em auto; padding-top:10%; }

#Gallery li {
    margin:0;
    padding:0;
    font-size:0;
    line-height:0;
    list-style: none;
}

#Gallery li {
    width:29%;
    padding:2%;
    display:inline-block;
}
#Gallery li a img { width:100%; }

#press {
    text-align:left;
    margin: 0 2.2% 0 2.2%;
}
#press blockquote {
    line-height:1.6em;
    font-size:1.5em;
    color:#fff;
    letter-spacing:.04em;
}
#press blockquote cite { display:block; text-align:right; margin-top:1em; }
#press li {
    color:#fff;
}
#press h5 {
    text-align:center;
}
#press .carousel, #press section {
    background:#c9a4a4;
    color:#fff;
}
#press section {
    font-size:.8em;
    padding:5% 15%;
}

.soundcloud {
    margin: 40px 0 0 0;
}

@media all and (max-width:460px) {
    header {
        font-size:.83em;
        background:url(img/buehne-06_mobile.jpg) 40% center no-repeat;
        padding-top:50px;
    }
    #konzerte article { height:auto; }
    #konzerte { padding-bottom:2em; vertical-align:middle; }
    #konzerte h3 { width:100%; }
    #konzerte strong {
        padding-top:1em;
        display:block;
        width:100%;
        text-align:left;
    }
    #konzerte p {
        vertical-align:top;
        display:block;
        width:100%;
    }
    #medien .karneval div {float:none; width:100%;}
}


.carousel{
    overflow:hidden;
    margin:3% auto;
    position:relative;  
}
.panes{
    list-style:none;
    position:relative;
    width:500%; /* Number of panes * 100% */
    overflow:hidden; /* This is used solely to clear floats, it does not add functionality. */

    -webkit-animation:carousel 50s infinite;
    -moz-animation:carousel 50s infinite;
    animation:carousel 50s infinite;
}
.panes > li {
    position:relative;
    float:left;
    width:20%; /* 100 / number of panes */
}
.carousel blockquote {
    padding:15%;
    width:70%;
    max-width:100%;
}

@-moz-keyframes carousel{
    0%    { left:0; }
11%   { left:0; }
12.5% { left:-100%; }
23.5% { left:-100%; }
25%   { left:-200%; }
36%   { left:-200%; }
37.5% { left:-300%; }
48.5% { left:-300%; }
50%   { left:-400%; }
61%   { left:-400%; }
62.5% { left:-300%; }
73.5% { left:-300%; }
75%   { left:-200%; }
86%   { left:-200%; }
87.5% { left:-100%; }
98.5% { left:-100%; }
100%  { left:0; }
}

@-webkit-keyframes carousel{
    0%    { left:0; }
11%   { left:0; }
12.5% { left:-100%; }
23.5% { left:-100%; }
25%   { left:-200%; }
36%   { left:-200%; }
37.5% { left:-300%; }
48.5% { left:-300%; }
50%   { left:-400%; }
61%   { left:-400%; }
62.5% { left:-300%; }
73.5% { left:-300%; }
75%   { left:-200%; }
86%   { left:-200%; }
87.5% { left:-100%; }
98.5% { left:-100%; }
100%  { left:0; }
}

@keyframes carousel{
    0%    { left:0; }
11%   { left:0; }
12.5% { left:-100%; }
23.5% { left:-100%; }
25%   { left:-200%; }
36%   { left:-200%; }
37.5% { left:-300%; }
48.5% { left:-300%; }
50%   { left:-400%; }
61%   { left:-400%; }
62.5% { left:-300%; }
73.5% { left:-300%; }
75%   { left:-200%; }
86%   { left:-200%; }
87.5% { left:-100%; }
98.5% { left:-100%; }
100%  { left:0; }
}

#kontakt strong, #kontakt span {
    display:block;
}


@media all and (max-width:1000px) {
    /*
    header {
            padding-top:240px;
            background:url(img/buehne-04_mobile.jpg) 20% top no-repeat;
    }
    header nav ul {
            margin-top:40px;
            font-size:.8em;
    }
    */
    #vita { 
        background:url(anano_05.jpg) -300px 0% no-repeat #ababab;
    }
}
/*
@media all and (max-width:745px) {
        nav { padding-top:22px; }
        nav a {
                color:#b77;
                text-decoration:underline;
        }
}
*/


#impressum small {
    font-size:.65em;
    color:#522;
    text-align:left;
}
#impressum h6 { font-size:8px; text-align:left; margin-top:10em; }
#kontakt h4 { line-height:10em; }
#kontakt form {
    width:49%;
    vertical-align:top;
    display:inline-block;
    text-align:left;
}
#kontakt div {
    width:49%;
    vertical-align:top;
    display:inline-block;
    font-size:1.2em;
    line-height:1.4em;
    color:rgba(0,0,0,.8);
}

input, textarea {
    border:none;
    margin:3px;
    padding:10px;
    font-size:1.2em;
    width:60%;
}
textarea {
    width:90%;
    margin-bottom:1em;
}
label {
    display:block;
    padding-top:1em;
    text-transform:uppercase;
    font-size:.8em;
    color:#511;
    padding-left:3px;
}
fieldset {
    margin:1em;
}
#impressum { padding:5em; }
@media all and (max-width:850px) {
    input, textarea { width:92%; }
    #kontakt form { width:92%; margin:0 auto 5em auto; }
    #kontakt div { font-size:1.25em; width:90%; display:block; margin:0 auto 2em auto; }
}