/* algemeen  */

html {
  height: 99%;
}

body {
  background-color: #D3D3D3;
  height: 100%;
  width: 1100px;
  margin: auto;
  color: black; 
  font-family: "verdana";
  font-size: 10pt;
  text-align: justify;
}

h2 {
  font-family: "verdana";
  font-size: 16pt;
}
h3 {font-family: "verdana";
  font-size: 11pt;
}

td {font-family: "verdana";
  font-size: 10pt;
}

table#titel {
  background-color: rgb(186,197,220);
}
table#menu {
  background-color: rgb(0,38,127);
}

td#buitenkant {
  background-color: rgb(221,221,221);
}
td#streep {
  background-color: rgb(0,38,127);
}
td#titel {
  background-color: rgb(186,197,220);
}

.vierkantje img {
  border: 3px solid blue;
}
.vierkantje:hover img {
  border: 3px solid red;
}
.vierkantje2:hover img {
  outline: 3px solid blue;
}
.landschapmetrand img {
  border: 3px solid rgb(255,255,230);
  box-shadow: none;
}
.landschapzonderrand img {
  border: none;
  box-shadow: none;
}

img {
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}
.metschaduw {
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}
div.metschaduw>img {
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}
div.metschaduw>a>img {
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}
div.geenschaduw>img {
  box-shadow: none;
}
div.geenschaduw>a>img {
  box-shadow: none;
}

table a:link {
  color: #dd7421;
}
table .koplink:link    { color: black; text-decoration: none; }
table .koplink:visited { color: black; text-decoration: none; }
table .koplink:hover   { color: black; text-decoration: none; }
table .koplink:active  { color: black; text-decoration: none; }

.site_wrapper {
  position: relative; 
  background-color: #f1eed2;
  margin: 8px auto 20px auto; 
  width: 1084px;
  min-height: 99%;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}
.pagina_wrapper {
  width: 100%;
  background-color: #f1eed2; 
  padding-top: 52px;
}

/* kop */

.kop_wrapper {
  position: relative; 
  width: 100%; 
  height: 140px; 
  background-image: url('../Physcomitrium2.jpg');
}
.kop_doorschijnend {
  position: absolute; 
  top: 21px; 
  left: 21px; 
  width: 600px; 
  height: 100px; 
  background-color: black; 
  opacity: 0.5;
}
.kop_tekst {
  position: absolute; 
  top: 31px; 
  left: 4px; 
  width: 600px; 
  height: 80px; 
  padding: 15px; 
  color: white;
  font-size: 42px; 
  font-family: arial;
}
.kop_bestof {
  position: absolute; 
  top: 55px; 
  left: 525px;
}
.kop_bestof img {
  box-shadow: none; 
}

/* zoekveld */

#zoek_wrapper {
  float: right;
}
.zoekimg {
  border: none;
  max-width: 310px;
  max-height: 200px;
}
input[name=search] {
  float: right;
  width: 35px;
  height: 35px;
  margin: 3px 3px 0px 0px;
  box-sizing: border-box;
  border: 2px solid #a9a9a9;
  font-size: 16px;
  background-color: #D3D3D3;
  background-image: url('search.png');
  background-position: right 5px top 5px; 
  background-repeat: no-repeat;
  padding: 0;
  -webkit-transition: width 0.4s ease-in-out;
  transition: width 0.4s ease-in-out;
  border-radius: 25px;
}
input[name=search]:focus {
  width: 280px;
  outline: none;
  background-color: #f1eed2;
  padding: 0px 30px 0px 10px;
}

/* zoekresultaat */

.omfotos {
  width: 100%; height: 900px; background-color: #f1eed2;
}
.foto {
  margin: 20px auto; width: 100%; height: 640px;
}
.foto img {
  max-height: 600px; max-width: 900px;
}
.thumbs {
  display: block;
  overflow-x: scroll;
  white-space: nowrap;
  width: 900px;
  height: 115px;
  border: 0;
  margin: auto;
  background-color: #f1eed2;
  padding-top: 40px;
}
.thumbs img {
  padding: 5px;
  box-shadow: none;
}
.thumbs a {
  height: 85px;
}
.reslijst {
  border: 2px solid #191918;
  border-collapse: collapse;
}
.reslijst td {
  border: 1px solid #191918;
}
.reslijstkop {
  background-color:#191918;
  color:white;
}


/* systematische deel  */

.koplabels {
  width: 100%;
  text-align: center;
  padding-top: 20px;
  padding-bottom: 10px;
}
.koplabels .koplink:link    { color: black; text-decoration: none; }
.koplabels .koplink:visited { color: black; text-decoration: none; }
.koplabels .koplink:hover   { color: black; text-decoration: none; }
.koplabels .koplink:active  { color: black; text-decoration: none; }

.labelkop {
  width: 100%;
  text-align: center;
  padding-top: 30px;
  padding-bottom: 35px;	
}
.labelkop a:link    { color: black; text-decoration: none; }
.labelkop a:visited { color: black; text-decoration: none; }
.labelkop a:hover   { color: black; text-decoration: none; }
.labelkop a:active  { color: black; text-decoration: none; }

.labelsubkop, .labelsubkopschuin {
  width: 100%;
  text-align: center;
  padding-top: 40px;	
  padding-bottom: 25px;
}
.labelsubkopschuin {
  font-style: italic;
}
.labelsubkop a:link    { color: black; text-decoration: none; }
.labelsubkop a:visited { color: black; text-decoration: none; }
.labelsubkop a:hover   { color: black; text-decoration: none; }
.labelsubkop a:active  { color: black; text-decoration: none; }

.eigensamenstellingkop {
  width: 100%;
  text-align: center;
  padding-top: 30px;
  padding-bottom: 30px;	
}
.eigensamenstellingkop a:link    { color: black; text-decoration: none; }
.eigensamenstellingkop a:visited { color: black; text-decoration: none; }
.eigensamenstellingkop a:hover   { color: black; text-decoration: none; }
.eigensamenstellingkop a:active  { color: black; text-decoration: none; }

.eslabelkop {
  width: 100%;
  text-align: center;
  padding-top: 10px;
}
.eslabelkop a:link    { color: black; text-decoration: none; }
.eslabelkop a:visited { color: black; text-decoration: none; }
.eslabelkop a:hover   { color: black; text-decoration: none; }
.eslabelkop a:active  { color: black; text-decoration: none; }

.eslabelsubkop, .eslabelsubkopschuin {
  width: 100%;
  text-align: center;
  padding-bottom: 20px;
}
.eslabelsubkopschuin {
  font-style: italic;
}
.eslabelsubkop a:link    { color: black; text-decoration: none; }
.eslabelsubkop a:visited { color: black; text-decoration: none; }
.eslabelsubkop a:hover   { color: black; text-decoration: none; }
.eslabelsubkop a:active  { color: black; text-decoration: none; }

.auteurbijlabel {
  font-family: "verdana";
  font-size: 15pt;
}

.koptussenruimte {
  Width: 100%;
  height: 35px;
}
.nametussenruimte {
  width: 100%;
  float: left;
  height: 42px;
}
.namehoogte {
  margin-top: 42px;
}
.namehoogte2 {
  margin-top: 84px;
}

.bladpaginaomvattend {
  width: 1000px;
  margin: auto;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
.blad {
  float: left;
  text-align: center;
  padding-bottom: 30px;
}
.binnenblad {
  position: relative;
  display: inline-block;
  text-align: center;
}
.tekstbovenfotos {
  margin: auto;
  text-align: center;
  padding-top: 30px;
  padding-bottom: 10px;
}
.tekstbovenfotosfont {
  font-family: "Monotype Corsiva";
  font-size: 32px;
}
.fotorij {
  margin: auto;
  text-align: center;
}
.fotorijnatekst {
  margin: auto;
  text-align: center;
  padding-top: 15px;
}
.fotocel {
  padding: 10px 12px 10px 12px;
}
.tekstcel {
  padding: 10px 0px 10px 0px;
}
.tussentekst {
  margin: auto;
  border: none;
  padding-bottom: 10px;
}
.tussentekstkop {
  margin: auto;
  border: none;
  padding-bottom: 10px;
}
.tekstcentreren {
  text-align: center;
}
.tekstuitvullen {
  text-align: justify;
}

.tussenpaginaomvattend {
  width: 100%;
  margin: auto;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
.tussenpaginabreed {
  width: 100%;
  margin: auto;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
.tussenpaginasmal {
  width: auto;
  float: left;
  text-align: center;
}
.tussenpaginablok {
  float: left;
  width: auto;
  text-align: center;
  padding: 14px 30px 0px 30px;
}
.tussenpaginabloksmal {
  float: left;
  width: auto;
  text-align: center;
  padding: 14px 22px 0px 22px;
}
.tussenbloklink {
  padding-top: 20px;
  padding-bottom: 25px;	
  font-size: 13px;
}
.estussenbloklink {
  padding-top: 15px;
  padding-bottom: 30px;	
  font-size: 13px;
}
.tussenbloklinkschuin {
  padding-top: 20px;
  padding-bottom: 25px;	
  font-size: 13px;
  font-style: italic;
}
.tussenbloklink a:link {
  color: #dd7421;
}
.tussenbloklinkschuin a:link {
  color: #dd7421;
}
.tussenpaginatekst {
  margin: auto;
  width: 710px;
  padding: 20px;
  text-align: justify;
}

.ruimteonderaan {
  padding: 20px;
}

.tooltip {
  position: relative;
  display: inline-block;
}

.tooltip .tooltiptextsoort, .tooltip .tooltiptextgeslacht, .tooltip .tooltiptexthogertaxon {
  visibility: hidden;
  white-space: nowrap;
  background-color: black;
  font-family: "verdana";
  font-size: 10pt;
  font-style: normal;
  color: #fff;
  text-align: center;
  border-radius: 6px;
  padding: 5px 5px;
  position: absolute;
  z-index: 1;
}
.tooltip .tooltiptextsoort {
  top: 90%;
  left: 0px;
}
.tooltip .tooltiptextgeslacht {
  top: 150%;
  left: -3px;
}
.tooltip .tooltiptexthogertaxon {
  top: 112%;
  left: 0px;
}

.tooltip .tooltiptextsoort::after, .tooltip .tooltiptextgeslacht::after, .tooltip .tooltiptexthogertaxon::after {
  content: "";
  position: absolute;
  bottom: 100%;
  left: 15px;
  margin-left: -5px;
  border-width: 5px;
  border-style: solid;
  border-color: transparent transparent black transparent;
}

.tooltip:hover .tooltiptextsoort, .tooltip:hover .tooltiptextgeslacht, .tooltip:hover .tooltiptexthogertaxon {
  visibility: visible;
}

.clear {
    clear: both;
}