﻿
:root {
	--colblue: #5986A7; /* blaue hintergründe */
	--colyellow: #FDD425; /* gelbe hintergründe */
    --colcopy: #2f2f31; /* copytexte dunkel */
    --colcopyonblue: #fff; /* texte auf colblue*/
    --collinksyellow: #FDD425; /* gelbe links auf blau*/
    --colblack:#2f2f31; /* edeka-schwarz*/
    --colwhite:#fafafa; /* offwhite */
    --colrot: #BC564B; /* edeka-rot #550D07*/
    
	--colmobmenubg: #2f2f31; /* mobile menühintergrund */

    --collinks: #1B4486; /* links auf colpage*/
    --collinksactive: #5986A7; /* hover über link*/
    --colpage: #f9f9f9; /* seitenhintergrund */
    
    --colr1: #FDD425; /* ranglisten rangnummern */
    --colr2: #FCE069; /* ranglisten rangnummern */
    --colr3: #F4E5A9; /* ranglisten rangnummern */
    --colr4: #858585; /* ranglisten rangnummern */
    --colr5: #AEADAD; /* ranglisten rangnummern */
    --colr6: #D6D6D6; /* ranglisten rangnummern */
    
    --colbtndefault: #1B4486;/* default button */
    --colbtndefaultactive: #2664C7;/* default button aktiv */
    --colbtnback:#858484;/* zurück/anderer button */
    --colbtnbackactive:#AAA9A9;/* zurück/anderer button aktiv */
    
    --focusdicke: 3px;
    --focusfarbe: var(--colyellow);
	--focusborder: var(--focusdicke) solid var(--focusfarbe);    
    
    }
    
 
    
@font-face {
  font-family: 'copy';
  font-style: normal;
  font-weight: 400;
  src: url(../fonts/EDEKATextWeb-Regular.woff) ;
}
@font-face {
  font-family: 'copyfett';
  font-style: normal;
  font-weight: 400;
  src: url(../fonts/EDEKATextWeb-Bold.woff) ;
}

@font-face {
  font-family: 'black';
  font-style: normal;
  font-weight: 400;
  src: url(../fonts/EDEKAHeadWEB-Black.woff) ;
}

@font-face {
  font-family: 'icons';
  font-style: normal;
  font-weight: 400;
  /*src: url(../fonts/MaterialIconsOutlined-RegularMini.otf?v=1.11) ;*/
  src: url(../fonts/MaterialIconsOutlined-Regular.otf) ;

}

html{
	scroll-behavior: smooth;
}
body {
    font-family: 'copy';
    font-size: 20px;
    color:var(--colcopy);
    margin: 0;
    line-height:1.35;
}

h1 {
	font-family:'black';	
}

h2 {
	font-family:'black';
	font-size:42px;	
	
}

p {
	font-family: 'copy';
	font-size: 20px;
	line-height:1.35;
}

.font42{
	font-size:42px;
	font-family:'black';
	margin:0;

}

.titel{
	font-size:42px;
	font-family:'black';	
	margin-top:0px;
	margin-bottom:10px;
}
.subtitel{
	font-size:35px;
	font-family:'black';
	margin-top:10px;
	margin-bottom:10px;	
}
.obertitel{
	font-size:15px;
	font-family:'copy';
	margin-bottom:-5px;	
}



a{
	text-decoration: none;
	outline:none;
	color:var(--collinks);
}

a:focus-visible{
	border:var(--focusborder);
}


.atext{
	color:var(--collinks);
	outline:none;
}

.atext::after{
	font-family:icons;
	font-size:19px;
    content: "\e5e1"; 
    display: inline; 
    background-size: contain; 
    background-repeat: no-repeat; 
    margin-left: 5px; 
    fill:currentColor;
    vertical-align:middle;
    padding-bottom: 0.3em;
    font-size:smaller;
    white-space:nowrap ;
	
}

.atext:focus-visible{
	border:var(--focusborder);

}

.abold{
	font-family:black;
	font-size:26px;
	text-transform:uppercase;
}

.abbtext{
	color:var(--collinksyellow);
	outline:none;
}

.abbtext::before{
    content: "»"; 
    display: inline; 
    margin-right: 5px; 	
}

.abbtext:focus-visible{
	border:var(--focusborder);

}




.mini{
	font-size:16px;
}

.zentriert {
	text-align:center ;
	align-self: center;
}

.verteilt{
	display:flex;
	justify-content:space-between;
	align-items:center;
	width:100%;
}
.fett{
	font-weight:400;
	font-family:copyfett;
}

.kursiv{
	font-style:italic ;
}
.capitals{
	text-transform:uppercase;
}

.dtend{
	float:right;
}
.dt800{
	width:800px;
}
.mt1{margin-top:10px !important;}
.mt2{margin-top:30px !important;}
.mt3{margin-top:60px !important;}
.mt4{margin-top:80px !important;}
.mt5{margin-top:100px !important;}

.mb1{margin-bottom:10px !important;}
.mb2{margin-bottom:30px !important;}
.mb3{margin-bottom:60px !important;}
.mb4{margin-bottom:80px !important;}
.mb5{margin-bottom:100px !important;}
.mb6{margin-bottom:180px !important;}


.me1{margin-right:10px;}
.me2{margin-right:20px;}
.me3{margin-right:30px;}
.me4{margin-right:40px;}
.me5{margin-right:50px;}

.zb1{max-width:300px;}
.zb2{max-width:400px;}
.zb3{max-width:600px;}
.zb4{max-width:770px;}
.zb5{max-width:1000px;}


.textmagenta{
	color:#FFFFFF;
}

.textonblue{
	color:#ffffff;
}

.textblue{
	color:var(--colblue);
}

.textyellow{
	color:var(--colyellow);
}

.bgblack{
	background-color:var(--colblack);
}



.listealpha{
	list-style-type:lower-alpha;
}
.listepunkte{
	list-style-type:disc;
}
.listespez{
	list-style-type:none;
	padding-left:0;
	
}
.listespez li{
	margin-top:30px;
}

.listespez2 {
	padding-left:20px;
	list-style-type:none;
}

.listespez3 li {
	margin-top:20px;
	list-style-type:square;
}

.tnbkarte{
	width:100%;
	max-width:800px;
}


.sogehtsmain {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;}

.sogehtszwei {
	display: flex;
	flex-wrap: wrap;
	width: 560px;
	margin: 0;
	justify-content: center;}

.sogehtsbox {
	background-color: #3498db;
	color: white;
	flex: 0 0 250px;
	padding: 00px;
	box-sizing: border-box;
	margin-right: 15px;
	margin-left: 15px;
	margin-bottom: 20px;
	height:250px;
	position:relative;

	justify-content:center;
	display:grid;
	}
	
.sogehtsbox img{
	height:125px;
	color:white;
	
	
}

.sgbtext{
	font-family:black;
	font-size: 28px;
	height:125px;
	width:250px;
	position:absolute;
	top:125px;	
	color:white;
	left:0;
	align-items: center;
	justify-content:center;
	text-align:center;
	line-height:1.1;
	display:flex;
}

.sogehtsbox bigger{
	font-size:33px;
}

.sgbgelb{	background-color:#FBBF06;}
.sgblila{	background-color:#A06AC3;}
.sgbblau{	background-color:#588DA9;}
.sgborange{	background-color:#FD971C;}
.sgbrot{	background-color:#BC564B;}



.sgbanmelden{
	background-image:url('data:image/svg+xml;charset=UTF-8,%3Csvg xmlns%3D%22http%3A//www.w3.org/2000/svg%22 height%3D%2224px%22 viewBox%3D%220 -960 960 960%22 width%3D%2224px%22 fill%3D%22%23ffffff%22%3E%3Cpath d%3D%22M80-160v-112q0-33 17-62t47-44q51-26 115-44t141-18q30 0 58.5 3t55.5 9l-70 70q-11-2-21.5-2H400q-71 0-127.5 17T180-306q-9 5-14.5 14t-5.5 20v32h250l80 80H80Zm542 16L484-282l56-56 82 82 202-202 56 56-258 258ZM400-480q-66 0-113-47t-47-113q0-66 47-113t113-47q66 0 113 47t47 113q0 66-47 113t-113 47Zm10 240Zm-10-320q33 0 56.5-23.5T480-640q0-33-23.5-56.5T400-720q-33 0-56.5 23.5T320-640q0 33 23.5 56.5T400-560Zm0-80Z%22/%3E%3C/svg%3E');
	width:125px;
	height:125px;
	background-size:cover;
}
.sgbphone{
	background-image:url('../bilder/smartphone1.png');
	width:125px;
	height:125px;
	scale:86%;
	background-size:cover;
	background-repeat:no-repeat ;

}
.sgbetappe{
	background-image:url('data:image/svg+xml;charset=UTF-8,%3Csvg xmlns%3D%22http%3A//www.w3.org/2000/svg%22 height%3D%2224px%22 viewBox%3D%220 -960 960 960%22 width%3D%2224px%22 fill%3D%22%23ffffff%22%3E%3Cpath d%3D%22m387-412 35-114-92-74h114l36-112 36 112h114l-93 74 35 114-92-71-93 71ZM240-40v-309q-38-42-59-96t-21-115q0-134 93-227t227-93q134 0 227 93t93 227q0 61-21 115t-59 96v309l-240-80-240 80Zm240-280q100 0 170-70t70-170q0-100-70-170t-170-70q-100 0-170 70t-70 170q0 100 70 170t170 70ZM320-159l160-41 160 41v-124q-35 20-75.5 31.5T480-240q-44 0-84.5-11.5T320-283v124Zm160-62Z%22/%3E%3C/svg%3E');
	width:125px;
	height:125px;
	background-size:cover;
	scale:90%;
}
.sgbgewinner{
	background-image:url('data:image/svg+xml;charset=UTF-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20height%3D%2224px%22%20viewBox%3D%220%20-960%20960%20960%22%20width%3D%2224px%22%20fill%3D%22%23ffffff%22%3E%3Cpath%20d%3D%22M280-120v-80h160v-124q-49-11-87.5-41.5T296-442q-75-9-125.5-65.5T120-640v-40q0-33%2023.5-56.5T200-760h80v-80h400v80h80q33%200%2056.5%2023.5T840-680v40q0%2076-50.5%20132.5T664-442q-18%2046-56.5%2076.5T520-324v124h160v80H280Zm0-408v-152h-80v40q0%2038%2022%2068.5t58%2043.5Zm200%20128q50%200%2085-35t35-85v-240H360v240q0%2050%2035%2085t85%2035Zm200-128q36-13%2058-43.5t22-68.5v-40h-80v152Zm-200-52Z%22%2F%3E%3C%2Fsvg%3E');
	width:125px;
	height:125px;
	background-size:cover;

}

.btnlink {
    display: inline-block; 
    background-color: var(--colbtndefault); 
    font-family:'black';
    font-size:30px;
    color: var(--colwhite); 
    text-align: center; 
    text-decoration: none; 
    cursor: pointer; 
    transition: background-color 0.3s, color 0.3s; 
	padding-left: 30px;
	padding-right: 30px;
	padding-top: 9px;
	padding-bottom: 9px;
	outline:none;   
}

.btnrot{
	background-color:var(--colwhite);
}

.btnlink:hover {
    background-color: var(--colbtndefaultactive); 
}

.btnlink::after {
	font-family:icons;
	font-size:30px;
    content: "\e5e1"; 
    display: inline-block; 
    margin-left: 8px; 
    fill:currentColor;
    transform: translateY(4px); 
}

.btnlink:focus-visible{
	border:var(--focusborder);
}

.btns {
    display: inline-block; 
    background-color: var(--colbtnback); 
    color: white; 
    text-align: center; 
    text-decoration: none; 
    border: 0px solid white; 
    border-radius: 0px; 
    cursor: pointer; 
    transition: background-color 0.3s, color 0.3s; 
	padding-left: 60px;
	padding-right: 60px;
	padding-top: 10px;
	padding-bottom: 10px;
	outline:none;   
	font-family:black;
	font-size:30px;
	text-transform:uppercase;
}

.btnback {

}

.btnback:hover{
	background-color: var(--colbtnbackactive);
	}

.btnback::before{
	  font-family: icons;
	  font-size: 30px;
	  content: "\e2ea";
	  display: inline-block;
	  
	  fill: currentColor;
	  transform: translateY(4px) translateX(-15px);
	}

.btnback:focus-visible{
	border:var(--focusborder);
	}
	
.btngo{
	background-color:var(--colbtndefault);
}
.btngo:hover{
	background-color:var(--colbtndefaultactive);
	}

.btngo::after{
	  font-family: icons;
	  font-size: 30px;
	  content: "\e5e1";
	  display: inline-block;
	  
	  fill: currentColor;
	  transform: translateY(4px) translateX(15px);
	}

.btngo:focus-visible{
	border:var(--focusborder);
	}







#hintergrund {
    background-color: var(--colpage); 
    width: 100%; 
    min-height: 100vh; 
    display: flex; 
    flex-direction: column;
    align-items: center; 
    overflow:hidden;
}

.spalten{
	width:100%;
    max-width: 1363px;
	overflow:hidden;
    padding: 0px;  
    border:0px solid green; 
    display:flex;  
    flex-direction:column;
    background-color:var(--colwhite);
}

.spalten p{

}

.spLevelA{
	padding-left:100px;
	padding-right:100px;

}
.spLevelB{
	padding-left:150px;
	padding-right:150px;

}

.weite100{
	width:100%;
	border:0px solid blue; 
    display: flex; 
    flex-direction: column;
	align-items: center;
}

.weite90{
	width:90%;
	min-width:1363px;
	max-width:1640px;
	border:0px solid yellow; 
    display: flex; 
    flex-direction: column;
	align-items: center;
}

#regtop{
	scroll-margin-top: 416px;
}

.bluebox{
	background-image:url('../bilder/soccer.png');
	background-color: var(--colblue);
	background-size: 90%;
	background-repeat: no-repeat;
	background-position-y: -250px;
	background-position-x: -411px;	
	background-blend-mode: soft-light;
	color:var(--colcopyonblue);
	padding-left:150px;
	padding-right:150px;
	padding-top:20px;
	padding-bottom:20px;
}

.mobmenu {
    display: none; 
}
.footer{
	border:0px solid red;
}
.mobfooter{
	display:none;
}

.logotop{
	width:140px;
}

.menutopbg{
	position:fixed;
	width:100%;
	z-index:999;
	display:flex;
	justify-content:center;
	background-color:var(--colblack);
}

.hamburgerlogo{
	display:none;
}
.menutop{

	z-index:1000;

	background-image:url('../bilder/header-vereinscup_2026.webp');
	height:411px;
	max-width:1366px;
	width:100%;
	border-bottom:0px solid green;
	background-size: contain;
}

.menutoplogo{
	margin-top:20px;
}
.menutoplogo>img{
	margin-bottom:-20px;
}
.menutoplinks{
	position:relative;
	left:00px;
	top:370px;
	height:40px;
	
	
}
.menutoplinks ul {
    list-style-type: none; 
    margin: 0; 
    padding: 0 0 0 50px; 
    display: flex; 
   
    
}

.menutoplinks li {
    margin-left:50px; 
}

.menutoplinks a {
    color: white; 
    text-decoration: none; 
    font-size:25px;
    font-family:black;
}

.pp1,.pp2,.pp3,.pp4,.pp5,.pp6{
	color:white;
}





.vabstand200{
	margin-top:460px;
}

.titelcontent{

	border:0px solid orange;
	width:1078px;
}

.titelsvg{
	width:100%;
}

.hamburgerbg{
	display:none ;
}

.hamburger {
    display: none;
}





.contagb >span {
    flex-grow: 1; 
    word-wrap: anywhere;
}
.contagb{
	display: flex;
    cursor: pointer;
    align-items: end;
}


#agbOK {
	margin-right: 20px;
	display: none;
   }

#chksym {
    font-family: icons;
    outline:none;
}
[role=checkbox] {
    padding: 5px;
}

[role=checkbox]:focus-visible {
    border: var(--focusborder);
}

[aria-checked=true]::before {
    content: "\e834";
}

[aria-checked=false]::before {
    content: "\e835";
}
.checkmark{
	font-size:45px;
	margin-right:20px;
}



#ErrMsg, #ErrMsgReg{
	color:var(--colrot);
	font-size:30px;
	background-color:var(--colwhite);
	text-align:center;
}




/* ------vereinssuche und registration----------- */
    #suchwrapper{
	
}    	
    #results {


        width:100%;
        display:flex;
        flex-direction:column;
        overflow-y: auto;
        list-style-type: none;     
        padding-left:0px;
        transition: height 0.5s ease; 
		position: relative; 
		background-color: var(--colwhite);
		top: 5px;
		left: 0px;    
		border-radius: 0px;
		color:black;
		margin:0;
        }
            
    #results li { 
	    padding: 0px;
	    cursor: pointer; 
	    border-bottom:1px solid silver; 
    }
    #results li:hover, #results li:focus {
    	background-color: #F4E5A9; 
    	outline:none; 
  
    	}
    	
	#results li:hover a{color:white	}
	
	#resultstitle{
	visibility:hidden;
}
		
	.result-container {
	    display: flex; 
	    justify-content: flex-start; 
	}        
	
	.result-verein {
	    width:50%; 
	    padding: 15px;
	    overflow: hidden; 
	    text-overflow: ellipsis; /* ...*/
	    white-space: nowrap; 
	}
	.result-plzort {
	    flex: 1; 
	    padding: 15px;
	    overflow: hidden; 
	    text-overflow: ellipsis; /* ...*/
	    white-space: nowrap; 
	}
	.result-punkte {
	    width: 150px; 
	    padding: 15px; 
	    box-sizing: border-box; 
	    text-align:center;
	    background-color:var(--colyellow);
	}
	.result-nopunkte{
	    width: 150px; 
	    padding: 15px; 
	    text-align:center;
	    box-sizing: border-box; 
		background-color:#D6D6D6;
	}
	.nobg{
		background-color:transparent;}
		
	.nopadbottom{
		padding-bottom:0px;
	}
		
	.barVerein{
		color:black;
		background-color:white;
	}
       
        
        
    #SucheVereinbox{ 
    
	    height:75px;
	    padding:20px;
	    box-sizing:border-box;
	    background-color:white;
	    display:flex;
	    align-items: center;
	    position:relative;
    }
    
    #SucheVereinbox:focus-within{
		border:var(--focusborder);
}
    
    #SucheVereinTreffer{
	}	
	
	
    #search{ 
	    flex:1;
	    border:0px;
	    outline:none;
	    height:100%; 
	    font-size: inherit;
    }	
    #search:focus{
		border:0px;
		outline:none;
	}
 	#search:focus-visible{
		outline:0px solid var(--colblue);	
		color:black;
		border: 0px solid var(--colyellow);
		padding-left: 5px;
	} 
	  
	  
#go123 {
    display: flex;
    justify-content: space-between; 
    align-items: flex-end;
    position: relative;
    width: 100%; 
    max-width: 900px; 
    margin: 20px auto;
    }
#go123::before {
    content: '';
    position: absolute;
    width: calc(100% - 100px); 
    height: 1px; 
    background-color: white;
    top: 30%; 
    left: 50%; 
    transform: translateX(-50%); 
    z-index: 0; }

#go1 {
   
}

#go2 {
     
}	  
.gostep {
    width: 50px;
    height: 50px;
    background-color: var(--colr2);
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;

    z-index: 1;

     }	  

.gostep-label {
    text-align: center; 
    margin-top: 5px; 
    font-size: 14px; 
    color: black;
}
.gostep-container {
    display: flex;
    flex-direction: column;
    align-items: center;   
}

#mvEmail,#mvVerein,#mvOrt{
	color:var(--colyellow);
}

/* ranglisten -----------------------*/
	.mainranking{
		display: flex; 
        flex-wrap: wrap;
        justify-content: center;
}
    .rangliste {
        border: 1px solid var(--colblue); 
        width:400px;
		max-height: 500px;
		overflow: hidden; 
		margin-left:15px;
		margin-right:15px;
		margin-bottom: 40px;
	}
	.ranglistetitel{
		background-color:var(--colblue);
		height:50px;
		color:white;
		font-family:black;
		font-size:36px;
		padding-left:20px;
		
	}	
	.rangul {
	    
	    justify-content: flex-start; 
 
        list-style-type: none; 
        padding:0px; 
        margin:0;   
	}  
    
	.rangli{
		display:flex;
		width:100%;
		border-bottom:1px solid var(--colblue);
}  

	.rangnum {
	    width:50px; 
	    box-sizing:border-box;
	    overflow: hidden; 
	    text-align:center;
	    font-family:black;
	    white-space: nowrap; 
	    color:white;
	    font-size:36px;
	    padding-top:3px;
	}
	.rangverein {
	    flex: 1; 
	    font-size:16px;
	    padding: 5px;
	    overflow: hidden; 
	    text-overflow: ellipsis;  /* ...*/
	    /*white-space: nowrap; */
	}
	
	.rcol1{background-color:var(--colr1)}
	.rcol2{background-color:var(--colr2)}
	.rcol3{background-color:var(--colr3)}
	.rcol4{background-color:var(--colr4)}
	.rcol5{background-color:var(--colr5)}
	.rcol6{background-color:var(--colr6)}
	


/* etappen sieger inkl. mobile */

#etappensieger{
	display:none;
}
.estable, .finaltable {
    width: 100%;
    border-collapse: collapse;
}

.estable th, .estable td, .finaltable th, .finaltable td {
    border: 1px solid var(--colblue);
    padding: 20px;
    text-align: start;
}

.estable td,.finaltable td{
	line-height:28px;
	height:90px;
	text-align:start;
	
}

.eslogo {
    width: 150px;
    height:150px;
    background-color:#FBBF06;
    background-image:url('data:image/svg+xml;charset=UTF-8,%3Csvg xmlns%3D%22http%3A//www.w3.org/2000/svg%22 height%3D%2224px%22 viewBox%3D%220 -960 960 960%22 width%3D%2224px%22 fill%3D%22%23ffffff%22%3E%3Cpath d%3D%22m387-412 35-114-92-74h114l36-112 36 112h114l-93 74 35 114-92-71-93 71ZM240-40v-309q-38-42-59-96t-21-115q0-134 93-227t227-93q134 0 227 93t93 227q0 61-21 115t-59 96v309l-240-80-240 80Zm240-280q100 0 170-70t70-170q0-100-70-170t-170-70q-100 0-170 70t-70 170q0 100 70 170t170 70ZM320-159l160-41 160 41v-124q-35 20-75.5 31.5T480-240q-44 0-84.5-11.5T320-283v124Zm160-62Z%22/%3E%3C/svg%3E');
    fill:white;
	background-size: 55%;
	background-repeat: no-repeat;
	background-position: center;
}
.finallogo {
    width: 150px;
    height:150px;
    background-color:#FBBF06;
	background-image: url('data:image/svg+xml;charset=UTF-8,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20height%3D%2224px%22%20viewBox%3D%220%20-960%20960%20960%22%20width%3D%2224px%22%20fill%3D%22%23ffffff%22%3E%3Cpath%20d%3D%22M280-120v-80h160v-124q-49-11-87.5-41.5T296-442q-75-9-125.5-65.5T120-640v-40q0-33%2023.5-56.5T200-760h80v-80h400v80h80q33%200%2056.5%2023.5T840-680v40q0%2076-50.5%20132.5T664-442q-18%2046-56.5%2076.5T520-324v124h160v80H280Zm0-408v-152h-80v40q0%2038%2022%2068.5t58%2043.5Zm200%20128q50%200%2085-35t35-85v-240H360v240q0%2050%2035%2085t85%2035Zm200-128q36-13%2058-43.5t22-68.5v-40h-80v152Zm-200-52Z%22/%3E%3C/svg%3E');
	fill:white;
	background-size: 55%;
	background-repeat: no-repeat;
	background-position: center;
}

.estext {
    width: calc(100% - 150px);
    font-family:'black';
    font-size:44px;
    font-weight:400;
    color:white;
    background-color:var(--colblue);
}

.esLaufzeit{
	font-size:20px;
	color:white;
	margin-bottom:10px;
}
.esEtappe{
	font-size:46px;
	font-family:'black';
	color:white;	
}
.estitelY{
	background-color:#FD971C;
}
.finaltitelY{
	background-color:#BC564B;
}

.esdata{
	background-color:white;
	width:280px;
}


@media (max-width: 900px) {
    .estable, .estable th, .estable td, .finaltable, .finaltable th, .finaltable td  {
        display: table;
        width: 100%;
        text-align:center;
    }
	.estable td, .finaltable td{
		line-height:40px;
		height:50px;
		text-align:center;
	}

    .estable th, .finaltable th {
        text-align: center;
    }
    .esLaufzeit{
		margin-bottom:0px;
	}
	.esEtappe{
		margin-bottom:10px;
		font-size:43px;
		}
	.eslogo, .finallogo{
		background-size: auto 80%; 
    	background-repeat: no-repeat;
    	background-position:center;
	}
	
	
}


/*--------*/
.appteaser {
    width: 100%; 
    
    aspect-ratio: 4.08/1;
    overflow: hidden;    
    position: relative; 
}

.appteaser img {
    width: 100%;
    height: auto; 
    transition: transform 550ms ease; 
    top: -23%;
	position: absolute;
}

.appteaser:hover img {
    transform: scale(1.1); 
}


/*-----vereinsliste in tabelle inkl. handyversion-------*/

	#filterVereinsliste {
	    display: flex;
	    align-items: stretch; 
	    border: 2px solid #ccc; 
	    width: 100%; 
	    height: 80px; 
	  

	}
	#filterVereinsliste:focus-within {
	    outline: 2px solid var(--colyellow); 
	    border: 0px solid black;
	}
	#inputFilter {
	    flex: 1; 
	    border: none; 
	    padding: 20px; 
	    font-size:20px;	  
	    min-width: 0;  
	}
	
	
	#cmdFilter:hover {
	    background-color: var(--colbtndefaultactive); 
	}
		
	#cmdFilter {
	    display: inline-block; 
	    width: 100px; 
	    background-color: var(--colbtndefault); 
	    color: white; 
	    border: none; 
		outline:none;   
	    cursor: pointer; 
		padding: 10px;
		font-family:black;
		font-size:20px;
	    text-align: center; 
		text-transform:uppercase;
	    transition: background-color 0.3s, color 0.3s; 
	}
	#cmdFilter:hover{
		background-color:var(--colbtnbackactive);
}

	#BtnsPrevNextContainer {
	    display: flex;                 
	    align-items: center;          
	    justify-content: center;        
	    gap: 10px;                    
	}
	
	#prevButton, #nextButton {
	    background: none;              
	    border: none;                  
	    cursor: pointer;   
	    outline:none;           
	}
	
	#nextButton>svg, #prevButton>svg{
		fill:var(--collinks);   
		height:50px;width:50px; 	
	}
	#prevButton:disabled>svg,
	#nextButton:disabled>svg {
    	fill: #ccc; 
    	cursor: not-allowed;    
    	opacity: 0.6;           
	}

	#prevButton:focus-visible,
	#nextButton:focus-visible {
		border:var(--focusborder);
	}

	
	#lblVcurrpage {
	    font-size: 16px;  
	    font-family:copy;     
	    color:var(--collinks)     
	}
	
	
	#tblVereine {width:100%;border-collapse:collapse;font-size:16px;
		color:var(--colblack);font-family:copyfett;font-weight:400}
		
	#tblVereine td, #tblVereine th{
		padding:12px 15px;border:1px solid #fff;text-align:left;
		}
	#tblVereine td:nth-child(3){
		
		text-align:right;
	}
	#tblVereine th{
		background-color:#ffffff}
		
	#tblVereine tbody tr:nth-child(even)
		{background-color:#f1f1f1}
	
	.tdpunkte{background-color:var(--colyellow);}
	.tdnopunkte{background-color:silver;text-align:center !important;}
	
	/*12.3.2026*/
	#tblVereine tbody tr {
	    cursor: pointer; 
	}

	#tblVereine tbody tr:hover {
	    background-color: #e0e0e0; 
	}	
	
	@media (max-width:600px){
		#tblVereine thead{display:none}
		#tblVereine,#tblVereine tbody,#tblVereine tr,
		#tblVereine td{display:block;}
		#tblVereine tr{margin-bottom:15px}
		#tblVereine td{padding-left:10px;text-align:left;position:relative}
		#xtblVereine td::before{content:attr(data-label);
			position:absolute;left:0;width:50%;padding-left:15px;
			font-size:15px;font-weight:bold;text-align:left}
	}
	
/*-----ende vereinsliste in tabelle*/
	
	
/*vereinsanmeldung*/	
#neuerverein-form {
    max-width: 100%;
}

.inputblock {
    margin-bottom: 15px;
    width:100%;

}

.inputblock label {
    display: block;
    margin-bottom: 5px;
    font-family:copy;
    font-size:18px;

}

.inputblock input, .inputblock select {
    width: 100%;
    padding: 20px;
    border: 1px solid #ccc;
    font-family:copy;
    font-size:20px;
    box-sizing: border-box;   
    outline:none;
	
}
.inputblock input:focus-visible, .inputblock select:focus-visible {
	border:var(--focusborder);
}

.visually-hidden {
    position: absolute;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    height: 1px;
    width: 1px;
    margin: -1px;
    padding: 0;
    border: 0;
}

.emailgruppe{
	display:flex;
	justify-content:space-between;	
}

.emailgruppe .inputblock:first-child{
	margin-right:30px;
	flex:1;

}
.emailgruppe .inputblock:nth-child(2){

	flex:1;
}

.ortgruppe{
	display:flex;
	justify-content:space-between;
}
.ortgruppe .inputblock:first-child{
	width:150px;
	margin-right:30px;
}
.ortgruppe .inputblock:nth-child(2){
	flex:1 !important;
}

#neuerverein-form input:invalid, #neuerverein-form select:invalid {
     
}

#neuerverein-form input:focus-visible, #neuerverein-form select:focus-visible{
    border: var(--focusborder); 
}

#neuerverein-form input:focus, #neuerverein-form select:focus {
     
    outline:none;
}

.leer{
	opacity: 0;
	position: absolute;
	top: 0;
}
.lassen{
	left: 0;
	height: 0;
	width: 0;
	z-index: -1;	
}

/*--ende vereinsanmeldung*/
	
	
	
	

.sternlitext{
	display:flex;
	align-items:flex-start;
	padding-right: 30px;
}
.sternlisym{
	margin-right:8px;
}

.grid1{	grid-column: span 1;}
.grid2{	grid-column: span 2;}
.grid4{	grid-column: span 4;}
.grid5{	grid-column: span 5;}
.grid6{	grid-column: span 6;}
.grid7{	grid-column: span 7;}
.grid8{	grid-column: span 8;}


.initgrid{
	display: grid;
    grid-template-columns: repeat(12, 1fr);
}
		
.w100{
	width:100%;
}	


#mobileaktiv{
	opacity:0;
}

    .footerbar {
	    display: flex;
	    flex-direction: row; 
	    align-items: baseline;
	    justify-content: space-between; 
	    background-color: var(--colblack);
	    height:200px}
    
    .footerlogo {
        flex: 1; 
        text-align: left;
        top:95px;
        position:relative ; }

    .footerlinks{
	    display: flex;
	    justify-content: flex-end; 
	    position:relative;
	    top:95px}
    
    .footerlink{
		margin-left:70px;
		color:var(--colwhite);
		}
	.footerimg{
		width:320px;
}



/*------------------------------------------mobile -----------------------------------------*/



@media screen and (max-width: 1363px) {

	.footerbar {
        flex-direction: column; 
        align-items: stretch;	}
	
	.footerlogo {
	    margin-bottom: 10px; 	
	    align-self:center;
	    top:30px}
	
	.footerlinks {
		display: flex;
        width: 100%; 
        justify-content: space-between; 
        top:0px;
              	}
        
    .footerlink{
		margin-left:10px;
		margin-right:10px;
		margin-bottom:10px}


	#mobileaktiv{
		opacity:1;
	}
	
	
	.vabstand200{
		margin-top:73px;
		border:0px solid fuchsia;
		width:100%;
		height:0px;
		
	}
	
	.hamburgerbg{
		display:grid ;
		position:fixed;
		background-color:var(--colblack) ;
		width:100%;
		height:50px;
		z-index:2000;
	}
	
	.hamburgerlogo{
		position:absolute;
		display:inline-block;
		justify-self:start;
		height: 35px;
	    padding: 0px;	
		top:8px;
		margin-left:20px;
		
	}
	
	.hamburger{
	    font-size: 30px;
	    cursor: pointer;
	    background-color: var(--colblack);
	    color: white;
	
		position:absolute;
		display:inline-block;
		justify-self:end;
		
	    padding: 0px;	
		top:2px;
		margin-right:20px;
		outline:none;
		}
		
	.hamburger:focus-visible{
		border:var(--focusborder);
	}
	
	#regtop{
		scroll-margin-top: 60px;
	}
	
	.bluebox{
		background-image:none;
		color:var(--colcopyonblue);
		padding-left:20px;
		padding-right:20px;
		padding-top:20px;
		padding-bottom:20px;
	}
	
	#resultstitle{
		height:0;
	}
	.result-container{
		display:grid;
		grid-template-columns: 1fr;
	}
	.result-verein{
		width:auto;
		text-overflow:unset;
		white-space:pre-wrap;
	}
	.result-plzort{
		text-overflow:unset;
		white-space:pre-wrap;
}
	.result-punkte {
	    width: 100%; 
	}
	.result-nopunkte{
	    width: 100%; 
	}
	
	.result-punkte::after,.result-nopunkte::after{
		content:' Punkte';
	}
	
	.emailgruppe,.ortgruppe{
		display:block;
	}
	.ortgruppe .inputblock:first-child{
		width:100%;
	}
	.btnback{
		margin-bottom:30px;
	}
	
	.btns{
		padding-left:30px;
		padding-right:30px;
	}
	.verteilt{
		display:block;
	}
	.spalten{
		width:100%;
	    max-width: none;
	    min-width:  auto;
	    border:0px solid red;}
	    
	.spLevelA{
		padding-left:20px;
		padding-right:20px;
	
	}
	.spLevelB{
		padding-left:40px;
		padding-right:40px;
	
	}
	
	.weite90{
		width:100vw;
		max-width: none;
	    min-width:  auto;
		}
		
		
		
		
	.logotop{
		width:50px;
		}
	.menutoplogo{
		width:60px;
		height:70px;
		margin-left:20px;
	}
	.menutoplinks{
		display:none;
		}
	.menutopbg{
		position:relative;
	}
	.menutop{
		z-index:1000;
		background-repeat: no-repeat;
		background-position:top;
		width:100%;
		top:50px;
		position:relative ;
		aspect-ratio: 1350 / 407;
	
		height: auto;
	
		background-size: cover;
		}
	
	.mobmenu {
	    display: none; 
	    background-color: var(--colblue);

	    position: fixed; /*absolute;*/
	    top: 0px; 
	    left: 0;
	    width: 100%;
	    min-height: 100vh;
	    font-family:black;
	    font-size:39px; 
	    
	}
	
	.mobmenu a {
	    display: block;
	    padding-left: 20px;
	    text-decoration: none;
	    color: #fff;
	    
	}
	
	.mobmenu a:hover {
	    color:var(--colyellow);
	}
		
	.mobmenulinks{
		position:absolute;
		top:75px;
		line-height: 1.8;
	}
	.mobmenutitel{
		max-width:200px;
		width:100%;
		border:0px solid orange;
		position:relative;
		padding-top:30px;
		margin-left: -3px;
		}
		
	.mobtitelsvg{
		width:100%
	}
	
	.titelcontent{
		width:90%;
		max-width:1078px;
		align-self:center;
	
	}
	
	.font42{
		font-size:35px;
	}
	
	.dtfooter {
		display:none;
	}
	.mobfooter{
		display:flex;
		flex-direction:column;
		align-items:end;
		margin-top:100px;
		margin-bottom:50px;
		background-color:var(--colblack);
	}
	.mobfooterlinks{
		width:220px;
		margin-right:60px;
		position:absolute;
		margin-top:46px;
		font-size: 12px;
		word-spacing: 5px;
	}
	.mobfooterlinks a{
		font-family:copy;
		font-size:12px;
		text-decoration:none;
		color:var(--colwhite);
	}
	
	.mobfooterlogo{
		align-self:end;
		float:right;
		padding-right:20px;
	}
	.mobfooterlogo > img {
			width:50px;
	}
	
	    
	    
	 /* --- */ 
	 
	
	.grid1{	grid-column: span 1;}
	.grid2{	grid-column: span 1;}
	.grid4{	grid-column: span 1;}
	.grid5{	grid-column: span 1;}
	.grid6{	grid-column: span 1;}
	.grid7{	grid-column: span 1;}
	.grid8{	grid-column: span 1;}
	
	.initgrid{
		display: table;
	    grid-template-columns: 1fr;
	}
	.mcenter {
		text-align:center ;
	    display: block; 
	    margin: 0 auto; 
	    width: fit-content; 
	}
	
	.dtend{
		float:none;
	}
	.dt800{
		width:auto;
	}
	.mend{
		float:right;
	}
	
	.mt1{margin-top:10px !important;}
	.mt3{margin-top:30px !important;}
	.mt4{margin-top:40px !important;}
	.mt5{margin-top:60px !important;}
	
	.mmt1{margin-top:10px !important;}
	.mmt3{margin-top:30px !important;}
	.mmt4{margin-top:50px !important;}
	.mmt5{margin-top:80px !important;}
	.mmt7{margin-top:130px !important;}
	
	.mmb1{margin-bottom:10px !important;}
	.mmb3{margin-bottom:30px !important;}
	.mmb4{margin-bottom:50px !important;}
	.mmb5{margin-bottom:80px !important;}
	
	
	
	.me1{margin-right:0;}
	.me2{margin-right:0;}
	.me3{margin-right:0;}
	.me4{margin-right:0;}
	.me5{margin-right:0;}
	
	.mme1{margin-right:10px;}
	.mme2{margin-right:20px;}
	.mme3{margin-right:30px;}
	.mme4{margin-right:40px;}
	.mme5{margin-right:50px;}
	
	.padlr1{padding-left:10px;padding-right:10px}
	.padlr2{padding-left:20px;padding-right:20px}
	.padlr3{padding-left:30px;padding-right:30px}
	
	
	/*startseite mobile */
	
	#search{ 
		font-size:18px;
	}

}