/***************** Stepps Recent Post | Archive Page | Blog Page ******************/
.blog-list-container .wpb_wrapper article.stepps-recent-post{
	width: 100%;
	margin-bottom: 50px!important;
}

body:not([class*='page-paged-']) .blog-list-container article.stepps-recent-post:first-child{
	border-bottom: 3px solid #00283c;
    padding-bottom: 50px;
}

.stepps-recent-post h2 {
    font-size: 30px;
    line-height: 38px;
}

.stepps-recent-post .excerpt {
    padding-bottom: 15px;
}

body:not([class*='page-paged-']) .blog-list-container article.stepps-recent-post:first-child .date{
	margin: 20px 0 10px;
}

body:not([class*='page-paged-']) .blog-list-container article.stepps-recent-post:first-child .image-container,
body:not([class*='page-paged-']) .blog-list-container article.stepps-recent-post:first-child .content-container{
	width: 100%!important;
	padding-left: 0;
    display: block;
    position: relative;	
}

body:not([class*='page-paged-']) .blog-list-container article.stepps-recent-post:first-child .image-container .post-featured-img{
	padding-bottom: 52%!important;
}

body:not([class*='page-paged-']) .blog-list-container article.stepps-recent-post:nth-child(2):before {
    content: 'Latest Articles';
    margin-bottom: 40px;
    display: block;
    font-size: 30px;
    font-weight: 600;
    font-weight: 600;
    font-family: NettoOT !important;
}

.blog-list-container .stepps-recent-post .post-featured-img {
    /*padding-bottom: 105%!important;*/
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    height: 100%; 
} 

.blog-list-container .stepps-recent-post .date{
    margin-bottom: 10px;
    font-size: 14px;
    font-family: NettoOT;
}

.blog-list-container .stepps-recent-post .meta-category{
	margin-top: 30px;
}

.blog-list-container .stepps-recent-post .meta-category a{
    background-color: #008c99;
    color: #fff;
    margin-right: 5px;
    margin-bottom: 5px;
    padding: 5px 10px;
    display: inline-block;
    font-size: 14px;
    font-weight: 400;
    font-family: "NettoOT";
}

html body .blog-list-container #pagination .page-numbers,
html body .blog-list-container #pagination .page-numbers.dots,
html body .blog-list-container #pagination .page-numbers.current,
html body #pagination span.page-numbers.dots{
    color: #008C99!important;
    font-weight: 400;
    font-size: 16px!important;
    display: inline-block;
    width: auto;
    max-width: none;
    width: auto!important;
    border-radius: 0!important;
    padding: 20px 15px!important;
    margin: 0;
    margin-left: -6px!important;
    border: 1px solid rgba(0, 140, 153, 0.5)!important;
    font-family: "NettoOT";
    line-height: 2px!important;
}

html body .blog-list-container #pagination .page-numbers.next, 
html body .blog-list-container #pagination .page-numbers.prev {
    color: #008C99!important;
} 

html body .blog-list-container #pagination .page-numbers.next,
html body .blog-list-container #pagination .page-numbers:last-child {
    border-radius: 0px 4px 4px 0px!important;
    -moz-border-radius: 0px 4px 4px 0px!important;
    -webkit-border-radius: 0px 4px 4px 0px!important;
}


html body .blog-list-container #pagination >span:first-child.page-numbers,
html body .blog-list-container #pagination >.page-numbers.prev {
    margin-left: 0!important;
    border-radius: 4px 0px 0px 4px!important;
    -moz-border-radius: 4px 0px 0px 4px!important;
    -webkit-border-radius: 4px 0px 0px 4px!important;
    margin-right: 0!important;
    padding: 20px 15px!important;
    line-height: 2px!important;
    font-weight: 400;
    font-size: 16px!important;
    width: auto!important;
}

html body .blog-list-container #pagination .page-numbers.current{
	background-color: #008C99!important;
	color: #fff!important;
}

html body .blog-list-container #pagination{
	padding: 5px 0!important;
}


@media only screen and (min-width: 1000px){
	body:not([class*='page-paged-']) .blog-list-container article.stepps-recent-post:(:first-child).content-inner .row,
	.blog-list-container article.stepps-recent-post.content-inner .row{
		min-height: 280px;
	}
	
	body:not([class*='page-paged-']) .blog-list-container article.stepps-recent-post:not(:first-child) .image-container,
	.blog-list-container article.stepps-recent-post .image-container{ 
		float: none;
	    display: inline-block;
	    height: 100%;
	    position: absolute;
	    width: 275px;
	    z-index: 2;
	}
	
	body:not([class*='page-paged-']) .blog-list-container article.stepps-recent-post:not(:first-child) .content-container,
	.blog-list-container article.stepps-recent-post .content-container{
	    float: none;
	    display: inline-block;
	    width: 100%;
	    padding-left: 295px;
	}
}


@media only screen and (min-width: 1200px){
	
	.vc_col-lg-8.blog-list-container{
		width: 69.957447%!important;
	}
	
	.vc_col-lg-4.blog-sidebar{
		width: 27.914894%!important;	
	}
	
	
}

@media only screen and (max-width: 1000px){
	.blog-list-container .stepps-recent-post .post-featured-img {
	    padding-bottom: 52%!important;
	}
}

@media only screen and (min-width: 768px) and (max-width: 1000px){
	.blog-list-container{
		padding-right: 40px;
	} 
}


@media only screen and (min-width: 1000px){
	.blog-sidebar{
		padding-left: 30px;	
	}
	
}


.blog-list-container #pagination{
	text-align: left;
}
@media only screen and (max-width: 767px){
	.sticky-content{
		display:none;
	}
}


/*design-2*/
.design-2{
	text-align:center;
}
.design-2 > article{
	text-align:left;
    width: 25%;
    display: inline-block;
    vertical-align: top;
    padding: 10px;
}
.design-2 > article .post-featured-img{
    height: 250px;
    background-size: cover;
    background-color:#1686b0;
}

.design-2 > article .article-content-wrap{
    padding: 15px;
    border: 1px solid #ddd;
    min-height: 280px;
    background-color:#fff;
}
.design-2 > article .article-content-wrap .title{
    font-weight: 100;
    line-height: 1.2em;
    font-size: 22px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.design-2 > article .article-content-wrap .article-readmore{
	margin-top:5px;
}
.design-2 > article .article-content-wrap .article-readmore a:after{
	font-family:fontAwesome;
	content:'\f105';
	margin-left:5px;
}
@media screen and (max-width:1150px){
	.design-2 > article{
		width:33.33%;
	}
}
@media screen and (max-width:855px){
	.design-2 > article .article-content-wrap{
		min-height: 320px;
	}
}
@media screen and (max-width:767px){
	.design-2 > article{
		width:50%;
	}
}
@media screen and (max-width:550px){
	.design-2 > article{
		width:100%;
	}
}
/***************** Numbered Pagination ******************/
#post-area #pagination{
    /*margin-top: 30px;
    height: 44px;
	text-align: center;
	margin-bottom: 0;*/
}

.epl-pagination #pagination .page-numbers{
	border-radius: 0!important;
}

.pagination-wrapper #pagination > a:first-child.page-numbers {
    padding-left: 13px!important;
}

.pagination-wrapper #pagination a.page-numbers, 
.pagination-wrapper #pagination span.page-numbers,
.pagination-wrapper #pagination .page-numbers.prev, 
.pagination-wrapper #pagination .page-numbers.next{
    /*line-height: 20px; 
    font-size: 16px!important;
    margin-right: 8px;
    border: 2px solid #BFBFBF!important;
    padding: 10px 15px!important;
    display: inline-block;*/
}

.pagination-wrapper #pagination > a.page-numbers:hover{
    /*background-color: #ebebeb!important;	*/
}

.pagination-wrapper #pagination > span.page-numbers.current{
    /*line-height: 22px;
    font-size: 16px!important;
    box-shadow: none;
    height: auto;
    width: auto;
    padding: 10px 15px!important;
    background-color: transparent!important;
    border: 2px solid #BFBFBF!important;
    color: #ec493d!important;*/
}

.pagination-wrapper #pagination .page-numbers.next {
    /*border: 0;*/
    /*padding-left: 0!important;*/
}

.pagination-wrapper #pagination .page-numbers.prev {
    /*border: 0;
    padding-right: 0!important;*/
}

.epl-pagination{
	text-align: center;
	margin-top: 30px;
	margin-bottom: 20px!important;
}

.epl-pagination span.pages{
	display: none;
}

.epl-pagination a, 
.epl-pagination span{
	color: #1E384B;
    display: inline-block;
    font-weight: 600;
    margin: 0 5px;
    border: 1px solid #BFBFBF!important;
    text-decoration: none;
    background-color: transparent;
    transition: none;
    /*border-radius: 200px!important;
    -webkit-border-radius: 200px!important;
    -o-border-radius: 200px!important;*/
    height: 35px!important;
    width: 35px!important;
    text-align: center;
    line-height: 12px!important;
    font-size: 12px!important;
    padding: 11px 13px 10px 13px!important;    
}

.epl-pagination a.nextpostslink {
    /*border: 0;
    padding-left: 0*/
}

.epl-pagination .last,
.epl-pagination .first {
    border: 1px solid #ccc;
    width: auto;
}

a.previouspostslink {
    /*border: 0;
    padding-right: 0;*/
}

.epl-pagination span.current {
	background: #0a1336;/*change to default color*/
	color: #fff;
	border-color: transparent;
    height: 35px!important;
    width: 35px!important;
    margin: 0 5px!important;
    -webkit-box-shadow: none!important;
    box-shadow: none!important;
}

.epl-pagination a:hover {
    background: transparent;
   color: #0a1336; /*change to default color*/
}

/*Masonry*/

.blog-recent.masonry article{
	display:inline-block;
    float: left;
	border-radius: 0!important;
	overflow: hidden;
	    
}


.blog-recent.masonry article {
	position: relative;
}

.blog-recent.masonry article .ft-img{
    width: 100%;
    height: 100%;
    position: absolute;
    background-size: cover;	
}

.blog-recent.masonry article .ft-img{
	transition: all 0.3s;
}

.blog-recent.masonry article:hover .ft-img{
	 transform:scale(1.05);
}

.blog-recent.masonry article > div{
	border-radius: 0!important;    
}

.blog-recent.masonry article *{
	color:#fff;
}
.blog-recent.masonry article .article-content-wrap{
	background-size:cover;
	padding: 40px;
	display:flex;
	align-items:center;
	justify-content:center;
	text-align:center;
	position:relative;
}
.blog-recent.masonry article .article-content-wrap:before{
	content:'';
	position:absolute;
	left:0px;
	top:0px;
	width:100%;
	height:100%;
	background-color: rgba(0, 0, 0, 0.4);
	z-index: 1;
}
.blog-recent.masonry article .article-content-wrap .article-content{
	z-index:10;
    /*padding-top: 100px;*/
}

.blog-recent.masonry article .article-content-wrap .article-content *{
	color: #fff;
}

.blog-recent.masonry article .article-content-wrap .article-content a{
	margin-right: 10px;
}

.blog-recent.masonry article .article-content-wrap .article-content a:last-child{
	margin-right: 0;
}

.blog-recent.masonry article .article-content-wrap .article-content .meta-category{
	font-size: 14px;
	line-height: 18px;
	margin-bottom: 10px;	
}

article .article-content-wrap .overlay-link{
	z-index:11;
	position:absolute;
	left:0px;
	top:0px;
	width:100%;
	height:100%;
}
article .article-content h2.title{
	font-size: 24px;
    line-height: 28px;
}
article .article-content .date{
    color: #fcdf05;
    font-size: 16px;
}
article .article-content .date:before{
	content:'\f073';
	font-family:fontAwesome;
	margin-right:5px;
}
article .article-content .readmore-link{
	margin-top: 30px;
    font-weight: bold;
	z-index:15;
	opacity: 0 !important;
    background-color: #fcdf06 !important;
    border-color: #fcdf06 !important;
    color: #000 !important;
    text-transform: capitalize;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 1px;
    padding: 15px 30px !important;
}
article .article-content .readmore-link span{
	color: #000;
}
article .article-content .readmore-link [class*="fa-"],
article .article-content .readmore-link [class*="icon-"]{
    color: #000;
    background-color: transparent;
    width: auto;
    height: auto;
    margin-left: 5px;
    margin-top: 1px;
}
.blog-recent.masonry article:hover .readmore-link{
	/*visibility:visible !important;*/
	opacity: 1 !important;
}

/*.blog-recent.masonry article:hover .article-content-wrap:before{
	content:'';
	position:absolute;
	left:0px;
	top:0px;
	width:100%;
	height:100%;
	background-color: rgba(0, 140, 153, 0.8);
	z-index: 1;
}*/

.blog-recent.masonry article:first-child{
	width:38%;
	margin-right:2%;
}
.blog-recent.masonry article:first-child .article-content-wrap{
	height:700px;
}
.blog-recent.masonry article:nth-child(2){
	width:60%;
	margin-bottom: 20px;
}
.blog-recent.masonry article:nth-child(2) .article-content-wrap{
	height:330px;
}
.blog-recent.masonry article:nth-child(3){
	width:29%;
	margin-right:1%;
}
.blog-recent.masonry article:nth-child(3) .article-content-wrap{
	height:350px;
}
.blog-recent.masonry article:nth-child(4){
	width:29%;
	margin-left:1%;
}
.blog-recent.masonry article:nth-child(4) .article-content-wrap{
	height:350px;
}
.blog-recent.masonry.post-3 article:nth-child(3){
	width:60%;
	margin-right:0%;
}
.blog-recent.masonry.post-2 article:nth-child(2){
	margin-bottom: 0px;
}
.blog-recent.masonry.post-2 article:nth-child(2) .article-content-wrap{
	height:700px;
}
.blog-recent.masonry.post-1 article:first-child{
	max-width:700px;
	margin-right:0%;
}
.blog-recent.masonry.post-1 article:first-child .article-content-wrap{
	height:350px;
}
@media screen and (max-width:999px){
	.blog-recent.masonry article{
	    width: 49% !important;
	    margin-left:0px !important;
	    margin-right: 2% !important;
	    margin-bottom: 20px !important;
	}
	.blog-recent.masonry article:nth-child(even){
		margin-right:0px !important
	}
	.blog-recent.masonry article .article-content-wrap{
		height: 380px !important;
	}
	.blog-recent.masonry article .article-content-wrap .article-content{
		padding-top:0px;
	}
	article .article-content .readmore-link{
		opacity:1 !important;
	}
	body .btn-view{
		margin-top:40px;
	}
}
@media screen and (max-width:689px){
	.blog-recent.masonry article{
		width:100% !important;
		margin-right:0px !important;
	}
}