/*!*********************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js!./src/css/index.css ***!
  \*********************************************************************/
:root {
  --main-bg-color: #F4F4f4;
  --main-text-color: #191919;
}

@media (prefers-color-scheme: dark) {
  :root {
    --main-bg-color: #2C2C2C;
    --main-text-color: #F4F4F4;
  }
}

* {
  font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
  color: var(--main-text-color);
  background-color: var(--main-bg-color);
}

input[type=file] {
  max-width: 40em;
  border-color: black;
  border: .1em;
  border-style: solid;
  border-radius: .2em;
  cursor: pointer;
}

input[type=button] {
  cursor: pointer;
  height: 2em;
}

input:disabled {
  background-color: #888;
}

#edit-text {
  margin-top: .5em;
  max-width: 80em;
  max-height: 80vh;
  resize: none;
}

#controls {
  max-width: 80em;
}

#play, #pause, #stop, #options {
  width: 15em;
  height: 2em;
  cursor: pointer;
  margin-bottom: .5em;
}

#start-bookmark, #bookmark {
  width: 30.4em;
  height: 2em;
  cursor: pointer;
}

dialog > * {
  padding-bottom: 1em;
}

datalist {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  writing-mode: vertical-lr;
  width: 30vw;
}

input[type="range"] {
  width: 30vw;
  margin: 0;
}

#links {
  list-style-type: none;
}

#links li {
  display: inline-block;
  padding-right: 0.5rem;
}

@media screen and (max-width: 80em) {
  body {
    align-content: center;
  }

  #edit-text {
    max-width: 90vw;
    max-height: 80vh;
    resize: none;
  }
}

@media screen and (max-width: 40em) {
  input[type=file] {
    width: 92vw;
  }

  #pdf-read {
    width: 92vw;
  }

  #play, #pause, #stop, #options {
    width: 22vw;
    cursor: pointer;
  }

  #start-bookmark, #bookmark {
    width: 44vw;
    height: 2em;
    cursor: pointer;
  }
}