/* ----- 	Reset    ----- */

* {
    margin: 0;
    padding: 0;
}

.invisible {
    display: none;
}


/* ----- 	Layout    ----- */

html {
    max-width: 1500px;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}

.ce_text, .ce_headline, .ce_player, .event h3, .event p {
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
}

.mod_navigation ul, .twocol .centerer, .topline .centerer, .ce_gallery {
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
}

#header .centerer {
	padding: 0;
}

.mod_article, #logo {
	padding: 20px 3% 1.6%;
}

.mod_article.first:not(#fusszeile) {
    padding-top: 28px;
}

.topline.mod_article {
    padding-top: 0;
    padding-bottom: 0;
    margin-top: -14px;
}

.topline .centerer {
    padding: 22px 0 2px;
    border-top: 1px solid rgba(255,255,255,0.35);
}


/* -----    Header    ----- */

#header {
    position: relative;		/* reference point for logo */
	background-image: url(_DSC4573_2end_1500x940.jpg);
    background-repeat: no-repeat;
}

.ensembles #header {
    background-image: url(../img/_DSC4573_2end_b_1500x940.jpg);
}

/*.bio #header {
    background-image: url(../img/_DSC4872_3_1500x940.jpg);
}*/

.termine #header {
    background-image: url(../img/_DSC4671_5_1500x940.jpg);
}

.fotos #header {
    background-image: url(../img/_DSC4428_3end_1500x940.jpg);
}

.kontakt #header {
    background-image: url(../img/_DSC4864_4b_1500x940.jpg);
}

@media (min-width: 1500px) {
    body:not(.android):not(.ios) #header {
        background-attachment: fixed;
    }
}

@media (max-width: 1499px) {
    #header {
        height: 140px;
    }

    body:not(.sf6):not(.sf7) #header {
        height: 40vh;
    }

	#header {
    	padding-top: 20%;
    	background-size: cover;
    	background-position: 100% 30%;
    	transition: all 1s ease 0s;
	}

    .ensembles #header {
        background-position: 60% 70%;
    }

    /*.bio #header {
        background-position: 100% 80%;
    }*/

    .termine #header {
        background-position: 70% 30%;
    }

    .fotos #header {
        background-position: 90% 40%;
    }

    .kontakt #header {
        background-position: 20% 90%;
    }
}

@media (min-width: 1500px) {
	#header {
		height: 650px;
		padding-top: 0;
        background-size: 1500px;
        background-position: 50% -60px;
	}

    .ensembles #header {
        background-position: 50% -170px;
    }

    ./*bio #header {
        background-position: 50% -210px;
    }*/

    .termine #header {
        background-position: 50% -80px;
    }

    .fotos #header {
        background-position: 50% -110px;
    }

    .kontakt #header {
        background-position: 50% -220px;
    }
}


/* -----    Logo    ----- */

#logo {
    position: absolute;
    width: 94%;
    bottom: 4%;
}

#logo h1, #logo h2 {
	color: #fff;
	text-align: center;
}

#logo h1 {
	font-size: 87px;
    line-height: 1;
    /*word-spacing: 0.1em;*/
    text-shadow: 0px 1px 0.5em rgba(0,0,0,0.9);
}

@media (max-width: 1000px) {
    #logo h1 {
        font-size: 9.3vw;
        font-size: calc(8.4vw + 3px);
    }
}

#logo h2 {
	font-size: 25px;
    display: none;
}


/* -----    Navi    ----- */

.mod_navigation {
    font-size: 22px;
    line-height: 2;
    padding: 6px 0 10px;
}

@media (max-width: 1000px) {
    .mod_navigation {
        font-size: 17px;
        font-size: calc(0.7vw + 15px);
    }
}

.mod_navigation li {
    display: inline-block;
    list-style-type: none;
    margin-left: 3%;
    margin-right: 3%;
}

.mod_navigation li.active, .mod_navigation li.trail {
    opacity: 0.5;
}

.mod_navigation a {
    text-decoration: none;
    border-bottom: 1px none;
    transition: 0.2s;
}

.mod_navigation a:hover, .mod_navigation a:focus {
    border-bottom: 1px solid;
}

/* -----    2 Columns    ----- */

.twocol .ce_text {
    padding-bottom: 2%;
}

@media (min-width: 660px) {
    .twocol .centerer {
        font-size: 1px;
        word-spacing: 80px;		/* for IE8 */
        word-spacing: 5vw;
        max-width: 1200px;
    }

    .safari .twocol .centerer {
        padding-right: 5vw;
    }

    .twocol .ce_text {
        display: inline-block;
        width: 43%;
        vertical-align: text-top;
        word-spacing: 0.01em;
    }
}


/* -----    Events    ----- */

.mod_eventlist {
    padding-bottom: 22px;
}

.mod_eventlist .event {
    padding-top: 26px;
    padding-bottom: 6px;
}

.event p {
    padding-bottom: 0;
}

.ce_text p:last-child {
    padding-bottom: 11px;
}

.pagination {
    padding-top: 20px;
}

.pagination p, #container .pagination li.next, #container .pagination li.previous, #container .pagination li.last, #container .pagination li.first {
    display: none;
}

.pagination li {
    display: inline-block;
    margin-left: 10px;
    margin-right: 10px;
    margin-top: 20px;
}

.pagination li .current {
    border: 1px solid;
}

.pagination li .current, .pagination li a {
    display: inline-block;
    width: 28px;
    height: 28px;
    text-align: center;
    font-size: 13px;
    line-height: 28px;
    border-radius: 50%;
}

.pagination li a {
    text-decoration: none;
    letter-spacing: 0;
}


/* -----    Scroll-Gallery    ----- */

/*.mod_article.gallery {
    padding: 0;
}

.gallery .centerer {
    max-width: 1500px;
    padding: 0;
    font-size: 0;
    line-height: 0;
    white-space: nowrap;
    overflow-x: scroll;
    -webkit-overflow-scrolling: touch;
    border-style: solid;
	border-width: 1px 0;
	border-color: #ddd;
}

.gallery li {
    list-style: none;
    display: inline-block;
}

@media (min-width: 851px) {
	.gallery li {
	    width: 30%;
	}
}

@media (max-width: 850px) {
	.gallery li {
	    width: 43%;
	}
}

.gallery img {
	width: 100%;
	height: 100%;
}

#cboxOverlay#cboxOverlay {
	background-color: #763a3b;
	opacity: 0.95 !important;
}

#cboxTitle, #cboxCurrent {
	display: none !important;
}*/


/* -----    Full Gallery    ----- */

.ce_gallery > ul {
    font-size: 0;
    line-height: 0;
}

.ce_gallery li {
    display: inline-block;
    padding: 0.3333%;
}

#cboxOverlay#cboxOverlay {
    background-color: #efeae7;
}

#cboxTitle, #cboxCurrent {
    display: none !important;
}


/* -----    Audioplayer    ----- */

.ce_player {
    padding-top: 22px;
    padding-bottom: 24px;
}

.mejs-audio {
	margin-top: 34px;
}

.mejs-container .mejs-controls {
	background: #65656E;
}

/*.mejs-container .mejs-controls div {
    font-family: encode_sanssemibold;
}*/


/* -----    Social Networks    ----- */

#facebook, #twitter, #youtube  {
    font-family: "JustVector";
    font-size: 20px;
    speak: none;
    font-style: normal;
    font-weight: normal;
    text-decoration: none;
    display: inline-block;
    margin-top: 6px;
    margin-left: 12px;
    margin-right: 12px;
    padding: 6px 7px;
    /* border: 2px solid rgba(255,255,255,0.45); */
    border-radius: 30px;
    background-color: #fff;
    color: #772048;
}

#facebook:before  {
    content: "\f125";
}

#twitter:before  {
    content: "\f182";
}

#youtube:before  {
    content: "\f194";
}

/* ----- 	Colors    ----- */

html {
    background-color: #211c18;
}

h1, h3, .pagination li .current {
    color: #690021;
}

.light, body.zebra #main .mod_article:nth-child(even), #main {
    background-color: #fff;
}

/* .dark, body.zebra #main .mod_article:nth-child(odd) {
    background-color: #efeae7;
} */

.tint, .tint a, .tint h1, .pagination li a {
    color: #fff;
}

.tint, .pagination li a,
.mejs-controls .mejs-time-rail .mejs-time-loaded {
    background: #690021;
}


/* ----- 	Typo    ----- */

html, h2, .mejs-container .mejs-controls div {
    font-family: encode_sanslight, sans-serif;
}

html, h2 {
    font-size: 17px;
    line-height: 1.25;
    letter-spacing: 0.01em;
}

.ce_text h2 {
    padding-top: 22px;
}

.smalltext, .twocol .ce_text, #fusszeile {
	font-size: 14px;
}

html, a {
    color: #1A1A1D;
}

a[href^="http://"]:not(.noicon):before, a[href^="https://"]:not(.noicon):before {
    font-size: 0.8em;
    -webkit-font-smoothing: antialiased;
    speak: none;
    font-style: normal;
    font-weight: normal;
    content: "\279E";       /* statt \2192 */
    letter-spacing: 0.1em;
}

p, .ce_gallery {
    padding-bottom: 22px;
}

strong, h1:not(.logo), h3 {
    font-family: encode_sanssemibold;
    font-weight: normal;
}

h1, h2, .mod_navigation {
	text-transform: uppercase;
	font-weight: normal;
}

h1 {
    font-size: 40px;
    line-height: 1.18;
    padding-top: 2.75%;     /* 22px bei 800px Breite */
    padding-bottom: 18px;
    letter-spacing: 0;
}

@media (max-width: 1000px) {
    h1 {
        font-size: 6vw;
        font-size: calc(2.4vw + 16px);
    }
}

.twocol h1, #fusszeile h1 {
    font-size: 28px;
    padding-bottom: 0;
    margin-bottom: -1px;
}

@media (max-width: 1000px) {
    .twocol h1, #fusszeile h1 {
        font-size: 6vw;
        font-size: calc(1vw + 18px);
    }
}

#fusszeile h1 {
    font-family: encode_sanslight;
}

.ce_text h2 ~ ul {
    padding-top: 11px;
}

h3 {
    font-size: 24px;
    line-height: 1.18;
}

.ce_text ul {
    padding-bottom: 22px;
}

.ce_text li {
    list-style-type: none;
    padding-bottom: 11px;
}

/*@font-face {
    font-family: "JustVector";
    src: url("..fonts/JustVector.eot");
    src: url("..fonts/JustVector.eot?#iefix") format("embedded-opentype"),
         url("..fonts/JustVector.woff") format("woff"),
         url("..fonts/JustVector.ttf") format("truetype"),
         url("..fonts/JustVector.svg#JustVector") format("svg");
    font-weight: normal;
    font-style: normal;
}*/

/* Generated by Font Squirrel (https://www.fontsquirrel.com) on April 11, 2016 */

/*@font-face {
    font-family: 'encode_sansblack';
    src: url('..fonts/encodesans-black-webfont.eot');
    src: url('..fonts/encodesans-black-webfont.eot?#iefix') format('embedded-opentype'),
         url('..fonts/encodesans-black-webfont.woff2') format('woff2'),
         url('..fonts/encodesans-black-webfont.woff') format('woff'),
         url('..fonts/encodesans-black-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'encode_sansbold';
    src: url('..fonts/encodesans-bold-webfont.eot');
    src: url('..fonts/encodesans-bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('..fonts/encodesans-bold-webfont.woff2') format('woff2'),
         url('..fonts/encodesans-bold-webfont.woff') format('woff'),
         url('..fonts/encodesans-bold-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'encode_sansextrabold';
    src: url('..fonts/encodesans-extrabold-webfont.eot');
    src: url('..fonts/encodesans-extrabold-webfont.eot?#iefix') format('embedded-opentype'),
         url('..fonts/encodesans-extrabold-webfont.woff2') format('woff2'),
         url('..fonts/encodesans-extrabold-webfont.woff') format('woff'),
         url('..fonts/encodesans-extrabold-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'encode_sansextralight';
    src: url('..fonts/encodesans-extralight-webfont.eot');
    src: url('..fonts/encodesans-extralight-webfont.eot?#iefix') format('embedded-opentype'),
         url('..fonts/encodesans-extralight-webfont.woff2') format('woff2'),
         url('..fonts/encodesans-extralight-webfont.woff') format('woff'),
         url('..fonts/encodesans-extralight-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}*/

@font-face {
    font-family: 'encode_sanslight';
    src: url('fonts/encodesans-light-webfont.eot');
    src: url('fonts/encodesans-light-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/encodesans-light-webfont.woff2') format('woff2'),
         url('fonts/encodesans-light-webfont.woff') format('woff'),
         url('fonts/encodesans-light-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

/*@font-face {
    font-family: 'encode_sansregular';
    src: url('..fonts/encodesans-regular.eot');
    src: url('..fonts/encodesans-regular.eot?#iefix') format('embedded-opentype'),
         url('..fonts/encodesans-regular.woff2') format('woff2'),
         url('..fonts/encodesans-regular.woff') format('woff'),
         url('..fonts/encodesans-regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'encode_sansmedium';
    src: url('..fonts/encodesans-medium.eot');
    src: url('..fonts/encodesans-medium.eot?#iefix') format('embedded-opentype'),
         url('..fonts/encodesans-medium.woff2') format('woff2'),
         url('..fonts/encodesans-medium.woff') format('woff'),
         url('..fonts/encodesans-medium.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}*/

@font-face {
    font-family: 'encode_sanssemibold';
    src: url('fonts/encodesans-semibold.eot');
    src: url('fonts/encodesans-semibold.eot?#iefix') format('embedded-opentype'),
         url('fonts/encodesans-semibold.woff2') format('woff2'),
         url('fonts/encodesans-semibold.woff') format('woff'),
         url('fonts/encodesans-semibold.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

/*@font-face {
    font-family: 'encode_sansthin';
    src: url('..fonts/encodesans-thin.eot');
    src: url('..fonts/encodesans-thin.eot?#iefix') format('embedded-opentype'),
         url('..fonts/encodesans-thin.woff2') format('woff2'),
         url('..fonts/encodesans-thin.woff') format('woff'),
         url('..fonts/encodesans-thin.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}*/