/** CSS der Agentur Ashera **/
/** Hier ist das CSS, das für einzelne Seiten der Webseite **/

/** -------------------- Startseite -------------------- **/
/** Ashera Block **/
#block-ashera-content .text-content .w-startseite__logo {
    float: left;
    width: 30%; 
}
#block-ashera-content .text-content .w-startseite__logo {
    float: left;
    width: 30%;
    margin-right: 30px;
}
#block-ashera-content .node__content {
  padding-block-end: 0;
}
/** News **/
#block-views-block-news-newsblock .view-content,
#block-views-block-bestseller-lizenzen-block-1 .view-content {
  display: flex;
  gap: 2%;
  flex-wrap: wrap;
  margin-block-end: 20px;
}
#block-views-block-news-newsblock .view-content .views-row,
#block-views-block-bestseller-lizenzen-block-1 .view-content .views-row {
  width: 100%;
  margin-bottom: 2rem;
}
#block-views-block-news-newsblock .view-content .node--view-mode-teaser .node__title,
#block-views-block-bestseller-lizenzen-block-1 .node--view-mode-teaser .node__title {
  font-size: 1.25rem;
  line-height: 2rem;
  width: 100%;
  flex-basis: 100%;
  hyphens: auto;
}
#block-views-block-news-newsblock .view-content .node--view-mode-teaser .field,
#block-views-block-bestseller-lizenzen-block-1 .node--view-mode-teaser .field {
  width: 100%;
  margin-block-end: 10px;
}
.node--view-mode-teaser .primary-image img {
  width: 100%;
  height: fit-content;
  border-radius: unset;
}
.node--view-mode-teaser .primary-image {
  position: unset;
}
#block-views-block-news-newsblock .node--view-mode-teaser .primary-image,
#block-views-block-bestseller-lizenzen-block-1 .node--view-mode-teaser .primary-image {
  position: unset;
  width: 100%;
  max-width: 150px;
  margin-bottom: 20px !important;
}
#block-views-block-news-newsblock .node__content,
#block-views-block-bestseller-lizenzen-block-1 .node__content {
  padding-block-end: 20px;
}
#block-views-block-news-newsblock .view-footer,
#block-views-block-bestseller-lizenzen-block-1 .view-footer {
  display: flex;
  justify-content: center;
}
#block-views-block-news-newsblock .view-footer .button.w-more,
#block-views-block-bestseller-lizenzen-block-1 .view-footer .button.w-more {
  margin: 0;
}
/** Pinnwand **/
#block-views-block-news-pinnwandblock .block__content {
  background-color: var(--primaerfarbe);
  padding: 45px;
  border-radius: 10px;
}
#block-views-block-news-pinnwandblock .node__content__wrapper {
  display: flex;
  gap: 2%;
  flex-wrap: wrap;
}
#block-views-block-news-pinnwandblock .node__content__image {
  width: 100%;
  margin-bottom: 30px;
}
#block-views-block-news-pinnwandblock .node__content__body {
  width: 100%;
}
#block-views-block-news-pinnwandblock h3.node__title {
  margin-top: 0;
  font-variant: petite-caps;
}


/** -------------------- Usere Autorinnen und Autoren -------------------- **/
/** Suche **/
#views-exposed-form-autorinnen-und-autoren-autorinnen {
  display: flex;
  gap: 2%;
}
#views-exposed-form-autorinnen-und-autoren-autorinnen .form-item {
  width: 100%;
}
/** A-Z **/
.attachment .view-content {
  gap: 5px !important;
  justify-content: center;
}
.attachment .view-content span a {
  color: var(--text-farbe);
  text-decoration: none;
  font-size: 1.2rem;
  width: 15px;
  display: inline-block;
  text-align: center;
  border-bottom: solid 3px var(--transparent);
}
.attachment .view-content span a.is-active {
  color: var(--sekundaerfarbe);
  border-bottom: solid 3px var(--primaerfarbe-hover);
}
.attachment .view-content span a:hover {
  border-bottom: solid 3px var(--sekundaerfarbe);
}
/** Liste **/
.view-autorinnen-und-autoren .view-content {
  display: flex;
  flex-wrap: wrap;
  gap: 5%;
}
.view-autorinnen-und-autoren .view-content .views-row {
  width: 47%;
}
.view-autorinnen-und-autoren .node--view-mode-teaser .primary-image {
  margin: auto;
  width: 100%;
}
.view-autorinnen-und-autoren .view-content .views-row .node__title {
  font-size: 1.625rem;
  width: 100%;
  text-align: center;
  line-height: 2rem;
  flex-basis: 100%;
  margin: auto;
  margin-top: 10px;
  font-variant: none;
}
.view-autorinnen-und-autoren .node--view-mode-teaser .primary-image a {
  padding-top: 100%;
  position: relative;
}
.view-autorinnen-und-autoren .node--view-mode-teaser .primary-image img {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
}
/** Pager **/
.pager__item {
  background-color: var(--transparent);
  width: 50px;
  height: 50px;
}
.pager__link {
  color: var(--text-farbe);
  border-bottom: solid 3px var(--transparent);
}
.pager__link:hover, .pager__link:active  {
  color: var(--text-farbe);
  background-color: var(--transparent);
  border-bottom: solid 3px var(--sekundaerfarbe);
}
.pager__item--active {
  color: var(--text-farbe);
  background-color: var(--transparent);
  border-bottom: solid 3px var(--primaerfarbe-hover);
}
.pager__items {
  width: fit-content;
  margin: auto;
}

/** --------------------  Autor:innen Seite  -------------------- **/
/** Autor:innen Informationen **/
.w-autorin__infos {
  float: left;
  width: 100%;
  margin: 0 20px 0 0;
  min-width: 250px;
}
.w-autorin__infos .wide-content img {
  width: 100%;
}
.w-autorin__infos .wide-image {
  width: 100%;
  margin-block: 0;
  margin-inline-start: 0;
}
.w-autorin__infos .wide-content {
  margin-inline-start: 0;
  margin-top: 0;
  width: 100%;
}
/** Autor:innen Social Info **/
.w-autorin__infos__social {
  margin: 20px 0 20px 0;
}
.w-autorin__infos__social .field--type-link {
  margin-bottom: 20px;
}
.w-autorin__infos__social .field--type-link::before {
  content: "";
  position: absolute;
  display: inline-block;
  width: 30px;
  height: 30px;
  background-size: cover;
  background-repeat: no-repeat;
}
.w-autorin__infos__social .field--name-field-website::before {
  background-image: url(../images/web-icon.svg);
}
.w-autorin__infos__social .field--name-field-instagram::before {
  background-image: url(../images/instagram-icon.svg);
}
.w-autorin__infos__social .field--name-field-facebook::before {
  background-image: url(../images/facebook-icon.svg);
}
.w-autorin__infos__social .field--name-field-twitter::before {
  background-image: url(../images/twitter-icon.svg);
}
.w-autorin__infos__social .field--type-link a {
  color: var(--primaerfarbe-hover);
  text-decoration: none;
  border-bottom: solid 3px var(--sekundaerfarbe);
  transition: box-shadow 0.3s cubic-bezier(0.55, 0.085, 0, 0.99);
  margin-left: 35px;
}
.w-autorin__infos__social .field--type-link a:hover {
  color: var(--text-farbe);
  box-shadow: inset 0 -2em 0 0 var(--primaerfarbe-light);
  text-decoration: none;
  border-bottom: solid 3px var(--primaerfarbe-light);
}
/** Werke Listen **/
.page-node-autor_in .region--content-below {
  display: unset;
}
.view-vermittelte-werke .view-content, 
.view-aehnliche-buecher .view-content,
.view-weitere-werke .view-content,
.weiterewerke .view-content {
  display: flex;
  gap: 2%;
  flex-wrap: wrap;
  justify-content: space-evenly;
}
.view-vermittelte-werke .view-content .views-row, 
.view-aehnliche-buecher .view-content .views-row,
.view-weitere-werke .view-content .views-row,
.weiterewerke .view-content .views-row {
  width: 100%;
}
.view-vermittelte-werke .node--view-mode-teaser .node__title, 
.view-aehnliche-buecher .node--view-mode-teaser .node__title,
.view-weitere-werke .view-content .views-row .node__title,
.weiterewerke .view-content .views-row .node__title {
  font-size: 1.25rem;
  line-height: 2rem;
  width: 100%;
  flex-basis: 100%;
  font-variant: petite-caps;
}
.view-vermittelte-werke .node--view-mode-teaser .primary-image,
.view-aehnliche-buecher .node--view-mode-teaser .primary-image,
.view-weitere-werke .view-content .views-row .primary-image,
.weiterewerke .view-content .views-row .primary-image {
  width: 100%;
  max-width: 150px;
  margin-bottom: 10px;
}
.view-vermittelte-werke .node--view-mode-teaser .field--name-field-genre,
.path-werke .view-content .views-row .field--name-field-genre,
.view-weitere-werke .view-content .views-row .field--name-field-genre,
.weiterewerke .view-content .views-row .field--name-field-genre {
  margin-block-end: 10px;
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  gap: 2%;
}
.view-vermittelte-werke .field--name-field-verlag,
.view-weitere-werke .field--name-field-verlag,
.weiterewerke .view-content .views-row .field--name-field-verlag {
  display: flex;
  width: 100%;
  gap: 2%;
  margin-bottom: 10px;
}
.field--name-field-genre .field__item a, 
.field--name-field-genre .field__item {
  background-color: var(--primaerfarbe-hover);
  padding: 2px 10px 5px 10px;
  border-radius: 20px;
  width: fit-content;
  color: var(--background-light);
  text-decoration: none;
  display: block;
  transition: 0.2s;
  margin-bottom: 2%;
}
.field--name-field-genre .field__item a:hover {
  background-color: var(--primaerfarbe-hover-2);
}
/** --------------------  Werk Seite  -------------------- **/
/** Werke Informationen **/
.field--name-field-autor-innen .node--view-mode-teaser {
  margin-block-end: 30px;
}
.page-node-buch .field--name-field-autor-innen {
  display: flex;
  flex-wrap: wrap;
  gap: 5%;
}
.page-node-buch .node--type-autor-in .primary-image {
  margin-right: 10px;
}
.page-node-buch .node--type-autor-in a {
  width: 70px;
  height: 70px;
}
.page-node-buch .node--type-autor-in img{
  width: 100%;
  height: 100%;
}
.page-node-buch .node--type-autor-in .node__title{
  font-size: 1.25rem;
}
.w-buch__image {
  float: left;
  width: 100%;
  margin: 0 20px 20px 0;
  min-width: 250px;
}
.w-buch__image .wide-image {
  width: 100%;
  margin-block: 0;
  margin-inline-start: 0;
}
.w-buch__image .wide-content {
  margin-inline-start: 0;
  margin-top: 0;
  width: 100%;
}
.w-buch__image .wide-content img {
  width: 100%;
}
.w-buch__content .field--name-field-genre,
.w-buch__content .field--name-field-kategorie,
.w-buch__content .field--name-field-umfang,
.w-buch__content .field--name-field-verlag,
.w-buch__content .field--name-field-isbn,
.w-buch__content .field--name-field-weiterfuehrender-link {
  display: flex;
  margin-block-end: 15px;
  align-items: baseline;
  gap: 10px;
}
.w-buch__content__umfang {
  display: flex;
  gap: 4px;
}
.w-buch__content .field--name-field-genre .field__items {
  display: flex;
  gap: 5px;
}
.w-buch__content .field--name-field-weiterfuehrender-link a,
.w-buch__content .field--name-field-kategorie a {
  color: var(--primaerfarbe-hover);
  text-decoration: none;
  border-bottom: solid 3px var(--sekundaerfarbe);
  transition: box-shadow 0.3s cubic-bezier(0.55, 0.085, 0, 0.99);
}
.w-buch__content .field--name-field-weiterfuehrender-link a:hover,
.w-buch__content .field--name-field-kategorie a:hover {
  color: var(--text-farbe);
  box-shadow: inset 0 -2em 0 0 var(--primaerfarbe-light);
  text-decoration: none;
  border-bottom: solid 3px var(--primaerfarbe-light);
}
/** --------------------  Werke Liste  -------------------- **/

/** --------------------  Artikel/News Detailseite  -------------------- **/
.page-node-article .primary-image {
  width: 100%;
  float: left;
  margin: 0 20px 20px 0;
  min-width: 250px;
}
/** --------------------  Artikel/News Liste & Bestseller/Lizenzen Liste-------------------- **/
.path-news .view-news .view-content,
.path-bestseller-lizenzen .view-bestseller-lizenzen .view-content,
.path-werke .view-content {
  display: flex;
  flex-wrap: wrap;
  gap: 2%;
  justify-content: space-around;
}
.path-news .view-news .view-content .views-row,
.path-bestseller-lizenzen .view-bestseller-lizenzen .view-content .views-row,
.path-werke .view-content .views-row {
  width: 100%;
  margin-bottom: 2rem;
}
.path-news .view-news .view-content .views-row .primary-image,
.path-bestseller-lizenzen .view-bestseller-lizenzen .view-content .views-row .primary-image,
.path-werke .view-content .views-row .primary-image {
  position: unset;
  width: 100%;
  max-width: 150px;
  margin-bottom: 20px !important;
}
.path-news .view-news .view-content .views-row .node__title,
.path-bestseller-lizenzen .view-bestseller-lizenzen .view-content .views-row .node__title,
.path-werke .view-content .views-row .node__title{
  font-size: 1.25rem;
  line-height: 2rem;
  width: 100%;
  flex-basis: 100%;
}
/** --------------------  Taxonomy Liste  -------------------- **/
.view-taxonomy-term .view-content {
  display: flex;
  flex-wrap: wrap;
  gap: 2%;
}
.view-taxonomy-term .view-content .views-row {
  width: 100%;
}
.view-taxonomy-term .view-content .views-row .field--type-image {
  width: 100%;
  max-width: 150px;
  margin-bottom: 10px;
}
.view-taxonomy-term .view-content .views-row .node--view-mode-teaser .field {
  margin-block-end: 10px;
  width: 100%;
  display: flex;
  flex-wrap: wrap;
}
.view-taxonomy-term .view-content .views-row .node__title {
  font-size: 1.25rem;
  line-height: 2rem;
  width: 100%;
  flex-basis: 100%;
}
.view-taxonomy-term form {
  display: flex;
  gap: 2%;
  flex-wrap: wrap;
}
.view-taxonomy-term form .js-form-item-title,
.view-taxonomy-term form .js-form-item-genre {
  width: 49%;
  min-width: 250px;
}
/** --------------------  Über uns  -------------------- **/
/** Unser Team **/
.team-box {
  display: flex;
  gap: 6%;
  flex-wrap: wrap;
}
.team-box-inner {
  width: 100%;
  margin-bottom: 2rem;
}
.team-box-img {
  padding-top: 300px;
  position: relative;
}
.team-box .team-box-img img {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  object-fit: cover;
  max-width: 300px;
  max-height: 300px;
}
.team-box .team-mail::before {
  background-image: url(../images/mail-icon.svg);
  content: "";
  display: inline-flex;
  width: 30px;
  height: 30px;
  background-size: cover;
  background-repeat: no-repeat;
  margin-right: 5px;
  align-items: center;
}
/** Unser Team NEU**/
.view-unser-team .view-content {
  display: flex;
  gap: 50px;
  flex-direction: column;
}
.team.views-row {
  width: 100%;
}
.views-field-field-e-mail-adresse a::before,
.page-node-teammitglied .field--name-field-e-mail-adresse a::before {
  content: url(../images/mail-icon.svg);
  display: inline-flex;
  width: 30px;
  height: 30px;
  background-size: cover;
  background-repeat: no-repeat;
  margin-right: 5px;
  align-items: center;
  vertical-align: middle;
}
.page-node-teammitglied .primary-image {
  float: left;
  width: 100%;
  margin: 0 20px 0 0;
  min-width: 250px;
}
 @media only screen and (min-width: 768px) {
    .view-unser-team .view-content {
    flex-direction: row;
  }
    .team.views-row {
      width: 50%;
  }
 }
@media only screen and (min-width: 600px) {
    .page-node-teammitglied .primary-image {
    width: 30%;
    } 
  }  
/** --------------------  Suchergebnisse  -------------------- **/
.view-Search #search-form #edit-basic {
  display: flex;
  gap: 2%;
  align-items: end;
  margin-bottom: 20px;
}
.view-Search #search-form #edit-basic .js-form-type-search {
  width: 100%;
  margin: 0;
  min-width: 250px;
}
.view-Search #search-form #edit-basic #edit-submit {
  margin: 20px 0 0 0;
}

/** --------------------  Media Query  -------------------- **/
 /* Small devices (portrait tablets and large phones, 600.w-autorin__infos px and up) */
 @media only screen and (min-width: 600px) {
    /* Allgemein */
    #page-wrapper {
      background-image: url(/themes/ashera/images/background-graphic-600-1.svg);
      background-size: 600px;
    }
    /* Startseite */
    #block-views-block-news-newsblock .view-content .views-row, #block-views-block-bestseller-lizenzen-block-1 .view-content .views-row {
      width: 49%;
    }
    /** Pinnwand **/
    #block-views-block-news-pinnwandblock .node__content__image {
      width: 29%;
      margin-bottom: 0;
    }
    #block-views-block-news-pinnwandblock .node__content__body {
      width: 69%;
    }
    #block-views-block-news-pinnwandblock .node__content__image img {
      margin: auto;
    }
     /* Usere Autorinnen und Autoren */
    .view-autorinnen-und-autoren .view-content .views-row {
      width: 30%;
    }
    /** Autor:innen Seite **/
    .w-autorin__infos {
      width: 30%;
    }

    .view-vermittelte-werke .view-content .views-row,
    .view-aehnliche-buecher .view-content .views-row,
    .view-weitere-werke .view-content .views-row,
    .weiterewerke .view-content .views-row {
      width: 49%;
    }
    /** Werk Seite **/
    .w-buch__image {
      width: 30%;
    }
    /** Artikel/News **/
      .page-node-article .primary-image {
      width: 30%;
    }
    /* Taxonomy Liste */
    .view-taxonomy-term .view-content .views-row {
      width: 49%;
    }
    /** Artikel/News Liste & Bestseller/Lizenzen Liste **/
    .path-news .view-news .view-content .views-row,
    .path-bestseller-lizenzen .view-bestseller-lizenzen .view-content .views-row,
    .path-werke .view-content .views-row {
      width: 49%;
    }
    /* Über uns */
    .team-box-inner {
      width: 47%;
    }

 }
 
 /* Medium devices (landscape tablets, 768px and up) */
 @media only screen and (min-width: 768px) {
      /* Startseite */
      #block-views-block-news-newsblock .view-content .views-row, #block-views-block-bestseller-lizenzen-block-1 .view-content .views-row {
        width: 32%;
      }
      /* Autor:innen Seite */
      .view-vermittelte-werke .view-content .views-row,
      .view-aehnliche-buecher .view-content .views-row,
      .view-weitere-werke .view-content .views-row,
      .weiterewerke .view-content .views-row {
        width: 32%;
      }
      /* Taxonomy Liste */
      .view-taxonomy-term .view-content .views-row {
        width: 32%;
      }
      /** Artikel/News Liste & Bestseller/Lizenzen Liste **/
      .path-news .view-news .view-content .views-row,
      .path-bestseller-lizenzen .view-bestseller-lizenzen .view-content .views-row,
      .path-werke .view-content .views-row {
          width: 32%;
      }
 }
 
 /* Large devices (laptops/desktops, 992px and up) */
 @media only screen and (min-width: 992px) {
      /* Allgemein */
      #page-wrapper {
        background-image: url(/themes/ashera/images/background-graphic-800-1.svg);
        background-size: 800px;
      }
      /* Startseite */
      #block-views-block-news-newsblock .view-content .views-row, #block-views-block-bestseller-lizenzen-block-1 .view-content .views-row {
        width: 23%;
        margin-bottom: 0;
      }
      /* Autor:innen Seite */
      .view-vermittelte-werke .view-content .views-row,
      .view-aehnliche-buecher .view-content .views-row,
      .view-weitere-werke .view-content .views-row,
      .weiterewerke .view-content .views-row {
        width: 23%;
      }
      /* Taxonomy Liste */
      .view-taxonomy-term .view-content .views-row {
        width: 23%;
      }
      /** Artikel/News Liste & Bestseller/Lizenzen Liste **/
      .path-news .view-news .view-content .views-row,
      .path-bestseller-lizenzen .view-bestseller-lizenzen .view-content .views-row,
      .path-werke .view-content .views-row {
        width: 23%;
        margin-bottom: 0;
      }
 }
 
 /* Extra large devices (large laptops and desktops, 1200px and up) */
 @media only screen and (min-width: 1200px) {

 }