body {
  position: relative;
  margin:2px;
  font-family: Literata, serif;
  font-size: 16px;
  color: #333;
  }

body small {font-size:66%;}

a:not([class]) {
    text-decoration: none;
}

a:not([class]):hover {
    text-decoration: underline;
}

.doneren {
  position: relative;
  background-color: #fff;
  max-width: 910px;
  padding: 1px 0 0;
  margin: 2px auto 24px;
  border-radius:9px;
  box-shadow: 0 0px 10px 0 rgba(0, 0, 0, 0.2) inset, 0 6px 10px 0 rgba(0, 0, 0, 0.19) inset;
}

#bovenbalk {
  position: absolute;
  top: 0;
  width: 100%;
  max-width: 1140px;
  height: 70px;
  padding: 8px;
  border-radius: 9px 9px 0 0;
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2), 0 3px 10px 0 rgba(0, 0, 0, 0.19);
  background: #800000; /* For browsers that do not support gradients */
  background: linear-gradient(#b30000, #660000); /* Standard syntax (must be last)*/
  opacity: 1;
  z-index: 7;
  transition: opacity 0.3s;
}

* {
  box-sizing: border-box;
}

.flex-container {
  display: flex;
  flex-direction: row;
  font-size: 19px;
  text-align: center;
}

.flex-item-left {
  padding: 10px;
  flex: 50%;
}

.flex-item-right {
  padding: 10px;
  flex: 50%;
}

.zoom {transition:transform .2s;border-radius:3px;}

.zoom:hover {
  -ms-transform: scale(2); /* IE 9 */
  -webkit-transform: scale(2); /* Safari 3-8 */
  transform: scale(2); 
}

::marker {
  font-size: 20px;
  color: #9f0303;
}

.btn-fdp-outline {
  color: #800000;
  border: 1px solid #800000;
  background-color: transparent;
  transition: all .15s ease-in-out;
}

.btn-fdp-outline:hover,
.btn-fdp-outline:focus,
.btn-fdp-outline:active {
  color: #fff;
  background-color: #800000;
  border-color: #800000;
}

footer {
  padding: 3px;
  height: 70px;
  color: #333;
  text-align: center;
  border-top:2px solid #e6e6e6;
}

footer p {margin:4px;}

/* Responsive layout - makes a one column-layout instead of two-column layout */
@media (max-width: 700px) {
  .flex-container {flex-direction: column}
}

@media screen and (max-width:900px) {
.zoom:hover {
  -ms-transform: scale(3); /* IE 9 */
  -webkit-transform: scale(3); /* Safari 3-8 */
  transform: scale(3);}
}

@media only screen and (max-width: 1100px) {
  .zoom:hover {
  -ms-transform: scale(1); /* IE 9 */
  -webkit-transform: scale(1); /* Safari 3-8 */
  transform: scale(1);}
}