

/* Start:/faces/style.css?17382291577355*/
div#faces_list
{
margin-bottom: 2rem;
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: center;
align-items: stretch;
}

div#faces_list a.faces_item
{
width: 20%;
height: auto;
margin: 2.25%;
background-position: center top;
background-size: cover;
cursor: pointer;
}

div#faces_list a.faces_item div.faces_item_overlay
{
width: 100%;
padding-top: 125%;
background: rgba(0, 0, 0, 0.4);
transition: all ease 0.25s;
position: relative;
}

div#faces_list a.faces_item:hover div.faces_item_overlay
{
background: rgba(0, 0, 0, 0);
}

div#faces_list a.faces_item div.faces_item_overlay div.faces_item_info
{
position: absolute;
bottom: 0;
width: 100%;
height: 27.5%;
background: #000;
color: #fff;
padding: 0.75rem;
font-family: Helios Cond, Arial, sans-serif;
}

div#faces_list a.faces_item div.faces_item_overlay div.faces_item_info h2
{
font-size: 0.85rem;
text-transform: uppercase;
letter-spacing: 0.125rem;
}

div#faces_list a.faces_item div.faces_item_overlay div.faces_item_info span.faces_item_more
{
position: absolute;
left: 0.75rem;
bottom: 0.55rem;
font-size: 0.75rem;
line-height: 0.75rem;
font-weight: bold;
text-transform: uppercase;
color: #da3c1f;
}

div#faces_list a.faces_item div.faces_item_overlay div.faces_item_info span.faces_item_more i
{
font-size: 0.95rem;
margin-left: 0.25rem;
position: relative;
top: 0.0625rem;
}

div#faces_need_more
{
margin: 2rem auto;
}

div.faces_loading
{
width: 100%;
height: auto;
text-align: center;
}

div.faces_loading div.faces_loading_item
{
display: inline-block;
width: 3rem;
height: auto;
margin: 0;
background: #000;
}

div.faces_loading div.faces_loading_item div
{
padding-top: 50%;
}

div.faces_loading div.faces_loading_item.active
{
background: #da3c1f;
}

div.faces_detail_container
{
width: 100%;
max-width: 60rem;
margin: 0.5rem auto 2rem auto;
display: flex;
flex-direction: row;
flex-wrap: nowrap;
justify-content: space-between;
align-items: stretch;
}

div.faces_detail_container div.faces_detail_image_container
{
width: 30%;
flex-shrink: 0;
flex-grow: 0;
margin-right: 3rem;
}

div.faces_detail_container div.faces_detail_image_container div.faces_detail_image
{
width: 100%;
height: auto;
padding-top: 150%;
background-position: center top;
background-size: cover;
}

div.faces_detail_container div.faces_detail_text_container
{
width: 70%;
flex-shrink: 1;
flex-grow: 1;
}

div.faces_detail_container div.faces_detail_text_container h1
{
text-transform: uppercase;
font-size: 1.75rem;
letter-spacing: 0.125rem;
margin-top: -0.25rem;
}

div.faces_detail_container div.faces_detail_text_container div.faces_detail_text
{
margin-top: 1rem;
}

div.faces_detail_container div.faces_detail_text_container div.faces_detail_text p
{
margin-top: 1rem;
font-size: 1.125rem;
}

div.faces_detail_container div.faces_detail_text_container div.faces_detail_text p:first-of-type
{
margin-top: 0;
}

div#faces_overlay
{
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 1000;
background: rgba(0, 0, 0, 0.85);
}

span#faces_overlay_close
{
position: absolute;
top: 1rem;
right: 1rem;
display: block;
width: 3rem;
height: 3rem;
cursor: pointer;
}

span#faces_overlay_close i
{
font-size: 3rem;
color: #da3c1f;
cursor: inherit;
}

div#faces_overlay div.faces_loading
{
margin-top: 15%;
}

div#faces_overlay div.faces_loading div.faces_loading_item
{
background: #a01623;
}

div#faces_overlay div.faces_loading div.faces_loading_item.active
{
background: #da3c1f;
}

div#faces_detail_container
{
position: fixed;
top: 6rem;
bottom: 6rem;
left: 8rem;
right: 8rem;
max-width: 60rem;
margin: 0 auto;
}

div#faces_detail_container div.faces_detail_container
{
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
max-width: none;
margin: 0;
}

div#faces_detail_container div.faces_detail_container div.faces_detail_image_container
{
width: 35%;
position: relative;
}

div#faces_detail_container div.faces_detail_container div.faces_detail_image_container div.faces_detail_image
{
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
padding: 0;
}

div#faces_detail_container div.faces_detail_container div.faces_detail_text_container
{
display: flex;
flex-direction: column;
flex-wrap: nowrap;
justify-content: flex-start;
align-items: stretch;
}

div#faces_detail_container div.faces_detail_container div.faces_detail_text_container h1
{
color: #da3c1f;
}

div#faces_detail_container div.faces_detail_container div.faces_detail_text_container div.faces_detail_text
{
overflow: hidden;
position: relative;
}

div#faces_detail_container div.faces_detail_container div.faces_detail_text_container div.faces_detail_text p
{
color: #fff;
}

div#fdt_sc
{
width: 100%;
height: auto;
padding-right: 2rem;
z-index: 1000;
}

div#faces_scroll_bar
{
position: absolute;
top: 0.5rem;
bottom: 0.5rem;
right: 1rem;
width: 0.25rem;
background: #fff;
z-index: 2000;
}

div#faces_scroll_bar span
{
position: absolute;
right: -1.375rem;
width: 3rem;
height: 1rem;
line-height: 1rem;
text-align: center;
cursor: pointer;
}

div#faces_scroll_bar span#faces_scroll_up
{
top: -0.5rem;
}

div#faces_scroll_bar span#faces_scroll_down
{
bottom: -0.5rem;
}

div#faces_scroll_bar span#faces_scroll_indicator
{
top: 0.75rem;
cursor: default;
}

div#faces_scroll_bar span i
{
width: inherit;
height: inherit;
line-height: inherit;
font-size: 3rem;
color: #da3c1f;
cursor: inherit;
}

div#faces_scroll_bar span#faces_scroll_indicator i
{
font-size: 1rem;
}

/*new*/
.faces-list.row {
    --bs-gutter-y: 20px;
}

.faces-list .faces-list__item .faces_item {
    display: block;
    margin: 0 !important;
    width: 100% !important;
}

@media (min-width: 374px) and (max-width: 639px) {
    .faces-list .faces-list__item {
        width: 50%;
    }

    .faces-list .faces-list__item .faces_item h2 {
        font-size: 12px !important;
    }
}

@media (min-width: 992px) and (max-width: 1199px) {
    .faces-list .faces-list__item .faces_item h2 {
        font-size: 12px !important;
    }
}

/*detail*/
@media (max-width: 639px) {
    .faces-detail_ajax {
        top: 5rem !important;
        bottom: 1rem !important;
        left: 1rem !important;
        right: 1rem !important;
    }

    .faces-detail_ajax .faces_detail_container {
        flex-direction: column !important;
    }

    .faces-detail_ajax .faces_detail_image_container {
        width: 100% !important;
        margin: 0 0 20px !important;
        height: 250px !important;
    }

    .faces-detail_ajax .faces_detail_text_container {
        width: 100% !important;
        height: calc(100% - 270px) !important;
    }

    .faces-detail_ajax .faces_detail_text_container h1 {
        font-size: 1.4rem;
    }

    .faces-detail_ajax .faces_detail_text {
        flex: 1 1 auto;
        height: 100%;
    }
}

@media (min-width: 640px) and (max-width: 991px) {
    .faces-detail_ajax {
        top: 5rem !important;
        bottom: 2rem !important;
        left: 2rem !important;
        right: 2rem !important;
    }
}
/* End */
/* /faces/style.css?17382291577355 */
