body        {
            font-family: Verdana, sans;
            font-size: 12px;
            text-align: center;
            }
#top        {
            margin: auto;
            width: 700px;
            }
#container        {
            margin: auto;
            width: 100%;
            text-align: center;
            }
#logo       {
            width: 600px;
            border: 3px solid rgb(0,204,0);
            padding: 20px;
            }
#box        {
            display: inline-table;
            vertical-align: middle;
            margin-right: 10px;
            margin-bottom: 8px;
            padding: 10px;
            width: 300px;
            height: 300px;
            border: 1px solid rgb(0,204,0);
            }
#boxgr      {
            display: inline-table;
            margin-right: 10px;
            margin-bottom: 8px;
            padding: 8px;
            width: 420px;
            height: 304px;
            border: 1px solid rgb(0,204,0);
            }
.daten      {
            width: 50%;
            margin: auto;
            }
.clean      {
            clear: both;
            height: 20px; 
}
a           {
            text-decoration: none;
            color: rgb(0,204,0);
}

a:hover     {
            text-decoration: none;
            color: rgb(0,102,0);
}

@media screen and (min-width: 180px) and (max-width: 880px) {

	img  {	width: 100%;}
  #top {	width:90%;}
  #box {	width: 90%;}
  #logo {	width: 90%;}
  .daten {width: 80%;}  
  }