html, body, div, dl, dt, dd, h1, h2, h3, h4, h5, h6, ul, pre, code, textarea, p, blockquote, th, td {
  margin: 0;
  padding: 0;
  border: 0 none; }

html {
  overflow:hidden;
}
html, body {
  background:#fff;
  background:rgb(255, 252, 252);
  height: 100%;
  text-align: center;
  font-family: Helvetica, arial, sans-serif;
  font-size: 13px;
  color: #212121; }

article, header, footer, aside, nav, canvas { display:block; }

a, a:link, a:visited, a:hover, a:active {
  color:rgb(89, 0, 255);
}

body {
  position:relative;
}

canvas {
  padding:0;
	background-color:#fff;
  background-color:rgb(255, 252, 252);
	margin:0;
}
.content {
  position:fixed;
  top:0;
  left:0;
  width:100%;
  height:100%;
  min-height:480px;
  text-align:left;
  cursor:pointer;
  cursor:-moz-grab;
  cursor:-webkit-grab;
}
.content.grab {
  cursor:-moz-grabbing;
  cursor:-webkit-grabbing; 
}

h1 {
  font-size:1.75em;
  color:#fff;
  text-align:center;
/*  text-shadow:1px 1px 0 rgb(255, 70, 62);*/
  text-shadow:0 2px 0 #ff3333, 0 2px 0 #ffC9C9, 0 3px 0 #ffBBBB, 0 4px 0 #ffB9B9, 0 5px 0 #ffAAAA,
    0 6px 1px rgba(150, 30, 30, 0.1), 0 0 5px rgba(150, 30, 30, 0.1),
    0 1px 3px rgba(150, 30, 30, 0.3), 0 3px 5px rgba(150, 30, 30, 0.2),
    0 5px 10px rgba(150, 30, 30, 0.25), 0 10px 10px rgba(150, 30, 30, 0.2),
    0 20px 20px rgba(150, 30, 30, 0.15);
  top:35%;
  position:relative;
  line-height:1.2em;
  padding:0.25em 0.5em;
  font-weight:normal;
  box-shadow:0 0 5px rgba(255,255,255,0.5);
  background:rgba(255,255,255,0.2);
  -moz-transition:all 5s ease-in-out;
  -webkit-transition:all 0.5s ease-in-out;
}
body:hover h1 {
/*  -moz-transform: scale(1.5);*/
/*  -webkit-transform: scale(1.1);*/
  -webkit-animation: pulsate 2s ease-out;
  -webkit-animation-iteration-count: 5;
}
body:hover h1 span {
  -webkit-transform:scale(1.2);
  -webkit-animation: pulsate 1s ease-out;
  -webkit-animation-iteration-count: 5;

}
h1 span {
  color:#de0000;
  font-family:Georgia, Times, "Times New Roman", serif;
/*  text-shadow:2px 2px 1px #fff;*/
  text-shadow:0 2px 0 #ffffff, 0 2px 0 #ffC9C9, 0 3px 0 #ffBBBB, 0 4px 0 #ffB9B9, 0 5px 0 #ffAAAA,
  0 6px 1px rgba(150, 30, 30, 0.1), 0 0 5px rgba(150, 30, 30, 0.1),
  0 1px 3px rgba(150, 30, 30, 0.3), 0 3px 5px rgba(150, 30, 30, 0.2),
  0 5px 10px rgba(150, 30, 30, 0.25), 0 10px 10px rgba(150, 30, 30, 0.2),
  0 20px 20px rgba(150, 30, 30, 0.15);
}

header {

  width:100%;
  margin:0 auto;
  line-height:1.5em;
  text-align:left;
  position:fixed;
  top:0;
  left:0;
}
form {
  display:none;
  background:#fff;
  padding-left:250px;
  min-height:64px;
  line-height:64px;
  font-size:1.5em;
}
label {

}
input[type="text"], input[type="password"], input[type="email"] {
  font-size: 1em;
  width: 20%;
  max-width:150px; 
  text-indent:10px;
  padding:0;
  background:ivory;
  margin:0 0.25em;
  border:0 none;
  font-family:cursive;
  color:#ee6666;
  -webkit-box-shadow:0 2px 0 rgb(255, 0, 161);
  -moz-box-shadow:0 2px 0 rgb(255, 0, 161);
  box-shadow:0 2px 0 rgb(255, 0, 161); /* #FF00A1 */
  }

footer {
  position:fixed;
  top:0;
  right:0;
}
footer cite {
/*  font-style:normal;*/
  font-size:120%;
  font-family:cursive;
  line-height:34px;
  padding:0 1em 0 0;
  position:relative;
}
footer cite a {
  text-decoration:none;
  vertical-align:text-top;
  font-size:90%;
  line-height:54px;
}
.button {
  cursor: pointer;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 80%;
  color: #525252;
  vertical-align:text-bottom;
  padding: 0.15em 1.5em;
  background: -webkit-gradient(linear, left top, left bottom, from(white), color-stop(0.5, #ebebeb), color-stop(0.5, #f5f5f5), to(#dbdbdb));
  background: -moz-linear-gradient(top, white 0%, #ebebeb 50%, #f5f5f5 50%, #dbdbdb);
  border: 1px solid #a1a1a1;
  text-shadow: 0 -1px 0 rgba(143, 143, 143, 0.2), 0 1px 0 white;
  text-decoration: none;
  text-align: center;
  line-height: 1.35em;
  -webkit-border-radius: 9px;
  -moz-border-radius: 9px;
  -msie-border-radius: 9px;
  border-radius: 9px;
  -webkit-box-shadow: 0 1px 3px rgba(56, 56, 56, 0.5), inset 0 0 2px #dbdbdb;
  -moz-box-shadow: 0 1px 3px rgba(56, 56, 56, 0.5), inset 0 0 2px #dbdbdb;
  -msie-box-shadow: 0 1px 3px rgba(56, 56, 56, 0.5), inset 0 0 2px #dbdbdb;
  box-shadow: 0 1px 3px rgba(56, 56, 56, 0.5), inset 0 0 2px #dbdbdb;
  display: inline-block;
  margin:0 1em;
  }
  .btn:hover, input[type="submit"]:hover, input[type="reset"]:hover {
    -webkit-box-shadow: 0 0 0 rgba(56, 56, 56, 0.7), inset 0 0 2px #dbdbdb;
    -moz-box-shadow: 0 0 0 rgba(56, 56, 56, 0.7), inset 0 0 2px #dbdbdb;
    -msie-box-shadow: 0 0 0 rgba(56, 56, 56, 0.7), inset 0 0 2px #dbdbdb;
    box-shadow: 0 0 0 rgba(56, 56, 56, 0.7), inset 0 0 2px #dbdbdb;
    text-shadow: 0 0 0 rgba(143, 143, 143, 0), 0 0 0 rgba(255, 255, 255, 0);
    text-decoration: none; }
  .btn:active, input[type="submit"]:active, input[type="reset"]:active {
    color: #ebebeb;
    background: -webkit-gradient(linear, left top, left bottom, from(#cccccc), to(#757575));
    background: -moz-linear-gradient(top, #cccccc 0%, #757575);
    -webkit-box-shadow: 0 0 0 rgba(56, 56, 56, 0.7), inset 0 0 2px #dbdbdb;
    -moz-box-shadow: 0 0 0 rgba(56, 56, 56, 0.7), inset 0 0 2px #dbdbdb;
    -msie-box-shadow: 0 0 0 rgba(56, 56, 56, 0.7), inset 0 0 2px #dbdbdb;
    box-shadow: 0 0 0 rgba(56, 56, 56, 0.7), inset 0 0 2px #dbdbdb;
    text-shadow: 0 0 0 rgba(143, 143, 143, 0), 0 0 0 rgba(255, 255, 255, 0); }

.credit {
  display:block;
  position:relative;
  font-size:85%;
  line-height:1.5em;
  top:260px;
  left:0;
/*  width:100%;*/
  height:40px;
  background:#fff;
  text-align:center;
/*  padding:0.25em 0.25em 0.5em 0.25em;*/
  z-index:3;
  -webkit-box-shadow:0 -2px 1px rgb(255, 0, 161);
  -moz-box-shadow:0 -2px 1px rgb(255, 0, 161);
  box-shadow:0 -2px 1px rgb(255, 0, 161);
}
.credit p {
  margin-bottom:0.25em;
}

@-webkit-keyframes pulsate {
    0% { -webkit-transform:scale(1.01); }
    10% { -webkit-transform:scale(1.02); }
    50% {-webkit-transform:scale(1.05); }
    90% { -webkit-transform:scale(1.02); }
    100% { -webkit-transform:scale(1.01); }
 }

@media only screen and (min-width: 600px) {
  canvas { margin-top:67px; }
  header {
    background:#fff;
    -webkit-box-shadow:0 2px 1px rgb(255, 0, 161);
    -moz-box-shadow:0 2px 1px rgb(255, 0, 161);
    box-shadow:0 2px 1px rgb(255, 0, 161);
  }
  header .credit {
    padding:1em 0.5em 1em 1em;
    width:85px;
    text-align:left; 
    position:absolute;
    top:0;
    line-height:1.5em;
    height:auto;
    -webkit-box-shadow:0 2px 1px rgb(255, 0, 161);
    -moz-box-shadow:0 2px 1px rgb(255, 0, 161);
    box-shadow:0 2px 1px rgb(255, 0, 161);
    -webkit-border-radius:0 0 7em;
    -moz-border-radius:0 0 7em;
    border-radius:0 0 7em;
  }
 footer cite {
   font-size:150%;
    line-height:64px;
    padding:0 2em 0 0;
    
  }
  .content {
      top:64px;
  }
  header .credit p { margin-bottom:1em; }
  header form { display:block; }
  h1 { font-size:5em; top:35%; }
}
