body {background-image: url("../grafik/hg_blaugruen.png");background-repeat:repeat;}
main {background-color:#DFDFDF;border:3px solid;border-top-color:#000000;
border-left-color:#000000;border-right-color:#FFFFFF;border-bottom-color:#FFFFFF;width:48%;margin-top:1%;}
li               {
                  display: inline-block;
                  text-align:center;
                  }
#images          {
                  width:950px;
                  max-width: 100%; /* 8 spalten mit je 130px*/
                  margin:0 auto;
                  padding:0;
                  line-height: 0;
                  text-align:center;
                  }
#images li       {
                  list-style: none;
                  display: inline-block;
                  width: 76px; /* Breite der Bilderrahmen*/
                  margin: 3px; /* Aussenabstand der Bilderrahmen*/
                  background-color:#98bfd8;/*  Hintergrundfarbe für die Bilderrahmen, vom User wählbar #98bfd8;*/
                  transition: all ease 0.5s;
                  border-radius:5px;
                  padding:2px;
                  }

#images li:hover {
                  background-color:#FF7F7F; /* Hintergrundfarbe für die Bilderrahmen beim Mouseover*/
                  cursor:pointer;
                  }

#images li div   {
                  display: table;
                  margin: 0;
                  height: 0px;        /* Hoehe der Bilderrahmen (ohne Bild-Text)*/
                  width: 100%;
                  }

#images li div a {
                  display: table-cell;
                  vertical-align: middle;
                  }

ul               {margin:0 auto;}

@charset "utf-8";
/*CSS Document */

img              {
                 max-width:100%;
                 height:auto;
                 }

@media screen and (max-width:740px){#titel{
                 display:none;}
                  }