<style>
lang {
  display: flex;
  justify-content: flex-end;
  padding: 10px;
  background-color: #f8f8f800;
}

.language-flags {
  display: flex;
  gap: 10px; /* Bayraklar arasındaki boşluk */
}

.language-flags img {
  width: 27px; /* Bayrak genişliği */
  height: auto; /* Oranları korumak için */
  border: 3px solid #ddd; /* İsteğe bağlı: Bayraklara kenarlık ekler */
  border-radius: 15px; /* İsteğe bağlı: Köşeleri yuvarlar */
}
</style>

<style>
     .hover-effect {
  transition: transform 0.3s ease-in-out;
}

.hover-effect:hover {
  transform: scale(1.1) rotate(5deg); /* Büyür ve hafifçe döner */
}

/* Mobil cihazlarda dil bayraklarını göster */
@media (max-width: 1023px) {
    .language-flags-mobil {
      border: 2px solid #ddd; /* İsteğe bağlı: Bayraklara kenarlık ekler */
  border-radius: 8px; /* İsteğe bağlı: Köşeleri yuvarlar */
        display: block; /* veya inline, inline-block, flex vb. */
    }
}

/* Masaüstü cihazlarda dil bayraklarını gizle */
@media only screen and (min-width: 768px) and (max-width: 1024px) {
    .language-flags-mobil {
      border: 2px solid #ddd; /* İsteğe bağlı: Bayraklara kenarlık ekler */
  border-radius: 8px; /* İsteğe bağlı: Köşeleri yuvarlar */
        display: none;
    }

   


}
    </style>