:root {
  --top-bar: 7rem;
  --mycoblue: #519ab9;
  --bg-color-dark: rgb(109, 91, 71);
  --bg-color-dark2: rgb(118, 104, 82);
  --bg-color-medium: rgb(166, 128, 83);
  --bg-color-light: rgb(225, 196, 161);
  --bg-color-light2: rgb(218, 179, 147);
  --bg-color-extralight: rgb(235, 216, 193);
}

body {
  font-family: "Open Sans", sans-serif;
}

header {
  background-color: white;
}

.top-logos { height: 7em; }
.navbar-brand img{
  height: 50px;
  width: 375px;
  max-width: 100%;
}
#conf-logo {
  width: 210px;
  max-width: 100%;
}
#menuBar {
  color: rgb(166, 128, 83);
  background-color: rgb(223, 223, 214);
}
#menuBar .nav-item {
  font-size: 1.125rem;
  border-right: 2px solid rgb(166, 128, 83);
}
.nav-link {
  color: rgb(166, 128, 83);
  padding: 5px 20px !important;
}
.nav-link a { color: rgb(166, 128, 83); text-decoration: none; }
.nav-link.active, .nav-link:hover {
  color: rgb(51, 46, 41);
}

#mainPageTitle {
  position: absolute;
  z-index: 10;
  bottom: 0.7rem;
  font-size: 3.2rem;
  font-weight: 700;
  color: white;
}

#mainCarousel .carousel-inner { height: 13rem; }
.carousel-item img {
  height: 100%;
  object-position: center;
  object-fit: cover;
}

.medium-background { background-color: var(--bg-color-medium); }
#searchBar button, #searchFormBar button { background-color: var(--bg-color-light); }
#searchBar button:hover, #searchFormBar button:hover { background-color: var(--bg-color-light2); }
#searchBar a { color: white; }
#searchBar a:hover { color: var(--bg-color-light); }
.ac-results { margin-left: 1em; color: white; }
.result_img {
  border-radius: 8px;
  max-width: 3.5em; max-height: 3.5em;
  margin-right: 2em;
}
.search_result {
  border-bottom: 2px dotted black;
}
.search_result a {
  text-decoration: none;
}

body.login main {
  background-color: var(--bg-color-extralight);
}

h2 {
  color: var(--bg-color-medium);
  font-weight: 700;
  margin-bottom: 1rem;
}

.btn-primary {
  background-color: var(--bg-color-dark) !important;
  border: none;
}
.btn-primary:hover {
  background-color: var(--bg-color-dark2) !important;
}
a.btn-secondary { color: white !important; }
.form-control::placeholder {
  opacity: 0.6;
}

footer {
  font-size: small;
  color: white;
  background-color: var(--bg-color-dark);
}
footer a { color: #cdc4ab; }
footer a:hover { color: #a59875; }

@media (max-width: 800px) {
  #mainPageTitle {
    font-size: 2rem;
  }
}

img {
  border: 0;
}

#mainContainer a { color: var(--bg-color-medium); }
#mainContainer a:hover { color: var(--bg-color-dark); }

a.icon {
  text-decoration: none;
  border-bottom: 0;
}

img.icon, input.icon {
  border: 0;
  max-width: 1rem;
}

legend {
  color: #333;
  background-color: #EEEEEE;
}
.text-center { text-align: center; }

.errornote {
    font-weight: bold;
    padding: 10px 12px;
    margin: 0 0 10px 0;
    color: #721c24;
    border: 1px solid #ba2121;
    border-radius: 4px;
    background-color: #f8d7da;
    background-position: 5px 12px;
}

.help_text { color: #999; font-style: italic; font-size: 95%; }

.nobr {white-space: nowrap}
.pointer {cursor: pointer;}

.even {
  background-color: #EEEEEE;
}

.mt-2 { margin-top: .5rem; }

div.header {
  color: white;
  background-color: #86bd00;
  padding: 1em;
}
div#logo {
  float: left;
  padding-right: 1em;
}
div.clear {
  clear: both;
}

div.menus {
  background-color: #005b2f; /*#1e8206;*/
  height: 2em;
  clear: both;
}

div.change_lang {
  color: white;
  font-size: x-small;
  float: right;
  margin: 0.5em;
}
.selected_lang {
  border: 1px solid #86bd00;
  padding: 2px;
}

div.search {
  margin: 0.5em;
  font-size:0.9em;
}
div.login {
  margin: 0.5em;
}
span.username {
  color: white;
}

div#breadcrumb {
  margin-bottom: 0.5em;
}

div.content {
  clear: both;
}

div#col_nav {
  /*background-color: #DDDDDD;*/
  float:left;
  width: 20%;
  position:relative;
  padding:0 0 1em 0;
  overflow:hidden;
}

div.message {
  color: red;
  padding: 4px;
  margin-top: 0.8em;
  margin-bottom: 0.8em;
  border: 1px solid #DDDDDD;
}

div.footer {
  margin-top: 1.5em;
  margin-left: auto;
  margin-right: auto;
  padding: 0.8em;
  width: 85%;
  color: white;
  background-color: #222222;
  font-size: 0.7em;
  clear: both;
}

div.button {
  border: 2px solid #005b2f;
  background-color: white;
  color: #005b2f;
  padding: 0.2em;
}

div.button a {
  border-bottom: 0px;
}
div.button a:hover {
  color: #005b2f;
  font-weight: bold;
  text-decoration: none;
}

div.edit_icons {
  text-align: right;
}

div.edit_buttons {
  margin-top: 2em;
}

img.edit_icon {
  display: none; /* showed on mouseover */
  max-width: 1.2rem;
  max-height: 1.2rem;
}

.main_title {
  float:left;
  font-size: 1.4em;
  font-weight: bold;
}

.taxo_name {
  margin-top: 0.1em;
  padding-bottom: 2px;
  font-style: italic;
  font-size: 0.9em;
  background-color: #DDDDDD;
}
.taxo_link {
  color: black;
}

div.description {
  margin-top: 0.5em;
  margin-bottom: 0.5em;
}

.left_icon_margin {
  margin-left: 20px;
}

.helptext {
  color: #666666;
  font-style: italic;
  font-size: 0.9em;
}

.private, .status-private {
  color: red !important;
}
.status-private a {
  color: red !important;
}
.status-private a:hover {
  color:#333333;
}

/* class used by Django form handling */
ul.errorlist {
  list-style-type: none;
  color: #F00;
  margin: 0;
  margin-left: 0.5em;
  padding: 0;
}

/* forms */
.form th, th.left_header {
  vertical-align: top;
  text-align: right;
  max-width: 240px;
}

div.photo {
  background-color: #e7ffac;
  padding: 4px;
  border: 1px solid #005b2f;
  margin-top: 2px;
}
div.photo_title {
  text-align: center;
  font-size: 0.8em;
  font-style: italic;
  margin-top: 5px;
}
div.file_title {
  display:inline;
  font-size: 0.7em;
}

div.object_block_left, div.object_block_right {
  display: inline-block;
  vertical-align: top;
  margin: 0.2em;
  margin-top: 1.5rem;
  padding: 0;
  width: 48%;
}

.object_block_title {
  font-size: 1.5rem;
  font-weight: bold;
  margin: 0;
  /*margin-top: 0.3em;
  margin-bottom: 0.1em;*/
  padding: 4px;
  padding-right: 1.6em; /* make room for dropdown menu */
}
div.object_block_content {
  padding: 3px;
}
div.object_block_navigation {
  text-align: center;
}

div.attributes_block {
  border: 1px solid #005b2f;
  padding: 2px;
  background-color: #EEE;  
}

/* This should be probably attributes of an enclosing column... */
div.block {
  float: right;
  margin: 0.6em;
}
div.half_block {
  width: 45%;
}

.collection_search {
  margin-bottom: 1em;
}

div.block h2 {
  padding: 4px;
  font-size: 1.1em;
  background-color: #005b2f;
  color: white;
  margin-top: 0;
  margin-bottom: 0px;
}
div.block_content {
  border-width: 1px;
  border-style: solid;
  border-color: #005b2f;
  margin-bottom: 1em;
}
div.block ul {
  padding-left: 2em;
  list-style-type: disc;
  list-style-image: url("../img/arrow_in_a_box.54aea4209c08.png");
  margin-bottom: 0.2em;
}
div.block p {
  font-size: 0.8em;
  margin-left: 1em;
  margin-top: 0.5em;
  margin-bottom: 0.5em;
  list-style-image: url("../img/arrow_in_a_box.54aea4209c08.png");
}

div.expandable {
  margin-left: 1.5em;
  list-style-image: url("../img/open.2e85a2b88608.png");
}
img.expander {
  float:left;
  margin-top: 3px;
  margin-left: -1em;
}
/* Pagination styles */
div.pagination {
  font-size: 0.8em;
  margin-top: 0.8em;
}

/* Search page styles */
div.search_crit {
  margin: 1em 0;
}

div.img_result_container {
  display: flex;
  flex-wrap: wrap;
}
div.img_result {
  padding: 0.5em;
  margin: 0.5em;
  border: 1px dotted gray;
  width: 144px;
}
div.img_result .caption {
  font-style: italic;
}
div.img_result .object_link {
  font-weight: bold;
}

/* Help pages styles */
p.note {
  background-color: #fdfdf2;
  background-image: url("../img/note.cb956589031f.png"); background-repeat: no-repeat;
  padding: 0.8em 0.8em 0.8em 3.5em;
  border: 1px solid #999999;
}