@font-face {
  font-family: fairy;
  src: url(https://dl.dropbox.com/s/8q4gzk812ilnbss/SWEETFAIRY-PERSONALUSE.otf);
}

#fairy {
  font-family: fairy;
}

@font-face {
  font-family: "Magica";
  src: url(https://static.tumblr.com/p6yopnt/Qkiqnu0r5/theheart.ttf);
}
#magica {
  font-family: "Magica";
}

:root {
  --dk-color: #f896c8;
  --mid-color: #ffdaed;
  --lt-color: #feecf5;
  --dkest-color: #e664ae;
  --accent: #e664ae;
}
.mainsetup {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  grid-template-rows: repeat(5, 1fr);
  grid-column-gap: 0;
  grid-row-gap: 0;
}
.main {
  grid-area: 1 / 2 / 6 / 7;
  border: 3px ridge var(--dk-color);
  padding: 10px;
  margin-top: 25px;
  margin-bottom: 25px;
  background-color: #fbb2d9;
  overflow: auto;
  height:800;
}
.noticesetup {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  grid-template-rows: 1fr;
  grid-column-gap: 0;
  grid-row-gap: 0;
}
.notice {
  grid-area: 1 / 1 / 2 / 6;
  border: 3px dotted #e664ae;
  background-color: #baf2fd;
  text-align: center;
}
.marquee {
  font-size: 20px;
}
.marqueebox {
  height: 31px;
  margin-top: 5px;
}
.gridheadersetup {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  grid-template-rows: 1fr;
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  margin-bottom: 5px;
}
.gridheader {
  grid-area: 1 / 1 / 2 / 6;
  background-image: url("https://media.discordapp.net/attachments/803058880840990732/1043761680980660254/IMG_3171.png");
  height: 190px;
  background-clip: padding-box;
  background-position: center;
}
.parent {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  grid-template-rows: repeat(5, 1fr);
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  height: 600px;
  margin-bottom: 5px;
  margin-top: 5px;
}
.indexnav,
.indexbody,
.webrings,
.webcam,
.indexbox1,
.indexbox2,
.indexbox3,
.div6,
.div7,
.aboutstamps,
.mediastamps,
.charastamps,
.aesstamps,
.userboxes,
.blinkies,
.twentytwentytwo,
.twentytwentyone,
.twentytwenty,
.twentynineteen,
.gridheader,
.aboutbody,
.aboutbox1,
.aboutbox2,
.aboutbox3,
.friendicon1,
.friendbox1,
.friendicon2,
.friendbox2,
.friendicon3,
.friendbox3,
.shrinesbody,
.diaryside1,
.diarybody,
.marqueebox,
.tablediv,
.resourcesbody{
  border: 3px ridge var(--dk-color);
  background-color: var(--lt-color);
  background-size: cover;
  overflow: auto;
}
.indexnav {
  grid-area: 1 / 1 / 6 / 2;
  height: 600px;
  overflow: auto;
}
.indexbody {
  grid-area: 1 / 2 / 3 / 6;
  height: 414px;
  overflow: auto;
}
#statuscafe {
  padding: 10px;
  border: 3px dotted var(--dk-color);
  background-color: var(--lt-color);
  background-clip: padding-box;
  background-image: url("https://media.discordapp.net/attachments/940820238629503006/1026496758110502932/IMG_0421.gif");
}
.webrings {
  grid-area: 3 / 2 / 5 / 4;
  height: 175px;
} 
.webcam {
  grid-area: 3 / 4 / 5 / 6;
  height: 175px;
  background-image: url("https://media.discordapp.net/attachments/826297848731402240/1027445729964331089/IMG_0965.gif");
} 
.indexbox1 {
  grid-area: 1 / 6 / 2 / 7;
  overflow: auto;
}
.indexbox2 {
  grid-area: 2 / 6 / 3 / 7;
  overflow: auto;
}
.indexbox3 {
  grid-area: 3 / 6 / 4 / 7;
  height: 175px;
  overflow: auto
}
.aboutpage {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  grid-template-rows: repeat(3, 1fr);
  grid-column-gap: 5px;
  grid-row-gap: 5px;
}
.aboutbox1 {
  grid-area: 1 / 1 / 2 / 2;
  background-image: url("https://media.discordapp.net/attachments/1019843709422018640/1021210594247975033/F3757448-1D7E-4446-AB0B-38FFE6777D7F.png");
  background-position: center;
  height: 200px;
  width: 200px;
  overflow: auto;
}
.aboutbox2 {
  grid-area: 2 / 1 / 3 / 2;
  height: 200px;
  width: 200px;
  overflow: auto;
}
.aboutbox3 {
  grid-area: 3 / 1 / 4 / 2;
  height: 200px;
  width: 200px;
  overflow: auto;
}
.aboutbody {
  grid-area: 1 / 2 / 4 / 6;
  height: 622px;
  overflow: auto;
}
.art {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  grid-template-rows: repeat(4, 1fr);
  grid-column-gap: 5px;
  grid-row-gap: 5px;
}
.twentytwentytwo {
  grid-area: 1 / 1 / 2 / 6;
  height: 500px;
  overflow: scroll;
  text-align: center;
}
.twentytwentyone {
  grid-area: 2 / 1 / 3 / 6;
  height: 500px;
  overflow: scroll;
  text-align: center;
}
.twentytwenty {
  grid-area: 3 / 1 / 4 / 6;
  height: 500px;
  overflow: scroll;
  text-align: center;
}
.twentynineteen {
  grid-area: 4 / 1 / 5 / 6;
  height: 500px;
  overflow: scroll;
  text-align: center;
}
.friends {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  grid-template-rows: repeat(3, 1fr);
  grid-column-gap: 5px;
  grid-row-gap: 5px;
}
.friendicon1 {
  grid-area: 1 / 1 / 2 / 2;
  height: 200px;
  width: 200px;
  background-image: url("https://media.discordapp.net/attachments/1019843709422018640/1050163837371949136/IMG_4307.png");
  background-position: center;
}
.friendbox1 {
  grid-area: 1 / 2 / 2 / 6;
  height: 200px;
  overflow: auto;
}
.friendicon2 {
  grid-area: 2 / 5 / 3 / 6;
  height: 200px;
  width: 200px;
  background-image: url("https://media.discordapp.net/attachments/1019843709422018640/1050163838055616632/IMG_4305.png");
  background-position: center;
}
.friendbox2 {
  grid-area: 2 / 1 / 3 / 5;
  height: 200px;
  overflow: auto;
}
.friendicon3 {
  grid-area: 3 / 1 / 4 / 2;
  height: 200px;
  width: 200px;
  background-image: url("https://media.discordapp.net/attachments/1019843709422018640/1050163837753643048/IMG_4306.png");
  background-position: center;
}
.friendbox3 {
  grid-area: 3 / 2 / 4 / 6;
  height: 200px;
  overflow: auto;
}
.shrinespage {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  grid-template-rows: 1fr;
  grid-column-gap: 5px;
  grid-row-gap: 5px;
}
.shrinesbody {
  grid-area: 1 / 1 / 2 / 6;
  height: 600px;
  overflow: auto;
}
.stampspage {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  grid-template-rows: repeat(6, 1fr);
  grid-column-gap: 5px;
  grid-row-gap: 5px;
}
.aboutstamps {
  grid-area: 1 / 1 / 2 / 6;
  height: 200px;
  overflow-y: scroll;
  text-align: center;
}
.mediastamps {
  grid-area: 2 / 1 / 3 / 6;
  height: 200px;
  overflow-y: scroll;
  text-align: center;
}
.charastamps {
  grid-area: 3 / 1 / 4 / 6;
  height: 200px;
  overflow-y: scroll;
  text-align: center;
}
.aesstamps {
  grid-area: 4 / 1 / 5 / 6;
  height: 200px;
  overflow-y: scroll;
  text-align: center;
}
.userboxes {
  grid-area: 5 / 1 / 6 / 6;
  height: 200px;
  overflow-y: scroll;
  text-align: center;
}
.blinkies {
  grid-area: 6 / 1 / 7 / 6;
  height: 200px;
  overflow-y: scroll;
  text-align: center;
}
.diary {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  grid-template-rows: repeat(4, 1fr);
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  height: 600px;
}
.diaryside1 {
  grid-area: 1 / 1 / 2 / 2;
  background-image: url("https://media.discordapp.net/attachments/826297848731402240/1023673375115182220/IMG_9843.gif");
  background-position: center;
  height: 150px;
  width: 150px;
}
.diaryside2 {
  grid-area: 2 / 1 / 5 / 2;
  border: 2px dotted #e664ae;
  background-color: #baf2fd;
  text-align: center;
  height: 210px;
  width: 150px;
  overflow-y: auto;
}
.diarybody {
  grid-area: 1 / 2 / 5 / 7;
  background-image: url("https://media.discordapp.net/attachments/940820238629503006/1040135668396994661/IMG_2580.png");
}
.diaryentry {
  border: 2px dotted #f896c8;
  border-radius: 10px;
  background-color: #fff;
  background-clip: padding-box;
  margin: 25px;
}
.diary-title {
  text-align: center;
  font-weight: bold;
  padding-top: 10px;
  padding-bottom: 10px;
  background-color: var(--mid-color);
  color: var(--dkest-color);
  font-family: "magica";
  font-size: 24px;
  border-radius: 8px 8px 0 0;
  text-shadow: -1px -1px 0 #fdecf5, 1px -1px 0 #fdecf5, -1px 1px 0 #fdecf5,
    1px 1px 0 #fdecf5;
}
.resourcespage {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  grid-template-rows: 1fr;
  grid-column-gap: 5px;
  grid-row-gap: 5px;
}
.resourcesbody {
  grid-area: 1 / 1 / 2 / 6;
}
.title {
  font-size: 75px;
  text-align: center;
  -webkit-text-stroke-color: #fdecf5;
  -webkit-text-stroke-width: 2px;
}
.content {
  padding: 10px;
  overflow-y: auto;
}
.section-title {
  text-align: center;
  font-weight: bold;
  padding-top: 10px;
  padding-bottom: 10px;
  background-color: var(--mid-color);
  color: var(--dkest-color);
  font-family: "fairy";
  font-size: 24px;
  text-shadow: -1px -1px 0 #fff, 1px -1px 0 #fff, -1px 1px 0 #fff,
    1px 1px 0 #fff;
  border-bottom: 2px dashed;
}
.art-section-title {
  text-align: center;
  font-weight: bold;
  padding-top: 10px;
  padding-bottom: 10px;
  background-color: var(--mid-color);
  color: var(--dkest-color);
  font-family: "magica";
  font-size: 26px;
  text-shadow: -1px -1px 0 #fff, 1px -1px 0 #fff, -1px 1px 0 #fff,
    1px 1px 0 #fff;
  border-bottom: 2px dashed;
}
.tablediv {
  height: 600px;
  overflow-y: auto;
  text-align: center;
}
html,
body {
  margin: 0;
  padding-top: 25px;
  padding: 0;
  height: 100%;
  font-family: "magica";
  font-size: 18px;
  background-image: url("https://media.discordapp.net/attachments/940820238629503006/1015297070766227546/image0.gif");
  background-repeat: repeat;
  color: var(--dkest-color);
  overflow-y: auto;
}
body a {
  color: var(--accent);
  font-weight: bold;
}
body {
  width: 1375px;
  position: relative;
  display: block;
  margin-left:auto;
  margin-right:auto;
}
h1,
h3,
h5 {
  color: var(--dk-color);
}
h2,
h4,
h6 {
  color: var(--accent);
}
button {
  width: 95%;
  height: 35px;
  background-color: var(--mid-color);
  color: var(--dkest-color);
  border: none;
  font-family: "magica";
  font-size: 18px;
  margin-top: 5px;
}
button a {
  color: var(--accent);
}
p {
  padding: 5px;
}
p a {
  color: var(--dkest-color);
  font-weight: bold;
}
textarea {
  background-color: var(--dkest-color);
  color: var(--lt-color);
  font-size: 10px;
}
table {
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  background-color: var(--lt-color);
  text-color: var(--dkest-color);
}
thead {
  background-color: var(--mid-color);
  border-color: var(--dkest-color);
  padding: 5px;
  text-color: var(--dkest-color);
  font-size: 25px;
}
td {
  border-color: var(--dkest-color);
  padding: 5px;
}
#pagedoll {
  position: fixed;
  right: 10px;
  bottom: 10px;
}
#float {
  text-shadow: -1px 0 #fff, 0 1px #fff, 1px 0 #fff, 0 -1px #fff, 0 0;
  color: #fff;
  animation-name: floating;
  animation-duration: 3s;
  animation-iteration-count: infinite;
  animation-timing-function: ease-in-out;
}
@keyframes floating {
  0% {
    transform: translate(0, 0px);
  }
  50% {
    transform: translate(0, 15px);
  }
  100% {
    transform: translate(0, -0px);
  }
}
#statuscafe-username {
  margin-bottom: .5em;
}
#statuscafe-content {
  margin: 0 1em 0.5em 1em;
}