/* CSS for fast tweaks */
/*
** Google API Import
** -----------------
@import url("https://fonts.googleapis.com/css2?family=Roboto:wght@500&display=swap");

*/

@font-face {
  font-family: "Roboto";
  src: url("../fonts/Roboto/Roboto-Medium.ttf") format("truetype");
}

/* 
** REGION DIRECTLINKS
** ------------------
*/
.region-directlinks .hiag-shortcut-button,
.region-right-sidebar .hiag-shortcut-button {
  -webkit-mask-image: url(../images/masks/shortcut_mask.svg);
  mask-image: url(../images/masks/shortcut_mask.svg);
  -webkit-mask-size: cover;
  mask-size: cover;
  position: relative;
  z-index: 12;
}

.region-directlinks .hiag-shortcuts-view .view-content .views-row,
.region-right-sidebar .hiag-shortcuts-view .view-content .views-row {
  position: relative;
}

.region-directlinks .hiag-shortcuts-view .view-content .views-row::after,
.region-right-sidebar .hiag-shortcuts-view .view-content .views-row::after {
  content: "";
  height: 105%;
  width: 105%;
  -webkit-mask-image: url(../images/masks/shortcut_mask.svg);
  mask-image: url(../images/masks/shortcut_mask.svg);
  -webkit-mask-size: cover;
  mask-size: cover;
  background-color: var(--secondary-color);
  position: absolute;
  bottom: -16px;
  left: -16px;
}

.region-right-sidebar .hiag-shortcuts-view .view-content {
  justify-content: center;
}

.region-directlinks .hiag-shortcuts-view .view-content .views-row,
.region-right-sidebar .hiag-shortcuts-view .view-content .views-row {
  transition: left 0.4s, bottom 0.4s, transform 0.4s;
}
.region-directlinks .hiag-shortcuts-view .view-content .views-row::after,
.region-right-sidebar .hiag-shortcuts-view .view-content .views-row::after {
  transition: left 0.4s, bottom 0.4s;
}
.region-directlinks .hiag-shortcuts-view .view-content .views-row:hover,
.region-right-sidebar .hiag-shortcuts-view .view-content .views-row:hover {
  transform: scale(1.05, 1.05);
}

.region-directlinks .hiag-shortcuts-view .view-content .views-row:hover::after,
.region-right-sidebar
  .hiag-shortcuts-view
  .view-content
  .views-row:hover::after {
  left: 16px;
  bottom: -20px;
}

.region-directlinks
  .view-content
  .views-row:nth-child(odd)
  .hiag-shortcut-button,
.region-right-sidebar
  .view-content
  .views-row:nth-child(odd)
  .hiag-shortcut-button {
  -webkit-mask-image: url(../images/masks/shortcut_mask_odd.svg);
  mask-image: url(../images/masks/shortcut_mask_odd.svg);
}

.region-directlinks .view-content .views-row:nth-child(odd)::after,
.region-right-sidebar .view-content .views-row:nth-child(odd)::after {
  -webkit-mask-image: url(../images/masks/shortcut_mask_odd.svg);
  mask-image: url(../images/masks/shortcut_mask_odd.svg);
}

.hiag-shortcuts-view .hiag-shortcut-button .field--name-field-shortcut-link a,
.region-right-sidebar .hiag-shortcut-button .field--name-field-shortcut-link a {
  color: var(--secondary-color);
}

.region-right-sidebar .hiag-shortcuts-view .view-content .views-row {
  flex: unset;
  width: unset;
  height: 126px;
}

/* 
** REGION BOTTOM TOP BAR
** ---------------------
*/
.region-bottom-top-bar .hiag-main-menu-dropdown-container .hiag-menu-underline {
  background-color: var(--secondary-color);
}

@media screen and (min-width: 1200px) {
  #block-header {
    overflow: visible !important;
  }

  .title-bar .hiag-logo-container,
  .title-bar .hiag-main-title-container {
    transition: transform 0.4s;
  }

  .title-bar:not(.is-stuck) .hiag-logo-container {
    transition: transform 0.4s;
    transform: scale(1.8);
    transform-origin: bottom left;
  }
  .title-bar:not(.is-stuck) .hiag-main-title-container {
    transform: translateX(72px);
  }
}

input.input-group-field:focus {
  border-color: var(--secondary-color);
  border-width: 2px;
  border-right-color: transparent;
}

.hiag-menu-underlined-link > a {
  letter-spacing: 0.145rem;
}

.hiag-layout-container:not(.is-front-page) .region-content {
  margin-bottom: 64px;
}

.region-content .block-page-title-block h1.page-title {
  letter-spacing: 0.29rem;
  font-family: "Roboto", sans-serif;
  font-weight: normal;
  line-height: 1;
  color: #b2b2b2;
}

main > #hiag-layout-content {
  margin-top: 0;
}

.region-breadcrumb ul.breadcrumbs {
  margin-bottom: 64px;
}

.node--view-mode-hiag-card .card-section .field__label,
.node--view-mode-hiag-card .card-section .hiag-tag.field__item {
  color: var(--primary-color);
}

.hiag-layout-container.is-front-page .region-backdrop {
  height: var(--current-orbit-image-height);
  position: relative;
}
#block-orbitstartseite {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100%;
  overflow: visible;
}

#block-orbitstartseite::after {
  content: "";
  position: absolute;
  top: var(--current-orbit-image-height);
  height: 1000px;
  width: 100vw;
  background-color: #fefefe;
  z-index: 4;
}

.hiag-layout-container.is-front-page .hiag-main-wrapper {
  position: relative;
  z-index: 5;
  background-color: #fefefe;
}

.hiag-layout-container .hiag-main-wrapper {
  min-height: calc(100vh + 50px);
  display: flex;
  flex-direction: column;
}

.hiag-main-content-container {
  width: 100%;
}

@media screen and (min-width: 720px) {
  .page-sub-content {
    transform: translateX(12px);
  }
}

.hiag-footer-container {
  flex-grow: 1;
  display: flex;
  flex-direction: column;
}

.region-sub-content {
  flex-grow: 1;
}

.region-sub-content {
  position: relative;
  padding-bottom: 76px;
  margin-bottom: 12px;
}
.region-sub-content::before {
  content: "";
  position: absolute;
  background: linear-gradient(
    180deg,
    rgba(64, 113, 181, 0.33) 0%,
    var(--primary-color) 100%
  );
  bottom: 0;
  left: 0;
  height: 76px;
  width: 100%;
  --mask: radial-gradient(
        52.47px at 50% calc(100% + 44.4px),
        #0000 calc(99% - 4px),
        #000 calc(101% - 4px) 99%,
        #0000 101%
      )
      calc(50% - 48px) calc(50% - 14px + 0.5px) / 96px 28px,
    radial-gradient(
        52.47px at 50% -44.4px,
        #0000 calc(99% - 4px),
        #000 calc(101% - 4px) 99%,
        #0000 101%
      )
      50% calc(50% + 14px) / 96px 28px;
  -webkit-mask: var(--mask);
  mask: var(--mask);
}

.hiag-main-menu-dropdown-container.menu.horizontal .vertical.menu {
  border-color: var(--secondary-color);
  transform: translateY(0.5rem);
  box-shadow: 0px 0px 8px 4px #ffffff33;
}

.region-right-top-bar #block-topbarheadernavigation.card {
  background: transparent;
}

.hiag-worm .view-content > .views-row,
hr {
  border-color: rgba(64, 112, 180, 0.5);
}

#block-footerinhalte {
  max-width: 100.76531rem;
  margin: 0 auto;
}

.views-field-body .field-content a,
.field--type-text-with-summary a {
  display: inline-flex;
  align-items: baseline;
}

.node--view-mode-hiag-person .node__content {
  display: flex;
  flex-wrap: wrap;
  gap: 0.95663rem;
  padding: 0.95663rem 0;
}

@media screen and (max-width: 720px) {
  .node--view-mode-hiag-person .node__content {
    flex-direction: column-reverse;
  }

  .view-council .views-field-field-portrait:after,
  .node--view-mode-hiag-person .field--name-field-portrait:after {
    content: none !important;
  }
}

.node--view-mode-hiag-person > h4 {
  width: 100%;
  border-bottom: 1px solid rgba(64, 112, 180, 0.5);
}

.view-council .views-field-nothing,
.node--view-mode-hiag-person .person-content {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 0.95663rem;
}

.node--view-mode-hiag-person .person-contact-block > div .decode-link {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 4px;
  cursor: pointer;
}

.node--view-mode-hiag-person .person-contact-block > div .decode-link:hover {
  color: var(--secondary-color);
}

.node--view-mode-hiag-person .person-contact-block > div .decode-link:before {
  content: "";
  font-family: "Material Symbols Outlined";
  font-weight: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
  line-height: inherit;
}

.node--view-mode-hiag-person
  .person-contact-block
  > div.field--name-field-phone
  .decode-link:before {
  content: "";
}

.node--view-mode-hiag-person .field--name-field-function {
  font-weight: bold;
  color: rgba(10, 10, 10, 0.65);
  padding-bottom: 4px;
}

.view-council .views-field-nothing .views_field__label {
  margin-top: 0.95663rem;
  font-weight: bold;
}

.view-council .views-field-field-portrait,
.node--view-mode-hiag-person .field--name-field-portrait {
  position: relative;
}

.view-council .views-field-field-portrait > .field-content,
.node--view-mode-hiag-person .field--name-field-portrait > img {
  position: relative;
  z-index: 2;
}

.view-council .views-field-field-portrait:after,
.node--view-mode-hiag-person .field--name-field-portrait:after {
  position: absolute;
  height: 100%;
  width: 100%;
  content: "";
  background-color: var(--secondary-color);
  transform: translate(-10px, 10px);
  top: 0;
  left: 0;
  z-index: 1;
}

.hiag-tag.field__item:last-child:after {
  content: unset;
}

.hiag-tags div.hiag-tag {
  font-size: 98%;
}

.view-council .views_field_function {
  margin-bottom: 0.95663rem;
  font-weight: bold;
}

/*
.node--type-article.node--view-mode-teaser .field--name-title {
  white-space: nowrap;
}
*/
.hiag-article-teaser-link {
  text-overflow: ellipsis;
}

.teaser-info-section .field.field--label-inline .field__item {
  white-space: nowrap;
  text-overflow: ellipsis;
  width: inherit;
  display: block;
  overflow: hidden;
}

.node--view-mode-teaser .teaser-info-section {
  gap: 0 1.05rem !important;
}

.node--view-mode-teaser .teaser-info-section > * {
  line-height: 1 !important;
}

.region-content .views-element-container {
  overflow: hidden;
}

.view .view-footer {
  align-items: unset;
}

.view .view-footer .button {
  margin: 0;
}

.node--view-mode-teaser .field + .field {
  margin-top: 0;
}

.field--name-field-pdf-viewer .field__item,
.media--view-mode-iframe .field--name-field-media-document .field__item {
  display: flex;
  flex-direction: column;
  gap: 0;
}

.field--name-field-pdf-viewer iframe,
.media--view-mode-iframe .field--name-field-media-document iframe {
  max-width: 800px;
  width: 100%;
  aspect-ratio: 21 / 28;
  border: none;
}

.views-field-field-connected-content .field-content .view-header {
  display: none;
}

.menu--account .is-dropdown-submenu {
  background-color: black;
  transform: translateY(-5px);
  border-radius: 5px;
}

.menu--account .menu-item.is-dropdown-submenu-parent > a::after {
  transform: rotate(180deg);
}

div.account-menu {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
}
div.account-menu div.menu-item:not(.menu-item--expanded) {
  height: 160px;
  width: 160px;
  border: 1px solid #b2b2b2;
  border-radius: 4px;
  display: flex;
  flex-wrap: wrap;
  transition: transform 0.2s, border-color 0.2s;
}

div.account-menu div.menu-item:not(.menu-item--expanded):hover {
  border-color: #535353;
}

div.account-menu div.menu-item:not(.menu-item--expanded):hover {
  transform: scale(1.1);
}

div.account-menu div.menu-item.menu-item--expanded {
  width: 100%;
  display: flex;
  flex-direction: column;
}

div.account-menu div.menu-item.menu-item--expanded > a {
  text-align: left;
  color: #b2b2b2;
  transition: color 0.2s;
  font-size: 120%;
  font-weight: bold;
}

div.account-menu div.menu-item.menu-item--expanded > a:hover {
  cursor: default;
}

div.account-menu div.menu-item a {
  height: 100%;
  width: 100%;
  padding: 10px 5px;
  text-align: center;
}

div.account-menu div.menu-item a > .link-description {
  font-size: 95%;
  opacity: 80%;
  color: #b2b2b2;
  transition: color 0.2s;
}

div.account-menu
  div.menu-item:not(.menu-item--expanded):hover
  a
  .link-description {
  color: #535353;
}

div.account-menu div.menu-item a > .link-title {
  font-weight: bold;
  color: #b2b2b2;
  transition: color 0.2s;
}

div.account-menu div.menu-item:not(.menu-item--expanded):hover a .link-title {
  color: #535353;
}

.view .view-footer {
  display: block;
}

.view .view-footer a.button {
  float: right;
}

.field--name-field-phone-image.field__item img,
.field--name-field-phone-image.field__item,
.field--name-field-email-image.field__item img,
.field--name-field-email-image.field__item {
  pointer-events: none;
  user-select: none;
  -moz-user-select: none;
  -khtml-user-select: none;
  -webkit-user-select: none;
  -o-user-select: none;
}

.field--name-field-phone-image.field__item,
.field--name-field-email-image.field__item {
  display: flex;
  align-items: center;
  gap: 4px;
}

.field--name-field-phone-image.field__item:before {
  content: "";
  font-family: "Material Symbols Outlined";
  font-weight: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
  line-height: inherit;
}

.field--name-field-email-image.field__item:before {
  content: "";
  font-family: "Material Symbols Outlined";
  font-weight: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
  line-height: inherit;
}

.text-to-image-converter-wrapper label.required > span:after {
  content: "*";
  color: red;
}

p.text-to-image-converter-reference {
  line-height: 1.45;
}

div.text-to-image-converter-preview-container {
  --checker-background: #cacaca;
  min-height: 100px;
  background-color: #e5e5f7;
  opacity: 0.8;
  background-image: repeating-linear-gradient(
      45deg,
      var(--checker-background) 25%,
      transparent 25%,
      transparent 75%,
      var(--checker-background) 75%,
      var(--checker-background)
    ),
    repeating-linear-gradient(
      45deg,
      var(--checker-background) 25%,
      #e5e5f7 25%,
      #e5e5f7 75%,
      var(--checker-background) 75%,
      var(--checker-background)
    );
  background-position: 0 0, 10px 10px;
  background-size: 20px 20px;
  padding: 10px;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}

div.text-to-image-converter-preview-container canvas {
  border: 1px dotted #ff0000;
}

.text-to-image-converter-results {
  margin-bottom: 1.02041rem;
}

div.text-to-image-converter-preview-container canvas.is-empty {
  border-color: transparent;
}

.region-content .block.card {
  background-color: transparent;
  box-shadow: none;
  border: 1px solid #cacaca;
}

.region-content .block.card .card-divider {
  background-color: transparent;
}

table > * {
  border-left: none !important;
  border-right: none !important;
}

@media screen and (min-width: 1024px) {
  .node--view-mode-full .page-sub-content .field .field__label {
    color: #fefefecc;
  }

  .node--view-mode-full .page-sub-content .field a {
    color: #fefefe;
  }
}

@media screen and (max-width: 1024px) {
  .node--view-mode-full .page-sub-content .field .field__label {
    min-width: 150px;
  }

  .node--view-mode-full .page-sub-content .field .field__label::after {
    content: ":";
  }

  .node--view-mode-full .page-sub-content .field {
    display: flex;
    flex-wrap: wrap;
  }
}

@media screen and (max-width: 500px) {
  .region-left-top-bar
    .node--type-header-content
    .hiag-main-title-container
    h1 {
    width: 100%;
    overflow-x: visible;
    display: block !important;
    min-width: 250px;
    max-height: 20px;
  }

  .node--view-mode-full .page-sub-content .field {
    flex-direction: column;
  }
}

.orbit img {
  min-height: 200px !important;
}

@media screen and (max-width: 720px) {
  .is-front-page .view.hiag-side-by-side span.field--name-title {
    font-size: 100%;
  }

  .is-front-page .view.hiag-side-by-side .node--view-mode-teaser {
    gap: 4px;
  }
}

#block-footerinhalte .tabs .tabs-title.is-active a {
  border-bottom: 3px solid #33598e;
}

.hiag-mini.hiag-shortcuts-view .hiag-shortcut-button.button {
  padding-left: 2.5em;
  padding-right: 2.5em;
}

.region-sub-content {
  display: flex;
  flex-wrap: wrap;
}

.region-sub-content > * {
  flex: 1;
}

.region-sub-content #block-footerinhalte {
  min-width: 600px;
}

.region-sub-content #block-hiag-base-theme-information {
  min-width: 300px;
  max-width: 544px;
  width: 33.58844rem;
}

#hiag-main-menu.hiag-main-menu--is-safari.is-anchored {
  transform: translateY(calc(-1 * var(--title-bar-bottom-wrapper-height)));
}

.responsive-blocks-tabs .tabs {
  max-width: 100vw;
}

@media screen and (max-width: 1024px) {
  footer table tbody td {
    padding-bottom: 0.525rem;
    padding-bottom: 0.525rem;
  }
  footer table tbody td:first-child {
    padding-bottom: 0;
  }
}

.view-content.accordion .views-field {
  display: flex;
  flex-wrap: wrap;
}

@media screen and (max-width: 420px) {
  .view-content.accordion .views-field {
    flex-direction: column;
  }
}

.view-content.accordion .views-field .views-label {
  min-width: 180px;
  max-width: 180px;
  font-weight: bold;
  color: #b2b2b2;
}

.view-content.accordion .views-field .views-content {
  flex: 1;
}

.view-content.accordion .views-field > .field-content:first-child {
  width: 100%;
}

.hiag-link--image::before {
  content: none !important;
}
.hiag-link--image {
  overflow: visible;
  margin: 1.05rem;
}

.hiag-link--image:hover::before {
  content: "" !important;
  position: absolute;
  width: calc(100% + 1.05rem);
  height: calc(100% + 1.05rem);
  top: calc(-0.5 * 1.05rem);
  left: calc(-0.5 * 1.05rem);
  background-color: #37609b;
  opacity: 0.1;
}

select + .description {
  height: 0px;
  font-size: 80%;
  transform: translateY(-10px);
}

#block-hiag-base-theme-nachrichtenbanner {
  min-height: 100px;
  width: 400px;
  max-width: calc(100vw - 40px);
  position: absolute;
  z-index: 1;
  background: #ffffff66;
  backdrop-filter: blur(5px);
  padding: 20px;
  margin: 20px;
}

.d-flex {
  display: flex;
}

#block-hiag-base-theme-nachrichtenbanner .flags-container > img {
  height: 144px;
  width: auto;
}

.container-flags-message {
  align-items: center;
  gap: 12px;
}

.container-flags-message .flags-container {
  min-width: 200px;
  display: inline-flex;
  gap: 2px;
}

.container-flags-message:first-child {
  flex: 1;
}

@media screen and (min-width: 1024px) {
  #block-hiag-base-theme-nachrichtenbanner {
    margin-top: 58px;
  }
}

@media screen and (max-width: 1024px) {
  #block-hiag-base-theme-nachrichtenbanner {
    transform: scale(65%);
    transform-origin: 0% 0%;
  }
}

#hiag-layout-content {
  min-height: 600px;
}
