@charset "UTF-8";


@viewport
{
  width: device-width;
}


@font-face
{
  font-family: 'Ubuntu';
  src: url('../fonts/Ubuntu-L.ttf') format('truetype');
  font-style: normal;
}

@font-face
{
  font-family: 'Ubuntu';
  src: url('../fonts/Ubuntu-LI.ttf') format('truetype');
  font-style: italic;
}

@font-face
{
  font-family: 'Ubuntu';
  src: url('../fonts/Ubuntu-B.ttf') format('truetype');
  font-style: oblique;
}

:root
{
  --myColorA: rgb(80, 40, 0);
  --myColorB: rgb(240, 200, 175);
  --myHighlight: rgb(150, 200, 40);
  --myTransparent: rgb(0, 0, 0, 0.0);

  --myForegroundAlpha: rgba(80, 40, 0, 0.95);
  --myBackgroundAlpha: rgba(240, 200, 175, 0.95);
  --myHighlightAlpha: rgb(150, 200, 40, 0.5);

  --myBlack: #000000;
  --myBlue: #007cbaff;
  --myBrown: #502500;
  --myDarkBlue: #002255;
  --myGold: #ffcc00ff;
  --myGreen: #7b9b30;
  --myGrey: #f5f5f5ff;
  --myDarkGrey: #323232bf;
  --myOrange: #fe7920ff;
  --myRed: #ff0000ff;
  --myWhite: #fffff0ff;

  --mediaXS: 479px;
  --mediaS: 767px;
  --mediaM: 979px;
  --mediaL: 1023px;
  --mediaXL: 1199px;

  --minWidth: 10%;
  --maxWidth: 90%;
  --margin: 10%;
}

*,
h1,
h2,
h3,
h4,
h5,
h6
{
  font-family: 'Ubuntu', Arial, Helvetica, sans-serif;
}

body
{
  color: var(--myColorB);
  /* background: var(--myColorA); */
  background: linear-gradient(0deg, var(--myForegroundAlpha), var(--myTransparent) 61.8%),
            linear-gradient(120deg, var(--myBackgroundAlpha), var(--myTransparent) 61.8%),
            linear-gradient(240deg, var(--myHighlightAlpha), var(--myTransparent) 61.8%);
}
/*
body.site
{
  background-image: url("/images/logos/logo.png");
  background-size: 10%;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-position: center bottom;
  position: relative;
}

body.site::before
{
  content: "";

  background-image: url("/images/logos/logo.png");
  background-size: 50%;
  background-color: var(--myBlack);

  background-repeat: no-repeat;
  background-attachment: fixed;
  background-position: center center;

  position: absolute;
  top: 0px;
  right: 0px;
  bottom: 0px;
  left: 0px;
  z-index: -1;

  opacity: 0.75;
}
*/
.item-page,
.item-content
{
  border-radius: 5px;
  color: var(--myColorA);
  background: var(--myColorB);
  padding: 5px 5px 0;
}

img
{
  border: solid 0px var(--myColorA);
  border-radius: 5px;
  margin: 10px 0;
}

/* .blog-item .item-image
{
  text-align: center;
} */

/* .item-image img
{
  border: solid 0px var(--myColorA);
  border-radius: 5px;
  margin: 2%;
  width: auto;
  max-width: 96%;
  height: 100px;
} */

/* div.mod-banners__item
{
  text-align: center;
} */

main,
.item-content
{
  padding: 0 5px 0;
}

div.blog-item
{
  width: 100%;
}

main p a,
main td a
{
  font-weight: bold;
  text-decoration: none;
  text-shadow: none;
  list-style: none;
  padding: 2px 5px;
  margin: 0;
  border: solid 2px var(--myRed);
  border-radius: 3px;
  color: var(--myWhite);
  background: var(--myHighlight);
}

main p a:hover,
main td a:hover
{
  font-weight: bold;
  text-decoration: none;
  text-shadow: none;
  list-style: none;
  padding: 2px 5px;
  margin: 0;
  border: solid 2px var(--myRed);
  border-radius: 3px;
  color: var(--myHighlight);
  background: var(--myWhite);
}

ul
{
  list-style: circle;
}

#system-message-container
{
  color: var(--myRed);
}

.container-header,
.container-footer
{
  background-color: var(--myColorA);
  background-image: none;
}

.breadcrumb li
{
  padding: 5px 0;
}

.navbar-collapse
{
  font-size: larger;
  font-weight: bold;
}

.navbar-collapse a
{
  text-decoration: none;
  padding: 0px;
}

.container-nav
{
  /**/
  border: solid 1px var(--myColorA);
  border-radius: 5px;
  color: var(--myForegroundAlpha);
  background: var(--myHighlightAlpha);

}

.navbar-toggler
{
  color: var(--myRed);
  background: var(--myHighlightAlpha);
}

.metismenu-item .active > a,
.mod-menu .nav-item.active > a,
.metismenu-item.default > a,
.metismenu-item.default > a:hover,
.metismenu-item > a:hover,
.mod-menu .nav-item > a:hover
{
  text-decoration: none;
}

.metismenu-item,
.nav-item,
.metismenu-item > a,
.nav-item > a,
.metismenu-item.active > a,
.nav-item.active > a
{
  font-weight: normal;
  color: var(--myColorB);
}

li.metismenu-item,
li.nav-item
{
  display: block;
  padding: 5px;
}

li.metismenu-item:hover,
li.nav-item:hover
{
  border: solid 1px var(--myColorA);
  border-radius: 5px;
  color: var(--myForegroundAlpha);
  background: var(--myBackgroundAlpha);
}

li.metismenu-item.current,
li.nav-item.current
{
  border: solid 2px var(--myRed);
  border-radius: 5px;
  color: var(--myForegroundAlpha);
  background: var(--myBackgroundAlpha);
}

li.metismenu-item:hover,
li.nav-item:hover,
li.metismenu-item > a:hover,
li.nav-item:hover > a:hover
{
  font-weight: bold;
}

li.metismenu-item.current > a,
li.nav-item.current > a
{
  font-weight: bold;
  color: var(--myForegroundAlpha);
}


/* <!-- ColorA AUF ColorB --> */
#event,
.eventgallery-tile,
.page-header [itemprop="headline"],
.page-header h1,
h3.page-header,
.com-content-categories,
div.com-content-categories__item,
.unclickable,
.clickable,
/* .card, */
.search,
.clickable span:hover,
.clickable li:hover,
.subheading-category,
[itemprop="articleBody"],
[itemprop="blogPost"] h2:hover,
[itemprop="blogPost"],
.jd-item-page,
ul.category-module.mod-list,
ol.nav.nav-tabs.nav-stacked,
ul.mod-articlescategory li,
ol.com-content-blog__links,
ol.com-content-blog__links li,
.moduletable,
div.moduletableX,
.moduletable li:hover,
.customXXXXX h3,
.breadcrumb,
.breadcrumb .pathway:hover,
.breadcrumb .active [itemprop="name"],
.breadcrumb [itemprop="name"] .span:hover,
.btn:hover,
.refresh_input_button:hover,
li.previous a:hover,
li.next a:hover,
.readmore a:hover
{
  text-decoration: none;
  text-shadow: none;
  list-style: none;
  padding: 5px;
  margin: 10px 0;
  border: solid 1px var(--myColorA);
  border-radius: 5px;
  color: var(--myColorA);
  background: var(--myColorB);
}

/* <!-- ColorB AUF ColorA --> */
#sidebar-left li,
XXXXXa.mod-articles-category-title ,
ul.mod-articlescategory li:hover,
ol.com-content-blog__links li:hover,
.moduletable li,
.page-header h2,
h3.page-header:hover,
div.com-content-categories__item:hover,
div.com-content-categories__item:hover a,
.clickable span,
.btn,
.refresh_input_button,
.previous a,
.next a,
.breadcrumb .pathway,
.readmore a
{
  text-decoration: none;
  font-weight: bold;
  text-shadow: none;
  list-style: none;
  padding: 5px;
  margin: 10px 0;
  border: solid 1px var(--myColorA);
  border-radius: 5px;
  color: var(--myColorB);
  background: var(--myColorA);
}

div.mod-articles-category-group ul li:hover a.mod-articles-category-title
{
  color: var(--myColorA);
  background: var(--myRed);
}

div.mod-articles-category-group ul li a.mod-articles-category-title
{
  color: var(--myRed);
  background: var(--myColorB);
}

.float-end a
{
  text-decoration: none;
  font-weight: bold;
  text-shadow: none;
  list-style: none;
  padding: 5px;
  margin: 10px 0;
  border: solid 2px var(--myRed);
  border-radius: 5px;
  color: var(--myWhite);
  background: var(--myHighlightAlpha);
}

.float-end a:hover
{
  text-decoration: none;
  font-weight: bold;
  text-shadow: none;
  list-style: none;
  padding: 5px;
  margin: 10px 0;
  border: solid 2px var(--myRed);
  border-radius: 5px;
  color: var(--myRed);
  background: var(--myWhite);
}

.page-header h2 a,
h3.page-header:hover,
h3.page-header:hover a,
.clickable li a,
.clickable span a,
.moduletable li a,
ul.mod-articlescategory li:hover a,
ol.com-content-blog__links li:hover a,
.breadcrumb a:hover
{
  padding: 0;
  text-decoration: none;
  font-weight: normal;
  list-style: none;
  color: var(--myColorB);
}

.page-header h2:hover,
.page-header h2:hover a,
h3.page-header,
h3.page-header a,
div.com-content-categories__item a,
.clickable a:hover,
.clickable li:hover a,
.clickable span:hover a,
ul.mod-articlescategory li a,
ol.com-content-blog__links li a,
.cat-children > h3 a,
.moduletable li:hover a,
.footer
{
  padding: 0;
  text-decoration: none;
  font-weight: bold;
  list-style: disc;
  color: var(--myColorA);
}

.clickable li
{
  text-decoration: none;
  font-weight: bold;
  text-shadow: none;
  list-style: none;
  padding: 5px;
  margin: 0 0 5px 0;
  border: solid 1px var(--myColorA);
  border-radius: 5px;
  color: var(--myColorB);
  background: var(--myColorA);
}

li.unclickable,
li.unclickable:hover
{
  text-decoration: none;
  font-weight: normal;
  text-shadow: none;
  list-style: none;
  border: solid 1px var(--myColorA);
  border-radius: 5px;
  color: var(--myColorA);
  background: var(--myColorB);
}

/* div.mod-articles-category-group
{
  text-decoration: none;
  font-weight: bold;
  text-shadow: none;
  list-style: none;
  padding: 5px;
  margin: 0 0 5px 0;
  border: solid 1px var(--myHighlight);
  border-radius: 5px;
  color: var(--myBlack);
  background: var(--myGold);
} */

.card-header
{
  text-align: center;
}

.footer
{
  color: var(--myColorB);
}

.bottom-a.card,
.bottom-a.card > .card-body
{
  border: none;
}

nav.mod-breadcrumbs__wrapper .card,
nav.mod-breadcrumbs__wrapper ol
{
  border: solid 0px var(--myRed);
  background: var(--myTransparent); /* alpha: 0.0 */
}

.container-header .navbar-brand img
{
  width: 100vw;
}

div.mod-languages ul li.lang-active
{
  background-color: var(--myColorA);
}

li.webadmin
{
  text-decoration: none;
  font-weight: bold;
  text-shadow: none;
  list-style: none;
  padding: 5px;
  margin: 10px 0;
  border: solid 1px var(--myHighlight);
  border-radius: 5px;
  color: var(--myWhite);
  background: var(--myHighlight);
}

li.frontend
{
  text-decoration: none;
  font-weight: bold;
  text-shadow: none;
  list-style: none;
  padding: 5px;
  margin: 10px 0;
  border: solid 1px var(--myColorA);
  border-radius: 5px;
  color: var(--myWhite);
  background: var(--myColorA);
}

li.backend
{
  text-decoration: none;
  font-weight: bold;
  text-shadow: none;
  list-style: none;
  padding: 5px;
  margin: 10px 0;
  border: solid 1px var(--myColorA);
  border-radius: 5px;
  color: var(--myBlack);
  background: var(--myColorA);
}

/* .card-header,
.card-body
{
  padding: none;
  border: solid 1px var(--myGrey);
  border-radius: 5px;
  background: var(--myGrey); 
} */

.card,
.transparent
{
  padding: none;
  border: none;
  background-color: var(--myColorB);
}

/* MOBILE */
@media only screen and (max-width: 767px)
{
  body.wrapper-fluid .site-grid
  {
    grid-gap: 0;
    margin: 0;
  }
}
