* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}


.hero {
    height: 300px;
    background-color: #6e8128;
    background: url(./assets/hero-bg.jpg);
    background-size: cover;
}



.logo {
    width: 80px;
    position: absolute;
    top: 30px;
    left: 30px;
}


.quicksand-font {
    font-family: "Quicksand", sans-serif;
    font-optical-sizing: auto;
    font-weight: 700;
    font-style: normal;
}

.oswald-font {
    font-family: "Oswald", sans-serif;
    font-optical-sizing: auto;
    font-weight: 700;
    font-style: normal;
}

.title {
    color: #79a439;
    font-size: 85px;
    position: absolute;
    right: 10%;
    top: 80px;
}

.development {
    margin-top: 30px;
    margin-bottom: 30px;
}

.development .title1 {
    font-family: Georgia, 'Times New Roman', Times, serif;
    font-size: 50px;
    color: #305610;
    text-align: center;
}

.development .title2 {
    font-family: Georgia, 'Times New Roman', Times, serif;
    font-size: 35px;
    color: #305610;
    text-align: center;
}

.footer {
    margin-top: 40px;
    margin-bottom: 30px;
    padding: 10px 20px;
}

.footer .heading {
    font-size: 18px;
    color: #202020;
}

.footer .icon {
    margin-right: 10px;
    font-size: 18px;
}

.footer .whatsapp {
    color: #359e32;
    font-size: 20px;
}

.footer .email {
    color: #3565df;
}

.footer .address {
    color: #c11717;
}

.footer .instagram {
    color: #E4405F;
}

.footer .instagramText {
    color: #E4405F;
}

.footer .instagramText:hover {
    color: #c13554;
}

.footer a {
    text-decoration: none;
    color: #202020;
}

.copyright {
    margin-top: 30px;
    margin-bottom: 15px;
    color: #434343;
    font-family: Arial, Helvetica, sans-serif;
}



@media (max-width: 800px) {

    .hero {
        height: 400px;
    }

    .logo {
        width: 70px;
        position: absolute;
        top: 25px;
        left: 25px;
    }

    .title {
        color: #79a439;
        font-size: 65px;
        position: absolute;
        right: 10%;
        top: 120px;
    }

}

@media (max-width: 500px) {

    .hero {
        height: 400px;
    }

    .logo {
        width: 50px;
        position: absolute;
        top: 15px;
        left: 15px;
    }

    .title {
        color: #79a439;
        font-size: 55px;
        position: absolute;
        right: 10%;
        top: 120px;
    }

    .development .title1 {
        font-family: Georgia, 'Times New Roman', Times, serif;
        font-size: 40px;
        color: #305610;
        text-align: center;
    }

    .development .title2 {
        font-family: Georgia, 'Times New Roman', Times, serif;
        font-size: 25px;
        color: #305610;
        text-align: center;
    }

    .footer .heading {
        font-size: 16px;
        color: #202020;
    }

    .footer .icon {
        margin-right: 10px;
        font-size: 16px;
    }

    .footer .whatsapp {
        color: #359e32;
        font-size: 18px;
    }

    .copyright {
        margin-top: 30px;
        margin-bottom: 13px;
        color: #434343;
        font-family: Arial, Helvetica, sans-serif;
    }


}