@media (max-width:320px){


}

@media (min-width:321px){  
    .child-top-baslik {padding-top: 50px !important;}
    .child-top-icerik {padding: 0px !important; padding-top: 30px !important;}
    .child-center-bg {background: url('/images/child-center-bg.webp') no-repeat center top; min-height:1500px; background-size: contain; margin-top: -200px; padding-top: 150px;}
    .child-neon-circle {background:rgba(0, 0, 0, 0); width: auto; height:auto; border-radius: 50%; padding:10px;}
    
    .child-neon-baslik-1 {background: #fff600; width: 170px; height: 170px; border-radius: 50%; display: flex; align-items: center; justify-content: center; color: #000000; text-align: center; font-weight: bold; font-size: 20px; line-height: 1.3; position: relative; z-index: 2; padding: 20px;}
    .child-neon-baslik-1-circle {background: #fff600; width: 220px; height: 220px; border-radius: 50%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); filter: blur(20px); opacity: 0.7; z-index: 1;}
    .child-img-1-neon-circle {background: #eee509; width: auto; height: 520px; border-radius: 50%; position: absolute; top: 50%; left: 40%; transform: translate(-50%, -50%); filter: blur(120px); opacity: 0.5;}
    
    .child-neon-baslik-2 {background: #f92c32; width: 170px; height: 170px; border-radius: 50%; display: flex; align-items: center; justify-content: center; color: #000000; text-align: center; font-weight: bold; font-size: 20px; line-height: 1.3; position: relative; z-index: 2; padding: 20px;}
    .child-neon-baslik-2-circle {background: #f92c32; width: 220px; height: 220px; border-radius: 50%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); filter: blur(20px); opacity: 0.7; z-index: 1;}
    .child-img-2-neon-circle {background: #f92c32; width:auto; height: 520px; border-radius: 50%; position: absolute; top: 50%; left: 60%; transform: translate(-50%, -50%); filter: blur(120px); opacity: 0.5;}
   
    .child-neon-baslik-3 {background: #007eff; width: 170px; height: 170px; border-radius: 50%; display: flex; align-items: center; justify-content: center; color: #000000; text-align: center; font-weight: bold; font-size: 20px; line-height: 1.3; position: relative; z-index: 2; padding: 20px;}
    .child-neon-baslik-3-circle {background: #007eff; width: 220px; height: 220px; border-radius: 50%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); filter: blur(20px); opacity: 0.7; z-index: 1;}
    .child-img-3-neon-circle {background: #007eff; width: auto; height: 520px; border-radius: 50%; position: absolute; top: 50%; left: 40%; transform: translate(-50%, -50%); filter: blur(120px); opacity: 0.5;}
    
    .child-neon-baslik-4 {background: #ff8a00; width: 170px; height: 170px; border-radius: 50%; display: flex; align-items: center; justify-content: center; color: #000000; text-align: center; font-weight: bold; font-size: 20px; line-height: 1.3; position: relative; z-index: 2; padding: 20px;}
    .child-neon-baslik-4-circle {background: #ff8a00; width: 220px; height: 220px; border-radius: 50%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); filter: blur(20px); opacity: 0.7; z-index: 1;}
    .child-img-4-neon-circle {background: #ff8a00; width:auto; height: 520px; border-radius: 50%; position: absolute; top: 50%; left: 60%; transform: translate(-50%, -50%); filter: blur(120px); opacity: 0.5;}
   
    .child-neon-baslik-5 {background: #fff600; width: 170px; height: 170px; border-radius: 50%; display: flex; align-items: center; justify-content: center; color: #000000; text-align: center; font-weight: bold; font-size: 20px; line-height: 1.3; position: relative; z-index: 2; padding: 20px;}
    .child-neon-baslik-5-circle {background: #fff600; width: 220px; height: 220px; border-radius: 50%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); filter: blur(20px); opacity: 0.7; z-index: 1;}
    .child-img-5-neon-circle {background: #fff600; width: auto; height: 520px; border-radius: 50%; position: absolute; top: 50%; left: 40%; transform: translate(-50%, -50%); filter: blur(120px); opacity: 0.5;}
    
    .child-neon-baslik-6 {background: #ff00b4; width: 170px; height: 170px; border-radius: 50%; display: flex; align-items: center; justify-content: center; color: #000000; text-align: center; font-weight: bold; font-size: 20px; line-height: 1.3; position: relative; z-index: 2; padding: 20px;}
    .child-neon-baslik-6-circle {background: #ff00b4; width: 220px; height: 220px; border-radius: 50%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); filter: blur(20px); opacity: 0.7; z-index: 1;}
    .child-img-6-neon-circle {background: #ff00b4; width:auto; height: 520px; border-radius: 50%; position: absolute; top: 50%; left: 60%; transform: translate(-50%, -50%); filter: blur(120px); opacity: 0.5;}
   
    .child-neon-baslik-7 {background: #07a9fd; width: 170px; height: 170px; border-radius: 50%; display: flex; align-items: center; justify-content: center; color: #000000; text-align: center; font-weight: bold; font-size: 20px; line-height: 1.3; position: relative; z-index: 2; padding: 20px;}
    .child-neon-baslik-7-circle {background: #07a9fd; width: 220px; height: 220px; border-radius: 50%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); filter: blur(20px); opacity: 0.7; z-index: 1;}
    .child-img-7-neon-circle {background: #07a9fd; width: auto; height: 520px; border-radius: 50%; position: absolute; top: 50%; left: 40%; transform: translate(-50%, -50%); filter: blur(120px); opacity: 0.5;}
    
    .child-neon-baslik-8 {background: #00ff10; width: 170px; height: 170px; border-radius: 50%; display: flex; align-items: center; justify-content: center; color: #000000; text-align: center; font-weight: bold; font-size: 20px; line-height: 1.3; position: relative; z-index: 2; padding: 20px;}
    .child-neon-baslik-8-circle {background: #00ff10; width: 220px; height: 220px; border-radius: 50%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); filter: blur(20px); opacity: 0.7; z-index: 1;}
    .child-img-8-neon-circle {background: #00ff10; width:auto; height: 520px; border-radius: 50%; position: absolute; top: 50%; left: 60%; transform: translate(-50%, -50%); filter: blur(120px); opacity: 0.5;}
   

    .child-margin-left{margin-left: 0px;}
    .child-margin-right{margin-left: 0px;}

    .child-item-margin-top{margin-top: 0px;}
}

@media(min-width:640px){
    
}

@media(min-width:960px){
    .child-item-margin-top{margin-top: 100px !important;}
}
@media(min-width:1200px){
    .child-top-baslik {padding-top: 220px !important;}
    .child-top-icerik {padding: 0px !important; padding-top: 100px !important;}
    .child-center-bg {background: url('/images/child-center-bg.webp') no-repeat center top; min-height:1500px; background-size: contain; margin-top: -400px; padding-top: 300px;}
    .child-neon-circle {background:rgba(0, 0, 0, 1); width: 450px; height:450px; border-radius: 50%; padding:70px;}
    
    .child-neon-baslik-1 {background: #fff600; width: 170px; height: 170px; border-radius: 50%; display: flex; align-items: center; justify-content: center; color: #000000; text-align: center; font-weight: bold; font-size: 20px; line-height: 1.3; position: relative; z-index: 2; padding: 20px;}
    .child-neon-baslik-1-circle {background: #fff600; width: 220px; height: 220px; border-radius: 50%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); filter: blur(20px); opacity: 0.7; z-index: 1;}
    .child-img-1-neon-circle {background: #eee509; width: 450px; height: 450px; border-radius: 50%; position: absolute; top: 50%; left: 40%; transform: translate(-50%, -50%); filter: blur(120px); opacity: 0.5;}
    
    .child-neon-baslik-2 {background: #f92c32; width: 170px; height: 170px; border-radius: 50%; display: flex; align-items: center; justify-content: center; color: #000000; text-align: center; font-weight: bold; font-size: 20px; line-height: 1.3; position: relative; z-index: 2; padding: 20px;}
    .child-neon-baslik-2-circle {background: #f92c32; width: 220px; height: 220px; border-radius: 50%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); filter: blur(20px); opacity: 0.7; z-index: 1;}
    .child-img-2-neon-circle {background: #f92c32; width:450px; height: 450px; border-radius: 50%; position: absolute; top: 50%; left: 60%; transform: translate(-50%, -50%); filter: blur(120px); opacity: 0.5;}
   
    .child-neon-baslik-3 {background: #007eff; width: 170px; height: 170px; border-radius: 50%; display: flex; align-items: center; justify-content: center; color: #000000; text-align: center; font-weight: bold; font-size: 20px; line-height: 1.3; position: relative; z-index: 2; padding: 20px;}
    .child-neon-baslik-3-circle {background: #007eff; width: 220px; height: 220px; border-radius: 50%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); filter: blur(20px); opacity: 0.7; z-index: 1;}
    .child-img-3-neon-circle {background: #007eff; width: 450px; height: 450px; border-radius: 50%; position: absolute; top: 50%; left: 40%; transform: translate(-50%, -50%); filter: blur(120px); opacity: 0.5;}

    .child-neon-baslik-4 {background: #ff8a00; width: 170px; height: 170px; border-radius: 50%; display: flex; align-items: center; justify-content: center; color: #000000; text-align: center; font-weight: bold; font-size: 20px; line-height: 1.3; position: relative; z-index: 2; padding: 20px;}
    .child-neon-baslik-4-circle {background: #ff8a00; width: 220px; height: 220px; border-radius: 50%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); filter: blur(20px); opacity: 0.7; z-index: 1;}
    .child-img-4-neon-circle {background: #ff8a00; width:450px; height: 450px; border-radius: 50%; position: absolute; top: 50%; left: 60%; transform: translate(-50%, -50%); filter: blur(120px); opacity: 0.5;}
   
    .child-neon-baslik-5 {background: #fff600; width: 170px; height: 170px; border-radius: 50%; display: flex; align-items: center; justify-content: center; color: #000000; text-align: center; font-weight: bold; font-size: 20px; line-height: 1.3; position: relative; z-index: 2; padding: 20px;}
    .child-neon-baslik-5-circle {background: #fff600; width: 220px; height: 220px; border-radius: 50%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); filter: blur(20px); opacity: 0.7; z-index: 1;}
    .child-img-5-neon-circle {background: #fff600; width: 450px; height: 450px; border-radius: 50%; position: absolute; top: 50%; left: 40%; transform: translate(-50%, -50%); filter: blur(120px); opacity: 0.5;}
    
    .child-neon-baslik-6 {background: #ff00b4; width: 170px; height: 170px; border-radius: 50%; display: flex; align-items: center; justify-content: center; color: #000000; text-align: center; font-weight: bold; font-size: 20px; line-height: 1.3; position: relative; z-index: 2; padding: 20px;}
    .child-neon-baslik-6-circle {background: #ff00b4; width: 220px; height: 220px; border-radius: 50%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); filter: blur(20px); opacity: 0.7; z-index: 1;}
    .child-img-6-neon-circle {background: #ff00b4; width:450px; height: 450px; border-radius: 50%; position: absolute; top: 50%; left: 60%; transform: translate(-50%, -50%); filter: blur(120px); opacity: 0.5;}
   
    .child-neon-baslik-7 {background: #07a9fd; width: 170px; height: 170px; border-radius: 50%; display: flex; align-items: center; justify-content: center; color: #000000; text-align: center; font-weight: bold; font-size: 20px; line-height: 1.3; position: relative; z-index: 2; padding: 20px;}
    .child-neon-baslik-7-circle {background: #07a9fd; width: 220px; height: 220px; border-radius: 50%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); filter: blur(20px); opacity: 0.7; z-index: 1;}
    .child-img-7-neon-circle {background: #07a9fd; width: 450px; height: 450px; border-radius: 50%; position: absolute; top: 50%; left: 40%; transform: translate(-50%, -50%); filter: blur(120px); opacity: 0.5;}
    
    .child-neon-baslik-8 {background: #00ff10; width: 170px; height: 170px; border-radius: 50%; display: flex; align-items: center; justify-content: center; color: #000000; text-align: center; font-weight: bold; font-size: 20px; line-height: 1.3; position: relative; z-index: 2; padding: 20px;}
    .child-neon-baslik-8-circle {background: #00ff10; width: 220px; height: 220px; border-radius: 50%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); filter: blur(20px); opacity: 0.7; z-index: 1;}
    .child-img-8-neon-circle {background: #00ff10; width:450px; height: 450px; border-radius: 50%; position: absolute; top: 50%; left: 60%; transform: translate(-50%, -50%); filter: blur(120px); opacity: 0.5;}
   

    .child-margin-left{margin-left: 50px;}
    .child-margin-right{margin-left: -50px;}

}
 
@media(min-width:1500px){
    .child-top-baslik {padding-top: 250px !important;}
    .child-top-icerik {padding: 0px !important; padding-top:150px !important;}
    .child-center-bg {background: url('/images/child-center-bg.webp') no-repeat center top; min-height:1500px; background-size: contain; margin-top: -400px; padding-top: 400px;}
    .child-neon-circle {background:rgba(0, 0, 0, 1); width: 600px; height:600px; border-radius: 50%; padding: 50px;}
    
    .child-neon-baslik-1 {background: #fff600; width: 170px; height: 170px; border-radius: 50%; display: flex; align-items: center; justify-content: center; color: #000000; text-align: center; font-weight: bold; font-size: 20px; line-height: 1.3; position: relative; z-index: 2; padding: 20px;}
    .child-neon-baslik-1-circle {background: #fff600; width: 220px; height: 220px; border-radius: 50%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); filter: blur(20px); opacity: 0.7; z-index: 1;}
    .child-img-1-neon-circle {background: #eee509; width: 600px; height: 600px; border-radius: 50%; position: absolute; top: 50%; left: 40%; transform: translate(-50%, -50%); filter: blur(120px); opacity: 0.5;}
    
    .child-neon-baslik-2 {background: #f92c32; width: 170px; height: 170px; border-radius: 50%; display: flex; align-items: center; justify-content: center; color: #000000; text-align: center; font-weight: bold; font-size: 20px; line-height: 1.3; position: relative; z-index: 2; padding: 20px;}
    .child-neon-baslik-2-circle {background: #f92c32; width: 220px; height: 220px; border-radius: 50%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); filter: blur(20px); opacity: 0.7; z-index: 1;}
    .child-img-2-neon-circle {background: #f92c32; width: 600px; height: 600px; border-radius: 50%; position: absolute; top: 50%; left: 60%; transform: translate(-50%, -50%); filter: blur(120px); opacity: 0.5;}

    .child-neon-baslik-3 {background: #007eff; width: 170px; height: 170px; border-radius: 50%; display: flex; align-items: center; justify-content: center; color: #000000; text-align: center; font-weight: bold; font-size: 20px; line-height: 1.3; position: relative; z-index: 2; padding: 20px;}
    .child-neon-baslik-3-circle {background: #007eff; width: 220px; height: 220px; border-radius: 50%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); filter: blur(20px); opacity: 0.7; z-index: 1;}
    .child-img-3-neon-circle {background: #007eff; width: 600px; height: 600px; border-radius: 50%; position: absolute; top: 50%; left: 40%; transform: translate(-50%, -50%); filter: blur(120px); opacity: 0.5;}

    .child-neon-baslik-4 {background: #ff8a00; width: 170px; height: 170px; border-radius: 50%; display: flex; align-items: center; justify-content: center; color: #000000; text-align: center; font-weight: bold; font-size: 20px; line-height: 1.3; position: relative; z-index: 2; padding: 20px;}
    .child-neon-baslik-4-circle {background: #ff8a00; width: 220px; height: 220px; border-radius: 50%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); filter: blur(20px); opacity: 0.7; z-index: 1;}
    .child-img-4-neon-circle {background: #ff8a00; width: 600px; height: 600px; border-radius: 50%; position: absolute; top: 50%; left: 40%; transform: translate(-50%, -50%); filter: blur(120px); opacity: 0.5;}

    .child-neon-baslik-5 {background: #fff600; width: 170px; height: 170px; border-radius: 50%; display: flex; align-items: center; justify-content: center; color: #000000; text-align: center; font-weight: bold; font-size: 20px; line-height: 1.3; position: relative; z-index: 2; padding: 20px;}
    .child-neon-baslik-5-circle {background: #fff600; width: 220px; height: 220px; border-radius: 50%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); filter: blur(20px); opacity: 0.7; z-index: 1;}
    .child-img-5-neon-circle {background: #fff600; width: 600px; height: 600px; border-radius: 50%; position: absolute; top: 50%; left: 40%; transform: translate(-50%, -50%); filter: blur(120px); opacity: 0.5;}

    .child-neon-baslik-6 {background: #ff00b4; width: 170px; height: 170px; border-radius: 50%; display: flex; align-items: center; justify-content: center; color: #000000; text-align: center; font-weight: bold; font-size: 20px; line-height: 1.3; position: relative; z-index: 2; padding: 20px;}
    .child-neon-baslik-6-circle {background: #ff00b4; width: 220px; height: 220px; border-radius: 50%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); filter: blur(20px); opacity: 0.7; z-index: 1;}
    .child-img-6-neon-circle {background: #ff00b4; width: 600px; height: 600px; border-radius: 50%; position: absolute; top: 50%; left: 60%; transform: translate(-50%, -50%); filter: blur(120px); opacity: 0.5;}

    .child-neon-baslik-7 {background: #00aeff; width: 170px; height: 170px; border-radius: 50%; display: flex; align-items: center; justify-content: center; color: #000000; text-align: center; font-weight: bold; font-size: 20px; line-height: 1.3; position: relative; z-index: 2; padding: 20px;}
    .child-neon-baslik-7-circle {background: #00aeff; width: 220px; height: 220px; border-radius: 50%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); filter: blur(20px); opacity: 0.7; z-index: 1;}
    .child-img-7-neon-circle {background: #00aeff; width: 600px; height: 600px; border-radius: 50%; position: absolute; top: 50%; left: 40%; transform: translate(-50%, -50%); filter: blur(120px); opacity: 0.5;}

    .child-neon-baslik-8 {background: #00ff10; width: 170px; height: 170px; border-radius: 50%; display: flex; align-items: center; justify-content: center; color: #000000; text-align: center; font-weight: bold; font-size: 20px; line-height: 1.3; position: relative; z-index: 2; padding: 20px;}
    .child-neon-baslik-8-circle {background: #00ff10; width: 220px; height: 220px; border-radius: 50%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); filter: blur(20px); opacity: 0.7; z-index: 1;}
    .child-img-8-neon-circle {background: #00ff10; width: 600px; height: 600px; border-radius: 50%; position: absolute; top: 50%; left: 60%; transform: translate(-50%, -50%); filter: blur(120px); opacity: 0.5;}

    .child-margin-left{margin-left: 0px;}
    .child-margin-right{margin-left: 0px;}


}

@media (hover: none) and (pointer: coarse) {
    [class^="child-neon-baslik"] {
      animation: pulse 1s ease-in-out infinite;
      text-shadow: 0 0 5px var(--neon-color), 0 0 10px var(--neon-color), 0 0 20px var(--neon-color);
      box-shadow: 0 0 5px var(--neon-color), 0 0 50px var(--neon-color), 0 0 20px var(--neon-color);
      transition: all 0.3s ease;
    }
  
    [class^="child-neon-baslik"]::before {
      animation: rotate-border 2s linear infinite;
    }
  }

[class^="child-neon-baslik"]:hover {
    animation: pulse 1s ease-in-out infinite;
    text-shadow: 0 0 5px var(--neon-color), 0 0 10px var(--neon-color), 0 0 20px var(--neon-color);
    box-shadow: 0 0 5px var(--neon-color), 0 0 50px var(--neon-color), 0 0 20px var(--neon-color);
    transition: all 0.3s ease;
}
[class^="child-neon-baslik"]::before {
    content: '';
    position: absolute;
    width: 110%;
    height: 110%;
    border: 3px solid transparent;
    border-radius: 50%;
    top: -6%;
    left: -6%;
    animation: none;
}
[class^="child-neon-baslik"]:hover::before {
    animation: rotate-border 2s linear infinite;
}
@keyframes pulse {
    0% {
        transform: scale(1);
    }
    50% {
        transform: scale(1.1);
    }
    100% {
        transform: scale(1);
    }
}
@keyframes rotate-border {
    0% {

        filter: drop-shadow(0 0 130px var(--neon-color, inherit));
    }
    25% {

        filter: drop-shadow(0 0 130px var(--neon-color, inherit));
    }
    50% {

        filter: drop-shadow(0 0 130px var(--neon-color, inherit));
    }
    75% {

        filter: drop-shadow(0 0 130px var(--neon-color, inherit));
    }
    100% {
 
        filter: drop-shadow(0 0 130px var(--neon-color, inherit));
        transform: rotate(360deg);
    }
}
.child-neon-baslik-1 { --neon-color: #fff600; }
.child-neon-baslik-2 { --neon-color: #f92c32; }
.child-neon-baslik-3 { --neon-color: #007eff; }
.child-neon-baslik-4 { --neon-color: #ff8a00; }
.child-neon-baslik-5 { --neon-color: #fff600; }
.child-neon-baslik-6 { --neon-color: #ff00b4; }
.child-neon-baslik-7 { --neon-color: #00aeff; }
.child-neon-baslik-8 { --neon-color: #00ff10; }

.bg-img {object-fit: cover; object-position: bottom; width: 100%; height: 1000px; position: absolute; top:0px; z-index:0 ;}
.child-top-bg {background:url(/images/child-top.webp) no-repeat top center; background-size: contain;}