/* TWEAKS FOR DEFAULT ITCENTER LAYOUT */
:root {
  --menu-size-reduce: 150px;
}

#footer .list-group#social-media-list #bluesky {
    content: url("/assets/itcenter-layout/bluesky-ecf00af8.svg");
}

#footer .list-group#social-media-list #instagram {
    content: url("/assets/itcenter-layout/instagram-4e23cc2f.svg");
}

/* in Chrome, the footer is only 380px, make sure no pixels appear at the bottom */
#footer {
  min-height: 384px;
}

.breadcrumb-container {
  z-index: 5;
}

.page-item:first-child .page-link {
  text-align: right;
}

menu {
  overflow: auto;
}

menu #closeMenu {
  margin-top: 0;
  padding-top: 0;
  min-height: 60px;
}

menu .blue-top-div {
  padding-top: 50px; /* 129px */
}

menu #menu-body .list-group-item.active {
  background-color: #00549f !important;
  color: #fff;
}

menu #menu-body .list-group-item {
  padding-top: 0.4rem;
  padding-bottom: 0.4rem;
}

menu #menu-body .list-group-item.collapsed .icon {
  background: none;
}

menu #menu-body .list-group-item:not(.collapsed) .icon {
  background: none;
}

menu #menu-body .list-group-item.collapsed .icon::before {
  content: "\f067";
  font-family: "Font Awesome 7 Free";
  font-weight: 900;
  font-size: 1rem;
  position: absolute;
}

menu #menu-body .list-group-item:not(.collapsed) .icon::before {
  content: "\f068";
  font-family: "Font Awesome 7 Free";
  font-weight: 900;
  font-size: 1rem;
  position: absolute;
}

.navbar #username {
  height: 40px;
  position: relative;
  display: flex;
  margin-right: 0.5rem;
}

html body main {
  min-height: calc(100% - 850px);
}

html body main #breadcrumbs + .content-sidemenu {
  padding: 130px 25px 20px 25px; /* 210px 70px 20px 70px */
  min-height: calc(100vh - 850px);
}

html body main .content-sidemenu {
  padding: 70px 25px 20px 25px;
  min-height: calc(100vh - 850px); /* calc(100vh - 317px) */
}

.navbar #search-bar {
  margin-right: 0; /* 0.2rem */
}

#nav-lang {
  margin-left: 0; /* 0.5rem */
}

#nav-global #search-bar {
  display: none;
}

.navbar #search-bar #search-input-icon {
  position: absolute;
  right: 0;
  width: 40px;
  min-width: unset;
  background: url("/assets/itcenter-layout/IconSearch-6951e31a.svg") 6px 4px no-repeat;
  background-size: 28px 30.39px;
  background-color: var(--rwth-blue);
}

.navbar #search-bar #search-area .search-input {
  width: calc(100% - 40px);
  left: 0;
  position: absolute;
}

#nav-username-full {
  display: none;
}

.input-group > .btn,
.input-group > .btn-sm,
.input-group > .btn-lg {
  margin: 0;
}

html body #menu-title {
  margin-top: 40px;
  padding: 25px 10px 10px 10px;
  background-color: var(--rwth-black);
  color: var(--rwth-white);
}

html body main #menu-icon {
  left: 0;
  top: 0;
  border-bottom: none;
  padding: 0 0 0 6px;
  margin-top: -2px;
  width: 40px;
  height: 40px;
  z-index: 1020;
}

html body main #menu-icon::before {
  font-family: "Font Awesome 7 Free";
  font-weight: 900;
  font-size: 2rem;
  content: "\f0c9";
  color: var(--rwth-white);
}

.navbar .app-header-container {
  margin-left: 40px;
}

#nav-username-dropdown-menu-link.nav-username::before {
  font-family: "Font Awesome 7 Free";
  font-weight: 900;
  content: "\f007";
  color: var(--rwth-white);
}

/* bootstrap sm grid breakpoint */
@media(min-width: 576px) {
  #nav-username-dropdown-menu-link.nav-username::before {
    content: "";
  }

  #nav-username-full {
    display: inline-block;
  }
}

/* bootstrap md grid breakpoint */
@media(min-width: 768px) {
  /* in Chrome, the footer is only 210px, make sure no pixels appear at the bottom */
  #footer {
    min-height: 312px;
  }

  .breadcrumb-container {
    height: unset; /* 112px */
    top: unset; /* 38px */
  }

  .navbar #title:not(.headerNotContainsUsername) {
    display: flex;
  }

  .navbar .app-header-container {
    margin-left: 40px; /* 150px */
  }

  .modal-dialog:not(.modal-attached) .modal-content {
    min-width: 748px;
  }

  menu #closeMenu {
    padding-top: 20px;
    min-height: 80px;
  }

  html body main #breadcrumbs + .content-sidemenu {
    padding: 100px 25px 20px; /* 175px 150px 20px */
    min-height: calc(100vh - 333px);
  }

  html body main .content-sidemenu {
    padding: 50px 25px 20px;
    min-height: calc(100vh - 333px);
  }

  html body #menu-title #menu-title_text {
    display: none;
  }
}

/* boostrap lg grid breakpoint */
@media(min-width: 992px) {
  html body main #breadcrumbs + .content-sidemenu {
    padding-top: 100px; /* 175px */
  }

  html body main .content-sidemenu {
    padding-top: 40px;
  }

  .next-lang > span { /* copy of .next-lang a */
    padding-left: 1.3rem !important;
    padding-right: 1rem !important;
  }

  menu .blue-top-div {
    display: block !important;
  }

  #nav-global #search-bar {
    display: flex;
  }

  menu .navbar,
  menu #menu-title {
    display: none;
  }
}

a.home {
  background: url("data:image/svg+xml;base64,PHN2ZyBkYXRhLW5hbWU9IkViZW5lIDEiIGlkPSJFYmVuZV8xIiB2aWV3Qm94PSIwIDAgMjggMjQiIHdpZHRoPSIyNHB4IiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjxwYXRoIGNsYXNzPSJjbHMtMSIgZD0iTTE5Ljg1LDIwLjA4bC0uMDYtNi4yOUwxMi45NCw4LjM0LDYuNSwxMy44MmwtLjA4LDYuMjZoNS4yNHYtM2MwLTEsLjc2LTEuMzEsMS42LTEuMzFBMS4zMSwxLjMxLDAsMCwxLDE0LjU3LDE3aDB2M1oiIGRhdGEtbmFtZT0iUGZhZCAxIiBmaWxsPSIjMDA1NDlmIiBpZD0iUGZhZF8xIj48L3BhdGg+PHBhdGggY2xhc3M9ImNscy0xIiBkPSJNMy42OCwxMi42Mmw5LjE4LTcuNzVMMTYuNyw3LjkzVjUuNjloMy4xNXY0LjYzbDIuNDUsMi4zLTEsMS4yLTguNDUtNi43TDQuNzMsMTMuOVoiIGRhdGEtbmFtZT0iUGZhZCAyIiBmaWxsPSIjMDA1NDlmIiBpZD0iUGZhZF8yIj48L3BhdGg+PC9zdmc+") 0px 0px no-repeat;
  width: 24px;
  height: 24px;
}

button#search-button-cancel {
  background: url("data:image/svg+xml;base64,PHN2ZyBkYXRhLW5hbWU9IkViZW5lIDEiIGlkPSJFYmVuZV8xIiB2aWV3Qm94PSIwIDAgMzYgMzUiIHdpZHRoPSIyOHB4IiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjxnIGRhdGEtbmFtZT0iUGZhZCA1NiIgaWQ9IlBmYWRfNTYiPjxwYXRoIGNsYXNzPSJjbHMtMSIgZD0iTTI5LjM4LDYuMjJhMS45NCwxLjk0LDAsMCwwLTIuNzIsMGwtOC43Miw4LjcyTDkuMTksNi4yMkExLjkyLDEuOTIsMCwwLDAsNi40Nyw4Ljk0aDBsOC43NSw4LjcyTDYuNSwyNi40M2ExLjk0LDEuOTQsMCwwLDAsMCwyLjcyLDEuODYsMS44NiwwLDAsMCwyLjYyLjA4bC4wNy0uMDgsOC43NS04LjcyLDguNzUsOC43NWExLjg2LDEuODYsMCwwLDAsMS4zNS41OCwxLjg0LDEuODQsMCwwLDAsMS4zNC0uNTgsMS45NCwxLjk0LDAsMCwwLDAtMi43MmwtOC43MS04Ljc1LDguNzUtOC44YTEuODgsMS44OCwwLDAsMCwwLTIuNjdaIiBmaWxsPSIjMDA2OWIyIj48L3BhdGg+PHBhdGggY2xhc3M9ImNscy0xIiBkPSJNMjgsMzAuMjZhMi4zOSwyLjM5LDAsMCwxLTEuNzEtLjczbC04LjM5LTguMzlMOS41NCwyOS41czAsLjA2LS4wOC4wOWEyLjM0LDIuMzQsMCwwLDEtMy4zMi0uMSwyLjQ1LDIuNDUsMCwwLDEsMC0zLjQxbDguMzctOC40Mkw2LjEyLDkuMjlhMi40MSwyLjQxLDAsMCwxLDAtMy40MiwyLjQ2LDIuNDYsMCwwLDEsMy40MiwwbDguNCw4LjM2LDguMzctOC4zNmEyLjQ1LDIuNDUsMCwwLDEsMy4zNi0uMDZsLjEuMDhhMi4zOCwyLjM4LDAsMCwxLDAsMy4zN2wtOC4zOSw4LjQ1LDguMzYsOC40YTIuNDYsMi40NiwwLDAsMSwwLDMuNDJBMi4zNSwyLjM1LDAsMCwxLDI4LDMwLjI2Wk0xNy45NCwxOS43MiwyNywyOC44M2ExLjQzLDEuNDMsMCwwLDAsMSwuNDMsMS4zNSwxLjM1LDAsMCwwLDEtLjQyLDEuNDUsMS40NSwwLDAsMCwwLTJsLTktOS4xLDkuMS05LjE1YTEuNCwxLjQsMCwwLDAsMC0xLjkyTDI5LDYuNThhMS40NCwxLjQ0LDAsMCwwLTIsMGwtOS4wNyw5LjA3TDguODQsNi41OGExLjQ3LDEuNDcsMCwwLDAtMiwwLDEuNDUsMS40NSwwLDAsMCwwLDJsOS4xMSw5LjA3TDYuODYsMjYuNzhhMS40NCwxLjQ0LDAsMCwwLDAsMiwxLjM1LDEuMzUsMCwwLDAsMS45MS4wNloiIGZpbGw9IiMwMDY5YjIiPjwvcGF0aD48L2c+PC9zdmc+") 6px 6px no-repeat;
  width: 40px;
  height: 40px;
}

span.menu-close-button {
  background: url("data:image/svg+xml;base64,PHN2ZyBjbGFzcz0ibWVudS1jbG9zZS1idXR0b24iIGRhdGEtbmFtZT0iRWJlbmUgMSIgZGF0YS10b2dnbGU9ImNvbGxhcHNlIiBocmVmPSIjbWVudSIgaWQ9IkViZW5lXzEiIHZpZXdCb3g9IjAgMCAzNiAzNSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48ZyBkYXRhLW5hbWU9IlBmYWQgNTYiIGlkPSJQZmFkXzU2Ij48cGF0aCBkPSJNMjkuMzgsNi4yMmExLjk0LDEuOTQsMCwwLDAtMi43MiwwbC04LjcyLDguNzJMOS4xOSw2LjIyQTEuOTIsMS45MiwwLDAsMCw2LjQ3LDguOTRoMGw4Ljc1LDguNzJMNi41LDI2LjQzYTEuOTQsMS45NCwwLDAsMCwwLDIuNzIsMS44NiwxLjg2LDAsMCwwLDIuNjIuMDhsLjA3LS4wOCw4Ljc1LTguNzIsOC43NSw4Ljc1YTEuODYsMS44NiwwLDAsMCwxLjM1LjU4LDEuODQsMS44NCwwLDAsMCwxLjM0LS41OCwxLjk0LDEuOTQsMCwwLDAsMC0yLjcybC04LjcxLTguNzUsOC43NS04LjhhMS44OCwxLjg4LDAsMCwwLDAtMi42N1oiIGZpbGw9IiNmZmYiPjwvcGF0aD48cGF0aCBkPSJNMjgsMzAuMjZhMi4zOSwyLjM5LDAsMCwxLTEuNzEtLjczbC04LjM5LTguMzlMOS41NCwyOS41czAsLjA2LS4wOC4wOWEyLjM0LDIuMzQsMCwwLDEtMy4zMi0uMSwyLjQ1LDIuNDUsMCwwLDEsMC0zLjQxbDguMzctOC40Mkw2LjEyLDkuMjlhMi40MSwyLjQxLDAsMCwxLDAtMy40MiwyLjQ2LDIuNDYsMCwwLDEsMy40MiwwbDguNCw4LjM2LDguMzctOC4zNmEyLjQ1LDIuNDUsMCwwLDEsMy4zNi0uMDZsLjEuMDhhMi4zOCwyLjM4LDAsMCwxLDAsMy4zN2wtOC4zOSw4LjQ1LDguMzYsOC40YTIuNDYsMi40NiwwLDAsMSwwLDMuNDJBMi4zNSwyLjM1LDAsMCwxLDI4LDMwLjI2Wk0xNy45NCwxOS43MiwyNywyOC44M2ExLjQzLDEuNDMsMCwwLDAsMSwuNDMsMS4zNSwxLjM1LDAsMCwwLDEtLjQyLDEuNDUsMS40NSwwLDAsMCwwLTJsLTktOS4xLDkuMS05LjE1YTEuNCwxLjQsMCwwLDAsMC0xLjkyTDI5LDYuNThhMS40NCwxLjQ0LDAsMCwwLTIsMGwtOS4wNyw5LjA3TDguODQsNi41OGExLjQ3LDEuNDcsMCwwLDAtMiwwLDEuNDUsMS40NSwwLDAsMCwwLDJsOS4xMSw5LjA3TDYuODYsMjYuNzhhMS40NCwxLjQ0LDAsMCwwLDAsMiwxLjM1LDEuMzUsMCwwLDAsMS45MS4wNloiIGZpbGw9IiNmZmYiPjwvcGF0aD48L2c+PC9zdmc+") 0px 0px no-repeat;
  width: 28px;
  height: 28px;
}

/* TODO OLD STUFF THAT NEEDS TO BE CHECKED */
body {
  position: relative; /* for development watermark */
}

/* no color change on hover with no username dropdown */
.navbar .navbar-nav li:hover a.nav-link-nohover,
.navbar .navbar-nav .navbar-inverse .navbar-nav > li:focus a.nav-link-nohover {
  background-color: transparent;
}

/* separator for menu items */
menu #menu-body hr.list-group-item-separator {
  height: 2px;
  padding: 0;
  margin: 0;
}

menu #menu-body .list-group-item.list-group-item-content[data-bs-toggle="collapse"] {
  cursor: pointer;
}

menu #menu-body .list-group-item.list-group-item-content:not([data-bs-toggle="collapse"]):focus,
menu #menu-body .list-group-item.list-group-item-content:not([data-bs-toggle="collapse"]):hover {
  background-color: transparent !important;
  color: var(--rwth-black) !important;
}

/* GENERAL ----------------------------------------------------------------- */
/* breaks according to \n */
.text-pre-wrap {
  white-space: pre-wrap !important;
}

/* enable hyphenation for words */
.hyphen {
  overflow-wrap: break-word;
  word-wrap: break-word;
  -webkit-hyphens: auto;
  -ms-hyphens: auto;
  -moz-hyphens: auto;
  hyphens: auto;
}

/* display overflowing text as ellipsis */
.text-overflow-ellipsis {
  overflow: hidden;
  text-overflow: ellipsis !important;
}