/*Events*/

#EventHighlight,
#EventListeEmpfohlen  {
    margin: 0 0 10px 0;
    height: 364px;
    font-family: AvenirNextLTPro-Cn;
    font-size: 18px;
    position: relative;
}


/*Highlight*/
#EventHighlight {
    margin: 10px 0 20px;
}

#EventHighlight .EventListeAlleEintraege {
    position: absolute;
}

#EventHighlight .ImgContainer {
    width: 298px;
    height: 200px;
}

#EventHighlight .EventHighlights {
    float: left;
    margin-right: 40px;
    margin-top: 10px;
}

#EventHighlight .EventHighlights:nth-of-type(3n) {
    margin-right: 0px;
}

#EventHighlight h3 {
    margin: 0 0 10px 0;
}

#EventHighlight p {
    margin: 0 0 5px 0;
}

#EventHighlight h2 , #EventListe h2 {
    margin: -10px 0 5px 0;
}

#EventHighlight h3 , #EventListe h3 {
    margin: 0 0 5px 0;
}

#EventHighlight .EventOrt,
#EventListe .EventOrt {
    font-weight: bold;
}


/*#EventHighlight .Loader,
#EventListeEmpfohlen .Loader,
#EventListe .Loader {
    text-align: center;
    width: 100%;
    height: 100%;
    background: #ffffff;
    opacity: 0.3;
    font-size: 100px;
    color: #cccccc;
    margin: 0;
    padding:100px;
    border: 3px solid grey;
}

#EventHighlight .LoaderText,
#EventListeEmpfohlen .LoaderText,
#EventListe .LoaderText {
    font-size: 30px;
    margin-bottom: 10px;
}

#EventHighlight .Loader i,
#EventHighlight .Loader i:before,
#EventListeEmpfohlen .Loader i,
#EventListeEmpfohlen .Loader i:before,
#EventListe .Loader i,
#EventListe .Loader i:before {
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    width: 100px;
    height: 100px;
}*/

/*
#EventHighlight .EventNavigation,
#EventListeEmpfohlen .EventNavigation {
    position: absolute;
    top: 167px;
    right: -50px;
    -webkit-border-radius: 15px;
    -moz-border-radius: 15px;
    border-radius: 15px;
    background: grey;
    width: 30px;
    height: 30px;
    padding: 6px 0px;
    text-align: center;
    cursor: pointer;
}
*/

/*.EventNavigationMinus, .EventNavigationPlus {
    cursor: pointer;
}

#EventHighlight .EventNavigation:hover,
#EventListeEmpfohlen .EventNavigation:hover {
    background: darkgray;
}

#EventHighlight .EventNavigationLinks,
#EventListeEmpfohlen .EventNavigationLinks {
    left: -40px;
}

#EventHighlight .EventNavigationRechts
#EventListeEmpfohlen .EventNavigationRechts {
    right: -40px;
}*/



#EventHighlight .EventListeEintrag,
#EventListeEmpfohlen .EventListeEintrag,
#EventListe .EventListeEintrag,
#EventOrtListe .EventListeEintrag,
#EventReiheListe .EventListeEintrag {
    padding: 0;
}

#EventHighlight .EventListeEintrag:last-of-type,
#EventListeEmpfohlen .EventListeEintrag:last-of-type {
    margin-right: 0px;
}

#EventHighlight .EventListeBild,
#EventListeEmpfohlen .EventListeBild,
#EventListe .EventListeBild,
#EventOrtListe .EventListeBild,
#EventReiheListe .EventListeBild {
    width: 305px;
    height: 200px;
    overflow: hidden;
}

#EventHighlight .EventListeBild img,
#EventListeEmpfohlen .EventListeBild img,
#EventListe .EventListeBild img,
#EventOrtListe .EventListeBild img
{
    width: 300px;
}

#EventReiheListe .EventListeEintrag {

}

#EventReiheListe .EventListeBild {
    display : flex;
    align-items : center;
    justify-content: center;
    /*padding: 20px;*/
    width: 100%;
    text-align: center;

}

#EventReiheListe .EventListeBild img {
    width: 100%;
    min-width: 170px;
    max-height: 100%;
}

#EventHighlight .GrauBild img,
#EventListeEmpfohlen .GrauBild img,
#EventListe .GrauBild img,
#EventOrtListe .GrauBild img,
#EventReiheListe .GrauBild img {
    filter: grayscale(100%); /* Standard */
    -webkit-filter: grayscale(100%); /* Webkit */
    filter: url('../images/grey.svg'); /* Firefox 4-34 */
    filter: gray; /* IE6-9 */
    -webkit-filter: grayscale(1); /* Old WebKit */
}

.nocolor {
    background: none !important;
}



#EventHighlight .EventListeBildLayer,
#EventListeEmpfohlen .EventListeBildLayer,
#EventListe .EventListeBildLayer,
#EventOrtListe .EventListeBildLayer,
#EventReiheListe .EventListeBildLayer {
    position: absolute;
    opacity: 0.3;
    height: 200px;
    width: 300px;
    z-index: 0;
    top: 0;
    left: 0;
}

#EventHighlight .EventAboContainer,
#EventListeEmpfohlen .EventAboContainer,
#EventListe .EventAboContainer,
#EventOrtListe .EventAboContainer,
#EventReiheListe .EventAboContainer {
    position: absolute;
    height: 200px;
    width: 100%;
    z-index: 3;
    overflow: hidden;
    top: 0;
    left: 0;
}

#EventHighlight .EventAboContainer a,
#EventListeEmpfohlen .EventAboContainer a {
    height: 100%;
    width: 100%;
}



#EventHighlight .EventAboContainerInner,
#EventListeEmpfohlen .EventAboContainerInner,
#EventListe .EventAboContainerInner {
    position: relative;
    height: 100%;
    width: 100%;
}

#EventHighlight .EventListeAbo,
#EventListeEmpfohlen .EventListeAbo,
#EventListe .EventListeAbo,
#EventHighlight .EventKachelAbo,
#EventListeEmpfohlen .EventKachelAbo,
#EventListe .EventKachelAbo {
    position: absolute;
    right: -22px;
    bottom: 15px;
    background: red;
    width: 100px;
    color: white;
    text-align: center;
    -moz-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
}

#EventHighlight .EventListeBildLayer:hover,
#EventListeEmpfohlen .EventListeBildLayer:hover,
#EventListe .EventListeBildLayer:hover,
#EventOrtListe .EventListeBildLayer:hover,
#EventReiheListe .EventListeBildLayer:hover {
    /*background: #41454f !important;*/
}

#EventHighlight .EventListeDatum,
#EventHighlight .EventListeEnde,
#EventListeEmpfohlen .EventListeDatum,
#EventListeEmpfohlen .EventListeEnde,
#EventListe .EventListeDatum,
#EventListe .EventListeEnde {
    position: absolute;
    color: white;
    font-family: ImpactURW, Charcoal, sans-serif;
    /*text-shadow:  1px  1px 1px black,
    1px -1px 1px black,
    -1px  1px 1px black,
    -1px -1px 1px black;*/
}

#EventHighlight .EventListeDatum,
#EventListeEmpfohlen .EventListeDatum,
#EventListe .EventListeDatum {
    top: 5px;
    left: 10px;
    font-size: 40px;
    line-height: 40px;
}

#EventHighlight .EventListeEnde,
#EventListeEmpfohlen .EventListeEnde,
#EventListe .EventListeEnde {
    top: 80px;
    left: 43px;
    font-size: 40px;
    line-height: 40px;
}

/*#EventHighlight .EventListeEnde .bis,
#EventListe .EventListeEnde .bis {
    font-size: 20px;
    line-height: 20px;
}*/

#EventHighlight .DatumKlein,
#EventListeEmpfohlen .DatumKlein,
#EventListe .DatumKlein {
    width: 33px;
    font-size: 30px;
    line-height: 30px;
    /*text-shadow:  1px  1px 1px black,
    1px -1px 1px black,
    -1px  1px 1px black,
    -1px -1px 1px black;*/
}

#EventHighlight .datumtrenner,
#EventListeEmpfohlen .datumtrenner,
#EventListe .datumtrenner {
    font-size: 18px;
    text-transform: uppercase;
}

#EventHighlight .EventListeDatum .tag,
#EventHighlight .EventListeDatum .datum,
#EventListeEmpfohlen .EventListeDatum .tag,
#EventListeEmpfohlen .EventListeDatum .datum,
#EventListe .EventListeDatum .tag,
#EventListe .EventListeDatum .datum,
#EventHighlight .EventListeEnde .tag,
#EventListeEmpfohlen .EventListeEnde .tag,
#EventListe .EventListeEnde .tag {
    border-bottom: 5px solid white;
    padding: 5px 0;
}

#EventHighlight .EventListeEnde .datum,
#EventListeEmpfohlen .EventListeEnde .datum,
#EventListe .EventListeEnde .datum {
    margin-top: 5px;
}


#EventHighlight .EventListeText,
#EventListeEmpfohlen .EventListeText,
#EventListe .EventListeText,
#EventOrtListe .EventListeText,
#EventReiheListe .EventListeText {
    width: 100%;
    padding: 10px;
    color: white;
}

#EventHighlight .EventListeEintrag .EventListeText a,
#EventListeEmpfohlen .EventListeEintrag .EventListeText a,
#EventListe .EventListeEintrag .EventListeText a,
#EventOrtListe .EventListeEintrag .EventListeText a,
#EventReiheListe .EventListeEintrag .EventListeText a {
    font-family: AvenirNextLTPro-DemiCn;
    font-weight: normal;
    font-size: 21px;
    line-height: 26px;
    color: white;
    text-transform: uppercase;
}

#EventHighlight .EventListeEintrag .EventListeText a:hover,
#EventListeEmpfohlen .EventListeEintrag .EventListeText a:hover,
#EventListe .EventListeEintrag .EventListeText a:hover,
#EventOrtListe .EventListeEintrag .EventListeText a:hover,
#EventReiheListe .EventListeEintrag .EventListeText a:hover {
    text-decoration: none;
    color: #cccccc !important;
}

#EventHighlight .EventListeIconPlus,
#EventListeEmpfohlen .EventListeIconPlus,
#EventListe .EventListeIconPlus {
    position: absolute;
    right: 0;
    bottom: 0;
    color: white;
    border-top: 1px solid white;
    border-left: 1px solid white;
    font-size: 12px;
    font-weight: normal;
    padding: 5px 3px 2px;
}

#EventHighlightNavigationContainer,
#EventListeNavigationContainer {
    height: 56px;
    width: 100%;
    background: #e29112;
    color: #184562;
    font-size: 34px;
    line-height: 28px;
    text-transform: uppercase;
    padding: 10px 0 ;
    display : table;
    text-align: center;
    font-family: OfficinaSerSCITCTTBook;
}


#EventListeNavigationContainer {
    margin: 10px 0 10px;
}

#EventListeNavigationContainer i {
    cursor: pointer;
}

#EventHighlightNavigationContainer .Cell3,
#EventListeNavigationContainer .Cell3 {
    text-align: center;
    display: table-cell;
}

.LinieRechts {
    width: 12px;
    display: table-cell;
    background: url("../images/dot_blau.png");
    background-repeat: repeat-y;
    background-position: center;
}


#EventHighlightNavigationContainer #ReiheSelect,
#EventHighlightNavigationContainer #GenreSelect,
#EventHighlightNavigationContainer #MonatSelect {
    background: #e29112;
    border: none;
    text-transform: uppercase;
    width: 100%;
}

/*hier noch die Änderungen für chosen*/

.chosen-container {
    font-size: 34px !important;
}
.chosen-container .chosen-single
{
    background: #e29112 !important;
    border: none !important;
    box-shadow: none !important;
    height: 35px !important;
    border-radius: 0px !important;
    line-height: normal !important;
    text-transform: uppercase;
    width: 100%;
    color: #184562 !important;
}

.chosen-container-single .chosen-single div {
    top: 0;
    right: 5px;
    width: 25px;
}

.chosen-container-single .chosen-single div b {
    background-image: url(../images/arrow_down_80_80_darkblue.png) !important;
    backround-repeat: no-repeat;
    background-position: 0px 0px;
    background-size: 30px 30px !important;
}

.chosen-container-active.chosen-with-drop .chosen-single div b{
    background-image: url(../images/arrow_up_80_80_darkblue.png) !important;
    backround-repeat: no-repeat;
    background-position: 0px 0px;
    background-size: 30px 30px !important;
}

.chosen-container-single .chosen-drop {
    background: rgba(216, 151, 48, 0.95);
    margin-top: 5px;
}

.chosen-container .chosen-results li.active-result {
    line-height: 30px;
    text-transform: none;
    font-site: 18px;
}


#EventHighlightNavigationContainer a,
#EventListeNavigationContainer a,
#EventHighlightNavigationContainer a:hover {
    color: #184562 !important;
    font-weight: normal;
    text-decoration: none;
}

/*#EventHighlightNavigationContainer span {
    padding: 5px 0 0 0 !important;
    display: inline-block;
}*/

#EventHighlightNavigationContainer i {
    font-size: 30px;
}

#EventHighlightNavigation {
    text-align: center;
}
#EventHighlightNavigation i {
    font-size: 24px !important;
}
#EventHighlightNavigation div {
    display: inline-block;
    padding: 3px 0 0 0;
}

#EventListeNavigationContainer .EventLayoutChangeContainer,
#EventListeNavigationContainer .EventReiheAuswahlContainer,
#EventListeNavigationContainer .EventGenreAuswahlContainer {
    display: inline-block;
    width: 312px;
}

#ReiheSelectContainer select,
#GenreSelectContainer select {
    width: 312px;
}


#EventBommels div {
    display: inline-block;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    background: #184562;
    border: 2px solid white;
    width: 20px;
    height: 20px;
    padding: 6px 0px;
    text-align: center;
    cursor: pointer;
    margin: 0 3px;
}

#EventHighlightNavigationContainer .Col3 {
    display: table-cell;
    padding: 0 10px;
    vertical-align: middle;
}

/*Eventliste*/
#EventListe,
#EventOrtListe,
#EventReiheListe {
    position: relative;
    font-family: AvenirNextLTPro-Cn;
    font-size: 18px;
}

#EventListe .EventLayoutChangeContainer {
    position: absolute;
    top: 0;
    right: -100px;
    font-size: 20px;
    color: white;
    width: 90px;
}
#EventListe .EventLayoutChangeContainer i {
    color: white;
    font-size: 30px;
    cursor: pointer;
}

#EventListe .EventLayoutChangeTitel {

}

#EventListe .EventReiheAuswahlContainer {
    position: absolute;
    top: 40px;
    right: -100px;
    width: 90px;
}

#EventListe .EventReiheAuswahlContainer select {
    width: 90px;
    font-size: 13px;
    font-family: AvenirNextLTPro-Cn;
}

#EventListe .List,
#EventReiheListe .List {
    width: 100% !important;
    clear: both;
    height: 210px !important;
}

#EventListe .List .EventAboContainer {
    width: 300px;
}

#EventListe .List .EventListeBild,
#EventReiheListe .List .EventListeBild  {
    float:left;
    width: 305px;
    border-right: 5px solid white;
}

#EventListe .List .EventListeText,
#EventReiheListe .List .EventListeText {
    float:left;
    width: 965px !important;
    padding: 20px;
}

#EventListe .datumortinfo {
    font-family: AvenirNextLTPro-DemiCn;
    margin-bottom: 15px;
    text-transform: uppercase;
    display: none;
}

#EventListe .List .titel,
#EventReiheListe .List .titel,
#EventListe .List .titel a,
#EventListe .List .untertitel,
#EventReiheListe .List .titel a,
#EventReiheListe .List .untertitel
{
    font-size: 24px !important;
    margin-bottom: 15px;
    font-weight: bold;
    text-transform: uppercase;
}

#EventListe .karteninfos {
    display: none;
}

#EventListe .List,
#EventReiheListe .List {
    overflow: hidden;
}



#EventListeEmpfohlen .EventListeReihenBild,
#EventListe .EventListeReihenBild {
    position: absolute;
    right: 10px;
    top: 10px;
    display: none;
}

#EventListe .EventListeReihenBild,
#EventListeEmpfohlen .EventListeReihenBild img {
    width: 50px;
}





#EventHighlight .EventListeBild,
#EventListe .EventListeBild {
    min-width: 170px;
    /*width: 25%;*/
    float: left;
}

#EventHighlight .EventListeBild img,
#EventListe .EventListeBild img {
    width: 150px;
}

#EventHighlight .EventListeText,
#EventListe .EventListeText {
    float: left;
    /*width: 75%;*/
}

/*EventDetail*/
#EventDetail  {
    margin: -450px auto 0px;
}

#EventDetailInner  {
    position: relative;
    margin:  0 auto 10px;
    overflow: hidden;
    background-color:rgba(65, 69, 79, 0.60);
    border: 5px solid white;
    padding: 30px;

}

#EventDetail .EventListeAbo {
    position: absolute;
    right: -40px;
    top: 22px;
    background: darkred;
    width: 140px;
    color: white;
    text-align: center;
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    font-size: 24px;
    line-height: 24px;
    padding: 6px 0 0;
}

/*#EventDetail #content {
    margin:  0 auto 10px;
}*/

#EventDetail p {
    color: white;
    font-size: 24px;
    margin: 0 0 10px;
}





/*
border: 5px
padding: 30px;
Abstand zwischen cols = 12px;

bei 1280
Col4
416px - 70px (35px pro Seite) - 80px

Col8
416 * 2 - 35 =
797


bei 1280
Col4
312px - 70px (35px pro Seite) - 80px

Col8
312 * 2 - 35 =
589

*/

#EventDetail .Col4 {
    float: left;
    width: 346px;
    margin-right: 47px;
}

#EventDetail .Col8 {
    float: left;
    width: 797px;
}

#EventDetail #EventBannerText {
    position: relative;
    overflow: hidden;
    margin-bottom: 40px;
}

#EventDetail .InfoBlock {
    font-family: ImpactURW, Charcoal, sans-serif;
    position: absolute;
    bottom: 0;
}

#EventDetail .InfoBlock p {
    background: rgba(255, 255, 255, 0.9);
    color: #41454f;
    margin-bottom: 7px;
    padding: 2px 5px;
    font-size: 18px;
}

#EventDetail .DatumBlock {
    position: absolute;
    top: 0;
    padding-right: 80px;
    opacity: 0.7;
}

#EventDetail .NameBlock {
    position: absolute;
    /*top: 100px;*/
    bottom: 0px;
    left: 282px;
}

#EventDetail .NameBlock h1 {
    color: white;
    text-transform: none;
    letter-spacing: 0px;
}



#EventDetail .datum,
#EventDetail .beginn,
#EventDetail .ort {
    font-family: ImpactURW, Charcoal, sans-serif;
    text-align: justify;
}

#EventDetail .datum:after,
#EventDetail .beginn:after,
#EventDetail .ort:after,
#EventDetail .einlass:after {
    content: "";
    display: inline-block;
    width: 100%;
}

#EventDetail .datum {
    color: white;
    font-size: 45px;
    height: 50px;
    margin-bottom: 5px;
    white-space: nowrap;
}

#EventDetail .beginn {
    background: white;
    color: #666666;
    font-size: 60px;
    height: 75px;
    padding: 2px 5px 5px;
    text-transform: uppercase;
}

#EventDetail .ort {
    color: white;
    font-size: 50px;
    /*height: 55px;*/
    letter-spacing: 5px;
    text-transform: uppercase;
    display: inline-block;
    white-space: nowrap;
}

#EventDetail .einlass {
    font-family: AvenirNextLTPro-Cn;
    color: white;
    font-size: 35px;
    text-transform: uppercase;
}

#EventDetail h1 {
    font-family: AvenirNextLTPro-DemiCn;
    font-size: 50px;
    margin: 0 0 10px 0;
}

#EventDetail h2 {
    font-family: AvenirNextLTPro-Cn;
    color: white;
    font-size: 40px;
    text-transform: none;
    margin-bottom: 0;
}



#EventDetail #EventDetailMitte {
    padding: 30px 0 0;
}

#EventDetail #EventDetailMitte .LinkContainer div {
    color: white;
    border-top: 3px solid white;
    text-align: center;
    padding: 5px 0;
}

#EventDetail #EventDetailMitte .LinkContainer div:last-of-type {
    border-bottom: 3px solid white;
}

#EventDetail #EventDetailMitte .LinkContainer a {
    color: white;
    font-size: 30px;

}

#EventDetail #EventDetailMitte .LinkContainer .LinkContainerDivSeperator {
    text-align: center;
    font-size: 30px;
}


#EventDetail #EventDetailMitte .ReiheContainer,
#EventDetail #EventDetailMitte .LinkContainer {
    margin: 5px 0 30px;
}

#EventDetail #EventDetailMitte .ReiheContainer div {
    text-align: center;
}

#EventDetail #EventDetailMitte .ReiheContainer .ReiheBild img {
    width: 300px;
}

#EventDetail #EventDetailMitte .ReiheContainer .ReiheAbo img {
    width: 200px;
}

#EventDetail #VideoContainer {
    margin-top: 20px;
}
#EventDetail #VideoContainer iframe {
    width: 100%;
}

/*Die Bottom Margin der Ortdetail ansicht*/
.OrtDetail {
    margin-bottom: 40px !important;
}

/*#EventDetail #EventOrtContainer {
    margin-top: 40px;
    width: 100%;
    !*background: #8e8f8d;*!
    font-family: AvenirNextLTPro-DemiCn;
    color: white;
    font-size: 20px;
    border-top: dotted 4px white;
}

#EventDetail #EventOrtContainerInner {
    margin: 0 auto;
    width: 1280px;
    padding: 40px 0;
    height: 549px;
}

#EventDetail #EventOrtContainerInner .EventOrtKarte {
    height: 150px;
}

#EventDetail #EventOrtContainerInner .EventOrtBild {
    width: 957px;
    height: 450px;
    border: 5px solid white;
    background-size: cover !important;
    background-repeat:   no-repeat !important;
    background-position: center center !important;
}

#EventDetail #EventOrtContainerInner .EventOrtBild img {
    width: 100%;
}*/

/*Smartphones bis 6+*/
@media screen
and (min-width: 320px)
and (max-width: 736px) {

    #EventHighlight,
    #EventListeEmpfohlen {
        height: 1090px;
    }

    #EventHighlight .EventNavigation,
    #EventListeEmpfohlen .EventNavigation {
        display: none;
    }

    #EventHighlight .EventListeBild img,
    #EventListeEmpfohlen .EventListeBild img,
    #EventListe .EventListeBild img {
        min-width: 100%;
        min-height: 200px;
    }

    #EventHighlight .EventListeBildLayer,
    #EventListeEmpfohlen .EventListeBildLayer,
    #EventListe .EventListeBildLayer,
    #EventHighlight .EventListeBild,
    #EventListeEmpfohlen .EventListeBild,
    #EventListe .EventListeBild {
        width: 100%;
    }

    #EventHighlightNavigationContainer {
        height: auto;
        display: block;
        margin-top: 10px;
    }


    #EventDetail {
        margin: 0px auto 0px;
    }

    #EventDetailInner {
        margin: 0;
        background: none;
        border: 0px;
        padding: 0px;
    }

    #EventDetail #EventBannerText {
        background: #e29112;
        margin-bottom: 40px;
        min-height: 300px;
    }


    #EventDetail .DatumBlock {
        position: static;
        width: 50%;
        float: left;
        padding: 10px 15px;
    }

    #EventDetail .InfoBlock {
        position: static;
        width: 50%;
        margin: 0;
        opacity: 0.7;
        float: left;
        padding: 15px;
    }

    #EventDetail .InfoBlock p {
        font-size: 14px;
    }


    #EventDetail .NameBlock {
        clear: both;
        position: static;
        width: 100%;
        border-top: 3px solid white;
        padding: 15px 15px 0;
        background: #e29112;
    }

    #EventDetail .datum {
        font-size: 29px;
        height: 30px;
    }

    #EventDetail .beginn {
        font-size: 36px;
        height: 45px;
    }

    #EventDetail .ort {
        font-size: 40px;
        height: 40px;
    }

    #EventDetail .einlass {
        font-size: 21px;
    }

    #EventDetail h1 {
        font-size: 40px;
    }

    #EventDetail h2 {
        font-size: 20px;
    }

    #EventDetail #EventDetailMitte .LinkContainer div {
        padding: 2px 0;
    }

    #EventDetail #EventDetailMitte .LinkContainer a {
        font-size: 18px;
        letter-spacing: 3px;
    }

    #EventDetail #EventDetailMitte .ReiheContainer .ReiheBild img {
        width: 100%;
    }



    #EventDetail #EventDetailMitte {
        padding: 0;
    }

    #EventDetail #EventDetailMitte .Col4 {
        width: 100%;
        padding: 0 15px;
        margin: 0;
    }

    #EventDetail .Col8 {
        width: 100%;
        padding: 0 15px;
        margin: 0;

    }

    #EventDetail #VideoContainer iframe {
        height: 200px;
    }


}


/*Smartphones quer */
@media screen
and (min-width: 420px)
and (max-width: 736px) {
    #EventHighlight,
    #EventListeEmpfohlen {
        height: 360px;
    }

    #EventReiheListe .List {
        height: 150px !important;
    }

    #EventReiheListe .List .EventListeBild {
        width: 25%;
        height: 150px;
    }

    #EventReiheListe .List .EventListeBild img {
        width: 100%;
    }

    #EventReiheListe .List .EventListeBildLayer {
        width: 25%;
    }

    #EventReiheListe .List .EventListeText {
        width: 75% !important;
    }
}



/* Tablett */

@media only screen
and (min-width: 768px)
and (max-width: 980px) {

    #EventHighlight,
    #EventListeEmpfohlen {
        margin: 10px 0;
    }

    #EventHighlight .EventListeBildLayer,
    #EventListeEmpfohlen .EventListeBildLayer,
    #EventListe .EventListeBildLayer,
    #EventOrtListe .EventListeBild,
    #EventReiheListe .EventListeBild {
        width: 283px;
    }

    #EventHighlight .EventListeBild img,
    #EventListeEmpfohlen .EventListeBild img,
    #EventListe .EventListeBild img,
    #EventOrtListe .EventListeBild img,
    #EventReiheListe .EventListeBild img {
        width: 283px;
    }

    #EventHighlight .EventAboContainer {
        width: 283px;
        height: 180px;
    }

    #EventHighlight .EventListeBild,
    #EventListeEmpfohlen .EventListeBild,
    #EventListe .EventListeBild,
    #EventOrtListe .EventListeBild,
    #EventReiheListe .EventListeBild {
        width: 283px;
        height: 180px;
    }

    #EventHighlight .EventListeBildLayer,
    #EventListeEmpfohlen .EventListeBildLayer,
    #EventListe .EventListeBildLayer,
    #EventOrtListe .EventListeBildLayer,
    #EventReiheListe .EventListeBildLayer {
        height: 180px;
        width: 283px;
    }

    #EventHighlight .DatumKlein,
    #EventListeEmpfohlen .DatumKlein,
    #EventListe .DatumKlein {
        width: 33px;
        font-size: 24px;
        line-height: 24px;
    }

    #EventHighlight .EventListeEnde,
    #EventListeEmpfohlen .EventListeEnde,
    #EventListe .EventListeEnde {
        top: 50px;
        left: 43px;

    }


    #EventDetail p {
        font-size: 18px;
    }



    #EventDetail {
        margin: -410px auto 0px;
    }

    #EventDetailInner {
        padding: 20px;
    }

    #EventDetail #EventBannerText {
        height: 375px;
    }

    #EventDetail .Col4 {
        width: 154px;
        margin-right: 0px;
    }

    #EventDetail .InfoBlock {
        margin-top: 240px;
        width: 154px;
        margin-right: 40px;
    }

    #EventDetail .InfoBlock p {
        font-size: 14px;
    }

    #EventDetail .DatumBlock {
        width: 154px;
        padding-right: 0px;
    }

    #EventDetail .NameBlock {
        /*top: 100px;*/
        left: 175px;
    }

    #EventDetail .datum {
        font-size: 29px;
        height: 30px;
    }

    #EventDetail .beginn {
        font-size: 36px;
        height: 45px;
    }

    #EventDetail .ort {
        font-size: 40px;
        height: 40px;
    }

    #EventDetail .einlass {
        font-size: 21px;
    }

    #EventDetail h1 {
        font-size: 40px;
    }

    #EventDetail h2 {
        font-size: 20px;
    }

    #EventDetail #EventDetailMitte .LinkContainer div {
        padding: 2px 0;
    }

    #EventDetail #EventDetailMitte .LinkContainer a {
        font-size: 18px;
        letter-spacing: 3px;
    }

    #EventDetail #EventDetailMitte .ReiheContainer .ReiheBild img {
        width: 240px;
    }

    #EventDetail #EventDetailMitte .ReiheContainer .ReiheAbo img,
    #EventDetail #EventDetailMitte .ReiheContainer .ReiheBild img {
        width: 154px;
    }

    #EventDetail #EventDetailMitte .Col4 {
        width: 154px;
        margin-right: 22px;
    }

    #EventDetail .Col8 {
        width: 363px;
    }

    #EventDetail #VideoContainer iframe {
        height: 200px;
    }


    #EventReiheListe .List {
        height: 150px !important;
    }

    #EventReiheListe .List .EventListeBild {
        width: 150px;
        height: 150px;
    }

    #EventReiheListe .List .EventListeBild img {
        min-width: 150px;
        min-height: 150px;
    }

    #EventReiheListe .List .EventListeBildLayer {
        width: 150px;
    }

    #EventReiheListe .List .EventListeText {
        width: 430px !important;
    }


}

/*Displays ab 992*/
@media screen
and (min-width: 992px) {

    #EventHighlight .EventListeBildLayer,
    #EventListeEmpfohlen .EventListeBildLayer,
    #EventListe .EventListeBildLayer {
        width: 300px;
    }

    #EventHighlight .EventListeBild img,
    #EventListeEmpfohlen .EventListeBild img,
    #EventListe .EventListeBild img {
        width: 300px;
    }

    #EventHighlight .EventListeBild,
    #EventListeEmpfohlen .EventListeBild,
    #EventListe .EventListeBild {
        width: 305px;
        height: 200px;
    }

    #EventHighlight .EventListeBildLayer,
    #EventListeEmpfohlen .EventListeBildLayer,
    #EventListe .EventListeBildLayer {
        height: 200px;
        width: 300px;
    }

    #EventHighlight .DatumKlein,
    #EventListeEmpfohlen .DatumKlein,
    #EventListe .DatumKlein {
        width: 33px;
        font-size: 30px;
        line-height: 30px;
    }

    #EventHighlight .EventListeEnde,
    #EventListeEmpfohlen .EventListeEnde,
    #EventListe .EventListeEnde {
        top: 80px;
        left: 43px;
    }
}

/*Displays ab 1000px*/
@media screen
and (min-width: 1000px) {

    #EventDetail #EventBannerText {
        height: 375px;
    }

    #EventDetail .Col4 {
        width: 282px;
        margin-right: 0px;
    }

    #EventDetail .InfoBlock {
        margin-top: 240px;
        width: 242px;
        margin-right: 40px;
    }

    #EventDetail #EventDetailMitte .Col4 {
        width: 242px;
        margin-right: 40px;
    }

    #EventDetail .Col8 {
        width: 589px;
    }

    #EventDetail .DatumBlock {
        width: 282px;
        padding-right: 40px;
    }

    #EventDetail .NameBlock {
        bottom: 0px;
        left: 282px;
    }

    #EventDetail .datum {
        font-size: 46px;
    }

    #EventDetail .beginn {
        font-size: 60px;
        height: 70px;
    }

    #EventDetail .ort {
        font-size: 53px;
    }

    #EventDetail .einlass {
        font-size: 33px;
    }


    #EventListe .List .EventListeBild,
    #EventReiheListe .List .EventListeBild {
        width: 307px;
    }

    #EventHighlight .EventListeBild img,
    #EventListeEmpfohlen .EventListeBild img,
    #EventListe .EventListeBild img {
        width: 302px;
    }

    #EventHighlight .EventListeBildLayer,
    #EventListeEmpfohlen .EventListeBildLayer,
    #EventListe .EventListeBildLayer {
        width: 302px;
    }

    #EventListe .List .EventListeText,
    #EventReiheListe .List .EventListeText {
        width: 643px !important;
    }

}

@media screen
and (min-width: 1200px) {


    #EventDetail {
        margin: -450px auto 0px;
    }

    #EventDetail #EventBannerText {
        height: 375px;
    }

    #EventDetail .Col4 {
        width: 282px;
        margin-right: 0px;
    }

    #EventDetail .InfoBlock {
        margin-top: 240px;
        width: 242px;
        margin-right: 40px;
    }

    #EventDetail #EventDetailMitte .Col4 {
        width: 242px;
        margin-right: 40px;
    }

    #EventDetail .Col8 {
        width: 589px;
    }

    #EventDetail .DatumBlock {
        width: 282px;
        padding-right: 40px;
    }

    #EventDetail .NameBlock {
        bottom: 0px;
        left: 282px;
    }

    #EventDetail .datum {
        font-size: 46px;
    }

    #EventDetail .beginn {
        font-size: 60px;
        height: 70px;
    }

    #EventDetail .ort {
        font-size: 53px;
    }

    #EventDetail .einlass {
        font-size: 33px;
    }

    #EventDetail h1 {
        font-size: 50px;
    }

    #EventDetail h2 {
        font-size: 24px;
    }

    #EventDetail #EventDetailMitte .LinkContainer a {
        font-size: 24px;
        letter-spacing: 3px;
    }

    #EventDetail #EventDetailMitte .ReiheContainer .ReiheBild img {
        width: 240px;
    }

    #EventDetail #EventOrtContainerInner {
        width: 960px;
        height: 449px;
    }

    #EventDetail #EventOrtContainerInner .EventOrtInfo {
        height: 200px;
    }

    #EventDetail .Col3 {
        width: 228px;
    }

    #EventDetail #EventOrtContainerInner .EventOrtKarte {
        height: 150px;
    }

    #EventDetail #EventOrtContainerInner .EventOrtKarte iframe {
        width: 228px;
    }

    #EventDetail .Col9 {
        width: 720px;
    }

    #EventDetail #EventOrtContainerInner .EventOrtBild {
        width: 710px;
        height: 350px;
    }

    #EventHighlightNavigationContainer .Cell3,
    #EventListeNavigationContainer .Cell3 {
        width: 312px;
    }

    #EventHighlightNavigationContainer,
    #EventListeNavigationContainer {
        font-size: 28px;
        line-height: 24px;
        height: 46px;
        padding: 10px 0px 3px;
    }

    .chosen-container {
        font-size: 28px !important;
    }

    #GenreSelect {
        width: 100%;
    }

}


/*Displays ab 1400px*/
@media screen
and (min-width: 1400px) {

    #EventListe .List .EventListeBild,
    #EventReiheListe .List .EventListeBild {
        width: 305px;
    }

    #EventHighlight .EventListeBild img,
    #EventListeEmpfohlen .EventListeBild img,
    #EventListe .EventListeBild img {
        width: 301px;
    }

    #EventHighlight .EventListeBildLayer,
    #EventListeEmpfohlen .EventListeBildLayer,
    #EventListe .EventListeBildLayer {
        width: 301px;
    }

    #EventListe .List .EventListeText,
    #EventReiheListe .List .EventListeText {
        width: 965px !important;
    }

    #EventDetail {
        margin: -641px auto 0px;
    }

    #EventDetail #EventBannerText {
        height: 565px;
    }

    #EventDetail .Col4,
    #EventDetail #EventDetailMitte .Col4 {
        width: 346px;
        margin-right: 47px;
    }


    #EventDetail .Col8 {
        width: 797px;
    }

    #EventDetail .DatumBlock {
        padding-right: 80px;
        width: 346px;
    }

    #EventDetail .InfoBlock {
        width: 346px;
        padding-right: 80px;
    }

    #EventDetail .NameBlock {
        /*top: 140px;*/
        left: 393px;
    }

    #EventDetail .datum {
        font-size: 49px;
        margin-bottom: 8px;
    }

    #EventDetail .beginn {
        font-size: 66px;
        height: 75px;
    }

    #EventDetail .ort {
        font-size: 129px;
    }

    #EventDetail .einlass {
        font-size: 35px;
    }

    #EventDetail h1 {
        font-size: 50px;
    }

    #EventDetail h2 {
        font-size: 40px;
    }

    #EventDetail #EventDetailMitte .LinkContainer a {
        font-size: 30px;
        letter-spacing: 5px;
    }

    #EventDetail #EventDetailMitte .ReiheContainer .ReiheBild img {
        width: 300px;
    }

    #EventDetail #EventOrtContainerInner {
        width: 1280px;
        height: 549px;
    }

    #EventDetail #EventOrtContainerInner .EventOrtInfo {
        height: 300px;
    }

    #EventDetail .Col3 {
        width: 308px;
    }

    #EventDetail #EventOrtContainerInner .EventOrtKarte {
        height: 150px;
    }

    #EventDetail #EventOrtContainerInner .EventOrtBild {
        width: 957px;
        height: 450px;
    }

}