1#@!#!123s

��JFIF�� 1#@!#!123s
: / www / wwwroot / nagalandsuperleague.co.in / NSL(Website) /
Filename : fixtures_results.html
back
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Fixtures & Results</title>
    <link rel="icon" type="image/x-icon" href="img/NSL logo.png">
    <!-- Bootstrap icons -->
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css">
    <link rel="stylesheet" href="./css/style.css">
    <link rel="stylesheet" href="./css/info.css">
    <link rel="stylesheet" href="./css/footer.css">
    <style>
        *{
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }
        body{
          display: flex;
          flex-direction: column;
          min-height: 100vh;
        }
        .match_details_container{
            flex: 1;
            width: 100%;
            height: auto;
            /*background-color: #ddd;*/
            padding: 10px 40px;
            display: flex;
            justify-content: space-evenly;
            align-items: center;
        }

        .match_title{
            background-color: #001A6E;
            color: #fff;
            font-size: 14px;
            padding: 5px 10px;
        }
        .fixtures_results_main_container{
            width: 800px;
            height: 100vh;
            padding: 0;
            /*background-color: rgb(40, 163, 75);*/
        }

        .fixtures_results_container{
            width: 100%;
            height: auto;
            padding: 10px 0;
            /*background-color: aqua;*/
            display: flex;
            justify-content: space-between;
        }

        .fixtures_container, .resutls_container{
            width: 390px;
            height: auto;
            padding: 0;
            gap: 10px;
            /*background-color: #da9090;*/
        }

        .fixtures, .results{
            width: 100%;
            height: 100px;
            margin-bottom: 1px;
            background-color: #fff;
            border: 1px solid #ddd;
            box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
            display: flex;
            align-items: center;
            justify-content: space-between;
        }

        .fixtures_details{
            text-align: center;
        }

        .league_standings_container{
            width: 100%;
            height: auto;
            /*background-color: rgb(2, 115, 141);*/
        }
        .player_gallery_container{
          width: 100%;
          height: auto;
          background-color: chocolate;
        }
        .next_upcoming_container{
            width: 400px;
            height: 100vh;
            padding: 10px;
            /*background-color: rgb(3, 43, 30);*/
        }

        .next_match_container{
            width: 100%;
            height: 140px;
            margin-bottom: 12px;
            /*background-color: blue;*/
        }
        .upcoming_container{
            width: 100%;
            height: auto;
            border: 1px solid #ddd;
            box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
        }
        .player_ranking_container{
            width: 100%;
            height: 300px;
            margin-bottom: 10px;      
        }
        .countdown-container {
            width: 100%;
            margin-bottom: 10px;
            text-align: center;
            background-color: #fff;
            border: 1px solid #ddd;
            box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
            overflow: hidden;
          }
      
          .header {
            background-color: #001A6E;
            color: #fff;
            font-size: 18px;
            font-weight: bold;
            padding: 10px;
          }
      
          .match-info {
            font-size: 16px;
            font-weight: bold;
            color: #c00;
            padding: 10px 0;
          }
      
          .countdown-timer {
            display: flex;
            justify-content: center;
            gap: 20px;
            padding: 10px 0;
          }
      
          .countdown-item {
            text-align: center;
          }
      
          .number {
            font-size: 24px;
            font-weight: bold;
            color: #333;
          }
      
          .label {
            font-size: 14px;
            color: #666;
          }
          table {
            width: 100%;
            border-collapse: collapse;
            margin: 0;
          }
      
          th, td {
            padding: 10px;
            text-align: left;
            border-bottom: 1px solid #ddd;
            background-color: #fff;
          }
      
          th {
            background-color: #f2f2f2;
            font-size: 14px;
            font-weight: bold;
          }
      
          td {
            font-size: 14px;
          }
      
          .table-footer {
            text-align: center;
            padding: 10px;
            font-size: 14px;
            background-color: #f9f9f9;
            color: #007bff;
          }
      
          .table-footer a {
            text-decoration: none;
            color: #666;
            font-weight: bold;
            
          }
      
          .table-footer a:hover {
            transform: translateY(-2.1rem);
        }

        /*League Standings start*/
        .table-container {
          width: 100%;
          margin: 0 auto;
          margin-bottom: 20px;
          background-color: #fff;
          border: 1px solid #ddd;
          box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
        }

        .group-header {
          font-size: 16px;
          font-weight: bold;
          margin-top: 20px;
        }
    
        .team-name {
          display: flex;
          align-items: center;
        }
    
        .team-name img {
          width: 24px;
          height: 16px;
          margin-right: 10px;
        }
    
        .positive {
          color: green;
          font-weight: bold;
        }
    
        .negative {
          color: red;
          font-weight: bold;
        }
        /*League Standings end*/

        /* player rankings start */
        .ranking-container {
          width: 100%;
          border: 1px solid #ddd;
          margin-top: 10px;
          background-color: #fff;
          box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
          overflow: hidden;
        }
    
        .ranking-header {
          background-color: #001A6E;
          color: #fff;
          font-size: 18px;
          font-weight: bold;
          padding: 10px;
          text-align: center;
        }    
        .table-footer {
          text-align: center;
          padding: 10px;
          font-size: 14px;
          background-color: #f9f9f9;
        }
    
        .table-footer a {
          text-align: end;
          text-decoration: none;
          color: #666;
          font-weight: bold;
        }
    
        .table-footer a:hover {
          text-decoration: underline;
        }
        /* player rankings end */
    </style>
</head>
<body>
    <div class="scoreboard-container">
        <!-- Dropdown Buttons -->
        <div class="upcoming-button">
          UPCOMING MATCHES
        </div>
    
        <!-- Matches List -->
        <div class="matches-container" id="matches-container">
          <div class="match-item">
            <div class="match-date">28/1/2025</div>
            <div><img src="./img/27 united fc.png" alt="JPN"> 27U</div>
            <div><img src="./img/barak fc.png" alt="BHR"> BAR</div>
          </div>
          <div class="match-item">
            <div class="match-date">28/1/2025</div>
            <div><img src="./img/Frontier warriors fc.png" alt="AUS"> FRW</div>
            <div><img src="./img/L FC.png" alt="IDN"> LON</div>
          </div>
          <div class="match-item">
            <div class="match-date">29/1/2025</div>
            <div><img src="./img/red scars fc.png" alt="IRN"> RED</div>
            <div><img src="./img/sechu zubza fc.png" alt="UAE"> SCZ</div>
          </div>
          <div class="match-item">
            <div class="match-date">29/1/2025</div>
            <div><img src="./img/NUSC.png" alt="IRQ"> NGU</div>
            <div><img src="./img/Frontier warriors fc.png" alt="AUS"> FRW</div>
          </div>
          <div class="match-item">
            <div class="match-date">30/1/2025</div>
            <div><img src="./img/red scars fc.png" alt="IRN"> RED</div>
            <div><img src="./img/barak fc.png" alt="BHR"> BAR</div>
          </div>
          <div class="match-item">
            <div class="match-date">30/1/2025</div>
            <div><img src="./img/27 united fc.png" alt="JPN"> 27U</div>
            <div><img src="./img/sechu zubza fc.png" alt="UAE"> SCZ</div>
          </div>
          <div class="match-item">
            <div class="match-date">28/1/2025</div>
            <div><img src="./img/27 united fc.png" alt="JPN"> 27U</div>
            <div><img src="./img/barak fc.png" alt="BHR"> BAR</div>
          </div>
          <div class="match-item">
            <div class="match-date">28/1/2025</div>
            <div><img src="./img/Frontier warriors fc.png" alt="AUS"> FRW</div>
            <div><img src="./img/L FC.png" alt="IDN"> LON</div>
          </div>
          <div class="match-item">
            <div class="match-date">29/1/2025</div>
            <div><img src="./img/red scars fc.png" alt="IRN"> RED</div>
            <div><img src="./img/sechu zubza fc.png" alt="UAE"> SCZ</div>
          </div>
          <div class="match-item">
            <div class="match-date">29/1/2025</div>
            <div><img src="./img/NUSC.png" alt="IRQ"> NGU</div>
            <div><img src="./img/Frontier warriors fc.png" alt="AUS"> FRW</div>
          </div>
          <div class="match-item">
            <div class="match-date">30/1/2025</div>
            <div><img src="./img/red scars fc.png" alt="IRN"> RED</div>
            <div><img src="./img/barak fc.png" alt="BHR"> BAR</div>
          </div>
          <div class="match-item">
            <div class="match-date">30/1/2025</div>
            <div><img src="./img/27 united fc.png" alt="JPN"> 27U</div>
            <div><img src="./img/sechu zubza fc.png" alt="UAE"> SCZ</div>
          </div>
        </div>
    
        <!-- Navigation -->
        <div class="navigation">
            <button class="navigation-btn" id="scroll-left"><i class="bi bi-caret-left"></i></button> 
            <button class="navigation-btn" id="scroll-right"><i class="bi bi-caret-right"></i></button>
        </div> 
        <div class="navigation">
          <a href="fixtures_results.html">Full Fixtures »</a>
        </div>
      </div>
      <!-- header 2 start-->
        <div class="header_container">
          <a href="index.html"><img src="./img/NSL logo.png" alt="NSL Logo" width="100px"></a>
            <h1>Nagaland Super League</h1>
        </div>
        <!-- header 2 end -->
        <!-- nav start -->
        <nav>
            <ul>
                <li><a href="index.html">Home</a></li>
                <li><a href="fixtures_results.html">Fixtures & Results</a></li>
                <li><a href="standings.html">Standings</a></li>
                <li><a href="nsl_teams.html">Teams</a></li>
            </ul>
        </nav>
        <!-- nav end -->  
    <div class="match_details_container">
        <div class="fixtures_results_main_container">
            <div class="fixtures_results_container">
                <div class="fixtures_container">
                    <div class="header">Fixtures</div>
                      <div class="fixtures">
                          <img src="./img/27 united fc.png" alt="" width="80px">
                          <div class="fixtures_details">
                            <div class="label">January 13, 2025</div>
                            <div class="number">6:00 pm</div>
                            <div class="match-info">Budgies v Rams</div>
                          </div>
                          <img src="./img/27 united fc.png" alt="" width="80px">
                      </div>
                    <div class="fixtures">
                        <img src="./img/27 united fc.png" alt="" width="80px">
                        <div class="fixtures_details">
                            <div class="label">January 13, 2025</div>
                            <div class="number">6:00 pm</div>
                            <div class="match-info">Budgies v Rams</div>
                        </div>
                        <img src="./img/27 united fc.png" alt="" width="80px">
                    </div>
                    <div class="fixtures">
                        <img src="./img/27 united fc.png" alt="" width="80px">
                        <div class="fixtures_details">
                            <div class="label">January 13, 2025</div>
                            <div class="number">6:00 pm</div>
                            <div class="match-info">Budgies v Rams</div>
                        </div>
                        <img src="./img/27 united fc.png" alt="" width="80px">
                    </div>
                    <div class="fixtures">
                        <img src="./img/27 united fc.png" alt="" width="80px">
                        <div class="fixtures_details">
                            <div class="label">January 13, 2025</div>
                            <div class="number">6:00 pm</div>
                            <div class="match-info">Budgies v Rams</div>
                        </div>
                        <img src="./img/27 united fc.png" alt="" width="80px">
                    </div>
                    <div class="fixtures">
                        <img src="./img/27 united fc.png" alt="" width="80px">
                        <div class="fixtures_details">
                            <div class="label">January 13, 2025</div>
                            <div class="number">6:00 pm</div>
                            <div class="match-info">Budgies v Rams</div>
                        </div>
                        <img src="./img/27 united fc.png" alt="" width="80px">
                    </div>
                    <div class="fixtures">
                        <img src="./img/27 united fc.png" alt="" width="80px">
                        <div class="fixtures_details">
                            <div class="label">January 13, 2025</div>
                            <div class="number">6:00 pm</div>
                            <div class="match-info">Budgies v Rams</div>
                        </div>
                        <img src="./img/27 united fc.png" alt="" width="80px">
                    </div>
                    <div class="fixtures">
                        <img src="./img/27 united fc.png" alt="" width="80px">
                        <div class="fixtures_details">
                            <div class="label">January 13, 2025</div>
                            <div class="number">6:00 pm</div>
                            <div class="match-info">Budgies v Rams</div>
                        </div>
                        <img src="./img/27 united fc.png" alt="" width="80px">
                    </div>
                    <div class="fixtures">
                        <img src="./img/27 united fc.png" alt="" width="80px">
                        <div class="fixtures_details">
                            <div class="label">January 13, 2025</div>
                            <div class="number">6:00 pm</div>
                            <div class="match-info">Budgies v Rams</div>
                        </div>
                        <img src="./img/27 united fc.png" alt="" width="80px">
                    </div>
 
                </div>    
                <div class="resutls_container">
                    <div class="header">Results</div>
                      <a href="match_stats.html">
                        <div class="results">
                          <img src="./img/27 united fc.png" alt="" width="80px">
                          <div class="fixtures_details">
                            <div class="label">January 13, 2025</div>
                            <div class="number"><strong>3 - 2</strong></div>
                            <div class="match-info">Budgies v Rams</div>
                          </div>
                          <img src="./img/27 united fc.png" alt="" width="80px">
                        </div>
                      </a>
                    <div class="results">
                        <img src="./img/27 united fc.png" alt="" width="80px">
                        <div class="fixtures_details">
                            <div class="label">January 13, 2025</div>
                            <div class="number"><strong>3 - 2</strong></div>
                            <div class="match-info">Budgies v Rams</div>
                        </div>
                        <img src="./img/27 united fc.png" alt="" width="80px">
                    </div>
                    <div class="results">
                        <img src="./img/27 united fc.png" alt="" width="80px">
                        <div class="fixtures_details">
                            <div class="label">January 13, 2025</div>
                            <div class="number"><strong>3 - 2</strong></div>
                            <div class="match-info">Budgies v Rams</div>
                        </div>
                        <img src="./img/27 united fc.png" alt="" width="80px">
                    </div>
                    <div class="results">
                        <img src="./img/27 united fc.png" alt="" width="80px">
                        <div class="fixtures_details">
                            <div class="label">January 13, 2025</div>
                            <div class="number"><strong>3 - 2</strong></div>
                            <div class="match-info">Budgies v Rams</div>
                        </div>
                        <img src="./img/27 united fc.png" alt="" width="80px">
                    </div>
                    <div class="results">
                        <img src="./img/27 united fc.png" alt="" width="80px">
                        <div class="fixtures_details">
                            <div class="label">January 13, 2025</div>
                            <div class="number"><strong>3 - 2</strong></div>
                            <div class="match-info">Budgies v Rams</div>
                        </div>
                        <img src="./img/27 united fc.png" alt="" width="80px">
                    </div>
                    <div class="results">
                        <img src="./img/27 united fc.png" alt="" width="80px">
                        <div class="fixtures_details">
                            <div class="label">January 13, 2025</div>
                            <div class="number"><strong>3 - 2</strong></div>
                            <div class="match-info">Budgies v Rams</div>
                        </div>
                        <img src="./img/27 united fc.png" alt="" width="80px">
                    </div>
                    <div class="results">
                        <img src="./img/27 united fc.png" alt="" width="80px">
                        <div class="fixtures_details">
                            <div class="label">January 13, 2025</div>
                            <div class="number"><strong>3 - 2</strong></div>
                            <div class="match-info">Budgies v Rams</div>
                        </div>
                        <img src="./img/27 united fc.png" alt="" width="80px">
                    </div>
                    <div class="results">
                        <img src="./img/27 united fc.png" alt="" width="80px">
                        <div class="fixtures_details">
                            <div class="label">January 13, 2025</div>
                            <div class="number"><strong>3 - 2</strong></div>
                            <div class="match-info">Budgies v Rams</div>
                        </div>
                        <img src="./img/27 united fc.png" alt="" width="80px">
                    </div>
                    
                </div>
            </div>
            <div class="league_standings_container">
              <div class="table-container">
                  <div class="header">League Standings</div>
                  <table>
                    <thead>
                      <tr>
                        <th>Clubs</th>
                        <th>GP</th>
                        <th>W</th>
                        <th>D</th>
                        <th>L</th>
                        <th>F</th>
                        <th>A</th>
                        <th>GD</th>
                        <th>P</th>
                      </tr>
                    </thead>
                    <tbody>
                      <tr>
                        <td class="team-name"><img src="./img/27 united fc.png" alt="27 united">27 United FC</td>
                        <td>6</td>
                        <td>5</td>
                        <td>1</td>
                        <td>0</td>
                        <td>12</td>
                        <td>5</td>
                        <td class="positive">+7</td>
                        <td>16</td>
                      </tr>
                      <tr>
                        <td class="team-name"><img src="./img/barak fc.png" alt="Barak">Barak FC</td>
                        <td>6</td>
                        <td>4</td>
                        <td>1</td>
                        <td>1</td>
                        <td>8</td>
                        <td>5</td>
                        <td class="positive">+3</td>
                        <td>13</td>
                      </tr>
                      <tr>
                        <td class="team-name"><img src="./img/Frontier warriors fc.png" alt="Frontier warriors">Frontier Warriors</td>
                        <td>6</td>
                        <td>3</td>
                        <td>1</td>
                        <td>2</td>
                        <td>12</td>
                        <td>4</td>
                        <td class="positive">+8</td>
                        <td>10</td>
                      </tr>
                      <tr>
                        <td class="team-name"><img src="./img/L FC.png" alt="Longterok">Longterok FC</td>
                        <td>6</td>
                        <td>2</td>
                        <td>1</td>
                        <td>3</td>
                        <td>10</td>
                        <td>17</td>
                        <td class="negative">-7</td>
                        <td>7</td>
                      </tr>
                      <tr>
                        <td class="team-name"><img src="./img/NUSC.png" alt="Nagaland United Sports Club">Nagaland United Sports Club</td>
                        <td>6</td>
                        <td>1</td>
                        <td>0</td>
                        <td>5</td>
                        <td>6</td>
                        <td>13</td>
                        <td class="negative">-7</td>
                        <td>3</td>
                      </tr>
                      <tr>
                        <td class="team-name"><img src="./img/red scars fc.png" alt="Red Scars">Red Scars</td>
                        <td>6</td>
                        <td>0</td>
                        <td>2</td>
                        <td>4</td>
                        <td>5</td>
                        <td>9</td>
                        <td class="negative">-4</td>
                        <td>2</td>
                      </tr>
                      <tr>
                        <td class="team-name"><img src="./img/sechu zubza fc.png" alt="Sechu Zubza">Sechu Zubza</td>
                        <td>6</td>
                        <td>0</td>
                        <td>2</td>
                        <td>4</td>
                        <td>5</td>
                        <td>9</td>
                        <td class="negative">-4</td>
                        <td>2</td>
                      </tr>
                    </tbody>
                  </table>
                </div>
        </div>
        </div>
        <div class="next_upcoming_container">
            <div class="next_match_container">
                <div class="countdown-container">
                    <div class="header" style="text-align: start;">Next Match</div>
                    <div class="match-info">BUDGIES V RAMS</div>
                    <div class="countdown-timer" id="countdown">
                      <div class="countdown-item">
                        <div class="number" id="days">00</div>
                        <div class="label">days</div>
                      </div>
                      <div class="countdown-item">
                        <div class="number" id="hours">00</div>
                        <div class="label">hrs</div>
                      </div>
                      <div class="countdown-item">
                        <div class="number" id="minutes">00</div>
                        <div class="label">mins</div>
                      </div>
                      <div class="countdown-item">
                        <div class="number" id="seconds">00</div>
                        <div class="label">secs</div>
                      </div>
                    </div>
                  </div>
            </div>
            <div class="upcoming_container">
                <div class="header">Upcoming Matches</div>
                <table>
                    <thead>
                      <tr>
                        <th>Date</th>
                        <th>Home</th>
                        <th>Away</th>
                      </tr>
                    </thead>
                    <tbody>
                      <tr>
                        <td>January 13, 2025</td>
                        <td>Budgies</td>
                        <td>Rams</td>
                      </tr>
                      <tr>
                        <td>January 21, 2025</td>
                        <td>Crocodiles</td>
                        <td>Seahorses</td>
                      </tr>
                      <tr>
                        <td>January 24, 2025</td>
                        <td>Rams</td>
                        <td>Geckos</td>
                      </tr>
                      <tr>
                        <td>February 14, 2025</td>
                        <td>Bulls</td>
                        <td>Geckos</td>
                      </tr>
                      <tr>
                        <td>February 15, 2025</td>
                        <td>Eagles</td>
                        <td>Kangaroos</td>
                      </tr>
                    </tbody>
                  </table>
                  <div class="table-footer">
                    <a href="#">View all matches</a>
                  </div>
            </div>
            <div class="player_ranking_container">
                <div class="ranking-container">
                  <div class="header">Player Ranking</div>
                  <table>
                    <thead>
                      <tr>
                        <th>Rank</th>
                        <th>Player</th>
                        <th>Goals</th>
                      </tr>
                    </thead>
                    <tbody>
                      <tr>
                        <td>1</td>
                        <td><img src="uruguay-flag.png" alt="Uruguay">Octavio Thurgood</td>
                        <td>4</td>
                      </tr>
                      <tr>
                        <td>2</td>
                        <td><img src="france-flag.png" alt="France">Mark Gerrard</td>
                        <td>4</td>
                      </tr>
                      <tr>
                        <td>3</td>
                        <td><img src="thailand-flag.png" alt="Thailand">Mack Villarreal</td>
                        <td>3</td>
                      </tr>
                      <tr>
                        <td>4</td>
                        <td><img src="brazil-flag.png" alt="Brazil">Walton Makowski</td>
                        <td>2</td>
                      </tr>
                      <tr>
                        <td>5</td>
                        <td><img src="finland-flag.png" alt="Finland">Alphonse Freeberg</td>
                        <td>2</td>
                      </tr>
                    </tbody>
                  </table>
                  <div class="table-footer">
                    <a href="#">View all players</a>
                  </div>
                </div>
            </div>
        </div>
    </div> 
  <script src="./js/scroller.js"></script>
    <!-- Counter js -->
    <script>
        function startCountdown(targetDate) {
          const daysElem = document.getElementById('days');
          const hoursElem = document.getElementById('hours');
          const minutesElem = document.getElementById('minutes');
          const secondsElem = document.getElementById('seconds');
    
          function updateCountdown() {
            const now = new Date();
            const difference = targetDate - now;
    
            if (difference <= 0) {
              clearInterval(countdownInterval);
              daysElem.textContent = '00';
              hoursElem.textContent = '00';
              minutesElem.textContent = '00';
              secondsElem.textContent = '00';
              return;
            }
    
            const days = Math.floor(difference / (1000 * 60 * 60 * 24));
            const hours = Math.floor((difference % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
            const minutes = Math.floor((difference % (1000 * 60 * 60)) / (1000 * 60));
            const seconds = Math.floor((difference % (1000 * 60)) / 1000);
    
            daysElem.textContent = String(days).padStart(2, '0');
            hoursElem.textContent = String(hours).padStart(2, '0');
            minutesElem.textContent = String(minutes).padStart(2, '0');
            secondsElem.textContent = String(seconds).padStart(2, '0');
          }
    
          const countdownInterval = setInterval(updateCountdown, 1000);
          updateCountdown();
        }
    
        // Set target date and time for the countdown
        const targetDate = new Date('2025-03-25T15:00:00'); // Update with your match date and time
        startCountdown(targetDate);
      </script>
    </body>
</html>