@import url('https://fonts.googleapis.com/css2?family=Dancing+Script:wght@400..700&family=Oswald:wght@200..700&family=Roboto+Slab:wght@100..900&display=swap');

        body {
            background-color: #36362E;
            background-color: #00bb77;
            background-image: background-color: #161507;
            background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100%25' height='100%25' viewBox='0 0 1600 800'%3E%3Cg stroke='%2313130B' stroke-width='85.4' stroke-opacity='0.27' %3E%3Ccircle fill='%23161507' cx='0' cy='0' r='1800'/%3E%3Ccircle fill='%231f1f09' cx='0' cy='0' r='1700'/%3E%3Ccircle fill='%23272a0a' cx='0' cy='0' r='1600'/%3E%3Ccircle fill='%232f350a' cx='0' cy='0' r='1500'/%3E%3Ccircle fill='%23364108' cx='0' cy='0' r='1400'/%3E%3Ccircle fill='%233d4e05' cx='0' cy='0' r='1300'/%3E%3Ccircle fill='%23435a02' cx='0' cy='0' r='1200'/%3E%3Ccircle fill='%23496800' cx='0' cy='0' r='1100'/%3E%3Ccircle fill='%234e7500' cx='0' cy='0' r='1000'/%3E%3Ccircle fill='%23518300' cx='0' cy='0' r='900'/%3E%3Ccircle fill='%23549200' cx='0' cy='0' r='800'/%3E%3Ccircle fill='%2355a000' cx='0' cy='0' r='700'/%3E%3Ccircle fill='%2354af00' cx='0' cy='0' r='600'/%3E%3Ccircle fill='%2352bf00' cx='0' cy='0' r='500'/%3E%3Ccircle fill='%234cce00' cx='0' cy='0' r='400'/%3E%3Ccircle fill='%2343de00' cx='0' cy='0' r='300'/%3E%3Ccircle fill='%2333ef00' cx='0' cy='0' r='200'/%3E%3Ccircle fill='%2306FF0E' cx='0' cy='0' r='100'/%3E%3C/g%3E%3C/svg%3E");
            background-attachment: fixed;
            background-size: cover;
            background-size: cover;
            font-family: "Roboto Slab", serif;
            color: rgb(249, 249, 195);
            display: flex;
            justify-content: center;
            align-items: center;
        }

        a {
            position: fixed;
            left: 20px;
            top: 20px;
            border: 2px solid white;
            border-radius: 50%;
            display: flex;
            justify-content: center;
            align-items: center;
            height: 50px;
            width: 50px;
            opacity: .7;
            transition: transform 0.3s ease, opacity 0.3s ease;
            border-color: rgb(249, 249, 195);
        }

        a:hover {
            transform: scale(1.2);
            opacity: 1;
        }
        .cuadro{
            background: #1e1e1e;
                padding: 25px;
                border-radius: 15px;
                width: 435px;
                margin: 30px auto;
                color: white;

                    border: 2px solid #39ff14;
                box-shadow: 0 0 5px #39ff14,
                            0 0 10px #39ff14,
                            0 0 20px #39ff14,
                            0 0 40px #39ff14;
                padding: 20px;
                margin: 20px 0;
                background-color: #111;
                color: white;
                border-radius: 10px;
                font-family: Arial, sans-serif;

                xmp{
                    color: #2bf119;
                background-color: #111;     /* Fondo oscuro interno */
                border: 1px solid #ff0000;  /* Borde verde */
                padding: 6px;              /* Espacio interno */
                border-radius: 10px;         /* Bordes redondeados */
                color: #00ff88;             /* Texto verde */
                display: block;
                }
                
                h2{
                   border-bottom: 2px solid #ffee00; /* Línea verde */
                padding-bottom: 8px;              /* Espacio entre texto y línea */
                margin-bottom: 15px; 
                }


        }
        main {
            text-align: center;

            .cuadro {
                text-align: left;
                
            }
        }