
body {
     font-family: 'Times New Roman', Times, serif;
     background: url('Fn.webp') center/cover no-repeat;
     background-attachment: fixed;
     color: #f5f5f5;
     position: relative;
     font-size: large;
 }

 .navbar {
     z-index: 1000;
 }

 .navbar-nav .nav-link {
     color: #f5f5f5 !important;
     transition: color 0.3s ease;
 }

 .navbar-nav .nav-link:hover {
     color: #ffcc00 !important;
 }

 .lang-links {
     margin-left: auto;
 }

 .lang-links a {
     margin-right: 10px;
     color: #f5f5f5;
     text-decoration: none;
     transition: color 0.3s ease;
 }

 .lang-links a:hover {
     color: #ff6f00;
 }

 @media (max-width: 992px) {
     .lang-links {
         margin-left: 0;
         margin-top: 10px;
         text-align: center;
     }
 }

 body::before {
     content: '';
     position: fixed;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
     background: rgba(0, 0, 0, 0.5);
     z-index: -1;
 }

 .hero {
     background: url('Kn.webp') center/cover no-repeat;
     height: 60vh;
     display: flex;
     justify-content: center;
     align-items: center;
     text-align: center;
     opacity: 0;
     animation: fadeIn 2.5s forwards;
 }

 @media (min-width: 1024px) {
     .hero {
         height: 80vh;
         background-size: contain;
     }
 }

 @keyframes fadeIn {
     to {
         opacity: 1;
     }
 }

 .hero h1 {
     font-size: 2.2rem;
     background: linear-gradient(to bottom, #ffcc00, #ff6f00);
     -webkit-background-clip: text;
     -webkit-text-fill-color: transparent;
     text-shadow: 2px 2px 20px rgba(0, 0, 0, 0.873);
     display: inline-flex;
     align-items: center;
     gap: 1rem;
 }

 .section-title {
     margin-top: 2rem;
     font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
     margin-bottom: 1.5rem;
     letter-spacing: 3px;
     color: #ff0000;
     font-weight: bold;
 }

 footer {
     background-color: #1111119a;
     padding: 1rem 0;
     text-align: center;
     color: #bbb;
 }

 .carousel-item img {
     object-fit: cover;
     height: 60vh; 
     max-height: 300px;  
     max-width: 370px;  
 }
 
 .button {
     width: 180px;
     height: 60px;
     cursor: pointer;
     background: transparent;
     border: 1px solid #f10000;
     outline: none;
     transition: 1s ease-in-out;
     margin: 10px;
     position: relative;
     display: inline-block;
 }

 .button svg {
     position: absolute;
     left: 0;
     top: 0;
     fill: none;
     stroke: #fff;
     stroke-dasharray: 150 480;
     stroke-dashoffset: 150;
     transition: 1s ease-in-out;
 }

 .button:hover {
     transition: 1s ease-in-out;
     background: #e42a11;
 }

 .button:hover svg {
     stroke-dashoffset: -480;
 }

 .button span {
     color: white;
     font-size: 18px;
     font-weight: 100;
     z-index: 1;
 }

 table {
     width: 100%;
     border-collapse: collapse;
     margin-top: 2rem;
     background-color: rgba(0, 0, 0, 0.6);
     color: #fff;
 }

 table, th, td {
     border: 1px solid #ff2121;
 }

 th, td {
     padding: 10px;
     text-align: left;
 }

 th {
     background-color: #780000;
 }

 .carousel-item img {
     object-fit: cover;
     height: 500px;
 }
 .container-fluid a {
     padding: 3px;
 }
 .video-container {
position: relative;
width: 100%;
padding-bottom: 56.25%; 
height: 0;
overflow: hidden;
margin: auto; 
}

.video-container iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
border: none;
}