.headline {
    height: 10rem;
    max-width: 1400px;
}

.our-products-title,
.our-services-title,
.join-us-title,
.news-title {
    text-align: center;
    color: #28af60;
    font-size: 1.75rem;
    margin: 1rem;
}

.teaser {
    margin: 0 1rem;
    max-width: 1190px;
}

.teaser-item {
    display: flex;
}

.our-products {
    margin: 0 1rem;
    max-width: 1300px;
}

.product {
    text-align: center;
}

.product-image {
    width: 15rem;
    height: 13rem;
    margin: 0 1rem;
}

.product-title {
    color: #28af60;
    text-align: center;
    font-size: 1.5rem;
}

.product-description,
.our-services-description,
.join-us-description {
    text-align: justify;
}

.product .learn-more-button {
    display: inline-block;
    margin-bottom: 3rem;
    padding: 1rem;
    border: #bec3c7 3px solid;
    color: #bec3c7;
    text-decoration: none;
    font-weight: bold;
}

.product .learn-more-button:hover {
    border: #28af60 3px solid;
    color: white;
    background-color: #28af60;
}

.our-services,
.join-us,
.news {
    max-width: 1300px;
    margin: 0 1rem;
    text-align: center;
}

.our-services .learn-more-button,
.join-us .learn-more-button {
    display: inline-block;
    margin-bottom: 3rem;
    padding: 1rem;
    border: #28af60 3px solid;
    color: #28af60;
    text-decoration: none;
    font-weight: bold;
}

.our-services .learn-more-button:hover,
.join-us .learn-more-button:hover {
    border: #28af60 3px solid;
    color: white;
    background-color: #28af60;
}

.our-services-slider,
.join-us-slider {
    height: 12rem;
    width: 100%;
}

.news-slider {
    height: 20rem;
    width: 100%;
}

.news .right-column {
    text-align: left;
}

.news-item-title,
.news-item-date {
    margin: 0;
    color: #28af60;
}

.news-item-description {
    margin: 0;
    display: inline;
    text-align: justify;
}

.news-item-description-container {
    height: 85%;
    overflow-y: scroll;
    text-overflow: ellipsis;
}

.read-more {
    font-size: 0.75rem;
    text-decoration: none;
    color: #28af60;
    font-weight: bold;
}

/* For mobile device landscape */

@media(min-width: 576px) {
    .headline {
        height: 14rem;
    }

    .our-services-slider,
    .join-us-slider {
        height: 19rem;
    }

    .news-slider {
        height: 28rem;
    }
}

/* For tablet design */
@media(min-width: 768px) {
    .headline {
        height: 19rem;
    }

    .row-1,
    .row-2 {
        display: flex;
    }

    .product {
        width: 45%;
        margin: 0 auto;
    }

    .our-services-slider,
    .join-us-slider {
        height: 26rem;
    }

    .news-slider {
        height: 14rem;
        width: 100%;
    }
}

/* For desktop design */
@media(min-width: 992px) {
    .headline {
        height: 26rem;
        margin: 0 auto;
    }

    .our-products {
        display: flex;
        margin: 0 auto;
    }

    .row-1,
    .row-2 {
        width: 45%;
        margin: 0 1rem;
    }

    .product-image {
        width: 12rem;
        height: 10rem;
    }
    
    .teaser {
        display: flex;
        margin: 0 auto;
    }

    .our-services,
    .join-us {
        display: flex;
        margin: 0 auto;
        margin-bottom: 3rem;
    }

    .our-services .left-column {
        order: 0;
        width: 45%;
        margin: 0 1rem;
    }

    .our-services .right-column {
        order: 1;
        width: 45%;
        margin: 0 1rem;
        text-align: left;
    }

    .our-services-title {
        text-align: left;
    }

    .join-us .left-column {
        order: 0;
        width: 45%;
        margin: 0 1rem;
        text-align: right;
    }

    .join-us .right-column {
        order: 1;
        width: 45%;
        margin: 0 1rem;
    }

    .join-us-title {
        text-align: right;
    }

    .news {
        margin: 0 auto;
    }

    .news-slider {
        height: 30rem;
    }
}
