html {
    
    background-color:white;
    background-repeat: no-repeat;
    background-size:cover;
    color:#57371d;
    font-family: "IBM Plex Serif";

}

@font-face {
    font-family: "IBM Plex Serif";
    src: url(/assets/fonts/ibmplexserif/IBMPlexSerif-Thin.woff2) format("woff2");
    font-weight: 100;
    font-style: normal;
}

.container-split {
    display: grid;
    grid-template-columns: auto 1fr;
    height: 100%;
    overflow: scroll;
}

* {
    box-sizing: border-box;
}

div {
    display: block;
    unicode-bidi: isolate;
}

body {
    letter-spacing: 1px;
    image-rendering: crisp-edges;
    -webkit-font-smoothing: antialiased;
    width:1000px;
}

.script-list {
    display: grid;
    align-self: start;
    width:300px;
    max-height: 1000px;
    overflow-y:scroll;
    padding: 2.5px;
    gap: 2.5px;
}

.transcript {
    max-width: 100%;
    width:700px;
    height:1000px;
    justify-self: center;
    align-self: center;
    position:relative;
    display:block;
    width: 100%;
    overflow:hidden;
    padding:5px;
}

iframe {

    width: 690px;
    padding:5px;
    height: 100%;
    border: none;
    overflow-y:scroll;
}

.disclaimer {
    font-size:75%;
}

a {

    color:#e240a4;
}

/* ===== Scrollbar CSS ===== */
  /* Firefox */
  * {
    scrollbar-width: thin;
    scrollbar-color: #dfafc0 #ffffff;
  }

  /* Chrome, Edge, and Safari */
  *::-webkit-scrollbar {
    width: 2px;
  }

  *::-webkit-scrollbar-track {
    background: #ffffff;
  }

  *::-webkit-scrollbar-thumb {
    background-color: #dfafc0;
    border-radius: 10px;
    border: 3px none #ffffff;
  }

  .script {
    width:650px;
    overflow-x:hidden;
  }