@charset "UTF-8";
@media all
{

    /* #### BEGIN MAP STYLES #### */
    /* Default Styles for ../home */

    /* moduleMaps */
    .moduleMaps {position:relative; top:-3px; left:-21px; padding:0 0 20px 0; background:#fff;}
    .moduleMaps .boxMap {width:310px; height:300px;}

    /* country container*/
    .mapContainer { position: relative; width: 100%; min-height: 525px; max-height: 600px; margin: 0 0 10px 0; overflow: hidden; }

    /* country-svg wrappers*/
    .mapContainer .mapContent { position: absolute; top:0; left: 20px;}
    .mapContainer .mapContentde { top: 0; width: 75%; height: 84%;}
    .mapContainer .mapContentat { top: 341px; left: 174px; width: 60%;}
    .mapContainer .mapContentch { top: 411px; left: 26px; width: 36%;}
    .mapContainer .mapContentBorder { top: 355px; left: 76px; width: 54%;}

    /* country-svg styling */
    .mapContent svg { width: 100%; height: 100%; opacity: 1;}
    .mapContentch svg { height: 105px; }
    .mapContentBorder svg { height: 109px;}

    .mapContent svg.dropShadow {
        filter: drop-shadow(0px 2px 1px #aaa);
        -webkit-filter: drop-shadow(0px 2px 1px #aaa);
    }

    /* country active */
    .mapContainer .mapContent {opacity: 1.0; -webkit-transition: all 0.5s; transition: all 0.5s; }
    .mapContainer .mapContent.active { width: 88%; top: 50px; left: 27px; }

    /* DE */
    .mapContainer .mapContentde.active { top: 0;}

    /*AT*/
    .mapContainer .mapContentat.active { height: auto; }
    .mapContainer .mapContentde.active { height: 100%; }

    /*CH*/
    .mapContainer .mapContent.active svg * { stroke-width: 0.05em; }
    .mapContainer .mapContentch.active svg { height: 230px; }

    .mapContainer .mapContent.active.hidden > svg { opacity: 0.3; -webkit-transition: all 0.5s; transition: all 0.5s;}
    .mapContainer .mapContent.invisible { opacity: 0.0; -webkit-transition: all 0.5s; transition: all 0.5s; }

    /* closing map button stuff */
    .mapContainer #closeMapBtn {position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: none;}
    .mapContainer #closeMapBtn.active { display: block;}

    /* closing state button stuff */
    .mapContainer .mapContent #closeLayerBtn {position: absolute; top: 0; left: 0; width: 100%;	height: 100%; display: none;}
    .mapContainer .mapContent #closeLayerBtn.active { display: block;}

    /* state container stuff */
    .mapContainer .stateMapContainer { position: absolute; top: 0; left: 0; height: 100%; width: 100%; }
    .stateMapContainer .stateMap { position: absolute; top: 0; left: 0; -webkit-transition: all 0.5s; transition: all 0.5s; }
    .stateMapContainer .stateMap svg {opacity:0; -webkit-transition: all 0.5s; transition: all 0.5s; }

    /* state map positioning */
    .mapContainer .stateMapContainer .stateMapsh { top:0; left: 27%; width: 32%;}
    .mapContainer .stateMapContainer .stateMapmv { top: 2%; left: 51%; width: 40%;}
    .mapContainer .stateMapContainer .stateMapni { top: 14%; left: 9%; width: 53%; }
    .mapContainer .stateMapContainer .stateMaphb { top: 16%; left: 28%; width: 7%;}
    .mapContainer .stateMapContainer .stateMaphh { top: 16%; left: 42%; width: 7%;}
    .mapContainer .stateMapContainer .stateMapbb { top: 19%; left: 61%; width: 35%;}
    .mapContainer .stateMapContainer .stateMapbe { top: 29%; left: 78%; width: 8%;}
    .mapContainer .stateMapContainer .stateMapnw { top: 31%; left: 0; width: 38%;}
    .mapContainer .stateMapContainer .stateMaphe { top: 44%; left: 20%; width: 27%;}
    .mapContainer .stateMapContainer .stateMapth { top: 43%; left: 43%; width: 32%;}
    .mapContainer .stateMapContainer .stateMapst { top: 25%; left: 51%; width: 29%;}
    .mapContainer .stateMapContainer .stateMapsn { top: 43%; left: 66%; width: 34%;}
    .mapContainer .stateMapContainer .stateMapsl { top: 69%; left: 3%; width: 14%;}
    .mapContainer .stateMapContainer .stateMaprp { top: 52%; left: 2%; width: 26%;}
    .mapContainer .stateMapContainer .stateMapbw { top: 68%; left: 16%; width: 35%;}
    .mapContainer .stateMapContainer .stateMapby { top: 59%; left: 34%; width: 53%;}

    /* state-svg styling */
    .mapContainer .stateMapContainer .stateMap svg { width: 100%; }
    .mapContainer .stateMapContainer .stateMap svg * { stroke-width: 0.05em; }
    .mapContainer .stateMapContainer .stateMap svg.strokeSmall * { stroke-width: 0.01em; }

    /* state active*/
    .stateMapContainer .stateMap.active {top: 20px; left: 20px; width: 90%;}
    .stateMapContainer .stateMap.active svg {width: 100%; height: 100%; opacity: 1; }

    /* zoom exceptions */

    /* Bremen */
    .stateMapContainer .stateMaphb.active { left: 75px; width: 60%;}

    /* Hessen */
    .stateMapContainer .stateMaphe.active { left: 40px; width: 75%;}

    /* Rheinland-Pfalz */
    .stateMapContainer .stateMaprp.active { left: 40px; width: 70%; }

    /* Sachsen-Anhalt */
    .stateMapContainer .stateMapst.active { left: 60px; width: 75%; }

    #mainMapContainer .clubIcon {
        display: block;
        position: absolute;
        top: 0;
        left: 0;
        height: 15px;
        width: 15px;
        padding: 2px;
        background-position: 0 -2620px;
        cursor: pointer;
        pointer-events: auto;
        z-index: 50;
    }

    /* pointer events stuff */
    .mapContent:not(.hidden) {
        pointer-events: none;
    }

    /* DE */
    .mapContent .stateMap > svg > * {
        pointer-events: painted;
    }

    /* AT / CH */
    .mapContent > svg > * {
        pointer-events: painted;
    }

    /* Border */
    .mapContent.mapContentBorder > svg > * {
        pointer-events: none;
    }

    /* yellow bg*/
    #mainMapContainer .clubIcon.icontype2 { background-position: 0 -3413px; }
    /* both types next to each other*/
    #mainMapContainer .clubIcon.icontype1.icontype2 { width: 27px; background-position: 0 -3525px; }

    /*hp fix mobile */
    .moduleF1 .mapContainer .mapContent { position: relative;}
    .moduleF1 #layerContainer {
        /*fix home*/
        top: -500px;
    }
   
    #layerContainer {
        position: relative;
        margin-bottom: 10px;
        z-index: 99;
    }

    #layerContainer .layerWrap {
        position: relative;
        display: none;
        width: 313px;
        margin: 10px auto 0 auto;
        padding: 52px 5px 40px 25px;
        border: 1px solid #e6e6e6;
        background: #fff;
        filter: drop-shadow(2px 2px 1px #b5b5b5);
        -webkit-filter: drop-shadow(2px 2px 1px #b5b5b5);
    }

    #layerContainer .layerWrap.active {
        display: block;
    }

    #layerContainer .layerWrap .layerCloseBtn {
        position: absolute;
        top: 0;
        right: 0;
        padding: 9px;
        margin: 12px;
        border: none;
        background: url(../img/icons/icon-close.svg) no-repeat;
        background-size: 18px;
        cursor: pointer;
    }

    #layerContainer .layerWrap h4.layerHead {
        position: absolute;
        top: 40px;
        margin-bottom: 10px;
        color: #808080;
    }

    #layerContainer .layerWrap .showStateBtn {
        position: absolute;
        right: 0;
        bottom: 0;
        padding: 20px 15px 20px;
    }

    #layerContainer .layerWrap .showStateBtn a {
        color: #808080;
        text-decoration: none;
        border-bottom: 1px solid #808080;
    }

    #layerContainer .layerWrap .layerEntryWrap {
        max-height: 380px;
        overflow-x: hidden;
        overflow-y: auto;
        margin: 10px 7px 15px 0;
    }

    #layerContainer .layerWrap .layerEntryWrap .layerEventWrap {
        margin-bottom: 20px;
        font-size: 14px;
        font-weight: bold;
        max-width: 290px;
    }

    #layerContainer .layerWrap .layerEntryWrap .layerEventWrap:last-child {
        margin: 0;
    }

    #layerContainer .layerWrap .layerEventWrap .layerContent {
        margin-bottom: 10px;
        line-height: 1.4em;
    }

    #layerContainer .layerWrap .layerEventWrap .layerContent a {
        font-size: 14px;
        font-weight: bold;
        color: #000000;
        text-decoration: none;
        border-bottom: 1px solid #000000;
    }

    #layerContainer .layerWrap .layerEventWrap h4.eventHead {
        margin-bottom: 12px;
        font-size: 14px;
        font-weight: bold;
        color: #08006c;
    }

    #layerContainer .layerWrap .layerEventWrap h4.eventHead.eventHeadType2 {
        color: #f3bd29;
    }
    /* #### END MAP STYLES #### */


    /* #### exceptions for .../themensuche #### */
    .moduleF1B .mapContainer { min-height: 415px; }
    /* positioning DE */
    .moduleF1B .mapContainer .mapContentde { height: unset; }
    /* positioning AT */
    .moduleF1B .mapContainer .mapContentat { top: 268px; left: 141px; }
    .moduleF1B .mapContainer .mapContentat.active { top: 50px; left: 0; }
    /* positioning CH */
    .moduleF1B .mapContainer .mapContentch {top: 310px; left: 24px;}
    .moduleF1B .mapContainer .mapContentch.active {top: 50px; left: 0;}
    /* positioning Border */
    .moduleF1B .mapContainer .mapContentBorder { top: 267px; left: 64px;}

    /* Layer dimensions*/
    .moduleF1B #layerContainer .layerWrap {
        width: 260px;
        margin-top: 0;
    }

    /* Layer dimensions*/
    .moduleF1B #layerContainer .layerWrap .layerEventWrap  {
        max-width: 230px;
    }

    /* hide icons on init */
    .moduleF1B #mainMapContainer .clubIcon {
        display: none;
    }

    .moduleF1B #mainMapContainer .clubIcon.js-visible {
        display: block;
    }

    /* #### end .../themensuche #### */

}