/* START Group Frontage */
.gpf_block {
    display: block;
    line-height: 1.4;
    margin: 8px auto;
    overflow: hidden;
    width: 99%;
}
.gl_title {
    display: block;
    margin: 4px 0;
    text-align: center;
}
.gpf_block .gl_title a {
    box-shadow: none;
    font-size: 20px;
    line-height: 1;
    padding: 4px 0;
    text-decoration: none;
}
.gpf_block .gl_title a:hover {
    opacity: 0.8;
}
.gpf_one_blk {
    background: #f6f6f6;
    box-shadow: 0 0 1px 1px rgb(219, 219, 219);
    display: inline-block;
    float: left;
    margin: 5px 0.5%;
    position: relative;
}
div.gpf_one_blk p {
    font: 14px/1 Arial,tahoma;
    margin: 0;
    padding: 0;
}
.gpf_content {
    margin: 5px 0 5px 3px;
}
.gpf_title {
    display: block;
    font-size: 18px;
    font-weight: bold;
    margin: 5px 0 0 5px;
    text-align: left;
    text-transform: uppercase;
}
.gpf_title a {
    font-size: 18px;
}



/* START list */
.gpf_cover {
    background: #eaebef;
    box-shadow: 0 0 1px 1px rgb(170, 170, 170);
    float: left;
    height: 100px;
    margin: 5px;
    overflow: hidden;
    position: relative;
    width: 100px;
}
.gpf_list .gpf_cover img{
    border: none;
    bottom: 0;
    height: auto;
    left: 0;
    margin: auto;
    max-width: none;
    position: absolute;
    right: 0;
    top: 0;
    -webkit-transform: scale(1.2);
    transform: scale(1.2);
    -webkit-transition: all 0.7s ease;
    transition: all 0.7s ease;
}
.gpf_cover img:hover {
    -webkit-transform: scale(1);
    transform: scale(1);
}
.gpf_list .gpf_cover .gpf_no_image {
    transform: scale(1.1);
    width: 100px;
}
.gpf_list .gpf_content {
    display: inline-block;
    width: calc(100% - 115px);
}
.gpf_list .gpf_title {
    margin: 0;
    overflow: hidden;
    width: 99%;
}
.gpf_title .fa-chevron-right {
    float: left;
}
.gpf_list .rcl-icon {
    box-sizing: content-box;
}
.gpf_list .gpf_title a {
    border: 0;
    box-shadow: none;
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.gpf_list .post-group-meta {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.gpf_list .post-group-meta a {
    border: 0;
}
.gpf_list .gpf_comm a {
    border: 0;
    box-shadow: none;
    text-decoration: none;
}
/* END list */


/* START slab */
.gpf_block.gpf_slab {
    text-align: center;
}
.gpf_slab .gpf_one_blk {
    float: none;
    max-width: 500px;
    min-width: 160px;
    overflow: hidden;
}
.gpf_slab_cov {
    height: 200px;
    overflow: hidden;
    position: relative;
    width: 100%;
}
.gpf_slab .gpf_slab_cov img {
    border: none;
    bottom: 0;
    display: inline-block;
    height: auto;
    left: 0;
    margin: auto;
    max-width: none;
    position: absolute;
    right: 0;
    top: 12px;
    -webkit-transform: scale(1.3);
    transform: scale(1.3);
    -webkit-transition: all 0.7s ease;
    transition: all 0.7s ease;
    width: 100%;
}
.gpf_slab .gpf_slab_cov img.gpf_no_image {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
}
.gpf_slab_cov img:hover {
    top: 20px;
}
.gpf_slab .gpf_one_blk .gpf_content {
    margin: 8px 0 0;
}
.gpf_slab .gpf_one_blk .gpf_title {
    background: rgba(247, 247, 247, 0.85);
    border: 0;
    box-shadow: none;
    font-size: 16px;
    left: 0;
    line-height: 1;
    margin: 0;
    padding: 5px 0;
    position: absolute;
    text-align: center;
    top: 0;
    width: 100%;
}
.gpf_foot {
    bottom: 0;
    height: 50px;
    position: absolute;
    width: 100%;
}
.gpf_gr_avatar {
    float: left;
    max-width: 50px;
}
.gpf_gr_avatar a img {
    border: none;
    height: auto;
    max-width: 100%;
}
.gpf_nmb {
    background: rgb(255, 255, 238);
    display: block;
    height: 40px;
    margin: 13px 0 0;
    padding: 6px 5px;
}
.gpf_nmb span {
    color: #777;
    display: inline-block;
    font-size: 14px;
    float: left;
    margin: 4px 0 0 7px;
}
.gpf_nmb .fa-comment {
    color: #dadada;
    float: right;
    font-size: 25px;
    position: relative;
}
.gpf_nmb .fa-comment a {
    border: 0;
    box-shadow: none;
    color: #999;
    font-size: 15px;
    left: 0;
    position: absolute;
    right: 0;
    text-decoration: none;
    top: 5px;
}
/* END slab */



/* START card */
.gpf_block.gpf_card .gpf_one_blk {
    box-sizing: border-box;
    height: 280px;
}
.gpf_card_cov {
    float: right;
    height: 235px;
    max-width: 250px;
    overflow: hidden;
    position: relative;
    width: 40%;
}
.gpf_star {
    float: right;
    line-height: 1.4;
    margin: 4px;
    position: relative;
}
.gpf_star span {
    color: #949494;
    font-size: 14px;
    font-weight: bold;
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 2;
}
.gpf_star span.gpf_red {
    color: #c30101;
}
.gpf_star span.gpf_green {
    color: #13b013;
}
.gpf_star .fa-star {
    color: rgb(241, 216, 12);
    font-size: 45px;
    position: relative;
    text-shadow: 0 0 1px rgb(171, 160, 47), 0 0 1px #555;
    z-index: 1;
}
.gpf_card_cov > a {
    display: block;
    height: 100%;
}
.gpf_card_cov a img {
    border: 0;
    height: auto;
    left: 0;
    margin: auto;
    max-width: none;
    position: absolute;
    right: 0;
    top: 28px;
    -webkit-transform: scale(1.3);
    transform: scale(1.3);
    -webkit-transition: all 0.7s ease;
    transition: all 0.7s ease;
}
.gpf_card_cov img:hover {
    left: 20px;
}
.gpf_card_cov .gpf_no_image {
    width: 200px;
}
.gpf_card_cov .card_triangle {
    border-color: transparent transparent transparent #f6f6f6;
    border-style: solid;
    border-width: 17px 0 17px 21px;
    height: 0;
    left: 0;
    margin: 0;
    position: absolute;
    top: calc(50% - 17px);
    width: 0;
}
.card_more {
    box-sizing: border-box;
    height: 230px;
    overflow: hidden;
    padding: 10px 7px;
    position: relative;
}
.card_gr_title {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 98%;
}
.gpf_not_group {
    color: #ca1e1a;
}
.card_gr_title .fa-users {
    color: #ccc;
    font-size: 14px;
    margin: 0 4px 0 0;
}
div.card_gr_title > a {
    border: 0;
    box-shadow: none;
    font-size: 12px;
    font-style: italic;
}
.gpf_card .gpf_title {
    border: 0;
    box-shadow: none;
    margin: 10px 5px 10px 20px;
    max-height: 50px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
a.gpf_title:hover,
.card_gr_title > a:hover {
    text-decoration: underline;
}
.card_text {
    font-size: 14px;
    height: 158px;
    overflow: hidden;
}
.card_text::after {
    background: rgba(246, 246, 246, 0.1) linear-gradient(to bottom, rgba(246, 246, 246, 0.3), rgba(246, 246, 246, 1));
    bottom: 0;
    content: "";
    display: block;
    height: 30px;
    left: 0;
    pointer-events: none;
    position: absolute;
    width: 100%;
    z-index: 1;
}
.gpf_card .card_text > h2 {
    font-size: 16px;
    line-height: 1.4;
    margin: 0;
    padding: 0;
}
.card_view {
    display: inline-block;
    height: 45px;
    width: 100%;
}
.card_view .gpf_more {
    background: rgb(240, 240, 240);
    box-shadow: none;
    box-sizing: border-box;
    float: left;
    font-size: 14px;
    height: 100%;
    line-height: 1;
    padding: 16px;
}
.gpf_more:hover {
    background: rgb(233, 233, 233);
}
.card_view .fa-chevron-right {
    font-size: 10px;
}
.card_img_foot {
    background: rgb(240, 240, 240);
    box-sizing: border-box;
    float: right;
    font-size: 14px;
    height: 100%;
    max-width: 250px;
    overflow: hidden;
    padding: 10px 8px;
    width: 40%;
}
.card_img_foot span {
    color: #777;
    display: inline-block;
    padding: 4px 0 0;
}
.card_img_foot .fa-comment {
    color: #dadada;
    float: right;
    font-size: 25px;
    position: relative;
}
.card_img_foot .fa-comment a {
    border: 0;
    box-shadow: none;
    color: #999;
    font-size: 15px;
    left: 0;
    position: absolute;
    right: 0;
    text-decoration: none;
    top: 5px;
}
/* START каждый 2-й блок типа card перевернут */
.gpf_card .gpf_one_blk:nth-child(2n+1) .gpf_star,
.gpf_card .gpf_one_blk:nth-child(2n+1) .gpf_card_cov,
.gpf_card .gpf_one_blk:nth-child(2n+1) .card_img_foot {
    float: left;
}
.gpf_card .gpf_one_blk:nth-child(2n+1) .card_triangle {
    border-color: transparent #f6f6f6 transparent transparent;
    border-width: 17px 21px 17px 0;
    left: auto;
    right: 0;
}
.gpf_card .gpf_one_blk:nth-child(2n+1) .gpf_more {
    float: right;
}
/* END каждый 2-й блок типа card перевернут */
/* END card */


/* START simple */
.gpf_simple .simple_title {
    border: 0;
    box-shadow: none;
    float: left;
    font-size: 16px;
    padding: 5px;
}
.simple_right {
    float: right;
}
.simple_right span {
    color: #969696;
    display: inline-block;
    font-size: 16px;
    padding: 7px 5px 0;
}
.gpf_simple .gpf_one_blk .fa-comment {
    color: #dadada;
    float: right;
    font-size: 25px;
    padding: 3px 5px 0;
    position: relative;
}
.gpf_simple .gpf_one_blk .fa-comment:hover {
    color: rgb(230, 227, 226);
}
.gpf_simple .gpf_one_blk .fa-comment a {
    border: 0;
    box-shadow: none;
    color: #999;
    font-size: 15px;
    left: 0;
    position: absolute;
    right: 0;
    text-decoration: none;
    top: 8px;
}
/* END simple */


@media screen and (max-width:768px) {
    .gpf_block.gpf_mobile .gpf_one_blk {
        width: 100% !important;
    }
    .card_text > h2 {
        margin: 6px 0;
    }
}
@media screen and (max-width:480px) {
    .gpf_cover,
    .gpf_list .gpf_cover .gpf_no_image {
        width: 65px;
    }
    .gpf_slab .gpf_one_blk {
        min-width: 220px;
    }
}
@media screen and (max-width:375px) {
    .gpf_slab .gpf_one_blk {
        min-width: 295px;
    }
}