html * { margin: 0; padding: 0; font-family: georgia, times, serif; }
body { margin: 5em; }

/*
/**
/**   CSS Animation
/**
*/

html { animation: ease-in-out; animation-fill-mode: both; animation-duration: 3.25s; height:100%; }
body { height:100%; font-variant:small-caps; }
h1 { animation: ease-in-out; animation-fill-mode: both; animation-duration: 3s; }
.footer { position:absolute; bottom:5em; left:5em; }
.footer a { font-size:0.75em; color:#000; text-decoration:none; font-variant:small-caps; }

@keyframes rotateSome {
	0% { transform: rotate(-360deg); }
	100% { transform: rotate(0deg); } }
html { animation-name: rotateSome; }

@keyframes slideInFromRight {
	0% { transform: translate(100%,0%); }
	100% { transform: translate(0,0); } }
h1 { animation-name: slideInFromRight; }

/*
@keyframes rotateSomeY {
	0% { transform: rotateY(-360deg); }
	100% { transform: rotateY(0deg); } }
.y-not-try-y { animation-name: rotateSomeY; }
*/


.footer { opacity:0 }
.footer {
   -webkit-animation-duration: 21s;
   -webkit-transition-timing-function: ease-out;
   -webkit-animation-fill-mode: both;
   -webkit-animation-name: opacityFadeIn;
  animation-duration: 21s;
  transition-timing-function: ease-out;
  animation-fill-mode: both;
  animation-name: opacityFadeIn; }

@-webkit-keyframes opacityFadeIn {
	0% { opacity:0; }
	25% { opacity:0; }
	100% { opacity:1; } }
@keyframes opacityFadeIn {
	0% { opacity:0; }
	25% { opacity:0; }
	100% { opacity:1; } }


