/*** Default layout ***/
    /* 
.stepps-posts.default .post-item {
width: calc((100% / 4) - 20px);
margin: 10px;
border-radius: 5px !important;
overflow: hidden;
position: relative;
}

.stepps-posts.default .post-item:before {
content: '';
background-color: rgba(0, 41, 98, 0.5);
z-index: 3;
position: absolute;
width: 100%;
height: 100%;
left: 0;
top: 0;
}

.stepps-posts.default .post-item .post-item-inner {
position: relative;
min-height: 380px;
}

.stepps-posts.default .featured-image {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
background-size: cover;
background-color: #ddd;
z-index: 2;
transition: all ease 0.3s;
}

.stepps-posts.default .post-item:hover .featured-image {
filter: blur(5px);
-webkit-filter: blur(5px);
}

.stepps-posts.default .content-container {
z-index: 4;
position: relative;
}

.stepps-posts.default .post-title {
min-height: 50px;
}

@media screen and (max-width: 999px) {
.stepps-posts.default .post-item {
width: calc((100% / 2) - 20px);
margin: 10px;
}
}

@media screen and (max-width: 690px) {
.stepps-posts.default .post-item {
width: 100%;
margin: 10px 0px;
}
}
*/
    /*** layout ***/
    
    .post-categories .category-item {
        transition: all ease 0.2s;
    }
    
    .post-categories .category-item:hover,
    .post-categories .category-item.active {
        background-color: #0060b1 !important;
        color: #fff !important;
    }
    
    .stepps-posts .post-item {
        width: calc((100% / 3) - 30px);
        margin: 15px;
        position: relative;
        background-color: white;
    }
    
    .stepps-posts .post-item .featured-image {
        position: relative;
        min-height: 200px;
        background-position: center;
        background-size: cover;
        background-color: #dddddd57;
        background-size: contain;
        background-repeat: no-repeat;
    }
    
    #stepps-posts .post-details {
        background-color: white;
        min-height: 200px !important;
        padding: 30px 40px 30px 40px !important;
    }
    
    .stepps-posts .post-categories-inner {
        white-space: nowrap;
        overflow-x: auto;
    }
    
    #stepps-posts .readmore-btn {
        margin-top: 0px;
        position: absolute !important;
        bottom: 30px;
    }
    
    @media screen and (max-width: 999px) {
        .stepps-posts .post-item {
            width: calc((100% / 2) - 30px);
        }
    }
    
    @media screen and (max-width: 800px) {
        .stepps-posts .post-item {
            width: calc((100% / 1.5) - 30px);
        }
    }
    
    @media screen and (max-width: 690px) {
        .stepps-posts .post-item {
            width: 100%;
            /* margin: 15px 0px; */
            max-width: 400px;
        }
    }
    
    #stepps-posts .post-date-author-inner.text-primary {
        font-size: 14px;
        font-family: "RobotoReg";
        letter-spacing: 2px;
    }
    
    #stepps-posts .post-title .title a {
        font-size: 28px;
        line-height: 40px;
        color: #00486E !important;
        font-family: "FrankReg";
    }
    
    .post-readmore:after {
        content: '\f054';
        font-family: fontAwesome;
        position: absolute;
        right: 13px;
        z-index: 9999;
        color: #00486E;
        margin-top: 0px;
        font-size: 10px !important;
    }
    
    .post-readmore {
        border: 1px solid #00486E;
        color: #00486E;
        font-weight: 600 !important;
        border: 1px solid;
        width: 160px;
        display: block;
        height: 40px;
        display: flex;
        align-items: center;
        justify-content: left;
        margin: auto;
        font-size: 13px;
        letter-spacing: 1.5px;
        margin-top: 20px;
        position: relative;
        padding-left: 20px;
        text-transform: uppercase;
        font-weight: 100 !important;
    }
    
    .readmore-btn {
        margin-top: 37px;
    }
    
    #stepps-posts .post-categories-inner a {
        /* height: 40px;
width: 136px;
display: inline-flex;
align-items: center;
border: 1px solid #00486E;
color: #00486E;
letter-spacing: 1px; */
    }
    
    #stepps-posts .post-categories-inner .active {
        background-color: #00486E !important;
        color: white !important;
    }
    
    #stepps-posts .post-categories-inner a:hover {
        background-color: #00486E !important;
        color: white !important;
        opacity: 1 !important;
    }
    
    #stepps-posts .post-categories-inner a:first-child {
        outline: 1px solid;
        display: none !important;
    }
    
    .post-categories-inner {
        display: flex;
    }
    
    .homepage-news-categories .videos,
    .post-categories-inner .videos {
        order: 4;
    }
    
    .homepage-news-categories .our.suburbs,
    .post-categories-inner .our.suburbs {
        order: 2;
    }
    
    .homepage-news-categories .news,
    .post-categories-inner .news {
        order: 1;
    }
    
    .homepage-news-categories .lifestyle,
    .post-categories-inner .lifestyle {
        order: 3;
    }
    
    .homepage-news-categories .news {
        background-color: #00486E;
        color: white !important;
    }
    /* homepage insights */
    
    .homepage-news-categories a,
    #stepps-posts .post-categories-inner a {
        display: inline-flex;
        border: 1px solid #00486E;
        min-width: 135px;
        height: 40px;
        align-items: center;
        justify-content: center;
        color: #00486E !important;
        margin-right: 10px;
        font-size: 14px;
        text-transform: uppercase;
    }
    
    .homepage-news-categories {
        /* margin: auto; */
        text-align: center;
        margin: 35px 0px 20px 0px;
        display: flex;
        justify-content: center;
    }
    
    .readmore-btn a:hover {
        color: #00486E !important;
    }
    
    .homepage-news-categories a:hover {
        background-color: #00486E;
        color: white !important;
    }
    
    .homepage-news-section {
        line-height: 56px;
    }
    
    @media only screen and (max-width: 690px) {
        .homepage-news-categories a {
            width: 158px !important;
            margin-bottom: 10px;
            font-size: 13px !important;
        }
        .homepage-news-categories {
            display: block;
            white-space: nowrap;
            overflow-x: auto;
        }
    }
    
    div.stepps-posts.default ul.slick-dots {
        display: none !important;
    }
    
    .cat-videos .video-thumbnail {
        height: 330px;
        width: 100%;
        /* background-size: cover; */
        background-position: center;
        display: flex;
        align-items: center;
        justify-content: center;
        position: relative;
        flex-flow: column;
        padding: 30px;
    }
    
    .video-thumbnail i {
        color: white;
        font-size: 60px;
    }
    
    .dark-overlay {
        height: 100%;
        width: 100%;
        background-color: #0000008c;
        position: absolute;
    }
    
    .video-thumbnail:hover i {
        font-size: 70px;
        transition: .1s;
    }
    
    .cat-videos .video-title {
        color: white;
        z-index: 9;
        display: block;
        font-size: 20px;
        margin-top: 10px;
        line-height: 30px;
        text-align: center;
    }
    
    .cat-video-modal iframe.viframe.iframe-embed {
        width: 1000px !important;
        height: 500px !important;
    }
    
    @media only screen and (max-width: 768px) {
        .cat-video-modal iframe.viframe.iframe-embed {
            width: 500px !important;
            height: 332px !important;
        }
        .cat-video-modal {
            max-width: 500px !important;
        }
    }
    
    @media only screen and (max-width: 425px) {
        .cat-video-modal iframe.viframe.iframe-embed {
            width: 600px !important;
            height: 209px !important;
        }
        .cat-video-modal {
            max-width: 500px !important;
            padding: 11px !important;
            width: 95%;
        }
    }
    
    @media screen and (max-width: 1200px) {
        .archive .stepps-posts .post-item {
            width: calc((100% / 2) - 30px) !important;
            margin: 15px;
            position: relative;
            background-color: white;
        }
    }
    
    @media screen and (max-width: 800px) {
        .archive .stepps-posts .post-item {
            width: calc((100% / 1.5) - 30px) !important;
            margin: 15px;
            position: relative;
            background-color: white;
        }
    }
    
    @media screen and (max-width: 590px) {
        .archive .stepps-posts .post-item {
            width: calc((100% / 1) - 30px) !important;
            margin: 15px;
            position: relative;
            background-color: white;
        }
    }
    
    .home .stepps-posts .post-item .featured-image {
        background-color: #ddd;
    }
    
    article.post-item img {
        height: 318px !important;
        object-fit: cover;
    }