/* --- Custom MLU CSS ----------------------------------------------------------------

╰(◉ᾥ◉)╯

Theme Name: StudIP MLU Theme
Custom CSS Styles
Author: Franz Schünzel, Jonas Fohry
*/

/* ----------------------------------------------------------------------------------------------
   --- Allgemeines -------------------------------------------------------------
---------------------------------------------------------------------------------------------- */
:root {
  --border-radius-default: 0;
  --light-gray-color-40: #ccc;
}

html {
  font-size: 62.5%;
}

body {
  background-color: var(--color--global-background);
}

.loginpage a:hover {
  text-decoration-color: var(--color--login-accent);
}

#navigation-level-1 #top-logo {
  margin-top: 5px;
}

#login {
  max-width: 1400px;
  -webkit-box-shadow:
    0 19px 38px rgba(0, 0, 0, 0.2),
    0 15px 12px rgba(0, 0, 0, 0.1);
  box-shadow:
    0 19px 38px rgba(0, 0, 0, 0.2),
    0 15px 12px rgba(0, 0, 0, 0.1);
}

#login-page-container {
  background-color: rgba(211, 211, 211, 0.45);
}

#login {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-direction: normal;
  align-content: stretch;
  -webkit-box-align: stretch;
  align-items: stretch;
}

#login {
  -webkit-box-orient: vertical;
  -ms-flex-direction: column;
  flex-direction: column;
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap;
  -ms-flex-line-pack: stretch;
  -ms-flex-align: stretch;
  -webkit-box-pack: start;
  -ms-flex-pack: start;
  justify-content: flex-start;
}

#login {
  clear: both;
  /*min-width: 800px;*/
  min-height: 100%;
  width: 100%;
  height: auto !important;
  height: 100%;
  margin: 0 auto;
}

#top-bar {
  max-width: 1400px;
  box-sizing: border-box;
}
.studip-icon.icon-role-info_alt,
input.allow-plaintext-toggle + .icon-role-info_alt.password-display-toggle,
#header-links #contrast button.as-link,
#header-links #contrast ul.widget-list button,
ul.widget-list #header-links #contrast button {
  color: var(--color--font-secondary);
}

.loginpage div.index_main > div {
  padding: 20px;
}

.loginpage div.index_main form {
  padding: 20px 20px 0;
}

.loginpage div.index_main {
  background-color: hsla(0, 0%, 100%, 0.8);
  -webkit-box-shadow: 0 0 8px rgba(0, 0, 0, 0.5);
  box-shadow: 0 0 8px rgba(0, 0, 0, 0.5);
  margin-left: 50px;
  margin-top: 50px;
  width: 500px;
}

#barBottomContainer {
  max-width: 1400px;
}

.loginpage {
  position: static;
  margin: 0 auto;
  background-color: rgba(211, 211, 211, 0.45);
}

.loginpage #background-desktop {
  position: fixed;
}

/* --- Allgemeines Typografie --- */

a,
a:link,
a:visited,
a:link.calhead,
a.tree,
a:link.tree,
a:visited.tree {
  /*blau*/
  color: var(--color--login-link);
}

a.link-extern::before {
  background-image: none;
  width: 0px;
  height: 0px;
  border-left: 9px solid transparent;
  border-right: 5px solid transparent;
  border-bottom: 7px solid var(--color--login-link);
  margin: 0 -2px 3px 1px;
  vertical-align: text-bottom;
  -webkit-transform: rotate(-231deg);
  -ms-transform: rotate(-231deg);
  transform: rotate(-231deg);
}

h1,
h2,
h3,
h4,
h5,
p,
.post h3 a,
#container--foto.index_main p a,
.container-event a.link-event,
#start-index a,
#layout-sidebar a,
article.studip header h1,
.mycourses a,
.js .drag-and-drop,
table.default > caption .caption-container a,
div.memberselect label,
.message-options a {
  /*schwarz*/
  color: var(--color--font-secondary);
}

#start-index #responsive-navigation a {
  color: white;
}

div#featured.panel p.meta a,
#cine-logo {
  /*grau*/
  color: #838383;
}

h3 {
  line-height: 2.1rem;
}

/* ----------------------------------------------------------------------------------------------
   --- Header --------------------------------------------------------------------
  ---------------------------------------------------------------------------------------------- */

#index #barTopMenu {
  display: none;
}
#main-header {
  margin-bottom: 0;
}

/* --- Header Logos --- */

#barTopLogo {
  left: inherit;
  right: 50px;
  position: absolute;
  top: 19px;
  width: 360px;
}

@media (max-width: 1200px) {
  #barTopLogo {
    display: none;
  }
}

@media (min-width: 500px) {
  #index #barTopLogo {
    display: block;
  }
}

#logo-stud {
  left: 47px;
  top: 14px;
  position: absolute;
}

.studip-logo {
  background-size: 120px 70px;
  width: 120px;
  height: 70px;
}

#barTopStudip {
  margin-left: 0px;
}

#logo-stud {
  display: none;
}

#index #logo-stud {
  display: block;
}

/* --- Header Überschrift --- */

#page_title_container {
  border-bottom: 0;
  margin: 0;
  margin-top: 0px;
  padding: 0 15px 0px 19px;
}

#current_page_title {
  font-size: 20px;
  top: 18px;
  line-height: 22px;
  padding-bottom: 2px;
}

/* --- Header Hilfebutton --- */

.helpbar {
  right: -4px;
  top: -8px;
}

.helpbar-container {
  top: -3px;
}

.helpbar .helpbar-title {
  -webkit-filter: hue-rotate(0deg) saturate(0%) brightness(120%) !important;
  filter: hue-rotate(0deg) saturate(0%) brightness(120%) !important;
  margin: 2px 4px -4px 5px;
}

#helpbar-sticky:checked + .helpbar {
  background-color: var(--color--gray-5);
  -webkit-box-shadow:
    0 10px 20px rgba(0, 0, 0, 0.19),
    0 6px 6px rgba(0, 0, 0, 0.23);
  box-shadow:
    0 10px 20px rgba(0, 0, 0, 0.19),
    0 6px 6px rgba(0, 0, 0, 0.23);
  padding: 10px;
}

.helpbar label,
.helpbar .helpbar-title,
.helpbar .helpbar-widgets,
.helpbar h3,
.helpbar .helpbar-widgets a:link,
.helpbar .helpbar-widgets a:visited {
  color: var(--color--brand-secondary-contrast);
}

#helpbar-sticky:checked + .helpbar .helpbar-title {
  background-image: url(../../../assets/images/icons/grey/decline-circle.svg);
  background-size: 30px 22px;
}

.helpbar .help-tours a.tour-completed,
.helpbar .help-tours a,
.helpbar .help-tours a.tour-paused {
  background-image: url(../../../assets/images/icons/grey/accept.svg);
}

.helpbar .helpbar-widgets > li {
  border-top: 0;
}

.helpbar .helpbar-title label {
  margin-top: 7px;
}

/* --- Header Navigation --- */

/* --- Header Navigation Top-Leiste --- */

#globalsearch-searchbar #globalsearch-input,
#notification_marker {
  border: 0;
  color: white;
  font-weight: lighter;
}

#globalsearch-searchbar #globalsearch-input {
  height: 53px;
  padding-left: 10px;
  border: 1px solid #c0c0c0;
}

@media (max-width: 767px) {
  #globalsearch-searchbar #globalsearch-input {
    height: 51px;
  }
}

#globalsearch-searchbar #globalsearch-input::-webkit-input-placeholder {
  color: white;
  opacity: 1;
}

#globalsearch-searchbar #globalsearch-input:-ms-input-placeholder {
  color: white;
  opacity: 1;
}

#globalsearch-searchbar #globalsearch-input::-ms-input-placeholder {
  color: white;
  opacity: 1;
}

#globalsearch-searchbar #globalsearch-input::placeholder {
  color: white;
  opacity: 1;
}

#globalsearch-input:active,
#globalsearch-input:focus {
  outline: 0;
}

#globalsearch-searchbar {
  top: -9px;
  right: 15px;
}

#globalsearch-searchbar #globalsearch-icon {
  left: 5px;
  margin-left: 20px;
  -webkit-filter: brightness(270%) saturate(0%);
  filter: brightness(270%) saturate(0%);
}

#globalsearch-searchbar #globalsearch-clear {
  -webkit-filter: brightness(150%);
  filter: brightness(150%);
}

#globalsearch-searchbar.has-value #globalsearch-clear {
  padding-right: 3px;
}

/* --- Header Navigation Top-Leiste Such-Dropdown --- */

div#globalsearch-list {
  -webkit-box-shadow:
    0 19px 38px rgba(0, 0, 0, 0.3),
    0 15px 12px rgba(0, 0, 0, 0.22) !important;
  box-shadow:
    0 19px 38px rgba(0, 0, 0, 0.3),
    0 15px 12px rgba(0, 0, 0, 0.22) !important;
  border: 1px solid #c0c0c0;
}

#globalsearch-searchbar #globalsearch-list {
  padding: 0;
  top: 52px;
}

@media (max-width: 767px) {
  #globalsearch-searchbar #globalsearch-list {
    border: 0;
    left: -49px !important;
  }
}

#globalsearch-searchbar #globalsearch-results article section {
  padding: 8px 5px 1px 5px;
  border-top: 1px solid lightgrey !important;
}

#globalsearch-searchbar #globalsearch-results article section:hover {
  background-color: #f0f0f0;
}

#globalsearch-searchbar #globalsearch-list header,
#globalsearch-searchbar #globalsearch-results article,
#globalsearch-searchbar #globalsearch-results article section {
  border: 0;
  margin: 0;
}

#globalsearch-searchbar #globalsearch-list a {
  color: #505050;
  padding: 5px 0 5px 10px;
}

#globalsearch-searchbar #globalsearch-list a:hover {
  color: #202020;
}

#globalsearch-results a {
  padding: 5px;
}

#globalsearch-searchbar
  #globalsearch-results
  article
  section
  .globalsearch-result-img {
  margin-left: 0px;
  margin-right: 15px;
}

/* --- Header Navigation Top-Leiste Benachrichtigungen & Avatar --- */

#notification_container {
  top: -11px;
  right: 15px;
}

#notification_marker {
  height: 39px;
  border: 0;
  color: white;
  padding: 10px 10px 0 10px;
}

@media (max-width: 767px) {
  #notification_container {
    top: -16px;
    right: 11px;
  }

  #notification_marker {
    height: 32px;
    padding-top: 16px;
  }

  #globalsearch-searchbar {
    top: -8px;
    right: -2px;
  }
}

#header_avatar_menu .action-menu-icon {
  border: 0;
  height: 51px;
  width: 51px;
  top: -11px;
  border-left: 1px solid #c0c0c0;
}

#barTopAvatar #avatar-arrow {
  margin-left: 14px;
  -webkit-filter: brightness(230%);
  filter: brightness(230%);
}

#barBottomright #sidebar-menu {
  margin: 0 0 3px 0;
}

@media (max-width: 365px) {
  #notification_marker,
  #barTopAvatar {
    display: none;
  }
}

#notification_marker.alert {
  background-color: var(--color--login-accent) !important;
  border-radius: 50% !important;
  width: 15px !important;
  height: 30px !important;
  margin-top: 8px !important;
  margin-left: 15px !important;
  padding-top: 5px !important;
  color: black !important;
  font-weight: bold !important;
}

/* --- Header Navigation Haupt-Leiste Logos & Tabs --- */

#tabs {
  background-color: white;
  padding-top: 10px;
  border-top: 0;
  border-bottom: 0;
  z-index: 2;
  margin-bottom: 10px;
  margin-top: 5px;
  margin-left: 10px;
}

#tabs > li:not(.current),
#tabs2 > li:not(.current),
#tabs li,
.smiley-tabs li {
  background-color: transparent;
}

/* --- Header Action-Menü rechte Seite --- */

#header_avatar_menu .action-menu-content {
  top: 40px;
  right: -50px;
  background: #fff;
  -webkit-box-shadow:
    0 19px 38px rgba(0, 0, 0, 0.2),
    0 15px 12px rgba(0, 0, 0, 0.1);
  box-shadow:
    0 19px 38px rgba(0, 0, 0, 0.2),
    0 15px 12px rgba(0, 0, 0, 0.1);
  padding: 0;
  background-color: #dcdcdc;
  width: 270px;
  border-left: 1px solid #c0c0c0;
  border-top: 1px solid #c0c0c0;
}

#header_avatar_menu .action-menu-content a {
  color: #202020 !important;
}

#header_avatar_menu .action-menu-content div {
  padding: 10px !important;
  font-size: 15px !important;
  font-weight: 300 !important;
  letter-spacing: 0.1rem;
  border: 0;
}

.action-menu .action-menu-list {
  padding-bottom: 5px;
}

.action-menu .action-menu-content {
  padding: 0;
}

/* --- Header Sonstiges --- */

#responsive-navigation {
  height: calc(100vh - 60px);
  z-index: 10000;
}

#responsive-navigation > li.navigation-item:first-child div.nav-title > a {
  display: block;
}

/* -------------------------------------------------------------------------------------------
  --- Sidebar --------------------------------------------------------------------
  ---------------------------------------------------------------------------------------------- */

.sidebar-widget .widget-options .options-radio.options-checked {
  background-image: url(../../../assets/images/icons/black/radiobutton-checked.svg);
}

.sidebar-widget .widget-options .options-radio.options-unchecked {
  background-image: url(../../../assets/images/icons/black/radiobutton-unchecked.svg);
}

#layout-sidebar {
  margin-left: 15px;
}

#layout-sidebar div a img {
  max-width: 260px;
}

.sidebar-widget-header {
  padding: 10px !important;
  font-size: 15px !important;
  font-weight: 300 !important;
  letter-spacing: 0.1rem;
  border: 0;
}

.sidebar .sidebar-widget,
.sidebar .sidebar-widget-placeholder {
  border: 0;
  background-color: #dcdcdc;
  color: #202020 !important;
}

.sidebar-widget-content {
  border-top: 0;
  padding: 10px;
}

@media (max-width: 767px) {
  .sidebar-widget-content ul li a {
    color: #202020 !important;
    padding-left: 30px;
  }

  .sidebar-widget-content ul li {
    padding: 0 0 10px 0;
  }
}

/* --- Sidebar Active Page --- */

.sidebar-image {
  display: none;
}

.sidebar .sidebar-widget,
.sidebar .sidebar-widget-placeholder {
  margin-top: 0;
}

.widget-links.sidebar-navigation > li.active a {
  background-color: #ffe5ad;
  border-top: 1px solid #ffbd33;
  border-bottom: 1px solid #ffbd33;
}

.widget-links.sidebar-navigation > li.active {
  background-color: #ffe5ad;
  -webkit-box-shadow: inset 0 0 0 1px #ffbd33;
  box-shadow: inset 0 0 0 1px #ffbd33;
  position: relative;
}

.widget-links.sidebar-navigation > li.active:after {
  border-left-color: #ffe5ad;
}

.widget-links.sidebar-navigation > li.active:before {
  border-left-color: #ffbd33;
}

.widget-links.sidebar-navigation > li.active a {
  color: #202020;
}

/* --- Sidebar Suche --- */

.sidebar-search .needles input[type="text"] {
  padding: 0px 8px;
  height: 30px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border: 1px solid grey;
  border-right-width: 40px;
}

.sidebar-search input[type="submit"] {
  width: 28px;
  height: 28px;
  background-size: 20px 20px;
  background-position: center 4px;
  cursor: pointer;
  margin-left: -33px;
  background-image: url(../../../assets/images/icons/black/search.svg);
}

/* redmine #6816
  .select2,
  .select2-container,
  .select2-container--default,
  .select2-container--below,
  .select2-container--focus {
    width: 250px !important;
  }*/

@media (max-width: 767px) {
  .responsive-display #index .loginpage div.index_main,
  .responsive-display #index .loginpage div.messagebox,
  .responsive-display #login .loginpage div.index_main,
  .responsive-display #login .loginpage #loginbox,
  .responsive-display #login .loginpage div.messagebox,
  .responsive-display #request_new_password .loginpage div.index_main,
  .responsive-display #request_new_password .loginpage div.messagebox,
  .responsive-display #web_migrate .loginpage div.index_main,
  .responsive-display #web_migrate .loginpage div.messagebox {
    margin: 1em auto;
  }
  #layout-sidebar {
    background-image: none;
    background-repeat: repeat-x;
    top: 50px;
    border-left: 0;
    background-color: #dcdcdc;
    -webkit-box-shadow:
      0 19px 38px rgba(0, 0, 0, 0.2),
      0 15px 12px rgba(0, 0, 0, 0.1);
    box-shadow:
      0 19px 38px rgba(0, 0, 0, 0.2),
      0 15px 12px rgba(0, 0, 0, 0.1);
  }
}

/* -------------------------------------------------------------------------------------------
  --- Content --------------------------------------------------------------------
  ---------------------------------------------------------------------------------------------- */

#content-wrapper {
  flex-grow: 1;
  margin-bottom: 0;
  padding: 0;
}
.loginpage div.index_main {
  -webkit-box-shadow: 0px 0px 0px rgba(0, 0, 0, 0);
  background-color: var(--color--login-tile-background);
  border: 1px solid var(--color--login-accent);
  box-shadow: 0px 0px 0px rgba(0, 0, 0, 0);
  margin-left: 50px;
  margin-top: 50px;
  max-width: 472px;
  flex-basis: 50%;
  width: unset;
}
#login-wrapper {
  margin: 0;
  top: 0;
}

#login-content-wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  box-shadow: none;
  margin-top: 0;
}

#flexed_2 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-bottom: 50px;
}

@media (max-width: 575px) {
  #login-content-wrapper {
    display: block;
  }
}

@media (max-width: 767px) {
  #current_page_title {
    margin-top: 20px;
    padding-right: 25px;
  }
}

/* --- Content Login Page --- */

#loginbox {
  -ms-flex-order: 3;
  -webkit-box-ordinal-group: 4;
  background-color: transparent;
  border: none;
  box-shadow: 0px 0px 0px rgba(0, 0, 0, 0);
  color: var(--color--black);
  height: 380px;
  margin: 50px 50px 0;
  min-width: 250px;
  order: 3;
  padding: 0;
  width: 250px;
  z-index: 1000;
  min-height: unset;
}
#loginbox header {
  color: var(--color--font-secondary);
  padding: 20px 20px 0;
}
#loginbox header h1 {
  color: var(--color--font-secondary);
  font-size: 1.3em;
  margin-bottom: 10px;
  margin-top: 20px;
  text-align: left;
}
#loginbox form#login-form {
  padding: 1.5ex 20px 0;
  border-bottom: none;
}
#loginbox nav {
  margin: 0;
  flex-grow: 0;
}

.hidden {
  visibility: hidden;
}

tbody.sb-articles .hidden {
  visibility: inherit;
}

.index_main figure {
  margin: 29px 0 0 0;
}

.loginpage div.index_main > div {
  padding: 20px;
  padding-left: 30px;
  padding-right: 30px;
}

h2#login-heading {
  color: var(--color--font-secondary);
  border: 0;
  font-size: 19px;
  font-weight: bold;
  margin-bottom: 24px;
}

h2.login {
  position: relative;
  border-bottom: 0;
  font-size: 19px;
}

h2.login:before {
  content: "";
  width: 0;
  height: 0;
  border-left: 9px solid var(--color--login-accent);
  border-top: 8px solid var(--color--login-accent);
  border-bottom: 8px solid var(--color--login-accent);
  border-right: 16px solid var(--color--login-accent);
  position: absolute;
  top: 0px;
  left: -30px;
}

#login--container form.default label:not(.undecorated) input[type="password"],
#login--container form.default label:not(.undecorated) input[type="text"] {
  margin-top: 0;
  border: 1px solid var(--light-gray-color-40) !important;
}

form.default label:not(.undecorated) {
  margin-top: 1.5ex;
}

#loginbox form#login-form .login-button-wrapper {
  margin-bottom: 12px;
  margin-top: 28px;
}
#loginbox form#login-form .login-button-wrapper button {
  box-shadow:
    0 3px 6px rgba(0, 0, 0, 0.16),
    0 3px 6px rgba(0, 0, 0, 0.23);
  background-color: var(--color--login-accent);
  border: 0 !important;
  border-radius: 0;
  color: var(--color--font-secondary) !important;
  font-size: 15px;
  font-weight: bold;
  letter-spacing: 0.15rem;
  margin: 0;
  padding: 10px 10px 8px 15px !important;
  transition: all 0.3s;
  width: 100%;
}
#submit_login:before {
  background-image: url(../images/icons/blue/accept.svg);
  background-repeat: no-repeat;
  background-size: 16px;
  content: " ";
  float: left;
  height: 16px;
  margin: 1px 5px 0 0;
  width: 16px;
}

#loginbox form#login-form .login-button-wrapper button:hover {
  background-color: var(--color--brand-primary) !important;
}

#loginbox form#login-form .login-button-wrapper button:focus,
button.accord:focus {
  box-shadow:
    0 3px 6px rgba(0, 0, 0, 0.4),
    0 3px 6px rgba(0, 0, 0, 0.6);
}

/* --- Blog - News --- */

#tabnav,
#zufall,
#presse,
#all,
#featured .post:nth-child(n + 4) {
  display: none;
}

#featured {
  margin-top: 35px;
}

#featured .post {
  padding-bottom: 10px;
}

.meta {
  font-size: 13px;
  color: #838383;
  margin-bottom: 15px;
}

.post h3 a {
  display: block;
}

.post:nth-child(2),
.post:nth-child(1) {
  border-bottom: 2px solid lightgrey;
}

/* --- Content Login Page Accordion--- */

.acc {
  background-color: var(--color--login-tile-background);
  cursor: pointer;
  padding: 0 40px 0 0;
  width: 100%;
  border: none;
  text-align: left;
  outline: none;
  -webkit-transition: 0.4s;
  -o-transition: 0.4s;
  transition: 0.4s;
  position: relative;
}

.pan {
  max-height: 0;
  overflow: hidden;
  -webkit-transition: max-height 0.4s ease-out;
  -o-transition: max-height 0.4s ease-out;
  transition: max-height 0.4s ease-out;
}

#faq {
  margin-left: 45px;
}

#faq .acc:after {
  content: "+";
  position: absolute;
  top: 15px;
  left: -45px;
  color: var(--color--login-accent);
  border-radius: 100%;
  padding: 0 8px 0 8px;
  background-color: var(--color--login-tile-background);
  border: 2px solid var(--color--login-accent);
  /*
    -webkit-box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
    */
  font-size: 19px;
  z-index: 2;
  line-height: 2.8rem;
  -webkit-transition:
    background-color 0.4s,
    -webkit-box-shadow 0.4s;
  transition:
    background-color 0.4s,
    -webkit-box-shadow 0.4s;
  -o-transition:
    background-color 0.4s,
    box-shadow 0.4s;
  transition:
    background-color 0.4s,
    box-shadow 0.4s;
  transition:
    background-color 0.4s,
    box-shadow 0.4s,
    -webkit-box-shadow 0.4s;
}

#faq .acc:hover:after,
.acc:focus:after {
  -webkit-box-shadow:
    0 10px 20px rgba(0, 0, 0, 0.19),
    0 6px 6px rgba(0, 0, 0, 0.23);
  box-shadow:
    0 10px 20px rgba(0, 0, 0, 0.19),
    0 6px 6px rgba(0, 0, 0, 0.23);
}

#faq .active:after {
  content: " - ";
  font-size: 20px;
  padding: 0 10px 2px 10px;
  background-color: var(--color--login-accent);
  color: var(--color--font-inverted);
  font-weight: bold;
  line-height: 2.6rem;
}

/* --- Content Login Page Media Queries--- */

@media (max-width: 1405px) {
  .loginpage {
    background-color: transparent;
  }

  #loginbox {
    background-color: rgba(211, 211, 211, 0.45);
    height: 340px;
  }

  #login {
    background-color: rgba(0, 0, 0, 0.1);
  }
}

@media (max-width: 1200px) {
  #loginbox {
    -webkit-box-ordinal-group: 1;
    -ms-flex-order: 0;
    order: 0;
    margin-right: 0;
  }

  #login-content-wrapper {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
  }

  #container--foto {
    -webkit-box-ordinal-group: 0;
    -ms-flex-order: -1;
    order: -1;
    max-width: 500px;
  }

  #loginbox {
    margin-left: 0px;
    height: auto;
    background-color: rgba(211, 211, 211, 0.45);
  }

  .container--content {
    flex-basis: 100% !important;
    max-width: 750px !important;
  }

  #background-desktop {
    background-position: right !important;
  }
  .loginpage div.index_main {
    flex-basis: 100%;
  }
  #login {
    background-color: rgba(0, 0, 0, 0.05);
  }
  .container--flexed_2 {
    max-width: 350px !important;
  }

  .hidden {
    display: none;
  }
}

@media (max-width: 840px) {
  #loginbox {
    -webkit-box-ordinal-group: -1;
    -ms-flex-order: -2;
    order: -2;
    margin-left: 0;
    width: 500px;
  }

  h2#login-heading {
    margin-top: 10px;
  }

  #login-content-wrapper,
  #flexed_2 {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
  }

  .container--content {
    width: 500px !important;
    font-size: 1.5rem;
  }

  .container--flexed_2 {
    max-width: 500px !important;
  }

  .loginpage div.index_main {
    margin-left: 0;
  }

  div#pwd.panel {
    -webkit-box-shadow:
      0 19px 38px rgba(0, 0, 0, 0.2),
      0 15px 12px rgba(0, 0, 0, 0.1);
    box-shadow:
      0 19px 38px rgba(0, 0, 0, 0.2),
      0 15px 12px rgba(0, 0, 0, 0.1);
  }
  .container--flexed_2 {
    max-width: 500px !important;
  }
}

html:not(.size-medium) #login-wrapper #login-content-wrapper #loginbox {
  padding: 0;
  width: 500px;
}

@media (max-width: 575px) {
  html:not(.size-medium) #login-wrapper #login-content-wrapper #loginbox {
    width: unset;
  }
  #login-content-wrapper {
    background-color: transparent;
  }
  .responsive-display #background-mobile {
    filter: blur(5px);
  }

  .container--content {
    margin-top: 0;
    padding-left: 20px;
    padding-right: 20px;
    position: relative;
    width: calc(100% - 40px) !important;
  }

  #loginbox {
    background-color: transparent;
    position: relative;
    overflow: hidden;
    overflow: visible;
  }

  #loginbox:before {
    /*
      content: "";
      position: absolute;
      width: 120%;
      height: 170%;
      top: -75%;
      left: -15%;
      z-index: -1;
      -webkit-transform: rotate(-12deg);
      -ms-transform: rotate(-3deg);
      transform: rotate(-3deg);
      background: url(/../../pictures/loginbackgrounds/1.svg) no-repeat center center/cover;
      filter: brightness(55%);
      */
    content: "";
    position: absolute;
    width: 100%;
    height: 105%;
    top: 0%;
    left: 0%;
    z-index: -1;
  }

  .loginpage div.index_main,
  .loginpage #loginbox {
    border: 0;
    padding: 0 !important;
    margin: 0 !important;
    width: calc(100% - 0px) !important;
  }

  #login {
    background-color: var(--color--login-tile-background);
  }
  #flexed_2 {
    margin-bottom: 0;
  }
  .container--flexed_2,
  #container--foto {
    max-width: unset !important;
  }
}
/* --- Content Login Page Accordion --- */

.accord {
  color: var(--color--font-secondary);
  background-color: rgba(255, 255, 255, 0.45);
  cursor: pointer;
  padding: 10px;
  width: 100%;
  border: 1px solid rgba(255, 255, 255, 0);
  outline: none;
  -webkit-transition: 0.4s;
  -o-transition: 0.4s;
  transition: 0.4s;
}

.accord:hover {
  border: 1px solid var(--color--global-background);
}

#accord-btn {
  padding: 0 20px 20px;
  background-color: transparent;
}

.panel-pwd {
  display: none;
  padding-top: 10px;
}

#pwd {
  background-color: var(--color--login-tile-background);
  padding: 22px;
  outline: 1px solid var(--color--login-accent);
  display: none;
  font-size: 14px;
}

/* --- Content Login Page Veranstaltungen --- */

.container-event .list-event {
  list-style: none;
  list-style-type: none;
  padding: 0;
}

.container-event .item-event {
  position: relative;
  border-bottom: 2px solid #dcdcdc;
}

.container-event:last-child .item-event {
  border-bottom: 0;
}

.container-event a.link-event {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

@media (max-width: 380px) {
  .container-event a.link-event {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    margin-top: 30px;
  }

  .date-event {
    margin-top: 0 !important;
  }
}

.container-event .date-event {
  margin-right: 25px;
  margin-top: 25px;
}

.container-event .date {
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  border: 2px solid var(--color--login-accent);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  height: 50px;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 50px;
  font-weight: bold;
  /*
    -webkit-box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
    */
  -webkit-transition: -webkit-box-shadow 0.4s;
  transition: -webkit-box-shadow 0.4s;
  -o-transition: box-shadow 0.4s;
  transition: box-shadow 0.4s;
  transition:
    box-shadow 0.4s,
    -webkit-box-shadow 0.4s;
}

.container-event a.link-event:hover .date {
  -webkit-box-shadow:
    0 10px 20px rgba(0, 0, 0, 0.19),
    0 6px 6px rgba(0, 0, 0, 0.23);
  box-shadow:
    0 10px 20px rgba(0, 0, 0, 0.19),
    0 6px 6px rgba(0, 0, 0, 0.23);
}

.container-event .day-event {
  font-size: 1.5rem;
  line-height: 1.6rem;
  font-weight: lighter;
}

.container-event .month-event {
  font-size: 1.4rem;
  font-weight: 300;
  font-weight: bold;
  text-transform: uppercase;
}

/* --- Content Login Page Foto des Monats --- */

#foto {
  width: 100%;
  margin-top: 30px;
}

#cine {
  margin-left: 5px;
  margin-bottom: 9px;
}

#cine-logo {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

/*
  #container--foto {
    position: relative;
  }

  #cine {
    position: absolute;
    left: 20px;
    bottom: 60px;
    width: 25%;
  }
  */

/* --- Content Login Page Tooltip --- */

.tooltip {
  position: relative;
  display: inline-block;
}

.tooltip .tooltiptext {
  visibility: hidden;
  width: 110px;
  background-color: black;
  color: #fff;
  text-align: center;
  border-radius: 6px;
  padding: 5px 8px;
  /* Position the tooltip */
  position: absolute;
  z-index: 1;
  top: 100%;
  left: 50%;
  margin-left: -55px;
}

.tooltip:hover .tooltiptext {
  visibility: visible;
}

.tooltip .tooltiptext::after {
  content: " ";
  position: absolute;
  bottom: 100%;
  left: 50%;
  margin-left: -5px;
  border-width: 5px;
  border-style: solid;
  border-color: transparent transparent black transparent;
}

input.clip {
  background-color: var(--color--login-tile-background);
  border: 0;
}

input.clip:hover {
  cursor: pointer;
}

input.clip:focus {
  outline: none;
}

/* -------------------------------------------------------------------------------------------
  --- Content Main ---------------------------------------------------------------
  ---------------------------------------------------------------------------------------------- */

a.close {
  -webkit-filter: grayscale(100%);
  filter: grayscale(100%);
}

.studip-widget .widget-header {
  color: #303030 !important;
  background-color: #e8e8e8;
  background-image: -webkit-linear-gradient(330deg, #d4fc79 0%, #96e6a1 100%);
  background-image: -o-linear-gradient(330deg, #d4fc79 0%, #96e6a1 100%);
  background-image: linear-gradient(120deg, #d4fc79 0%, #96e6a1 100%);
  padding: 2px 10px 0 10px;
  font-size: 16px !important;
  letter-spacing: 0.05rem;
  border-bottom: 2px solid var(--color--login-accent);
}

.mainmenu {
  -webkit-transition:
    padding 0.4s,
    background-color 0.4s;
  -o-transition:
    padding 0.4s,
    background-color 0.4s;
  transition:
    padding 0.4s,
    background-color 0.4s;
  position: relative;
  margin-left: 10px;
  margin-top: 4px;
}

@media (max-width: 765px) {
  .mainmenu:before {
    content: "";
    width: 0;
    height: 0;
    border: 2px solid darkgrey;
    position: absolute;
    top: 13px;
    left: -10px;
  }
}

.mainmenu:hover:before {
  border: 0;
}

.mainmenu:hover {
  border-left: 3px solid var(--color--login-accent);
  padding-left: 15px;
  margin-right: 10px;
  background-color: #e8e8e8;
}

.studip-widget {
  -webkit-box-shadow:
    0 1px 3px rgba(0, 0, 0, 0.12),
    0 1px 2px rgba(0, 0, 0, 0.24);
  box-shadow:
    0 1px 3px rgba(0, 0, 0, 0.12),
    0 1px 2px rgba(0, 0, 0, 0.24);
  -webkit-transition: box--shadow 0.4s;
  -o-transition: box--shadow 0.4s;
  -webkit-transition: -webkit-box-shadow 0.4s;
  transition: -webkit-box-shadow 0.4s;
  -o-transition: box-shadow 0.4s;
  transition: box-shadow 0.4s;
  transition:
    box-shadow 0.4s,
    -webkit-box-shadow 0.4s;
  border: 0;
}

.studip-widget:hover {
  -webkit-transition: -webkit-box-shadow 0.4s;
  transition: -webkit-box-shadow 0.4s;
  -o-transition: box-shadow 0.4s;
  transition: box-shadow 0.4s;
  transition:
    box-shadow 0.4s,
    -webkit-box-shadow 0.4s;
  -webkit-box-shadow:
    0 3px 6px rgba(0, 0, 0, 0.16),
    0 3px 6px rgba(0, 0, 0, 0.23);
  box-shadow:
    0 3px 6px rgba(0, 0, 0, 0.16),
    0 3px 6px rgba(0, 0, 0, 0.23);
  border: 0;
}

h1 img.icon-role-info {
  display: none;
}

table.default > caption {
  padding-top: 20px;
}

/* --- Main Lightbox--- */

.ui-dialog-titlebar {
  color: white !important;
  padding: 10px !important;
  font-size: 15px !important;
  font-weight: 300 !important;
  letter-spacing: 0.13rem;
  border: 0;
}

/* --- Main Button--- */

div.letterlist span {
  color: #202020 !important;
}

.ui-button,
.button {
  color: #202020 !important;
  border: 1px solid #808387 !important;
  background-color: #f0f0f0;
  padding: 5px 10px !important;
  -webkit-transition: all 0.3s !important;
  -o-transition: all 0.3s !important;
  transition: all 0.3s !important;
  -webkit-box-shadow:
    0 3px 6px rgba(0, 0, 0, 0.16),
    0 3px 6px rgba(0, 0, 0, 0.23);
  box-shadow:
    0 3px 6px rgba(0, 0, 0, 0.16),
    0 3px 6px rgba(0, 0, 0, 0.23);
}

.ui-button:hover,
.ui-button:focus,
.button:hover,
.button:focus {
  background-color: #bbed58 !important;
  outline: 0px;
  border: 1px solid #808387 !important;
}

.ui-button:active,
.button:active {
  -webkit-box-shadow:
    0 1px 3px rgba(0, 0, 0, 0.12),
    0 1px 2px rgba(0, 0, 0, 0.24);
  box-shadow:
    0 1px 3px rgba(0, 0, 0, 0.12),
    0 1px 2px rgba(0, 0, 0, 0.24);
  outline: 0 !important;
  -webkit-transform: translateY(2px);
  -ms-transform: translateY(2px);
  transform: translateY(2px);
  border: 1px solid #808387 !important;
}

.button-with-empty-icon::before,
.button.accept::before,
.button.cancel::before,
.button.download::before,
.button.edit::before,
.button.move-up::before,
.button.move-down::before,
.button.add::before,
.button.download::before,
form div.files-search .input-group-append a.button.reset::before,
.ui-dialog.ui-widget.ui-widget-content
  .ui-dialog-buttonpane
  .ui-button.accept::before,
.ui-dialog.ui-widget.ui-widget-content
  .ui-dialog-buttonpane
  .ui-button.cancel::before,
.ui-dialog.ui-widget.ui-widget-content
  .ui-dialog-buttonpane
  .ui-button.download::before {
  margin: 1px 5px 0 0;
}

.ui-widget .ui-button.accept::before,
.ui-widget .ui-button.cancel::before,
.button.accept::before,
.button.cancel::before {
  -webkit-filter: hue-rotate(0deg) saturate(0%) brightness(60%) !important;
  filter: hue-rotate(0deg) saturate(0%) brightness(60%) !important;
}

.ui-widget .ui-button.accept:hover::before,
.ui-widget .ui-button.cancel:hover::before,
.button.accept:hover::before,
.button.cancel:hover::before {
  -webkit-filter: hue-rotate(0deg) saturate(0%) brightness(30%) !important;
  filter: hue-rotate(0deg) saturate(0%) brightness(30%) !important;
}

.ui-widget .ui-dialog-buttonset {
  text-align: left !important;
}

.ui-widget .ui-button.cancel,
.ui-dialog.ui-widget.ui-widget-content
  .ui-dialog-buttonpane
  .ui-button:last-child,
.cancel {
  background-color: white !important;
}

.cancel:hover,
.ui-widget .ui-button.cancel:hover,
.ui-dialog-titlebar-close,
.ui-dialog.ui-widget.ui-widget-content
  .ui-dialog-buttonpane
  .ui-button:last-child:hover,
a.cancel.button:hover {
  background-color: #dcdcdc !important;
}

.ui-dialog-titlebar-close {
  background-color: #3e4244 !important;
  border: 1px solid transparent !important;
}

/* --- Main Kommentar--- */

.add_toolbar {
  margin-top: 8px !important;
  padding-left: 8px;
}

.editor_toolbar {
  margin-top: 24px;
}

.editor_toolbar .ui-button {
  background-color: white !important;
  padding: 4px;
  -webkit-box-shadow: none !important;
  box-shadow: none !important;
  margin-top: 1px;
}

.comments .formatted-content {
  font-weight: normal !important;
}

section.comments h1 {
  margin: 16px 0 2px 0;
}

/* --- Main Tabelle --- */

#layout_content thead tr,
#layout_content tfoot tr,
table#schedule_data thead tr td,
div.schedule_hours {
  background: #3a8996;
  color: white;
}

table.default > caption .caption-container {
  margin-bottom: 0px;
}

.sortable-table .header,
.sortable-table .tablesorter-header:not(.sorter-false) {
  color: white;
}

.sortable-table .header:hover,
.sortable-table .tablesorter-header:not(.sorter-false):hover {
  color: lightgrey;
}

#layout_content thead tr a,
#layout_content tfoot tr a {
  color: white;
}

#layout_content .calendar-week tfoot tr {
  background: white;
}

.precol1w,
.precol2w {
  background: #3a8996 !important;
  color: white;
  padding: 4px;
}

.precol2w {
  background: #7e8a90 !important;
}

table.default > thead > tr > th {
  background-color: transparent;
}

table.default > tbody > tr > th,
form.default fieldset > legend,
section.contentbox header,
section.contentbox header h1,
#globalsearch-searchbar #globalsearch-results article > header {
  background-color: #3a8996;
  color: white;
  font-weight: normal;
  border-top: 0;
}

label input.icon-role-clickable {
  padding: 0 !important;
}

table.default > tbody > tr > th a,
form.default fieldset > legend a,
section.contentbox header a,
section.contentbox header h1 a,
#globalsearch-searchbar #globalsearch-results article > header a {
  color: white;
}

div.action-menu-content label {
  color: white !important;
  margin: 0 !important;
}

form.default footer,
table.default > tfoot > tr > td {
  border: 0;
  background-color: white;
  color: black;
}

/* --- Main Kalender --- */

td.month:hover {
  background-color: rgba(212, 214, 216, 0.5);
}

td.month a.day,
td.month a.sday,
td.month a.hday,
td.celltoday a {
  padding: 6px;
}

td.celltoday {
  background-color: #b9b9b9;
}

td.precol1w {
  padding: 3px;
}

td.celltoday a,
td.precol1w,
#main_content thead tr td a.calhead {
  color: white;
}

nav.calendar-nav .calhead {
  color: #4d4d4d;
}

td.calhead,
div.calhead {
  font-size: 20px;
  font-weight: normal;
  color: #6d727a;
}

nav.calendar-nav .calhead label:hover {
  color: #6d727a;
}

.calendar-single-year .calendar-single-year--table > thead th,
.calendar-single-year .calendar-single-year--table > tfoot th {
  text-align: center;
  padding: 3px;
}

.calendar-single-year thead th a,
.calendar-single-year tfoot th a {
  color: white !important;
}

table.calendar-week td,
table.calendar-day td {
  padding: 0;
  border: 1px solid #e8e8e8;
}

table.calendar-single-year--table,
table.calendar-week,
table.calendar-month,
table.calendar-day {
  border-collapse: collapse;
}

table.calendar-single-year--table td,
table.calendar-week td,
table.calendar-month td,
table.calendar-day td {
  padding: 3px;
  border: 1px solid #dcdcdc;
  text-align: center;
}

table.calendar-month tbody td {
  vertical-align: middle;
  border: 1px solid white;
}

table.calendar-month td.calendar-month-week {
  background: #7e8a90;
  color: white;
}

table.calendar-month td.calendar-month-week a {
  color: white;
}

.hidden-medium-down div.precol1w {
  padding: 0px;
}

.calendar-week tbody tr td,
.calendar-day tbody tr td {
  border-bottom: 1px solid #dcdcdc;
}

table.calendar-day thead tr,
table.calendar-day tfoot tr {
  background-color: white !important;
}

table.calendar-week thead td:first-child,
table.calendar-week thead td:last-child {
  background-color: white !important;
}

#calendar-single-week .toggle-indicator a,
.toggle-indicator,
#calendar-single-day .toggle-indicator a,
.toggle-indicator,
#calendar-single-month .toggle-indicator a,
.toggle-indicator,
#calendar-single-year .toggle-indicator a {
  color: white !important;
}

table th,
table.default > caption .actions,
table.default > tbody:last-of-type > tr:last-child > td {
  border: 0 !important;
}

/* --------------------------------------------------------------------------------------
   --- MessageBoxes ---------------------------------------------------------
   ------------------------------------------------------------------------------------- */

div.messagebox {
  font-size: 14px;
  font-weight: normal;
}

#login--container form .accept.button {
  margin-top: 28px !important;
}

#accord-btn {
  margin-top: 10px;
}

.ui-dialog.studip-confirmation {
  min-width: 22em;
}

/* ------ Nutzerbedingungen --------*/

.terms {
  max-width: 700px;
}

.terms > li {
  margin-bottom: 10px;
}

.terms a {
  color: var(--color--login-link);
}

section .button-group {
  margin: 10px 0 50px 30px;
}

section div.button-group a.button:nth-child(2) {
  color: var(--color--login-link) !important;
  background-color: white !important;
  border: 0 !important;
  -webkit-box-shadow: none !important;
  box-shadow: none !important;
}

/* ------ Tour --------*/

#tour_tip,
#tour_controls {
  background-color: #dcdcdc;
  color: #303030;
}

/*-------------------Icons-----------------------*/

.js form.default.collapsable fieldset.collapsed legend,
form.default fieldset.collapsable.collapsed legend {
  background-image: url(../../../assets/images/icons/white/arr_1right.svg);
}

.js form.default.collapsable fieldset legend,
form.default fieldset.collapsable legend {
  background-image: url(../../../assets/images/icons/white/arr_1down.svg);
}

/* ----- Startseite ----------- */

article.studip,
#wid46 {
  border: 0;
  background: white;
}

#quickSelectionWrap {
  border: 0;
  background: transparent;
}

article.studip header {
  background-color: transparent;
  margin-bottom: 5px;
  padding-left: 0;
}

article.studip header nav {
  min-height: 20px;
}

article.studip.toggle > header:before {
  display: none;
}

.comments form div {
  text-align: left !important;
}

article.studip header h1 {
  padding: 0;
}

article.studip header h1 > a {
  font-size: 16px;
  line-height: 2rem;
  color: #505050 !important;
}

article.studip header h1 > a:hover {
  text-decoration: underline;
  color: black;
}

article.studip header h1 > a img.icon-shape-news,
article.studip header h1 > a svg.icon-shape-news {
  display: none;
}

article.studip header {
  display: block;
  margin-left: 0px;
}

.start-widgetcontainer article.studip.toggle.open > *:not(header) {
  margin-left: 4px;
  border-bottom: 2px solid grey;
  padding: 10px;
  background-color: #ededed;
}

article.studip.toggle.open > header {
  margin-bottom: 5px;
}

article#tablefix {
  padding: 10px;
  margin-bottom: 20px;
}

dd {
  margin-left: 0;
}

/* ----- Veranstaltungen ----------- */

#calendar-schedule-index #layout_content {
  overflow: visible;
  min-width: 600px;
}

.boxed-grid img {
  height: calc(100% - 90px);
  opacity: 0.4;
}

.boxed-grid h3 {
  font-size: 20px;
  margin-bottom: 7px;
  color: #303030 !important;
}

.boxed-grid a {
  background-color: #e8e8e8;
  border: 0;
  height: 120px;
  -webkit-box-shadow:
    0 3px 6px rgba(0, 0, 0, 0.16),
    0 3px 6px rgba(0, 0, 0, 0.23);
  box-shadow:
    0 3px 6px rgba(0, 0, 0, 0.16),
    0 3px 6px rgba(0, 0, 0, 0.23);
  -webkit-transition: all ease 0.3s;
  -o-transition: all ease 0.3s;
  transition: all ease 0.3s;
}

form.default footer {
  padding-left: 0;
}

a.link-add {
  color: white;
  position: relative;
}

a.link-add:hover {
  color: white;
  position: relative;
}

a.link-add::before {
  position: absolute;
  left: -20px;
  top: 1px;
  -webkit-transition: all ease 0.4s;
  -o-transition: all ease 0.4s;
  transition: all ease 0.4s;
  background-image: url(../../../assets/images/icons/white/add.svg);
}

a.link-add:hover::before {
  -webkit-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  transform: rotate(90deg);
}

/*
  #course-timesrooms-index section.timesrooms .tooltip.tooltip-icon::before {
    position: absolute;
    left: 0px;
    top: -12px;
    background-image: url(../../../assets/images/icons/blue/info-circle.svg);
  }
  */

nav .tooltip.tooltip-icon::before {
  position: absolute;
  left: -45px;
  top: -8px;
  background-image: url(../../../assets/images/icons/white/info-circle.svg);
}

.contentbox.timesrooms article header.green .tooltip-icon::before {
  margin-right: 5px;
  background-image: url(../../../assets/images/icons/white/radiobutton-checked.svg);
}

html.csstransforms .contentbox .action-menu .action-menu-icon div {
  background: white;
}

html.csstransforms
  #course-room_requests-index
  .action-menu
  .action-menu-icon
  div {
  background: grey;
}

.action-menu .action-menu-content {
  padding: 3px 30px 0px 5px;
  background-color: #3a8996;
  -webkit-box-shadow:
    0 3px 6px rgba(0, 0, 0, 0.16),
    0 3px 6px rgba(0, 0, 0, 0.23);
  box-shadow:
    0 3px 6px rgba(0, 0, 0, 0.16),
    0 3px 6px rgba(0, 0, 0, 0.23);
  top: -1px;
  right: -2px;
}

.action-menu .action-menu-content a {
  color: white;
}

.action-menu-title {
  padding-left: 8px;
  color: white;
}

.action-menu:not(.active) .action-menu-icon:hover div:nth-child(2) {
  width: 4px;
  height: 15px;
  -webkit-transform: translate(-5px, -10px) rotate(90deg);
  -ms-transform: translate(-5px, -10px) rotate(90deg);
  transform: translate(-5px, -10px) rotate(90deg);
  border-radius: 0;
  opacity: 0;
}

.action-menu:not(.active) .action-menu-icon:hover div:nth-child(1) {
  width: 4px;
  height: 15px;
  -webkit-transform: translate(-5px, 8px) rotate(90deg);
  -ms-transform: translate(-5px, 8px) rotate(90deg);
  transform: translate(-5px, 8px) rotate(90deg);
  border-radius: 0;
}

.action-menu:not(.active) .action-menu-icon:hover div:nth-child(3) {
  width: 4px;
  height: 15px;
  -webkit-transform: translate(-5px, -6px) rotate(-90deg);
  -ms-transform: translate(-5px, -6px) rotate(-90deg);
  transform: translate(-5px, -6px) rotate(-90deg);
  border-radius: 0;
}

.action-menu .action-menu-item img,
.action-menu .action-menu-item svg,
.action-menu .action-menu-no-icon,
.action-menu .action-menu-item input[type="image"] {
  -webkit-filter: hue-rotate(0) saturate(80%) brightness(210%) !important;
  filter: hue-rotate(0) saturate(80%) brightness(210%) !important;
}

#questionnaire_overview .action-menu .action-menu-content {
  padding: 3px 30px 0px 5px;
  background-color: #dcdcdc;
  -webkit-box-shadow:
    0 3px 6px rgba(0, 0, 0, 0.16),
    0 3px 6px rgba(0, 0, 0, 0.23);
  box-shadow:
    0 3px 6px rgba(0, 0, 0, 0.16),
    0 3px 6px rgba(0, 0, 0, 0.23);
  top: -1px;
  right: -2px;
  color: #202020;
  top: -4px;
  right: -5px;
}

#questionnaire_overview .action-menu .action-menu-content a {
  color: #202020;
}

#questionnaire_overview .action-menu .action-menu-icon div {
  background-color: black;
}

#questionnaire_overview .action-menu {
  padding-top: 7px;
  padding-left: 3px;
}

#questionnaire_overview .action-menu-content .action-menu-icon div {
  background-color: white;
}

#questionnaire_overview .action-menu .action-menu-item img,
.action-menu .action-menu-item svg,
.action-menu .action-menu-no-icon,
.action-menu .action-menu-item input[type="image"] {
  -webkit-filter: hue-rotate(0) saturate(80%) brightness(100%) !important;
  filter: hue-rotate(0) saturate(80%) brightness(100%) !important;
}

table.default .actions img,
table.default .actions svg {
  padding: 3px 0 0 8px !important;
}

#barBottomContainer nav li.action-menu-item img {
  -webkit-filter: hue-rotate(0) saturate(0%) brightness(70%) !important;
  filter: hue-rotate(0) saturate(0%) brightness(70%) !important;
}

#course-statusgroups-index section.course-statusgroups article header h1 a {
  color: white;
}

#course-statusgroups-index section.contentbox .icon-shape-mail,
#course-statusgroups-index section.contentbox > article header h1 a:before,
.collapsable .toggle-indicator a,
.tooltip-important {
  -webkit-filter: brightness(400%) contrast(5) saturate(0);
  filter: brightness(400%) contrast(5) saturate(0);
}

section.course-statusgroups article section table thead tr th {
  background-color: #3a8996;
}

.table_header_bold,
.ui-widget-header {
  background-color: #3a8996;
  border: 0;
}

h1.table_header_bold,
h2.table_header_bold {
  margin: 0;
}

.ui-dialog-content table td {
  padding: 5px;
}

#my_courses-archive table a {
  color: #202020;
}

section.contentbox dd {
  margin-bottom: 10px;
}

.ui-dialog.studip-confirmation .ui-dialog-titlebar-close .ui-icon,
.ui-dialog.studip-confirmation .ui-dialog-titlebar-close .ui-icon:hover {
  background-image: url(../../../assets/images/icons/grey/decline.svg);
}

.ui-state-default,
.ui-widget-content .ui-state-default,
.ui-widget-header .ui-state-default,
.ui-button,
html .ui-button.ui-state-disabled:hover,
html .ui-button.ui-state-disabled:active {
  background-color: #3a8996;
  color: white;
}

.ui-widget.ui-widget-content {
  -webkit-box-shadow:
    0 10px 20px rgba(0, 0, 0, 0.19),
    0 6px 6px rgba(0, 0, 0, 0.23);
  box-shadow:
    0 10px 20px rgba(0, 0, 0, 0.19),
    0 6px 6px rgba(0, 0, 0, 0.23);
}

.js .drag-and-drop {
  background-image: url(../../../assets/images/icons/grey/upload.svg);
  background-color: transparent;
}

/*----- Veranstaltungen Einstellungen  --- */

#settings-notifications a.tree {
  color: black;
}

#settings-notifications img.icon-shape-forum {
  -webkit-filter: contrast(10);
  filter: contrast(10);
}

/*----- Veranstaltungen Icons  --- */

.studip-checkbox + label::before {
  background-image: url(../../../assets/images/icons/black/checkbox-unchecked.svg);
}

.studip-checkbox:indeterminate + label::before {
  background-image: url(../../../assets/images/icons/black/checkbox-indeterminate.svg);
}

.studip-checkbox:checked + label::before {
  background-image: url(../../../assets/images/icons/black/checkbox-checked.svg);
}

.select2-container--default .select2-selection__arrow {
  background-image: url(../../../assets/images/icons/grey/arr_1down.svg);
}

ul.message-options img {
  height: 20px;
  width: 20px;
}

div.memberselect {
}

dd {
  margin-bottom: 10px;
}

/* ------Ressourcen Tabelle ohne horizontales Scrollen-----*/

#resources #layout_content {
  overflow: visible;
}

.grid-stack .grid-stack-item {
  width: 100%;
}

/* ----------------------------------------------------------------------------------------
  --- Community ---------------------------------------------------------------------
  ------------------------------------------------------------------------------------------- */

#threadwriter {
  margin-bottom: 40px !important;
}

#threadwriter > .row {
  padding: 10px !important;
  margin-right: 10px !important;
  border: 0 !important;
  background-color: white !important;
}

#blubber_threads > .thread {
  border: 0 !important;
  background-color: #e8e8e8 !important;
}

#blubber_threads > .thread > .contextinfo {
  color: white !important;
  background-color: #3a8996 !important;
}

#blubber_threads .posting > .writer > textarea {
  padding: 8px !important;
  margin-right: 10px !important;
}

#blubber_threads .content_column .timer a,
#blubber_threads .content_column .timer a:hover {
  color: #202020 !important;
}

#streams-edit table.default > tbody > tr > th {
  background-color: #e8e8e8 !important;
}

#blubber_threads .opengraph-area {
  margin: 10px 0 10px 0 !important;
}

#blubber_threads .posting > .writer .uploader {
  opacity: 0.8 !important;
  margin-right: 16px !important;
}

#threadwriter > .row .uploader {
  opacity: 0.8 !important;
  margin-left: 16px !important;
}

#blubber_threads .posting > .writer {
  border: 0 !important;
}

#threadwriter > .row > .context_selector {
  border-right: 2px solid #3a8996 !important;
}

#threadwriter > .row > textarea {
  margin-left: 10px !important;
  padding: 10px !important;
}

.action-menu .action-menu-item input[type="image"] {
  padding-left: 8px !important;
}

#contact-index #layout_content thead tr {
  background-color: #e8e8e8;
  color: #202020;
}

#contact-index form input.icon-shape-trash {
  padding: 3px 0 0 8px !important;
}

#contact-index table.default .actions img,
#contact-index table.default .actions svg {
  padding: 0px 3px 6px 12px !important;
}

/* ----------------------------------------------------------------------------------------
  --- Planer ---------------------------------------------------------------------
  ------------------------------------------------------------------------------------------- */

div.schedule_entry {
  font-size: 12px;
}

table.calendar-day tbody tr td.calendar-category1 div:first-child,
table.calendar-day tbody tr td.calendar-course-category5 div:first-child,
table.calendar-week tbody tr td.calendar-category1 div:first-child,
table.calendar-week tbody tr td.calendar-course-category5 div:first-child {
  padding: 3px !important;
}

table.calendar-day tbody tr td.calendar-category1,
table.calendar-day tbody tr td.calendar-course-category5,
table.calendar-week tbody tr td.calendar-category1,
table.calendar-week tbody tr td.calendar-course-category5 {
  border: 1px solid grey !important;
}

/* ----------------------------------------------------------------------------------------
  --- Einstellungen ---------------------------------------------------------------------
  ------------------------------------------------------------------------------------------- */

#settings-categories-index .icon-shape-arr_2up,
#settings-categories-index .icon-shape-arr_2down {
  -webkit-filter: contrast(10);
  filter: contrast(10);
}

/* ----------------------------------------------------------------------------------------
  --- Suche ---------------------------------------------------------------------
  ------------------------------------------------------------------------------------------- */

#globalsearch-searchbar
  #globalsearch-results
  article
  section
  .globalsearch-result-expand
  a {
  display: none;
}

#globalsearch-searchbar #globalsearch-list {
  max-height: 70vh;
  max-width: 46vh !important;
  min-width: 300px;
}

#sem_search_level {
  margin-top: 20px;
  border-top: 2px solid #3a8996;
}

#sem_search_level table.hidden-medium-down a {
  font-weight: normal;
  color: #3d444f;
  font-size: 14px;
  text-transform: uppercase;
}

form input {
  padding: 2px 0 7px 0;
}

/*--------Such Einrichtungen--------*/

#institut_browse table td.printcontent {
  padding: 0 0 15px 17px;
}

#institut_browse form footer {
  margin-bottom: 15px;
}

table td.printcontent,
table td.printcontent:hover {
  background-color: white;
}

/* ----------------------------------------------------------------------------------------
  --- Admin ---------------------------------------------------------------------
  ------------------------------------------------------------------------------------------- */

#admin-user-edit .collapsable .toggle-indicator a {
  color: white;
}

/* ----------------------------------------------------------------------------------------
  --- Module ---------------------------------------------------------------------
  ------------------------------------------------------------------------------------------- */

.mvv-load-in-new-row {
  -webkit-filter: brightness(100%) contrast(1) saturate(0);
  filter: brightness(100%) contrast(1) saturate(0);
}

#studiengaenge-studiengaenge-index .collapsable .collapsed .toggle-indicator a {
  background-image: url(../../../assets/images/icons/black/arr_1right.svg);
}

#studiengaenge-studiengaenge-index .collapsable .toggle-indicator a {
  -webkit-filter: none;
  filter: none;
}

/* ----------------------------------------------------------------------------------------
  --- Daten ---------------------------------------------------------------------
  ------------------------------------------------------------------------------------------- */

.grid-stack .grid-stack-item[data-gs-width="3"] {
  width: 50%;
}

.dashboad-documents-list tr.sortable {
  background-color: #3a8996;
}

.dashboad-documents-list tr .tablesorter-header-inner {
  font-weight: bold;
  color: white;
}

.dashboad-documents-list td.actions .action-menu-icon div {
  background: black;
}

.grid-stack .widget-header .widget-title {
  color: #202020;
}

/* ----------------------------------------------------------------------------------------
  --- Ressourcen ---------------------------------------------------------------------
  ------------------------------------------------------------------------------------------- */

#resources td.printhead {
  background-color: white;
  background-image: none;
  border-top: 1px solid grey;
  height: auto;
  padding-top: 0;
  background-color: #f0f0f0;
  padding: 6px;
}

#resources table td.printhead2 {
  background-image: none;
  background-repeat: no-repeat;
  border-top: 1px solid grey;
  background-color: #f0f0f0;
}

#resources table td.printhead3 {
  background-color: white;
  background-image: none;
  border-top: 1px solid grey;
  height: auto;
  padding-top: 0;
  background-color: #f0f0f0;
}

#resources .printcontent {
  background-color: #dcdcdc;
}

#resources table tr td div div .button-group {
  float: left;
  margin-bottom: 20px !important;
  margin-right: 0;
}

#resources table tr td div .button-group a.button {
  margin-bottom: 6px !important;
}

#files-index tfoot button.button,
#files-index tfoot a.button {
  margin-bottom: 6px !important;
}

#article-view footer.button-group a {
  margin-bottom: 6px !important;
  margin-top: 6px !important;
}

#article-view footer.button-group {
  margin-top: 6px !important;
}

.ui-dialog-buttonset button.ui-button {
  margin-bottom: 6px !important;
}

.ui-dialog-buttonset {
  white-space: normal !important;
}

/* ----------------------------------------------------------------------------------------
  --- Schwarzes Brett ---------------------------------------------------------------------
  ------------------------------------------------------------------------------------------- */

#category-view .sb-categories {
  -webkit-column-count: 2 !important;
  column-count: 2 !important;
  -webkit-column-gap: 2em !important;
  column-gap: 2em !important;
  -webkit-column-rule: 0 !important;
  column-rule: 0 !important;
}

#category-view li .category {
  border-left: 0 !important;
  border-top-left-radius: 0 !important;
  border-bottom-left-radius: 0 !important;
}

#category-view .sb-categories li {
  border-bottom: 0 !important;
  padding-top: 2px !important;
}

#category-view .category {
  font-weight: normal !important;
  color: #202020 !important;
}

#category-view .sb-articles {
  -webkit-column-gap: 2em !important;
  column-gap: 2em !important;
  -webkit-column-rule: 0 !important;
  column-rule: 0 !important;
}

#category-view li .article {
  border-left: 0 !important;
  border-top-left-radius: 0px !important;
  border-bottom-left-radius: 0px !important;
}

#layout-container #category-view a {
  color: #202020 !important;
  -webkit-transition: none !important;
  -o-transition: none !important;
  transition: none !important;
}

#category-view a.article {
  color: #145f6b !important;
  -webkit-transition: none !important;
  -o-transition: none !important;
  transition: none !important;
}

#category-view .sb-articles li {
  border-bottom: 0 !important;
  padding: 10px !important;
  margin: 5px 0 5px 0 !important;
  border-left: 2px solid #3a8996 !important;
  background-color: white !important;
  -webkit-box-shadow:
    0 3px 6px rgba(0, 0, 0, 0.16),
    0 3px 6px rgba(0, 0, 0, 0.23) !important;
  box-shadow:
    0 3px 6px rgba(0, 0, 0, 0.16),
    0 3px 6px rgba(0, 0, 0, 0.23) !important;
  -webkit-transition: 0 !important;
  -o-transition: 0 !important;
  transition: none !important;
}

#category-view .sb-articles li:hover {
  background-color: #3a8996 !important;
}

#category-view .sb-articles li:hover a {
  color: white !important;
}

#category-view .ui-dialog-content .sb-article section {
  padding-top: 10px !important;
}

#article-view article.sb-article header {
  border-bottom: 2px solid #3a8996;
  padding-bottom: 5px;
  margin-bottom: 10px;
}

/* ----------------------------------------------------------------------------------------
  --- Footer ---------------------------------------------------------------------
  ------------------------------------------------------------------------------------------- */
body #scroll-to-top {
  border-radius: 50%;
  background-color: var(--color--login-accent);
}

#layout_footer {
  max-width: 1400px;
  margin: 0 auto;
  border-top: 1px solid #c0c0c0;
  -webkit-box-shadow:
    0 19px 38px rgba(0, 0, 0, 0.2),
    0 15px 12px rgba(0, 0, 0, 0.1);
  box-shadow:
    0 19px 38px rgba(0, 0, 0, 0.2),
    0 15px 12px rgba(0, 0, 0, 0.1);
  overflow: hidden;
}

#layout_footer > ul li {
  padding: 0 15px 0 0;
}
#main-footer-navigation {
  flex-grow: 0;
}
#main-footer,
#main-footer-navigation ul li a {
  color: var(--color--brand-primary-contrast);
}

@media (max-width: 575px) {
  #layout_footer > ul {
    margin-left: 14px;
  }

  #layout_footer > ul li {
    padding: 0 5px 0 0;
  }
}

@media print {
  #login {
    background-color: white;
    -webkit-box-shadow: none;
    box-shadow: none;
  }

  #flex-header,
  #current_page_title,
  #layout_footer {
    display: none;
  }

  #schedule div.schedule_entry dl {
    background-color: grey !important;
  }
}

/* --------- Veranstaltungen Verwaltung Studienbereiche -----*/

.css-tree.collapsable input[type="checkbox"] + label::before {
  background-image: url(../../../assets/images/icons/grey/arr_1right.svg);
}

.csstransforms
  .css-tree.collapsable
  input[type="checkbox"]:checked
  + label::before {
  background-image: url(../../../assets/images/icons/grey/arr_1right.svg);
}

#studyareas input.icon-shape-arr_2left,
#studyareas input[type="image"] {
  padding: 0;
}

#studyareas .css-tree input + label {
  vertical-align: super;
}

div#assigned {
  width: calc(40% - 10px);
}

div#studyareas {
  width: calc(60% - 20px);
}

#studyareas ul li ul > li {
  border-left: 1px solid grey;
  margin-bottom: 5px;
  background-color: #f0f0f0;
  padding-top: 5px;
}

#studyareas ul li ul li ul {
  background-color: #dcdcdc;
}

div#assigned input[type="image"] {
  padding: 0;
}

/* --------- Blaue Icons grau färben -----*/

#studyareas ul li ul li ul input[type="image"],
div#assigned input[type="image"] {
  -webkit-filter: grayscale() contrast(0) brightness(0.8);
  filter: grayscale() contrast(0) brightness(0.8);
}

#institut_browse td.printhead img {
  -webkit-filter: grayscale() contrast(0) brightness(0.8);
  filter: grayscale() contrast(0) brightness(0.8);
}

/*--------------------Forum----------------------*/

#forum .posting {
  background-color: #f0f0f0 !important;
  padding: 10px !important;
  border: 2px solid #3a8996;
}

#forum #tutorBreadcrumb {
  margin-bottom: 0.5em !important;
  font-size: 1em !important;
}

#forum #tutorBreadcrumb a {
  color: #202020 !important;
}

#forum a.marked div {
  background-image: url(../../../assets/images/icons/black/staple.svg) !important;
}

#forum .buttons {
  text-align: left !important;
  padding-top: 20px !important;
}

#forum .postprofile {
  border-left: 0 !important;
  background-color: white;
  padding: 10px !important;
  width: 170px !important;
  height: auto !important;
}

#forum .posting a.button {
  margin-bottom: 8px !important;
}

#forum div.small_screen {
  margin-bottom: 15px !important;
}

#forum #new_entry_button a.button {
  text-align: left !important;
  margin-bottom: 8px !important;
}

#forum #new_entry_button {
  text-align: left !important;
}

#forum tr.new_area input,
#forum tr.new_area textarea {
  margin-bottom: 10px !important;
  padding: 5px !important;
}

#forum tr.new_area {
  margin-bottom: 10px !important;
  padding: 5px !important;
}

#forum #sortable_areas tr.add_area span {
  color: var(--color--login-link) !important;
  font-size: 14px !important;
}

#forum .smiley_favorites {
  text-align: left !important;
}

#forum .smiley_favorites a {
  font-size: 14px !important;
}

/*--------------------Teilnehmende Veranstaltungen----------------------*/

course-files-index ul.message-options {
  text-align: left;
}

ul.message-options li {
  margin-right: 10px;
  text-align: center;
}

.action-menu .action-menu-item a[disabled] {
  color: white;
}

.quicksearch_frame input[type="text"] {
  border-color: grey;
}

.quicksearch_frame input[type="submit"] {
  height: 28px;
  background-image: url(../../../assets/images/icons/black/search.svg) !important;
  cursor: pointer;
  background-size: 24px 17px;
  background-position: center 7px;
  width: 31px;
}

.sidebar-widget .widget-options .options-checkbox.options-unchecked {
  background-image: url("../../../assets/images/icons/black/checkbox-unchecked.svg");
}

.sidebar-widget .widget-options .options-checkbox.options-checked {
  background-image: url("../../../assets/images/icons/black/checkbox-checked.svg");
}

/*----Daten veranstaltung---*/

.ui-dialog.ui-widget.ui-widget-content
  .ui-dialog-buttonpane
  .ui-button.download::before {
  background-image: url(../../../assets/images/icons/grey/download2.svg);
}

.ui-dialog.ui-widget.ui-widget-content
  .ui-dialog-buttonpane
  .ui-button.download::before,
.ui-dialog.ui-widget.ui-widget-content
  .ui-dialog-buttonpane
  .ui-button.download:hover::before {
  background-image: url(../../../assets/images/icons/grey/download2.svg);
}

form.default
  fieldset.select_terms_of_use
  > input[type="radio"]:checked
  + label {
  background-color: #dcdcdc;
}

/*----Wiki Veranstaltung---*/

#wiki td.toolbar,
td.printhead,
table td.printhead3 {
  background-color: lightgrey;
  background-image: none;
  border-top: 0;
  line-height: 25pt;
  padding-top: 0px !important;
}

#wiki td.toolbar:last-child,
td.printhead:last-child {
  padding-right: 10px;
}

#wiki td.toolbar,
#wiki td.printhead,
#wiki table td.printhead3,
#wiki .content_title {
  background-color: lightgrey;
  background-image: none;
  border-top: 0;
  line-height: 25pt;
  padding-top: 0px !important;
}

#wiki td.printhead3 {
  display: none;
}

#wiki table td.printcontent div:first-child {
  background-color: #a7a7a7;
}

#wiki #main_content {
  font-size: 14px !important;
}

#wiki table td.printcontent {
  background-color: #e8e8e8;
  padding-bottom: 10px;
}

/*----Lernmodule Veranstaltung---*/

#course-elearning-show td.toolbar,
td.printhead,
table td.printhead3 {
  background-color: #e8e8e8;
  background-image: none;
  border-top: 0;
  line-height: 25pt;
  padding-top: 0px !important;
}

#course-elearning-show td.toolbar:last-child,
td.printhead:last-child {
  padding-right: 10px;
}

#course-elearning-show td.toolbar,
#course-elearning-show td.printhead,
#course-elearning-show table td.printhead2,
#course-elearning-show .content_title {
  background-color: lightgrey;
  background-image: none;
  border-top: 0;
  line-height: 25pt;
  padding-top: 0px !important;
}

#course-elearning-show table td.printcontent div:first-child {
  background-color: #a7a7a7;
}

#course-elearning-show #main_content {
  font-size: 14px !important;
}

#course-elearning-show table td.printcontent {
  background-color: #e8e8e8;
  padding-bottom: 10px;
}

/*----Literatur Veranstaltung---*/

#course-literature-index #layout_content ul {
  list-style: none;
  padding-left: 0;
}

#course-literature-index #layout_content li {
  margin-bottom: 15px !important;
  border-bottom: 2px solid #3a8996;
  padding: 10px;
  background-color: #e8e8e8;
}

#literature-print_view #flex-header {
  display: none;
}

#course-literature-index h3 {
  margin: 0;
}

/* ----------------------------------------------------------------------------------------
  --- Nachrichten ---------------------------------------------------------------------
  ------------------------------------------------------------------------------------------- */

#messages-overview #bulk caption,
#messages-sent #bulk caption {
  display: none;
}

#messages-overview #bulk table.default > tbody > tr > td.title a,
#messages-sent #bulk table.default > tbody > tr > td.title a {
  color: #202020;
}

#messages-overview #bulk table.default > tbody > tr > td,
#messages-sent #bulk table.default > tbody > tr > td {
  background-color: #e8e8e8;
  border-bottom: 1px solid grey;
}

#messages-overview tr.sortable {
  background-color: #e8e8e8;
}

.message_body {
  background-color: #e8e8e8;
  border: 2px solid #3a8996;
}

/* ----------------------------------------------------------------------------------------
  --- Dies und Das ---------------------------------------------------------------------
  ------------------------------------------------------------------------------------------- */

a img.icon-role-clickable {
  -webkit-filter: contrast(0.8);
  filter: contrast(0.8);
}

article.studip header nav > * {
  max-height: 3em;
}

#my_courses-index .collapsable .toggle-indicator a {
  color: white !important;
}

#action-menu-content ul li label {
  margin: 0;
  color: white;
}

a.link-right::before {
  background-image: url("../../../assets/images/icons/grey/arr_2right.svg") !important;
}

.calendar-day-event-title a {
  color: #fff !important;
}

/* ----------------------------------------------------------------------------------------
  --- Evaluation ---------------------------------------------------------------------
  ------------------------------------------------------------------------------------------- */

div.eval_plugin #main {
  width: 100% !important;
  border: 0px !important;
}

div.eval_plugin #main h1 {
  display: none;
}

div.eval_plugin #main button.cancel {
  padding: 6px 10px 6px 10px !important;
}

div.eval_plugin #main fieldset legend {
  font-weight: normal !important;
  font-size: 18px !important;
}

/* --  Fehler ausblenden --*/

#show-index > b {
  display: none;
}

/* ----------------------------------------------------------------------------------------
  --- Profil ---------------------------------------------------------------------
  ------------------------------------------------------------------------------------------- */

#profile-index article.studip {
  border: 1px solid #d0d7e3;
  background-color: #e8e8e8;
}

#profile-index article.studip header {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  border-bottom: 2px solid #3a8996;
}

#profile-index article.studip article.studip {
  background-color: white;
}

#profile-index article.studip article.studip header {
  border: 0;
}

#settings-privacy-index tr.hidden-tiny-down th {
  color: #202020;
}

/* ----------------------------------------------------------------------------------------
  --- Veranstaltungen Kurzinfo ---------------------------------------------------------------------
  ------------------------------------------------------------------------------------------- */

#institute-overview-index article.studip header {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  border-bottom: 2px solid #3a8996;
}

#institute-overview-index article.studip {
  border: 1px solid #d0d7e3;
  background-color: #e8e8e8;
}

#institute-overview-index article.studip article.studip {
  background-color: white;
}

#institute-overview-index article.studip article.studip header {
  border: 0;
}

/* -------------- */

#course-overview-index article.studip {
  border: 1px solid #d0d7e3;
  background-color: #e8e8e8;
}

#course-overview-index article.studip header {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  border-bottom: 2px solid #3a8996;
}

#course-overview-index article.studip article.studip {
  background-color: white;
}

#course-overview-index article.studip article.studip header {
  border: 0;
}

/* ----------------------------------------------------------------------------------------
  --- Action-Menu schwarz ---------------------------------------------------------------------
  ------------------------------------------------------------------------------------------- */

html.csstransforms #course-files-index .action-menu .action-menu-icon div {
  background-color: black;
}

html.csstransforms #course-members-index .action-menu .action-menu-icon div {
  background-color: black;
}

html.csstransforms #messages-overview .action-menu .action-menu-icon div {
  background-color: black;
}

html.csstransforms #contact-index .action-menu .action-menu-icon div {
  background-color: black;
}

html.csstransforms #files-index .action-menu .action-menu-icon div {
  background-color: black;
}

html.csstransforms #news-admin_news .action-menu .action-menu-icon div {
  background-color: black;
}

html.csstransforms #files_dashboard-index .action-menu .action-menu-icon div {
  background-color: black;
}

news-admin_news
  html.csstransforms
  #course-members-index
  .action-menu
  .action-menu-icon
  div
  ul.message-options {
  text-align: left;
}

@media screen and (max-width: 1400px) {
  #file_edit_window,
  #file_details_window {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
  }
}

@media screen and (min-width: 1px) {
  #file_aside,
  #folder_aside {
    width: 100%;
    max-width: 100%;
  }

  #file_management_forms,
  div#preview_container {
    width: 100%;
    max-width: 100%;
  }

  #file_aside,
  #folder_aside {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }

  .file-icon {
    -webkit-box-ordinal-group: 2;
    -ms-flex-order: 1;
    order: 1;
    width: calc(30% - 10px);
    max-width: calc(30% - 10px);
  }

  .folder-icon {
    -webkit-box-ordinal-group: 2;
    -ms-flex-order: 1;
    order: 1;
    width: calc(30% - 10px);
    max-width: calc(30% - 10px);
  }

  .meetings-caption .folder-icon {
    width: initial;
    max-width: initial;
  }

  #file_aside div.file-icon img,
  #folder_aside div.file-icon img,
  #file_aside div.folder-icon img,
  #folder_aside div.folder-icon img {
    margin-left: 20%;
    width: 64%;
    max-height: 16em;
    height: 100%;
  }
}

img.icon-role-status-green {
  -webkit-filter: sepia(1) hue-rotate(79deg) contrast(4) brightness(1) !important;
  filter: sepia(1) hue-rotate(79deg) contrast(4) brightness(1) !important;
}

img.icon-role-status-red {
  -webkit-filter: sepia(1) hue-rotate(-52deg) contrast(6) brightness(1) !important;
  filter: sepia(1) hue-rotate(-52deg) contrast(6) brightness(1) !important;
}

#admin-user-index .action-menu .action-menu-item img,
.action-menu .action-menu-item svg,
#admin-user-index .action-menu input[type="image"] {
  -webkit-filter: contrast(40) !important;
  filter: contrast(40) !important;
}

#admin-user-index img.icon-role-status-red {
  -webkit-filter: contrast(40) !important;
  filter: contrast(40) !important;
}

#admin-user-index li.action-menu-item > a > img {
  padding: 2px 5px 0px 8px !important;
  vertical-align: sub !important;
}

@media (max-width: 767px) {
  #barBottomright #sidebar-menu {
    margin: 0 7px 3px 11px;
  }

  #notification_marker.alert {
    width: 13px !important;
    height: 26px !important;
  }
}

/* sticky header der modul-tabelle */

#search-studiengaenge-studiengang #layout_content {
  overflow: inherit;
}

.mvv-modul-details thead th {
  position: -webkit-sticky;
  position: sticky;
  top: 50px;
  background-color: #3a8996 !important;
  z-index: 100;
}

.mvv-modul-details thead tr:nth-child(2) th {
  position: -webkit-sticky;
  position: sticky;
  top: 80px;
  background-color: #3a8996;
  z-index: 100;
}

/* ----------------------------------------------------------------------------------------
  --- Layout Hotfix ---------------------------------------------------------------------
  ------------------------------------------------------------------------------------------- */

/* Benachrichtugungen: Popup clickable */

#notification_container #notification_list {
  margin-top: 0;
}

#notification_container .list.below {
  left: -336px;
}

/* Startseite: Link Vorlesungsverzeichnis */

#nav_item_vvv {
  display: none;
}

#index #nav_item_vvv {
  display: block;
}

#nav_item_vvv {
  left: 155px;
  top: 38px;
  position: absolute;
}

#nav_item_vvv a {
  display: block;
  padding: 0 0;
  text-align: center;
}

#nav_item_vvv a img {
  -webkit-filter: contrast(3.5) brightness(2.5) !important;
  filter: contrast(3.5) brightness(2.5) !important;
  margin-bottom: 3px;
}

#nav_item_vvv a:hover {
  color: var(--color--login-accent);
}

#nav_item_vvv a:hover img {
  -webkit-filter: sepia(1) hue-rotate(37deg) contrast(3.5) brightness(1.4) !important;
  filter: sepia(1) hue-rotate(37deg) contrast(3.5) brightness(1.4) !important;
}

/* Icon Aktivitäten */

#stream-container .activity header .provider_circle {
  background: whitesmoke !important;
  border: 1px solid #dcdcdc !important;
}

/* Menü Veranstaltungen */

html.csstransforms .contentbox article .action-menu .action-menu-icon div {
  background: black;
}

/* Schwarzes Brett overflow Mozilla fix */

.ui-dialog .ui-dialog-content {
  overflow: auto;
}

.ui-dialog section {
  overflow: auto;
}

/* ----------------------------------------------------------------------------------------
  --- 404 ---------------------------------------------------------------------
  ------------------------------------------------------------------------------------------- */

/*

  Copyright (c) 2019 - Franz Schünzel - https://codepen.io/_massimo/pen/dOwQBz

  Permission is hereby granted, free of charge, to any person
  obtaining a copy of this software and associated documentation
  files (the "Software"), to deal in the Software without restriction,
   including without limitation the rights to use, copy, modify,
  merge, publish, distribute, sublicense, and/or sell copies of
  the Software, and to permit persons to whom the Software is
  furnished to do so, subject to the following conditions:

  The above copyright notice and this permission notice shall
  be included in all copies or substantial portions of the Software.

  THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
  EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES
  OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
  NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT
  HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
  WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
  OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER
  DEALINGS IN THE SOFTWARE.

  */

@-webkit-keyframes shake {
  50% {
    top: 6px;
  }
}
@keyframes shake {
  50% {
    top: 6px;
  }
}
@-webkit-keyframes shadow {
  50% {
    width: 110px;
    margin-left: -40px;
  }
}
@keyframes shadow {
  50% {
    width: 110px;
    margin-left: -40px;
  }
}
@-webkit-keyframes tail {
  50% {
    -webkit-transform: rotate(38deg);
    -ms-transform: rotate(38deg);
    transform: rotate(38deg);
  }
}
@keyframes tail {
  50% {
    -webkit-transform: rotate(38deg);
    -ms-transform: rotate(38deg);
    transform: rotate(38deg);
  }
}
@-webkit-keyframes track {
  to {
    margin-left: 20px;
  }
}
@keyframes track {
  to {
    margin-left: 20px;
  }
}
@-webkit-keyframes eye {
  50% {
    top: 2px;
  }
}
@keyframes eye {
  50% {
    top: 2px;
  }
}
@-webkit-keyframes mustache_l {
  50% {
    -webkit-transform: rotate(-10deg);
    -ms-transform: rotate(-10deg);
    transform: rotate(-10deg);
  }
}
@keyframes mustache_l {
  50% {
    -webkit-transform: rotate(-10deg);
    -ms-transform: rotate(-10deg);
    transform: rotate(-10deg);
  }
}
@-webkit-keyframes mustache_r {
  0%,
  100% {
    -webkit-transform: rotateY(180deg) rotateZ(0);
    -ms-transform: rotateY(180deg) rotateZ(0);
    transform: rotateY(180deg) rotateZ(0);
  }
  50% {
    -webkit-transform: rotateY(180deg) rotateZ(-10deg);
    -ms-transform: rotateY(180deg) rotateZ(-10deg);
    transform: rotateY(180deg) rotateZ(-10deg);
  }
}
@keyframes mustache_r {
  0%,
  100% {
    -webkit-transform: rotateY(180deg) rotateZ(0);
    -ms-transform: rotateY(180deg) rotateZ(0);
    transform: rotateY(180deg) rotateZ(0);
  }
  50% {
    -webkit-transform: rotateY(180deg) rotateZ(-10deg);
    -ms-transform: rotateY(180deg) rotateZ(-10deg);
    transform: rotateY(180deg) rotateZ(-10deg);
  }
}
@-webkit-keyframes ear_l {
  50% {
    -webkit-transform: rotate(-30deg);
    -ms-transform: rotate(-30deg);
    transform: rotate(-30deg);
  }
}
@keyframes ear_l {
  50% {
    -webkit-transform: rotate(-30deg);
    -ms-transform: rotate(-30deg);
    transform: rotate(-30deg);
  }
}
@-webkit-keyframes ear_r {
  50% {
    -webkit-transform: rotate(30deg);
    -ms-transform: rotate(30deg);
    transform: rotate(30deg);
  }
}
@keyframes ear_r {
  50% {
    -webkit-transform: rotate(30deg);
    -ms-transform: rotate(30deg);
    transform: rotate(30deg);
  }
}
@-webkit-keyframes paw_l {
  50% {
    left: 130px;
    top: 176px;
  }
  70% {
    top: 160px;
  }
}
@keyframes paw_l {
  50% {
    left: 130px;
    top: 176px;
  }
  70% {
    top: 160px;
  }
}
@-webkit-keyframes paw_r {
  25% {
    top: 160px;
  }
  50% {
    left: 88px;
    top: 176px;
  }
}
@keyframes paw_r {
  25% {
    top: 160px;
  }
  50% {
    left: 88px;
    top: 176px;
  }
}

.info--container {
  -webkit-box-shadow:
    0 3px 6px rgba(0, 0, 0, 0.16),
    0 3px 6px rgba(0, 0, 0, 0.23);
  box-shadow:
    0 3px 6px rgba(0, 0, 0, 0.16),
    0 3px 6px rgba(0, 0, 0, 0.23);
  background-color: var(--color--login-tile-background);
  width: 100%;
  margin: 0 auto;
  padding: 3rem;
  max-width: 666px;
  z-index: 100;
}

.info--container:before {
  content: "404";
  font-style: normal;
  font-size: 37rem;
  font-weight: 700;
  color: #a3ea98;
  padding: 1rem 2rem;
  position: absolute;
  padding: 1rem 2rem;
  top: 25%;
  -webkit-transform: rotate(-20deg);
  -ms-transform: rotate(-20deg);
  transform: rotate(-20deg);
  z-index: 0;
}

.info--container a,
.info--container a:link,
.info--container a:visited {
  color: var(--color--login-link);
}

.cat {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 188px;
  height: 260px;
  margin-left: -99px;
  margin-top: -130px;
}

.cat-bg {
  background-image: -webkit-linear-gradient(330deg, #d4fc79 0%, #96e6a1 100%);
  background-image: -o-linear-gradient(330deg, #d4fc79 0%, #96e6a1 100%);
  background-image: linear-gradient(120deg, #d4fc79 0%, #96e6a1 100%);
}

.cat .quote {
  font-size: 1.8rem;
  width: 25rem;
  text-align: center;
  position: relative;
  top: 33rem;
  left: 0;
}

.cat .quote p {
  color: rgba(0, 0, 0, 0.5);
}

.cat .paw {
  position: absolute;
  top: 176px;
  left: 88px;
  width: 20px;
  height: 80px;
  background: currentcolor;
  border-radius: 20px / 0 0 80px 40px;
  -webkit-transform: rotate(10deg);
  -ms-transform: rotate(10deg);
  transform: rotate(10deg);
  -webkit-animation: paw_l 0.45s infinite linear;
  animation: paw_l 0.45s infinite linear;
}
.cat .paw:after {
  position: absolute;
  content: "";
  bottom: -5px;
  left: -4px;
  width: 20px;
  height: 26px;
  background: currentcolor;
  border-radius: 50%;
  -webkit-transform: rotate(24deg);
  -ms-transform: rotate(24deg);
  transform: rotate(24deg);
}
.cat .paw:nth-child(2) {
  left: 130px;
  -webkit-animation: paw_r 0.45s infinite linear;
  animation: paw_r 0.45s infinite linear;
}
.cat .shake {
  position: absolute;
  width: 100%;
  top: 0;
  -webkit-animation: shake 0.45s infinite linear;
  animation: shake 0.45s infinite linear;
}
.cat:before {
  position: absolute;
  content: "";
  top: 100%;
  left: 50%;
  width: 130px;
  height: 30px;
  margin-left: -50px;
  margin-top: -20px;
  background: #616161;
  opacity: 0.4;
  border-radius: 50%;
  -webkit-animation: shadow 0.45s infinite linear;
  animation: shadow 0.45s infinite linear;
  -webkit-animation-delay: 0.225s;
  animation-delay: 0.225s;
}
.cat:after {
  position: absolute;
  content: "";
  top: 100%;
  left: 100%;
  width: 15px;
  height: 10px;
  margin-left: -30px;
  margin-top: -10px;
  background: #616161;
  opacity: 0.3;
  border-radius: 50%;
  -webkit-box-shadow:
    50px 0 #616161,
    100px 0 #616161,
    150px 0 #616161,
    200px 0 #616161,
    250px 0 #616161,
    300px 0 #616161;
  box-shadow:
    50px 0 #616161,
    100px 0 #616161,
    150px 0 #616161,
    200px 0 #616161,
    250px 0 #616161,
    300px 0 #616161;
  -webkit-animation: track 0.225s infinite linear;
  animation: track 0.225s infinite linear;
}
.cat .tail {
  position: absolute;
  content: "";
  top: 0;
  right: -4px;
  width: 160px;
  height: 150px;
  border: 20px solid;
  border-color: currentcolor transparent transparent currentcolor;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
  border-radius: 120px / 106px 120px 0 120px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-animation: tail 0.45s infinite linear;
  animation: tail 0.45s infinite linear;
}
.cat .tail:after {
  position: absolute;
  content: "";
  width: 20px;
  height: 20px;
  background: currentcolor;
  border-radius: 50%;
  bottom: 0;
  -webkit-box-shadow:
    2px 4px currentcolor,
    2px 7px currentcolor,
    2px 10px currentcolor,
    1px 14px currentcolor,
    -1px 18px currentcolor,
    -5px 22px currentcolor,
    -10px 25px currentcolor,
    -15px 28px currentcolor,
    -20px 30px currentcolor;
  box-shadow:
    2px 4px currentcolor,
    2px 7px currentcolor,
    2px 10px currentcolor,
    1px 14px currentcolor,
    -1px 18px currentcolor,
    -5px 22px currentcolor,
    -10px 25px currentcolor,
    -15px 28px currentcolor,
    -20px 30px currentcolor;
}
.cat .main {
  position: absolute;
  top: 14px;
  right: 0;
  width: 144px;
  height: 216px;
  color: currentcolor;
}
.cat .main .head {
  position: absolute;
  bottom: -10px;
  left: 20px;
  width: 104px;
  height: 180px;
  background: currentcolor;
  border-radius: 55px / 100px 100px 65px 65px;
  -webkit-transform: rotate(40deg);
  -ms-transform: rotate(40deg);
  transform: rotate(40deg);
}
.cat .main .body {
  position: absolute;
  right: 0;
  width: 130px;
  height: 180px;
  background: currentcolor;
  border-radius: 65px / 70px 70px 100px 100px;
}
.cat .main .body .leg {
  position: absolute;
  right: -10px;
  top: 20px;
  width: 50px;
  height: 116px;
  background: currentcolor;
  border-radius: 25px / 0 60px 50px 0;
}
.cat .main .body .leg:before {
  position: absolute;
  content: "";
  bottom: -4px;
  right: 0;
  width: 20px;
  height: 40px;
  border: 3px solid transparent;
  border-radius: 50%;
  border-left-color: #616161;
  -webkit-transform: rotate(6deg);
  -ms-transform: rotate(6deg);
  transform: rotate(6deg);
}
.cat .main .body .leg:after {
  position: absolute;
  content: "";
  left: 3px;
  bottom: 35px;
  width: 76px;
  height: 70px;
  border-radius: 50%;
  border: 3px solid transparent;
  border-bottom-color: #616161;
  -webkit-transform: rotate(65deg);
  -ms-transform: rotate(65deg);
  transform: rotate(65deg);
}
.cat .main .face {
  position: absolute;
  bottom: 0;
  width: 76px;
  height: 80px;
}
.cat .main .face .nose {
  position: absolute;
  bottom: 8px;
  left: 50%;
  width: 18px;
  height: 9px;
  margin-left: -10px;
  background: #a9788a;
  border-radius: 20px / 10px 10px 20px 20px;
}
.cat .main .face .mustache_cont {
  position: absolute;
  bottom: 5px;
  width: 20px;
  height: 10px;
  -webkit-animation: mustache_l 0.45s infinite linear;
  animation: mustache_l 0.45s infinite linear;
}
.cat .main .face .mustache_cont:nth-child(2) {
  right: 0;
  -webkit-animation: mustache_r 0.45s infinite linear;
  animation: mustache_r 0.45s infinite linear;
}
.cat .main .face .mustache {
  position: absolute;
  top: 0;
  width: 100%;
  border: 1px solid #616161;
  -webkit-transform-origin: 100% 0;
  -ms-transform-origin: 100% 0;
  transform-origin: 100% 0;
  -webkit-transform: rotate(-10deg);
  -ms-transform: rotate(-10deg);
  transform: rotate(-10deg);
}
.cat .main .face .mustache:last-child {
  top: 6px;
  -webkit-transform: rotate(-20deg);
  -ms-transform: rotate(-20deg);
  transform: rotate(-20deg);
}
.cat .main .face .eye {
  position: absolute;
  top: 28px;
  left: -8px;
  width: 30px;
  height: 30px;
  background: #fff;
  border: 3px solid #757575;
  border-radius: 50%;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.cat .main .face .eye:nth-child(5) {
  top: 26px;
  left: 36px;
}
.cat .main .face .eye:after {
  position: absolute;
  content: "";
  width: 10px;
  height: 10px;
  right: 1px;
  top: 4px;
  background: #000;
  border-radius: 50%;
  -webkit-animation: eye 0.45s infinite linear;
  animation: eye 0.45s infinite linear;
}
.cat .main .face .brow_cont,
.cat .main .face .brow_cont {
  position: absolute;
  top: 14px;
  left: 10px;
  width: 10px;
  height: 10px;
}
.cat .main .face .brow_cont:nth-child(7),
.cat .main .face .brow_cont:nth-child(7) {
  -webkit-transform: rotateY(180deg) rotateZ(0);
  -ms-transform: rotateY(180deg) rotateZ(0);
  transform: rotateY(180deg) rotateZ(0);
  left: 38px;
}
.cat .main .face .brow {
  position: absolute;
  top: 20%;
  height: 60%;
  border: 1px solid #616161;
  -webkit-transform-origin: 100% 0;
  -ms-transform-origin: 100% 0;
  transform-origin: 100% 0;
  -webkit-transform: rotate(10deg);
  -ms-transform: rotate(10deg);
  transform: rotate(10deg);
}
.cat .main .face .brow:last-child {
  top: 0;
  height: 100%;
  left: 6px;
  -webkit-transform: rotate(3deg);
  -ms-transform: rotate(3deg);
  transform: rotate(3deg);
}
.cat .main .face .ear_l {
  position: absolute;
  top: -17px;
  width: 20px;
  height: 30px;
  background: currentcolor;
  border-radius: 20px / 55px 55px 0 0;
  -webkit-transform-origin: 50% 100%;
  -ms-transform-origin: 50% 100%;
  transform-origin: 50% 100%;
  overflow: hidden;
  -webkit-transform: rotate(-20deg);
  -ms-transform: rotate(-20deg);
  transform: rotate(-20deg);
  -webkit-animation: ear_l 0.45s infinite linear;
  animation: ear_l 0.45s infinite linear;
}
.cat .main .face .ear_l .inner {
  position: absolute;
  top: 5px;
  left: 50%;
  width: 6px;
  height: 14px;
  margin-left: -4px;
  background: #616161;
  border-radius: 7px / 20px 20px 0 0;
}
.cat .main .face .ear_r {
  position: absolute;
  right: 0;
  margin-top: -22px;
  width: 36px;
  height: 30px;
  -webkit-transform-origin: 50% 100%;
  -ms-transform-origin: 50% 100%;
  transform-origin: 50% 100%;
  overflow: hidden;
  -webkit-transform: rotate(20deg);
  -ms-transform: rotate(20deg);
  transform: rotate(20deg);
  -webkit-animation: ear_r 0.45s infinite linear;
  animation: ear_r 0.45s infinite linear;
}
.cat .main .face .ear_r .outer {
  position: absolute;
  width: 30px;
  height: 200%;
  border: 3px solid #616161;
  border-radius: 20px / 55px 55px 0 0;
}
.cat .main .face .ear_r .inner {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 12px;
  height: 26px;
  margin-left: -6px;
  background: #616161;
  border-radius: 50%;
}
.studip-logo {
  background-image:
    none,
    url(../../plugins_packages/data-quest/MLUMod/assets/images/mlu-siegel-transparent.png);
  margin-top: 3px;
  background-size: 313px 60px;
  width: 313px;
  height: 60px;
}

#barTopFont {
  background-color: var(--color--login-accent);
  color: #000;
}

#barBottomright,
#layout_footer {
  background-color: var(--color--login-accent);
}

#barBottomContainer {
  border-bottom: 1px solid #86b033;
}

#layout_footer > ul > li > a {
  color: #000;
}

#layout_footer > ul > li > a:hover {
  text-decoration: underline;
  color: #000;
}

#barBottomContainer,
body.fixed #barTopMenu {
  background-color: var(--color--login-accent);
  color: #000;
}

body.fixed #barTopMenu li:hover {
  background-color: #92bb41;
}

label[for="barTopMenu-toggle"],
body.fixed #barTopMenu li > a,
body.fixed #barTopMenu li:hover {
  color: #000;
}

body.fixed #barTopMenu img {
  filter: hue-rotate(350deg) saturate(8.7%) brightness(177.3%) !important;
}

body:not(.fixed) #barTopMenu li.active > a img,
body:not(.fixed) #barTopMenu li:hover > a img {
  filter: saturate(0%) brightness(80%) !important;
}

#background-desktop::before {
  content: "Grafik: Jonas Fohry";
  position: fixed;
  right: 0;
  bottom: 0;
  transform-origin: right bottom;
  transform: rotate(270deg) translateX(100%);
  display: block;
  background: rgba(0, 0, 0, 0.5);
  color: white;
  padding: 4px 8px;
  font-size: 12px;
  user-select: none;
}

@media (max-width: 575px) {
  #loginbox::after {
    content: "Grafik: Jonas Fohry";
    position: absolute;
    right: 0;
    bottom: 0;
    transform-origin: right bottom;
    transform: rotate(270deg) translateX(100%);
    z-index: -1;
    display: block;
    background: rgba(0, 0, 0, 0.3);
    font-size: 10px;
    padding: 2px 4px;
    color: white;
    user-select: none;
  }
}

/* Schnee */
#background-desktop.snow:after {
  background:
    url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 500 500"><defs><radialGradient id="myGradient"><stop offset="0%" stop-color="white" stop-opacity="0.7"/><stop offset="30%" stop-color="white" stop-opacity="0.6"/><stop offset="80%" stop-color="white" stop-opacity="0"/></radialGradient></defs><circle id="a" cx="50.2" cy="56.8" r="12.5" fill="url(%23myGradient)" stroke-linejoin="round" stroke-miterlimit="7.5" stroke-width=".4" paint-order="stroke fill markers"/><use xlink:href="%23a" transform="translate(131 25)"/><use xlink:href="%23a" transform="translate(260 118)"/><use xlink:href="%23a" transform="translate(368 222)"/><use xlink:href="%23a" transform="translate(270 370)"/><use xlink:href="%23a" transform="translate(393 337)"/><use xlink:href="%23a" transform="translate(182 255)"/><use xlink:href="%23a" transform="translate(118 370)"/><use xlink:href="%23a" transform="translate(-21 407)"/><use xlink:href="%23a" transform="translate(355 25)"/><use xlink:href="%23a" transform="translate(25 267)"/><use xlink:href="%23a" transform="translate(62 144)"/></svg>')
      center center repeat scroll,
    url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 500 500"><defs><radialGradient id="myGradient2"><stop offset="0%" stop-color="white" stop-opacity="0.5"/><stop offset="30%" stop-color="white" stop-opacity="0.6"/><stop offset="80%" stop-color="white" stop-opacity="0"/></radialGradient></defs><circle id="a" cx="132" cy="43.6" r="10" fill="url(%23myGradient2)" stroke-linejoin="round" stroke-miterlimit="7.5" stroke-width="3.1" paint-order="stroke fill markers"/><use xlink:href="%23a" transform="translate(43 79)"/><use xlink:href="%23a" transform="translate(175 219)"/><use xlink:href="%23a" transform="translate(133 116)"/><use xlink:href="%23a" transform="translate(117 14)"/><use xlink:href="%23a" transform="translate(282 174)"/><use xlink:href="%23a" transform="translate(256 288)"/><use xlink:href="%23a" transform="translate(326 406)"/><use xlink:href="%23a" transform="translate(143 331)"/><use xlink:href="%23a" transform="translate(53 198)"/><use xlink:href="%23a" transform="translate(23 311)"/><use xlink:href="%23a" transform="translate(-90 380)"/><use xlink:href="%23a" transform="translate(185 426)"/><use xlink:href="%23a" transform="translate(33 396)"/><use xlink:href="%23a" transform="translate(-69 208)"/><use xlink:href="%23a" transform="translate(-69 299)"/><use xlink:href="%23a" transform="translate(316 -9)"/><use xlink:href="%23a" transform="translate(262 50)"/><use xlink:href="%23a" transform="translate(-79 79)"/></svg>')
      right top repeat fixed;
  height: 100%;
  position: relative;
  background-size: 350px auto;
  animation: snowing 20s linear infinite;
  display: block;
  content: "";
}

@keyframes snowing {
  0% {
    background-position-y: 0px, 0px;
  }
  100% {
    background-position-y: calc(350px * 2), 350px;
  }
}