/* Nintendo DS BIOS @ https://fontmeme.com/fonts/nintendo-ds-bios-font/ */
@font-face {
  font-family: "eternalUi";
  src: url("../fonts/EternalUi.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
}

/* basiic */
@font-face {
  font-family: "basiic";
  src: url("../fonts/basiic.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
}

body {
  background-color: transparent !important;

  /*custom cursor*/
  cursor: url(../images/cursor-eyeblack-1.png), default !important;
}

/*red eye cursor link hover*/
a:hover,
button:hover {
  cursor: url(../images/cursor-eyered-1.png), pointer !important;
}
/*moving eye cursor*/
h3,
p {
  cursor: url(../images/cursor-eyeread-right.png), auto;
  animation: cursor 1.3s linear infinite;
}
@keyframes cursor {
  0% {
    cursor: url(../images/cursor-eyeread-right.png), auto;
  }
  20% {
    cursor: url(../images/cursor-eyeread-right.png), auto;
  }
  30% {
    cursor: url(../images/cursor-eyeread-right-1.png), auto;
  }
  55% {
    cursor: url(../images/cursor-eyeread-left-1.png), auto;
  }
  60% {
    cursor: url(../images/cursor-eyeread-left.png), auto;
  }
  75% {
    cursor: url(../images/cursor-eyeread-left.png), auto;
  }
  85% {
    cursor: url(../images/cursor-eyeread-left-1.png), auto;
  }
  100% {
    cursor: url(../images/cursor-eyeread-right-1.png), auto;
  }
}

#container {
  display: flex;
  margin-top: 34px;
  width: 700px;
  height: 622px;
  overflow-y: scroll;
  scrollbar-width: thin;
  scrollbar-color: #390f0f #c45459;
}

/*===== Back to Top button =====*/
#topBtn {
  /* display: none; */
  position: fixed;
  bottom: 20px;
  z-index: 99;
  font-size: 18px;
  border: none;
  outline: none;
  background-color: #5c0202;
  color: #f0c5ac !important;
  cursor: pointer;
  padding: 8px 10px;
  border-radius: 4px;
}

#topBtn:hover {
  background-color: #390f0f;
  color: white !important;
  text-decoration: none;
}

/*==================== Table of Content ====================*/
#table-of-content {
  width: 130px;
  margin-top: 20px;
  margin-right: 4px;
  margin: 20px 4px 0px 2px;
  font-family: "eternalUi", Arial, Helvetica, sans-serif;
  font-size: 16px;
}

hr {
  border: 1px dashed #bd4545 !important;
}

#content-list > a,
.dropbtn {
  display: block;
  width: fit-content;
  min-width: 130px;
  text-decoration: none;
  text-align: left;
  margin: 2px 0px;
  padding: 4px;
  padding-right: 8px;
  line-height: 20px;
  border: 1px solid #301e1b;
  border-radius: 2px 13px 13px 2px;
  background-color: #c45459;
  color: #5c0202;
}
#content-list a:hover,
.dropbtn:hover {
  outline: 1px solid #5c0202;
  background-color: #bd4545;
}

/*===== DROPDOWN =====*/
/*===== dropdown button =====*/
.dropbtn {
  color: #5c0202;
  font-family: inherit;
  font-size: inherit;
  width: fit-content;
  /* margin: 2px 8px 2px 0px; */
  cursor: pointer;
}
/*===== dropdown menu =====*/
.dropdown-menu {
  position: relative;
  z-index: 1;
  width: 100%;
  overflow: auto;
  background-color: #f0c5ac !important;
}
.dropdown-menu li {
  display: block;
}
.show {
  display: block; /*toggled to show dropdown menu*/
}
/*==================== END left column ====================*/

/*==================== right column ====================*/
#glog-list {
  width: 550px;
  scrollbar-width: thin;
  color: #171311;
}

/*========= General properties =========*/
/*=== game titles ===*/
.game-name h2 {
  margin: 0;
  font-weight: bold;
  font-size: 20px;
  color: black;
}

/*=== log entry titles ===*/
h3 {
  font-weight: bold !important;
}

.log-entry a {
  color: rgb(92, 2, 2);
  text-decoration: underline;
}
.log-entry a:hover {
  text-decoration: underline dotted;
}

.log-entry {
  background-color: rgb(240, 197, 172);
  border: solid 1px black;
  margin-bottom: 8px;
}

.log-entry iframe {
  margin-top: 10px;
}
/*========= END General =========*/

/*========= Header and title for each game =========*/
.log-header {
  background-color: rgb(165, 42, 42);
  /* background: linear-gradient(to left, rgba(255,255,255,0) 20%,
              rgba(165,42,42,1) 70%), url("../images/blogImagesdmc2-banner.jpg"); */
  background-repeat: no-repeat;
  background-size: 550px !important;
  padding: 10px;
  height: 80px;
  display: flex;
  align-items: center;
}
.log-header img {
  width: 56px;
  margin-right: 10px;
  filter: drop-shadow(0 0 0.25rem rgb(32, 2, 2));
}
.game-name {
  font-family: "eternalUi", Arial, Helvetica, sans-serif;
  font-weight: bold;
  font-size: 20px;
}
.game-name span {
  font-size: 18px;
  color: rgb(59, 21, 21);
}
/*========= END Header and title =========*/

/*========= Date and playtime =========*/
.time-info {
  display: block;
  font-family: "Gill Sans", "Gill Sans MT", Calibri, "Trebuchet MS", sans-serif;
  margin-bottom: 4px;
}
.playtime {
  font-size: 14px;
}

/*========= Log text =========*/
.logs {
  padding: 10px;
  font-family: "basiic", Arial, Helvetica, sans-serif;
  font-size: 16px;
}

/*========= Log images & captions =========*/
figure {
  display: inline-block !important; /*displays figures side-by-side*/
}
figure img {
  height: 215px;
  margin-top: 4px;
}
figcaption {
  text-align: center; /*centers the image caption*/
}

/*========= Read more cut-off =========*/
details.previous {
  font-family: "basiic", Arial, Helvetica, sans-serif;
  padding: 6px 0px 6px 2px;
}
summary > span {
  font-size: 14px;
}
/*==================== END right column ====================*/
