.blog-item{display:flex;padding:8px;position:relative;}
.blog-item:not(:last-child){border-bottom:1px solid var(--primary-color-50);}

.blog-item .blog-image{width:280px;padding:8px;box-sizing:border-box;}
.blog-item .blog-content{width:calc(100% - 280px);padding:8px;box-sizing:border-box;}
.blog-item .blog-content .categories{list-style:none;padding:0;margin:0;}
.blog-item .blog-content .categories li {display: inline-block;text-transform: capitalize;}
.blog-item .blog-content .categories li a{color:var(--primary-color-500);}
/*.blog-item .blog-content .categories li:first-child a{text-decoration:underline;}*/
.blog-item .blog-content ul.categories li:nth-last-child(n+2)::after {content: ", ";display:inline-block}
/*.blog-item .blog-content .categories li:after{content:", ";}*/
/*.blog-item .blog-content .categories li:nth-child(1):after,.blog-item .blog-content .categories li:last-child:after{display:none}*/
.blog-item .blog-content h2{font-size:2rem;margin:4px 0;text-transform:capitalize;}
.blog-item .blog-content h2 i{font-size:0.85rem;}
.blog-item .blog-content .owner{font-size:1rem;padding:0;}
.blog-item .blog-content .owner b{font-weight:500;}
.blog-item .blog-content .owner i{font-weight:400;font-style:normal;}
.blog-item .blog-content .description{padding:8px 0;font-size:1rem;position:relative;overflow: hidden;max-height: 72px;}
.blog-item .blog-content .description:after{content:"";width:100%;height:100%;position:absolute;z-index:1;background:rgb(255,255,255);box-shadow:0 0 24px 32px rgb(255,255,255);left:0;top:100%;}
.blog-item .blog-content .read-more{font-size:12px;text-decoration:underline;position:relative;}
.blog-item.status-2:before{position:absolute;left:calc(50% - 32px);top:calc(50%);z-index:2;content: "visibility_off";display: inline-block;font-family: "Material Icons";font-feature-settings: "liga";font-size: 64px;font-style: normal;font-weight: normal;letter-spacing: normal;line-height: 0;text-transform: none;word-wrap: normal;vertical-align: middle;}
.blog-item.status-2{background:var(--primary-color-50);opacity:0.64;}
.blog-item.status-2 .blog-content .description:after{box-shadow:0 0 24px 32px var(--primary-color-50);}
.search-wrapper{padding:16px;}
.categories-wrapper h2{padding:16px 0 16px 16px;}
.search-wrapper h2{padding:0 0 8px 0;}
.search-wrapper h2,.categories-wrapper h2{font-size:1.4rem;}
.categories-wrapper ul{padding:0;margin:0;list-style:none;}
.categories-wrapper ul li{display: -webkit-flex;display: flex;justify-content: space-between;padding:8px 16px;position:relative;z-index:0;}
.categories-wrapper ul li:before{content:"";position:absolute;left:0;top:0;width:100%;height:100%;z-index:-1;background:var(--primary-color-500);opacity:0.01;}
.categories-wrapper ul li:after{content:"";position:absolute;left:0;top:0;width:100%;height:1px;z-index:0;background:var(--primary-color-500);opacity:0.08;}
.categories-wrapper ul li a{display:block;width:100%;}
.categories-wrapper ul li a[data-material-icon="delete"]{width:32px;margin-top:6px;line-height:16px;opacity:0.6;}
.categories-wrapper ul li a[data-material-icon="delete"]:hover{opacity:1;}
.categories-wrapper ul li:hover a{text-decoration:underline;}
.categories-wrapper ul li:hover:before{opacity:0.04;}
.categories-wrapper ul li i{font-style:normal;font-weight:500;background:var(--primary-color-500);text-align:center;font-size:11px;position:relative;border-radius:40px;width:28px;height:20px;line-height:22px;color:rgba(255,255,255,1);margin-top:2px; }



.search-wrapper{margin-bottom:16px;}
.search-text-wrapper{display:flex;}
.search-text-wrapper .mdl-textfield{height:100%;}
.search-text-wrapper .mdl-textfield .mdl-textfield__input{height:100%;box-sizing:border-box;}
.search-text-wrapper .input{width:calc(100% - 36px);}
.search-text-wrapper .action{width:36px;margin-left:8px;}
.search-text-wrapper .action .mdl-button{min-width:0;padding:0;width:100%;height:36px;width:36px;box-shadow:none;}

.blog-content-wrapper{display:block;padding:16px;}

section.page-title .blog-title{text-align:center;}
section.page-title .blog-title.status-2 h1:after{content: "visibility_off";display: inline-block;font-family: "Material Icons";font-feature-settings: "liga";font-style: normal;font-weight: normal;letter-spacing: normal;line-height: 0;text-transform: none;word-wrap: normal;vertical-align: middle;margin-left:8px;}
section.page-title .blog-title h1{text-align:center;font-size:2.6rem;margin:8px 0;}
section.page-title .blog-title .owner{font-size:1rem;padding:0;text-align:center;}
section.page-title .blog-title .owner b{font-weight:500;}
section.page-title .blog-title .owner i{font-weight:400;font-style:normal;}
section.page-title .blog-title .categories{list-style:none;padding:0;margin:0;}
section.page-title .blog-title .categories li{display:inline-block;}
section.page-title .blog-title .categories li a{text-decoration:underline;color:var(--primary-color-500);}

.blog-wrapper .no-content{flex-flow:row wrap;height:100%;opacity:0.56;}
.blog-wrapper .no-content .icon{display:block;width:100%;text-align:center;}
.blog-wrapper .no-content .icon i:before{font-size:64px;margin:8px;display: block;line-height: normal;}
.blog-wrapper .no-content h2{font-size:1.6rem;}

.subscribe-blog-btn{display: block; margin-top: 1.5rem;text-align: center;}
.subscribe-blog-btn a:nth-child(2){float:right; max-width:65px;}

@media (max-width:640px){
.blog-item .blog-image { width: 240px; }
.blog-item .blog-content { width: calc(100% - 240px); }
}
@media (max-width:480px) {
.blog-item{ display:block }
.blog-item .blog-image,.blog-item .blog-content{ width:100% }
}
.search-wrapper.homebutton .buttonCont a {width: 100%;display: block;margin: 0 auto;padding: 4px 0;}
.search-wrapper.homebutton .buttonCont a span {cursor: pointer;display: inline-block;position: relative;transition: 0.5s;}
.search-wrapper.homebutton .buttonCont a span:after {content: '\00bb';position: absolute;opacity: 0;top: -2px;right: -20px;transition: 0.5s;font-size: 20px;}
.search-wrapper.homebutton .buttonCont a:hover span {padding-right: 25px;}
.search-wrapper.homebutton .buttonCont a:hover span:after {opacity: 1;right: 0;}
section.page-title.with-banner .blog-title .owner{color: rgba(255,255,255,1);}
section.blog-wrapper .blog-item .blog-content ul.categories li a:hover{text-decoration:underline;}
section.blog-wrapper .blog-item .blog-content h2 a:hover{text-decoration:underline;}
section.blog-wrapper .blog-detail ul.categories li a:hover{text-decoration:underline;}