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

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

#wrapper         {
                 background-image: url("../grafik/wrapper.png");
                 background-repeat:repeat;
                 margin: 0 auto;
                 text-align:center;
                 max-width: 1000px;
                 width: 98%;
                 width: auto;
                 height: auto;
                 border: 3px solid wheat;
                 border-radius: 10px;
                 -moz-border-radius: 10px;
                 -webkit-border-radius: 10px;
                 -ms-border-radius: 10px;
                 box-shadow: 0 0 10px 0px;
                 rgba (12, 3, 25, 0.8);
                 }
#title           {
                 margin: 0 auto;
                 }
#blfd            {
                 text-align: center;
                 margin: 0 auto 35px auto;
                 max-width: 100%;
                 width: 100%;
                 height: 100%;
                 width: auto;
                 height: auto;
                 }
.box1            {
                 display: inline-block;  /*Foto*/
                 text-align:center;
                 margin: 10px;
                 max-width: 75px;
                 width: 96%;
                 width:auto;
                 height:auto;
                 border: solid 3px;
                 border-top-color:#5F5F5F;
                 border-left-color:#000000;
                 border-bottom-color:#FFFFFF;
                 border-right-color:#F0F0F0;
                 border-radius: 3px;
                 -moz-border-radius: 3px;
                 -webkit-border-radius: 3px;
                 -ms-border-radius: 3px;
                 box-shadow: 0 0 3px 0px;
                 rgba (12, 3, 25, 0.8);
                 }
.box1a           {
                 display: inline-block;  /*Foto*/
                 text-align:center;
                 margin: 15px auto;
                 max-width: 620px;
                 width: 96%;
                 width:auto;
                 height:auto;
                 border: solid 3px;
                 border-top-color:#5F5F5F;
                 border-left-color:#000000;
                 border-bottom-color:#FFFFFF;
                 border-right-color:#F0F0F0;
                 border-radius: 3px;
                 -moz-border-radius: 3px;
                 -webkit-border-radius: 3px;
                 -ms-border-radius: 3px;
                 box-shadow: 0 0 3px 0px;
                 rgba (12, 3, 25, 0.8);
                 }
.box2            {
                 display: inline-block;
                 margin: 0 5px;
                 border:3px solid;
                 border-top-color:#000000;
                 border-left-color:#000000;
                 border-right-color:#FFFFFF;
                 border-bottom-color:#FFFFFF;
/*                  border-radius: 3px;
                 -moz-border-radius: 3px;
                 -webkit-border-radius: 3px;
                 -ms-border-radius: 3px;
                box-shadow: 0 0 3px 0px;
                 rgba (12, 3, 25, 0.8);*/
                 }
.box3            {
                 display: inline-block;  /*kl*/
                 margin: 6px 5px;
                 border: 2px solid;
                 border-top-color:#000000;
                 border-left-color:#000000;
                 border-right-color:#FFFFFF;
                 border-bottom-color:#FFFFFF;
                 border-radius: 2px;
                 -moz-border-radius: 2px;
                 -webkit-border-radius: 2px;
                 -ms-border-radius: 2px;
                 box-shadow: 0 0 2px 0px;
                 rgba (12, 3, 25, 0.8);
                 }
.box4            {
                 display:block;  /*Foto*/
                 text-align:center;
                 margin:0 auto;
                 max-width:100%;
                 width: 100%;
                 width: auto;
                 height: auto;
                 border-style: solid;
                 border-width: 3px;
                 border-top-color: #5F5F5F;
                 border-left-color: #000000;
                 border-bottom-color: #FFFFFF;
                 border-right-color: #F0F0F0;
                 padding: 0px;
                 /*object-fit: contain;*/
                 }

.zaehler         {
                 display: inline-block;
                 background-image: url("../grafik/zaehler.png");
                 background-repeat: no-repeat;
                 text-align:center;
                 margin: 1% auto;
                 max-width: 89px;
                 width: 96%;
                 background: #0080FF;

                 border:3px solid;
                 border-top-color:#000000;
                 border-left-color:#000000;
                 border-right-color:#FFFFFF;
                 border-bottom-color:#FFFFFF;

                 font-family: "Palatino Linotype", Arial,Verdana,Trebuchett;
                 font-weight: bold;
                 font-size: 13px;
                 font-style: normal;
                 color: #FFFFFF;/*Schriftfarbe*/
                 padding: 3px;
                 }
// INDEX





/*
#bigimage{
         margin:0px auto 10px auto;
         max-width:99%;
         border:3px solid #98bfd8; #98bfd8
         }

#images  {
         max-width: 1000px; /* 8 spalten mit je 130px          margin: 0 auto;
         padding: 2px;
         line-height: 0;
         }

#images li{
         list-style: none;
         display: inline-block;
         width: 146px; /* Breite der Bilderrahmen
         margin: 1px; /* 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;
         }