/* ------------------------------------------------------------------------------------- */
/* -- html ----------------------------------------------------------------------------- */
html{
    font-family: Raleway;
}
/* ------------------------------------------------------------------------------------- */

/* ------------------------------------------------------------------------------------- */
/* -- body ----------------------------------------------------------------------------- */
body {
    display: flex;
    min-height: 100vh;
    flex-direction: column;
  }


/* ------------------------------------------------------------------------------------- */

/* ------------------------------------------------------------------------------------- */
/* -- jagdgesezt ----------------------------------------------------------------------- */
col.s6.m3.jagdgesetz{
    margin-left:20px;
}
.jagdgesetz{
    margin-left:20px;
}

/* -- navigation ----------------------------------------------------------------------- */

nav ul a:hover{
    box-shadow: inset 0 2px 0 #66cc33;
    background-color: rgba(204, 204, 204, 0.08);
}

a.navigation.navactive{
    box-shadow: inset 0 2px 0 #66cc33;
    background-color: rgba(204, 204, 204, 0.08);
}

.dropdown-content li:hover{
    background: none;
}

nav{
    -webkit-box-shadow: 0px -10px 20px 5px rgba(0,0,0,0.14), 0 1px 18px 0 rgba(0, 0, 0, 0.06), 0 3px 5px -1px rgba(0, 0, 0, 0.02);
    box-shadow: 0px -10px 20px 5px rgba(0,0,0,0.14), 0 1px 18px 0 rgba(0, 0, 0, 0.06), 0 3px 5px -1px rgba(0, 0, 0, 0.02);
}

.brand-logo{
    height: 100%;
    display: flex !important;
    align-items: center;
}

.brand-logo img{
    height: 70%;
}

.dropdown-button.material-icons.right{
    height: 80px;
    line-height: 80px !important;
}

.collapsible-header.material-icons.right{
    height: 100%;
    line-height: 48px !important;
}

.nav-wrapper i{
    height: 100%;
    line-height: 80px !important;
}

.dropdown-content li>a{
    padding: 14px 30px 14px 16px;
}

.dropdown-content li>a{
    color: black;
}

.side-nav li>a{
    padding: 0 16px;
}


.hide-on-large-and-down li{
    display: -ms-inline-flexbox;
}

/* Lässt das Menü Icon schon bei 12000px Fensterbreite auftauchen */
@media only screen and (min-width: 1200px){
    nav a.button-collapse{
        display: none;
    }
    .hide-on-big-only{
        display: none !important;
    }
}

@media only screen and (max-width: 1200px){
    nav a.button-collapse {
        display: block !important;
    }
    .hide-on-large-and-down{
        display: none !important;
    }
}


.header-img{
    margin-top: 16px;
}

/* ------------------------------------------------------------------------------------- */

/* ------------------------------------------------------------------------------------- */
/* -- content -------------------------------------------------------------------------- */

/* -- GRID ------------------------------------------------------------- */
.cards{
    display: flex;
    flex-wrap: wrap;
    margin-right: -20px;
    margin-bottom: 50px;
}

.card.grid.start{
    margin: 20px 20px 0 0;
}

.card.grid.artkl{
    margin: 20px 20px 0 0;
}

.grid.five{
    margin: 20px 20px 0 0;
}


/* -- Mobilegrösse -- */
@media only screen and (min-width: 0px) and (max-width: 600px){
    .card.grid.start{
        flex: 0 1 calc(100% - 20px);
        -ms-flex: 0 1 95%;
    }
    .card.grid.artkl{
        flex: 0 1 calc(100% - 20px);
        -ms-flex: 0 1 95%;
    }
    .grid.five{
        flex: 0 1 calc(50% - 20px);
        -ms-flex: 0 1 45%;
    }
    .header-img{
        margin-top: 24px;
    }
    
    .modal-content.black-text .titel{
        font-size: 22px;
    }
}

/* -- Tabletgrösse -- */
@media only screen and (min-width: 600px) and (max-width: 1020px){
    .card.grid.start{
        flex: 0 1 calc(50% - 20px);
        -ms-flex: 0 1 45%;
    }
    .card.grid.artkl{
        flex: 0 1 calc(50% - 20px);
        -ms-flex: 0 1 45%;
    }
    .grid.five{
        flex: 0 1 calc(33.33% - 20px);
        -ms-flex: 0 1 28%;
    }
}

/* -- Desktopgrösse -- */
@media only screen and (min-width: 1020px){
    .card.grid.start{
        flex: 0 1 calc(50% - 20px);
        -ms-flex: 0 1 45%;
    }
    .card.grid.artkl{
        flex: 0 1 calc(33.33% - 20px);
        -ms-flex: 0 1 28%;
    }
    .grid.five{
        flex: 0 1 calc(20% - 20px);
        -ms-flex: 0 1 15%;
    }
}

/* Bereich Veranstaltungen in Mobil- und Tabletgrössen nach dem Inhalt anzeigen*/
@media screen and (max-width: 1200px){
    .startseite-content {
        display: flex;
        flex-direction: column-reverse;
    }
}


/* ---------------------------------------------------------------------- */
/* -- basic ------------------------------------------------------------- */

strong{
    font-weight: bold;
}

#back-to-top{
    z-index: 800;
}

.float{
    position: fixed;
    bottom: 20px;
    right: 40px;
}

.float.artikel{
    position: fixed;
    right: 15%;
    bottom: 20px;
}

.card.grid.start.artkl.hover .card-content{
    margin-bottom: 70px
}

.card-action{
    position: absolute !important;
    min-height: 90px;
    width: 100%;
    bottom: 0px;
}

.card .card-action{
    border-top: none;
}

.card.artkl.overview{
    height: 250px;
}

.card-content{
    box-shadow: inset 0 2px 0 0 #66cc33;
}

.card.hover:hover{
    -webkit-box-shadow: 0 8px 17px 2px rgba(0,0,0,0.14), 0 3px 14px 2px rgba(0,0,0,0.12), 0 5px 5px -3px rgba(0,0,0,0.2);
    box-shadow: 0 8px 17px 2px rgba(0,0,0,0.14), 0 3px 14px 2px rgba(0,0,0,0.12), 0 5px 5px -3px rgba(0,0,0,0.2);
}
/* ---------------------------------------------------------------------- */

/* -- start ------------------------------------------------------------- */

.news-container-content{
    padding: 10px 30px;
}

.rechte-spalte-start{
    margin-top: 50px;
}

ul.erfolge-list>li{
    list-style-type: disc !important;
    margin: 0 0 20px 20px;
    list-style-image: url(https://testing.ems-online.ch/mrm/files/upload/Politik/check-mark.png);
}

ul.support-list>li{
    list-style-type: disc !important;
    margin: 0 0 20px 20px;
}

ul.how-to-chose>li{
    list-style-type: decimal!important;
    margin: 0 0 20px 10px;
}

/* ---------------------------------------------------------------------- */

/* -- ueber ------------------------------------------------------------- */
.list{
    margin-left: 20px;
    padding-top: 15px;
    list-style-type: circle !important;
}


/* ---------------------------------------------------------------------- */

/* -- veranstaltungen --------------------------------------------------- */

.icon-veranst{
    font-size: 14.5px !important;
}

.link-veranstaltung a:hover {
	color: #66cc33; 
}

/* ---------------------------------------------------------------------- */

/* -- medien ------------------------------------------------------------ */
.scrollmenu{
    position: fixed;
    bottom: 0px;
    width: 100%;
    overflow: auto;
    z-index: 1;
    background: white;
    white-space: nowrap;
    left: 0;
    height: 100px;
}

.scrollmenu a{
    display: inline-block;
    padding: 5px;
}

.chipped{
    display: inline-block;
    height: 45px;
    font-size: 14px;
    font-weight: 500;
    line-height: 45px;
    padding: 0 12px;
    border-radius: 45px;
    margin-bottom: 5px;
}

/* ---------------------------------------------------------------------- */

/* -- ems --------------------------------------------------------------- */
/* ---------------------------------------------------------------------- */

/* -- kontakt ----------------------------------------------------------- */

.popup{
    position: fixed;
    z-index: 998;
    bottom: 0px;
    left: 0px;
    background: #66cc33;
    color: white;
    width: 100%;
    padding: 20px;
    font-size: 1.25rem;
    font-weight: 600;
    text-align: center;
    -webkit-animation: fadeout 3s ease forwards, transitionin 1s ease;
    animation: fadeout 4s ease forwards, transitionin 1s ease; 
}

@keyframes fadeout{
    0% { opacity: 1; }
    66% { opacity: 1; }
    100% { opacity: 0; }
}

@keyframes transitionin{
    0% { transform: translateY(90px) }
    100% { transform: translateY(0px) }
}

@-webkit-keyframes fadeout{
    0% { opacity: 1; }
    66% { opacity: 1; }
    100% { opacity: 0; }
}

@-webkit-keyframes transitionin{
    0% { transform: translateY(90px) }
    100% { transform: translateY(0px) }
}

/* ---------------------------------------------------------------------- */

/* -- SVP-Wahlkampf 2023 ------------------------------------------------------------ */

.svp .row {
    margin-bottom: 0;
}

.svp img {
    border: 1px solid black;
    max-width: 100%;
}

.svp .untertitel-bold {
    text-decoration: underline;
    text-decoration-line: underline;
    text-decoration-style: solid;
    text-decoration-color: green;
    text-decoration-thickness: 5px;
    text-underline-offset: 4px;
}

.kandidaten {
    margin-bottom: 2rem;
}

.svp .kandidaten__titel {
    margin-top: 0;
    font-size: 1.5rem;
    font-weight: 600;
    text-decoration-line: underline;
    text-decoration-style: solid;
    text-decoration-color: red;
    text-decoration-thickness: 1px;
    text-underline-offset: 6px;
}

.abstand-nach-unten {
    margin-bottom: 3rem;
}


/* ------------------------------------------------------------------------------------- */

/* ------------------------------------------------------------------------------------- */

/* -- footer --------------------------------------------------------------------------- */

.page-footer{
    z-index: 997;
}

/* ------------------------------------------------------------------------------------- */

/* ------------------------------------------------------------------------------------- */

/* -- plugins -------------------------------------------------------------------------- */
/* ------------------------------------------------------------------------------------- */

:focus {
    outline: -webkit-focus-ring-color auto 0px;
}

button:focus{
    background-color: #66cc33;
}

.fancybox-caption {
    display: flex;
    justify-content: center;
}

.fancybox-button--play{
    display: none !important;
}

.fancybox-button--fullscreen{
    display: none !important;
}

.fancybox-button--thumbs{
    display: none !important;
}

.fancybox-button--share{
    display: none !important;
}

.fancybox-caption-wrap{
    display: flex;
    justify-content: center;
}

.fancybox-button--zoom{
    display: none !important;
}

.fancybox-caption{
    font-family: Raleway;
}

/* ------------------------------------------------------------------------------------- */
/* -- werte ---------------------------------------------------------------------------- */

.display-flex-center-center{
    display: flex;
    justify-content: center;
    align-items: center;
}


/* -- schriften -------------- */

.normal{
    text-transform: none !important;
}

.capital{
    text-transform: capitalize !important;
}

.lowercase{
    text-transform: lowercase !important;
}

.uppercase{
    text-transform: uppercase !important;
}

.bold{
    font-weight: 500;
}

a{
    color: inherit;
    text-decoration: inherit;
}

.titel{
    font-size: 25px;
    font-weight: 700;
    margin-top:25px;
    margin-bottom:0px
}

.untertitel-bold{
    font-size: 20px;
    font-weight: 600;
}

.untertitel{
    font-size: 20px;
    font-weight: 400;
}

.beschreibung{
    font-size: 12px;
    font-weight: 400;
}

/* -- texte mit abstände - */
.untertitel-bold.artkl{
    margin-top: -7px !important;
    margin-bottom: 17px !important;
}

.untertitel-bold.vrstltg{
    margin-top: -7px !important;
}


/* -- grössen ------------ */
.viertel-breite{
    width: 25% !important;   
}

.halbe-breite{
    width: 50% !important;
}

.ganze-breite{
    width: 100% !important;
}

.ganze-breite-calc{
    width: calc(100% - 20px) !important;
}

/* -- paddings ----------- */
/* -- bottom ---- */
.padding-bottom-90{
    padding-bottom: 90px !important;
}

/* -- margins ------------ */
/* -- top ------- */
.margin-top-minus-7{
    margin-top: -7px !important;
}

.margin-bottom-minus-20{
    margin-bottom: -20px !important;
}

.margin-top-minus-20{
    margin-top: -20px !important;
}

.margin-top-minus-10{
    margin-top: -10px !important;
}

.margin-top-0{
    margin-top: 0px !important;
}

.margin-top-10{
    margin-top: 10px !important;
}

.margin-top-20{
    margin-top: 20px !important;
}

.margin-top-30{
    margin-top: 30px !important;
}

.margin-top-50{
    margin-top: 50px !important;
}

/* -- bottom ---- */
.margin-bottom-0{
    margin-bottom: 0px;
}

.margin-bottom-8{
    margin-bottom: 8px;
}

.margin-bottom-10{
    margin-bottom: 10px;
}

.margin-bottom-20{
    margin-bottom: 20px;
}

.margin-bottom-50{
    margin-bottom: 50px;
}

.margin-bottom-90{
    margin-bottom: 90px !important;
}

/* -- farben ------------- */
.green{
    background-color: #66CC33 !important;
}

.border-top-green{
    border-top: 2px solid #66cc33 !important;
}

blockquote{
    border-left: 5px solid #66cc33;
}

/* ------------------------------------------------------------------------------------- */


.chip{
    margin: 0px;
}

.politik-chip{
    margin-top: 10px;
}

.politik-chip:first-child{
    margin-top: 69.25px;
}
