body {
            margin: 0;
            padding: 0;
            font-family: 'Roboto Condensed', sans-serif;
            background-color: #c6c6c6; /* Tło o kolorze #c6c6c6 */
            color: #222; /* Kolor tekstu */
            position: relative; /* Ustawienie pozycji względem body */
        }

        .title {
            font-size: 1.5em;
            text-align: left;
            margin-left: 0px;
            position: absolute; /* Ustawienie absolutnej pozycji */
            top: 3px; /* Ustawienie napisu na samej górze */
            left: 20px; /* Odstęp od lewej */
            text-transform: uppercase; /* Wszystkie litery wielkie */
        }

        .main-banner {
            width: calc(100% - 30px); /* Szerokość banera mniejsza o 40px niż szerokość ekranu */
            background-color: #f5f5f5; /* Jaśniejsze tło dla banera */
            padding: 2px; /* Wewnętrzne marginesy dla banera */
            padding-left: 10px;
			position: absolute; /* Ustawienie absolutnej pozycji */
            top: calc(100% + 30px); /* Przesunięcie banera pod napis z nazwą zawodów */
            left: 10px; /* Wyśrodkowanie poziome banera */
            border-radius: 5px; /* Zaokrąglenie rogów */
        }
        
        
		
		.current-result {
           width: calc(100% - 30px); /* Szerokość banera mniejsza o 40px niż szerokość ekranu */
		   height: 139px;
            background-color: #f5f5f5; /* Jaśniejsze tło dla banera */
            padding: 2px; /* Wewnętrzne marginesy dla banera */
            padding-left: 10px;
			position: absolute; /* Ustawienie absolutnej pozycji */
            top: calc(100% + 73px); /* Przesunięcie banera pod napis z nazwą zawodów */
            left: 10px; /* Wyśrodkowanie poziome banera */
            border-radius: 5px; /* Zaokrąglenie rogów */
        }
        .current-element {
           width: calc(100% - 30px); /* Szerokość banera mniejsza o 40px niż szerokość ekranu */
		   height: 380px;
            background-color: #f5f5f5; /* Jaśniejsze tło dla banera */
            padding: 2px; /* Wewnętrzne marginesy dla banera */
            padding-left: 10px;
			position: absolute; /* Ustawienie absolutnej pozycji */
            top: calc(100% + 218px); /* Przesunięcie banera pod napis z nazwą zawodów */
            left: 10px; /* Wyśrodkowanie poziome banera */
            border-radius: 5px; /* Zaokrąglenie rogów */
        }
        .starting-list-banner {
            width: calc(100% - 38px); /* Szerokość banera mniejsza o 40px niż szerokość ekranu */
			height: 700px;
            background-color: #f5f5f5; /* Jaśniejsze tło dla banera */
            padding: 10px; /* Wewnętrzne marginesy dla banera */
			position: absolute; /* Ustawienie absolutnej pozycji */
            top: calc(100% + 73px); /* Przesunięcie banera pod napis z nazwą zawodów */
            left: 10px; /* Wyśrodkowanie poziome banera */
            border-radius: 5px; /* Zaokrąglenie rogów */

        }
		.event-buttons {
            text-align: center;
            margin-top: 20px;
        }

        .event-button {
            background-color: #3498db;
            color: #fff;
            border: none;
            padding: 5px 5px;
            text-align: center;
            font-weight: bold;
            display: inline-block;
            font-size: 13px;
            margin-top: 5px;
			margin-bottom: 5px;
			cursor: pointer;
            border-radius: 3px;
            transition: background-color 0.3s ease;
        }

        .event-button:hover {
            background-color: #2980b9;
        }
		
		.status-buttons {
            text-align: center;
            margin-top: 20px;
        }

        .status-button {
            background-color: #608b32;
            color: #fff;
            border: none;
            padding: 3px 3px;
            text-align: center;
            font-weight: bold;
            display: inline-block;
            font-size: 13px;
            margin-top: 2px;
			margin-bottom: 2px;
			cursor: pointer;
            border-radius: 3px;
            transition: background-color 0.3s ease;
        }

        .status-button:hover {
            background-color: #608b32;
        }
		
		h3.custom-heading {
			background-color: #333; /* Kolor tła - ciemnoszary */
			color: #fff; /* Kolor tekstu - biały */
			text-align: left; /* Wyśrodkowanie tekstu */
			padding: 7px 7px 7px 7px; /* Odstępy wewnętrzne - góra i dół: 10px, lewo i prawo: 0 */
			margin: 0; /* Reset marginesu */
			margin-bottom: 0px;
			font-size: 16px;
			
		}
		table {

    	margin-top: 20px;
        }

        th, td {
            border: 1px solid #ddd;
            padding: 8px;
            text-align: left;
        }

        th {
            background-color: #f2f2f2;
        }
		table.finished {
			
		border-collapse: collapse;
		text-align: left;
		width: 100%;
		margin-top: 0px;
		font-size: 14px;

		}
		table.elements {
			
		border-collapse: collapse;
		width: 98%;
		margin-top: 0px;
		font-size: 16px;
		border: 0px;
		margin-left: 3px;
		margin-right: 3px;

		}
		table.elements th, table.elements td {
			
		padding: 2px;		
		border: 0px;
		}
		table.elements td:nth-child(1) {
		width: 25px;
		text-align: left;
		}
		table.elements td:nth-child(2) {
		text-align: left;
		width: 40px;
		}
		table.elements td:nth-child(3) {
		width: 100px;
		text-align: right;
		}
		table.elements td:nth-child(4) {
		width: 30px;
		text-align: center;
		}
		table.elements td:nth-child(5) {
		text-align: center;
		width: 70px;
		}
		table.elements td:nth-child(6) {
		text-align: center;
		width: 70px;
		}
		table.elements td:nth-child(7) {
		text-align: center;
		width: 70px;
		border-right: none;
		}
		
		
		table.elements th:nth-child(1) {
		width: 25px;
		text-align: left;
		}
		table.elements th:nth-child(2) {
		text-align: left;
		}		}
		table.elements th:nth-child(3) {
		text-align: center;
		}
		table.elements th:nth-child(4) {
		text-align: center;
		}
		table.elements th:nth-child(5) {
		text-align: center;
		}
		table.elements th:nth-child(6) {
		text-align: center;
		}
		table.elements th:nth-child(7) {
		text-align: center;
		border-right: none;
		}
		
		
		table.comp_name {
            width: 98%;
            margin-top: 0px;
			margin-bottom: 0px;
			border: 1px;
			border-spacing: 0px;
			
			padding: 2px;

        }
		table.comp_name th, table.comp_name td {
			
            padding: 0px; /* Nowy wewnętrzny odstęp */
            border: 1px;
			border-spacing: 2px;
			margin-top: 0px;
        }
		table.comp_name td:nth-child(1) {
		font-size: 14px; /* Nowa wielkość czcionki */	
		border: 1px;
		}
		table.comp_name td:nth-child(2) {
		font-size: 21px; /* Nowa wielkość czcionki */
		border: 1px;
		}
		table.comp_name tr:nth-child(2) {
		font-size: 21px; /* Nowa wielkość czcionki */
		font-weight: bold; /* Ustawienie pogrubienia */
		color: navy;
		border: 1px;
		
		}
		table.comp_name td[colspan="2"] {
    text-align: left; /* Wyrównanie do prawej dla komórki z colspan */
}
		
		table.results-table {
            border: none;
            border-collapse: collapse;
			margin-top: 0px;
			margin-bottom: 0px;
			border: 0px;
			border-spacing: 0px;
			padding: 2px;
        }
        table.results-table th, table.results-table td {
            padding: 3px;
			border: none;	
        }
        /* Ustawienie szerokości kolumny pierwszej */
        table.results-table td:nth-child(1), table.results-table th:nth-child(1) {
            width: 40px;
		}
        /* Ustawienie szerokości kolumny drugiej */
        table.results-table td:nth-child(2), table.results-table th:nth-child(2) {
            width: 60px;
			text-align: left;
        }
        /* Ustawienie szerokości kolumny trzeciej */
        table.results-table td:nth-child(3), table.results-table th:nth-child(3) {
            width: 5px;
        }
        table.results-table td:nth-child(4), table.results-table th:nth-child(4) {
            width: 48px;
			
        }
        table.results-table td:nth-child(5), table.results-table th:nth-child(5) {
            width: 48px;
			text-align: center;
        }
        table.results-table td:nth-child(6), table.results-table th:nth-child(6) {
            width: 48px;
			text-align: center;
        }
        table.results-table td:nth-child(7), table.results-table th:nth-child(7) {
            width: 48px;
			text-align: center;
        }
        table.results-table td:nth-child(8), table.results-table th:nth-child(8) {
            width: 10px;
        }
        table.results-table td:nth-child(9), table.results-table th:nth-child(9) {
            width: 5px;
        }
        table.results-table td:nth-child(10), table.results-table th:nth-child(10) {
            width: 48px;
        }
		
 		table.current-table {
            
            margin-top: 0px;
            font-size: 16px; /* Nowa wielkość czcionki */
			border: 5px;
			border-spacing: 2px;
        }

        table.current-table th, table.current-table td {
            padding: 3px; /* Nowy wewnętrzny odstęp */
            border: 1px;
			border-spacing: 2px;
        }
        
		.dark-cell {
            background-color: #666; /* Kolor tła - ciemnoszary */
            color: #fff; /* Kolor tekstu - biały */
        }
		.comp-cell {
           text-align: center;
        }
		.comp-dark-cell {
            background-color: #666; /* Kolor tła - ciemnoszary */
            color: #fff; /* Kolor tekstu - biały */
			text-align: center;
        }
		.point-cell {
            text-align: right;
        }
		.judges-button {
        display: inline-block; /* lub display: inline; */
    }
	.active-button {
    background-color: green; /* Kolor tła */
    
}

/* Styl dla nieaktywnych przycisków */
.inactive-button {
    background-color: lightgrey; /* Kolor tła */
    
}
		table.curr-table{
			
		
		width: 100%;
		margin-top: 0px;
		border: 0px;
		border-spacing: 0px;
		border-collapse: collapse;
		color: #fff;
		

		}
		table.curr-table th, table.curr-table td {
		margin-top: 0px;
		padding: 2px;
		border: 0px;			

		}
		table.curr-table tr:nth-child(1) td {
		font-size: 18px;
		}
		
		table.curr-table tr:nth-child(3) td,
		table.curr-table tr:nth-child(4) td {
			text-align: center;
			border: 0px;
			font-size: 20px;
		}
 .review-button {
    background-color: red; /* Czerwone tło */
    color: white; /* Biały kolor tekstu */
    border: none; /* Usunięcie obramowania */
    padding: 2px 2px; /* Dostosowanie wewnętrznego odstępu */
    border-radius: 2px; /* Zaokrąglenie narożników */
    font-size: 10px; /* Rozmiar czcionki */
  }
  .review-finished {
    background-color: green; /* Czerwone tło */
    color: white; /* Biały kolor tekstu */
    border: none; /* Usunięcie obramowania */
    padding: 2px 2px; /* Dostosowanie wewnętrznego odstępu */
    border-radius: 2px; /* Zaokrąglenie narożników */
    font-size: 10px; /* Rozmiar czcionki */
  }
		
    .blur {
      filter: blur(5px);
      transition: filter 0.5s ease;
    }

    /* Nakładka */
    .overlay {
      position: fixed;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background-color: rgba(255, 255, 255, 0.8);
      display: flex;
      justify-content: center;
      align-items: center;
      z-index: 9999;
    }

    /* Ukrycie nakładki */
    .hidden {
      display: none;
    }
    
   .message {
    justify-content: center; /* Wyśrodkowanie w poziomie */
    align-items: center; /* Wyśrodkowanie w pionie */
    margin-left: 20%;
   	margin-right: 20%;
   }
   
   .button-container {
    position: fixed;
    bottom: 10px;
    width: 100%;
    text-align: center;
}

.page-button {
    padding: 10px 20px;
    margin: 0 10px;
    background-color: #3498db;
    color: white;
    border: none;
    cursor: pointer;
    font-size: 12px;
	border-radius: 3px;
}

.page-button:hover {
    background-color: #2980b9;
}

.page {
    display: none; /* Ukrycie stron, będzie zarządzane w JS */
}

#page2 { /* Na starcie tylko pierwsza strona ma być widoczna */
    display: block;
}