body {
	background-image: url(https://files.catbox.moe/w7mtsy.png);
}

.container {
	border: solid 4px;
	border-radius: 10px;
	background-color: #58DBAD;
  height: auto;
}

.flex-container {
  display: flex;
  flex-direction: row;
}


.main-image {
  float: left;
  margin: 5px;
}

.not-image {
  width: 100%;
}

.header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-right: 15px;
  height: 10%;
  align-content: flex-start;
}

.tz-gif {
  width: 10%
}
.strawbunny {
  width: 12%
}


.audio {
  
}

.title {
  
	font-family:"font";
	font-size: 2.5rem;
  color: #B54359
}

.flavor {
text-align: center;
  height: 7%
}

.scrollbox {
  float: left;
  overflow: auto;
height: 400px;
width: 70%;
border: solid 4px;
border-radius: 10px;
padding: 15px;
background-color: #EB9D9D;
}

.page-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-family: "font";
  font-size: 1.5rem
  
}

.main-right {
  height: 50%;
}

.buttons {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  font-family: "font";
}

.sub-image {
  float: right;
}

.audio {
  width: 20%
}

@font-face {
  font-family: "font";
  src: url(https://files.catbox.moe/gh6qis.ttf)
    }

/*boring stuff that makes the pages work DONT DELETE IT!!!!*/

html {
    scroll-padding-top: 100px;
}

.page {
    display: none; 
}
    
.page:target {
    display: block;
}

body:not(:has(:target)) #page1 {
    display: block;
}


/* CSS */
.button-89 {
  --b: 3px;   /* border thickness */
  --s: .45em; /* size of the corner */
  --color: #B54359;
  
  padding: calc(.5em + var(--s)) calc(.9em + var(--s));
  color: var(--color);
  --_p: var(--s);
  background:
    conic-gradient(from 90deg at var(--b) var(--b),#0000 90deg,var(--color) 0)
    var(--_p) var(--_p)/calc(100% - var(--b) - 2*var(--_p)) calc(100% - var(--b) - 2*var(--_p));
  transition: .3s linear, color 0s, background-color 0s;
  outline: var(--b) solid #0000;
  outline-offset: .6em;
  font-size: 16px;

  border: 0;

  user-select: none;
  -webkit-user-select: none;
  touch-action: manipulation;
}

.button-89:hover,
.button-89:focus-visible{
  --_p: 0px;
  outline-color: var(--color);
  outline-offset: .05em;
}

.button-89:active {
  background: var(--color);
  color: #fff;
}