.ring {
  top:0vh;
  background-color:#868076;
  text-align: center;
  vertical-align: 50vh;
  height:5vh;
  font-family: "Pixelify Sans", sans-serif;
  font-style: normal;
}

.ring a:link {
  color:#9fdb81;
}
.ring a:visited {
  color:#8dc272;
}
.ring a:hover {
  color:#dbac67;
}

.navbar {
  top:5vh;
  background-color:#db81d8;
  height:10vh;
  align-items:flex-end;
  display:flex;
}

.navbar a {
  display: flex;
  align-items:flex-end;
}

.navbar img {
  max-height: 9vh; 
  margin-bottom:0vh;
}

body {
  margin: 0;
  background-color:#5c415b;
  overflow: hidden;
  height: 100vh;
}

body.scrollable {
  margin: 0;
  background-color: #5c415b;
  overflow-y: auto;
  height: auto;
}

.character {
  display: flex;
  justify-content: center;
  margin-bottom:0vh; 
  align-items:flex-end;
}

.character img {
  position: fixed;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  max-height: 85vh;
}

.musicbut {
  position: absolute;
  top: 15vh;
  left: 6vw;
  width: 40vh;
  height: 40vh;
  background-color: #db81d8;
  border-radius: 5vh;
  display: flex;
  align-items: center;
  justify-content: center;
  animation: gentle-rock-music 2s infinite alternate ease-in-out;
  box-shadow: 0 1vh 2vh rgba(0, 0, 0, 0.1);
  font-family: "Pixelify Sans", sans-serif;
}

.musicbut a:hover {
  background-color:#a15f9e;
}

.pixelify-sans-musicbut {
  font-family: "Pixelify Sans", sans-serif;
  font-style: normal;
}

@keyframes gentle-rock-music {
  from {
    transform: rotate(-10deg);
  }
  to {
    transform: rotate(-30deg);
  }
}

.filmbut {
  position: absolute;
  bottom: 14vh;
  right: 14vw;
  width: 25vh;
  height: 25vh;
  background-color: #db81d8;
  border-radius: 5vh;
  display: flex;
  align-items: center;
  justify-content: center;
  animation: gentle-rock-film 2s infinite alternate ease-in-out;
  box-shadow: 0 1vh 2vh rgba(0, 0, 0, 0.1);
  font-family: "Pixelify Sans", sans-serif;
}
.filmbut a:hover {
  background-color:#a15f9e;
}

.pixelify-sans-filmbut {
  font-family: "Pixelify Sans", sans-serif;
  font-style: normal;
}

@keyframes gentle-rock-fashion {
  from {
    transform: rotate(10deg);
  }
  to {
    transform: rotate(25deg);
  }
}

.fashionbut {
  position: absolute;
  top: 14vh;
  right: 6vw;
  width: 35vh;
  height: 35vh;
  background-color: #db81d8;
  border-radius: 5vh;
  display: flex;
  align-items: center;
  justify-content: center;
  animation: gentle-rock-fashion 2s infinite alternate ease-in-out;
  box-shadow: 0 1vh 2vh rgba(0, 0, 0, 0.1);
  font-family: "Pixelify Sans", sans-serif;
}
.fashionbut a:hover {
  background-color:#a15f9e;
}

.pixelify-sans-fashionbut {
  font-family: "Pixelify Sans", sans-serif;
  font-style: normal;
}

@keyframes gentle-rock-film {
  from {
    transform: rotate(-10deg);
  }
  to {
    transform: rotate(-20deg);
  }
}

.otherbut {
  position: absolute;
  bottom: 15vh;
  left: 15vw;
  width: 20vh;
  height: 20vh;
  background-color: #db81d8;
  border-radius: 5vh;
  display: flex;
  align-items: center;
  justify-content: center;
  animation: gentle-rock-other 2s infinite alternate ease-in-out;
  box-shadow: 0 1vh 2vh rgba(0, 0, 0, 0.1);
  font-family: "Pixelify Sans", sans-serif;
  font-style: normal;
}
.otherbut a:hover {
  background-color:#a15f9e;
}

@keyframes gentle-rock-other {
  from {
    transform: rotate(7.5deg);
  }
  to {
    transform: rotate(12.5deg);
  }
}

.block-link {
  display: block;
  text-decoration: none;
  color: inherit;
}

.block-link table, .block-link img, .block-link p {
  pointer-events: none;
}

#mobilewarning {
  display: none;
}
.changed {
    display: none !important;
}

.fashionbackstory {  
  color:white;
  margin-left:5vw;
  margin-right:5vw;
  font-family: "Pixelify Sans", sans-serif;
  font-style: normal;
  margin-top:5vh;
}

.musicopener {  
  color:white;
  margin-left:5vw;
  margin-right:5vw;
  font-family: "Pixelify Sans", sans-serif;
  font-style: normal;
  margin-top:5vh;
}

@media 
  (min-aspect-ratio: 9.1/16) and (max-aspect-ratio: 15/9),
  (min-aspect-ratio: 17/9),
  (max-aspect-ratio: 8/16) {
  #mobilewarning {
    background-color:green;
    color:white;
    height:100vh;
    width:100vw;
    z-index:10000;
    position: fixed;
    top: 0;
    left: 0;
    font-size:2vh;
    display:block;
  }
  #mobilewarning button {
    height:10vh;
    width:20vw;
    font-size:3vh;
  }
}

@media (max-aspect-ratio: 1.64/1) {
  .character {
    display: flex;
    justify-content: center;
    margin-bottom:0vh; 
    align-items:flex-end;
  }

  .character img {
    position: fixed;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    max-height: 46.3vh;
  }
  
  .musicbut {
    position: absolute;
    top: 9vh;
    left: 7vw;
    width: 37vw;
    height: 37vw;
    background-color: #db81d8;
    border-radius: 2.5vw;
    display: flex;
    align-items: center;
    justify-content: center;
    animation: gentle-rock-music 2s infinite alternate ease-in-out;
    box-shadow: 0 1vh 2vh rgba(0, 0, 0, 0.1);
    font-family: "Pixelify Sans", sans-serif;
  }
  
  .musicbut img {
    max-width:13vh;
  }
  .musicbut a:hover {
    background-color:#a15f9e;
  }
  
  .pixelify-sans-musicbut {
    font-family: "Pixelify Sans", sans-serif;
    font-style: normal;
  }
  
  @keyframes gentle-rock-music {
    from {
      transform: rotate(-10deg);
    }
    to {
      transform: rotate(10deg);
    }
  }
  
  .fashionbut {
    position: absolute;
    top: 9vh;
    right: 7vw;
    width: 37vw;
    height: 37vw;
    background-color: #db81d8;
    border-radius: 2.5vw;
    display: flex;
    align-items: center;
    justify-content: center;
    animation: gentle-rock-fashion 2s infinite alternate ease-in-out;
    box-shadow: 0 1vh 2vh rgba(0, 0, 0, 0.1);
    font-family: "Pixelify Sans", sans-serif;
  }
  .fashionbut a:hover {
    background-color:#a15f9e;
  }
  
  .fashionbut img {
    max-width:13vh;
  }
  
  .pixelify-sans-filmbut {
    font-family: "Pixelify Sans", sans-serif;
    font-style: normal;
  }
  
  @keyframes gentle-rock-fashion {
    from {
      transform: rotate(7.5deg);
    }
    to {
      transform: rotate(-7.5deg);
    }
  }
  
  .filmbut {
    position: absolute;
    bottom: 48vh;
    left: 7vw;
    width: 37vw;
    height: 37vw;
    background-color: #db81d8;
    border-radius: 2.5vw;
    display: flex;
    align-items: center;
    justify-content: center;
    animation: gentle-rock-film 2s infinite alternate ease-in-out;
    box-shadow: 0 1vh 2vh rgba(0, 0, 0, 0.1);
    font-family: "Pixelify Sans", sans-serif;
  }
  
  .filmbut img {
    max-width:13vh;
  }
  
  .filmbut a:hover {
    background-color:#a15f9e;
  }
  
  .pixelify-sans-fashionbut {
    font-family: "Pixelify Sans", sans-serif;
    font-style: normal;
  }
  
  @keyframes gentle-rock-film {
    from {
      transform: rotate(-5deg);
    }
    to {
      transform: rotate(5deg);
    }
  }
  
  .otherbut {
    position: absolute;
    bottom: 48vh;
    right: 7vw;
    width: 37vw;
    height: 37vw;
    left:auto;
    background-color: #db81d8;
    border-radius: 2.5vw;
    display: flex;
    align-items: center;
    justify-content: center;
    animation: gentle-rock-other 2s infinite alternate ease-in-out;
    box-shadow: 0 1vh 2vh rgba(0, 0, 0, 0.1);
    font-family: "Pixelify Sans", sans-serif;
    font-style: normal;
  }
  .otherbut a:hover {
    background-color:#a15f9e;
  }
  .otherbut img {
    max-width:13vh;
  }
  @keyframes gentle-rock-other {
    from {
      transform: rotate(2.5deg);
    }
    to {
      transform: rotate(-2.5deg);
    }
  }
  .musicopener {
    font-size:3vh;
  }
  .ring {
    font-size:3vh;
  }
}

.reviewtable {
  width: 90vw;
  margin-left: 5vw;
  margin-right: 5vw;
  table-layout: fixed;
  margin-top:2vh;
}

.reviewtable td {
  vertical-align: top;
  font-family: "Jersey 15", sans-serif;
  color: white;
}

.reviewtable .imagecell {
  width: 25vw;
}

.reviewtable .imagecell img {
  width: 25vw;
  max-width: 100%;
  display: block;
}

.reviewtable .designertable {
  width:65vw;
  color:white;
  font-size:4vh;
  font-family: "Jersey 15", sans-serif;
  font-weight: 400;
  font-style: normal;
  height:5vh;
  vertical-align:central;
}

.reviewtable .imagecellright {
  width: 25vw;
}

.reviewtable .imagecellright img {
  width: 25vw;
  max-width: 100%;
  display: block;
  margin-left: auto;
}

.reviewtable .collectiontable {
  width:65vw;
  font-size:3vh;
  height:4vh;
  color:#C2C2C2;
  font-family: "Jersey 15", sans-serif;
  font-weight: 400;
  font-style: normal;
  vertical-align:central;
}

.reviewtable .ratingtable {
  width:65vw;
  height:5vh;
  vertical-align:central;
}

.reviewtable .ratingtable img {
  max-width:15vw;
}

.reviewtable .reviewingtable {
  width:65vw;
  font-size:3vh;
  color:white;
  font-family: "Jersey 15", sans-serif;
  font-weight: 400;
  font-style: normal;
}

.musicstars {
  width:65vw;
  height:5vh
}

.musicstars img {
  max-width:15vw;
}

.reviewdate {
  font-family: "Jersey 15", sans-serif;
  color:#C2C2C2;
  font-weight:400;
  font-style: normal;
  font-size:3vh;
}

.imagedaterow {
  height:4vh;
}

.musictable {
  width:90vw;
  margin-left:5vw;
  margin-right:5vw;
}

.reviewimage {
  width:25vw;
}

.reviewtext {
  font-family: "Jersey 15", sans-serif;
  color:white;
  font-weight:400;
  font-style: normal;
  font-size:3vh;
  vertical-align:top;
}

.loading img {
  max-width: 25vw;
}

.loading {
  width:100vw;
  height:100vh;
  background-color:#5c415b;
  align-items: center;
  display:flex;
  justify-content: center;
  color:white;
  font-family: "Pixelify Sans", sans-serif;
  font-style: normal;
  font-size:5vh;
  z-index:1000;
  position:fixed;
  top:0;
  left:0;
}

.loading table {
  margin-left:auto;
  margin-right:auto;
}

.loading td {
  text-align: center;
}

body.loadingbod {
  margin: 0;
  background-color:#404040;
  overflow: hidden;
  height: 100vh;
  padding:0;
}

.menubar {
  height: 10vh;
  background-color: #c2c6c0;
  display: flex;
  justify-content: space-between; /* space between children */
  align-items: center;
  padding: 0 2vw; /* optional horizontal padding */
  position: relative;
  z-index: 1;
}

.menubar img {
  filter: contrast(1.15) saturate(0);
  height: 8vh;
  margin: 0; /* reset margins */
  display: block; /* better for images */
}

.otherpages {
  margin-top:4.3vh; 
  margin-left:5.4vw; 
  background-color:#c2c6c0; 
  border: black 0.5vw solid; 
  width:57.3vw; 
  height:59.8vh;
  border-radius:0.5vw;
  color:black;
  font-family: "Pixelify Sans", sans-serif;
  font-style: normal;
  position:relative;
}

#topotherpage {
  text-align: center;
  font-size: 4vh;
  height: 6.6495vh;
  width: 100%;
}

#secondotherpage {
  height: 6.6495vh;
  font-size:3vh;
}

#thirdotherpage  {
  height:43.3494vh;
}

table.guestbookbut {
  position:absolute;
  margin-left:2vw;
  margin-top:-18vh;
  color: black;
  text-decoration: none;
  display:inline-table;;
  width: auto;
  height:auto;
}

table.otherrantsbut {
  position:absolute;
  margin-left:14vw;
  margin-top:-17vh;
  color: black;
  text-decoration: none;
  display:inline-table;;
  width: auto;
  height:auto;
}

table.recommendationsbut {
  position:absolute;
  margin-left:8vw;
  margin-top:0vh;
  color: black;
  text-decoration: none;
  display:inline-table;;
  width: auto;
  height:auto;
}