/*header*/
.main-header{
  background: #be1622; 
  background: url(welcome_banner_bg.jpg);
  /*filter: brightness(1.2);*/
  box-shadow: 10px 10px 15px silver;
  color: #fff;
  padding: 10px 0;
  margin-bottom: 20px;
  background-size: cover;
  background-position-y: center;
  position: relative;
}
/*
.welcome-banner-text {
    font-size: 14px;
    line-height: 150%;
    max-width: 880px;
    padding: 20px 0;
}
*/
.welcome-banner-text h2 {
    font-size: 50px;
}
/*
.path-frontpage h2 {
    font-size: 25px;
}
*/
.maintenance-page {
    background: url(maintenance-bg.svg) #c0c9c3 center no-repeat;
    text-align: center;
    padding-top: 210px;
    padding-bottom: 100px;
    color: #000;
}

.maintenance-msg {
  margin: 30px 0;
  background: none;
  padding: 20px 30px;
  display: grid;
  color: #404040;
  border: none;
  box-shadow: none;
  font-size: 14px;
}
.maintenance-msg h1 {
  margin-top: 12em;
}

/*login*/
.openid-connect-login-form{
margin: 40px auto;
max-width: 650px;
padding: 10px 30px;
 }

.breadcrumb{
	border-bottom: 0.2px solid #dfdfdf;
	border-radius: 0px;
	background: none;}
 
/*EU-Cookie*/
 div#sliding-popup .eu-cookie-withdraw-banner, .eu-cookie-withdraw-tab, 
 div#sliding-popup.sliding-popup-bottom {
  background: rgba(0, 0, 0, .85) !important;
}
 
 button.agree-button.eu-cookie-compliance-secondary-button {
  cursor: pointer;
  border: none;
  background-color: #19c2c8 !important;
  margin-right: 5px;
  margin-top: 1em;
  vertical-align: middle;
  overflow: visible;
  width: auto;
  -moz-border-radius: 6px;
  -webkit-border-radius: 6px;
  border-radius: 6px;
  border: 1px solid #000;
  color: #fff;
  font-family: Arial,sans-serif;
  font-weight: bold;
  padding: 4px 8px;
  text-decoration: none;
}

/*account*/
nav#block-useraccountmenu a{color: #fff;}
nav#block-useraccountmenu-menu.contextual-region a{color: #fff;}
h2#block-useraccountmenu-menu{color: #fff; font-size: 20px; position: relative; left: 2em;}
#block-useraccountmenu:before{
    background-image: url(iconmonstr-user-29.svg);
	position: absolute;
    top: -0.2em;
    left: -0.5em;
    display: block;
    width: 30px;
    height: 100%;
    content: "";
   background-color: transparent;
    background-repeat: no-repeat;
    background-attachment: scroll;
    background-position: top;
    background-size: 100% auto;
	transition: all 0.3s ease-in-out 0s;
	filter:invert(100%) sepia(0%) saturate(800%) hue-rotate(10deg) opacity(30%)
}
/*Footermenu*/
.footer-menu {
    margin: 0;
    border: 0;
    background: #fff;
    color: #fff;
}
nav#block-biota-theme-account-menu a, nav#block-projekt-menu a, nav#block-projekt a, 
nav#block-linkspartner a, nav#block-hilfeservice a {color: #23527c;}
h2#block-biota-theme-account-menu-menu, h2#block-projekt-menu,
h2#block-linkspartner-menu, h2#block-hilfeservice-menu {
	color: #23527c;
	font-size:20px;
	}
#block-biota-theme-account-menu:before {
    background-image: url(iconmonstr-user-29.svg);
	position: absolute;
	top: 0em !important;
    left: 0.2em;
    display: block;
    width: 24px;
    height: 100%;
    content: "";
   background-color: transparent;
    background-repeat: no-repeat;
    background-attachment: scroll;
    background-position: top;
    background-size: 100% auto;
	transition: all 0.3s ease-in-out 0s;
	filter:invert(10%) sepia(0%) saturate(800%) hue-rotate(10deg) opacity(30%)
}
#block-projekt:before {
    background-image: url(iconmonstr-globe-5.svg);
	position: absolute;
    left: 0.2em;
    display: block;
    width: 24px;
    height: 100%;
    content: "";
   background-color: transparent;
    background-repeat: no-repeat;
    background-attachment: scroll;
    background-position: top;
    background-size: 100% auto;
	transition: all 0.3s ease-in-out 0s;
	filter:invert(10%) sepia(0%) saturate(800%) hue-rotate(10deg) opacity(30%)
}
#block-linkspartner:before {
    background-image: url(iconmonstr-link-2.svg);
	position: absolute;
    left: 0.2em;
    display: block;
    width: 24px;
    height: 100%;
    content: "";
   background-color: transparent;
    background-repeat: no-repeat;
    background-attachment: scroll;
    background-position: top;
    background-size: 100% auto;
	transition: all 0.3s ease-in-out 0s;
	filter:invert(10%) sepia(0%) saturate(800%) hue-rotate(10deg) opacity(30%)
}
#block-hilfeservice:before {
    background-image: url(iconmonstr-help-3.svg);
	position: absolute;
    left: 0.2em;
    display: block;
    width: 24px;
    height: 100%;
    content: "";
   background-color: transparent;
    background-repeat: no-repeat;
    background-attachment: scroll;
    background-position: top;
    background-size: 100% auto;
	transition: all 0.3s ease-in-out 0s;
	filter:invert(10%) sepia(0%) saturate(800%) hue-rotate(10deg) opacity(30%)
}
h2#block-projekt-menu, h2#block-linkspartner-menu, h2#block-hilfeservice-menu{padding-inline-start: 40px; font-size: 20px;}
a.link-white{color: #fff;}

/*custom menus*/
nav#block-limnischerotundbraunalgen-3 ul.menu, nav#block-limnischekieselalgen ul.menu, 
nav#block-armleuchteralgen-2 ul.menu, nav#block-schlauchalgen-2 ul.menu,
nav#block-dinoflagellaten-2 ul.menu, nav#block-zieralgen-2 ul.menu, nav#block-marinemakroalgen ul.menu {
    width: 90%;
    overflow: hidden;
    margin: 1rem 0 0 0;
    padding: 0 0 0 0;
    list-style-type: none;
    font-size: 1.5rem;
    background-color: rgb(248 248 248);
}
nav#block-limnischerotundbraunalgen-3 li.menu-item, nav#block-limnischekieselalgen li.menu-item, 
nav#block-armleuchteralgen-2 li.menu-item, nav#block-schlauchalgen-2 li.menu-item,
nav#block-dinoflagellaten-2 li.menu-item, nav#block-zieralgen-2 li.menu-item, nav#block-marinemakroalgen li.menu-item {
    float: left;
    width: 100%;
    margin: 0;
    padding: 0;
    border-bottom: 1px solid rgb(255 255 255);
}
nav#block-limnischerotundbraunalgen-3 a, nav#block-limnischekieselalgen a, 
nav#block-armleuchteralgen-2 a, nav#block-schlauchalgen-2 a,
nav#block-dinoflagellaten-2 a, nav#block-zieralgen-2 a, nav#block-marinemakroalgen a {
    display: block;
    padding: 5px 0 5px 10px;
    text-decoration: none;
	background-color: #ebebeb;
    color: #4d614f;
}
nav#block-limnischerotundbraunalgen-3 a.active, nav#block-limnischekieselalgen a.active,
nav#block-armleuchteralgen-2 a.active, nav#block-schlauchalgen-2 a.active,
nav#block-dinoflagellaten-2 a.active, nav#block-zieralgen-2 a.active, nav#block-marinemakroalgen a.active {
    background-color: #eaeaea;
}
.group_last_parent{background-color: #173c45 !important; color: #fff !important;}

/*custom widgets*/
.path-frontpage .third-footerwidget {
    background: #C0C9C3;
    color: #2c3434;
    padding: 20px 0;
    font-size: 1.05em;
    min-height: 350px;
}
.third-footerwidget {
    background: #C0C9C3;
    color: #2c3434;
    padding: 40px 0;
    font-size: 1.05em;
}
.path-frontpage .third-highlight, .third-footer, .path-frontpage .fourth-highlight{
    padding: 60px 0;
}
.fourth-highlight{
	margin-bottom: 5px;
}
.footerwidget {
    background: #173c45;
	padding: 60px 0;
}
.second-footer{
	background: #eee;
	color: #173c45;
}
.third-footer{
	background: #eee;
	color: #173c45;
}
.copyright {
    background: #536555;
    color: #dfdfdf;
}
.copyright a {color: #2fab58;
}
.copyright {
    background: #173c45;
}
.credit-link{
    text-align: center;
}
.indicia-link{
    text-align: right;
}

table.views-table-anwender{width: 100%;}
.views-table-anwender table{width: 100%;}
views-fachliche-betreuung table{width: 100%; margin-left: 15px !important;}
table.cols-4.sticky-enabled {margin-left: 15px !important; width: 100%}
table.cols-3.sticky-enabled.sticky-table{margin-left: 15px !important; width: 100%}

/* ticket-view */
.views-table-ticket table {
	margin-left: 15px !important; 
	width: 100%;
}
.views-table-ticket thead{
	border: 1px solid #dddddd;
    background: #e9e9e9;
    color: #333333;
    font-weight: bold;
	height: 5rem;
}
.views-table-ticket tr{
    border-bottom: 0.0625rem solid lightgray;
}
.views-table-ticket td {
    box-sizing: border-box;
    height: 4rem;
    padding: 5px;
    text-align: left;
}
div.In.Bearbeitung{
	background: #336699;
	color: white;
	font-weight: 600;
    border-radius: 7px;
	}
div.Neu\,.unbearbeitet{
	background: red;
	color: white;
	font-weight: 600;
    border-radius: 7px;
}
div.Abgeschlossen{
	background: #35ab37;
	color: white;
    font-weight: 600;
    border-radius: 7px;
}
div.Verworfen{
	background: #000;
	color: #fff;
	text-decoration: line-through;
    font-weight: 600;
    border-radius: 7px;
}
div.Wiedervorlage{
	background: #e33838;
	color: white;
	font-weight: 600;
    border-radius: 7px;
}
#edit-comment-body-wrapper div.js-filter-wrapper.js-form-wrapper.form-wrapper { display: none; }

views-fachliche-betreuung table{width: 100%; margin-left: 15px !important;}
table.cols-4.sticky-enabled {margin-left: 15px !important; width: 100%}
table.cols-3.sticky-enabled.sticky-table{margin-left: 15px !important; width: 100%}


/* counter */
.counter-12 {
	padding:8%; 
	max-width:200px; 
	max-height:200px; 
	border-radius:50%;
}
.counter-22 {
	padding:8%; 
	max-width:200px; 
	max-height:200px; 
	border-radius:50%;
	border: 4px solid #eeeeee54;
}

.counter-12 img {
    transform: rotate(12deg)!important;
    filter: hue-rotate(25deg) brightness(80%);
}
.counter-22 img {
    transform: rotate(22deg)!important;
    filter: hue-rotate(25deg) brightness(80%);
}
h1.counter-text{font-weight:800; color:#b5b6b5;}
div.counter-text{height: 80px;
}
div#totals{display: flex;
}
div.occurrences {
    font-size: large;
	font-weight: 700;
    text-align: center;
	background-image: url("../inline-images/pik_zieralge.svg")!important; 
	background-repeat: no-repeat !important; 
	background-position: center  !important;
	background-size: 30%;
	background: none;
    color: #1f4517;
    margin: 2%;
	padding-top:  calc(200px - 2%);
	min-width: 30%;
	max-width:200px; 
	max-height:200px; 
}

div.species {
    font-size: large;
	font-weight: 700;
    text-align: center;
	background-image: url("../inline-images/pik_kieselalge.svg")!important; 
	background-repeat: no-repeat !important; 
	background-position: center  !important;
	background-size: 30%;
	background: none;
    color: #1f4517;
    margin: 2%;
	padding-top:  calc(200px - 2%);
	min-width: 30%;
	max-width:200px; 
	max-height:200px; 
}

div.photos {
    font-size: large;
	font-weight: 700;
    text-align: center;
	background-image: url("../inline-images/pik_schlauchalge.svg")!important; 
	background-repeat: no-repeat !important; 
	background-position: center  !important;
	background-size: 30%;
	background: none;
    color: #1f4517;
    margin: 2%;
	padding-top: calc(200px - 2%);
	min-width: 30%;
	max-width:200px; 
	max-height:200px; 
}

div.card-view{max-width: 100%;
    background-color: #fff;
    height: 100%;
    max-height: 500px;
    box-shadow: 0 1px 4px 0 rgba(12, 12, 13, 0.1);
margin-bottom: 10px;
}
.image-box-outer{
	float:right;
	width:50%;
}
figure.image-box-shadow.align-right{
	display: block;
	margin: 0.5em;
}
.image-box-shadow img{
	box-shadow:10px 10px 15px silver;
}
.image-box-shadow figcaption{
	font-size: .75em;
	font-weight: bold;
    overflow-wrap: break-word;
    word-wrap: break-word;
	max-width: 450px;
}
div.img-wrapper{ width: 100%;
    height: 100%;
    max-height: 250px;
    margin-bottom: 20px;
    overflow: hidden;
}
picture{object-fit: cover;
}
img.picture{max-height 250px;
}

div.details{min-height: 200px;
    max-height: 250px;
    padding: 10px;
}

div.olControlZoom {
    position: absolute;
    top: 70px !important;
    left: 8px !important;
    background: rgba(255,255,255,0.4);
    border-radius: 4px;
    padding: 2px;
}
.olControlLayerSwitcher .layersDiv {
    background-color: #808080 !important;
    background-color: rgba(55,55,55,0.7) !important;
}
.olControlScale {
    bottom: 1.5em !important;
    position: absolute;
}
.olControlScaleLine {
   position: absolute;
   bottom: 1px !important;
}
.olControlScaleLineBottom {
   visibility: hidden !important;
}
.olControlScaleLineTop {
   border: solid 2px #575757;
   border-top: none;
   text-align: center;
   height: 17px;
   background-color: rgba(255, 255, 255, 0.6) !important;
}
button#taxon_designation_list\:add.indicia-button.btn.btn-default, #taxa_taxon_list_list\:add.indicia-button.btn.btn-default,
   #taxon_group_list\:add.indicia-button.btn.btn-default, button#location_list\:add.indicia-button.btn.btn-default{
	color: #000;
}

/*colors*/
.greenblue{color: #078D92;}
.lightgreen{color: #f3faef;}
.blue{color: #23527c;}
.black{color: #000;}
h1.blue{color: #23527c; font-size: 2.5em;}
h1.darkblue{color: #173c45; font-size: 2.5em;}
.hundertzehn{font-size: 110%;}
p.hundertzehn{font-size: 110%;}
.einsdrei{font-size: 1.3rem;}
.einsfuenf{font-size: 1.5rem;}
.einssieben{font-size: 1.7rem;}

div#ui-datepicker-div{z-index:9004!important;}

/*jcarousel*/

.jcarousel-wrapper.jcarousel-skin-tango {
    margin: 20px auto;
    position: relative;
    width: 903px;
    max-width: 95%;
    height: 120px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    -webkit-box-shadow: 0 0 2px #999;
    -moz-box-shadow: 0 0 2px #999;
    box-shadow: 0 0 2px #999;
}

.jcarousel-skin-tango .jcarousel-control-prev, .jcarousel-skin-tango .jcarousel-control-next {
    position: absolute;
    top: 0;
    width: 30px;
    height: 100%;
    text-align: center;
    background: #000;
    color: #fff;
    text-decoration: none;
    text-shadow: 0 0 1px #000;
    font: 24px/27px Arial,sans-serif;
    -moz-border-radius: 30px;
    -webkit-box-shadow: 0 0 2px #999;
    -moz-box-shadow: 0 0 2px #999;
    box-shadow: 0 0 2px #999;
    opacity: 0.4;
}

.jcarousel-skin-tango .jcarousel-control-prev:after {
    content: '\2039';
    line-height: 110px;
}

.jcarousel-skin-tango .jcarousel-control-next:after {
    content: '\203A';
    line-height: 110px;
}

@media (min-width: 768px)and (max-width: 959px){
div.img-wrapper{ 
    max-height: 205px;
}
/*div.photos, div.species, div.occurrences {
	padding-top: 20%;
}
*/
}