﻿/**************************************************************
	2025.09.04  (C) W. Zil.    00_seite.css 
**************************************************************/

body {
	/* height: 150%;  */
   	font-family: Arial, Helvetica, sans-serif;
 	background-color: white;    /* Farbe weiss */
 	margin: auto;  			    /* body (Seite) zentrieren */
}

h2 {
  background-color: #cceeff; /* hellblau */
  font-size: 12px;
  word-break: break-all;
  padding: 1px 10px;
  position: fixed;
  width: 100%;
}

.topline {
  text-align: center;
    /* background: #fff;  /* weiss */
  background: #cceeff;  /* hellblau */
  position: fixed;   	/* ==== fixed TOP-line + menu ===*/ 
  top: 5%;
  width: 100%; 
 /* padding: 0px 1px; */
 /* height: 8%; 			/* Kopfzeile-Balkenhöhe */
}

.main{
  margin-top: 0%;	
}

.text-1 {
  position: absolute;
  position: fixed;
  top: 1%;
  left: 70%;
  width: 20%;
 /*  transform: translate(-50%, -50%);  */
  text-align: center;
/*  background: #cceeff;  /* hellblau */
  background: white;  /* weiss */
 /* background-color: rgba(136, 204, 255, 0.8); /* hellblau  20% Transparenz */
  padding: 2px;
  color: black;   /* Schriftfarbe schwarz*/
 /*  background-image: url('Passbilder/2024-06-23 Dortmund (1).jpg');  */
  border:1px solid gray;   /* Rand hellgrau  */
  border-radius: 5%;   		/* 5% abgerundeten Ecken */
  box-shadow: 5px 5px gray;
}

.text-2 {
  position: absolute;
  top: 140%;
  left: 0;
  width: 20%;
 /*  transform: translate(-50%, -50%);  */
  text-align: center;
/*  background: #cceeff;  /* hellblau */
  background: white;  /* weiss */
 /* background-color: rgba(136, 204, 255, 0.8); /* hellblau  20% Transparenz */
  padding: 2px;
  color: black;   /* Schriftfarbe schwarz*/
}

p {
  font-size: small;   /* x-smal? medium? large? Absatz mit kleiner Schrift: schwarz */
  color:black;
  margin-top: 10px;
}

img {   	
	border-radius: 5%;   		/* 5% abgerundeten Ecken */
	border: 1px solid #ffffff;  /* Bild-Rand, dünn 1px, weiss */
}

.navbar {
  margin-top: 2%;
  overflow: hidden;
  text-align: left;
 /* background-color: #8fb7ea;   hellblau 74 % */
  background-color: white;  /* weiss */
/*  background-color: rgba(242,242,242, 0.6);  /* hellgrau 40% Transparenz */
  position: fixed;
  top: 0;
  width: 100%;
}

.navbar a {
  width: 8%;
  float: left;
  display: block;
/*  color: #f2f2f2;  /* hellgrau */
  color: black;      /* schwarz */
  text-align: left;
  padding: 2px 2px;
  text-decoration: none;
  font-size: x-small;
}

.navbar a:hover {
  background: #cceeff;  /* hellblau */
  color: black;
  width: 10%;
}

.filterDiv {
  float: left;
  border-radius: 5%;
/*  background-color: lightgrey; */
  background-color: #cceeff; /* hellblau */
  color: #000000;
  width: 18.0%;   /* 5 Auswahlbilder nebeneinander (100% : 5 = 20.0 %) */
  line-height: 12px;
  text-align: left;
  margin: 1px;
  padding: 1px;
  display: none;
  top: 25%;
}

.show {
  display: block;
}

.container {
  margin-top: 0%;
  overflow: hidden;
}

/* Style the button */
.btn {
  margin-top: 13.5%;
  border: none;
  outline: none;
  padding: 4px 4px;
  font-size: small;
/*  background-color: #f1f1f1;   /* hellgrau 95% */
  background: #cceeff;  /* hellblau */
  cursor: pointer;
}

.btn:hover {
 /* background-color: #ddd; */
  background: #0066ff;  /* dunkelblau 50% */
  color: white;
}

.btn.active {
 /* background-color: #666; /* dunkelgrau */
  background-color: #0066ff; /* dunkelblau */
  color: white;
}

.foot {   /* 100% Fusszeile (relativ) am Ende der Seite */
  overflow: hidden;
/*  background-color: rgba(200, 204, 255, 0.8);   /* hellblau 20% Transparenz */
  background: #cceeff;  /* hellblau */
  color: black;
  width: 100%; 		    /* Gesamt-Breite */
  text-align: center;
  font-size: small;
  position: relative;
  bottom: 0;
}