/* ======================= level3 Hero Css Start =================== */
.level3-hero-container {padding: 100px 0;}
.level3-hero-content-box h1 {font-size: 50px;margin-bottom: 20px;letter-spacing: -0.02em;line-height: 60px;}
.level3-hero-content-box {padding-top: 35px;}
.level3-hero-img-box {width: 100%; margin-top: -51px; padding-bottom: 79%; position: relative;}
.level3-hero-img-box img{width: 100%; height: 100%; object-fit: cover; position: absolute; left: 0; top: 0;}
 
/* ====================== level3 Hero Css End ====================== */

/* ========================================== 
! Large devices (desktops, less than 1200px)
=========================================== */
@media (max-width:1199.98px) {    
}

/*==========================================
! Medium devices (tablets, less than 992px)
========================================== */
@media (max-width:991.98px) {     
    .level3-hero-content-box h1 {font-size: 40px;}
    .level3-hero-content-box h1 {line-height: 1.3;margin-bottom: 32px;}
}

/* =================================================  
 ! Small devices (landscape phones, less than 768px)
 ================================================= */
@media (max-width: 767.98px){     
    .level3-hero-content-box {height: auto;}
    .level3-hero-img-box {width: calc(100% + 40px);margin-left: -20px;padding-bottom: 86.5%;height: 100%;margin-top: 0;}
    .level3-hero-img-box img {position: absolute;top: 0;right: 0;bottom: 0;left: 0;}
}

/* ======================================================
 ! Extra small devices (portrait phones, less than 576px)
 ====================================================== */
@media (max-width: 575.98px){
}

/* ======================================================
! Extra small devices (portrait phones, less than 370px)
====================================================== */
@media (max-width:369.98px) { 
    .level3-hero-content-box {margin-top: 20px;}
    .level3-hero-content-box h1 {font-size: 30px;margin-bottom: 20px;}
}