           * {padding: 0;
               margin: 0;
            }
body
{
}
td.uhrzeit{
	font-size:12px;
	width:70px;
	position: -webkit-sticky; /* Safari */
	position: sticky;
	left: 0;
	border-bottom: 1px solid white;
}

	.tafel td 
	{
		width:8em;
		height: 38px;
		/* background-color:#535353;*/
		  background-color:#2c3e50; 
			border-collapse: collapse;		  
		  border:1px solid black;
	}
	.Hinweis
	{
		font-size: 22px;background-color: red;padding: 20px;
	}
	.divlogin 
	{
		text-align:center;
		width:375px;
		margin: auto;
	}
	input
	{
		/* width:100%;padding:6px 6px;margin:auto; */
	}
	.headerobentafel 
	{
		width:100%;
		display:flex;  
		flex-wrap: wrap;
		flex-direction: row;
		background-color:#2c3e50;
		margin-top:0px; 
		margin-bottom:0px;
	}
	.headerlogo {
		width:200px;
		
	}
	.headerrechts 
	{
		flex:1; padding:1em; padding-right:3em; background-color:#2c3e50;text-align:center;
	}
	.headerleft 
	{
		flex:1; padding:1em;padding-left:3em;  background-color:#2c3e50; 
	}
	.headermitte 
	{
		flex:1; background-color:#2c3e50;  padding:1em;
	}
	.titeltafel 
	{
		font-family:consolas; padding: 1em; text-align:center;font-size: 3em;color:white;font-weight:600;
		vertical-align:center;
	}
	
	@media screen and (max-width: 450px) 
	{
		div 
		{
			font-size: 4vw;
		}
		.login3
		{
			font-size: 5vw !important;
		}
		.input
		{
			font-size: 5vw !important;
		}
		.eingabe
		{
			font-size: 5vw !important;
		}
			.titeltafel 
			{
				display:box;
			}
		body
		{
			margin-top: -10px;
		}
		.headerlogo 
		{
			width:70px;
				margin-top:0px;				
		}

		.titeltafel {
				font-family: Helvetica, Roboto, Arial; 
				font-weight:300;
				padding: 0px 0px; 
				text-align:center;
				font-size: 1.5em;
				color:white;
				padding-top:30px;
			}
			.headerobentafel {
				position:fixed;
				display:flex;  
				flex-wrap: wrap;
				flex-direction: row;
				margin-top:0px; 
				margin-bottom:0px;
				list-style: none;
			}
			.headerleft 
			{
				padding:5px;
			}
			.headermitte {
				flex:3;   
				padding:0em;
			}
			
		
	}
	@media (min-width:451px) AND (max-width:852px)
	{
		body
		{
			margin-top: -10px;
		}
				.headerlogo 
		{
			width:100px;
				margin-top:10px;				
		}

		.titeltafel {
				font-family: Helvetica, Roboto, Arial; 
				font-weight:300;
				padding: 30px 0px; 
				text-align:center;
				font-size: 2em;
				color:white;
				padding-top:50px;
			}
			.headerobentafel {
				position:fixed;
				display:flex;  
				flex-wrap: wrap;
				flex-direction: row;
				margin-top:0px; 
				margin-bottom:0px;
				list-style: none;
			}
			.headermitte {
				flex:3;   
				padding:0em;
			}

	}	
	@media (min-width: 853px) AND (max-width: 1031px) 
	{
		.titeltafel 
		{
						font-family: Helvetica, Roboto, Arial;
			padding:0px; padding-top: 1.5em; text-align:center;font-size:3em;color:white;font-weight:400;
		}
		.headerclublogo 
		{
			width:180px;
				margin-top:36px;				
		}
			.headermitte {
				flex:3; padding:0px; text-align:center;
			}
		
	}
	@media (min-width: 1032px) 
	{
		.headerlogo 
		{
			width:180px;
			
		}

		.titeltafel 
		{
			font-family: Helvetica, Roboto, Arial;
			padding: 0.8em;
			text-align:center;
			font-size: 3em;
			color:white;
			font-weight:400;
			letter-spacing: 3px;
			color:white;
			font-family: Helvetica, Roboto, Arial;
			
		}
			.headerclublogo {
				width:180px;
				margin-top:56px;				
			}
			.headermitte {
				flex:2; padding:20px; text-align:center;
			}

	}
			
            body {
                width: 100%;
                margin: auto;
                font-size: 16px;
                font-family: Bahnschrift,Roboto, Helvetica, Arial;
				box-sizing: border-box;
            }
			.headeroben {
				display:flex;  background-color: #2c3e50 ;margin-top:10px;
				
			}
			input {
				background-color: white;
			}
			.divlogin {
				width:375px;
				margin:auto;
			}
            .tafel table,.tafel th,.tafel td {
                border-collapse: collapse;
                color: white;
				margin:auto;

            }
            .tafel td {
                padding:0.3em ;
				width:7.25em;
            }
			
            th {
                padding:0.3em ;
                background: #777;
                background-color: #777;
                color: #fff;
            }
            tr.reihe td {
                background-color: #8f8c8c;
				overflow: hidden;
                position: relative;
				line-height:1;

            }
			tbody {
				padding:0px;
				margin:0px;
			}
           /* table tr:hover td { background: #ff9a01;}
            table tr td:hover {
                background: #ff6f02;
                color: black;
            }*/
			#tafel {
			margin:auto;
			}
			.tafel {
			background-color: gray;}
			.unternav {
				display: flex;
				flex-wrap: wrap;  
				justify-content: center;
			}
            .checkbox1 {
                display: none;
            }
            .markemt1a {
                margin-bottom: 30px;
            }
            .marke a:link, #sitenav2 a:visited {
                  color: black;
                  display: block;
                 width: 100%;
                  height:  100%;
                 text-decoration: none;
            }
			.dauerbelegt {
				background-color: #DAF7A6;
			}
            header {
                padding: 8px 50px;
                max-height: min-content;
                overflow: hidden;
				padding-bottom: 0px;
				background-color: white;
            }  
			        header1 {
                padding: 8px 8px;
                max-height: min-content;
                overflow: hidden;
            }   
            th {
                padding:0.3em ;
                background: #777;
                background-color: #777;
                color: #fff;
            }
            tr.reihe td {
                background-color: #8f8c8c;
                overflow: hidden;
                position: relative;
            }
            //table tr:hover td { background: #ff9a01;}
            //table tr td:hover {
             //   background: #ff6f02;
                color: black;
            }
            .checkbox1 {
                display: none;
            }
            .markemt1a {
                margin-bottom: 30px;
            }
        .marke a:link, #sitenav2 a:visited {
           color: black;
           display: block;
           width: 100%;
             height:  100%;
              text-decoration: none;
        }
        header {
                padding: 8px 8px;
                max-height: min-content;
                overflow: hidden;
            }   
		.header1 {
                padding: 8px 8px;
                max-height: min-content;
                overflow: hidden;
            }   

        input.stornieren {
                width: 60px;
                height:  25px;
				margin-left: -1.5em;
                border: none;
                background-color: red;
				color: white;
    width: 90px;
    height: 30px;
    margin-left: -2.5em;
            } 
        input.stornieren:hover {
			color:black;
            }
		input.button {
			padding:8px 12px;
			background-color:grey;
		}
				
        form.form1 {
                 right: 26px;
                 margin-left: 3.2em;
            }
        form.form4 {
                 right: 6em;
                 margin-left: 3.4em;
            }
       td > input{
                 padding:3px 8px;
				 text-align: right;
            }
			.alert {
				color: red;
				font-size: 200%;
			}
			.einleitung { flex:1; Text-align:right;padding-right:50px;}
		/*	.login {text-align:left; flex:1;} */
@media (max-width: 1059px) {			
.linkespalte {
	width:90%;margin:auto; background: white; padding: 20px;margin-bottom:30px;
}
.rechtespalte {
width:90%;margin:auto;  margin-bottom: 30px;background: white; padding: 20px;text-align:center;
}
}
@media (min-width: 1060px) {			
.linkespalte {
	width:42%; float: left;background: white; padding: 30px;margin-left: 50px;margin-bottom:50px;
}
.rechtespalte {
width: 42%; margin-left:52%; margin-bottom: 30px;background: white; padding: 30px;text-align:left;overflow:hidden; 
}
	
}	
 @media (min-width: 321px) {
/*	 	 .login {
		 width: 50%;
		 float:right;
		  } */
	 .login div {
		 /*padding-left: 30px;*/
	 }
	 }
 @media (max-width: 320px) {
	 /* .login {
		 width: 100%;
		 text-align:left;
		 margin-left:0px;
		 padding-left:20px;
	 }
	 .login div {
		 padding-left: 5px;
	 } */

 }
 @media (min-width: 321px) {
	 }
 @media (max-width: 620px) {
	 .einleitung {
		 width: 90%;
		 margin:auto;
		  text-align:center;
		  margin-bottom:20px;
	 }
 }
  @media (max-width: 560px) {
	 .sideright{
		 display:none;
	 }
	 	 .sideleft {
		 display:none;
	 }

 }
            body {
                width: 100%;
                margin: auto;
                font-size: 16px;
                font-family: Roboto, Arial;
				box-sizing: border-box;
            }
            .tafel td, .tafel table,.tafel th {
                border: 1px solid black;
                border-collapse: collapse;
                color: white;
            }
            th {
                padding:0.3em ;
                background: #777;
                background-color: #777;
                color: #fff;
            }
            tr.reihe td {
                background-color: #8f8c8c;
            }
            //table tr:hover td { background: #ff9a01;}
            //table tr td:hover {
               // background: #ff6f02;
               // color: black;
            }
            .marke {
                margin-bottom: 0px;
                padding-left: 3px;
				padding-right: 3px;
				padding: 3px;
                border: 1px solid black;
                border-right: 3px solid black;
                border-bottom: 3px solid black;
                background: white;
                box-shadow: 3px 3px 4px black;
                font-size: 80%;
                color: black;
				width:116px;
            }
			
            .checkbox1 {
                display: none;
            }
            .markemt1a {
                margin-bottom: 30px;
            }
            .marke a:link, #sitenav2 a:visited {
                  color: black;
                  display: block;
                 width: 100%;
                  height:  100%;
                 text-decoration: none;
            }
            header {
                padding: 10px 0px;
                max-height: min-content;
            }  
input.reservierenmitglied {
                width: 116px;
                height:  50px;
                background-color: #a2cd92;
				background-color:#6DD55C;
                border-radius: 0;
				margin-right:2px;
				margin-bottom:0px;
            }
input.reservieren{
                width: 96%;
                height:  50px;
                background-color: #a2cd92;
                border-radius: 0;
				margin-top:-30px;
				margin-right:5px;
				margin-bottom:4px;
            }
.link {
	background-color: #cccccc; padding: 12px; margin: 20px;float: left; color:black;text-decoration:none;
}
.containerwhite {
	background-color: white;
	width: 80%;
	margin:auto;
	text-align:center;
	padding: 20px;
}


body {
       font-size: 16px;
	   font-family:  Helvetica, Roboto, Arial;
}
            table.tafel {
               border-collapse: collapse;
                border: 1px solid black;
				margin:auto;
            }
            table tr {
               border-collapse: collapse;
               
            }
            table.mitglied td {
               border-collapse: collapse;
                border: 1px solid black;
                padding-left: 5px;
				height:50px;
            }

			.unternav {
				display: flex;
				flex-wrap: wrap;
				justify-content: center;
			}
.alert {
	text-align: center;
	font-size: 28px;
	color: red;
	
}
div.main {
    width: 800px; 
    margin: auto; 
    font-size: 18px;
}
			.headeroben {
				display:flex;  background-color: #abb2b9 ;margin-top:10px; 
			}
			.headerobendatenbank {
				display:flex;  margin-top:10px; list-style: none;
			}
			
			@media (min-width: 361px) AND (max-width: 852px) 
			{

		/*	.login {
				text-align:center;
				margin-bottom:20px;
				margin:right:0;
				width:100%;
			} */
			.einleitung {
				 text-align:center;padding-right:0px;margin-bottom:20px;
			}
			
			}
.containerwhite {
	background-color: white;
	width: 80%;
	margin:auto;
	text-align:center;
	padding: 20px;
}
.containerwhite>table{
	border: 10px solid blue;
}

form.f1 input {
    width: 80%; 
    font-size: 18px;
	padding: 5px;
	font-family: Helvetica;
	font-weight: 300;

}
.form2 input{
	width: 8em;
	
}
.table tr {
    background-color: white;
}
select {
    width: 30rem;
}
.clearfix:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}



ul.uloben1 {
	list-style: none;
	border: 1px solid lightgrey;
	display: flex;
	padding: 0.25rem;
	margin: 0.5rem;
	#justify-content: center;
}
.uloben1>li {
	flex: 1;
	flex-wrap:wrap;
}
nav {
    position: relative;
} 
nav.sitenav {
    position: fixed; 
    line-height: 1.5;
}
nav a:active {
    background-color: black;
}
nav.sitenav2 a {
    background-color: white;
    padding:  4px 8px;
     color: black;
     text-decoration: none;
}
nav a:hover {
    background-color: #808080;
    color: white;
}

ul{
       padding: 0rem;
       margin: 0rem;  
  }



.sitenav2 {
         box-sizing: border-box;
         padding: 10px;
         color: white;
}
.sitenav2 ul {
    padding: 0;
    margin: 0;
}

.sitenav2 >li{
    float: left;
    width: auto;
    list-style: none; 
    line-height: 2.5;
    padding: 0;
    padding-bottom: 0px;
    margin: 0;
        margin-right: 5px;
        background-color: white;

}

.sitenav2 a:link,
.sitenav2 a:visited {
    color: black;
    display: block;
    padding: 0px 8px;
    text-decoration: none;
}

.sitenav2 a:hover {
   background-color: #808080;
   color: white;
   text-decoration: none; 
}
.sitenav2 a:focus {
   background-color: white;
   color: black;
   text-decoration: none; 
   
}

.sitenav2 a:active {
   background: black;
   color: white; 
}





.sitenav2  ul.aufklappmenu1 li{
    clear: both;
    line-height: 1.5;
    width: 180px;
}
.sitenav2 ul.aufklappmenu1 {
    position: absolute;
    background-color: white;
    top: -32768px;
    left: -32768px;
    width: 0;
    height: 0;
}
.sitenav2 li:hover ul.aufklappmenu1 {
    left: auto;
    top: auto;
    width: auto;
    height: auto;
}

.sitenav1 {
         float: left;
         box-sizing: border-box;
         padding: 0;
         margin-left: 50px;
         margin: 0;
         position: relative;
         color: white;
}
.sitenav1 ul {
    padding: 0;
    margin: 0;
}

.sitenav1 >li{
    float: left;
    width: auto;
    list-style: none; 
    line-height: 1;
    padding: 0;
    margin: 0;
        margin-right: 5px;
        background-color: white;

}

.sitenav1 a:link,
.sitenav1 a:visited {
    color: black;
    display: block;
    padding: 8px 16px;
    text-decoration: none;
}

.sitenav1 a:hover {
   background-color: #808080;
   color: white;
   text-decoration: none; 
}
.sitenav1 a:focus {
   background-color: white;
   color: black;
   text-decoration: none; 
   
}

.sitenav1 a:active {
   background: black;
   color: white; 
}





.sitenav1  ul.aufklappmenu1 li{
    clear: both;
    line-height: 1.5;
    width: 131.5px;
}
.sitenav1 ul.aufklappmenu1 {
    position: absolute;
    background-color: white;
    top: -32768px;
    left: -32768px;
    width: 0;
    height: 0;
}
.sitenav1 li:hover ul.aufklappmenu1 {
    left: auto;
    top: auto;
    width: auto;
    height: auto;
}


@media (min-width: 941px)  {
    .logo {
        float: right;;
    }
    div.s1 {
    position: fixed;
    padding-left: 50px;
    padding-top: 10px;
}
    div.s2 {
    position: fixed;
    padding-left: 50px;
    padding-top: 10px;
}
as1,as2 {
    position: fixed;
    padding-left: 50px;
    padding-top: 10px;
}

    .sitenav2 li {
        line-height: 2;
        margin-top: 5px;
    }
.hand {
    margin-left: 50px;
}
}
@media (min-width: 361px) and (max-width: 940px) {
    .logo {
        display: none;
    }

    div.s1 {
    position: fixed;
    padding-left: 50px;
}
    div.s2 {
    position: fixed;
    padding-left: 50px;
}
as1,as2 {
    position: fixed;
    padding-left: 50px;
}
.containerwhite {
	background-color: white;
	width: 98%;
	margin:auto;
	text-align:center;
	padding: 20px;
}

}
@media (min-width: 1px) and (max-width: 360px) {
	
    .logo {
        display: none;
    }
.sitenav2 {
    float: none;
    width: 100%;
}
    .sitenav2 li {
        line-height: 2;
        margin-top: 5px;
        display: block;
        float: none;
    }

    .sitenav1 li {
        line-height: 2;
        margin-top: 5px;
        display: block;
        float: none;
    }
.br {
    display: none;
}
    div.s1 {
    padding-left: 5px;
}
    div.s2 {
    padding-left: 5px;
    margin-top: 105px;
}
.as2 {
    margin-top: 161px;
}
.hand {
    display: none;
}
.containerwhite {
	background-color: white;
	width: 98%;
	margin:auto;
	text-align:center;
	padding: 20px;
}

}

@media (min-width: 361px) and (max-width: 640px) {
    div.s1 {
        padding-left: 5px;
        margin-top: 5px;
    }

    div.s2 {
        padding-left: 5px;
        margin-top: 165px;
    }
}   
.footer {
	padding-left: 80px;
	padding-top: 30px;
	line-height:3;
	
}
td.uhrzeit{
	font-size:12px;
	width:70px;
	position: -webkit-sticky; /* Safari */
	position: sticky;
	left: 0;
	border-bottom: 1px solid white;
}
td:not(.uhrzeit, .Kalender) {
	
}

body {
   font-family: 'Bahnschrift';
   font-weight: normal;
   font-style: normal;
   
} 		
	body 
	{
		background-color:white;
	}
	.fontspez {
		font-family: 'FibelNordKonturRegular';
		font-weight: normal;
		font-style: normal;
	} 
	
	.tafel td {
		background-color:#2c3e50;
	}
	@media (min-width: 200px) AND (max-width: 852px) 
	{
		#PC {
			display:block;
			display:none;
		}
	}
	@media (min-width: 853px) AND (max-width: 2000px) 
	{
		#PC {
			width:904px;
			margin:auto;
		}
		.menue {
			text-align:center;
		}
		.menuewrapperpc {
			text-align:center;
		flex:1;line-height:1; padding-top: 20px;margin:auto;			
		}
		.menuepc {
			text-align:center;
			width: 265px;
			margin:auto;
		}
		.menuepc a{
			display:block;width:240px;padding: 8px 12px; background-color: #d4cdcd; color: black; text-decoration: none;margin:10px;
		}
	}
	@media (min-width: 200px) AND (max-width: 759px) 
	{
		#tablet {
			display:block;
		}
		.Hallo1 {
			width:770px;
			font-size:2em;
			margin:auto;	
			color:white;
			padding:10px;
		}
		
		.Hallo2 {
			width:750px;font-size:2em;
		}
		.menue {
			width:500px; 
			margin:auto;
			text-align:center;
			font-size:2em;
		}
		.menue a {
		display:block;width:100%;padding: 8px 12px; background-color: #d4cdcd; color: black; text-decoration: none;margin:10px;

		}
		a.circle {
			text-decoration: none; padding-top:10px;padding-right: 10px;padding-left:10px;width:50px; 
		}
	}
	@media (min-width: 760px) AND (max-width: 852px) 
	{
		#tablet {
			display:block;
		}
		.Hallo1 {
			width:770px;
			font-size:1em;
			margin:auto;	
			color:white;
			padding:10px;
		}
		
		.Hallo2 {
			width:700px;font-size:1em;
		}
		.menue {
			width:500px; 
			margin:auto;
			text-align:center;
			font-size:1em;
			
		}
		.menue a {
		display:block;width:100%;padding: 8px 12px; background-color: #d4cdcd; color: black; text-decoration: none;margin:10px;
		}
		a.circle {
			text-decoration: none; padding-top:10px;padding-right: 10px;padding-left:10px;width:50px; 
		}
	}
	@media (min-width: 853px) AND (max-width: 2000px) 
	{
		#tablet {
			display:block;
			display:none;
		}
	}
