@import url('https://fonts.googleapis.com/css?family=Caveat|Gloria+Hallelujah');

a:link {	color: #002d00ff; 	background-color: white;}
a:active { color: gray; text-decoration: none;}
a:visited { color: gray; text-decoration: none; }
a:hover { color: green; text-decoration: none;}

body { font-family: Caveat; font-size: 24px;}
.wrapper {width: 600px; margin: auto;}
.contentArea {}

.rahmen_i {width:100%; background-color:#F9F9F9; margin:0% 0% 0% 0%; padding: 3px; border: 2px solid gray; box-shadow: 0px -2px 4px 2px gray inset;}
.rahmen_a {width:540px; background-color:#F9F9F9; margin:1% 0% 0% 0%; padding: 6%; box-shadow: 2px 2px 4px 2px gray;}

p.c14i150 { padding: 0px 2% 0px 2%; font-family: Caveat;  font-size: 18px; font-style: italic; color: #333333; line-height:125%; text-align: center;}

ul#pfeiltasten {margin: 0 0 1% 0%; padding: 0; text-align: center;}
ul#pfeiltasten li {display: inline;}
ul#pfeiltasten li a {background-color: #F9F9F9; color: gray; font-weight: bold; text-decoration: none; border-radius: 10px;}
ul#pfeiltasten li a:hover {background-color: #DDDDDD;}


.banner {  height: 30px; overflow: hidden; position: relative; }
.banner h4 { position: absolute; width: 110%; height: 100%; margin: 0; font-family: Caveat; font-size: 28px; color: orange; background-color: #ffea93f; text-align: center;
 /* Starting position */ transform:translateX(98%); /*100%=Beginn am rechten Rand*/
 /* Apply animation to this element */ animation: banner 12s linear infinite; }
 @keyframes banner { 0% { transform: translateX(101%);} /*Startverzögerung/Beginn rechter Rand*/ 92% { transform: translateX(-101%); } /*Rücklauf*/ }