<html><head><meta name="color-scheme" content="light dark"></head><body><pre style="word-wrap: break-word; white-space: pre-wrap;">
body {
    background-image: url('../foto1.png');
    background-size: cover;
    background-repeat: no-repeat;
    background-attachment: fixed;
    filter: brightness(0.8);
    margin: 0;
    font-family: Arial, sans-serif;
    overflow: hidden; /* Disable scrolling on desktop view */
}
header, footer {
    background-color: rgb(33, 129, 141);
    color: white;
    text-align: center;
    padding: 10px 0;
    position: fixed;
    width: 100%;
    z-index: 1000;
}
header {
    top: 0;
}
footer {
    bottom: 0;
}
main {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: calc(100vh - 140px);
    padding: 80px 0; /* Ensure space for header and footer */
}
.profile-img {
    border-radius: 50%;
    height: 80px;
    margin-top: 10px;
}
.intro {
    background-color: rgba(0, 0, 0, 0.8);
    color: white;
    padding: 20px;
    border-radius: 10px;
    max-width: 800px;
    text-align: center;
    margin-top: auto; /* Center vertically */
    margin-bottom: auto; /* Center vertically */
}
.contact-links a {
    color: white !important; /* Ensure links are white to match the text color */
    text-decoration: none;
}
.contact-links a:hover {
    text-decoration: underline; /* Add underline on hover for better UX */
}

/* Mobile view adjustments */
@media (max-width: 768px) {
    main {
        padding: 60px 20px; /* Adjust padding for mobile */
        min-height: calc(100vh - 120px); /* Adjust height for mobile */
        align-items: flex-start; /* Align the intro to the top for better visibility */
        justify-content: center; /* Center the intro section vertically on mobile */
    }
    .intro {
        max-width: 90%;
        margin-top: 150px; /* Increased margin to push the intro section down further */
    }
    .desktop-text {
        display: none; /* Hide the longer text on mobile */
    }
    .mobile-text {
        display: block; /* Show the shorter text on mobile */
    }
}
@media (min-width: 769px) {
    .mobile-text {
        display: none; /* Hide the shorter text on desktop */
    }
}
</pre></body></html>