body { 
  margin: 0;
  background: #333333; 
  font-family: 'Mate', serif;
}

.message{
  margin: 10% 10% 0 10%;
  display: block;
  text-align: center;

  color: #df981d;
  font-family: 'Josefin Sans',sans-serif;
  text-transform: uppercase;
  font-size: 8em;
  font-weight: 400;
}

.repeat {
  margin-left: 25%;
  display: block;
  text-align: center;

  color: #df981d;
  font-family: 'Mate', serif;
  font-size: 2em;
  font-weight: 400;
}

h2 {
  color: #df981d;
  margin: 10% 1% 1% 1%;
  font-weight: normal;
}

ul {
  margin: 0;
  padding: 0;
  list-style-type: none;
}

.stamp {
  display: block;
  width: 98%;

  font-size: 2em;
  color: #fff;
  text-shadow: 0px -1px 0px #374683;
  text-decoration: none;
  text-align: center;

  padding: 1%;
  background-image: -ms-linear-gradient(top left, #C00000 0%, #B30000 100%);
  background-image: -moz-linear-gradient(top left, #C00000 0%, #B30000 100%); 
  background-image: -o-linear-gradient(top left, #C00000 0%, #B30000 100%);
  background-image: -webkit-gradient(linear, left top, right bottom, color-stop(0, #C00000), color-stop(1, #B30000));
  background-image: -webkit-linear-gradient(top left, #C00000 0%, #B30000 100%);
  background-image: linear-gradient(to bottom right, #C00000 0%, #B30000 100%);

  transition: all 0.2s ease-in-out;
}

.tagline {
  display: block;
  width: 100%;
  margin-bottom: 0.5em;
  font-size: 0.80em;
  font-family: 'Lobster', cursive;
  font-weight: 300;
}

.link {
  font-family: sans-serif;
  text-transform: uppercase;
}

.stamp:hover{
  background-image: -ms-linear-gradient(top left, #CC0000 0%, #CD0000 100%);
  background-image: -moz-linear-gradient(top left, #CC0000 0%, #CD0000 100%); 
  background-image: -o-linear-gradient(top left, #CC0000 0%, #CD0000 100%);
  background-image: -webkit-gradient(linear, left top, right bottom, color-stop(0, #CC0000), color-stop(1, #CD0000));
  background-image: -webkit-linear-gradient(top left, #CC0000 0%, #CD0000 100%);
  background-image: linear-gradient(to bottom right, #CC0000 0%, #CD0000 100%);
}

.stamp:hover .link {
  text-decoration: underline;
}

.footer {
  margin: 6% 1% 1% 1%;
  font-size: 1.1em;
  color: #df981d;
  text-align: right;
}

.footer a {
  color: #f6a820;
}

.footer a:hover {
  text-decoration: none;
}

@media only screen and (max-width: 767px) {
  
  .message {
    font-size: 5em;
  }

  h2 {
    font-size: 0.92em;
  }

  .stamp {
    font-size: 1.4em;
  }

}

@media only screen and (max-width: 529px) {
  h2 {
    font-size: 0.85em;
  }

  footer {
    font-size: 0.80em;
  }
}