div h3{
    position: relative;
    top: 130px;
    text-transform: capitalize;
    background-color:#3c4096 ;
    width:7%;
    padding: 10px;
    color: white;
    border-radius: 10px;
    left :45%;
    text-align: center;
    margin-top: 0px;
}

.marg{
    position: relative;
    margin-top: 15%;
    display: flex;
    width: 100%;

}
.marg1{
    position: relative;
    margin-top: 5%;
    display: flex;
    width: 100%;

}
.text-overlay1{
    position: relative;
    margin-top: 3%;
    text-align: center;
}
.marg img{
    width: 90%;
    margin-left: 5%;
}
.marg1 img{
    width: 90%;
    margin-left: 5%;
}
.txt1{position: relative;}

.marg div img:hover{
    scale:1.1;
    transition: 2s;
}
.marg1 div img:hover{
    scale:1.1;
    transition: 2s;
}
.text-overlay1{
    display: none;
}
.marg div:hover .text-overlay1{
    display: block;
}
.marg1 div:hover .text-overlay1{
    display: block;
    transform: matrix(1, 0, 0, 1, 0, 0);
    transition: 2s;
}
.txt1{
    background:linear-gradient(45deg,rgba(242, 82, 82, 0.63),rgba(152, 57, 230, 0.5));
    width: 80%;
    margin-left: 8%;
    padding: 2%;
}
@media(max-width:800px) {
    .marg{
        position: relative;
        margin-top: 15%;
        display: block;
        width: 100%;
    
    }
    .marg1{
        position: relative;
        margin-top: 5%;
        display: block;
        width: 100%;
    
    }
}