.mec-favorites-list {
    margin-top: 20px;
}

.mec-fav-item {
    margin-bottom: 10px;
}

/* Nur auf der Favoriten-Seite */
#my-fav-page .mec-event-article {
    display: none;
}

/* Platzhalter-Text, falls die Liste leer ist */
#my-fav-page .no-favs-message {
    display: none;
    padding: 20px;
    text-align: center;
}
/* Verhindert, dass das übergeordnete MEC-Element den Klick klaut */
#mec-time-details .mec-fav-btn {
    
}

/* Falls das Akkordeon über ein ::before oder ::after Element klickbar gemacht wurde */
.mec-toggle-item-col {
    /* Sicherstellen, dass der Container für den Button klickbare Inhalte erlaubt */
    pointer-events: auto;
}


/* Der Container - zum Positionieren */
div.mec-fav-div {
    display: inline-block !important;
    margin-left: 0px !important;
    vertical-align: middle !important;
}

/* Der Button selbst (das Herz + Text) */
div.mec-fav-div span.mec-fav-btn {
	position: relative !important;
    z-index: 9999 !important;
    pointer-events: auto !important;
    /*color: #ff4757 !important; /* Deine Wunschfarbe */
	font-family: inherit !important;
    font-size: 60% !important;  /* Schriftgröße */
    font-weight: bold !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
    display: inline-block !important;
}

/* Hover-Effekt (wenn man mit der Maus drüberfährt) */
div.mec-fav-div span.mec-fav-btn:hover {
    transform: scale(1.1) !important;
    color: #e84118 !important; /* Etwas dunkleres Rot beim Hover */
}

/* Stil für den aktiven Zustand (wenn es ein Favorit ist) */
div.mec-fav-div span.mec-fav-btn.active {
    color: #ff4757 !important;
}





/* Der Artikel-Container als Bezugspunkt */
/*.mec-event-article {
    position: relative !important;
}

/* Der Wrapper: Wir positionieren ihn manuell */
/*.mec-fav-wrapper {
    position: relative !important;
    /* Justiere diese Werte, bis es unter der Zeit sitzt: */
    /*top: 60px;       /* Abstand von oben */
    /*left: 15px;      /* Abstand von links (wo die Zeit meist startet) */
    
/*    z-index: 9999 !important;
    pointer-events: none !important;
    width: auto !important;
    height: 0px !important;
}
*/
.mec-fav-btn {
    all: unset !important; /* Löscht MEC-Button-Styles */
    cursor: pointer !important;
    color: #626262 !important;
    font-size: 60% !important;
    display: inline-block !important;
    line-height: 1 !important;
	pointer-events: auto !important;
}
.mec-fav-btn:hover {
    transform: scale(1.1) !important;
    color: #e84118 !important; /* Etwas dunkleres Rot beim Hover */
}
.mec-fav-btn.active {
    color: #ff4757 !important;
}

.mec-fav-btn:focus, 
.mec-fav-btn:active {
    color: #626262 !important; /* Die Standardfarbe */
    outline: none !important;  /* Entfernt den blauen Rahmen, falls vorhanden */
    box-shadow: none !important;
}

.site-content {
	padding-top: 20px !important;
	margin-left: 29% !important;
}

@media screen and (max-width: 955px) {
    .site-content {
        padding-top: 10px !important;
        margin-left: 0 !important;
    }
}


.mec-advanced-organizer {
    background: #FFFFFF !important;
    padding: 0px !important;
}
@media (min-width: 961px) {
    .mec-wrap .col-md-3 {
        width: 30% !important;
		min-width: 150px !important;
		height: 150px !important;
    }
	.mec-wrap .col-md-9 {
        width: 70% !important;
    }
}
.mec-wrap .col-md-3 {
     height: 150px !important;
    }
.mec-advanced-organizer .mec-event-article .mec-featured-info-box .mec-featured-info span em {
    font-size: 12px;
    font-style: unset;
    color: #000000 !important;
}



.main-navigation {
        font-size: 12px;
        font-size: 1.2rem;
        margin: 0 10% 10% !important;
    }
.mec-container {
	
	width: 100% !important;
}

.mec-event-info-desktop.mec-event-meta.mec-color-before.mec-frontbox {
    padding: 0;
}

.site-content .mec-container .mec-wrap{
	padding-left:5%;
	padding-right:5%;
	padding-top: 40px;
}
.mec-single-event .mec-event-content {
    padding: 0 0 30px;
    margin-bottom: 10px;
}