@charset "utf-8";
/* Latest News CSS Document */
.news-box { position:relative; margin:20px 0; display:block;}
.news-inner { position:relative; box-shadow:0 1px 30px rgba(0,0,0,.12);}
.news-thumb { position:relative; text-align:center;}
.news-thumb img { width:100%; height:auto; display:block; -webkit-transition:all .5s; transition:all .5s; -webkit-transform:scale(1); -ms-transform:scale(1); transform:scale(1);}
.news-thumb a { overflow:hidden; position:relative; display:block;}
.news-thumb a:before { content:''; position:absolute; bottom:0; left:0; width:100%; height:100%; z-index:1; border-bottom:2px solid #ffffff; background-color:rgba(255,255,255,.5); opacity:1; -webkit-transition:all 500ms linear 50ms; transition:all 500ms linear 50ms; -webkit-transform:translate(0,105%); -ms-transform:translate(0,105%); transform:translate(0,105%);}
.news-thumb a:after { content:''; position:absolute; bottom:0; left:0; width:100%; height:100%; z-index:1; border-bottom:2px solid #ffffff; background-color:rgba(255,255,255,.5); opacity:1; -webkit-transition:all 500ms linear 50ms; transition:all 500ms linear 50ms; -webkit-transition-delay:.2s; transition-delay:.2s; -webkit-transform:translate(0,105%); -ms-transform:translate(0,105%); transform:translate(0,105%);}

.post-date { position:relative; bottom:13px; left:0; right:0; background-color:#1f1d1d; color:#ffffff; padding:12px 20px 12px 20px; text-transform:uppercase; letter-spacing:1px; z-index:1;}
.post-date i { color:#cf4a46; margin-right:5px; font-size:16px;}

.post-cate { position:absolute; top:-20px; background-color:#1f1d1d; color:#ffffff; padding:8px 20px 8px 20px; text-transform:capitalize; z-index:3; display:inline-flex; justify-content:space-between; align-items:center; left:50%; -webkit-transform:translateX(-50%); -ms-transform:translateX(-50%); transform:translateX(-50%);}
.post-cate a { color:#ffffff; display:inline-block; font-size:14px;}
.post-cate a:hover { color:#ffffff; transform:none;}
.post-cate i { margin-right:10px; color:#cf4a46; font-size:17px;}
.news-thumb .post-cate a:after, .news-thumb .post-cate a:before { content:none;}

.news-content { position:relative; padding-top:25px; text-align:center;}
.news-content h3 { margin-bottom:10px; text-transform:capitalize; line-height:30px;}
.news-txt-top { padding:0 25px 0 30px; margin-bottom:20px;}

.post-meta { position:relative; border-bottom:6px solid #cf4a46;}
.post-meta ul { display:flex; list-style:none; padding:0 10px; margin-bottom:0; border-top:1px solid rgba(77,101,129,.2);}
.post-meta ul li { width:50%; flex-grow:1; text-align:center; padding:15px 10px; list-style:none;}
.post-meta ul li i { margin-right:10px; color:#cf4a46;}

.in-read-more { position:absolute; bottom:0; width:100%; height:100%; display:flex; padding-top:6px; align-items:center; justify-content:center; text-transform:uppercase; background-color:#cf4a46; color:#ffffff; -webkit-transform:scaleY(0); -ms-transform:scaleY(0); transform:scaleY(0); opacity:0; -webkit-transform-origin:bottom center; -ms-transform-origin:bottom center; transform-origin:bottom center; -webkit-transition:.5s cubic-bezier(.24,.74,.58,1); transition:.5s cubic-bezier(.24,.74,.58,1); -webkit-transition-delay:.12s; transition-delay:.12s;}
.in-read-more i { position:relative; top:2px; margin-left:10px; -webkit-transition:all 500ms linear 50ms; transition:all 500ms linear 50ms;}

.news-box:hover .news-thumb a:before, .news-box:hover .news-thumb a:after { opacity:0; -webkit-transform:translate(0,0); -ms-transform:translate(0,0); transform:translate(0,0);}
.news-box:hover .news-thumb img { -webkit-transform:scale(1.3); -ms-transform:scale(1.3); transform:scale(1.3);}
.news-box:hover .in-read-more { -webkit-transform:scaleY(1); -ms-transform:scaleY(1); transform:scaleY(1); opacity:1; -webkit-transition-delay:.12s; transition-delay:.12s;}
.in-read-more:hover { background-color:#1f1d1d; color:#ffffff;}

.in-read-more:hover i {-webkit-animation:toRightFromLeft .3s linear 1; -ms-animation:toRightFromLeft .3s linear 1; animation:toRightFromLeft .3s linear 1;}

@-webkit-keyframes toRightFromLeft {
	49% {
        -webkit-transform: translate(100%);
    }
    50% {
        opacity: 0;
        -webkit-transform: translate(-100%);
    }
    51% {
        opacity: 1;
    }
}

@keyframes toRightFromLeft {
	49% {
        transform: translate(100%);
    }
    50% {
        opacity: 0;
        transform: translate(-100%);
    }
    51% {
        opacity: 1;
    }
}