body {
            font-family: Arial, sans-serif;
            margin: 0;
            padding: 0;
            background-color: #f4f4f4;
        }
        header {
            background-color: #1885df;
            color: white;
            padding: 1rem 0;
            text-align: center;
        }
        nav {
            background-color: #000;
            overflow: hidden;
        }
        nav ul {
            list-style: none;
            margin: 0;
            padding: 0;
            text-align: center;
        }
        nav ul li {
            display: inline;
        }
        nav ul li a {
            color: white;
            display: inline-block;
            padding: 1rem;
            text-decoration: none;
        }
        nav ul li a:hover {
            background-color: #555;
        }
        .container {
            margin: 0 auto;
            max-width: 1200px;
            padding: 1rem;
        }
        .bio {
            text-align: center;
            margin: 2rem 0;
            margin-bottom: 3em;
        }

        h1 {
            font-size: 2em;
            margin: auto 0;
        }

        h2 {
            font-size: 2em;
        }

        h3 {
            font-size: 1.4em;
        }

        .bio img {
            border-radius: 50%;
            max-width: 150px;
            margin-bottom: 2.5%;
        }
        .bio p {
            margin: 1rem auto;
            max-width: 75%;
            text-align: center;
        }
        .work {
            margin: 2rem 0;
        }
        .work img {
            width: 100%;
            height: auto;
        }


        .work-item {
            background-color: white;
            border: 1px solid #ddd;
            margin: 1rem 0;
            overflow: hidden;
            padding: 1rem;
            display:flex;
        }

        .work-item:hover {
            box-shadow: 3px 3px 6px 1px #dad6db;
            transition: box-shadow 0.5s;
        }

        .description {
                max-width: 50%;
                display:flex;
                flex-direction: column;
                align-items: flex-start; /* Alinea los elementos al inicio del contenedor */
                justify-content: center;
                margin-left: 5em;
                margin-right: 3em;
        }

        .contact {
            background-color: #000;
            color: white;
            padding: 2rem 1rem;
            text-align: center;
        }
        footer {
            background-color: #1885df;
            color: white;
            padding: 1rem 0;
            text-align: center;
        }

        footer p {
            margin: auto 0;
        }