/* INDEX CSS */

body {
 background-color: black;
 background-image: url('/images/?.png');
 /*
 background-attachment: fixed;
 background-size: cover;
 background-position: center center;
 background-repeat: no-repeat;
 */
 margin-top: 5px;
}

h2 {
 font-family: 'HitMePunk';
 font-size: 3em;
 color: white;
 font-weight: normal;
}

h3 {
 font-size: 1.2em;
 font-weight: normal;
}

img {
 transition: transform .2s;
}

img:hover {
 transform: scale(1.1);
}

.image:hover {
 animation: shake 0.5s;
 animation-iteration-count: infinite;
}

@keyframes shake {
  0% { transform: translate(1px, 1px) rotate(0deg); }
  10% { transform: translate(-1px, -2px) rotate(-1deg); }
  20% { transform: translate(-3px, 0px) rotate(1deg); }
  30% { transform: translate(3px, 2px) rotate(0deg); }
  40% { transform: translate(1px, -1px) rotate(1deg); }
  50% { transform: translate(-1px, 2px) rotate(-1deg); }
  60% { transform: translate(-3px, 1px) rotate(0deg); }
  70% { transform: translate(3px, 1px) rotate(-1deg); }
  80% { transform: translate(-1px, -1px) rotate(1deg); }
  90% { transform: translate(1px, 2px) rotate(0deg); }
  100% { transform: translate(1px, -2px) rotate(-1deg); }
}

.box {
 font-family: 'Helvetica', sans-serif;
 font-size: 1em;
 color: white;
 text-align: center;
 max-width: 400px;
 padding: 10px;
 margin: auto;
 background-color: rgba(30, 30, 30, 0);
 border-radius: 10px;
}

.corner {
 position: fixed;
 bottom: 10px;
 right: 10px;
}

.image {
 padding: 0px;
}

a {
 color: white; 
 text-decoration: none;
}

a:hover {
 content: '>';
}

::selection {
 color: black;
 background: #dfe2e8;
}

mark { 
 background-color: black;
 color: white;
}

@font-face {
 font-family: 'HitMePunk';
 src: url('https://wolfsite.neocities.org/fonts/HitMePunk.ttf');
 font-weight: normal;
}