.blog {
    padding-top: 100px;
margin-bottom: 450px;
padding-bottom: 100px;
background: rgb(252, 252, 252);

@media screen and(max-width:768px) {
margin-bottom: 110vh;
  }
    .heading {
        color: $color-brand3;
        padding-bottom: 50px;
        h1 {
            text-align: center;
            color: $color-brand3;
            text-transform: uppercase;
            font-size: 65px;
            letter-spacing: -2px;
            font-weight: 700;
            margin-bottom: 10px;

            @media screen and(max-width:768px) {
                font-size: 40px;
                 }
        }
        p {
            text-align: center;
            text-transform: uppercase;
            letter-spacing: 2px;
            font-size: 13px;
            font-weight: 500;
        }
    }

    .wrapper {
        margin-top: 75px;
        .card-deck {
            .card {
                border-radius: 0;
                border: none;
                padding: 40px 0;
                transition: all 1.5s ease;
           
                .img_wrapper{
                    overflow: hidden;
                }
                .card-img-top {
                    border-radius: 0;
                   

                    overflow: hidden;
                &:hover{
                        overflow: hidden;
                        transform: scale(1.1);
                       
                        -webkit-transition: all 1s ease;
                                        -moz-transition: all 1s ease;
                                        -o-transition: all 1s ease;
                                        transition: all 1s ease-in-out;
                                        transition-property: all;

                    }
                }

                
                .img_wrapper:hover ~ .card-body {
                   
                       
                            .card-title {
                                transform: translateX(20px) !important;
                               
                                transition: all 1.5s ease;
        
                            }
                          
                }

                .card-body :hover .card-title{
                   
                    }
                .card-body {
                 margin-top: 10px;
                
                 transition: all 1.5s ease-in !important;
                
                    .card-title {
                        font-size: 30px;
                        text-transform: uppercase;
                        color: $color-brand3;
                        padding-top: 15px;
                        margin:0 10px;
                       
                        @media screen and(max-width:768px) {
                            font-size: 20px;
                          }

                    }
             
                    .blog-links{
                        padding-top: 20px;
                        margin-top: 10px;
                        transition: all 1.5s ease;
                        &:hover {
                            transform: translateX(20px);
                          }
                    }
                        ul {
                            display: flex;
                            padding-left: 0;
                            @media screen and(max-width:738px) {
                                display: block;
                              }
                            .icon {
                                max-width: 20px;
                                display: block;
                                img {
                                    width: 100%;
                                }
                            }
                            li{
                                padding: 0 10px;
                                a{
                                    color: $color-grey;
                                    text-decoration: none;
                                    text-transform: uppercase;
                                    letter-spacing: 2px;
                                    font-size: 11px;
                                    &:hover{
                                        color: $color-hover;
                                    }
                                }
                            }
                        }
                    .card-text{
                        margin-top: 30px;
                        display: flex;
                        justify-content: space-between;
                        span{
                            a{
                                color: $color-brand3;
                                text-decoration: none;
                                text-transform: uppercase;
                                letter-spacing: 2px;
                                font-size: 12px;
                                font-weight: 700;
                                &:hover{
                                    color: $color-hover;
                                }
                            }
                        }
                   }
                }
            }
        }
    }
}
