@media (min-width: 320px) and (max-width: 480px) {
    body {
        width: 100%;
        height: auto;
    }
    header {
        padding-top: 3rem;
        display: flex;
        justify-content: flex-start;
        align-items: center;
    }
    header nav {
        display: none;
    }
    .header-top {
        display: flex;
        flex-direction: row;
        align-items: center;
        align-content: center;
        justify-content: center;
        margin-left: 2rem;
    }
    header h1 {
        position: relative;
        left: 18px;
        font-size: 32px;
        color: #57a9a5;
        font-family: "Poppins";
        font-style: normal;
    }
    .header-content {
        display: flex;
        flex-direction: column;
        align-content: center;
        align-items: flex-start;
    }
    .left {
        position: relative;
        padding-left: 6px;
    }
    .header-content h1 {
        font-family: "Poppins";
        margin-top: 2rem;
        font-style: normal;
        font-weight: 800;
        font-size: 40px;
        color: #1c2323;
    }
    .header-content p {
        font-family: "Poppins";
        font-style: normal;
        font-weight: normal;
        font-size: 20px;
        line-height: 45px;
        color: #404242;
        text-align: left;
        margin-top: 50px;
    }
    .header-content button {
        width: auto;
        height: auto;
        background: #58a9a5;
        color: white;
        font-size: 20px;
        border-radius: 20px 20px 20px 0px;
        -webkit-border-radius: 20px 20px 20px 0px;
        -moz-border-radius: 20px 20px 20px 0px;
        -ms-border-radius: 20px 20px 20px 0px;
        -o-border-radius: 20px 20px 20px 0px;
        cursor: pointer;
    }
    .right-content {
        color: red;
    }
    .right-content img {
        width: 100%;
        background: #ccf0e6;
        border-radius: 50%/10%;
    }
    section {
        display: flex;
        flex-direction: column;
        align-content: center;
        justify-content: center;
        align-items: center;
        margin-top: 17.5rem;
    }
    section h2 {
        font-size: 60px;
        margin-bottom: 0;
    }
    section p {
        font-size: 30px;
        width: 100%;
        font-family: "Poppins", sans-serif;
        text-align: center;
        margin-bottom: 75px;
    }
    .item-works {
        display: flex;
        position: relative;
        flex-direction: column;
        width: 100%;
    }
    .item-works p {
        width: auto;
        font-family: "Poppins";
        font-weight: 500;
        font-size: 20px;
        line-height: 30px;
        text-align: left;
        margin-left: 10px;
    }
    .visual-home {
        display: flex;
        margin-top: 50px;
        width: 100%;
        flex-direction: column;
    }
    .right-visual-inf {
        margin-top: 10px;
    }
    .visual-home h2 {
        width: auto;
        font-family: "Poppins";
        font-weight: bold;
        font-size: 25px;
        color: #1c2323;
        margin-left: 15px;
    }
    .visual-home p {
        font-family: "Poppins";
        font-weight: 500;
        font-size: 20px;
        color: #486958;
        text-align: left;
        max-width: 100%;
        margin-bottom: 0px;
        width: 100%;
        padding: 0;
        margin-right: 0;
        margin-left: 7px;
    }
    .our-project {
        display: flex;
        justify-content: center;
        flex-direction: column;
        margin-top: 5rem;
    }
    .our-project h2 {
        font-family: "Poppins";
        font-weight: 800;
        font-size: 40px;
        text-align: center;
        color: #1c2323;
    }
    .our-project p {
        font-family: "Poppins";
        font-weight: normal;
        font-size: 20px;
        line-height: 81px;
        text-align: center;
        color: #404242;
        margin-bottom: 30px;
    }
    .items {
        display: flex;
        justify-content: space-evenly;
        flex-direction: column;
    }
    .item1 {
        margin-left: 10px;
    }
    .item1 h3 {
        font-family: "Poppins";
        font-style: normal;
        font-weight: bold;
        font-size: 30px;
        color: #58a9a5;
        margin-left: 10px;
    }
    .item1 p {
        width: auto;
        font-family: "Poppins";
        font-style: normal;
        font-weight: 500;
        font-size: 20px;
        color: #486958;
    }
    img {
        width: -webkit-fill-available;
    }
    .item3 h3 {
        margin-top: 50px;
    }
    .item2 p,
    .item3 p {
        width: auto;
        font-family: "Poppins";
        font-style: normal;
        font-weight: 500;
        font-size: 18px;
        color: #486958;
    }
    .testimonial {
        font-size: 30px;
        text-align: center;
    }
    .images-testimonial {
        display: flex;
        flex-direction: column;
        width: 100%;
        height: auto;
    }
    .images-testimonial a {
        margin-top: 20px;
    }
    .about-company {
        display: flex;
        justify-content: center;
        margin-top: 70px;
        height: auto;
        flex-direction: column;
    }
    .about-right {
        width: 100%;
        display: flex;
        background: #ccf0e6;
        flex-direction: column;
    }
    .about-right ul {
        display: flex;
        justify-content: space-evenly;
        width: -webkit-fill-available;
    }
    .about-right ol {
        font-family: "Poppins";
        font-style: normal;
        font-weight: 800;
        font-size: 30px;
        color: #58a9a5;
    }
    .about-right li {
        width: -webkit-fill-available;
        font-style: normal;
        font-weight: 800;
        font-size: 20px;
        color: #58a9a5;
        padding: 0;
        margin: 0;
    }
    .about-right p {
        display: flex;
        flex-wrap: nowrap;
        width: 100%;
        font-style: normal;
        font-weight: 500;
        font-size: 35px;
        line-height: 37px;
        margin-right: 0;
        margin-bottom: 70px;
        margin-top: 90px;
        color: #486958;
    }
    footer {
        display: flex;
        flex-direction: column;
    }
    footer h2 {
        width: auto;
        font-size: 40px;
        font-weight: bold;
        font-family: "Poppins";
    }
    footer p {
        font-size: 20px;
        font-family: "Poppins";
        width: -webkit-fill-available;
    }
    form {
        display: flex;
        width: 100%;
        border: 5px solid #486958;
        border-radius: 20px;
        box-sizing: border-box;
        align-items: baseline;
        flex-direction: column;
    }
    label {
        display: flex;
        margin: 25px;
        font-family: "Poppins";
        font-style: normal;
        font-weight: 500;
        font-size: 15px;
        color: #486958;
    }
    #GET-name,
    #GET-email {
        border: none;
        border-bottom: 5px solid black;
        width: auto;
        margin: 0;
        font-size: 25px;
        padding: 0;
    }
    #btn-submit {
        width: 100%;
        height: 100%;
        background: #58a9a5;
        color: white;
        border-radius: 20px 20px 20px 0px;
        -webkit-border-radius: 20px 20px 20px 0px;
        -moz-border-radius: 20px 20px 20px 0px;
        -ms-border-radius: 20px 20px 20px 0px;
        -o-border-radius: 20px 20px 20px 0px;
    }
}

@media (min-width: 320px) and (max-width: 425px) {}