.portfolio-image, .portfolio-style4 { position: relative; }
.portfolio-content-wrap:hover .portfolio-title { opacity: 1; transform: translateY(0); visibility: visible; }
.portfolio-image:hover:before { opacity: .8; visibility: visible; }
.portfolio-image:before { background: #0000; border:0px solid #000; content: ""; height: 100%; left: 0; opacity: 0; position: absolute; top: 0; transition: .6s; visibility: hidden; width: 100%; z-index: 1; }
.portfolio-img { width: 100%; height: 300px; object-fit: cover; }
.portfolio-style4 .portfolio-content-wrap { height: 100%; left: 0; position: absolute; text-align: center; top: 0; width: 100%; }
.portfolio-info { height: 100%; padding: 30px; position: relative; z-index: 1; }
.portfolio-info:hover:before { transform: scale(1); }
.portfolio-info:before { background: #00a9ec; content: ""; height: calc(100% - 0px); left: 0; opacity: .8; position: absolute; top: 0; transform: scale(0); transition: .5s; width: calc(100% - 0px); z-index: -1; transition: all 0.5s ease 0s; }
.portfolio-title { opacity: 0; transform: translateY(20px); transition: .6s; visibility: hidden; }
.butn { background-color: var(--primaryColor); border: 1px solid #ccc; border-radius: 4px; color: #fff !important; cursor: pointer; display: inline-block; font-size: 14px; font-weight: 600; padding: 15px 30px 15px 55px; position: relative; text-transform: uppercase; transition: .5s; text-decoration: none; }
.vertical-align-middle { vertical-align: middle; }
.bottom-news-text { font-size: 14px; line-height: 17px; color: #FFF; background: var(--primary) !important; padding: 10px 10px; text-align: center; position: absolute; bottom: 0; width: 100%; transition: all .3s ease-in; }
.subpost-banner img { width: 100%; }
.news-banner-list { padding-bottom: 24px !important; }
.news-banner-box { position: relative; display: block; min-height: 350px; border: 10px solid #fff; outline: 1px solid rgba(0, 0, 0, 0.15);
    outline-offset: -1px; margin:auto;  }
.news-banner-img { width: 100%; }
.news-banner-img { position: absolute; width: 100%; height: 100%; object-fit: cover; top: 0; left: 0; }
.news-banner-img img { width: 100%; height: 100%; top: 0; left: 0; object-fit: cover; }
.news-banner-content { width: auto; max-width: calc(100% - 200px); padding: 20px; position: absolute; font-size: 24px; line-height: 27px; color: #ffffff; font-weight: 400; padding-left: 60px; bottom: 0; right: 0; z-index: 9; overflow: hidden; }
.news-banner-content::before { content: ''; position: absolute; width: calc(100% + 200px); height: calc(100% + 80px); border-top: 3px solid #00a9ec9c; border-left: 10px solid #00a9ec9c; left: 18px; transform: skewX(-26deg); top: 0; background-color: #04151ca6; z-index: -1; }
.news-banner-meta { font-size: 16px; color: #1A2057; font-weight: 500; margin-bottom: 20px; }
.portfolio-image:hover .bottom-news-text { opacity: 0; visibility: hidden; }
.subpost-banner { border-radius: 15px; overflow: hidden; }
.subpost-banner img { height: 580px; object-fit: cover; }
.subpost-cnt { padding: 30px 0; border-bottom: 1px solid #e3e3e3; margin-bottom: 20px; }
.subpost-cnt h1 { color: #000; font-size: 30px; font-weight: 600; text-transform: capitalize; }
.user-test { font-size: 16px; color: #000; margin-bottom: 15px; }
.user-test i { margin-right: 5px; color: var(--primary) !important; }
.subpost-cnt .view-and-date { display: flex; align-items: center; justify-content: center; margin: 30px 0 0 0; }
.subpost-cnt .view-and-date span { font-size: 16px; color: #000; margin: 0 20px; }
.subpost-page i { color: var(--primaryColor); font-size: 17px; position: relative; top: 1px; }
.subpost-cnt .view-and-date span { font-size: 16px; color: #000; margin: 0 20px; }
.subpost-cnt .view-and-date span i { margin-right: 5px; color: var(--primary) !important; }
.subpost-cnt .social {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 10px 25px;
    border-radius: 30px;
    background: #00a9ec;
    position: relative;
    top: 53px;
}

.news-banner-list .slick-next {  opacity: 1 !important; }
.news-banner-list .slick-prev {opacity: 1 !important; }


/* news brand page css start */
.news-page .bg-light .row {
    margin: 0 -45px;
}
.news-page .bg-light .heading-5 {
    text-align: left;
    margin-bottom: 0;
    padding-bottom: 0px;
    display: inline-block;
    color: #54595f;
    text-transform: capitalize;
    font-size: 16px;
    font-weight: 500;
}
.news-page .new-card {
    overflow: hidden;
    display: block;
    background: #fff;
    position: relative;
    overflow: hidden;
}
.news-page .new-card img {
    width: 100%;
    height: 280px;
    object-fit: cover;
}
.news-page .list_news_title, .news-page .list_news_title:hover {
    text-align: center;
    padding: 8px;
    color: white;
    text-decoration: none;
    background: #00a9ec;
	font-size: 15px;
    line-height: 20px;
}

.news-page .list_news_title p{
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;}

.news-page .new-card:hover:after {
    opacity: 1;
    top: 0;
}
.news-page .new-card::after {
    content: "";
    background: rgba(0, 169, 236, 0.5);
    position: absolute;
    left: 0;
    right: 0;
    top: 100%;
    bottom: 0;
    opacity: 0;
    transition: all 0.3s ease-in-out;
}
.news-page .load-more-btn {
    background: #00a9ec;
    margin: auto;
    color: white;
    padding: 5px 10px;
    display: block;
    width: 150px;
    text-align: center;
    margin-top: 0px;
    margin-bottom: 20px;
    cursor: pointer;
}

.news_banner_box_new{position: relative;
    display: block;
    min-height:580px;
    border: 10px solid #fff;
    outline: 1px solid rgba(0, 0, 0, 0.15);
    outline-offset: -1px;
    margin: auto;}
/* news brand page css end */

@media (min-width:991.98px) {

.news-banner-list .slick-next { right: -55px !important;}
.news-banner-list .slick-prev { left: -55px !important;}
}
@media (max-width:991.98px) {
    .news_banner_box_new {min-height: 300px;}
}

.subpost-cnt .social p { color: #fff; font-size: 14px; margin-bottom: 0; font-weight: 300; }
.subpost-cnt .social a i { font-size: 16px; color: #fff; transition: all 0.3s ease-in; margin-left: 15px; }
.relatednews-slider .slick-slide {padding: 0px 5px;}
.relatednews-slider { width: calc(100% + 20px); margin-left: -10px; }
.relatednews-slider .slick-track { display: flex; }
.relatednews-section .item { background: #fff; border-radius: 8px; overflow: hidden; border: 1px solid #e3e3e3; height: auto; width: calc(100% - 20px); display: flex; flex-flow: column; }
.relatednews-section .newsImg { position: relative; }
.relatednews-section .newsImg img { height: 200px; object-fit: cover; }
.relatednews-section .newsImg a { display: block; width: 100%; }
.relatednews-section .newsImg a img { width: 100%; object-fit: cover; }
.relatednews-section .date-news { position: absolute; top: 15px; left: 10px; display: inline-block; background: #fff; border-radius: 3px; padding: 3px 10px; font-size: 12px; }
.relatednews-section .date-news i { margin-right: 3px; }
.relatednews-section .date-news i { color: var(--primary) !important; font-size: 17px; position: relative; top: 1px; }
.relatednews-section .news-detail { padding: 15px 12px; }
.relatednews-section h4 { color: #000; font-size: 16px; font-weight: 600; margin-bottom: 8px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.relatednews-section .user-test { font-size: 14px; margin-bottom: 0px; }
.user-test i { margin-right: 5px; color: var(--primaryColor); }
@media (max-width:767.98px) {
	.subpost-banner img { height: 280px; object-fit: cover; }
	.relatednews-slider { padding-bottom: 26px !important; }
	.subpost-cnt .view-and-date { flex-flow: column; gap: 12px; }
	.subpost-cnt .view-and-date span { font-size: 14px; }
	.subpost-cnt .view-and-date span i { font-size: 14px; vertical-align: text-top; }
	.news-banner-box { min-height: 300px; }
	.news-banner-content { max-width: calc(100% - 30px); font-size: 16px; line-height: 20px; }
	.news-banner-content::before { transform: skewX(-20deg); }
}
