/* HERO SECTION */



main .ef-herosection{
    background-image: url("../customImages/hero-2.png");
    background-repeat: no-repeat;
    width: 100%;
    /* height: 50vh; */
    background-size: cover;
    padding-top: 9rem;
    padding-bottom: 9rem;
}

.ef-underline{
    border-top: 8px solid #FFFFFF;
    border-radius: 20px;
    opacity: 100%;
    background-color: #ffff;
    width: 80px;
}

.ef-herosection .ef-herosection--heading{
    font-style: normal;
    font-weight: 700;
    font-size: 2.5rem;
    line-height: 68px;
    text-align: center;
    letter-spacing: -0.03em;
    color: #FFFFFF;
}

.ef-herosection .ef-herosection--heading h1{
    font-style: normal;
    font-weight: 700;
    font-size: 2.5rem;
    line-height: 68px;
    text-align: center;
    letter-spacing: -0.03em;
    color: #FFFFFF;
    font-family: 'Stolzl-bold';

}

.ef-herosection .ef-herosection--heading hr{
    max-width: 120px;
    height: 8px;
    background: #FFFFFF;
    border: 1px solid #FFFFFF;
    margin: 0 auto;
}

/* HEALTHY DIET SECTION */
.cr-diet{
    width: 100%;
    height: auto;
    background: #E9F3EB;
    padding: 3rem;
    margin-top: -3rem;

}

.cr-diet .cr-diet--text p{
    font-style: normal;
    font-weight: 400;
    font-size: 1.25rem;
    line-height: 140%;
    color: #2D2D2D;
    max-width: 40.5625rem;
    text-align: left;
    font-family: 'Stolzl-Regular';
}

/* INFORMATION SECTION */
.info-section{
    margin-top: 3.6875rem;
}

.info-vegies {
    background-image: url("../customImages/veggies.png");
    max-width: 396px;
    /* height: 26.3rem; */
    height: auto;
    padding: 10rem 1.2rem 2.5rem 1.2rem;
}

.info-vegies p,
.info-crops p, 
.info-root p,
.info-legumes p
{
    max-width: 21.68rem;
    font-style: normal;
    font-weight: 400;
    font-size: 1.25rem;
    line-height: 130%;
    color: #FFFFFF;
    text-align: left;
    margin: 0 auto;
}

 .info-line{
    width: 4.5rem;
    height: 2px;
    background: #FFFFFF;
    border-top: 4px solid #FFFFFF;
    border-radius: 20px;
    opacity: 100%;
    margin-top: 1rem;
}

.info-line-bottom{
    width: 4.5rem;
    height: 2px;
    background: #FFFFFF;
    border-top: 4px solid #FFFFFF;
    border-radius: 20px;
    opacity: 100%;
    margin-top: 1rem;
    margin-left: 1.3rem;
}

.info-crops{
    background-image: url("../customImages/info-crop.png");
    max-width: 396px;
    width: 100%;
    /* height: 26.3rem; */
    height: auto;
    padding: 8.8rem 1.2rem 2.0rem 1.2rem;
}

.info-root{
    background-image: url("../customImages/info-root.png");
    max-width: 396px;
    width: 100%;
    /* height: 26.3rem; */
    height: auto;
    padding: 13.9rem 1.2rem 2rem 1.2rem;
}

.cr-bottom{
    margin-top: 2.5rem;
}

/* Legumes */
.info-legumes{
    background-image: url("../customImages/legumes.png");
    max-width: 37.75rem;
    width: 100%;
    height: auto;
    padding: 8rem 1.2rem 1.5rem 1.2rem;
    background-repeat: no-repeat;
}

.info-legumes p,
.info-grains p
{
    max-width: 33.06rem;
    font-style: normal;
    font-weight: 400;
    font-size: 1.25rem;
    line-height: 130%;
    color: #FFFFFF;
    text-align: left;
    margin: 0 auto;
    text-align: left;
}

.info-grains{
    background-image: url("../customImages/grains.png");
    max-width: 37.75rem;
    width: 100%;
    height: auto;
    padding: 11.2rem 1.2rem 1.5rem 1.2rem;
    background-repeat: no-repeat;
}

/* METHODOLOGY STYLES */
.cr-method p{
    max-width: 77.25rem;
    font-style: normal;
    font-weight: 400;
    font-size: 20px;
    line-height: 130%;
    color: #2D2D2D;
    text-align: left;
    margin: 4.125rem auto 9rem auto;
}

/* RESPONSIVE STYLING */
@media (max-width: 414px){
    .cr-diet{
        padding-left: 1rem;
        padding-right: 1rem;
    }

    .cr-diet .cr-diet--text p{
        max-width: 100%;
        font-size: 1rem;
    }

    .info-section{
        padding-left: 1.5rem!important;
        padding-right: 1.5rem!important;
    }

    .info-crops, .info-root{
        margin-top: 2rem;
    }

    .cr-bottom{
        margin-top: 5rem;
    }
    .info-legumes{
        padding-top: 3rem;
    }

    .info-line-bottom{
        margin-left: unset;
    }

    .info-grains{
        margin-top: 2rem;
        padding-top: 3rem;
    }

    .cr-method {
        width: 100%;
        padding-left: 1rem;
        padding-right: 1rem;
    }

    .cr-method p{
        margin-bottom: 4rem;
    }

    .ef-herosection .ef-herosection--heading h1{
        font-size: 2rem;
    }
}

/* IPAD AND TALBETS SCREEN */
@media(min-width: 768px) and (max-width: 900px){
    .top{
       flex-direction: column; 
    }

    .info-crops{
        width: 100%!important;
        max-width: 100%;
        /* max-width: 398px; */
        padding-left: .5rem;
        padding-right: .5rem;
        background-size: cover;
        background-repeat: no-repeat;
        margin-top: 1rem!important;

    }

    .info-crops p, .info-vegies p {
        max-width: 100%;
    }

    .info-vegies{
        /* max-width: 450px; */
        width: 100%!important;
        max-width: 100%;
        background-size: cover;
        background-repeat: no-repeat;
    }
    
    .info-root{
        margin-top: 1rem;
        width: 100%;
        max-width: unset;
        background-repeat: no-repeat;
        background-size: cover;
    }

    .info-legumes, .info-grains {
        width: 100%;
        background-size: cover;
        margin: 0 auto;
    }

    .info-vegies p, .info-crops p, .info-root p, .info-legumes p,
    .info-grains p{
        text-align: left!important;
        margin: unset!important;
        max-width: 100%;

    }

    .cr-method p{
        padding-left: .5rem;
        padding-right: .5rem;
        /* margin: 0 auto; */
        text-align: justify;
    }

    .info-line-mobile{
        /* margin-left: 12rem; */
    }

    .info-line, .info-line-bottom{
        margin-left: unset;
    }

    .info-grains {
        margin-top: 1rem;
    }

    .cr-method {
        width: 100%;
        padding-left: 1rem;
        padding-right: 1rem;
    }

    .cr-method p{
        margin-bottom: 4rem;
    }

    .cr-diet .cr-diet--text p{
        max-width: 100%;
    }

    .cr-diet img{
        width: 100%;
    }
}

/* RESPONSIVE STYLES */
@media(max-width: 414px){
    .cr-diet--text p {
        text-align: justify!important;
        text-align: left;
        font-size: 1rem!important;
    }
    .info-vegies p, .info-line p, .info-root p, .info-legumes p,
    .info-grains p{
        font-size: 1.25rem!important;
    }

    .cr-method p{
        font-size: 1rem!important;
        line-height: 170%;
    }
}

@media(min-width: 1024px) and (max-width: 1300px){
    .top {
        max-width: 100%;
        width: 100%;

    }

    .info-vegies, .info-line, .info-root, .info-legumes, .info-grains{
        /* width: 100%; */
        background-size: cover;
        background-repeat: no-repeat;
    }

    .info-legumes, .info-grains{
        width: 100%;
        max-width: 81%!important;    }

    .info-root{
        width: 100%;
        max-width: 81%!important;
    }

    .info-vegies p, .info-line p, .info-root p, .info-legumes p,
    .info-grains p{
        max-width: 100%;
    }

    .cr-method p{
        max-width: 81%;
    }
}