/* Part one start */
.part-one {
    background-image: url('../images/green-environment.jpg');
    max-width: 100%;
    min-height: 37.5rem;
    position: relative;

    margin-bottom: 4.375rem;
}

.part-one .part-one-box {
    background: rgba(0, 0, 0, 0.5);
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    width: 80%;

    padding: 2.1875rem 0.625rem 2.1875rem 1.875rem;
    margin-left: auto;
    margin-right: auto;
    border-bottom: 0.4rem solid rgb(0,168,107);
}

.part-one h1, .part-one p, .part-one a {
    color: white;
}


.part-one h1 {
    max-width: 86.667%;

    margin-bottom: 0.3125rem;

    line-height: 2.5rem;
    letter-spacing: 0.03125rem;

    font-size: 2.5rem;
    font-weight: 700;
}

.part-one p {
    max-width: 86.667%;

    margin-bottom: 1.25rem;

    line-height: 1.375rem;

    font-size: 0.875rem;
    font-weight: 400;
}

.part-one a {
    line-height: 1.375rem;

    font-size: 1rem;
    font-weight: 400;

    transition: color 0.2s;
}

.part-one a:hover {
    color: rgb(0, 168, 107);
}

.part-one a .greater-than-one {
    background-color: rgb(46, 139, 87);
}

@media (min-width: 40.625em) {   /* 650px */
    .part-one {
        background-attachment: fixed;
    }

    .part-one .part-one-box {
        width: 60%;
        left: 40%;
    }
}

@media (min-width: 53.125em) {   /* 850px */
    .part-one .part-one-box {
        width: 50%;
        left: 35.5%;
    }
}

@media (min-width: 62.5em) {   /* 1000px */
    .part-one .part-one-box {
        width: 40%;
        left: 30%;
    }
}

@media (min-width: 84.375em) {   /* 1350px */
    .part-one .part-one-box {
        width: 30%;
        left: 25%;
    }
}
/* Part one end */


/* Part two start */
.part-two {
    width: 100%;

    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;

    margin-bottom: 7.5rem;
}

.part-two img {
    max-width: 65%;

    margin-bottom: 1rem;
}

.part-two .part-two-text {
    max-width: 65%;
}

.part-two .part-two-text h2 {
    margin-bottom: 0.625rem;

    line-height: 2.25rem;

    font-size: 1.875rem;
    font-weight: 600;
}

.part-two .part-two-text p {
    margin-bottom: 0.5rem;

    color: #686868;
    line-height: 1.375rem;

    font-size: 0.875rem;
}

.part-two .part-two-text a {
    color: #2e2e2e;
    line-height: 1.375rem;

    font-size: 1rem;
}

.part-two .part-two-text a:hover {
    color: rgb(0, 168, 107);
}

.part-two .part-two-text a .greater-than-two {
    background-color: rgb(46, 139, 87);

    color: white;
}

@media (min-width: 37.5em) {   /* 600px */
    .part-two {
        align-items: start;
        margin-left: 10%;
        margin-right: 10%;
    }

    .part-two img {
        max-width: 50%;
    }
}

@media (min-width: 50em) {   /* 800px */
    .part-two {
        display: grid;
        grid-template-columns: 2fr 3fr;
        grid-column-gap: 1.875rem;
    }

    .part-two img {
        max-width: 100%;
    }

    .part-two .part-two-text {
        max-width: 80%;
    }
}

@media (min-width: 75em) {   /* 1200px */
    .part-two {
        background-image: url('../images/white-design.jpg');
        background-size: 100%;
        background-position-y: 31.25rem;

        grid-template-columns: 2fr 3fr;
    }

    .part-two img {
        max-width: 80%;
    }

    .part-two .part-two-text {
        max-width: 60%;
    }
}
/* Part two end */


/* Part three start */
.part-three {
    max-width: 65%;

    display: flex;
    flex-direction: column;

    margin-left: auto;
    margin-right: auto;
}

.part-three .first-column h3 {
    margin-bottom: 0.5rem;

    line-height: 2.25rem;

    font-size: 1.875rem;
}

.part-three [class^="expertise"] {
    max-width: 100%;

    color: #2e2e2e;

    padding: 1.25rem 0rem 0.9375rem 1.25rem;
    margin-top: -0.05rem;
    border-top: 0.0625rem solid rgb(234, 234, 234);
    border-bottom: 0.0625rem solid rgb(234, 234, 234);
}

.part-three [class^="expertise"]:hover {
    background-image:url(../images/machinery.jpg);
}

.part-three [class^="expertise"] ul li {
    list-style-type: disc;
    list-style-position: inside;
    line-height: 1.375rem;

    font-size: 0.875rem;
    font-weight: 400;
}

.part-three [class^="expertise"]:hover h4,
.part-three [class^="expertise"]:hover ul li {
    color: white;
}

@media (min-width: 50em) {   /* 800px */
    .part-three {
        background-image: url('../images/another-white-design.jpg');
        background-size: fill;
        background-position-y: 700px;
        max-width: 100%;

        display: grid;
        grid-template-columns: 1fr 1fr 1fr;
        grid-column-gap: 1.875rem;

        margin-left: 5%;
        margin-right: 5%;
    }
}

@media (min-width: 75rem) {   /* 1200px */
    .part-three {
        margin-left: 10%;
        margin-right: 10%;
    }
}
/* Part three start */


/* Part four start */
.part-four {
    background-color: #f9f9f9;
    max-width: 100%;

    display: flex;
    flex-direction: column;
    align-items: center;

    padding-bottom: 3rem;
    padding-top: 3.125rem;
    margin-top: 4.375rem;
    margin-left: auto;
    margin-right: auto;
}

.part-four .part-four-header {
    max-width: 65%;

    margin-bottom: 3.125rem;

    text-align: center;
}

.part-four h5 {
    color: black;

    font-size: 1.875rem;
    font-weight: 600;
}

.part-four .hexagons [class^="hexagon"] {
    background-color: white;
    width: 10.9375rem;
    height: 10.9375rem;

    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

    margin-bottom: 1.25rem;
    border-radius: 50%;
}

@media (min-width: 37.5em) {   /* 600px */
    .part-four .hexagons {
        display: grid;
        grid-template-columns: 1fr 1fr;
        grid-column-gap: 10%;

        padding-bottom: 4.5rem;
    }
}

@media (min-width: 56.25em) {   /* 900px */
    .part-four .hexagons {
        grid-template-columns: 1fr 1fr 1fr 1fr;
        grid-column-gap: 2%;
    }
}

@media (min-width: 75em) {
    .part-four .hexagons {
        width: 100%;
        
        padding-left: 20%;
        padding-right: 15%;
    }
}
/* Part four end */