/*********************** Demo - 1 *******************/
.box{text-align:center}
.box:before{content:""}
.box{overflow:hidden}
.box .title{letter-spacing:1px}
.box .post{font-style:italic}



/*********************** Demo - 4 *******************/
.box{position:relative}
.box:before{width:0;height:100%;background:rgba(0,0,0,.5);position:absolute;top:0;left:-50%;bottom:0;transform:skewX(-36deg);transition:all .5s ease 0s}
.box:hover:before{width:200%}
.box img{width:100%;height:auto}
.box .box-content{width:100%;height:100%;padding-top:20%;position:absolute;top:0;left:0;transform:scale(0);transition:all .3s ease 0s}
.box .icon,.box5 .icon{list-style:none;padding:0}
.box:hover .box-content{transform:scale(1)}
.box .title{font-size:22px;font-weight:700;color:#fff;margin:20px 0 5px}
.box .post{display:block;font-size:15px;font-weight:600;color:#fff;margin-bottom:20px}
@media only screen and (max-width:990px){

}
@media only screen and (max-width:767px){
.box:before{left:-50%}
.box:hover:before{width:300%}
.box .title{font-size:12px;font-weight:700;color:#fff;margin:20px 0 5px}
.box .post{display:block;font-size:10px;font-weight:600;color:#fff;margin-bottom:20px}
}


img {
    border: 2px solid #e97117;
    padding: 5%;
  border-radius: 5%;

}