/************************************************************************************************************************************************/
/*Stylesheet zum Plugin AnkerMenu */
/************************************************************************************************************************************************/
/*
* Erweitert das CMS Mozilo ( mozilo.de ) und sollte bei korrekter installation im Plugin-Ordner von diesem automatisch eingebunden werden.
* 
* Allgemeine Formatierungen und die Möglichkeiten zur Formatierung einens Dropdown-Menues aus Elementen, welche durch das Plugin AmkerMenu generiert wurden.
* 
* Die "Voreinstellungen" wurden für eine private Website erstellt, jedoch darüber hinaus nicht getestet. Es besteht kein Anspruch auf Vollständigkeit, Kompatibilität, Funktion oder Support.
* 
* Bei Veränderungen in der Kofiguration des Plugins können eventuell Elemente nicht mehr mit diesem Stylesheet übereinstimmen.
* 
*/



/* Container für gesamte Navigation */
/************************************/

nav {
/*    order: 2;		/* Reihenfolge falls Flex-Element */
	z-index: 89;
	max-height: 95vh;
	position: sticky;
	top: .3rem;
}
	
nav ul, nav li {
	list-style-type:none !important;
	list-style-image:none !important;
	border-radius: .5rem;
	margin: .1rem;
	padding: 0;
}
  


/* *** Container für Menu *** */
/*******************************/

/* *** Allgemeines + "versteckter" Zusatnd *** */
ul.mainmenu_AM {
	display: flex;
	flex-flow: column;
	position: relative;
    overflow: scroll;
    justify-content: space-between;
	align-items : flex-start;
	align-content: flex-start;
	z-index: 90;
	max-width: 0;  /* Versteckter Zustand*/
	max-height: 0;  /* Versteckter Zustand*/
    background-color: rgb(40, 0, 15);
	background-color: rgba(40, 0, 15, 0.8);
	font-size: 1.2rem;
	font-weight: bold;
	margin: 0;
	padding: 0;
	border-radius: 0 1.3rem 1.3rem 0;
	transition: all 400ms cubic-bezier(0, 0, 0.58, 1);
}

/* *** "Geöffneter" Zusatnd (Mobil) *** */
.hackbox.navMain:checked ~ ul.mainmenu_AM {
  transition: all 600ms cubic-bezier(0.42, 0, 1, 1);
  max-width: 90vw;
  max-height: 95vh;
}


/* Listenpunkte für Menue */
/**************************/
li.navMain {		/* "Container" für Hackbox Label "zu" */
	flex: 1 1 100%;
    width: 95%;
    border-radius: .4rem;
    background-color: rgb(55, 0, 15);
	background-color: rgba(55, 0, 15, 0.8);

}

li.mainmenu_AM {
	flex: 1 1 0%;
    margin: .1rem;
    padding: .3rem;
	border-radius: .4rem;
    background-color: rgb(55, 0, 15);
	background-color: rgba(55, 0, 15, 0.8);
	align-content: flex-start;
}
	
ul.detailmenu {
	display: none; /* "versteckt", sonst z.B. flex */
	flex-flow: column wrap;
    font-size: 1.1rem;
	margin: .1rem;
	padding: .15rem 0 .25rem .8rem;
    background-color: rgb(40, 0, 15);
    background-color: rgba(40, 0, 15, 0.8);
}

li.detailmenu {
	display:inline;
    margin: .1rem;
    padding: .3rem;
    background-color: rgb(85, 0, 10);
	background-color: rgba(85, 0, 10, 0.8);
}

ul.ankermenu,
ul.ankermenu_1,
ul.ankermenu_2,
ul.ankermenu_3,
ul.ankermenu_4,
ul.ankermenu_5,
ul.ankermenu_6 {
	display: flex;
	flex-flow: column wrap;
    font-size: 1.1rem;
	margin: .2rem;
	padding: .15rem 0 .25rem .8rem;
    background-color: rgb(40, 0, 15);
    background-color: rgba(40, 0, 15, 0.8);
}

li.ankermenu,
li.ankermenu_1,
li.ankermenu_2,
li.ankermenu_3,
li.ankermenu_4,
li.ankermenu_5,
li.ankermenu_6 {
	display:inline;
    padding: .3rem;
    background-color: rgb(100, 0, 25);
	background-color: rgba(100, 0, 25, 0.8);
}
li.ankermenu_1 {
    margin: .3rem .2rem .3rem 1rem;
}
li.ankermenu_2 {
    margin: .3rem .2rem .3rem 2rem;
}
li.ankermenu_3 {
    margin: .3rem .2rem .3rem 3rem;
    font-weight: normal;
}
li.ankermenu_4 {
    margin: .3rem .2rem .3rem 4rem;
    font-weight: normal;
}
li.ankermenu_5 {
    margin: .3rem .2rem .3rem 5rem;
    font-weight: normal;
}
li.ankermenu_6 {
    margin: .3rem .2rem .3rem 6rem;
    font-weight: normal;
}

/* Formatierung Links <a ...> */
/******************************/

.mainmenu_AM a {
	display: inline;
/*	background: url(../grafiken/arrow.gif) no-repeat center left ;  */
/* 	background-position: .3rem;     */
	padding: .15rem;
	margin: 0;
	text-decoration: none;
	}
/*.mainmenu_AM a:visited{
	color: #A41D00;
	}
.mainmenu_AM a:hover {
	color: #ffc000;
	}
/*
/* Hauptmenüpunkt */
.mainmenu_AM a.menu {
	}

/* Aktiver Hauptmenüpunkt */
.mainmenu_AM a.menuactive {
/*	background: url(../grafiken/arrowG.gif) no-repeat center left;
*/	}

/* Detailmenüpunkt */
.mainmenu_AM a.detailmenu {
/*	background-position:1.2rem center;
	padding: .15rem .15rem .2rem 2rem;
*/	}

/* Aktiver Detailmenüpunkt */
.mainmenu_AM a.detailmenuactive {
/*	background: url(../grafiken/arrowG.gif) no-repeat;
	background-position:1.2rem center;
	padding: .15rem .15rem .2rem 2rem;
*/	}

/* Submenüpunkt */
.mainmenu_AM a.submenu {
/*	background-position:1.2rem center;
	padding: .15rem .15rem .2rem 2rem;
*/	}
.mainmenu_AM a.submenuactive {
/*	background: url(../grafiken/arrowG.gif) no-repeat;
	background-position:1.2rem center; 
*/	}

/* Checkbox-Hack (für Mobile-Menu) */
/*********************************/

label.navMain {
	position: fixed;
	left: 0.5rem;
	top: 0.5rem;
	display: inline-block;
	z-index: 100;
	background-color: rgb(120,0,20);
	color: rgb(255,255,150);
	font-size: 2rem;
	text-decoration: none;
	border-radius: 50%;
	box-shadow: 0rem 0rem 0.5rem rgb(255,255,150);
	padding: 0.5rem 0.9rem;
	cursor: pointer;
	transition: all 500ms ease;
}

.navMain.auf::before {
	font-family: Sans-serif;
	content: "\2630";  /* der Burger  */
}

.hackbox.navMain:checked ~ label.navMain.auf {
	display:none;
}

.navMain.zu {
	position: unset;
    left: unset;
	top: unset;
	display: block;
	width: fit-content;
	z-index: 100;
	text-align: right;
	margin: .5rem .5rem .5rem auto;
	background-color: rgb(100, 0, 10);
	color: rgb(200, 200, 120);
	font-weight: bold;
	text-decoration: none;  
	font-size: 1.6rem;
	box-shadow: 0rem 0rem 0.4rem rgb(255,255,150);
}

.navMain.zu::before {
	font-family: Sans-serif;
	content: "\2716"; /* das Kreuz*/
}

/* Checkbox-Hack (für Detailmenu) */
/*********************************/

label.navCat {
    margin: .6rem;
	display: inline;
	cursor: pointer;
}

label.navCat::before {
	font-family: Sans-serif;
	content: "\25BC";  /* grosses Dreieck nach unten  */
}

.hackbox.navCat:checked ~ label.navCat::before {
	font-family: Sans-serif;
	content: "\25B2";  /* grosses Dreieck nach oben  */
}

.hackbox.navCat:checked ~ ul.detailmenu {
	display:flex;
}


/* *** Navigation Fix auf grossem Bildschirm *** */
/*************************************************/

@media all and (min-width: 80rem) {

	nav {
		margin: .4rem .4rem .6rem .4rem;
		padding: 0;
		flex: 1 1 0%;
		}
	
	label.navMain,
    li.navMain {
		display: none;
	}

	ul.mainmenu_AM {
        position: sticky;
        z-index: 90;
		display: flex;
		flex-flow: row;
        justify-content: space-between;
        align-items : flex-start;
    	align-content: flex-start;
		max-width: 98%;
		max-height: 60vh;
		margin: 0.2rem;
		border: .2rem solid #253678;
		padding: 0;
		border-radius: .5rem;
	}

}

/* Pulse Animation */
/*******************/
@keyframes pulse_animation {
    0% {
      transform: scale(1);
    }
    30% {
      transform: scale(1);
    }
    40% {
      transform: scale(1.08);
    }
    50% {
      transform: scale(1);
    }
    60% {
      transform: scale(1);
    }
    70% {
      transform: scale(1.05);
    }
    80% {
      transform: scale(1);
    }
    100% {
      transform: scale(1);
    }
  }

  .pulse {
    animation-name: pulse_animation;
    animation-duration: 5000ms;
    transform-origin: 70% 70%;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
  }
