.navY {
	  position: absolute;
	  width: 100%;
	  top: 0;
	  left: 0;
	  background: #2a2a2a;
	  font-size: 16px;
	  box-shadow: 0 0 10px rgba(0,0,0,1);
	}

	 /*Verweise (a) und Listenelemente (li) deklarieren wir wie folgt:-->*/
	.navY a {
	  display: block;
	  color: #fff;
	  text-decoration: none;
	}
	 

	.navY li {
	  display: inline-block;
	  color: #fff;
	  list-style: none;
	  transition: 0.5s;
	}

	.navY > ul {
	  position: relative;
	  width: 800px;
	  margin: 0 auto;
	  padding: 0;
	  text-align: center;
	}

	/*Für die Links der Hauptmenüebene definieren wir Innenabstände:*/
	.navY > ul > li > a {
	  padding: 15px 25px;
	}	

	/*Den Pfeil stellen wir mit einem kleinen Trick dar, den ich in diesem Beitrag näher beschrieben habe. Wir nutzen dazu die Rahmen-Eigenschaft (border)*/
	.navY ul > li.submenu > a:after {
	  position: relative;
	  float: right;
	  content: '';
	  margin-left: 10px;
	  margin-top: 8px;
	  border-left: 5px solid transparent;
	  border-right: 5px solid transparent;
	  border-top: 5px solid #fff;
	  border-bottom: 5px solid transparent;
	}
	
	/*Wenn der Menüpunkt mit Untermenü gehovert wird, soll sich der Pfeil verändern und nach oben zeigen. Dazu tauschen wir lediglich die Farbe der Rahmenlinien oben und unten:*/
	.navY ul > li.submenu:hover > a:after {
	  margin-top: 2px;
	  border-top: 5px solid transparent;
	  border-bottom: 5px solid #fff;
	}	
	
/*Beim hovern der Hauptmenüpunkte soll sich die Hintergrundfarbe ändern. Um das zu erreichen deklarieren wir:*/	
	.navY > ul > li:hover {
	  background: #4096ee;
	}

/*Nächster Stop: die Mega-Menü-Ebene:*/
 .navY ul.megamenu {
  position: absolute;
  width: 800px;
  top: -9999px;
  left: 0;
  padding: 40px 40px 0 40px;
  background: #fff;
  text-align: left;
  border-top: 5px solid #4096ee;
  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.5);
  z-index: 1;
}

/*Damit das Mega-Menü erst eingeblendet wird, wenn der Hauptmenüpunkt gehovert wird, setzen wir die top-Position zunächst weit außerhalb des sichtbaren Bereichs und bei hover dann direkt unterhalb die Hauptmenüebene:*/
	
.navY ul li:hover ul.megamenu {
  top: 100%;
}


/*Wir wollen drei Untermenüs nebeneinander positionieren. Dazu fügen wir drei Spalten ein, wobei jede Spalte eine Breite von 32% sowie einen Außenabstand nach rechts von 2% bekommt.*/

.navY .column {
  float: left;
  width: 32%;
  margin-right: 2%;
}

/*Die rechte und letzte Spalte benötigt keinen Außenabstand nach rechts, da wir ja bereits einen Innenabstand für das Mega-Menü deklariert haben. Um den Außenabstand für die letzte Spalte, oder genauer gesagt das letzte Kindelement des .navY-Containers mit der Klasse .column auf Null zu setzten, nutzen wir das Pseudoelement :last-child:*/

	
.navY .column:last-child {
  margin-right: 0;
}