#container,
#wrapper,#main,
#main .inside,
.kachel {overflow: visible;}

.kachel ul,
.aufgabenlinks ul {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	padding: 0;
	margin: 0;
	list-style-type: none;
	font-weight: 400;
	font-family: 'BaWueSansWeb', sans-serif;
	position: relative;
overflow: visible;      
}


.kachel ul li,
.aufgabenlinks li {
	display: flex;
	align-items: flex-start;
	justify-content: flex-start;
	transition: all 0.15s ease;
	margin-bottom: 15px;
	border: 2px #000 solid;
	border-radius: 3px;
	position: relative;
	min-height: 50px;
	cursor: pointer;
overflow: visible;
}

.home .kachel ul.main-kachel > li {
	min-height: 300px;
}
.kachel ul li:hover {transform: scale(1.015) !important; -webkit-transition: all 0.15s; transition: all 0.15s;}  

.home .kachel ul.submenu li:nth-child(4) {
  	min-height: 150px;
}
.home .kachel ul.submenu li:nth-child(1),
.home .kachel ul.submenu li:nth-child(2),
.home .kachel ul.submenu li:nth-child(3) {
	min-height: 300px;
}

.kachel ul > li::after {
	content: "\2192";
	position: absolute;
	bottom: 20px;
	right: 30px;
	font-size: 40px;
opacity: 1;
-webkit-transition: all 0.3s; transition: all 0.3s;
}
.home.kachel ul > li::after {
	bottom: 30px;
}
.kachel ul > li:hover::after {
opacity: 1; 
}


.home .kachel ul.submenu li:nth-child(2)::after,
.home .kachel ul.submenu li:nth-child(3)::after,
.home .kachel ul.submenu li:nth-child(4)::after {
content: "\2192  zu den Aufgaben";
position: absolute;
bottom: 30px;
right: 30px;
font-size: 16px;
opacity: 1;
background: #000;
color: #fff;
display: inline-block;
padding: 5px 10px;
border-radius: 3px;
-webkit-transition: all 0.15s; transition: all 0.15s;
z-index: -1;
}
.home .kachel ul.submenu li:hover:nth-child(1)::after,
.home .kachel ul.submenu li:hover:nth-child(2)::after,
.home .kachel ul.submenu li:hover:nth-child(3)::after {
opacity: 1.0;  
}




.kachel ul > li:nth-child(1),
.kachel ul > li:nth-child(2) {
	width: 49.25%;
}

.kachel ul > li:nth-child(3),
.kachel ul > li:nth-child(4),
.kachel ul > li:nth-child(5) {
	width: 32.33%;
}

.kachel ul li span,
.kachel ul li a {
	display: block;
	width: 100%;
	text-align: left;
	font-size: 24px;
	font-weight: 700;
	text-decoration: none;
}
.kachel ul li span {
	padding: 30px 50px 30px 30px;
}

.kachel ul.submenu  {
padding-left: 50px;
}

.kachel ul .submenu li {
	width: 32.33%;
	min-height: 50px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 0px;
	transition: all 0.15s ease;
}
.home .kachel ul .submenu li  {
	min-height: 100px;
}

.home .kachel a {height: 100%; bottom: 0; top: 0;}

.kachel ul .submenu li:first-child {
	width: 90%;
	margin-bottom: 10px;
	height: 50px;
}

.kachel li.fragen { background: #DCF7A3; }
.kachel li.ueber { background: #D3F6FD; }
.kachel li.faq { background: #E5E1DC; 	width: 38.33% !important; }
.kachel li.workshop { background: #FFE7DB; 	width: 26.33% !important; }   
.kachel li.toolboxlink { background: #FFD9C4; }

.kachel span div {
	font-size: 18px;
	margin-top: 25px;
	font-weight: 400;
display: none;
}

.kachel ul .submenu.active li,
.aufgabenlinks li {
background: #DCF7A3;  
}

.aufgabenlinks ul {display: block; width: 100%; max-width: 500px; padding: 0 !important; margin: 0 !important;}
.aufgabenlinks ul li {font-size: 20px; font-weight: 600;  padding: 10px 10px; width: 100% !important; display: block; }  




.aufgabenlinks ul li a { text-decoration: none !important; -webkit-transition: all 0.3s; transition: all 0.3s; }
.XXaufgabenlinks ul li:hover { transform: scale(1.025) !important;transform-origin: left center !important;  } 
.mod_article,
.aufgabenlinks ul,
.aufgabenlinks ul li {overflow: visible;}


.aufgabenlinks ul > li::after {
	bottom: 0px;
	right: 40px;
}


.kachel ul .close-submenu {
width: 35px;	
position: absolute;
	top: 20px;
	right: 10px;
	cursor: pointer;
	font-weight: bold;
}

.kachel ul, .submenu {
	transition: opacity 0.15s ease, transform 0.15s ease;
}

.kachel ul.submenu {
display: none;
	opacity: 0;
	transform: translateY(-20px);
}
.kachel .submenu li {
background: #DCF7A3; 
}
.kachel .submenu li {
width: 32.33% !important;       
}
.kachel .submenu li:nth-child(4) {
width: 100% !important;
min-height: 80px;     
}
.home .kachel .submenu li:nth-child(1) {
width: 100% !important;
min-height: 30px !important;     
}
.home .kachel .submenu li:nth-child(4) {
width: 32.33% !important;
min-height: 80px;     
}

.kachel .close-submenu {
	position: absolute;
	top: 10px;
	left: 10px;
	font-size: 34px;
	cursor: pointer;
}


.kachel {margin-top: -80px;}
.home .kachel {margin-top: 0px;}        


 #menuicon {
    cursor: pointer;
    font-size: 45px;
    text-align: center;
    padding: 10px;
    user-select: none;
  }
 #menuicon span {
border-radius: 3px 3px 0 0;
display: inline-block;
background: #fff;
padding: 0px 8px 8px 8px;
  }
 #menuicon span.close {
padding: 0px 16px 8px 16px;
  }


  #hauptnav {
    display: none;
  }

 .home #menuicon {
    display: none;   
  }

 .home   #hauptnav {
    display: block;
  }




@media (max-width: 700px) {
.kachel li.faq,
.kachel li.workshop  {width: 100% !important; } 
.home .kachel .submenu li:nth-child(4) {
width: 100% !important;
     
}

.kachel {margin-top: -50px;} 
 #menuicon {
    font-size: 30px;
    padding: 10px;
  }
.kachel ul li {
	min-height: 50px;
}
.home .kachel ul.main-kachel > li {
	min-height: 100px;
}

.home .kachel ul.submenu li:nth-child(4) {
  	min-height: 50px;
}
.home .kachel ul.submenu li:nth-child(1),
.home .kachel ul.submenu li:nth-child(2),
.home .kachel ul.submenu li:nth-child(3) {
	min-height: 50px;
}
.home .kachel ul.submenu li:nth-child(1),
.home .kachel ul.submenu li:nth-child(2),
.home .kachel ul.submenu li:nth-child(3) {
padding-bottom: 50px;
}

.home .kachel span div {margin-top: 10px;}

	.kachel ul > li,
.kachel ul.submenu li {  
width: 100% !important;
margin-bottom: 5px;
	}

.kachel ul li span {
	padding: 15px 25px 15px 15px;
}

.kachel ul li span,
.kachel ul li a {
	font-size: 19px;
}
span div {
	font-size: 14px;

}
.kachel ul > li::after {
font-size: 26px; 
right: 15px;
opacity: 1; 
bottom: 15px;
}
.home .kachel ul.submenu li:nth-child(n+2) {
padding-bottom: 50px;
}
.kachel ul.submenu li:nth-child(n+2)::after {
right: 15px;
bottom: 15px; 
opacity: 1;
display: block;
}



.home .kachel ul.submenu li:nth-child(1)::after,
.home .kachel ul.submenu li:nth-child(2)::after,
.home .kachel ul.submenu li:nth-child(3)::after {
bottom: 15px;
right: 15px;
font-size: 16px;
opacity: 1;
}


}

  .farblinks li {padding: 0 !important;}
 .farblinks li a {position: relative; padding: 10px 10px; display: block; -webkit-transition: all 0.3s; transition: all 0.3s; z-index: 99999; }
 .farblinks li a:hover {padding: 10px 6px 10px 13px; display: block; } 


 .farblinks li a::after {
	content: "\2192";
	position: absolute;
	right:20px !important;
	font-size: 40px;
top: -7px;
opacity: 0.25;
-webkit-transition: all 0.15s; transition: all 0.15s;
}
 .farblinks li a:hover::after {
opacity: 1; 
}



.main-kachel li.fragen,
.submenu li.fragen  {background: #00A770;}
.main-kachel li.ueber {background: #64C7F2;}   
.main-kachel li.faq {background:#FFED00;}   
.main-kachel li.workshop {background: #A199CA;}   
.main-kachel li.toolboxlink {background: #F5B4D2;}
   
.submenu  li.suf,
.farblinks  li.suf {background: #FBBB00;}
.submenu  li.sug,
.farblinks  li.sug {background: #00B0EB;}
.submenu  li.ka,
.farblinks  li.ka {background: #F07F00;}   





.main-kachel.kaz  li.landeskunde {background: #FBBB00;} 
.main-kachel.kaz li.kreativ {background: #F07F00;} 
.main-kachel.kaz li.ueber {width: 100%; background: #64C7F2;} 




 @media (min-width: 701px) {  
.kachel.unterseite .submenu .fragen {width: 100% !important;  }
.kachel.unterseite .submenu .suf {width: 32.33% !important;  } 
.kachel.unterseite .submenu .sug {width: 32.33% !important;  } 
.kachel.unterseite .submenu li.ka,
.kachel.unterseite .submenu .ka { width: 32.33% !important; }
 }

