@media (max-width: 1200px) {
    html {
        font-size: 50%;
    }
}


@media (max-width: 768px) {
    
    .container {
        max-width: 80%;
    }

    .work--history--container {
        max-width: 85%;
        min-height: 22.5rem;
    }

    .about--me--container--form {
        max-width: 80%;
    }

    .nav--list {
        font-size: 2rem;
    }

    .home--center--container {
        flex-direction: column;
    }

    .action--btn--container {
        justify-self: center;
        margin-top: 5rem;
    }

    .home--description {
        font-size: 2.5rem;
        text-align: center;
    }

    .home--title {
        font-size: 3.5rem;
        text-align: center;
    }

    .carousel--image {
        width: 100%;
    }
}

@media (max-width: 600px) {
    .home--description {
        font-size: 2rem;
    }

    .home--button {
        font-size: 1.4rem;
    }
}

@media (max-width: 400px) {
    .home--description {
        font-size: 2rem;
    }

    .home--button {
        font-size: 1.4rem;
    }

    .form--input {
        width: 100%;
    }
}