body {
     font-family: Arial, Helvetica, sans-serif;
}
 .art_head {
   border: 1px solid blue;
   width: 686px;
   height: 30px;
   font-size: 1.7em;
   background: #82CC12;
   color: white;
   padding: 7px;
   margin-bottom: 5px;

}

.artikel {
    float: left;
   border: 1px solid grey;
   width: 250px;
   height: 350px;
   padding: 10px;
}
.artikel img{
width: 250px;
height: 300px;
margin-top: -8px;
z-index: -1;
}

.admin_pic{
 position: absolute;
 z-index: 10;
 margin-top: -295px;
 padding: 5px;
text-align: center;
background: grey;
margin-left: 180px;
width: 45px;
color: white;
}

.admin_art{
 position: absolute;
 z-index: 10;
 margin-top: -36px;
 padding: 4px;
text-align: center;
background: grey;
margin-left: 212px;
width: 30px;
color: white;
}

.art_titel{
 margin-top: -12px;
  padding-left: 5px;
}

.art_titel h3{

font-weight: 500;
}

.art_titel_info{
 margin-top: -17px;
 padding-left: 5px;
 font-size: 12px;

}

.content {
position: absolute;
margin-left: 14em;
margin-top: 1.3em;
border: 1px solid red;
width: 700px;
height: auto;

}


.nav_left {
float: left;
margin-top: 1.3em;

}

.nav_left ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
    width: 170px;
    background-color: #f1f1f1;
   }

.nav_left li a {
    display: block;
    color: #000;
    padding: 8px 16px;
    text-decoration: none;
  }

/* Change the link color on hover */
.nav_left  li a:hover {
    background-color: #555;
    color: white;
  }