@import url("https://fonts.googleapis.com/css2?family=Libre+Caslon+Text:wght@400;700&display=swap");
* {
  margin: 0;
  padding: 0; }

html {
  box-sizing: border-box; }

*, *:before, *:after {
  box-sizing: inherit; }

body {
  background: #ee9ca8;
  color: #322f2b;
  font-family: 'Libre Caslon Text', serif;
  min-height: 100vh;
  min-height: -webkit-fill-available; }
  body.locked {
    overflow: hidden; }

::-webkit-scrollbar {
  width: 5px; }

::-webkit-scrollbar-track {
  background: url(../images/scroll-track.png) center center repeat-y; }

::-webkit-scrollbar-thumb {
  background: rgba(50, 47, 43, 0.71); }

::-webkit-scrollbar-thumb:hover {
  background: #322f2b; }

._fullscreen, section, #splash, #preloader {
  position: fixed;
  top: 0;
  left: 0;
  height: 100vh;
  width: 100%; }

._drag-me-not, img, #splash img {
  -webkit-user-drag: none;
  -khtml-user-drag: none;
  -moz-user-drag: none;
  -o-user-drag: none;
  user-drag: none; }

._select-me-not, img, #splash img {
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -o-user-select: none;
  user-select: none; }

.inner {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  height: 100%;
  width: 100%; }

img {
  display: block;
  height: auto;
  width: 100%; }

#menu {
  background: #ee9ca8;
  position: absolute;
  top: 0;
  left: 0;
  min-height: 100vh;
  width: 100%;
  z-index: 10; }
  #menu .inner {
    margin: 0 auto;
    max-width: 1400px; }
    #menu .inner .menu-top {
      height: 19vh;
      padding: 2rem;
      display: flex;
      align-items: flex-end; }
    #menu .inner .menu-middle {
      min-height: 62vh;
      width: 86vh;
      max-width: calc(100% - 2rem);
      display: flex;
      flex-wrap: wrap; }
      #menu .inner .menu-middle .menu-item {
        position: relative;
        padding: 1rem;
        width: 25%; }
        #menu .inner .menu-middle .menu-item a {
          overflow: hidden;
          position: absolute;
          top: 1rem;
          left: 1rem;
          width: calc(100% - 2rem);
          border-radius: .5rem .5rem .75rem .75rem;
          box-shadow: 0 3px 5px rgba(50, 47, 43, 0.38);
          transition: 250ms ease-in-out; }
          #menu .inner .menu-middle .menu-item a:hover {
            box-shadow: 0 5px 10px rgba(50, 47, 43, 0.5); }
      #menu .inner .menu-middle .menu-item:nth-child(1) a:hover {
        transform: rotate(-3deg); }
      #menu .inner .menu-middle .menu-item:nth-child(2) a:hover {
        transform: rotate(2deg); }
      #menu .inner .menu-middle .menu-item:nth-child(3) a:hover {
        transform: rotate(-4deg); }
      #menu .inner .menu-middle .menu-item:nth-child(4) a:hover {
        transform: rotate(-2deg); }
      #menu .inner .menu-middle .menu-item:nth-child(5) a:hover {
        transform: rotate(-3deg); }
      #menu .inner .menu-middle .menu-item:nth-child(6) a:hover {
        transform: rotate(-7deg); }
      #menu .inner .menu-middle .menu-item:nth-child(7) a:hover {
        transform: rotate(6deg); }
      #menu .inner .menu-middle .menu-item:nth-child(8) a:hover {
        transform: rotate(3deg); }
    #menu .inner .menu-bottom {
      height: 19vh;
      padding: 2rem 0 0;
      display: flex;
      flex-direction: column; }
      #menu .inner .menu-bottom .menu-ornament {
        margin: 0 auto;
        max-width: 380px;
        padding-bottom: 2rem; }
      #menu .inner .menu-bottom .menu-footer {
        padding: 1rem 0;
        text-align: center;
        position: relative;
        height: 100%; }
        #menu .inner .menu-bottom .menu-footer .footer-links {
          position: absolute;
          bottom: 1rem;
          width: 100%; }
          #menu .inner .menu-bottom .menu-footer .footer-links li {
            display: inline-block; }
            #menu .inner .menu-bottom .menu-footer .footer-links li a {
              color: rgba(82, 74, 64, 0.5);
              font-size: .6rem;
              text-decoration: none;
              text-transform: uppercase;
              padding: .25rem;
              transition: 250ms; }
              #menu .inner .menu-bottom .menu-footer .footer-links li a:hover {
                color: #524a40; }

@media screen and (max-width: 800px) {
  #menu .inner .menu-top {
    height: auto; }
  #menu .inner .menu-middle {
    height: auto;
    min-width: 62%; }
    #menu .inner .menu-middle .menu-item {
      width: 33.333%; } }
@media screen and (max-width: 800px) {
  #menu .inner .menu-top {
    height: auto; }
  #menu .inner .menu-middle {
    height: auto; }
    #menu .inner .menu-middle .menu-item {
      width: 33.333%; } }
@media screen and (max-width: 640px) {
  #menu .inner .menu-top {
    height: auto; }
  #menu .inner .menu-middle {
    height: auto; }
    #menu .inner .menu-middle .menu-item {
      width: 50%; } }
section {
  background-color: rgba(238, 156, 168, 0.9);
  display: none;
  z-index: 15; }

.modal-page {
  border-radius: .5rem;
  background: #fefbef url(../images/page-bg-light.jpg) center center no-repeat;
  background-size: cover;
  max-height: 600px;
  max-width: 820px;
  width: calc(100% - 2rem);
  padding: .75rem; }
  .modal-page .page-border {
    border: 0.3rem solid rgba(82, 74, 64, 0.62);
    height: 100%;
    display: flex;
    justify-content: center;
    flex-direction: row;
    padding: 2rem 4rem;
    position: relative; }
    .modal-page .page-border .close-button {
      border-radius: 50%;
      cursor: pointer;
      position: absolute;
      top: .5rem;
      right: .5rem;
      height: 2rem;
      width: 2rem;
      font-size: 3rem;
      line-height: 1;
      overflow: hidden;
      display: flex;
      align-items: center;
      justify-content: center;
      transition: transform 250ms; }
      .modal-page .page-border .close-button span {
        display: inline-block;
        line-height: 1;
        transform: rotate(45deg); }
      .modal-page .page-border .close-button:hover {
        transform: scale(1.2); }
    .modal-page .page-border .page-left {
      margin-right: 3rem;
      overflow: hidden;
      width: 100%; }
      .modal-page .page-border .page-left h2 {
        color: #524a40;
        font-size: 1.6rem;
        font-weight: normal;
        margin-bottom: .75rem; }
      .modal-page .page-border .page-left hr {
        background: url(../images/hr.png?v=2) center center no-repeat;
        background-size: cover;
        border: none;
        height: 1rem;
        width: 100%; }
      .modal-page .page-border .page-left p {
        font-size: .9rem;
        line-height: 1.4;
        padding: 0 0 1rem; }
      .modal-page .page-border .page-left .page-header {
        margin-bottom: .75rem; }
      .modal-page .page-border .page-left .page-content {
        height: 80%; }
        .modal-page .page-border .page-left .page-content.scroll {
          overflow-y: scroll;
          padding-right: .5rem; }
      .modal-page .page-border .page-left .link,
      .modal-page .page-border .page-right .link {
        color: #524a40;
        font-size: .9rem;
        display: inline-block;
        margin-bottom: .5rem;
        text-decoration: none; }
        .modal-page .page-border .page-left .link:hover {
          color: #322f2b; }
      .modal-page .page-border .page-left table {
        padding-bottom: .5rem; }
        .modal-page .page-border .page-left table tr {
          vertical-align: top; }
        .modal-page .page-border .page-left table td {
          padding: .25rem; }
          .modal-page .page-border .page-left table td strong {
            font-size: 1.1rem;
            position: relative;
            top: -1px; }
    .modal-page .page-border .page-right {
      max-width: 220px;
      width: 35%; }
      .modal-page .page-border .page-right img {
        display: block;
        height: auto;
        width: 100%; }

@media screen and (max-width: 700px) {
  .modal-page .page-border {
    padding: 2rem 2rem;
    flex-direction: column; }
    .modal-page .page-border .page-left {
      margin-right: 0; }
    .modal-page .page-border .page-right {
      display: none; } }
.gallery-images {
  position: absolute;
  top: 1rem;
  left: 1rem;
  z-index: 666;
  display: none; }

#book-list .modal-page .page-border .page-left .page-content {
  height: 400px;
  overflow: hidden; }

#book-list .modal-page .page-border .page-left .book-list-section {
  height: calc(100% - 50px);
  padding-right: .5rem;
  overflow-y: scroll; }
#book-list .modal-page .page-border .page-left .isolation-reading-list-section {
  display: none;
  height: calc(100% - 50px);
  padding-right: .5rem;
  overflow-y: scroll; }
#book-list .modal-page .page-border .page-left .page-content h2 {
  font-size: 1rem; }
#book-list .modal-page .page-border .page-left ol {
  list-style-position: outside; }
  #book-list .modal-page .page-border .page-left ol li {
    margin-left: 2rem;
    padding: 0 0 .5rem; }

.buttons {
  display: flex;
  padding-bottom: 1rem; }
  .buttons .button {
    background: rgba(82, 74, 64, 0.2);
    border-radius: .2rem;
    border: 1px solid rgba(82, 74, 64, 0.71);
    color: rgba(82, 74, 64, 0.71);
    cursor: pointer;
    margin-right: 1rem;
    padding: .25rem .5rem;
    transition: 250ms; }
    .buttons .button.selected, .buttons .button:hover {
      background: rgba(255, 255, 255, 0.2);
      color: #524a40; }

#splash {
  background-color: #fefbef;
  background: #fefbef url(../images/bg.jpg?v=1) center center no-repeat;
  background-size: cover;
  background-color: #ee9ca8;
  z-index: 30; }
  #splash img {
    display: block;
    height: auto;
    width: 100%; }
  #splash .splash-top img {
    opacity: 0; }
  #splash .splash-middle {
    cursor: pointer;
    position: relative;
    height: 62vmin;
    width: 62vmin; }
    #splash .splash-middle .splash-middle-back {
      animation: spin 300s linear infinite;
      position: absolute;
      top: 0;
      left: 0;
      height: 100%;
      width: 100%;
      z-index: 1; }
    #splash .splash-middle .splash-middle-front {
      position: absolute;
      top: 0;
      left: 0;
      height: 100%;
      width: 100%;
      z-index: 2; }
  #splash .splash-top,
  #splash .splash-bottom {
    padding: 1rem;
    height: 100%;
    width: 38vmin;
    display: flex;
    align-items: center;
    justify-content: center; }

@keyframes spin {
  100% {
    -webkit-transform: rotate(-360deg);
    transform: rotate(-360deg); } }
#preloader {
  background-color: #fefbef;
  z-index: 40; }

.fancybox-bg {
  background-color: #322f2b; }

.fancybox-content {
  background-color: #fefbef;
  padding: 1rem; }

.fancybox-image {
  border-radius: 1rem;
  border: 0.62rem solid #fefbef;
  background-color: rgba(82, 74, 64, 0.62);
  padding: .3rem; }


#_evh-button {
  display: none;
}