body {
  color: #1282bd;
}

table { width:100%; max-width: 1024px;}

.cell {
width: 20%;
text-align: center;
}

.gruen {
color: #7eb337;
}

.visitcard {
width: 100%;
max-width: 900px;
}

.logo {
width: 100%;
max-width: 1024px;
}

.txts { margin-left: 2%; margin-right: 2%; }
.bild { float: left; width: 40%; }

.visit {
position: fixed;
top:150px;
border: 0px;
}

.mits {
width: 10%;
}
.container {   display: flex;   justify-content: center;   align-items: center;}

.fixedfoot {
  position: fixed;
  bottom: 0;
  width: 100%;
  background: transparent;
  opacity:0.9;
}


.bx {
background-image: url("IMGs/bx.svg");
border: 0px;
background-repeat: no-repeat;
background-size: cover;
}

.b1 {
background-image: url("IMGs/b1.svg");
border: 0px;
width: 166px;
height: 45px;
cursor: pointer;
background-repeat: no-repeat;
background-size: cover;
}
.b1:hover { background-image: url("IMGs/b1a.svg") }
.b1:focus { background-image: url("IMGs/b1a.svg") }

.b2 {
background-image: url("IMGs/b2.svg");
border: 0px;
width: 158px;
height: 45px;
cursor: pointer;
background-repeat: no-repeat;
background-size: cover;
}
.b2:hover { background-image: url("IMGs/b2a.svg") }
.b2:focus { background-image: url("IMGs/b2a.svg") }

.b3 {
background-image: url("IMGs/b3.svg");
border: 0px;
width: 150px;
height: 45px;
cursor: pointer;
background-repeat: no-repeat;
background-size: cover;
}
.b3:hover { background-image: url("IMGs/b3a.svg") }
.b3:focus { background-image: url("IMGs/b3a.svg") }

.b4 {
background-image: url("IMGs/b4.svg");
border: 0px;
width: 142px;
height: 45px;
cursor: pointer;
background-repeat: no-repeat;
background-size: cover;
}
.b4:hover { background-image: url("IMGs/b4a.svg") }
.b4:focus { background-image: url("IMGs/b4a.svg") }

.b5 {
background-image: url("IMGs/b5.svg");
border: 0px;
width: 134px;
height: 45px;
cursor: pointer;
background-repeat: no-repeat;
background-size: cover;
}
.b5:hover { background-image: url("IMGs/b5a.svg") }
.b5:focus { background-image: url("IMGs/b5a.svg") }

.b6 {
background-image: url("IMGs/b6.svg");
border: 0px;
width: 96px;
height: 45px;
cursor: pointer;
background-repeat: no-repeat;
background-size: cover;
}
.b6:hover { background-image: url("IMGs/b6a.svg") }
.b6:focus { background-image: url("IMGs/b6a.svg") }

.b7 {
background-image: url("IMGs/b7.svg");
border: 0px;
width: 78px;
height: 45px;
cursor: pointer;
background-repeat: no-repeat;
background-size: cover;
}
.b7:hover { background-image: url("IMGs/b7a.svg") }
.b7:focus { background-image: url("IMGs/b7a.svg") }


.b0 {
background-image: url("IMGs/b0.svg");
border: 0px;
width: 60px;
height: 45px;
cursor: pointer;
background-repeat: no-repeat;
background-size: cover;
}
.b0:hover { background-image: url("IMGs/b0a.svg") }
.b0:focus { background-image: url("IMGs/b0a.svg") }


summary {
  cursor: pointer;
  color: #ffffff;
  background-color: #1282bd;
  padding: 4px;
  font-weight: 700;
  font-size: large;
  border-radius: 8px; 
  border-bottom: 1px solid silver;
  border-right: 2px solid silver;
  box-shadow: 4px 6px 8px Teal;
  text-align: center;
  font-variant: small-caps;
}
summary:hover {
	color: #000080;
    background-color: #ffffff;
}

@media only screen and (max-width: 1600px) {
.mits {
width: 50%;
}
}
@media only screen and (max-width: 1500px) {
.mits {
width: 70%;
}
}
@media only screen and (max-width: 1300px) {
.mits {
width: 80%;
}
}

@media only screen and (max-width: 1200px) {
.mits {
width: 90%;
}
}

@media only screen and (max-width: 1000px) {
.b1 { width: 110px; height: 34px; }
.b2 { width: 105px; height: 34px; }
.b3 { width: 100px; height: 34px; }
.b4 { width: 94px; height: 34px; }
.b5 { width: 89px; height: 34px; }
.b6 { width: 64px; height: 34px; }
.b7 { width: 52px; height: 34px; }
.b0 { width: 40px; height: 34px; }
.mits {
width: 80%;
}
.hsmall {
font-size: small;
}
}
@media only screen and (max-width: 800px) {
.b1 { width: 55px; height: 16px; }
.b2 { width: 52px; height: 16px; }
.b3 { width: 50px; height: 16px; }
.b4 { width: 47px; height: 16px; }
.b5 { width: 44px; height: 16px; }
.b6 { width: 32px; height: 16px; }
.b7 { width: 26px; height: 16px; }
.b0 { width: 20px; height: 16px; }
.mits {
width: 90%;
}
.hsmall {
font-size: x-small;
}


/*
width: 159px;	180,00	14	166	110,666666666667	55,3333333333335
width: 152px;	170,00	12	158	105,333333333333	52,6666666666665
width: 145px;	160,00	10	150	100	50
width: 138px;	150,00	8	142	94,6666666666667	47,3333333333334
width: 131px;	140,00	6	134	89,3333333333333	44,6666666666667
width: 94px;	100,00	4	96	64	32
width: 77px;	80,00	2	78	52	26
width: 60px;	60,00	0	60	40	20


*/

}