#top-header .container {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.header-links {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    align-items: center;
}

.header-links li {
    padding: 0 10px;
}

.pull-left {
    justify-content: flex-start;
}

.pull-right {
    justify-content: flex-end;
}
/* Alapértelmezett stílusok */
#search-bar .header-search form {
    display: flex;
    width: 100%;
}

#search-bar .input {
    flex-grow: 1; /* Rugalmasan foglal helyet, de figyelembe veszi a max-width korlátot is */
    max-width: 450px; /* Maximális szélesség */
    width: 100%; /* Alapértelmezés szerint szélesít */
    border-top-left-radius: 40px;
    border-bottom-left-radius: 40px;
}

.search-btn {
    border-top-right-radius: 40px;
    border-bottom-right-radius: 40px;
}

/* Médialekérdezések kisebb képernyőkhöz */
@media (max-width: 450px) {
    #search-bar .input {
        max-width: 100%; /* Kis képernyőkön teljes szélességet használ */
    }
}
.dropdown-menu {
    box-shadow: 0 4px 8px rgba(0,0,0,0.1); /* Árnyék hozzáadása */
    border-radius: 8px; /* Kerekített sarkok */
    padding: 10px; /* Több tér az elemek között */
    border: none; /* Eltávolítjuk az alapértelmezett keretet */
}

.dropdown-menu ul {
    list-style: none; /* Listajelölők eltávolítása */
    margin: 0;
    padding: 0;
}

.dropdown-menu li {
    padding: 8px 0; /* Több tér minden elem között */
    border-bottom: 1px solid #f1f1f1; /* Elválasztó vonal hozzáadása */
}

.dropdown-menu li:last-child {
    border-bottom: none; /* Az utolsó elem alatti elválasztó vonal eltávolítása */
}

.dropdown-menu .dropdown-item {
    display: block; /* Teljes szélességű elemek */
    padding: 8px 20px; /* Nagyobb padding az elemeknek */
    color: #333; /* Szövegszín beállítása */
    text-decoration: none; /* Az aláhúzás eltávolítása a linkekről */
    transition: background-color 0.2s ease-in-out; /* Sima háttérszín átmenet */
}

.dropdown-menu .dropdown-item:hover {
    background-color: #f8f8f8; /* Háttérszín megváltoztatása amikor ráviszik az egeret */
}

.balance {
    font-weight: bold; /* Az egyenleg kiemelése */
}
/* CSS for the dropdown */
        .dropdown-content {
            display: none;
            position: absolute;
            background-color: #f9f9f9;
            min-width: 160px;
            box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
            z-index: 1;
        }

        .dropdown-content a {
            color: black;
            padding: 12px 16px;
            text-decoration: none;
            display: block;
        }

        .dropdown-content a:hover {
            background-color: #f1f1f1;
        }

        .dropdown:hover .dropdown-content {
            display: block;
        }
.rainbow-text a {
            background: linear-gradient(90deg, red, orange, yellow, green, blue, indigo, violet, red);
            background-size: 400%;
            -webkit-background-clip: text;
            background-clip: text;
            color: transparent;
            animation: rainbow-animation 10s linear infinite;
            }

            @keyframes rainbow-animation {
                0% { background-position: 0% 50%; }
                50% { background-position: 100% 50%; }
                100% { background-position: 0% 50%; }
            }

            .button {
  height: 60px;
  width: 200px;
  background-color: #132233;
  border: 2px solid rgb(182, 128, 128);
  color: #eee;
  transition: .6s;
  font-size: 15px;
  border-radius: 50px;
  display: flex;
  justify-content: center;
  align-items: center;
  /* padding: 20px; */
  overflow: hidden;
}

.button span {
  transform: translateX(10px);
  transition: .5s;
}

.button svg {
  transform: translateX(-300px);
  transition: .6s;
  z-index: 3;
  height: 20px;
}

.button:hover {
  width: 60px;
  background-color: rgba(51, 34, 51, 0.815);
  box-shadow: 20px 20px 96px #bebebe,-20px -20px 96px #ffffff;
}

.button:hover svg {
  transform: translateX(-5px);
}

.button:hover span {
  transform: translateY(70px);
  font-size: .1rem;
}