#blog-post-page {}
.blog-post { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 70px; }
.blog-post-lt { width:calc(33.33333% - 40px); }
.blog-post-inf { height: 50px; margin-bottom: 15px; width:calc(100% - 30px); padding: 0 15px; display: flex; align-items: center; justify-content: space-between; background-color: var(--light-bg); border-radius: 3px; }
.blog-post-im { width: calc(100% - 2px); border-radius: 3px; border:1px solid var(--light-gray); height: 340px; display: block; background-position: center center; background-size:cover; margin-bottom: 15px; }
.blog-post-dt { font-size: 18px; color:var(--deep-gray); font-weight: 500; }
.blog-post-soc-share { display: flex; align-items: center; }
.soc-share { display: block; width: 20px; height: 20px; margin-left:15px; transition: .2s; }
.soc-share i { display: block; width: 20px; height: 20px; }
.soc-share i svg { display: block; width: 20px; height: 20px; fill:var(--deep-blue); }
.soc-share:hover { transform: scale(1.3); transition: .2s; }

.blog-post-rt { width:calc(66.66666% - 0px); }

.art-formatted {  }
.art-formatted p { font-size: 14px; color:var(--black); line-height: 22px; margin-bottom: 20px; }
.art-formatted ul { font-size: 14px; line-height: 24px; color:var(--black); }
.art-formatted ul li { font-size: 14px; line-height: 24px; color:var(--black); }
.art-formatted a { font-size: 14px; color:var(--blue); text-decoration: underline; transition: .2s; }
.art-formatted a:hover { color:var(--deep-blue); transition: .2s; }

#blog-page {}
.blog-title-wrapper { display: flex; align-items: center; justify-content: space-between; margin-bottom: 60px; }
.blog-title-wrapper h1.blog-title { width:calc(100% - 320px); margin: 0; font-size: 36px; font-weight: normal; text-transform: uppercase; color:var(--gray-dark); }

.noposts { text-align: center; font-size: 18px; margin:50px auto; }

.two-c { display: flex; justify-content: space-between; margin-bottom: 70px; }
.two-c-lt { width:calc(25% - 10px); }
.two-c-rt { width:calc(75% - 10px); }

.blog-tags { margin-bottom: 20px; display: flex; flex-direction: row; align-items: center; justify-content: center; flex-wrap: wrap; max-width: 100%; }
.blog-tags a {border-bottom: 3px solid transparent; font-size: 18px; font-weight: 300; width: fit-content; display: flex; align-items: center; justify-content: flex-start; margin: 0 15px 30px 15px; height: 36px; line-height: 36px; color: var(--gray-dark); transition: .2s; }
.blog-tags a:hover { transition: .2s; color:var(--pink); }
.blog-tags a.act { font-weight: bold; }

.blog-item-extra {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    height: 20px;
    padding-top: 15px;
    border-top: 2px solid var(--white-gray);
    width: 100%;
}

.blog-item-extra .inf {
    font-size: 16px;
    color: var(--gray);
    margin-right: 10px;
}

.blog-item-extra .dt {
    font-size: 14px;
    color: var(--gray);
}

@media(max-width:1070px) {
    .blog-tags a { margin:0 10px 20px 10px; }
}

.blog-list { display: flex; flex-direction: column; margin-bottom: 20px; }
.blog-list-item { width:100%; margin-bottom: 50px; display: flex; align-items: flex-start; justify-content: space-between; position: relative; }
.blog-list-item .lt { width:35%; border-radius: 5px; border:2px solid var(--white-gray); display: block; }

.blog-list-item .lt .im { display: block; border-radius: 5px; width:100%; height: 225px; background-position: center center; background-size: cover;  }
.blog-list-item .lt .blog-item-extra { display: flex; align-items: center; justify-content: space-between; height: 20px; padding: 15px 10px; border-top:2px solid var(--white-gray); }
.blog-list-item .lt .blog-item-extra .inf { font-size: 16px; color:var(--gray); margin-right: 10px; }
.blog-list-item .lt .blog-item-extra .dt { font-size: 14px; color:var(--gray); }

.blog-list-item .rt { width: calc(65% - 30px); display: flex; flex-direction: column; align-items: flex-start; height: 228px; max-height: 228px; position: relative; overflow: hidden; }
.blog-list-item .rt .title { font-size: 32px; color:var(--gray-dark); line-height: 40px; margin-bottom: 15px; max-height: 120px; }
.blog-list-item .rt .text { font-size: 16px; font-weight: 300; color:var(--gray-dark); line-height: 24px; margin-bottom: 30px; }
.blog-list-item .controls { display: flex; align-items: center; justify-content: flex-start; position: absolute; bottom: 0px; left:calc(35% + 30px); }
.blog-list-item .controls {  }
.blog-list-item .controls .btn-link { margin:0 30px 0 0; }

.blog-item-likes { display: flex; align-items: center; justify-content: flex-start; position: relative; height: 24px; top:0; left:0; }
.blog-item-like-btn { display: flex; align-items: center; justify-content: flex-start; }
.blog-item-like-btn .svg-wrapper {  margin-right: 5px; width: 24px; height: 24px; display:flex; align-items: center; justify-content: center; border-radius: 50%;}
.blog-item-like-btn .svg-wrapper svg { width: 16px; height: 16px; fill: var(--white);}
.blog-item-like-btn .cnt { font-size: 13px; }

.blog-item-like { margin-right: 10px; }
.blog-item-like .svg-wrapper { background-color: var(--pink); }
.blog-item-like .cnt { color: var(--pink); }

.blog-item-dislike .svg-wrapper { background-color: var(--gray); }
.blog-item-dislike .cnt { color: var(--gray); }