 body {
            margin: 0;
            font-family: Arial, Helvetica, sans-serif;
            background: #000000;
            color: #fff;
            display: flex;
            justify-content: center;
            align-items: center;
            height: 100vh;

        }
        .neon-page{
            display: flex;
            justify-content: center;
            align-items: center;
            margin: 20px;

        }
        .box-head{
            font-size: 1.5rem;
            align-items: center;
            margin: 20px;
            color: #fff;
            text-shadow: 0 0 5px #ffc272, 
            0 0 10px #ffc272, 0 0 20px #ffc272;
        }

        .containeer{
            margin: 100px;
            text-align: center;
        }

        .box{
            width: auto;
            height: auto;
            margin: 20px;
        }
        h2{
            font-size: 2rem;
            margin-bottom: 20px;
            color: #fff;
            text-shadow: 0 0 5px #04e6c7, 
            0 0 10px #04e6c7, 0 0 20px #04e6c7;
        }

        .box-item{
            text-align: center;  
            
        }

        .neon-button{
            background: none;
            border: 2px solid #00ffea;
            color: #00ffea;
            padding: 15px 30px;
            font-size: 1.2rem;
            border-radius: 5px;
            transition: all 0.3s ease;
            position: relative;
            overflow: hidden;
            box-shadow: 0 0 10px #00ffea, 0 0 20px #00ffea;
        }
        .neon-button::before{
            content: '';
            position: absolute;
            top: 50%;
            left: 50%;
            width: 300%;
            height: 300%;
            background: radial-gradient(circle, rgba(0, 255, 234, 0.3), transparent);
            transform: translate(-50%, -50%) scale(0);
            transition: transform 0.5s ease;
            border-radius: 50%;
        }
        .neon-button:hover{
            color: #1a1a1a;
            background: #00ffea;
            box-shadow: 0 0 20px #00ffea, 0 0 40px #00ffea, 0 0 60px #00ffea;
        }
        .neon-button:hover::before{
            transform: translate(-50%, -50%) scale(1);
        }

        .box-item2{
            text-align: center;  
        }
       .box-item2 h2{
            font-size: 2rem;
            margin-bottom: 20px;
            color: #fff;
            text-shadow: 0 0 5px #c200e9, 
            0 0 10px #c200e9, 0 0 20px #c200e9;
       }

        .neon-button2{
            background: none;
            border: 2px solid #CC66FF;
            color: #CC66FF;
            padding: 15px 30px;
            font-size: 1.2rem;
            border-radius: 5px;
            transition: all 0.3s ease;
            position: relative;
            overflow: hidden;
            box-shadow: 0 0 10px #CC66FF, 0 0 20px #CC66FF;
        }
        .neon-button2::before{
            content: '';
            position: absolute;
            top: 50%;
            left: 50%;
            width: 300%;
            height: 300%;
            background: radial-gradient(circle, rgba(212, 0, 255, 0.3), transparent);
            transform: translate(-50%, -50%) scale(0);
            transition: transform 0.5s ease;
            border-radius: 50%;
        }
        .neon-button2:hover{
            color: #1a1a1a;
            background: #CC66FF;
            box-shadow: 0 0 20px #CC66FF, 0 0 40px #CC66FF, 0 0 60px #CC66FF;
        }
        .neon-button2:hover::before{
            transform: translate(-50%, -50%) scale(1);
        }

        .box-item3{
            text-align: center;  
        }
       .box-item3 h2{
            font-size: 2rem;
            margin-bottom: 20px;
            color: #fff;
            text-shadow: 0 0 5px #00cf80, 
            0 0 10px #00cf80, 0 0 20px #00cf80;
       }

        .neon-button3{
            background: none;
            border: 2px solid #00FF99;
            color: #00FF99;
            padding: 15px 30px;
            font-size: 1.2rem;
            border-radius: 5px;
            transition: all 0.3s ease;
            position: relative;
            overflow: hidden;
            box-shadow: 0 0 10px #00FF99, 0 0 20px #00FF99;
        }
        .neon-button3::before{
            content: '';
            position: absolute;
            top: 50%;
            left: 50%;
            width: 300%;
            height: 300%;
            background: radial-gradient(circle, rgba(0, 255, 21, 0.3), transparent);
            transform: translate(-50%, -50%) scale(0);
            transition: transform 0.5s ease;
            border-radius: 50%;
        }
        .neon-button3:hover{
            color: #1a1a1a;
            background: #00FF99;
            box-shadow: 0 0 20px #00FF99, 0 0 40px #00FF99, 0 0 60px #CC66FF;
        }
        .neon-button3:hover::before{
            transform: translate(-50%, -50%) scale(1);
        }
        .box-item4{
            text-align: center;  
        }
       .box-item4 h2{
            font-size: 2rem;
            margin-bottom: 20px;
            color: #fff;
            text-shadow: 0 0 5px #e6f700, 
            0 0 10px #e6f700, 0 0 20px #e6f700;
       }

        .neon-button4{
            background: none;
            border: 2px solid #FFFF99;
            color: #FFFF99;
            padding: 15px 30px;
            font-size: 1.2rem;
            border-radius: 5px;
            transition: all 0.3s ease;
            position: relative;
            overflow: hidden;
            box-shadow: 0 0 10px #FFFF99, 0 0 20px #FFFF99;
        }
        .neon-button4::before{
            content: '';
            position: absolute;
            top: 50%;
            left: 50%;
            width: 300%;
            height: 300%;
            background: radial-gradient(circle, rgba(255, 251, 0, 0.3), transparent);
            transform: translate(-50%, -50%) scale(0);
            transition: transform 0.5s ease;
            border-radius: 50%;
        }
        .neon-button4:hover{
            color: #1a1a1a;
            background: #FFFF99;
            box-shadow: 0 0 20px #FFFF99, 0 0 40px #FFFF99, 0 0 60px #CC66FF;
        }
        .neon-button4:hover::before{
            transform: translate(-50%, -50%) scale(1);
        }
