
:root{
    --primary_color: #F39B53;
    --other_color: #00010E;
}

/* blog section start */
.d2c_blog_section{
    padding: 100px 0px;
    font-family: 'Roboto', sans-serif;
    background: #00010e;
}
.d2c_blog_section .d2c_blog_img_wrapper{
    width: 100%;
    height: 225px;
    position: relative;
}
.d2c_blog_section .d2c_blog_img_wrapper img{
    position: absolute;
    inset: 0;
    width: 100%;
    height: 225px;
    object-fit: cover;
    overflow: hidden;
    transition: .4s all ease;
    -webkit-transition: .4s all ease;
    -moz-transition: .4s all ease;
    -ms-transition: .4s all ease;
    -o-transition: .4s all ease;
}
.d2c_blog_section .card .last_image{
    opacity: 0;
    transition: .4s all ease;
    -webkit-transition: .4s all ease;
    -moz-transition: .4s all ease;
    -ms-transition: .4s all ease;
    -o-transition: .4s all ease;
}
.d2c_blog_section .card:hover .last_image{
    opacity: 1;
    transition: .4s all ease;
    -webkit-transition: .4s all ease;
    -moz-transition: .4s all ease;
    -ms-transition: .4s all ease;
    -o-transition: .4s all ease;
}
.d2c_blog_section .card:hover .first_image{
    opacity: 0;
    transition: .4s all ease;
    -webkit-transition: .4s all ease;
    -moz-transition: .4s all ease;
    -ms-transition: .4s all ease;
    -o-transition: .4s all ease;
}
.d2c_blog_section .card{
    border: none;
    background: transparent;
}
.d2c_blog_section .card .card-body{
    width: 80%;
    text-align: center;
    position: absolute;
    background: #fff;
    bottom: -35%;
    left: 10%;
}
.d2c_blog_section .card .card-body .d2c_category{
    display: inline-block;
    width: 133px;
    background: #00010E;
    padding: 5px 15px;
    color: #fff;
    border-radius: 4px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    position: absolute;
    -ms-border-radius: 4px;
    -o-border-radius: 4px;
    left: 36%;
    top: -20px;
}
.d2c_blog_section .card .card-body a{
    color: initial;
    text-decoration: none;
    transition: .4s;
    -webkit-transition: .4s;
    -moz-transition: .4s;
    -ms-transition: .4s;
    -o-transition: .4s;
}
.d2c_blog_section .card .card-body a:hover{
    color: var(--primary_color);
    transition: .4s;
    -webkit-transition: .4s;
    -moz-transition: .4s;
    -ms-transition: .4s;
    -o-transition: .4s;
}
.d2c_blog_section .card .card-body h5{
    margin-bottom: 0px;
    margin-top: 10px;
}
.d2c_blog_section .card:hover a{
    color: var(--primary_color);
}
.d2c_blog_section .card .card-body small{
    text-align: left !important;
}
.d2c_blog_section .card .card-body small span{
    color: var(--primary_color);
}
.d2c_blog_section .card .card-body .card-text{
    margin-top: 10px;
}
.d2c_blog_section .owl-carousel .owl-stage-outer{
    padding-top: 20px;
    padding-bottom: 100px;
}
.d2c_blog_section .owl-carousel .owl-nav button{
    width: 50px;
    height: 40px;
    background: #fff;
}
.d2c_blog_section .owl-carousel{
    position: relative;
    margin: auto;
}
.d2c_blog_section .owl-carousel .owl-nav button.owl-prev{
    position: absolute;
    top: 45%;
    left: -40px;
    padding: 4px !important;

}
.d2c_blog_section .owl-carousel .owl-nav button.owl-next{
    position: absolute;
    right: -40px;
    top: 45%;
}
.d2c_blog_section .owl-carousel .owl-nav button:focus{
    outline: none;
}
/* blog section end */



@media screen and (min-width: 0px) and (max-width: 479px){
    .d2c_blog_section{
        padding: 50px 0px;
    }

    /* blog section */
    .d2c_blog_section .owl-carousel{
        margin: auto;
    }
    .d2c_blog_section .card .card-body .card-text{
        display: none;
    }
    .d2c_blog_section .card .card-body .d2c_category{
        left: 26%;
    }

}


@media screen and (min-width: 480px) and (max-width: 767px){
    .d2c_blog_section{
        padding: 50px 0px;
    }
    /* blog section */
    .d2c_blog_section .owl-carousel{
        margin: auto;
    }
    .d2c_blog_section .card .card-body .card-text{
        display: none;
    }
    .d2c_blog_section .card .card-body .d2c_category{
        left: 30%;
    }

}
@media screen and (min-width: 768px) and (max-width: 991px){
    .d2c_blog_section{
        padding: 70px 0px;
    }
}

/* 
    <!-- 
      KIT Name: 10+ Blog Card - Bootstrap Bundle
      Product URL: https://www.designtocodes.com/product/10-blog-card-bootstrap-bundle-2022/
      Product Description: The Blog Card kit is made of all the basic elements you need to create a stunning website, from the start.
      Author: designtocodes.com
      Author URI: https://www.designtocodes.com/
    -->
*/