@font-face {
    font-family: Equinox;
    src: url(./equinox\ regular.woff);
}

@font-face {
    font-family: Spacia;
    src: url(./spacia\ regular.woff2);
}

button {
  background-color: #57B0CE;
  border: 0 solid #E5E7EB;
  box-sizing: border-box;
  color: #000000;
  display: flex;
  font-family: Spacia, ui-sans-serif,system-ui,-apple-system,system-ui,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";
  font-size: 1rem;
  font-weight: 700;
  justify-content: center;
  line-height: 1.75rem;
  margin : auto;
  padding: .75rem 1.65rem;
  position: relative;
  text-align: center;
  text-decoration: none #000000 solid;
  text-decoration-thickness: auto;
  width: 100%;
  max-width: 460px;
  position: relative;
  cursor: pointer;
  transform: rotate(-2deg);
  user-select: none;
  -webkit-user-select: none;
  touch-action: manipulation;
  align-self: center;
  justify-self: center;
}

button:focus {
  outline: 0;
}

button:after {
  content: '';
  position: absolute;
  border: 1px solid #000000;
  bottom: 4px;
  left: 4px;
  width: calc(100% - 1px);
  height: calc(100% - 1px);
}

button:hover:after {
  bottom: 2px;
  left: 2px;
}

#sidebar * {
    font-family: Spacia, sans-serif;
    font-size: 2rem;
}

#sidebar h1, #sidebar h2, #sidebar h3 {
    font-family : Equinox, sans-serif;
}

#sidebar h2 {
    padding-left : 1rem;
    font-size : 3rem;
}

#sidebar ul li {
    padding : 0 0 0 2rem;
    margin : 0 0 0 3rem;
    border-left : 0.2rem solid navajowhite;
    list-style: none;
}

.session {
    display: flex;
    flex-direction: column;
}

.session-content {
    max-height : 0;
    margin : 1rem;
    padding : 0;

    background-color : lemonchiffon;
    color : black;

    overflow : hidden;
}

#sidebar .session-content h1 {
    padding : 1rem;
    font-size : 3rem;
    color : #57B0CE;
    text-shadow : 0.1rem 0.1rem 0.2rem navajowhite;
}

#sidebar .session-content h2 {
    padding : 1rem;
    margin : 2rem 0 0 0;
    font-size : 2rem;
    color : #57B0CE;
    text-shadow : 0.1rem 0.1rem 0.2rem navajowhite;
}

#sidebar .session-content blockquote {
    margin-left : 2rem;
    padding-left : 2rem;
    border-left : 0.1rem solid black;
}

#sidebar .session-content blockquote strong {
    padding : 0;
    display: block;
}

#sidebar .session-content p {
    padding-left : 1rem;
}

#sidebar .session-content blockquote p {
    padding : 0;
}

#sidebar .session-content ul li {
    margin : 0 0 0 3rem;
    padding : 0 0 0 1rem;
    list-style : circle;
    border : none;
}

#sidebar .session-content p:has(a) {
    display: flex;

    justify-content: center;
    align-items: center;

    padding : 1rem 0;
    margin : 1rem 0;
}

#sidebar .session-content p a {
    text-decoration: none;
    padding : 1rem;

    background-color : #57B0CE;
    border : 0.1rem solid white;
    color : white;
    font-family: Equinox;

    transition: border 1s, color 1s, background-color 1s, text-shadow 1s;
}

#sidebar .session-content p a:hover {
    border : 0.2rem solid black;
    color : black;
    background-color: cadetblue;
    text-shadow: 0.1rem 0.1rem 0.1rem;
}

.toggle.active + div {
    max-height : 100%;
}

@media (orientation: portrait) {

    #sidebar * {
        font-size: 1rem;
    }

    #sidebar h2 {
        font-size : 1.5rem;
    }

    #sidebar .session-content h1 {
        font-size : 2rem;
    }

    #sidebar .session-content h2 {
        font-size : 1.5rem;
    }
}