.annoy-banner {
  background: orange; }
  .annoy-banner p {
    text-align: center; }
  .annoy-banner a {
    color: black;
    display: block;
    padding: 1em 2em; }

.annoy-banner-off {
  cursor: pointer; }

.annoy-banner_top {
  display: none; }
  .annoy-banner_top .annoy-banner-inner {
    display: flex;
    flex-direction: column; }
    @media screen and (min-width: 960px) {
      .annoy-banner_top .annoy-banner-inner {
        width: 960px;
        margin: auto; } }
    @media screen and (min-width: 400px) {
      .annoy-banner_top .annoy-banner-inner {
        flex-direction: row; } }
  .annoy-banner_top img {
    margin: 0;
    align-self: center;
    width: auto;
    max-height: 40px; }
    @media screen and (min-width: 400px) {
      .annoy-banner_top img {
        max-height: 60px; } }
  .annoy-banner_top .text {
    flex: 1;
    align-self: center;
    padding: .5em 1em; }
  .annoy-banner_top p {
    margin: 0;
    font-size: 1.5em;
    line-height: 1.1em; }
    @media screen and (min-width: 400px) {
      .annoy-banner_top p {
        font-size: 2em; } }
  .annoy-banner_top .annoy-banner-off {
    padding: .5em 1em .5em;
    width: 1em;
    text-align: center;
    font-family: Arial, sans-serif;
    display: block;
    border-radius: 0 0 0 1em;
    position: absolute;
    top: 0;
    right: 0;
    color: black;
    font-size: 13px; }

.annoy-banner-on_top {
  font-size: 13px;
  line-height: 1.15em;
  background: orange;
  z-index: 99;
  font-family: Arial, sans-serif;
  display: block;
  padding: .1em 1em;
  text-align: center;
  border-radius: 0 0 0 1em;
  position: absolute;
  top: 0;
  right: 0;
  color: black;
  max-width: 80%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis; }

.annoy-banner_book-page {
  margin-top: 30px;
  font-size: 2em; }
  .annoy-banner_book-page p {
    margin: 0; }

.annoy-banner_book-fragment-list {
  margin-right: 2em; }

.annoy-banner_blackout {
  display: none;
  position: fixed;
  z-index: 100000;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  background: black;
  color: white;
  font-size: 16pt;
  line-height: 26pt;
  padding: 0;
  overflow: hidden; }
  .annoy-banner_blackout.banner-smallfont {
    font-size: 13pt;
    line-height: 22pt; }
  .annoy-banner_blackout .annoy-banner-inner {
    padding: 0 40% 0 15%;
    height: 100%;
    overflow-y: scroll;
    padding-top: 20vh;
    padding-bottom: 2em;
    width: 101%;
    box-sizing: border-box; }
  .annoy-banner_blackout p {
    text-align: left; }
  .annoy-banner_blackout a {
    color: white;
    position: absolute;
    right: 10%;
    width: 25%;
    border-radius: 24px;
    text-align: center;
    box-sizing: border-box;
    padding: 1em; }
    .annoy-banner_blackout a.annoy-banner-off {
      bottom: 20vh;
      background: #666;
      border-radius: auto 100%;
      font-size: .75em;
      padding: .5em;
      width: 20%;
      margin-right: 2.5%; }
    .annoy-banner_blackout a.action {
      bottom: 40vh;
      background: #018189;
      color: white;
      border-radius: auto 100%;
      padding: 1.5em 1em; }
  @media screen and (max-height: 1000px) {
    .annoy-banner_blackout .annoy-banner-inner {
      padding-top: 5vh; } }
  @media screen and (max-width: 1280px) {
    .annoy-banner_blackout .annoy-banner-inner {
      padding-left: 5%;
      padding-right: 50%;
      padding-left: 5%;
      padding-right: 50%; }
    .annoy-banner_blackout a {
      right: 5%;
      width: 40%; }
      .annoy-banner_blackout a.annoy-banner-off {
        width: 40%;
        margin-right: 0%; } }
  @media screen and (max-width: 1024px) {
    .annoy-banner_blackout {
      font-size: 14pt;
      line-height: 21pt; } }
  @media screen and (max-height: 820px) {
    .annoy-banner_blackout .annoy-banner-inner {
      padding-top: 5vh; } }
  @media screen and (max-width: 820px) and (max-height: 820px) {
    .annoy-banner_blackout a.action {
      bottom: 20vh; }
    .annoy-banner_blackout a.annoy-banner-off {
      bottom: 5vh; } }
  @media screen and (max-height: 400px) {
    .annoy-banner_blackout a.action {
      bottom: 40vh; } }
  .annoy-banner_blackout.annoy-banner-style_blackout_centre {
    background: rgba(0, 0, 0, 0.5); }
    .annoy-banner_blackout.annoy-banner-style_blackout_centre .annoy-banner-inner {
      background: black;
      position: absolute;
      top: 14%;
      left: 14%;
      right: 14%;
      bottom: 14%;
      width: auto;
      height: auto;
      border: 2px solid white;
      overflow-y: auto; }
  @media screen and (min-height: 500px) {
    .annoy-banner_blackout.annoy-banner-style_blackout_upper {
      background: rgba(0, 0, 0, 0.5); }
      .annoy-banner_blackout.annoy-banner-style_blackout_upper .annoy-banner-inner {
        background: black;
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 50%;
        width: auto;
        height: auto;
        border-bottom: 2px solid white;
        overflow-y: auto; }
        .annoy-banner_blackout.annoy-banner-style_blackout_upper .annoy-banner-inner .action {
          bottom: 20vh; }
      .annoy-banner_blackout.annoy-banner-style_blackout_upper .annoy-banner-off {
        bottom: 60vh; } }
.annoy-banner-on_blackout {
  position: fixed;
  z-index: 9999;
  bottom: 0;
  right: 0;
  background: black;
  color: white;
  border-radius: 1em 0 0 0;
  padding: .1em 1em;
  max-width: 80%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis; }

.dynamic-insert {
  background: orange;
  margin: 1em 0;
  user-select: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  padding: 0; }
  .dynamic-insert.with-image {
    min-height: 120px; }
  .dynamic-insert a {
    color: black;
    display: flex;
    flex-direction: row; }
    .dynamic-insert a .text {
      padding: 2em;
      flex: 1;
      align-self: center; }
    .dynamic-insert a img {
      border-radius: 100%;
      margin: 1em;
      align-self: center;
      width: 120px;
      height: 120px; }

.annoy-banner_book-text-intermission {
  display: none; }
  .annoy-banner_book-text-intermission .annoy-banner-inner {
    display: flex;
    flex-direction: column; }
    @media screen and (min-width: 400px) {
      .annoy-banner_book-text-intermission .annoy-banner-inner {
        flex-direction: row; } }
  .annoy-banner_book-text-intermission img {
    margin: 0;
    align-self: center;
    max-height: 60px; }
    @media screen and (min-width: 400px) {
      .annoy-banner_book-text-intermission img {
        max-height: 100px; } }
  .annoy-banner_book-text-intermission .text {
    flex: 1;
    align-self: center;
    padding: .5em 1em; }
  .annoy-banner_book-text-intermission p {
    margin: 0;
    font-size: 1.5em;
    line-height: 1.15em; }
    @media screen and (min-width: 400px) {
      .annoy-banner_book-text-intermission p {
        font-size: 2em; } }
