 /* Navbar */
 .navbar {
     background-color: #181829;
     box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
 }

 .navbar-brand {
     font-weight: 700;
     color: #ffffff;
 }

 .navbar-brand:hover {
     color: #00f5d4;
 }

 .nav-link {
     color: #ffffff !important;
     position: relative;
     padding: 8px 15px;
 }

 .nav-link::after {
     content: "";
     position: absolute;
     width: 0%;
     height: 2px;
     bottom: 0;
     left: 0;
     background-color: #00f5d4;
     transition: width 0.3s;
 }

 .nav-link:hover::after {
     width: 100%;
 }





 body {
     background-color: #f8f9fa;
 }

 .video-section {
     padding: 60px 15px;
 }

 .video-section h2 {
     font-weight: bold;
     color: #222;
 }

 .video-card {
     background-color: white;
     border-radius: 15px;
     overflow: hidden;
     box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
     transition: transform 0.3s ease, box-shadow 0.3s ease;
 }

 .video-card:hover {
     transform: translateY(-5px);
     box-shadow: 0 8px 16px rgba(0, 0, 0, 0.15);
 }

 .video-card iframe {
     width: 100%;
     height: 200px;
     border: none;
 }

 .video-card-body {
     padding: 15px;
 }

 .video-card-body h5 {
     font-weight: 600;
 }

 @media (max-width: 768px) {
     .video-card iframe {
         height: 180px;
     }
 }

 @media (max-width: 576px) {
     .video-card iframe {
         height: 160px;
     }
 }

 /* Scroll To Top Button Styling */
 #scrollTopBtn {
     display: none;
     /* Hidden by default */
     position: fixed;
     bottom: 40px;
     right: 30px;
     z-index: 99;
     font-size: 22px;
     border: none;
     outline: none;
     background-color: #007bff;
     color: white;
     cursor: pointer;
     padding: 12px 16px;
     border-radius: 50%;
     box-shadow: 0 4px 6px rgba(0, 0, 0, 0.2);
     transition: 0.3s ease;
 }

 #scrollTopBtn:hover {
     background-color: #0056b3;
     transform: scale(1.1);
 }


 .social-icon:hover {
     color: #ffc107 !important;
     transition: 0.3s;
 }

 footer a:hover {
     color: #ffc107;
     text-decoration: underline;
 }