.hl-banner-animation-blog  {
    background-color: #F9FAFF;
    position: relative;
}
.hl-banner-animation-blog:before {
content: "";  
position: absolute;
top: -62px;
right: 0;
left: auto;
height: calc(100% + 62px);
width: 100%;
background-image: url(/app/themes/hloom-child/img/blog-img/blog-banner.svg);
background-position: center;
background-repeat: no-repeat;
background-size: cover;
}
.blog-banner-image {
    padding: 35px 0;
}
.blog-banner-image h1{
color: #1C2762;
text-align: center;
font-family: "DM Sans";
font-size: 4.8rem;
font-weight: 700;
line-height: 5.0rem;
margin-bottom: 32px;
}
.blog-banner-image  p {
color: #1C2762;
text-align: center;
font-family: "DM Sans";
font-size: 1.8rem;
font-weight: 400;
line-height: 2.9rem; 
}
.circle-image {
position: absolute;
top: -24px;
left: 0;
height: 100%;
width: 100%;
background-image: url(/app/themes/hloom-child/img/blog-img/blog-cricle.svg);
background-position: center;
background-repeat: no-repeat;
background-size: 75%;
}
.blog-heading {
max-width:520px;
margin:0 auto;
}
.featured-heading {
color: #1C2762;
font-size: 1.6rem;
font-weight: 500;
line-height:2.0rem;
}
.brand-logo-slider ul {
margin: 0;
padding: 0;
list-style: none;
display: flex;
position: relative;
}
.brand-imges {
align-items: center;
}
@media screen and (min-width: 768px) {
.brand-imges {
position: relative;
top: 39px;
display: flex;
border-radius: 10px;
background: #FFF;
box-shadow: 0 5.01px 13.79px 0 rgba(7,50,81,.1);
z-index: 9;
padding: 24px 38px;

}
} 
.blog-feature-banner {
    max-width: 1200px;
    padding: 0 15px;
    margin: 0px auto 0;
}
@media screen and (min-width: 992px) {
.brand-logo-slider ul li {
margin: 0;
}
}
@media screen and (min-width: 1600px) {
    .circle-image { 
        top: -27px;
        background-size: 60%;
    }
}
.brand-logo-slider ul li {
flex-grow: 0;
display: block;
max-width: 800px;
margin: 0 0 0 27px;
}
@keyframes mymove {
    0% {
        transform: translateX(0%) 
   }
    100% {
        transform: translateX(-200%);
   }
}
@media (max-width:1024px)  and (min-width:768px){
.blog-banner-image {
padding: 30px 0px;
}
.brand-imges {
    flex-direction: column;
    text-align: center;
    gap: 20px;
    top: 61px;
}
.blog-feature-banner {
    max-width: 940px;
}
.circle-image {
    background-size: 92%;
    top: -33px;
}
}
@media (max-width:767px) {
.blog-banner-image {
padding: 40px 0;
}
.blog-heading {
position: relative;
z-index: 2;
}
.hl-banner-animation-blog:before {
background-image: url(/app/themes/hloom-child/img/blog-img/blog-banner-mob.png);
background-size: cover;
top: -62px;
z-index: 0;
height: 100%;
}
.blog-banner-image .circle-image {
background-image: url(/app/themes/hloom-child/img/blog-img/dot-icon-mob.svg);
top: -50px;
background-size: 90%;
z-index: 0;
opacity: 0.8;
}
.blog-banner-image p{
    padding: 0 15px;
}
.blog-banner-image h1 {
font-size: 4.0rem;
font-weight: 700;
line-height: 4.4rem;
margin-bottom: 32px;
margin-top: 0;
}
.blog-feature-banner {
height: auto;
text-align: center;
background: #fff;
padding: 25px 30px;
position: relative;
box-shadow: 0px 5.018px 13.799px 0px rgba(7, 50, 81, 0.10);
}
.featured-heading {
margin-bottom: 17px
}
.brand-logo-slider {
margin: auto;
overflow: hidden;
transform: translate3d(0,0,0);
width: 100%;
display: flex;
}
.brand-logo-slider ul {
animation: mymove 7s linear infinite;
transform: translate3d(0,0,0);
animation-fill-mode: forwards;
}
.brand-logo-slider ul li {
flex-shrink: 0;
max-width: unset;
}
}