body {
  font-family: 'PT Sans', sans-serif;
}

.column {
  float: left;
  display:inline-block;
}

.left, .right {
  width: 10%;
}

.middle {
  padding: 0 10px 20px 10px;
    width: 80%;
    background-color: #f2f2f2;
    box-shadow: 0px 3px 15px 0px rgba(0,0,0,0.5);
    border: 1px solid #969696;
    border-radius:5px;
}

/* Clear floats after the columns */
.row:after {
  content: "";
  display: table;
  clear: both;
}

.header{
  width: 100%;
}

.header img{
  max-width: 100%; 
  max-height:100%;
}

ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
  background-color: #333;
}

li {
  float: left;
}

li a {
  display: block;
  color: white;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
}

li a:hover {
  background-color: #111;
}

.active {
  background-color: #b81f24;
}

table{
overflow:auto;
    table-layout:fixed;
}

table, td{
  text-align: left;
  border: 1px solid black;
}

td{
  height:50px;
  padding:2px 5px 2px 5px;
    vertical-align: center;
}

.border-exception{
  border:0;
}

#search{
  width:auto;
}

.save{
  text-decoration: underline;
}

.icon{
  width:25px;
  height: 25px;
}

.success{
  color:green;
  visibility: hidden;
}

.error{
  color:red;
  visibility: hidden;
}

.failed{
  color:red;
}

/*w3s CSS*/
#myInput {
  width: 20%; /* Full-width */
  font-size: 16px; /* Increase font-size */
  padding: 12px 20px 12px 40px; /* Add some padding */
  border: 1px solid #ddd; /* Add a grey border */
  margin-bottom: 12px; /* Add some space below the input */
}

#myTable {
  border-collapse: collapse; /* Collapse borders */
  width: 100%; /* Full-width */
  border: 1px solid #ddd; /* Add a grey border */
  font-size: 18px; /* Increase font-size */
}

#myTable th, #myTable td {
  text-align: left; /* Left-align text */
  padding: 12px; /* Add padding */
}

#my-div
{ 
    margin: 0 auto;
    width    : 630px;
    height   : 750px;
    overflow : hidden;
}

#my-iframe
{
    top      : -870px;
    left     : -40px;
    width    : 1280px;
    height   : 1250px;
}

.container{
  display:table;
}

select{
  width:20%;
}

.eventbillede{
  width: 200px;
  height: 200px;
  display:block;
  position:absolute;
  padding-left: 0.5%;
}

.eventOverlay{
  position:relative;
  padding-left:4%;
}

.image-container{
  display:block;
  width: 200px;
  height: 200px;
}

.top{
  display:block;
  width:100%;
  height: 72px;
  margin-top: -10px;
  background-color:#f2f2f2;
  padding-top: 2%;
  padding-bottom: 1%;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.wrap{
  margin: auto;
  max-width: 648px;
  display: block;
  overflow: hidden;
  max-height: 60px;
}

.wrap img{
  max-height: 60px;
  margin-bottom:20px;
}

.headera{
  width: 100%;
    height: 90%;
}

.title{
      font-family: 'Adamina', serif;
    color: #383838;
    font-size: 120%;
    border-bottom: 1px solid #e8debb;
}

.text{
  font-family: "Abhaya Libre", Sans-serif;
  font-size: 18px;
}

.event{
  display:block; width:15%; 
  text-align: center;
}

#showAll{
  margin: 0 auto;
}

#showAll td{
  font-size: 18px; /* Increase font-size */
  text-align: center;
  vertical-align: middle;
  font-family: 'Abhaya Libre', Sans-serif; 
  font-size: 18px;
}

.gridTitle{
  font-family: 'Adamina', sans-serif;
  font-weight: 600;
  font-size: 1.2em;
}

.greyscale{
  -webkit-filter: grayscale(100%); /* Safari 6.0 - 9.0 */
  filter: grayscale(100%);
  position: absolute;
}