/* ============== DESKTOP CSS START ================== */
#bannersSection2{
    text-align: center !important;
}
.soybanners-container-bottom3{
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: stretch;
    align-content: space-between;
    margin-top: 1em;
}
.soybanners-bottom-mobile{
    display: none;
}
.soybanners-bottom-desktop{
    text-align: center;
    display: block;
}
.soybanners-banner-3:first-child{
    margin-left: 0em !important;
}
.soybanners-banner-3{
    background-color: whitesmoke;
    width: 95%;
    position: relative;
    margin-bottom: 1.5em;
    margin-left: 1.5em;
}
.soybanners-banner-3 img{
    width: 100%;
    height: 100%;
}
.soybanners-container-bottom2{
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: stretch;
    align-content: space-between;
}
.soybig-banner{
    width: 65.9%;
}
.soybig-banner img{
    width: 100%;
    height: 100%;
}
.soylast-banner{
    width: 31.9%;
}
.soylast-banner img{
    width: 100%;
    height: 100%;
}

/* ============== DESKTOP CSS END ================== */

/* ================================================= */
/* ================================================= */

/* ============== TABLET CSS START ================== */

@media only screen and (min-width: 510px) and (max-width: 760px) { 
    .soylast-banner{
        width: 30.27%;
    }
    .soybig-banner{
        width: 65.26%;
    }
}
@media only screen and (min-width: 759px) and (max-width: 768px) { 
    .soylast-banner{
        width: 30.3%;
    }
    .soybig-banner{
        width: 65.1%;
    }
}
@media only screen and (min-width: 768px) and (max-width: 990px) { 
    .soylast-banner{
        width: 31%;
    }
    .soybig-banner{
        width: 65.5%;
    }
}
@media only screen and (min-width: 990px) and (max-width: 1200px) { 
    .soylast-banner{
        width: 31.6% !important;
    }
}
/* ============== TABLET CSS END ================== */

/* ================================================= */
/* ================================================= */

/* ============== MOBILE CSS START ================== */

@media only screen and (max-width: 510px) { 

    .soybanners-bottom-mobile{
        display: block;
    }
    .soybanners-container-bottom3{
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: space-between;
        align-items: stretch;
        align-content: space-between;
        margin-top: 1.4em;
    }
    .soybanners-banner-3{
        width: 46.5%;
        margin: 0 0 1.4em 0 !important;
    }
    .soybig-banner{
        width: 46.5%;
        margin: 0 0 1.4em 0 !important;
    }
    .soybanners-banner-3 img{
        width: 100%;
        height: 100%;
    }
    .soylast-banner{
        width: 100%;
    }
    .soylast-banner img{
        width: 100%;
        height: 100%;
    }
    .soybanners-banner-3.soybanners-last-banner{
	    width: 100%;
    }
  }

/* ============== MOBILE CSS END ================== */