body,html {margin:0 auto;padding:0;font-size:1em;font-family:arial,helvetica,sans-serif;max-width:98%;}

html {
	background: url("/_gr/background.jpg")	no-repeat center top fixed; 
/* 	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover; */
	background-size: cover;
	position:relative;
	}


div.sowhat {
 	position:absolute;
	top:10em;
	left:40em;
	background:#555;
	color:#00bfff;
	border:1px solid black;
	border-radius:14px;
	padding:1em;
	opacity:.6;
	max-width:16em;
	line-height:2em;
	 transform:translate(10em,0em);
	transition: all 2s;
	
	animation-name: example;
	animation-duration: 4s;
	z-index:99;
	}


div.nav {

  	position:absolute;
	top:10em;
	left:10em;
	background:#555;

	border:1px solid black;
	border-radius:14px;
	padding:1em;
	opacity:.6;
	max-width:16em;
	line-height:2em;
	transform-origin:top right;
	transform:translate(0em, 8em);
	transition:2s 0s all ease;
	animation-name: nav;
	animation-duration: 2s;
z-index:99;
}

a {color:#fff8dc;}


.ddiv {
   -webkit-animation-name: example; /* Safari 4.0 - 8.0 */
  -webkit-animation-duration: 4s; /* Safari 4.0 - 8.0 */ 

}


/* Standard syntax */
@keyframes example {
	from {background-color: #a0a;left:-80em;}
  to {background-color: #555;left:40em;top:10em;}
}

@keyframes nav {
	from {background-color: #0cc;left:-40em;}
  to {background-color: #555;left:10em;top:10em;}
}


.figl,.figc,.figl {margin:0;padding:.4em .2em;border:1px solid #eee;text-align:center;background:#aaa;border-radius:14px;}
.img_container {}
.image {border-radius:14px;}
.cap_container {background:#f5f5f5;border-radius:14px;}
.caption {}

div.special {position:absolute;top:15em;left:25em;}


/* 
			<figure class="figl" style="width:446px;">

					<div class="img_container">

						<img src="/klaumich.jpg" alt="" class="" width="442">

					</div>

					<figcaption class="caption">

						<div class="cap_container"></div>

					</figcaption>

			</figure>
 */