body img {
  max-width: calc(100vw - 7px) !important;
}

/*
 * Breakpoints are put between target width values rather than at them.
 *
 * Target width/breakpoint:
 *
 * 175/1px, 215/190px, 240/225px, 320/260px, 360/340px, 375/368px,
 * 385/380px, 400/392px, 414/408px, 425/420px, 480/450px,
 * others: 490px, 600px
 */

/* max-width breakpoints (if "at the most" / =<) */

@media (max-width: 750px) {
  body #navigation_sidebar {
    display: none !important;
  }
  body #outer_content_container {
    width: calc(100vw - 7px) !important;
  }
  body #content_iframe {
    width: 100% !important;
  }
  body #outer_container {
    width: 100% !important;
  }
  body #main_content {
    margin: auto !important;
    max-width: 90vw !important;
    padding: 0 !important;
  }
  body #main_content_idx {
    max-width: 90vw !important;
    padding: 0 !important;
  }
  body #articles_link_desktop {
    display: none !important;
  }
  body #articles_link_mobile {
    display: block !important;
    font-size: 22px !important;
  }
  body #text_container {
    max-width: 90vw !important;
    padding: 0 !important;
    border: none !important;
  }
  body #return_link_to_idx {
    display: block !important;
  }
  /*
  body #return_link_to_home {
    display: none !important;
  }
  */
  body #print_friendly_button {
    display: none !important;
  }
  body img {
    max-width: 90vw !important;
    height: auto !important;
  }
  body video {
    max-width: 90vw !important;
    height: auto !important;
  }
  body audio {
    max-width: 90vw !important;
    height: auto !important;
  }
  body input {
    font-size: 20px !important;
  }
  blockquote, p {
    margin-right: 0 !important;
    padding: 0 !important;
  }
  blockquote::before {
    display: none !important;
  }
  blockquote img {
    margin-left: -15px !important;
  }
  audio {
    min-width: 45px !important;
  }
}

/* Styles below assume a mobile device: (hover:none), (pointer:none), (pointer:coarse) */

@media (hover:none), (pointer:none), (pointer:coarse) {
  body, p, div, span {
    /* font-size: 18px !important; */
  }
  body #header_title {
    font-size: 25px !important;
  }
  audio {
    min-height: 45px !important;
  }

  /* Static links */
  body #static_links_upper_left_background {
    width: 100% !important;
    height: 40px !important;
  }
  body #cogwheel_icon {
    width: 28px !important;
    height: 28px !important;
  }
  body #cogwheel_options {
    width: 220px !important;
    font-size: 20px !important;
    line-height: 34px !important;
  }
  body #search_link {
    display: none !important;
  }
  body.body_archive .entry_line a {
    font-size: 20px !important;
  }
  body.body_archive .entry_date {
    width: 45px !important;
    font-size: 14px !important;
  }
  body.body_archive #return_link_to_home {
    font-size: 18px !important;
  }
  body.body_archive #return_link_to_idx {
    display: none !important;
  }
  body.body_archive #spacertop {
    height: 40px !important;
  }
  body.body_archive #articles_list {
    line-height: 30px !important;
  }

  /* Player style overrides */
  .cpx_custom_player_time_indicator {
    font-size: 14px !important;
    font-weight: bold;
    right: 2px !important;
    top: 5px !important;
  }
  .cpx_custom_player_progress_bar {
    width: calc(100% - 78px) !important;
    height: 14px !important;
    top: 8px !important;
  }
  /*
  .cpx_custom_player_start_button {
    border-left: solid 20px #fff !important;
  }
  .cpx_custom_player_pause_button {
    border-left: solid 6px #fff !important;
    border-right: solid 6px #fff !important;
  }
  */
}

/* min-width breakpoints (if "at least" / >=) */
/* The following assume mobile device */

@media (hover:none), (pointer:none), (pointer:coarse) and (min-width: 260px) {
  body, p, div, span {
    /* font-size: 22px !important; */
  }
}
@media (hover:none), (pointer:none), (pointer:coarse) and (min-width: 368px) {
  body #title {
    font-size: 1.1em !important;
    font-weight: normal !important;
  }
}
@media (hover:none), (pointer:none), (pointer:coarse) and (min-width: 408px) {
  body, p, div, span {
    /* font-size: 22px !important; */
  }
}
@media (hover:none), (pointer:none), (pointer:coarse) and (min-width: 600px) {
  body {
    margin-left: calc(100vw / 12.3) 0 !important;
    margin-right: calc(100vw / 12.3) 0 !important;
    /* font-size: 24px !important; */
  }
}