:root{
  --cassiopeia-color-header: #eeeeee;
  --cassiopeia-color-primary: #126A38;
  --cassiopeia-color-link: #126A38;
  --cassiopeia-color-hover: #333;
  --hp-color-link: #dedede;
}

a:not([class]) {
  text-decoration: none;
}

.header{
  border-bottom: 1px solid var(--hp-color-link) !important;
}

.container-header {
    position: relative;
    z-index: 10;
    margin-bottom: 20px;
    background-color: var(--cassiopeia-color-header);
    background-image: none;
    box-shadow: 0 5px 5px rgba(0, 0, 0, 0.03) inset;
}
.container-header .mod-list li a{
  color: #dedede;
  color:#0e4f24;
  font-weight: thin;
  font-size: 1.2rem;
}
.container-header .mod-list li a:hover{
  color: #fff;
}

.footer {
    margin-top: 1em;
    border-top: 1px solid black !important;
    color: white;
    background-image: none;
}


body{
  background-color: #eeeeee;
}

/* body {
  background-color: #eeeeee;
  background-image: url('/images/herbapack_fokus_bw.jpg');
  background-position: center;
  background-size: cover;
}*/

.container-header .navbar-toggler {
    color: #000;
    cursor: pointer;
    border: 1px solid #fff;
}
.navbar-toggler:hover {
    text-decoration: none;
}

.navbar-brand {
  padding-top: .3125rem;
  padding-bottom: .3125rem;
  margin-right: 1rem;
  font-size: .25rem;
  text-decoration: none;
  white-space: nowrap;
}

.metismenu.mod-menu .mm-toggler::after{
  color: var(--hp-color-link);
}

.breadcrumb{
  font-size: smaller;
  background: none;
}

a.pathway {
  text-decoration: none;
  color: #333;
}

a:hover.pathway{
  color: #000;
}

.metismenu.mod-menu .mm-collapse > li > a{
  color: var(--cassiopeia-color-primary);
}

.back-to-top-link:focus, .back-to-top-link:hover {
  color: var(--white,#fff);
  background-color: var(--cassiopeia-color-primary);
  border-color: var(--white,#fff);
}

.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
  font-family: var(--cassiopeia-font-family-headings,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol",);
  font-weight: var(--cassiopeia-font-weight-headings,700);
  color: var(--cassiopeia-color-primary);
}

.card-image{
  width: 10em;
  min-height: 6em;
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat;
}

div.mod-languages ul li.lang-active {
  background-color: #0e4f24 !important;
}
.card {
  border: #ddd 1px solid;
}
.cookie-alert{
  font-size: smaller !important;
  color: #333 !important;
}

.metismenu.mod-menu .metismenu-item > a, .metismenu.mod-menu .metismenu-item > button, .metismenu.mod-menu .metismenu-item > span {
  overflow: hidden;
  text-decoration: none;
  text-overflow: ellipsis;
  white-space: nowrap;
  text-transform: uppercase;
}

.breadcrumb, h1{
  text-transform: uppercase;
}

.container-below-top, .container-topbar {
  color: #333 !important;
}
.mark, mark {
  padding: .2em;
  background-color: var(--cassiopeia-color-primary);
  color:white;
}

.container-header .mod-menu > li.active::after, .container-header .mod-menu > li:hover::after {
  right: 2px;
  left: 0;
  background: #0e4f24;
}

.container-header .metismenu > li.active > a::after, .container-header .metismenu > li.active > button::before, .container-header .metismenu > li > a:hover::after, .container-header .metismenu > li > button:hover::before {
  right: 0;
  left: 0;
  background: var(--cassiopeia-color-link);
}

.container-header .metismenu > li > a:hover{
  color: var(--cassiopeia-color-link);
}

.first-eye {
  background: url(/images/green-tea_.jpg);
  padding: 7em 2em;
  background-size: cover;
  vertical-align: middle;
  display: inline-block;
  text-align: center;
}
.first-eye h1 {
  color: white;
  text-shadow: 0 2px #222;
}

.first-eye h3{
  padding: 2em 0 0 0;
  color: white;
  text-shadow: 0 1px #222;
  font-weight: bold;
}
.