@keyframes ximage {
  from {
    transform: rotate(5deg);
  }

  to {
    transform: rotate(7deg);
  }
}

@font-face {
  font-family: 'blokheavy';
  src: url('../fonts/blok-webfont.woff2') format('woff2'),
    url('../fonts/blok-webfont.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'ifregular';
  src: url('../fonts/if-webfont.woff2') format('woff2'),
    url('../fonts/if-webfont.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'punk_kid';
  src: url('../fonts/punk_kid-webfont.woff2') format('woff2'),
    url('../fonts/punk_kid-webfont.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'tamette_punkdomed';
  src: url('../fonts/tamette_punkdomed-webfont.woff2') format('woff2'),
    url('../fonts/tamette_punkdomed-webfont.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}

body {
  background-color: black;
  font-family: 'ifregular', Impact, Arial Black, sans-serif;
  font-size: 1.5rem;
  height: 100%;
  line-height: 1;
  text-align: center;
  align-content: center;
  color: white;
}

.alttext {
  color: #e30613;
  font-family: 'ifregular', Impact, Arial Black, sans-serif;
}

.alttext-link:hover {
  color: white;
}

.biglogo {
  animation-name: ximage;
  animation-duration: 10s;
  animation-direction: alternate;
  animation-timing-function: ease-in-out;
  animation-iteration-count: infinite;
  position: relative;
  left: 20px;
  width: 60%;
  transform: rotate(5deg);
}

.biocontainer {
  background-image: url("../images/bricksbw.jpg");
  background-size: 100%;
  /* font-family: 'tamette_punkdomed', Courier, monospace; */
  font-size: 1.5rem;
  padding: 5%;
  padding-top: 40px;
  text-align: center;
}

.biotext {
  position: relative;
  margin: auto;
  max-width: 900px;
}

.carousel {
  background-color: black;
}

.carousel-inner {
  margin: auto;
  max-width: 900px;
  position: relative;
}

.headercontainer {
  align-content: center;
  background-color: black;
  position: fixed;
  z-index: 1;
}

.headeroffset {
  height: 40px;
}

.socialbuttons {
  color: #e30613;
  padding: 10px;
}

.socialbuttons:hover {
  color: white;
}

.socialmedia {
  background-image: url("../images/bricksbw.jpg");
  background-size: 100%;
  font-size: 4rem;
  padding: 50px;
}

.textleft {
  text-align: left;
}

.textright {
  text-align: right;
}

.topsection {
  align-content: center;
  background-image: url(../images/band4greyscalecontrast.jpg);
  background-repeat: no-repeat;
  background-position: top;
  background-size: 100%;
  width: 100%;
}