body {
  background-image: url("../assets/shitbrick.png");
  background-color: #223169;
  /*background-size: 100%;*/



  margin: 25px;
}

.tempHeader {
  font-size: 75px;
  /*background-color: rgba(255, 0, 0, 0.85);*/
  border-radius: 25px;
  padding: 25px;
  font-family: Helvetica, sans-serif;
  color: rgb(255, 0, 0);
  text-shadow: 2px 2px black;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.tempHeader img {
  width: 40vw;
  height: auto;
}

.subtitle {
  font-size: 35px;
}

.parentlinkbox {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.linkbox {
  display: flex;
  flex-wrap: wrap;
  gap: 45px;
}

.runchplaint {
  font-family: Helvetica, sans-serif;
  font-size: 25px;
}

.runchplaint2 {
  font-size: 15px;
}

.twitter {
  color: #008AD8
}

.twitter:hover {
  color: #39b6ff
}

.tumblr {
  color: #416496;
}

.tumblr:hover {
  color: #7891b5;
}

.bluesky {
  color: #0477ce
}

.bluesky:hover {
  color: #40a5f2
}

.lastfm {
  color: rgb(192, 56, 56)
}

.lastfm:hover {
  color: rgb(228, 113, 113)
}

.linkbox a {
  text-decoration: none;
  font-size: 72px;
  font-family: Helvetica, sans-serif;

  text-shadow: black 2px 2px;
}

.tumblrTempLink a {
  color: rgb(0 241 255);
  font-size: 72px;


}

.tumblrTempLink a:hover {
  color: rgb(182, 251, 255);
}

#contentBox {
  display: flex;
  flex-direction: column;
  align-items: center;

  justify-content: space-between;

  margin: auto;

  /*background-color: rgba(100, 100, 100, .5);*/
  /*border-style: solid;
  border-color: grey;*/

  width: 100%;
  min-height: 700px;
}

#selectBox {
  display: flex;
  justify-content: center;
  flex-direction: row;
  width: 100%;

  gap: 5%;
}

.animatedButton {
  display: none;
}

.imgButton:hover .animatedButton {
  display: inline;
}

.imgButton:hover .staticButton {
  display: none;
}

.animatedButton img {
  user-drag: none;
  -webkit-user-drag: none;
  user-select: none;
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
}

.staticButton img {
  user-drag: none;
  -webkit-user-drag: none;
  user-select: none;
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
}

.midlogo {
  display: none;
}

@media only screen and (max-width: 1600px) {
  .tempHeader img {
    width: 50vw;
    height: auto;
  }
}


@media only screen and (max-width: 1180px) {
  .tempHeader img {
    width: 75vw;
    height: auto;
  }

  .reglogo {
    display: none;
  }

  .midlogo {
    display: inline;
  }
}

@media only screen and (max-width: 500px) {
  .tempHeader img {
    width: 100vw;
    height: auto;
  }
}