/* ===== INDEX PAGE PREMIUM DESIGN ===== */

/* Banner Arrows */
#banner1 .carousel-control-prev,
#banner1 .carousel-control-next{
    width:58px !important;
    height:58px !important;
    background:rgba(255,255,255,.30) !important;
    border:1px solid rgba(255,255,255,.55);
    border-radius:10px !important;
    top:50% !important;
    transform:translateY(-50%);
    opacity:1 !important;
    z-index:9999;
    transition:.35s ease;
}

#banner1 .carousel-control-prev{ left:35px !important; }
#banner1 .carousel-control-next{ right:35px !important; }

#banner1 .carousel-control-prev i,
#banner1 .carousel-control-next i{
    font-size:38px !important;
    color:#111 !important;
    line-height:58px;
}

#banner1 .carousel-control-prev:hover,
#banner1 .carousel-control-next:hover{
    background:rgba(255,255,255,.58) !important;
}

/* Banner Image */
#banner1 .carousel-item img{
    width:100% !important;
    max-width:100% !important;
    height:720px !important;
    object-fit:cover;
    display:block;
}

/* ===== NEWS / CROPS SECTION ===== */

.news{
    background:linear-gradient(180deg,#ffffff 0%,#f6f8f2 100%);
    padding:100px 0;
}

.news .titlepage{
    text-align:center;
    padding-bottom:50px;
}

.news .titlepage span{
    color:#6b7908;
    font-size:24px;
    font-weight:900;
    letter-spacing:1px;
    text-transform:uppercase;
}

.news .titlepage h2{
    color:#1f2f12;
    font-size:58px;
    font-weight:900;
    line-height:1.1;
    margin-top:10px;
    text-transform:capitalize;
}

.news .row:last-child{
    display:flex;
    align-items:stretch;
}

.news .col-md-4{
    display:flex;
}

.latest{
    width:100%;
    background:#fff;
    border-radius:22px;
    overflow:hidden;
    box-shadow:0 15px 40px rgba(0,0,0,.10);
    transition:.45s ease;
    display:flex;
    flex-direction:column;
    margin-top:20px;
    animation:cardFadeUp .8s ease both;
}

.latest:hover{
    transform:translateY(-15px);
    box-shadow:0 25px 55px rgba(107,121,8,.25);
}

.latest figure{
    width:100%;
    height:270px;
    margin:0;
    overflow:hidden;
}

.latest figure img{
    width:100% !important;
    max-width:100% !important;
    height:100% !important;
    object-fit:cover;
    display:block;
    transition:.5s ease;
}

.latest:hover figure img{
    transform:scale(1.08);
}

.nostrud{
    padding:30px 26px;
    display:flex;
    flex-direction:column;
    flex:1;
}

.nostrud h3{
    color:#1f2f12;
    font-size:23px;
    font-weight:900;
    line-height:1.3;
    margin-bottom:16px;
    text-transform:capitalize;
}

.nostrud p{
    color:#333;
    font-size:16px;
    line-height:1.75;
    margin-bottom:24px;

    display:-webkit-box;
    -webkit-line-clamp:5;
    -webkit-box-orient:vertical;
    overflow:hidden;
}

.nostrud .read_more{
    margin-top:auto;
    width:170px;
    height:54px;
    background:#6b7908;
    color:#fff !important;
    border-radius:10px;

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

    text-align:center;
    font-size:15px;
    font-weight:900;
    text-transform:uppercase;
    text-decoration:none;
    transition:.35s ease;
}

.nostrud .read_more:hover{
    background:#1f2f12;
    color:#fff;
    transform:translateY(-4px);
}

/* Animation */
@keyframes cardFadeUp{
    from{
        opacity:0;
        transform:translateY(45px);
    }
    to{
        opacity:1;
        transform:translateY(0);
    }
}

.news .col-md-4:nth-child(1) .latest{ animation-delay:.1s; }
.news .col-md-4:nth-child(2) .latest{ animation-delay:.25s; }
.news .col-md-4:nth-child(3) .latest{ animation-delay:.4s; }

/* ===== TABLET ===== */

@media(max-width:991px){

    #banner1 .carousel-item img{
        height:560px !important;
    }

    .news .row:last-child{
        display:block;
    }

    .news .titlepage h2{
        font-size:42px;
    }

    .latest{
        margin-bottom:35px;
    }

    .latest figure{
        height:240px;
    }
}

/* ===== MOBILE FIX ===== */

@media(max-width:768px){

    /* Mobile menu alignment */
    .main-menu.active{
        display:block !important;
    }

    .main-menu{
        text-align:center !important;
    }

    .main-menu ul{
        width:100%;
        padding-left:0 !important;
        margin:0 !important;
        text-align:center !important;
    }

    .main-menu ul li{
        display:block !important;
        text-align:center !important;
        margin:16px 0 !important;
    }

    .main-menu ul li a{
        display:inline-flex !important;
        align-items:center !important;
        justify-content:center !important;
        text-align:center !important;
        gap:8px;
    }

    /* About alignment like first image */
    .about{
        text-align:left !important;
    }

    .about .titlepage{
        text-align:left !important;
        padding:0 18px;
        max-width:100% !important;
        float:none !important;
    }

    .about .titlepage span,
    .about .titlepage h2,
    .about .titlepage h3,
    .about .titlepage h4,
    .about .titlepage p{
        text-align:left !important;
    }

    /* About images center and no border */
    
    /* All normal images center on mobile */
    img{
        display:block;
        margin-left:auto;
        margin-right:auto;
    }

    .choose-full-img{
        max-width:90% !important;
        width:auto !important;
        height:auto !important;
        margin:0 auto !important;
    }

    /* News cards */
    .latest{
        max-width:92%;
        margin-left:auto !important;
        margin-right:auto !important;
    }

    .latest figure{
        height:240px;
        margin:0 auto;
        text-align:center;
    }

    .latest figure img{
        margin:0 auto;
        display:block;
    }

    .read_more,
    .send_btn{
        margin-left:auto !important;
        margin-right:auto !important;
    }
}

/* ===== SMALL MOBILE ===== */

@media(max-width:576px){

    #banner1 .carousel-control-prev,
    #banner1 .carousel-control-next{
        width:46px !important;
        height:46px !important;
    }

    #banner1 .carousel-control-prev{ left:12px !important; }
    #banner1 .carousel-control-next{ right:12px !important; }

    #banner1 .carousel-control-prev i,
    #banner1 .carousel-control-next i{
        font-size:28px !important;
        line-height:46px;
    }

    #banner1 .carousel-item img{
        height:430px !important;
    }

    .news{
        padding:70px 0;
    }

    .news .titlepage span{
        font-size:18px;
    }

    .news .titlepage h2{
        font-size:34px;
    }

    .latest{
        max-width:92%;
    }

    .latest figure{
        height:220px;
    }

    .nostrud{
        padding:24px;
    }

    .nostrud h3{
        font-size:20px;
    }

    .nostrud .read_more{
        width:160px;
        height:50px;
    }
}