diff --git a/TicketOffice/Pages/Routes/Index.cshtml b/TicketOffice/Pages/Routes/Index.cshtml
index 61e9906..cebd8a5 100644
--- a/TicketOffice/Pages/Routes/Index.cshtml
+++ b/TicketOffice/Pages/Routes/Index.cshtml
@@ -45,129 +45,129 @@
         <div class="route-list">
             <table>
                 <thead>
-                    <tr>
-                        <th>
-                            № автобуса
-                            @if (Model.SortString == "increasingNumber")
+                <tr>
+                    <th>
+                        № автобуса
+                        @if (Model.SortString == "increasingNumber")
+                        {
+                            <a class="link-btn-sort" asp-page-handler="SortByNumber" asp-route-SortString="descendingNumber" asp-route-From=@Model.From a in a  asp-route-To=@Model.To asp-route-Date=@Model.Date.ToString("yyyy-MM-dd")>🠕</a>
+                        }
+                        else if (Model.SortString == "descendingNumber")
+                        {
+                            <a class="link-btn-sort" asp-page-handler="SortByNumber" asp-route-SortString="increasingNumber" asp-route-From=@Model.From a in a  asp-route-To=@Model.To asp-route-Date=@Model.Date.ToString("yyyy-MM-dd")>🠗</a>
+                        }
+                        else
+                        {
+                            <a class="link-btn-sort" asp-page-handler="SortByNumber" asp-route-SortString="increasingNumber" asp-route-From=@Model.From a in a  asp-route-To=@Model.To asp-route-Date=@Model.Date.ToString("yyyy-MM-dd")>⮁</a>
+                        }
+                    </th>
+                    <th>
+                        Звідки / Куди
+                    </th>
+                    <th>
+                        Дата
+                    </th>
+                    <th>
+                        <div class="departure">
+                            Відправлення
+                            @if (Model.SortString == "increasingDeparture")
                             {
-                                <a class="link-btn-sort" asp-page-handler="SortByNumber" asp-route-SortString="descendingNumber" asp-route-From=@Model.From a in a  asp-route-To=@Model.To asp-route-Date=@Model.Date.ToString("yyyy-MM-dd")>🠕</a>
+                                <a class="link-btn-sort" asp-page-handler="SortByDeparture" asp-route-SortString="descendingDeparture" asp-route-From=@Model.From a in a  asp-route-To=@Model.To asp-route-Date=@Model.Date.ToString("yyyy-MM-dd")>🠕</a>
                             }
-                            else if (Model.SortString == "descendingNumber")
+                            else if (Model.SortString == "descendingDeparture")
                             {
-                                <a class="link-btn-sort" asp-page-handler="SortByNumber" asp-route-SortString="increasingNumber" asp-route-From=@Model.From a in a  asp-route-To=@Model.To asp-route-Date=@Model.Date.ToString("yyyy-MM-dd")>🠗</a>
+                                <a class="link-btn-sort" asp-page-handler="SortByDeparture" asp-route-SortString="increasingDeparture" asp-route-From=@Model.From a in a  asp-route-To=@Model.To asp-route-Date=@Model.Date.ToString("yyyy-MM-dd")>🠗</a>
                             }
                             else
                             {
-                                <a class="link-btn-sort" asp-page-handler="SortByNumber" asp-route-SortString="increasingNumber" asp-route-From=@Model.From a in a  asp-route-To=@Model.To asp-route-Date=@Model.Date.ToString("yyyy-MM-dd")>⮁</a>
+                                <a class="link-btn-sort" asp-page-handler="SortByDeparture" asp-route-SortString="increasingDeparture" asp-route-From=@Model.From a in a  asp-route-To=@Model.To asp-route-Date=@Model.Date.ToString("yyyy-MM-dd")>⮁</a>
                             }
-                        </th>
-                        <th>
-                            Звідки / Куди
-                        </th>
-                        <th>
-                            Дата
-                        </th>
-                        <th>
-                            <div class="departure">
-                                Відправлення
-                                @if (Model.SortString == "increasingDeparture")
-                                {
-                                    <a class="link-btn-sort" asp-page-handler="SortByDeparture" asp-route-SortString="descendingDeparture" asp-route-From=@Model.From a in a  asp-route-To=@Model.To asp-route-Date=@Model.Date.ToString("yyyy-MM-dd")>🠕</a>
-                                }
-                                else if (Model.SortString == "descendingDeparture")
-                                {
-                                    <a class="link-btn-sort" asp-page-handler="SortByDeparture" asp-route-SortString="increasingDeparture" asp-route-From=@Model.From a in a  asp-route-To=@Model.To asp-route-Date=@Model.Date.ToString("yyyy-MM-dd")>🠗</a>
-                                }
-                                else
-                                {
-                                    <a class="link-btn-sort" asp-page-handler="SortByDeparture" asp-route-SortString="increasingDeparture" asp-route-From=@Model.From a in a  asp-route-To=@Model.To asp-route-Date=@Model.Date.ToString("yyyy-MM-dd")>⮁</a>
-                                }
-                            </div>
-                            <div class="arrival">
-                                Прибуття
-                                @if (Model.SortString == "increasingArrival")
-                                {
-                                    <a class="link-btn-sort" asp-page-handler="SortByArrival" asp-route-SortString="descendingArrival" asp-route-From=@Model.From a in a  asp-route-To=@Model.To asp-route-Date=@Model.Date.ToString("yyyy-MM-dd")>🠕</a>
-                                }
-                                else if (Model.SortString == "descendingArrival")
-                                {
-                                    <a class="link-btn-sort" asp-page-handler="SortByArrival" asp-route-SortString="increasingArrival" asp-route-From=@Model.From a in a  asp-route-To=@Model.To asp-route-Date=@Model.Date.ToString("yyyy-MM-dd")>🠗</a>
-                                }
-                                else
-                                {
-                                    <a class="link-btn-sort" asp-page-handler="SortByArrival" asp-route-SortString="increasingArrival" asp-route-From=@Model.From a in a  asp-route-To=@Model.To asp-route-Date=@Model.Date.ToString("yyyy-MM-dd")>⮁</a>
-                                }
-                            </div>
-                        </th>
-                        <th>
-                            Тривалість
-                            @if (Model.SortString == "increasingDuration")
+                        </div>
+                        <div class="arrival">
+                            Прибуття
+                            @if (Model.SortString == "increasingArrival")
                             {
-                                <a class="link-btn-sort" asp-page-handler="SortByDuration" asp-route-SortString="descendingDuration" asp-route-From=@Model.From a in a  asp-route-To=@Model.To asp-route-Date=@Model.Date.ToString("yyyy-MM-dd")>🠕</a>
+                                <a class="link-btn-sort" asp-page-handler="SortByArrival" asp-route-SortString="descendingArrival" asp-route-From=@Model.From a in a  asp-route-To=@Model.To asp-route-Date=@Model.Date.ToString("yyyy-MM-dd")>🠕</a>
                             }
-                            else if (Model.SortString == "descendingDuration")
+                            else if (Model.SortString == "descendingArrival")
                             {
-                                <a class="link-btn-sort" asp-page-handler="SortByDuration" asp-route-SortString="increasingDuration" asp-route-From=@Model.From a in a  asp-route-To=@Model.To asp-route-Date=@Model.Date.ToString("yyyy-MM-dd")>🠗</a>
+                                <a class="link-btn-sort" asp-page-handler="SortByArrival" asp-route-SortString="increasingArrival" asp-route-From=@Model.From a in a  asp-route-To=@Model.To asp-route-Date=@Model.Date.ToString("yyyy-MM-dd")>🠗</a>
                             }
                             else
                             {
-                                <a class="link-btn-sort" asp-page-handler="SortByDuration" asp-route-SortString="increasingDuration" asp-route-From=@Model.From a in a  asp-route-To=@Model.To asp-route-Date=@Model.Date.ToString("yyyy-MM-dd")>⮁</a>
+                                <a class="link-btn-sort" asp-page-handler="SortByArrival" asp-route-SortString="increasingArrival" asp-route-From=@Model.From a in a  asp-route-To=@Model.To asp-route-Date=@Model.Date.ToString("yyyy-MM-dd")>⮁</a>
                             }
-                        </th>
-                        <th>
-                            Вільніих місць
-                        </th>
-                        <th>
-                            Дії
-                        </th>
-                    </tr>
+                        </div>
+                    </th>
+                    <th>
+                        Тривалість
+                        @if (Model.SortString == "increasingDuration")
+                        {
+                            <a class="link-btn-sort" asp-page-handler="SortByDuration" asp-route-SortString="descendingDuration" asp-route-From=@Model.From a in a  asp-route-To=@Model.To asp-route-Date=@Model.Date.ToString("yyyy-MM-dd")>🠕</a>
+                        }
+                        else if (Model.SortString == "descendingDuration")
+                        {
+                            <a class="link-btn-sort" asp-page-handler="SortByDuration" asp-route-SortString="increasingDuration" asp-route-From=@Model.From a in a  asp-route-To=@Model.To asp-route-Date=@Model.Date.ToString("yyyy-MM-dd")>🠗</a>
+                        }
+                        else
+                        {
+                            <a class="link-btn-sort" asp-page-handler="SortByDuration" asp-route-SortString="increasingDuration" asp-route-From=@Model.From a in a  asp-route-To=@Model.To asp-route-Date=@Model.Date.ToString("yyyy-MM-dd")>⮁</a>
+                        }
+                    </th>
+                    <th>
+                        Вільніих місць
+                    </th>
+                    <th>
+                        Дії
+                    </th>
+                </tr>
                 </thead>
                 <tbody>
-                    @foreach (var route in Model.Routes)
-                    {
-                        <tr class="table-row">
-                            <td class="num">
-                                <div>@route.Number</div>
-                                <div class="city-list-btn"><a class="city-list-btn">Маршрут</a></div>
-                            </td>
-                            <td class="city">
-                                <div>@route.Cities.First().Name</div>
-                                <div>@route.Cities.Last().Name</div>
-                            </td>
-                            <td>
-                                <div class="route-date">
-                                    <span>
-                                        Відправлення
-                                    </span>
-                                    <span>
-                                        @route.Cities.First().ArrivalTime?.ToString("f").Split(",")[0].ToLower(),
-                                        @route.Cities.First().DepartureTime?.ToString("dd.MM.yyyy")
-                                    </span>
-                                </div>
-                                <div class="route-date">
-                                    <span>Прибуття</span>
-                                    <span>
-                                        @route.Cities.Last().ArrivalTime?.ToString("f").Split(",")[0].ToLower(),
-                                        @route.Cities.Last().ArrivalTime?.ToString("dd.MM.yyyy")
-                                    </span>
-                                </div>
-                            </td>
-                            <td class="time">
-                                <div>@route.Cities.First().DepartureTime?.ToString("HH:mm")</div>
-                                <div>@route.Cities.Last().ArrivalTime?.ToString("HH:mm")</div>
-                            </td>
-                            <td class="duration">
-                                @{ TimeSpan? duration = route.Cities.Last().ArrivalTime - route.Cities.First().DepartureTime; }
-                                @($"{duration?.TotalHours.ToString().Split(",")[0]}:{duration?.Minutes}")
-                            </td>
-                            <td class="capacity">
-                                @(route.Capacity - route.Tickets.Count)
-                            </td>
-                            <td class="action">
-                                <a class="link-btn-choose">Вибрати</a>
-                            </td>
-                        </tr>
-                    }
+                @foreach (var route in Model.Routes)
+                {
+                    <tr class="table-row">
+                        <td class="num">
+                            <div>@route.Number</div>
+                            <div class="city-list-btn"><a class="city-list-btn" onclick="document.getElementById('popup-city-list-@route.Id').style.display = 'inherit'">Маршрут</a></div>
+                        </td>
+                        <td class="city">
+                            <div>@route.Cities.First().Name</div>
+                            <div>@route.Cities.Last().Name</div>
+                        </td>
+                        <td>
+                            <div class="route-date">
+                                <span>
+                                    Відправлення
+                                </span>
+                                <span>
+                                    @route.Cities.First().ArrivalTime?.ToString("f").Split(",")[0].ToLower(),
+                                    @route.Cities.First().DepartureTime?.ToString("dd.MM.yyyy")
+                                </span>
+                            </div>
+                            <div class="route-date">
+                                <span>Прибуття</span>
+                                <span>
+                                    @route.Cities.Last().ArrivalTime?.ToString("f").Split(",")[0].ToLower(),
+                                    @route.Cities.Last().ArrivalTime?.ToString("dd.MM.yyyy")
+                                </span>
+                            </div>
+                        </td>
+                        <td class="time">
+                            <div>@route.Cities.First().DepartureTime?.ToString("HH:mm")</div>
+                            <div>@route.Cities.Last().ArrivalTime?.ToString("HH:mm")</div>
+                        </td>
+                        <td class="duration">
+                            @{ TimeSpan? duration = route.Cities.Last().ArrivalTime - route.Cities.First().DepartureTime; }
+                            @($"{duration?.TotalHours.ToString().Split(",")[0]}:{duration?.Minutes}")
+                        </td>
+                        <td class="capacity">
+                            @(route.Capacity - route.Tickets.Count)
+                        </td>
+                        <td class="action">
+                            <a class="link-btn-choose">Вибрати</a>
+                        </td>
+                    </tr>
+                }
                 </tbody>
             </table>
         </div>
@@ -179,4 +179,94 @@
         </div>
     }
     
-</div>
\ No newline at end of file
+</div>
+
+@if (Model.Routes != null)
+{
+    foreach (var route in Model.Routes)
+    {
+        <div class="popup-container" id="popup-city-list-@route.Id">
+            <div class="popup">
+                <div class="popup-header">
+                    <div class="popup-header-center">
+                        Автобус №@route.Number
+                    </div>
+                </div>
+                <div class="popup-body">
+                    <div class="popup-body-main">
+                        <table>
+                            <thead>
+                            <tr class="tr-intermediate">
+                                <th class="th-route">
+                                    Інформація
+                                </th>
+                                <th class="th-route">
+                                    Місто
+                                </th>
+                                <th class="th-route">
+                                    Час прибуття
+                                </th>
+                                <th class="th-route">
+                                    Час відправлення
+                                </th>
+                            </tr>
+                            </thead>
+                            <tbody>
+                            <tr class="tr-departure">
+                                <td class="td-route">
+                                    Відправлення
+                                </td>
+                                <td class="td-route">
+                                    @route.Cities.First().Name
+                                </td>
+                                <td class="td-route">
+                                    -
+                                </td>
+                                <td class="td-route">
+                                    @route.Cities.First().DepartureTime?.ToString("HH:mm")
+                                </td>
+                            </tr>
+                            
+                            @for (int i = 1; i < route.Cities.Count - 1; i++)
+                            {
+                                <tr class="tr-intermediate">
+                                    <td class="td-route">
+                                        Проміжна станція
+                                    </td>
+                                    <td class="td-route">
+                                        @route.Cities.ToList()[i].Name
+                                    </td>
+                                    <td class="td-route">
+                                        @route.Cities.ToList()[i].ArrivalTime?.ToString("HH:mm")
+                                    </td>
+                                    <td class="td-route">
+                                        @route.Cities.ToList()[i].DepartureTime?.ToString("HH:mm")
+                                    </td>
+                                </tr>
+                            }
+                            
+                            <tr class="tr-arrival">
+                                <td class="td-route">
+                                    Прибуття
+                                </td>
+                                <td class="td-route">
+                                    @route.Cities.Last().Name
+                                </td>
+                                <td class="td-route">
+                                    @route.Cities.Last().ArrivalTime?.ToString("HH:mm")
+                                </td>
+                                <td class="td-route">
+                                    -
+                                </td>
+                            </tr>
+                            </tbody>
+                        </table>
+                    </div>
+                    <div class="popup-body-footer">
+                        <a class="link-btn-choose" onclick="document.getElementById('popup-city-list-@route.Id').style.display = 'none'">Закрити</a>
+                    </div>
+                </div>
+            </div>
+        </div>
+    }
+}
\ No newline at end of file
diff --git a/TicketOffice/wwwroot/css/Routes.css b/TicketOffice/wwwroot/css/Routes.css
index aa247dc..f432b46 100644
--- a/TicketOffice/wwwroot/css/Routes.css
+++ b/TicketOffice/wwwroot/css/Routes.css
@@ -20,6 +20,8 @@ body {
     margin: 2.5rem auto;
 }
 
+/* ~~~~~~ search block ~~~~~~ */
+
 .search-block {
     background: #eaeef1;
     border-radius: 0.5rem;
@@ -78,6 +80,8 @@ input.search-btn:hover {
     opacity: 0.8;
 }
 
+/* ~~~~~~ route list table ~~~~~~ */
+
 .route-list {
     margin-top: 3rem;
 }
@@ -203,4 +207,71 @@ td.time, td.duration {
     text-align: center;
     margin-top: 2rem;
     line-height: 3rem;
+}
+
+/* ~~~~~~ popup route list ~~~~~~ */
+
+.popup-container {
+    position: fixed;
+    top: 0;
+    left: 0;
+    z-index: 100;
+    width: 100%;
+    height: 100%;
+    background: rgba(0, 0, 0, 0.25);
+    display: none;
+}
+
+.popup {
+    width: 35rem;
+    height: 30rem;
+    background: #eaeef1;
+    position: fixed;
+    top: calc(50% - 15rem);
+    left: calc(50% - 17.5rem);
+    border-radius: 0.5rem;
+    box-shadow: 0 10px 15px 5px #6c6e6f;
+}
+
+.popup-header {
+    border-radius: 0.5rem 0.5rem 0 0;
+    height: 3rem;
+    background: #a1b0b9;
+    color: white;
+    font-weight: 700;
+    font-size: 1.1rem;
+    text-align: center;
+    line-height: 3rem;
+}
+
+.popup-body {
+    width: calc(100% - 2rem);
+    height: calc(100% - 5rem);
+    padding: 1rem 1rem;
+}
+
+.popup-body-main {
+    height: calc(100% - 4rem);
+    overflow-y: auto;
+    overflow-x: hidden;
+}
+
+tr.tr-intermediate {
+    font-weight: 500;
+}
+
+th.th-route, td.td-route {
+    height: 4rem;
+    line-height: 1.25rem;
+    text-align: center;
+    padding: 0 0.5rem;
+}
+
+tr.tr-departure, tr.tr-arrival {
+    font-weight: 700;
+}
+
+.popup-body-footer {
+    text-align: center;
+    margin-top: 1rem;
 }
\ No newline at end of file