body {
  margin: 0px;
  height: 100vh;
  width: 100%;
  background-repeat: repeat;
  background-image: url(ramble_archive-img/bg.jpeg);
  font-family: "Zain", sans-serif;
  font-size: 15px;
}
:root {
  --purple: #a297a6;
  --white: #f1ece4;
  --black: #262220;
  --pink: #f0dfd8;
  --blue: #d3d4da;
}
#rammain {
  background-color: var(--white);
  border-bottom: 2px dashed #c3c2ad;
  border-top: 2px dashed var(--purple);
  box-shadow:
    0 4px 0 var(--white),
    0 -4px 0 var(--white);
  padding: 15px;
  max-height: 420px;
  overflow: auto;
}
#rammain::-webkit-scrollbar {
  display: none;
}
#layout {
  margin: 70px auto;
  margin-top: -10px;
  width: 1010px;
  max-height: 500px;
  overflow: auto;
  display: grid;
  grid-template-columns: 1fr 1fr; /* Two equal columns */
  align-items: start;
  gap: 10px;
}
#raind {
  z-index: 100;
  width: 130px;
  height: 310px;
  border: 5px solid var(--purple);
  background-color: var(--blue);
  text-align: center;
  overflow: auto;
}

#raind::-webkit-scrollbar {
  display: none;
}

a:link,
:visited,
:hover,
:active {
  color: var(--black-white);
  background-color: transparent;
  text-decoration: none;
}

.dates {
  z-index: 100;
  text-align: center;
  margin: 27px;
  color: var(--black);
}
p,
h2 {
  text-align: center;
  margin: 30px;
  color: var(--black);
}

hr.solid {
  border-top: 5px solid var(--blue);
}
#bun-1 {
  z-index: 100;
  margin-top: -410px;
  margin-left: 100px;
  height: 250px;
  border-radius: 10px;
  border: 0px solid white;
  overflow: auto;
}
.box02 {
  background: url(ramble_archive-img/pa16-bg-slantstripe.jpg);
  border: solid 2px var(--black);
  padding: 20px 0;

  z-index: 90;
  width: 800px;
  max-height: 500px;
  background-color: var(--white);
}
.zain-extralight {
  font-family: "Zain", sans-serif;
  font-weight: 200;
  font-style: normal;
}

.zain-light {
  font-family: "Zain", sans-serif;
  font-weight: 300;
  font-style: normal;
}

.zain-regular {
  font-family: "Zain", sans-serif;
  font-weight: 400;
  font-style: normal;
}

.zain-bold {
  font-family: "Zain", sans-serif;
  font-weight: 700;
  font-style: normal;
}

.zain-extrabold {
  font-family: "Zain", sans-serif;
  font-weight: 800;
  font-style: normal;
}

.zain-black {
  font-family: "Zain", sans-serif;
  font-weight: 900;
  font-style: normal;
}

.zain-light-italic {
  font-family: "Zain", sans-serif;
  font-weight: 300;
  font-style: italic;
}

.zain-regular-italic {
  font-family: "Zain", sans-serif;
  font-weight: 400;
  font-style: italic;
}