body, html, .center-inner, .center-outer { 
  height: 100%; 
}

@font-face {
	font-family: "8bitoperator";
	src: url( "8bitoperator.ttf" );
}

body {
  color: white;
  background-color: black;
  font-family: "8bitoperator", monospace;
  margin: 0;
}


.clicked { 
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s;
}
.clicked { 
  transform:rotate(15deg); -webkit-transform:rotate(15deg); -moz-transform:rotate(15deg); -o-transform:rotate(15deg);
}

#pets {
  font-size: 32px;
}

@keyframes YELLING {
  0% { font-size: 3em; }
  50% { font-size: 4em; }
  100% { font-size: 3em; }
}

@-moz-keyframes spin {
    from { -moz-transform: rotate(0deg); }
    to { -moz-transform: rotate(360deg); }
}
@-webkit-keyframes spin {
    from { -webkit-transform: rotate(0deg); }
    to { -webkit-transform: rotate(360deg); }
}
@keyframes spin {
    from {transform:rotate(0deg);}
    to {transform:rotate(360deg);}
}

#yelling {
  height: 100px;
  font-size: 4em;
  animation-name: YELLING;
  animation-duration: 1s;
  animation-iteration-count: infinite;
}

#dog_div {
  margin-top: 100px;
}

#dog {
  cursor: pointer;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
   user-select: none;
}

#contactinfo {
  color: #3d3d3d;
  position: absolute;
  font-size: 12px;
  bottom: 1%;
  right: 3%;
}


a:hover, a:visited, a:link, a:active
{
    text-decoration: none;
    color: white;
}



.center-outer {
	display: table;
	margin: auto;
}

.center-inner {
	display: table-cell;
	vertical-align: middle;
  text-align: center;
}