diff --git a/src/EventHub.Domain.Shared/Localization/EventHub/en.json b/src/EventHub.Domain.Shared/Localization/EventHub/en.json
index dcf7d34..b3f9de7 100644
--- a/src/EventHub.Domain.Shared/Localization/EventHub/en.json
+++ b/src/EventHub.Domain.Shared/Localization/EventHub/en.json
@@ -18,7 +18,7 @@
     "DisplayName:Capacity": "Capacity",
     "EventHub:OrganizationNameAlreadyExists": "The organization {Name} already exists. Please use another name.",
     "EventHub:NotAuthorizedToCreateEventInThisOrganization": "You are not authorized to create events for the organization {0}.",
-    "EventHub:EventEndTimeCantBeEarlierThanStartTime": "Event end time can not be earlier than the start time.",
+    "EventHub:EndTimeCantBeEarlierThanStartTime": "Event end time can not be earlier than the start time.",
     "EventHub:CantRegisterOrUnregisterForAPastEvent": "Can not register to or unregister from an event in the past.",
     "Events": "Events",
     "Members": "Members",
diff --git a/src/EventHub.Web/Pages/Events/Components/CreateEventArea/_addSessionSection.cshtml b/src/EventHub.Web/Pages/Events/Components/CreateEventArea/_addSessionSection.cshtml
index f486dd8..ff49bc8 100644
--- a/src/EventHub.Web/Pages/Events/Components/CreateEventArea/_addSessionSection.cshtml
+++ b/src/EventHub.Web/Pages/Events/Components/CreateEventArea/_addSessionSection.cshtml
@@ -66,12 +66,12 @@
                                                     <span class="d-block mb-2">@speaker.UserName</span>
                                                 }
                                                 <abp-row>
-                                                    <abp-column size="_3">
+                                                    <abp-column size="_5">
                                                         <a id="@session.Id" data-track-id="@track.Id" href="javascript:;" data-bs-toggle="modal" data-bs-target="#EditSessionModal" class="mt-3 d-block text-info edit-session-button">
                                                             <small><i class="fa fa-edit me-1"></i>Edit</small>
                                                         </a>
                                                     </abp-column>
-                                                    <abp-column size="_3">
+                                                    <abp-column size="_6">
                                                         <a id="@session.Id" data-track-id="@track.Id" href="javascript:;" class="mt-3 d-block text-info delete-session-button">
                                                             <small><i class="fa fa-trash me-1"></i>Delete</small>
                                                         </a>
diff --git a/src/EventHub.Web/Pages/Events/Components/CreateEventArea/_newEventSection.cshtml b/src/EventHub.Web/Pages/Events/Components/CreateEventArea/_newEventSection.cshtml
index fe36e60..5b973bd 100644
--- a/src/EventHub.Web/Pages/Events/Components/CreateEventArea/_newEventSection.cshtml
+++ b/src/EventHub.Web/Pages/Events/Components/CreateEventArea/_newEventSection.cshtml
@@ -89,12 +89,14 @@
                       <div class="col-6">
                         @if (eventId.HasValue)
                         {
-                          <div class="image-area img-fluid rounded shadow-sm mx-auto d-block" style="background-image: url(@(UrlOptions.Value.Api.EnsureEndsWith('/') + $"api/eventhub/event/cover-image/{eventId}")" alt="@Model.Title"></div>
+                          <div id="" class="image-area img-fluid rounded shadow-sm mx-auto d-block" style="background-image: url(@(UrlOptions.Value.Api.EnsureEndsWith('/') + $"api/eventhub/event/cover-image/{eventId}")" alt="@Model.Title"></div>
+                          <div class="image-area result-area" style="display: none"><img id="imageResult" src="#" alt="" class="img-fluid rounded shadow-sm mx-auto d-block"></div>
                         }
                         else
                         {
                           <div class="image-area"><img id="imageResult" src="#" alt="" class="img-fluid rounded shadow-sm mx-auto d-block"></div>
                         }
+
                       </div>
                       <div class="col-6">
                         <div>
diff --git a/src/EventHub.Web/Pages/Events/Components/CreateEventArea/_previewSection.cshtml b/src/EventHub.Web/Pages/Events/Components/CreateEventArea/_previewSection.cshtml
index 0fd2bca..6c66c06 100644
--- a/src/EventHub.Web/Pages/Events/Components/CreateEventArea/_previewSection.cshtml
+++ b/src/EventHub.Web/Pages/Events/Components/CreateEventArea/_previewSection.cshtml
@@ -193,7 +193,7 @@
                                         {
                                             <div class="track-item text-center">
                                                 <span class="track-name text-primary"><i class="fas fa-exclamation-circle"></i> There is no session!</span>
-                                                 <span class="d-block mb-2 mt-3">Please add session.</span>
+                                                <span class="d-block mb-2 mt-3">Tracks without Session are not visible after the event is published.</span>
                                             </div>
                                         }
                                     </td>
diff --git a/src/EventHub.Web/Pages/Events/Components/CreateEventArea/create-event-area.js b/src/EventHub.Web/Pages/Events/Components/CreateEventArea/create-event-area.js
index 7c17caa..92e98e5 100644
--- a/src/EventHub.Web/Pages/Events/Components/CreateEventArea/create-event-area.js
+++ b/src/EventHub.Web/Pages/Events/Components/CreateEventArea/create-event-area.js
@@ -79,6 +79,15 @@
                             eventUrlCodeInput.val(response.urlCode);
                         }
                         SwitchToTrackCreation()
+                    },
+                    error: function (errorRaw) {
+                        abp.notify.error(errorRaw.responseJSON.error.message, 'Error', 
+                            toastr.options = {
+                                timeOut: 2500,
+                                progressBar: true,
+                                positionClass: "toast-bottom-right"
+                            }
+                        );
                     }
                 });
             });
@@ -392,9 +401,13 @@
         function NewEventFormInputAreaChangeHandler() {
             var isOnline = $("#IsOnline option:selected").val()
             if (isOnline === "True") {
+                $("#CountryId").attr("required", false);
+                $("#inputCity").attr("required", false);
                 $(".event-link-group").show();
                 $(".event-location-group").hide();
             } else {
+                $("#CountryId").attr("required", true);
+                $("#inputCity").attr("required", true);
                 $(".event-link-group").hide();
                 $(".event-location-group").show();
             }
@@ -464,7 +477,7 @@
                             readURL(file);
                         }
                     }
-
+                    
                     var objectURL = URL.createObjectURL(file);
                     img.src = objectURL;
                 });
@@ -474,6 +487,10 @@
                         var reader = new FileReader();
 
                         reader.onload = function (e) {
+                            if (eventIdInput.val().length === 36){
+                                $('.image-area').css('display', 'none').removeClass('d-block');
+                                $('.result-area').css('display', '');
+                            }
                             $('#imageResult').attr('src', e.target.result);
                             infoArea.textContent = 'File name: ' + input.name;
                         }
diff --git a/src/EventHub.Web/Pages/Events/Detail.cshtml b/src/EventHub.Web/Pages/Events/Detail.cshtml
index 11faeaf..ba16075 100644
--- a/src/EventHub.Web/Pages/Events/Detail.cshtml
+++ b/src/EventHub.Web/Pages/Events/Detail.cshtml
@@ -73,16 +73,74 @@
         </div>
         <div class="row">
             <div class="col-md-7">
-                <h5 class="detail-head mt-5 font-weight-bold">Event Description</h5>
-                <p id="EventDescription">
-                    @Model.Event.Description
-                </p>
+                @if (Model.Event.Tracks.Any())
+                {
+                    <abp-tabs>
+                        <abp-tab class="tab" title="Description">
+                            <h5 class="detail-head mt-5 font-weight-bold">Event Description</h5>
+                            <p id="EventDescription">
+                                @Model.Event.Description
+                            </p>
+
+                            <h5 class="detail-head mt-5 font-weight-bold">Date</h5>
+                            <p>
+                                @EventDateHelper.GetDateRangeText(Model.Event.StartTime, Model.Event.EndTime)
+                            </p>
+                            @await Component.InvokeAsync(typeof(AttendeesAreaViewComponent), new { eventId = Model.Event.Id })
+                        </abp-tab>
+                        <abp-tab class="tab" title=" Track / Session">
+                            <table class="table">
+                                <thead>
+                                <tr>
+                                    @foreach (var track in Model.Event.Tracks)
+                                    {
+                                        @if (track.Sessions.Any())
+                                        {
+                                            <th class="text-center" width="25%">@track.Name</th>
+                                        }
+                                    }
+                                </tr>
+                                </thead>
+                                <tbody>
+                                <tr>
+                                    @foreach (var track in Model.Event.Tracks)
+                                    {
+                                        @if (track.Sessions.Any())
+                                        {
+                                            <td>
+                                                @foreach (var session in track.Sessions)
+                                                {
+                                                    <div class="track-item">
+                                                        <span class="track-name">@session.Title.TruncateWithPostfix(25)</span>
+                                                        <small class="text-primary d-block my-2">@EventDateHelper.GetTimeRangeText(TimeOnly.FromDateTime(session.StartTime), TimeOnly.FromDateTime(session.EndTime)) | @session.Language</small>
+                                                        @foreach (var speaker in session.Speakers)
+                                                        {
+                                                            <span class="d-block mb-2">@speaker.UserName</span>
+                                                        }
+                                                    </div>
+                                                }
+                                            </td>
+                                        }
+                                    }
+                                </tr>
+                                </tbody>
+                            </table>
+                        </abp-tab>
+                    </abp-tabs> 
+                }
+                else
+                {
+                    <h5 class="detail-head mt-5 font-weight-bold">Event Description</h5>
+                    <p id="EventDescription">
+                        @Model.Event.Description
+                    </p>
 
-                <h5 class="detail-head mt-5 font-weight-bold">Date</h5>
-                <p>
-                    @EventDateHelper.GetDateRangeText(Model.Event.StartTime, Model.Event.EndTime)
-                </p>
-                @await Component.InvokeAsync(typeof(AttendeesAreaViewComponent), new {eventId = Model.Event.Id})
+                    <h5 class="detail-head mt-5 font-weight-bold">Date</h5>
+                    <p>
+                        @EventDateHelper.GetDateRangeText(Model.Event.StartTime, Model.Event.EndTime)
+                    </p>
+                    @await Component.InvokeAsync(typeof(AttendeesAreaViewComponent), new { eventId = Model.Event.Id })
+                }
             </div>
         </div>
     </div>
@@ -102,4 +160,4 @@
         MaxResultCount = 6,
         isPagination = false
     })
-</div>
\ No newline at end of file
+</div>
diff --git a/src/EventHub.Web/wwwroot/global-styles.css b/src/EventHub.Web/wwwroot/global-styles.css
index 35c9044..24507b7 100644
--- a/src/EventHub.Web/wwwroot/global-styles.css
+++ b/src/EventHub.Web/wwwroot/global-styles.css
@@ -3,8 +3,9 @@
 .border-light {
     border-color: #E1E5E9 !important;
 }
-.text-info { 
-    color: #6F32E2!important;
+
+.text-info {
+    color: #6F32E2 !important;
 }
 
 
@@ -34,8 +35,8 @@
 
 .progresses ul li.create-steps.blue {
     color: #fff;
-    background-color: #00044A;  
-    border-color: #00044A;  
+    background-color: #00044A;
+    border-color: #00044A;
 }
 
 .progresses ul li.create-steps span {
@@ -44,12 +45,12 @@
     left: -30px;
     font-size: 0.8rem;
     width: 90px;
-    color:#bfc6cd;
-} 
+    color: #bfc6cd;
+}
 
-.progresses ul li.create-steps.blue  span { 
-    color:#00044A;
-} 
+.progresses ul li.create-steps.blue span {
+    color: #00044A;
+}
 
 .progresses .progress {
     height: 2px;
@@ -59,64 +60,73 @@
     background-color: #DCE0E5;
     border-radius: 10px
 }
-.progress-bar { 
-    background-color: #00044A; 
+
+.progress-bar {
+    background-color: #00044A;
 }
 
-.nav-pills .nav-link.active, .nav-pills .show > .nav-link { 
+.nav-pills .nav-link.active, .nav-pills .show > .nav-link {
     background-color: #00044A !important;
 }
 
-.big-square-btn .btn {    
+.big-square-btn .btn {
     border: 1px solid rgba(107, 126, 146, 0.20);
     min-height: 177px;
     background: rgba(107, 126, 146, 0.05);
 }
-.big-square-btn .btn:hover {    
+
+.big-square-btn .btn:hover {
     color: #E8345D;
     background: #fff;
 }
-.big-square-btn .fa-plus {    
-    border: 2px dashed; 
+
+.big-square-btn .fa-plus {
+    border: 2px dashed;
     width: 34px;
     height: 34px;
     border-radius: 34px;
     line-height: 30px;
 }
 
-.track-item {    
+.track-item {
     border: 1px solid rgba(107, 126, 146, 0.20);
     padding: 1.5em;
     border-radius: 10px;
     min-height: 177px;
     margin-bottom: 1em;
 }
-.track-item .track-name{    
+
+.track-item .track-name {
     font-weight: 500;
     font-size: 1.125em;
     color: #03044a;
 }
+
 .table > :not(:first-child) {
     border-top: 1px solid currentColor;
-} 
-.table td, .table th { 
+}
+
+.table td, .table th {
     font-weight: normal;
     padding: 16px 8px;
     color: #6B7E92;
 }
+
 .text-primary {
     color: #E8345D !important;
-} 
+}
+
 .preview-item {
     color: #00044A;
 }
 
-.price small{
+.price small {
     font-size: 20px;
     color: #00044A;
     font-weight: 800;
 }
-.price span{
+
+.price span {
     font-size: 60px;
     color: #00044A;
     font-weight: 800;
@@ -127,11 +137,13 @@
     padding: 0;
     margin: 0 30px 0 40px;
 }
-.list-check-icon li{
+
+.list-check-icon li {
     margin: 1em 2em;
 }
+
 .list-check-icon .fa {
-    color:#E8345D; 
+    color: #E8345D;
     margin: 0 10px 0 -28px;
 }
 
@@ -140,16 +152,19 @@
     border-color: #6F32E2;
     color: white;
 }
+
 .btn-info:hover {
     background: #662ad6;
     border-color: #662ad6;
     color: white;
 }
+
 .btn-check:focus + .btn-info, .btn-info:focus {
     background: #662ad6;
     border-color: #662ad6;
     color: white;
 }
+
 .faq.shown {
     background-color: #fff9f7;
 }
@@ -167,17 +182,17 @@
 }
 
 .faq-container .faq button.btn.btn-faq.collapsed {
-    
+
 }
 
-.faq-container .faq button.btn.btn-faq .fas{    
+.faq-container .faq button.btn.btn-faq .fas {
     position: absolute;
     top: 15px;
     left: 0px;
 }
 
-.faq-container .faq button.btn.btn-faq.collapsed .fas{
-    color:#E8345D;   
+.faq-container .faq button.btn.btn-faq.collapsed .fas {
+    color: #E8345D;
     transform: rotate(180deg);
 }
 
@@ -196,14 +211,15 @@
     padding: 15px 0 10px 0;
 }
 
-.btn-check:focus + .btn, .btn:focus { 
+.btn-check:focus + .btn, .btn:focus {
     box-shadow: none;
 }
 
 .text-dark {
     font-weight: 700;
     color: #03044a !important;
-} 
+}
+
 .modal-icon {
     display: block;
     font-size: 64px;
@@ -211,6 +227,7 @@
     margin-bottom: 30px;
     color: #6F32E2;
 }
+
 .rounded-3 {
     border-radius: 1rem !important;
 }
@@ -222,3 +239,18 @@
     overflow: hidden;
     width: 140px;
 }
+.nav-tabs .nav-link {
+    width: 217px !important;
+    left: 452px !important;
+    top: 567px !important;
+    border-radius: unset !important;
+    font-size: 20px !important;
+    line-height: 24px !important;
+    color: #6B7E92 !important;
+}
+
+.nav-tabs .active, .btn:hover {
+    color: #00044A !important;
+    border: unset !important;
+}
+