/*Farben: Rot=#8B0000, Grün=#4e6b1d, Gold=#FFD700, Dunkelgold=#8B6508, Blau=#4169E1, Orange=#FF7F24, Braun=#B8860B, Grau=#CDC9C9*/

/*Hintergrund*/
body {
  	width: 100%;
  	height: auto;
  	-webkit-animation: pulse 150s infinite;
	animation: pulse 150s infinite;
}
@-webkit-keyframes pulse {
	0% {background-color: #FFD700;}
  	33% {background-color: #8B0000;}
	66% {background-color: #4e6b1d;}
	100% {background-color: #FFD700;}
}
@keyframes pulse {
	0% {background-color: #FFD700;}
  	33% {background-color: #8B0000;}
	66% {background-color: #4e6b1d;}
	100% {background-color: #FFD700;}
}

/*body {
	width: 100%;
    height: auto;
	background: #8B6508;
    background-image: url("inhalt/zeichnung-elchkopf.gif");
    background-repeat: no-repeat;
   	background-position: relative;
	background-attachment: fixed;
	background-size: cover;
	-webkit-background-size: cover;
	-moz-background-size: cover;
}*/

/*Layer1*/
#layer1 {
	width: 980px;
	height: auto;
	margin: 5px auto; /*Abstand von oben*/
	padding: 0px;
	border: 5px double #8B0000;
	position: relative;
	background: #FFD700; /*Hintergrundfarbe Rahmen*/
	box-shadow: 0 0 15px black;
	-webkit-box-shadow: 0 0 15px black;
	-moz-box-shadow: 0 0 15px black;
}

/*Layer2 - Grün*/
#layer2 {
	width: 960px;
	height: auto;
	margin: 5px auto; /*Abstand von oben*/
	padding: 20px;
	border: 5px double #4e6b1d;
	position: relative;
	background: #4e6b1d; /*Hintergrundfarbe*/
	box-shadow: 0 0 10px black;
	-webkit-box-shadow: 0 0 10px black;
	-moz-box-shadow: 0 0 10px black;
}

/*Layer - Rot*/
#layer-rot {
	width: 960px;
	height: auto;
	margin: 5px auto; /*Abstand von oben*/
	padding: 20px;
	border: 5px double #4e6b1d;
	position: relative;
	background: #8B0000; /*Hintergrundfarbe*/
	box-shadow: 0 0 10px black;
	-webkit-box-shadow: 0 0 10px black;
	-moz-box-shadow: 0 0 10px black;
}

/*Layer - Blau*/
#layer-blau {
	width: 960px;
	height: auto;
	margin: 5px auto; /*Abstand von oben*/
	padding: 20px;
	border: 5px double #4e6b1d;
	position: relative;
	background: #4169E1; /*Hintergrundfarbe*/
	box-shadow: 0 0 10px black;
	-webkit-box-shadow: 0 0 10px black;
	-moz-box-shadow: 0 0 10px black;
}

/*Layer - Gold*/
#layer-gold {
	width: 960px;
	height: auto;
	margin: 5px auto; /*Abstand von oben*/
	padding: 20px;
	border: 5px double #4e6b1d;
	position: relative;
	background: #FFD700; /*Hintergrundfarbe*/
	box-shadow: 0 0 10px black;
	-webkit-box-shadow: 0 0 10px black;
	-moz-box-shadow: 0 0 10px black;
}

/*Layer - Braun*/
#layer-braun {
	width: 960px;
	height: auto;
	margin: 5px auto; /*Abstand von oben*/
	padding: 20px;
	border: 5px double #4e6b1d;
	position: relative;
	background: #B8860B; /*Hintergrundfarbe*/
	box-shadow: 0 0 10px black;
	-webkit-box-shadow: 0 0 10px black;
	-moz-box-shadow: 0 0 10px black;
}

/*Layer - Grau*/
#layer-grau {
	width: 960px;
	height: auto;
	margin: 5px auto; /*Abstand von oben*/
	padding: 20px;
	border: 5px double #4e6b1d;
	position: relative;
	background: #CDC9C9; /*Hintergrundfarbe*/
	box-shadow: 0 0 10px black;
	-webkit-box-shadow: 0 0 10px black;
	-moz-box-shadow: 0 0 10px black;
}

/*Drop Down Menü*/
* {
  margin: 0;
  padding: 0;
  font-family: arial, verdana, sans-serif;
  box-sizing: border-box;
}
nav {
  float: left; 
  width: 100%;
  background: #6e8b3d; /*Hintergrundfarbe der Hauptpunkte*/
  font-size: 20px;
  text-shadow: black 3px 2px 4px;
}
nav ul {
  margin: 0;
  padding: 0;
}
nav a {
  display: block;
  width: 135px;
  color: #FFD700;/*Schriftfarbe*/
  text-decoration: none;
}
nav ul li {
  position: relative;
  float: left;
  list-style: none;
  color: #ffa500; /*Farbe???*/
  transition: 0.5s;
}
nav ul li a {
  padding: 15px;
}
nav ul > li.submenu > a:after {
  position: relative;
  float: right;
  content: '';
  margin-left: 10px;
  margin-top: 5px;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-top: 5px solid #fff;
  border-bottom: 5px solid transparent;
}
nav ul ul li.submenu > a:after {
  margin-left: auto;
  margin-right: -10px;
  border-left: 5px solid #fff;
  border-right: 5px solid transparent;
  border-top: 5px solid transparent;
  border-bottom: 5px solid transparent;
}
nav ul li:hover {
  background: #a2cd5a; /*Hovereinfärbung*/
}
nav ul ul {
  position: absolute;
  top: -9999px;
  left: -9999px;
  background: #6e8b3d; /*Hintergrundfarbe der Unterpunkte*/
  box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5);
  z-index: 2;
}
nav ul ul li {
  float: none;
  width: 200px;
  border-bottom: 1px solid #555;
}
nav ul ul li a {
  padding: 15px 20px;
}
nav ul ul li:last-child {
  border-bottom: none;
}
nav ul li:hover > ul {
  top: 100%;
  left: 0;
}
nav ul ul li:hover > ul {
  top: 0;
  left: 200px;
}

/*Begrüßungsbox*/
.animation {
    height: 60px;
    width: 90px;
    background-color: #FFD700;
	border: 2px solid #8B6914;
    border-radius: 20px;
	padding: 3px;
    margin: 0px;
	position: relative;
	/*z-index: +1;*/
    /* Chrome, Safari, Opera */
    -webkit-animation-name: animation;
    -webkit-animation-duration: 25s;
    -webkit-animation-timing-function: linear;
    -webkit-animation-delay: 0s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-direction: normal;
    /* Standard syntax */
    animation-name: animation;
    animation-duration: 25s;
    animation-timing-function: linear;
    animation-delay: 0s;
    animation-iteration-count: infinite;
    animation-direction: normal;
}

/* Chrome, Safari, Opera 130, 70(640x360) (800x450)*/
@-webkit-keyframes animation {
    0%   {background-color:#FFD700; left:-35px; top:0px;}
    25%  {background-color:#8B0000; left:855px; top:0px;}
    50%  {background-color:#4e6b1d; left:855px; top:510px;}
    75%  {background-color:#8B0000; left:-35px; top:510px;}
    100% {background-color:#FFD700; left:-35px; top:0px;}
}

/* Standard syntax */
@keyframes animation {
    0%   {background-color:#FFD700; left:-35px; top:0px;}
    25%  {background-color:#8B0000; left:855px; top:0px;}
    50%  {background-color:#4e6b1d; left:855px; top:510px;}
    75%  {background-color:#8B0000; left:-35px; top:510px;}
	100% {background-color:#FFD700; left:-35px; top:0px;}
}