body 	{background-image: url("Gifs/famhint.gif");
           	background-color:#999999;
                  font-family: verdana, arial, sans-serif; color:blue;}


button {
            padding: .4em .8em;
            background: #0033ff linear-gradient(hsl(0 0% 100% /.2), transparent);
          	border: thin solid rgb(0 0 0 /.1);
          	border-radius: 0.5em 0.5em 0.5em 0.5em;
          	box-shadow: 0 .2em 0.4em rgb(0 0 0 /.5);
          	color: white;
          	text-shadow: 0 -.05em .05em rgb(0 0 0 /.5);
          	font-size: 125%;
          	line-height: 1.5;

        }
button:focus,
button:hover {
          	box-shadow: 0 .3em 0.6em rgb(0 0 0 /.8);
              }

button.navi {
          	width:200px;
              }

button.ok {
          	background-color: #5a9900;
          }


#wrapper
	{width:900px;
	margin:0 auto; }

p, dt 	{font-family:arial, sans-serif; clear: left; }
table	{border-style: solid; border-width: 0px; width:100%; margin:auto; }
  .line {border-style: solid; border-top-width:medium; border-bottom-width: medium;
    border-right: none; border-left: none;
  text-align:center; letter-spacing: 1em; }








#steuer     {background-image: url("Gifs/Steuerhint.gif");
           	background-color:#DEF;}

#kopf 	{font-family: verdana, arial, sans-serif; font-size:36pt; text-align:right;letter-spacing:0.1em;  }
#kopfut {font-family: verdana, arial, sans-serif; font-size:18pt; text-align:right;letter-spacing:0.1em;  }
li	{font-family:Vogue, Arial, sans-serif; font-size:15pt;}

#Navigation
                  {background-image:url("Gifs/Button.gif"); color:#DEF;  width:190px; height:60px; text-align:center; }

h5 { text-align: right; }

 a:link { color:blue; text-decoration:none; font-weight:normal; }
 a:visited { color:blue; text-decoration:none; font-weight:normal; }
 a:hover { color:blue; text-decoration:none;  font-weight:normal; }
 a:active { color:blue; text-decoration:none;  font-weight:normal; }
 a:focus { color:blue; text-decoration:none;  font-weight:normal; }

img { width: 400px;      height: auto;  float: left; margin: 0.7em;}
.high {height:400px; width:auto; float: left; margin: 0.7em;}




img:hover {transform: scale(1.8); float: center;}

figure {
  border: thin #c0c0c0 solid;
  display: flex;
  flex-flow: column;
  padding: 5px;
  max-width: 620px;
  margin: auto;
}

img {
  max-width: 600px;
  max-height: 600px;
}

figcaption {
    background-color: #222;
  color: #fff;
  font: italic smaller sans-serif;
  padding: 3px;
  text-align: center;
}


.gallery {
	--size: 15em;
	/* control the size */

	--gap: 1em;
	/* control the gap */

	--zoom: 1;
	/* control the scale factor */

	display: grid;
	gap: var(--gap);
	width: calc(3*var(--size) + 2*var(--gap));
	aspect-ratio: 2;
	grid-template-columns: repeat(3, auto);
}

.gallery figure {
	margin: 0;
	padding: 0;
	position: relative;
}

.gallery figcaption {
	position: absolute;
	bottom: 0;
	left: 0;
	text-align: center;
	width: 100%;
	opacity: 0;
	color: white;
	background: rgb(0 0 0 / 0.3);
}

.gallery figure:hover figcaption,
.gallery figure:focus figcaption {
	opacity: 1;
}

.gallery > figure img {
	width: 0;
	height: 0;
	min-height: 100%;
	min-width: 100%;
	object-fit: cover;
	cursor: pointer;

	transition: .35s linear;
}

.gallery figure:hover img,
.gallery figure:focus img {
	filter: grayscale(0);
	width: calc(var(--size)*var(--zoom));
	height: calc(var(--size)*var(--zoom));
}

  /* gms_slider */
  .gms_sliderbox {position:relative; margin-top:30px;}
  #gms_slider_nav { font-size:22px; z-index:2; position:absolute; left:0; top:-34px; margin:0; padding: 0!important; list-style-type: none; font-weight: normal;  line-height: 1.0em; overflow:hidden;display:none;}
  #gms_slider_nav  li { margin:0; padding:0; float: left; text-align:center; line-height: 1.0em; }
  #gms_slider_nav li a { background:#444; display: block; font-size:14px; font-weight:normal; padding: 3px 20px; text-decoration: none; color: #fff; transition: all 0.3s;  -webkit-transition: all 0.3s;  -moz-transition: all 0.3s;  -o-transition: all 0.3s; margin-right: 4px; }
  #gms_slider_nav li.current a { background-color:blue; }
  #gms_slider_nav li a:hover { background-color:red; transition: all 0.3s;  -webkit-transition: all 0.3s;  -moz-transition: all 0.3s;  -o-transition: all 0.3s; }
  .gms_slider_offstage {visibility:hidden;display:none;}
  .gms_slider_default {visibility:visible;}
