:root {
  --primary-accent: #467b5b;
  --background-dm: #121212;
  --appbar-background-dm: #1f1f1f;
  --grey-lm: #e3e3e3;
  --grey-dm: #1c1c1c;
}

.heading {
  background: -webkit-linear-gradient(326deg, #09c6f9 -20%, #045de9 120%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.heading-primary {
  background: -webkit-linear-gradient(326deg, #0c8641 -10%, #12d567 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

::selection {
  background-color: pink;
}

.underline {
  text-decoration: underline;
}

.heading-grey {
  background-color: #424242;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  font-family: 'Barlow, Roboto';
}

.no-select {
  user-select: none;
}

.mud-navmenu {
  height: 100%;
}

.mud-navmenu .sticky-button {
  position: absolute;
  bottom: 6px;
  max-width: 244px;
}

.bg-image-login {
    height: 100vh;
    background: url(/images/login/RolfConnectTeacherOptimized.jpg) no-repeat center center fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}

.bg-image-login.img1 {
    height: 100vh;
    background: url(/images/login/RolfConnectTeacherOptimized.jpg) no-repeat center center fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}

.bg-image-login.img2 {
    height: 100vh;
    background: url(/images/login/ShowroomOchten.jpg) no-repeat center center fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}

.bg-image-login.img3 {
    height: 100vh;
    background: url(/images/login/RolfConnectTeachersOptimized.jpg) no-repeat center center fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}

.bg-image-login.img4 {
    height: 100vh;
    background: url(/images/login/RolfConnectTeacherOptimized.jpg) no-repeat center center fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}

.bg-dark-login {
  height: 100vh;
  background: none;
  background-color: var(--background-dm);
}

kbd {
  -moz-border-radius: 3px;
  -moz-box-shadow: 0 1px 0 rgba(0, 0, 0, 0.2), 0 0 0 2px #fff inset;
  -webkit-border-radius: 3px;
  -webkit-box-shadow: 0 1px 0 rgba(0, 0, 0, 0.2), 0 0 0 2px #fff inset;
  background-color: #f7f7f7;
  border: 1px solid #ccc;
  border-radius: 3px;
  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.2), 0 0 0 2px #fff inset;
  color: #333;
  display: inline-block;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 11px;
  line-height: 1.4;
  margin: 0 0.1em;
  padding: 0.32em 0.7em;
  text-shadow: 0 1px 0 #fff;
}

.appbar {
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;
  opacity: 0.99;
  background: -webkit-linear-gradient(326deg, rgba(11, 171, 100, 0.9) -20%, rgba(59, 183, 143, 0.9) 120%);
  backdrop-filter: blur(0.333rem);
  -webkit-backdrop-filter: blur(0.333rem);
}

.appbar-dark {
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;
  background-color: rgba(30, 30, 30, 0.85);
  backdrop-filter: blur(0.333rem);
  -webkit-backdrop-filter: blur(0.333rem);
}

.appbar.pride {
  background: linear-gradient(
    to bottom,
    #e40303,
    #e40303 16.67%,
    #ff8c00 16.67%,
    #ff8c00 33.33%,
    #ffed00 33.33%,
    #ffed00 50%,
    #008026 50%,
    #008026 66.67%,
    #004dff 66.67%,
    #004dff 83.33%,
    #750787 83.33%,
    #750787
  );
  background-blend-mode: darken;
  background-color: rgba(116, 116, 116, 0.65);
}

.card-decoration {
  border-radius: 0.8rem;
  border-top: 5px solid var(--primary-accent);
}

.light .card-decoration.skeleton {
  border-top: 5px solid var(--grey-lm);
}

.dark .card-decoration.skeleton {
  border-top: 5px solid var(--grey-dm);
}

.dark button {
  color: var(--grey-lm);
}