<?php include 'header.php';?>

<style>
.cicrimg {
    margin-bottom: -28%;
    width: 54%;
    margin-top: 6%;
}
.buildh3 {
    font-size: 24px;
    width: 24%;
}
.buildimg {
    height: 450px;
}



.sharicon i {
        opacity: 0;
    font-size: 13px;
    color: #fff!important;
    will-change: transform;
    -webkit-transform: scale(.1);
    transform: scale(.1);
    -webkit-transition: all .3s ease;
    transition: all .3s ease;
    padding-right: 5px;
}

.btn_wrap {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    overflow: hidden;
    cursor: pointer;
    width: 66%;
    height: 36px;
    background-color: #193778;
    border-radius: 80px;
    padding: 0 18px;
    will-change: transform;
    -webkit-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
        float: right;
}

.btn_wrap:hover {
    /* transition-delay: .4s; */
    /*-webkit-transform: scale(1.1);*/
    /*        transform: scale(1.1)*/
}

.spn {
    position: absolute;
    z-index: 99;
        width: 129px;
    height: 27px;
    border-radius: 80px;
    font-size: 13px;
    text-align: center;
    line-height: 27px;
    letter-spacing: 0px;
    color: #fff;
    background-color: #193778;
    padding: 0 18px;
    -webkit-transition: all 1.2s ease;
    transition: all 1.2s ease;
}



.container i:nth-of-type(1) {
            -webkit-transition-delay: 1.1s;
                    transition-delay: 1.1s;
}

.container i:nth-of-type(2) {
            -webkit-transition-delay: .9s;
                    transition-delay: .9s;
}

.container i:nth-of-type(3) {
            -webkit-transition-delay: .7s;
                    transition-delay: .7s;
}

.container i:nth-of-type(4) {
            -webkit-transition-delay: .4s;
                    transition-delay: .4s;
}

.btn_wrap:hover .spn {
    -webkit-transition-delay: .25s;
            transition-delay: .25s;
    -webkit-transform: translateX(-280px);
            transform: translateX(-280px)
}

.btn_wrap:hover i {
    opacity: 1;
    -webkit-transform: scale(1);
            transform: scale(1);
}


.dr {
position: absolute;
  bottom: 16px; 
  right: 16px;
  width:100px;
}



.commonbanner {
    background: url(./images/banner/blog.webp);
    margin-left: auto;
    margin-right: auto;
    background-position: center !important;
    background-size: cover !important;
    background-repeat: no-repeat !important;
    background-attachment: scroll !important;
}
.breadcrumb {
    margin-left: auto;
    margin-right: auto;
    display: flex;
    font-weight: 400;
}
.brdcrumbwht.active {
    color: #000;
    z-index: 9;
}
.page-title-heading p {
    text-align: left;
    width: 56%;
    /*color: #193778;*/
}
.center {
    text-align: justify;
    font-size: 38px;
}
.ttm-page-title-row-inner {
    padding: 73px 0px 61px;
}

.blog_readmore .col-md-6{
    padding-bottom: 23px;
}
</style>
        
        
        <div class="ttm-page-title-row commonbanner">
            <div class="ttm-page-title-row-inner ttm-bgcolor-darkgrey">
                <div class="container">
                    <div class="row align-items-center">
                        <div class="col-lg-12">
                            <div class="page-title-heading">
                                 <h3 class="center" style="z-index: 999;position: relative;color:#193778;"><span style="color:#193778;"> Blogs</span></h3>
                                 <p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500.</p>
                            </div>
                            <ol class="breadcrumb mb-0">
                                <li class="breadcrumb-item bditm"><a href="#"> <i class="fas fa-home" style="color: #000;"></i> </a></li>
                                <li class="breadcrumb-item brdcrumbwht"> <i class="fas fa-chevron-right"></i> Media & Blogs</li>
                                <li class="breadcrumb-item brdcrumbwht active"> <i class="fas fa-chevron-right"></i> Blogs</li>
                            </ol>
                        </div>
                    </div>
                </div>
            </div>                    
        </div>


<section class="desk">
    <div class=""> 
    <!--<div class="transimge"> -->
        <div class="container pt-100"  data-animation="fadeIn">
          
          
            <div class="row animation-group">
                    <div class="col-md-4" data-animation="fadeInLeft">
                        <a href="blog-detail.php" class="anchortext">
                        <div class="mg"  id="graysbg">
                            <img src="images/bg.jpg" class="wd100">
                            <div class="blog pt20">
                                <h5>Lorem Ipsum is simply dummy text of the printing... </h5>
                                <p>Sep 09, 2025</p>
                                <div class="row blog_readmore">
                                    <div class="col-md-6">
                                        <a href="blog-detail.php"><button class="banapp btn-60 opd_View float_left">Read More</button></a>
                                        <!--<a class="btn-link" href="blog-detail.php">Read More</a>-->
                                    </div>
                                    <div class="col-md-6">
                                        <div class="btn_wrap">
                                            <span class="spn">Share</span>
                                            <div class="sharicon">
                                                <i class="fab fa-facebook-f"></i>
                                                <i class="fab fa-twitter"></i>
                                                <i class="fab fa-instagram"></i>
                                                <i class="fab fa-github"></i>
                                            </div>
                                        </div>

                                    </div>
                                </div>
                                
                                    

                            </div>
                        </div>
                        </a>
                    </div>
                    
                    <div class="col-md-4" data-animation="fadeInLeft">
                        <a href="blog-detail.php" class="anchortext">
                        <div class="mg"  id="graysbg">
                            <img src="images/bg.jpg" class="wd100">
                            <div class="blog pt20">
                                <h5>Lorem Ipsum is simply dummy text of the printing... </h5>
                                <p>Sep 09, 2025</p>
                                <div class="row">
                                    <div class="col-md-6">
                                        <a href="blog-detail.php"><button class="banapp btn-60 opd_View float_left">Read More</button></a>
                                        <!--<a class="btn-link" href="blog-detail.php">Read More</a>-->
                                    </div>
                                    <div class="col-md-6">
                                        <div class="btn_wrap">
                                            <span class="spn">Share</span>
                                            <div class="sharicon">
                                                <i class="fab fa-facebook-f"></i>
                                                <i class="fab fa-twitter"></i>
                                                <i class="fab fa-instagram"></i>
                                                <i class="fab fa-github"></i>
                                            </div>
                                        </div>

                                    </div>
                                </div>
                                
                                    

                            </div>
                        </div>
                        </a>
                    </div>
                    
                    <div class="col-md-4" data-animation="fadeInLeft">
                        <a href="blog-detail.php" class="anchortext">
                        <div class="mg"  id="graysbg">
                            <img src="images/bg.jpg" class="wd100">
                            <div class="blog pt20">
                                <h5>Lorem Ipsum is simply dummy text of the printing... </h5>
                                <p>Sep 09, 2025</p>
                                <div class="row">
                                    <div class="col-md-6">
                                        <a href="blog-detail.php"><button class="banapp btn-60 opd_View float_left">Read More</button></a>
                                        <!--<a class="btn-link" href="blog-detail.php">Read More</a>-->
                                    </div>
                                    <div class="col-md-6">
                                        <div class="btn_wrap">
                                            <span class="spn">Share</span>
                                            <div class="sharicon">
                                                <i class="fab fa-facebook-f"></i>
                                                <i class="fab fa-twitter"></i>
                                                <i class="fab fa-instagram"></i>
                                                <i class="fab fa-github"></i>
                                            </div>
                                        </div>

                                    </div>
                                </div>
                                
                                    

                            </div>
                        </div>
                        </a>
                    </div>
                </div>
                
            

        </div>
    </div>
</section>

<?php include 'footer.php';?>
