
:root{
    --primary:#A9D400;
    --primary-hover:#B7E600;
    --bg:#111111;
    --surface:#050505;
    --surface-2:#1c1c1c;
    --text:#f2f2f2;
    --muted:#cfcfcf;
    --border:#5a5a5a;
	--black:#000000;
	--white:#FFFFFF;
	--green:#A9D400;
}


*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

body{
    font-family:'Oswald',Arial,sans-serif;
    background:var(--black);
    color:var(--text);
}

.hero{
    padding:80px 20px;
    text-align:center;
    <!-- background:linear-gradient(
        rgba(0,0,0,.7),
        rgba(0,0,0,.7) -->
	background:var(--black);
    ),
    url("images/arena-bg.jpg");

    background-size:cover;
    background-position:center;
}

.logo{
    max-width:500px;
    width:100%;
    margin-bottom:30px;
}

.hero h1{
    font-size:60px;
    margin-bottom:20px;
}

.hero p{
    max-width:800px;
    margin:auto;
    font-size:20px;
}

.container{
    width:min(1920px,95%);
    margin:00px auto;
	background: var (--black);
}

.cell{
    display:flex;
    align-items:center;
    gap:20px;
    padding:12px 20px;
    border-right:1px solid var(--border);
}

.cell:last-child{
    border-right:none;
}

.cell .icon{

    width:56px;
    min-width:56px;

    display:flex;
    justify-content:center;
    align-items:center;
}

.cell .icon img{
}

.cell .content{
    display:flex;
    flex-direction:column;
}

.content{

    display:flex;
    flex-direction:column;
    justify-content:center;

    font-size:2rem;
    line-height:1.2;

    font-weight:700;

}
.schedule{
	
    border:1px solid var(--border);
    border-radius:12px;
    overflow:hidden;
    background:#000;
	border-bottom:1px solid var(--border);
}

.schedule-header,
.schedule-row{
    display:grid;
    grid-template-columns:20% 25% 19% 36%;

}

.schedule-header{
    background:var(--primary);
    color:#111;
	min-height:90px;
}

.schedule-header .cell{

    padding:0 24px;

}

.schedule-header small{
    margin-top:0;
    line-height:1;
}

.schedule_logos{
    width:100%;
    background:var(--black);
}

.icon{

    width:56px;
    min-width:56px;

    display:flex;
    justify-content:center;
    align-items:center;

}

.icon img{

    width:46px;
    height:46px;

}
.schedule-row{
    background:var (--black);
    border-top:1px solid var(--border);
    transition:.25s;
}

.schedule-row:hover{
    background:var (--black);
}


.date strong{
    color:var(--primary);
    font-size:2rem;
}

.date{
    font-size:2rem;
}

.league{
    font-size:1.8rem;
    line-height:1.2;
	font-weight:500;
    text-transform:uppercase;
}

.main-time{
    font-size:2rem;
    font-weight:700;
}

.entry{
    color:var(--primary);
    font-size:1.4rem;
}

.time{
    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:flex-start;
	gap:2px;          /* Abstand zwischen den Zeilen */
    line-height:1;
}

.title{
    font-size:2rem;
    font-weight:700;
}

.subtitle{
    font-size:1.4rem;
    font-weight:400;
}

.match{
    font-size:2rem;
    font-weight:700;
    text-transform:uppercase;
}

.cta{
    margin:60px 0;
    text-align:center;
}

.cta h2{
    color:var(--primary);
    font-size:2.2rem;
    margin-bottom:10px;
}

.cta p{
    color:#ddd;
    margin-bottom:30px;
}

.button{
	display:inline-block;
	background:#A9D400;
	color:#111;
	font-size: 2rem;
	text-decoration:none;
	padding:14px 28px;
	border-radius:8px;
	font-weight:bold;
	margin-top: 60px;
}

.button:hover{
    background:var(--primary-hover);
}

.headline_big{
    text-align:center;
    font-size:33px;
	font-weight: bold;
    margin-bottom:20px;
    color:var(--green);
}
	

.footer{margin-top:40px;padding:40px;text-align:center;border-top:1px solid #333}
.footer a{color:var(--green);text-decoration:none;}

@media (max-width:1920px){

.schedule-header{
    display:none;
}

.schedule-row{
    grid-template-columns:1fr;
}

.schedule-row>div{
    border-right:none;
    border-bottom:1px solid #333;
}

.schedule-row>div:last-child{
    border-bottom:none;
}



.hero h1{
    font-size:2.2rem;
}

}

