* {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }

        body {
            overflow: auto;
            height: 100vh;
            background-color: black;
            font-family: Arial, sans-serif;
        }

        .stars{
            width: 2px;
            height: 2px;
            background: white;
            position: absolute;
            box-shadow: 50px 100px white, 75px 430px white, 130px 80px white,
                150px 300px white, 180px 200px white, 250px 270px white,
                300px 150px white, 370px 310px white, 400px 90px white,
                500px 180px white, 520px 350px white, 600px 130px white,
                620px 390px white, 700px 220px white, 720px 430px white,
                800px 170px white, 800px 300px white, 900px 40px white,
                975px 250px white, 1050px 140px white, 1150px 300px white,
                1250px 60px white,
                1330px 140px white, 1380px 100px white, 1405px 430px white,
                1460px 200px white, 1480px 300px white, 1510px 80px white,
                1580px 310px white, 1630px 150px white, 1700px 270px white,
                1730px 350px white, 1830px 180px white, 1850px 90px white,
                1930px 220px white, 1950px 390px white, 2030px 130px white,
                2050px 300px white, 2130px 170px white, 2130px 430px white,
                2230px 140px white, 2305px 250px white, 2380px 40px white,
                2480px 300px white
                ;
            animation: twinkle 2s infinite ease-in-out alternate;
        }
        
        @keyframes twinkle {
            0%{opacity: 0.3;}
            100%{opacity: 1;}
        }

        .header {
            text-align: center;
            margin: 20px;
            overflow: hidden;
        }

        h1 {
            font-size: 2em;
            margin-top: 20px;
            text-shadow: 0 0 20px #00ff00;
            color: #00ff00;
        }

        .profile {
            position: relative;
            width: 150px;
            height: 150px;
            border-radius: 75px;
            border: 5px solid #00ff00;
            margin: 20px auto;
            background-image: url("https://raw.githubusercontent.com/AJTekniko/ajtekniko/main/pics/profile-pic.png");
            background-size: cover;
            background-position: center;
            box-shadow: 0 0 13px #00ff00;
        }

        nav {
            position: relative;
            display: flex;
            justify-content: center;
            margin: 20px 0 5px;
            z-index: 1;
        }

        nav ul {
            list-style-type: none;
            padding: 0;
        }

        nav ul li {
            display: inline;
        }

        nav ul li a {
            background: linear-gradient(
            90deg, #454545 0%,
                   #828282 25%,
                   #999999 50%,
                   #828282 75%,
                   #454545 100%
            );
            color: #fff;
            text-decoration: none;
            padding: 5px 10px;
            border-radius: 4px;
        }

        nav ul li a:hover {
            color: #000;
            transform: scale(1.05);
            box-shadow: 0 0 15px #00ff00;
        }

        nav ul li a:active {
            background: linear-gradient(
            90deg, #343434 0%,
                   #717171 25%,
                   #888888 50%,
                   #717171 75%,
                   #343434 100%
            );
            color: #000;
        }

        h2 {
            font-size: 1.6em;
            margin-bottom: 10px;
            text-shadow: 0 0 20px #00ff00;
            color: #00ff00;
            text-align: center;
        }

        .container {
            width: 400px;
            padding: 25px 35px;
            position: relative;
            top: 29%;
            left: 50%;
            transform: translate(-50%, -50%);
            background-color: #222;
            border-radius: 10px;
        }

        .container p {
            font-weight: 600;
            font-size: 15px;
            margin-bottom: 8px;
            color: white;
        }

        .container input {
            width: 100%;
            height: 40px;
            border: 1px solid #494eea;
            outline: 0;
            padding: 10px;
            margin: 10px 0 10px;
            border-radius: 5px;
        }

        .container button {
            width: 100%;
            height: 50px;
            background: linear-gradient(
            90deg, #454545 0%,
                   #828282 25%,
                   #999999 50%,
                   #828282 75%,
                   #454545 100%
            );
            color: #fff;
            text-decoration: none;
            border: 0;
            outline: 0;
            border-radius: 5px;
            box-shadow: 0 10px 10px rgba(0, 0, 0, 0.1);
            cursor: pointer;
            margin: 15px 0;
            font-weight: 500;
        }

        .container button:hover {
            color: #000;
            transform: scale(1.05);
            box-shadow: 0 0 15px #00ff00;
        }

        .container button:active {
            background: linear-gradient(
            90deg, #343434 0%,
                   #717171 25%,
                   #888888 50%,
                   #717171 75%,
                   #343434 100%
            );
            color: #000;
        }

        #textBox {
            width: 200px;
            border-radius: 5px;
            max-height: 0;
            overflow: hidden;
            transition: max-height 1s;
        }

        #textBox p {
            padding: 5px;
            color: black;
        }

        #textBox.show-text {
            max-height: 300px;
            margin: 10px auto;
            border: 1px solid #d1d1d1;
            background-color: white;
        }

        label {
            display: block;
            text-align: center;
            color: white;
        }

        input[type="checkbox"] {
            height: 20px;
            border: 2px solid #555;
        }

        .error {
            animation: shake 0.1s linear 10;
        }

        @keyframes shake {
            0% {
                transform: translateX(0);
            }
            25% {
                transform: translateX(-2px);
            }
            50% {
                transform: translateX(0);
            }
            75% {
                transform: translateX(2px);
            }
            100% {
                transform: translateX(0);
            }
        }

        @media screen and (max-width: 875px) {
            .container {
                width: 100%;
                display: flex;
                flex-direction: column;
                justify-content: center;
                align-items: center;
            }
        }