.uye-ol-container {
            position: relative;
            width: 100%;
            height: 200px;
            background-position: bottom center;    /* Görselin alt kısmından başlayarak hizalanması */
    background-repeat: no-repeat;          /* Görselin tekrar etmesini engelle */
    background-size: cover; 
            border-radius: 8px;
            overflow: hidden;
            background-image: url('https://neosepet.com/image/catalog/neosepet-uye-ol-bg.png');
margin-bottom:25px;
        }



        .uye-ol-text-container {
            position: absolute; /* Metni div'e göre konumlandır */
            top: 50%; /* Dikeyde ortala */
            left: 15px; /* Yatayda soldan 15px boşluk bırak */
            transform: translateY(-50%); /* Dikey ortalamayı düzelt */
            color: #ffffff;
            font-weight: bold;
            font-size: 25px;;
        }

	.uye-ol-text-container p {

            color: #ffffff;

        }

.bgwhite{
background-color:#ffffff;
}

.homepage-container-bg {
            position: relative;
            width: 100%;
            height: 100%;
            background-position: top center;    /* Görselin alt kısmından başlayarak hizalanması */
    background-repeat: no-repeat;          /* Görselin tekrar etmesini engelle */
    background-size: cover; 
            border-radius: 8px;
            overflow: hidden;
            background-image: url('https://neosepet.com/image/catalog/neosepet-homepage-bg1.png');
        }

  
.product-card-handy {
            border: 1px solid #ddd;
            border-radius: 10px;
            overflow: hidden;
            transition: transform 0.3s, box-shadow 0.3s;
	    padding-bottom:5px;
	    margin-top:10px;
	    margin-bottom:10px;
 position: relative; /* Badge için referans noktası oluştur */
        }

        .product-card-handy:hover {
            transform: translateY(-5px);
            box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
        }
  .product-card-handy img {
  max-width: 280px;  /* Resmin maksimum genişliği */
    max-height: 290px; /* Resmin maksimum yüksekliği */

}

        .product-image-handy {
            height: 200px;
            object-fit: cover;
        }

        .buy-now-handy {
            background-color: #ff5722;
            color: white;
            border: none;
            transition: background-color 0.3s;

        }

        .buy-now-handy:hover {
            background-color: #e64a19;
        }

.badgem {
    position: absolute;     /* Resmin üzerine yerleştir */
    top: 10px;              /* Resimden 10px aşağıda */
    left: 10px;             /* Resimden 10px içeride */
    background-color: #f61d31;  /* Arka plan rengi */
    color: #ffffff;           /* Yazı rengi */
    padding: 5px 10px;      /* Etiketin iç dolgusu */
    font-size: 11px;        /* Yazı boyutu */
    font-weight: bold;      /* Yazı kalınlığı */
    border-radius: 5px;     /* Köşeleri yuvarlat */
    text-transform: uppercase; /* Yazıyı büyük harfe çevir */
    display: flex;
    align-items: center;    /* Yazıyı ve ikonu dikeyde ortalar */
}

.badgem i {
    margin-right: 5px;   /* İkon ile yazı arasında boşluk bırakır */
}

























.content-bosluk {
padding: 20px;
    }

    /* Sadece mobil cihazlar için */
    @media (max-width: 768px) {
      .content-bosluk {
        margin-top: calc(1.5em * 5); /* 10 satır boşluk */
      }
	}













.campaign-container {
      position: relative;
      text-align: center;
      animation: float 5s infinite ease-in-out;
    }

    @keyframes float {
      0%, 100% {
        transform: translateY(-10px);
      }
      50% {
        transform: translateY(10px);
      }
    }

    .speech-bubble {
        background: linear-gradient(135deg, #bb0542, #ffc77e);
      color: #ffffff;
      font-size: 2rem;
      font-weight: bold;
      padding: 30px;
      border-radius: 25px;
      box-shadow: 0 8px 15px rgba(0, 0, 0, 0.2);
      position: relative;
    }

    .speech-bubble:after {
      content: '';
      position: absolute;
      bottom: -20px;
      left: 50%;
      transform: translateX(-50%);
      border-width: 20px;
      border-style: solid;
      border-color: #fff transparent transparent transparent;
    }

    .sparkles {
      position: absolute;
      width: 100%;
      height: 100%;
      top: 0;
      left: 0;
      overflow: hidden;
    }

    .sparkles span {
      position: absolute;
      width: 10px;
      height: 10px;
      background: rgba(255, 255, 255, 0.6);
      border-radius: 50%;
      animation: sparkle 4s infinite ease-in-out;
    }

    @keyframes sparkle {
      0% {
        transform: scale(0.5);
        opacity: 0.6;
      }
      50% {
        transform: scale(1.2);
        opacity: 1;
      }
      100% {
        transform: scale(0.5);
        opacity: 0;
      }
    }

    /* Random sparkle positions */
    .sparkles span:nth-child(1) { top: 10%; left: 20%; animation-delay: 0s; }
    .sparkles span:nth-child(2) { top: 25%; left: 70%; animation-delay: 1s; }
    .sparkles span:nth-child(3) { top: 60%; left: 40%; animation-delay: 2s; }
    .sparkles span:nth-child(4) { top: 80%; left: 90%; animation-delay: 0.5s; }
    .sparkles span:nth-child(5) { top: 50%; left: 10%; animation-delay: 1.5s; }
    .sparkles span:nth-child(6) { top: 44%; left: 15%; animation-delay: 1.8s; }
    .sparkles span:nth-child(7) { top: 87%; left: 49%; animation-delay: 1.2s; }
    .sparkles span:nth-child(8) { top: 32%; left: 48%; animation-delay: 2.8s; }
    .sparkles span:nth-child(9) { top: 75%; left: 86%; animation-delay: 1.3s; }
    .sparkles span:nth-child(10) { top: 15%; left:88%; animation-delay: 3.8s; }





.product-red-box{
border-radius:5px; 
background-color:#ffd9dc; 
color:#be0000; 
padding:5px;
font-size:11px; 
font-weight:bold;
}


.product-green-box{
border-radius:5px; 
background-color:#d9ffdc; 
color:#228B22; 
padding:5px; 
font-size:11px; 
font-weight:bold;
}





.ucuza-static-text {
font-family: 'Arial', sans-serif;
          font-size: 18px;
            font-weight: bold;
            color: #ffffff;
              background: linear-gradient(90deg, #0057e7, #00c9a7, #0f9b8e);
            background-clip: text;
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
            text-align: center;
            letter-spacing: 0px;
            /* text-shadow: 2px 2px 6px rgba(0, 0, 0, 0.3); */
            border: 2px solid transparent;
            padding: 10px;
            border-radius: 10px;
            /*box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);*/
            background-origin: border-box;
        }





.responsive-image {
  width: 100%; /* Ekranın genişliğini tamamen kaplar */
  height: auto; /* Yüksekliği genişlikle orantılı olarak ayarlanır */
  display: block; /* Tarayıcı hatalarını önler */
margin-bottom:10px;
border-radius:5px;
}















	.info-box {
            display: flex;
            align-items: center;
            background: linear-gradient(145deg, #ffffff, #f3f0df);
            border: 1px solid #ffa51e;
            border-radius: 10px;
            padding: 10px;
            box-shadow: 0 8px 15px rgba(0, 0, 0, 0.1);
		margin-bottom:10px;

		

            
        }
        .info-box img {
            width: 25px;
            height: 25px;
            margin-right: 20px;
        }
        .info-box p {
            margin: 0;
            font-size: 13px;
            color: #333333;
            line-height: 1.5;
        }
        .info-box p span {
            font-weight: bold;
            color: rgb(46, 46, 46);
        }