.wrap-container {
    max-width: 50%; 
    margin: auto;
    text-align: center;
}

    .wrap-container p {
        width: 50%; 
        margin: 20px auto; 
    }

     .errparagraph {
         width: 35%;
         margin: 20px auto;
     }

     .custom-link {
         text-decoration: none;
     }

.badge {
    background: #e6e6e6;
    color: #000000;
    border: 1px solid #676a6c;
    padding: 8px 12px;
    transition: background 0.3s, color 0.3s;
}

.badge:hover {
    background: lightgray;
    color: #000000;
}

.email-link {
    color: blue;
    text-decoration: underline;
}

.info-msg {
    color: #676a6c;
}

/* Media query for smaller screens */
@media screen and (max-width: 1680px) {
    .wrap-container {
        max-width: 70%;
        margin: auto;
        text-align: center;
    }

        .wrap-container p {
            width: 70%;
        }

    .errparagraph {
        width: 80%;
        margin: 20px auto;
    }
}

/* Media query for smaller screens */
@media screen and (max-width: 1280px) {
    .wrap-container {
        max-width: 70%;
        margin: auto;
        text-align: center;
    }

        .wrap-container p {
            width: 70%;
        }

    .errparagraph {
        width: 80%;
        margin: 20px auto;
    }
}

/* Media query for smaller screens */
@media screen and (max-width: 768px) {
    .wrap-container {
        max-width: 80%;
        margin: auto;
        text-align: center;
    }

    .wrap-container p {
        width: 80%; 
    }

        .errparagraph {
            width: 80%;
            margin: 20px auto;
        }
}