/* Genel stil ve ayarlar */
 body { 
   background-color: grey; 
         margin: 0;
         padding: 0;
         font-family: Arial, sans-serif;
        
     }

   
   h2{
      box-shadow: 10px 2px 5px 5px rgba(255, 255, 255, 0.4);
      color:white;
      text-align: center;
     border-radius: 5px;
     padding:20px;
      margin: 20px;
   }

     form {
         background-color: black;
         padding: 200px;
         border-radius: 5px;
         box-shadow: 20px 2px 5px rgba(0, 0, 0, 0.5);
         margin: 200px;
         max-width: 1200px;
         
     }

     input[type="text"],  
     input[type="tel"],
     input[type="number"],
     input[type="email"],
     input[type="telefon"],
     input[type="password"],
     input[type="date"],
     input[type="bolum"],
     select {
         width: 100%;
         padding: 10px;
         margin-bottom: 10px;
         border: 2px solid #ccc;
         border-radius: 4px;
         box-sizing: border-box;
     }
     
     .textarea {
         width: 100%;
         padding: 10px;
         margin-bottom: 10px;
         border: 1px solid #ccc;
         border-radius: 4px;
         box-sizing: border-box;
         height:300px;
     }

     input[type="file"] {
         background-color: orange;
         color: black;
         border: none;
         padding: 10px 20px;
         border-radius: 4px;
         cursor: pointer;
     }

     input[type="file"]:hover {
         background-color: greenyellow;
     }

     button[type="submit"] {
         background-color: lightblue;
         color: black;
         border: none;
         padding: 13px 270px;
         border-radius: 4px;
         cursor: pointer;
     }

     button[type="submit"]:hover {
         background-color: greenyellow;
     }
     
     .sendMessageButton {
       width: 1200px;
     }

 .button {
     background-color: white; /* Mavi düğme rengi */
     color: black; /* Beyaz metin rengi */
     border: none;
     border-radius: 5px; /* Köşeleri yuvarlatılmış düğme */
     padding: 15px 30px; /* Daha büyük içerik alanı */
     margin: 10px;
     cursor: pointer;
     font-size: 1rem; /* Daha büyük yazı boyutu */
 }

 .button:hover {
     background-color: white; /* Daha koyu mavi hover durumunda */
 }
 .button-container {
   text-align: center;
   margin-top: 5px;
}
.gg{
     padding: auto;
   
   margin: auto;
}


.nav {
    display: flex;
    justify-content: space-between;
    padding: 10px;
    color :white;
    background-color: rgb(105,105,105);
    float: none; /* veya right */
   
}

.navbar-brand img {
    height: 40px; /* Adjust the height of the logo */
}

.navbar-nav {
    display: flex;
    justify-content: flex-end; /* Öğeleri sağa yaslayalım */
    margin-right: 0px; /* Genel boşluğu dengelemek için navbar'ın sağındaki boşluğu ayarlayalım */
}

.nav-item {
    margin-right: 10px; /* Her öğe arasında 10px boşluk bırakalım */
    list-style: none;
}

/* Son öğenin sağ boşluğunu kapatmak için */
.nav-item:last-child {
   
}


.nav-link {
    text-decoration: none;
    color :rgb(255,255,255);
   
}

.nav-link:hover {
    color: orange; /* Change the color on hover */
}

.sub-menu {
    list-style: none;
    display: none;
    position: absolute;
    border-radius: 5px;
    padding: 10px;
 background-color: grey;; /*Set the background color to violet*/
}

.nav-item:hover .sub-menu {
    display: block;
}
.sub-menu a {
    text-decoration: none;
    color: white;
}

.sub-menu a:hover {
    text-decoration: none;
    color: orange;
}

/* Sadece bir öğe yanacak */
.sub-menu li:hover a {
    color: orange;
}

footer {
             background-color:rgb(0,179,90); 
            color: #fff;
            text-align: center;
            padding: 20px;
            margin:200px  5px 0 5px;
        }

        .social-icons a {
            color: white;
            text-decoration: none;
            font-size: 24px;
            margin: 0 10px;
        }
/*sosyal medya */

.fa {
  padding: 20px;
  color: white;
  font-size: 30px;
  width: 50px;
  text-align: center;
  text-decoration: none;
  margin: 5px 2px;
}

.fa:hover {
    opacity: 0.7;
}



/* sayac styling  */

    .counter-container {
      display: flex; 
      flex-wrap: wrap;
      justify-content: right;
      align-items: center;
      margin-top: 20px;
    }

    .counter-circle {
      position: relative;
      width: 75px;
      height: 75px;
      border-radius: 50%;
      font-size: 12px;
      text-align: center;
      margin: 20px;
      display: flex;
      align-items: center;
      justify-content: center;
    }

    .label {
      position: absolute;
      bottom:15px;
      width: 15%;
      text-align: center
     ;
    }

    .counter-value {
      font-size: 14px;
      font-weight: bold;
    }

    #day {
      color: red;
      border: 4px solid red;
      background-color: rgba(255, 0, 0, 0.2); 
    }

    #hour {
      color: green;
      border: 4px  solid green;
      background-color: lightgreen;
    }

    #minute {
      color: blue;
      border: 4px  solid blue;
      background-color: lightblue;
    }

    #second {
      color: violet;
      border: 4px  solid violet;
      background-color: rgba(138, 43, 226, 0.2);
    }
   

.custom-links ul {
    display: flex;
    list-style-type: none;
    padding: 0;
    margin: 0;
}

.custom-links ul li {
    margin-right: 15px;
}

/* Son elemanın sağ kenar boşluğunu kaldırır */
.custom-links ul li:last-child {
    margin-right: 0;
}














/* Mobil cihazlar için navbar görünürlüğü */
@media (max-width: 768px) {
    /* Navbar */
    .navbar-nav {
        flex-direction: column;
        padding-left: 0;
        margin-bottom: 0;
    }

    .navbar-nav .nav-item {
        width: 100%;
        text-align: center;
        border-bottom: 2px solid #ddd; /* İsteğe bağlı: her menü arasına çizgi ekleyebilirsiniz */
    }

   

    .navbar-nav .nav-link {
        padding:15px; /* Yazı ve bağlantı alanları arasındaki mesafeyi artırır */
         
         float:left;
    }

    .navbar-toggler {
        margin-right: 5px; /* Mobile açma/kapama butonunun kenar boşluğunu artırır */
    }

    .navbar-collapse {
        margin-top: 50px; /* Açılan menünün içeriğinin en üstte görünmesini sağlar */
    }

}

    .custom-links {
       width: 100vh; /* Ekranın yüksekliği kadar yer kapla */
      
        padding:10px;
    }

/* 600 piksel ve daha küçük ekranlar için */
@media (max-width: 600px) {
    .navbar-nav .nav-link {
        padding: 10px; /* Örnek olarak navbar linklerinin padding değerlerini değiştirdik */
        /* Diğer öğeler için gerekli düzenlemeleri yapabilirsiniz */
    }
    /* Diğer özel stillendirmeler */
}

/* 1080 piksel ve daha büyük ekranlar için */
@media (min-width: 1080px) {
    .navbar-nav .nav-link {
        padding: 20px; /* Örnek olarak navbar linklerinin padding değerlerini değiştirdik */
        /* Diğer öğeler için gerekli düzenlemeleri yapabilirsiniz */
    }
    /* Diğer özel stillendirmeler */
}