.fixed-bar {
     position: fixed;
     top: 0;
     left: 0;
     width: 100%;
     background: #002443;
     color: white;
     z-index: 1000;
     transition: all 0.3s ease;

 }

 .fixed-bar.shrink {
     padding: 0px 0;
     /* smaller height when scrolled */
 }

 .content {
     margin-top: 120px;
 }

 #logo {
     text-align: left;
 }

 #header {
     width: 100%;
     text-align: center;
     border-collapse: collapse;
 }

 #header img {
     height: 100px;
     transition: height 0.3s ease;
 }

 .fixed-bar.shrink #header img {
     height: 60px;
     /* logo shrinks too */
 }

 body {
     margin: 0;
     font-family: 'Montserrat', sans-serif;
     overflow-x: hidden;
     background: linear-gradient(to bottom, #002443, #ffffff);
    
 }

 /* Hero section */
 .hero {
     position: relative;
     width: 100%;
     height: 100vh;
     overflow: hidden;
 }

 .backVid {
     position: absolute;
     top: 0;
     left: 0;
     min-width: 100%;
     min-height: 100%;
     object-fit: cover;
     z-index: -1;
 }

 .overlay {
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
     background-color: rgba(0, 0, 0, 0.4);
     z-index: 0;
 }

 .styled-text {
     position: absolute;
     top: 50%;
     left: 50%;
     transform: translate(-50%, -50%);
     font-weight: 700;
     font-size: 2.5rem;
     letter-spacing: 3px;
     text-transform: uppercase;
     color: #fff;
     text-align: center;
     z-index: 1;
 }

 /* Footer centered on video */
 #footer {
     position: fixed;
     bottom: 0;
     left: 0;
     width: 100%;
     background-color: #002443;
     text-align: center;
     color: white;
     padding: 10px 10px;
     z-index: 1000;
 }

 th:hover {
     background-color: #011a31;
 }

 a {

     color: white;
     text-decoration: none;
 }

 #footer th {
     padding: 0 10px;
 }

 #footer img {
     vertical-align: middle;
 }

 .destination {
     position: relative;
     display: inline-block;
     text-align: center;
     padding: 30px;
     margin-top: -100px;
     margin-bottom: 40px;
     height: 300px;
 }

 .destination img {
     width: 400px;
     height: 250px;
     display: block;
     opacity: 80%;
     border-radius: 2%;
 }
  .destination img:hover {
  transform: scale(1.2); /* 20% uvećanje */
}

 .destination .text {
     position: absolute;
     bottom: 80px;
     /* pomeri tekst dole */
     left: 50%;
     /* centriraj po horizontali */
     transform: translateX(-50%);
     color: white;
     font-size: 30px;
     text-shadow: 2px 2px 5px black;
     padding: 20px;
     /* da se bolje vidi */

 }

 .destinationTable {
     text-align: center;
     margin:auto;
 }
 #drugired{
    margin-top:-100px ;
 }
 h2{
    user-select: none;
 }
.dropdown {
  position: relative;
}

.dropdown-content {
  position: absolute;
  width: 100%;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  background-color: #002443;
  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.25);
  z-index: 1001;

  opacity: 0;
  max-height: 0;
  overflow: hidden;
  transition: opacity 0.3s ease, max-height 0.3s ease;
}

.dropdown-content a {
  display: block;
  padding: 10px 14px;
  color: white;
  text-decoration: none;
}

.dropdown-content a:hover {
  background-color: #011a31;
}

.dropdown:hover .dropdown-content {
  opacity: 1;
  max-height: 500px; /* big enough to fit your items */
}