.header
{
    background-color: rgba(0, 0, 0, 0.5);
    padding: 20px;
    margin-bottom: 20px;
}

.footer
{
    font-size: small;
    text-align: center;
}

.item
{
    margin-bottom: 20px;
    text-align: left;
    padding: 20px;
    background-color: rgba(0, 0, 0, 0.5);
}

.content
{
    margin-right: 0px;
    margin-left: 0px;
    /*background-color: black;*/
    padding: 0px;
}


.hat
{
    padding: 100px;
    text-align: center;
    margin-bottom: 20px;
}

.hat {
  width: 100px;
  perspective: 70px; /* gives it 3D depth */
  margin: 100px auto;
}

.hat img {
  width: 100%;
  height: 100%;
  display: block;
  transform-style: preserve-3d;
  animation: spin 1ms linear infinite;
}

/* Spin on all 3 axes */
@keyframes spin {
  0% {
    transform: rotateX(0deg) rotateY(0deg) rotateZ(0deg);
  }
  100% {
    transform: rotateX(360deg) rotateY(360deg) rotateZ(360deg);
  }
}

img
{
    max-width: 100%;
    max-height: 500px;
    display: block;
    margin-left: auto;
    margin-right: auto;
}


body {
    background-color: rgb(69, 0, 0);
    color: white;
    font-family: 'Lucida Console', Monaco, monospace;
    margin-right: 25%;
    margin-left: 25%;
    margin-top: 20px;
    background-image: url("/image/cheezballs.jpg");
    background-repeat: repeat-y;
    background-size: 100% auto;
    background-position: top center;
    background-attachment: fixed;
}

h3
{
    text-align: right;
}


a {
    color: yellow;
    text-decoration: underline;
}

a:hover {
    color: darkred;
}



@media (max-width: 800px)
{
  body
  {
    margin-right: 5%;
    margin-left: 5%;
  }
}