/*
@import url('/templates/47/we2/css/global.css');
@import url('/templates/47/we2/css/typography.css');
@import url('/templates/47/we2/css/fonts.css');
@import url('/templates/47/we2/css/form.css');
@import url('/templates/47/we2/css/modal.css');
@import url('/templates/47/we2/css/nav.css');
@import url('/templates/47/we2/css/table.css');
@import url('/templates/47/we2/css/widgets.css');
@import url('/templates/47/we2/css/grid.css');
*/

/**
  we: design
 */
body {
    -moz-transition: opacity 2s ease-in-out;
    -webkit-transition: opacity 2s ease-in-out;
    -o-transition: opacity 2s ease-in-out;
    transition: opacity 2s ease-in-out;
}

body > .container[data-m-action="ajax_views"] {
    min-height: calc(100vh - 61px);
    align-content: start;
}

.card {
    /*box-shadow: 0 0 1.25rem 0 rgba(0,0,0,.1);*/
    margin-bottom: 1rem;
    border-radius: .625rem;
    background-color: var(--white);
    padding: 1rem;
    position: relative;
}
.card .card-header {
    margin: -1rem -1rem 1rem -1rem;
    border-bottom: solid 1px var(--border-color);
    padding: 1rem;
    font-family: "Montserrat", sans-serif;
    font-weight: 300;
    font-size: 1rem;
    display: flex;
    color: var(--secondary);
}
.card .card-header > a.arrow {
    display: inline-block;
}
.card.sticky {
    position: -webkit-sticky;
    position: sticky;
    display: block;
    z-index: 1;
}
.card.article-sm > .img-wrapper {
    border-radius: .625rem .625rem 0 0;
    margin: -1rem -1rem 0 -1rem;
    padding: 0;
    display: block;
    overflow: hidden;
}
.circle {
    border-radius: 50%;
}
.list-unstyled {
    padding: 0;
    margin: 0;
    list-style: none;
}
.img-fluid {
    max-width: 100%;
    height: auto;
}
.bg-white {
    background-color: var(--white);
}
.bg-primary {
    color: var(--white);
    background-color: var(--primary);
}
.bg-light {
    color: var(--secondary);
    background-color: var(--light);
}
.bg-gray{
    color: var(--secondary);
    background-color: var(--gray);
}
.bg-light-primary {
    color: var(--primary);
    background-color: var(--bg-light-primary);
}
.bg-soft-warning {
    color: #e6a75e;
    background-color: rgba(255,186,104,.2);
}
.text-primary {color: var(--primary)}
.text-secondary {color: var(--secondary)}
.text-gray {color: var(--gray)}
.text-danger {color: var(--danger)}
.text-warning {color: var(--warning)}
.img-thumbnail {
    padding: .25rem;
    border: 1px solid var(--light);
    border-radius: 5px;
    max-width: 100%;
    max-height: 100%;
}
img, svg {vertical-align: middle}
.rounded-circle,.avatar {border-radius: 50%}
.sign-in-from {padding: 0 1rem}
.cookies-policy-notice {
    position: fixed;
    left: 0;
    bottom: 0;
    padding: 0.75rem 0;
    background-color: rgba(255, 255, 255, 0.9);
    color: var(--gray666);
    text-align: center;
    width: 100%;
    line-height: 1.75em;
    font-size: 13px;
    z-index: 1;
}
.cookies-policy-notice .container {
    padding: 0 30px;
}
.cookies-policy-notice .container .btn {
    margin-top: 0;
}
body > .scroll-up {
    z-index: 3;
}
hr {
    margin: 0.5rem 0;
    border: 0;
    color: inherit;
    background-color: var(--secondary);
    height: 1px;
    opacity: .25;
}
hr[data-title] {
    margin: 2rem 0;
    position: relative;
    text-align: center;
    overflow: visible;
}
hr[data-title]:before {
    content: attr(data-title);
    display: inline-block;
    position: absolute;
    line-height: 1em;
    left: 50%;
    transform: translateX(-50%);
    color: var(--black);
    background-color: var(--white);
    padding: 2px 8px;
    margin-top: -0.5rem;
    text-align: center;
    min-width: 65%;
}
ul.social{
    margin:0;
    padding:0;
    display: flex;
    flex-wrap: wrap;
    gap: .625rem;
    justify-content: center;
}
ul.social li{
    list-style: none;
    display: inline-block;
}
ul.social li button{
    height: 2.45rem;
    width: 2.45rem;
    background: rgba(80,181,255,.2);
    color: var(--primary);
    border-radius: 5px;
    padding: 0;
    display: flex;
    justify-content: center;
    align-items: center;
}
ul.social li button:hover{
    text-decoration:none;
    background:rgba(80,181,255,.4);
}
body > .head-app-link {
    position: relative;
    top: 0;
    height: var(--head-height);
    line-height: var(--head-height);
    vertical-align: middle;
    text-align: center;
    background-color: var(--bg-primary);
    width: 100%;
    z-index: 3;
}
body > .head-app-link > a {
    color: var(--white);
    text-decoration: none;
}
body > .head-app-link > a > svg {
    margin-top: -4px;
}

*.loading,
body.loading
{
    position: relative;
}
body.loading {
    cursor: wait;
    pointer-events: none;
    opacity: 0.5;
    overflow: hidden;
    width: 100%;
    height: 100vh;
    position: fixed;
}
.loading:not(body):before
{
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-color: var(--white);
    opacity: 0.35;
    z-index: 2;
    cursor: wait;
    visibility: visible;
}
body.loading:before {
    display: none;
}
*.loading:after,
body.loading:after {
    content: '';
    width: 50px;
    height: 50px;
    position: absolute;
    display: inline-block;
    z-index: 3;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-color: var(--gradient2);
    border-radius: 100%;
    -webkit-animation: loading 1.0s infinite ease-in-out;
    animation: loading 1.0s infinite ease-in-out;
}
body.loading:after,
div.container.loading:after {
    position: fixed;
}
body.loading:after {
    width: 100px;
    height: 100px;
    position: fixed;
}
@-webkit-keyframes loading {
    0% {
        -webkit-transform: translate(-50%, -50%) scale(0);
        transform: translate(-50%, -50%) scale(0);
        background-color: var(--gradient2);
    }
    100% {
        -webkit-transform: translate(-50%, -50%) scale(1.0);
        transform: translate(-50%, -50%) scale(1.0);
        opacity: 0;
        background-color: var(--gradient1);
    }
}

@keyframes loading {
    0% {
        -webkit-transform: translate(-50%, -50%) scale(0);
        transform: translate(-50%, -50%) scale(0);
    } 100% {
          -webkit-transform: translate(-50%, -50%) scale(1.0);
          transform: translate(-50%, -50%) scale(1.0);
          opacity: 0;
      }
}

/**
 * Circles
 */
.circles {
    position: absolute;
    z-index: -1;
    transform: translate(-50%, -50%) scale(1);
    -moz-transition: transform 1s ease-in-out;
    -webkit-transition: transform 1s ease-in-out;
    -o-transition: transform 1s ease-in-out;
    transition: transform 1s ease-in-out;
}
.circles div {
    counter-increment: item;
    width: 0;
    height: 0;
    padding-bottom: 0;
    position: absolute;
    background-color: var(--white);
    border-radius: 50%;
    z-index: 0;
    left: 0%;
    top: 50%;
    transform: translate(-50%, -50%);
    opacity: .06;
}
.circles div:nth-child(1) {
    width: 250px;
    padding-bottom: 250px;
}
.circles div:nth-child(2) {
    width: 450px;
    padding-bottom: 450px;
}
.circles div:nth-child(3) {
    width: 650px;
    padding-bottom: 650px;
}
.circles div:nth-child(4) {
    width: 850px;
    padding-bottom: 850px;
}
.circles div:nth-child(5) {
    width: 1050px;
    padding-bottom: 1050px;
}
.circles div:nth-child(6) {
    width: 1250px;
    padding-bottom: 1250px;
}
.circles div:nth-child(7) {
    width: 1450px;
    padding-bottom: 1450px;
}
.circles div:nth-child(8) {
    width: 1650px;
    padding-bottom: 1650px;
}
.circles div:nth-child(9) {
    width: 1850px;
    padding-bottom: 1850px;
}
.circles div:nth-child(10) {
    width: 2050px;
    padding-bottom: 2050px;
}



/**
 * Sign-in page
 */
.sign-in-page{
    min-height: calc(100vh - var(--head-height));
    background: var(--primary);
    background: var(--main-gradient);
    position:relative;
    height:100%;
    width:100%;
    margin:0 auto;
    padding:0 auto;
    overflow: hidden;
}

.sign-in-page > .container {
    height: 100%;
    min-height: calc(100vh - var(--head-height));
}
.sign-in-page > .container > div:nth-child(1) {
    z-index: 1;
}
.sign-in-page > .container > div:nth-child(2) {
    z-index: 0;
}

.sign-in-page #form-block + .circles {
    right: 50%;
    bottom: 50%;
}
.sign-in-page #form-block:hover + .circles {
    transform: translate(-50%, -50%) scale(1.05);
}

/**
 * Article
 */
.inner-block.article {
    background-color: var(--white);
    border-radius: 0.625rem;
    padding: 1rem;
    margin-bottom: 1rem;
}

/**
 * Breadcrumbs
 */
.container > .breadcrumbs {
    padding: 15px .625rem;
}

.container > h1,
.container > h2
{
    display: block;
    width: 100%;
}
.container > .pagination {
    display: block;
    width: 100%;
    padding: 15px .625rem;
}

/**
 * Container links - inner navigation -  flex-box in feed, friends, settings
 */
.container-links {
    display: flex;
    width: 100%;
    flex: 0 0 100%;
    margin: 2rem 0;
    gap: 1rem;
    flex-wrap: wrap;
}
.container-links > .btn {
    border-radius: 50rem;
    padding: 0 .75rem;
    background-color: var(--white);
    color: var(--secondary);
    border: none;
    display: flex;
    align-items: center;
    gap: 0.25rem;
}
.container-links > .btn.active {
    color: var(--white);
    background-color: var(--primary);
    /*border-color: var(--primary);*/
}
.container-links > .btn svg {
    display: none;
}
.container-links + a.card.bg-light-primary[href^="https://send.monobank.ua/"] {
    position: sticky;
    top: var(--head-height);
    z-index: 1;
}
a.card.sticky.bg-light-primary[href^="https://send.monobank.ua/"] {
    top: var(--head-height);
    z-index: 1;
}
a.card.bg-light-primary[href^="https://send.monobank.ua/"] i.close {
    position: absolute;
    right: 1rem;
    top: 1rem;
}
div#interests-bar {
    z-index: 1;
    top: var(--head-height);
    max-height: calc(100vh - var(--head-height));
    margin-bottom: 1rem;
}
div#interests-bar .card,
div#interests-bar .alert
{
    margin-bottom: 0;
}
div#interests-bar > .alert {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    width: 100%;
    background-color: #ddf7f3;
}
div#interests-bar > .card.bg-light-primary {
    animation: shadow-pulse-light-primary 1.5s 7;
}
body.dark div#interests-bar > .alert {
    background-color: #214148;
}
body.dark div#interests-bar > .card.bg-light-primary {
    animation: shadow-pulse-dark-light-primary 1.5s 7;
}
div#interests-bar .card i.close {
    position: absolute;
    right: 1rem;
    top: 1rem;
}
div#interests-bar .card > form {
    display: none;
}
div#interests-bar.active .card.bg-light-primary {
    background-color: var(--white);
    color: var(--black);
}
div#interests-bar.active .card > form {
    display: block;
    margin-top: 1rem;
}
div#interests-bar .card > form > div.interests-wrapper {
    overflow-y: auto;
    overflow-x: hidden;
    max-height: calc(100vh - var(--head-height) - 11rem);
    -ms-overflow-style: none;
    scrollbar-width: none;
}
.card.items-list > .card-header + div::-webkit-scrollbar
{
    display: none;
}
/* One-line interests row */
div#interests-bar > .card > a {
    text-overflow: ellipsis;
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    padding-right: 1rem;
}
i.close {
    cursor: pointer;
    opacity: 0.5;
    -moz-transition: opacity .25s ease-in-out;
    -webkit-transition: opacity .25s ease-in-out;
    -o-transition: opacity .25s ease-in-out;
    transition: opacity .25s ease-in-out;
}
i.close:hover {
    opacity: 1;
}

/**
 * List of items on Profile & Feed pages
 */
.card.items-list > a,
.card.items-list > .card-header + div > a
{
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    /*align-items: start;*/
    margin-bottom: 1.5rem;
    border-radius:.625rem;
    color: var(--dark);
    -moz-transition: color .25s ease-in-out;
    -webkit-transition: color .25s ease-in-out;
    -o-transition: color .25s ease-in-out;
    transition: color .25s ease-in-out;
}
.card.items-list > a:last-child,
.card.items-list > .card-header + div > a:last-child
{
    margin-bottom: 0;
}
.card.items-list > a:hover,
.card.items-list > .card-header + div > a:hover
{
    color: var(--black);
}
.card.items-list a > span {
    flex: 1;
    font-family: "Montserrat", sans-serif;
    font-weight: 300;
    font-size: 1rem;
}
.card.items-list a > span small {
    display: block;
    margin-top: .25rem;
    font-size: .75em;
    opacity: 0.85;
}
.card.items-list > .card-header + div > a > img {

}
.card.items-list#friends-card > a,
.card.items-list#friends-card > .card-header + div > a
{
    align-items: center;
    margin-bottom: 1rem;
}
.card.items-list > .card-header + div
{
    max-height: 500px;
    overflow-y: auto;
    -ms-overflow-style: none;
    scrollbar-width: none;
}
.card.items-list > .card-header + div::-webkit-scrollbar
{
    display: none;
}

/**
 * Footer
 */
footer {
    background-color: #353a40;
    position: relative;
    z-index: 0;
    padding-bottom: 3rem;
    padding-top: 3rem;
    color: var(--white);
    text-align: center;
}
/*
footer .container {
    padding: 0 1.25rem;
}
*/
footer ul {
    list-style: none;
    margin: 0;
    padding: 0;
}
footer ul li {
    margin-bottom: .625rem
}
footer p,
footer a {
    color: var(--gray);
    text-decoration: none;
    font-family: "Montserrat", sans-serif;
    font-weight: 400;
}
footer a:hover {
    color: var(--white);
    text-decoration: none;
}
body.dark footer a:hover {
    color: var(--black);
}
footer a > svg {
    margin-right: 5px;
}
footer .h5 {
    margin-bottom: 1.5rem;
    margin-top: 1rem;
}
body > .container.container-xl + footer > .container {
    max-width: 75rem;
}


/**
 * Post items
 */

.card.post .dropdown .dropdown-toggle + .dropdown-menu {
    right: 0;
}
.card.post > iframe[allowfullscreen] {
    margin: 0 -1rem;
    width: calc(100% + 2rem);
}
.card.post > div[data-m-action="youtube_embed"] {
    margin: 0 -1rem;
    width: calc(100% + 2rem);
    min-height: 240px;
}

.card.post > iframe[allowfullscreen].short {
    height: calc(100vh - 75px);
}
.card.post > .post {
    border-left: 0;
    border-right: 0;
    padding: 1rem 1rem 0 1rem;
    border-radius: 0;
    overflow: hidden;
    background-color: var(--bg-light-gray);
    margin: 0 -1rem;
}
/*
.card.post > .card.post + .comment-area.border-top,
.card.post > .post-gallery + .comment-area.border-top,
.card.post > .user-post + iframe + .comment-area.border-top
{
    border: none !important;
    margin-top: 0 !important;
}
*/
.card.post .post-poll .post-poll-options {
    margin-bottom: 0.5rem;
}
.card.post .post-poll.two-images .post-poll-options {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    position: relative;
}
.card.post .post-poll.two-images .post-poll-options:after {
    content: 'VS';
    display: inline-block;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background-color: var(--white);
    font-size: 1.25em;
    text-align: center;
    line-height: 40px;
    vertical-align: center;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -100%);
    z-index: 1;
}
.card.post .post-poll > div.d-flex:nth-child(1) {
    flex-wrap: wrap;
}
.card.post .post-poll-option {
    margin-bottom: 8px;
}
.card.post .post-poll.two-images .post-poll-options > .post-poll-option {
    width: calc(50% - 0.25rem);
    margin: 0;
}
.card.post .post-poll label {
    background-color: var(--bg-default);
    padding: 0.5rem;
    cursor: pointer;
    width: 100%;
    border-radius: 5px;
    position: relative;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.card.post .post-poll label[data-percents=""] > i {
    display: none;
}
.card.post .post-poll label[data-percents]:not([data-percents=""]) > i {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    height: 4px;
    background-color: var(--primary);
    opacity: 0.5;
}
.card.post .post-poll input[type="radio"],
.card.post .post-poll input[type="checkbox"]
{
    cursor: pointer;
    line-height: 1rem;
    height: 1rem;
    align-self: center;
}
.card.post .post-poll label:hover,
.card.post .post-poll label:focus,
.card.post .post-poll input:checked + label
{
    background-color: var(--light-primary);
    color: var(--primary);
}
.card.post .post-poll input:checked + label:before
{
    content: '';
    position: static;
    display: inline-block;
    width: 20px;
    min-width: 20px;
    height: 20px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512' height='20'%3E%3Cpath fill='%23156DB7' d='M504 256c0 136.967-111.033 248-248 248S8 392.967 8 256 119.033 8 256 8s248 111.033 248 248zM227.314 387.314l184-184c6.248-6.248 6.248-16.379 0-22.627l-22.627-22.627c-6.248-6.249-16.379-6.249-22.628 0L216 308.118l-70.059-70.059c-6.248-6.248-16.379-6.248-22.628 0l-22.627 22.627c-6.248 6.248-6.248 16.379 0 22.627l104 104c6.249 6.249 16.379 6.249 22.628.001z'%3E%3C/path%3E%3C/svg%3E");
    background-repeat: no-repeat;
    /*top: 50%;*/
    /*right: 0.5rem;*/
    /*transform: translateY(-50%);*/
    /*opacity: 0.5;*/
    order: 4;
    margin-left: 0.5rem;
}
.card.post .post-poll input:disabled + label {
    opacity: 0.6;
}
.card.post .post-poll input:disabled:checked + label {
    opacity: 1;
}
.card.post .post-poll label img {
    margin: -0.5rem 0.5rem -0.5rem -0.5rem;
    max-width: 140px;
}
.card.post .post-poll.two-images .post-poll-options > .post-poll-option label {
    flex-wrap: wrap;
}
.card.post .post-poll.two-images .post-poll-options > .post-poll-option label img {
    max-width: calc(100% + 1rem);
    width: calc(100% + 1rem);
    margin: -0.5rem -0.5rem 0.5rem -0.5rem;
}
.card.post .post-poll.two-images .post-poll-options > .post-poll-option input:checked + label:before
{
    transform: none;
    position: static;
    order: 4;
    margin-left: 0.5rem;
}
.card.post .post-poll .winners-grid {
    display: grid;
    grid-gap: 10px;
    grid-template-columns: repeat(auto-fit, minmax(40px, 60px));
    list-style: none;
    padding: 0;
    margin: 0;
}
.card.post .post-poll .winners-grid li {
    text-align: center;
}
.card.post .post-poll .winners-grid li h6 {
    font-size: 0.8em;
}
.card.post .post-poll .winners-grid li h6 {
    font-size: 0.8em;
}
.card.post .post-poll .post-poll-option .poll-percent {
    font-size: 0.9em;
    opacity: 0.75;
    margin-left: auto;
}
.post > div:nth-child(1) {
    display: flex;
    color: var(--dark);
    font-weight: 300;
    align-items: start;
    margin-bottom: 0.25rem;
}
.card.post a:hover {
    color: var(--dark);
    text-decoration: none;
}
.post > div:nth-child(1) a {
    /*color: inherit;*/
}
.post > div:nth-child(1) > a + div {
    width: 100%;
    list-style: none;
    margin: 0 0 0 .625rem;
    padding: 0;
}
.post > div:nth-child(1) > a + div > div {
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-between;
    list-style: none;
    padding: 0;
}
.post > div:nth-child(1) > a + div > div .h5 {
    padding: 0;
    width: auto;
    margin-bottom: 0.3125rem;
    color: var(--dark);
}
.card.post a.h4 {
    font-weight: 400;
}
.card.post .img-wrapper{
    margin-left: -1rem;
    margin-right: -1rem;
    min-width: calc(100% + 2rem);
    position: relative;
    z-index: 0;
    display: block;
}
.card.post .img-wrapper:before {
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: var(--black);
    opacity: 0;
    -moz-transition: opacity .25s ease-in-out;
    -webkit-transition: opacity .25s ease-in-out;
    -o-transition: opacity .25s ease-in-out;
    transition: opacity .25s ease-in-out;
}
.card.post .img-wrapper:hover:before {
    opacity: 0.25;
}
.card.post .img-wrapper > img {
    width: 100%;
    height: auto;
}
.card.post .img-wrapper > button,
.card.post .img-wrapper > .btn
{
    font-size: 0.9em;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 1;
    background-color: var(--primary);
    color: var(--white);
    display: none;
    height: auto;
    line-height: 1rem;
    min-height: auto;
    padding: 1rem;
    white-space: nowrap;
}
.card.post .img-wrapper > button.active,
.card.post .img-wrapper > .btn.active
{
    display: inline-block;
    opacity: 0.9;
}
.card.post .img-wrapper:hover > button,
.card.post .img-wrapper:hover > .btn
{
    display: inline-block;
    opacity: 1;
}
.card.post ul.post-gallery {
    display: grid;
    grid-gap: 1px;
    grid-template-columns: repeat(auto-fit,minmax(120px,1fr));
    /*margin: 0.3125rem 0 0.5rem 0;*/
    margin: 0.3125rem -1rem 0.5rem -1rem;
}
.card.post ul.post-gallery li {
    position: relative;
}
body:not(.dark) .card.post ul.post-gallery li {
    background-color: var(--dark);
}
.card.post ul.post-gallery img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    cursor: pointer;
}
.card.post ul.post-gallery li:first-child:last-child > img {
    pointer-events: none;
    cursor: default;
}


.card .options {
    margin: .625rem -10px -10px -10px;
    /*padding-top: .625rem;*/
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}
.card .item-description {
    margin-bottom: 1rem;
    color: var(--dark);
    overflow-wrap: break-word;
    word-wrap: break-word;
    -ms-word-break: break-all;
    word-break: break-all;
    word-break: break-word;
    max-height: 8em;
    overflow: hidden;
    -moz-transition: all .25s ease-in-out;
    -webkit-transition: all .25s ease-in-out;
    -o-transition: all .25s ease-in-out;
    transition: all .25s ease-in-out;
    text-align: justify;
    position: relative;
    /*text-overflow: ellipsis;*/
    text-overflow: "\n...More";
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
    text-align-last: left;
}
.card .item-description:focus,
.card .item-description.full
{
    max-height: 80000em;
    -webkit-line-clamp: 40000;
}
.card .item-description:after{
    content: "";
    display: inline;
    width: 100%;
}
/*
.card .item-description > div + .more {
    cursor: pointer;
    color: var(--dark);
    font-weight: 600;
    -moz-transition: color .25s ease-in-out;
    -webkit-transition: color .25s ease-in-out;
    -o-transition: color .25s ease-in-out;
    transition: color .25s ease-in-out;
}
.card .item-description > div + .more:hover {
    color: var(--dark);
}
*/
.card .item-description a[href] {
    text-decoration: underline;
    color: var(--black);
}
.card .item-description a[href]:hover {
    text-decoration: underline;
}
/*
.card .item-description.full > div {
    max-height: 50000px;
}
.card .item-description.full > div + .more {
    display: none !important;
}
*/
.card .item-description h2 {
    font-size: 1.225rem;
}
.card .item-description h3 {
    font-size: 1.2rem;
}
.card .item-description h4 {
    font-size: 1rem;
}
.card .item-description span.ai {
    color:#99703e;
    background-color:#feba6836;
    padding: 0 6px;
    border-radius: 4px;
    vertical-align: middle;
    display: inline-block;
    margin-right: 6px;
}

.card.reels {
    position: relative;
    max-height: calc(100vh - 80px);
    overflow: hidden;
    width: auto;
    display: inline-block;
    transform: translateX(-50%);
    left: 50%;
    min-width: 51%;
    min-height: 33vh;
    padding: 0;
}
.card.reels:after {
    /*content: "\a";*/
    /*white-space: pre;*/
}
.card.reels ul.post-gallery {
    display: grid;
    grid-gap: 10px;
    grid-template-columns: repeat(auto-fit,minmax(120px,1fr));
    margin: -1rem;
}
.card.post video {
    width: auto;
    max-height: calc(100vh - 70px);
    display: block;
    max-width: 100%;
    margin: 0 auto;
}
.card.reels .item-description {
    content: '';
    display: inline-block;
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1;
    padding: 1rem 1rem 3rem 1rem;
    color: #fff;
    margin: 0;
    text-shadow: 0 0 1px #000;
    height: auto;
    background: rgba(0, 0, 0, 0.25);
    background: linear-gradient(0deg, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0) 100%);
}
.card.reels .item-description > div {
    padding: 0;
    max-height: 3rem;
    overflow: hidden;
    -moz-transition: max-height 0.25s ease-in-out;
    -webkit-transition: max-height 0.25s ease-in-out;
    -o-transition: max-height 0.25s ease-in-out;
    transition: max-height 0.25s ease-in-out;
}
.card.reels .item-description a {
    color: inherit;
}
.card.reels .item-description:hover > div {
    max-height: 6rem;
    overflow-y: auto;
    -ms-overflow-style: none;
    scrollbar-width: none;
}
.card.post.reels > div:nth-child(1) > a + div > div .h5 {
    color: #fff;
}
.card.post.reels > div:nth-child(1) a {
    color: inherit;
}
.card.post.reels .item-description > div {
    text-align: center;
    font-size: 1.15em;
}
.card.post.reels .item-description .h5 {
    font-size: 1.25em;
    text-align: center;
    margin-bottom: 0.5rem;
    text-align-last: center;
}
.card.reels > div:nth-child(1) {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    width: 100%;
    display: flex;
    padding: 1rem;
    color: #fff;
    right: 0;
    background: rgba(0, 0, 0, 0.25);
    background: linear-gradient(0deg,rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.75) 100%);
}
.card.reels .options {
    position: absolute;
    min-width: 40px;
    height: auto;
    display: flex;
    gap: 1rem;
    border-radius: 20px;
    right: 1rem;
    bottom: 6rem;
    z-index: 2;
    transform: translateY(-50%);
    background: rgba(0, 0, 0, 0.25);
}
.card.reels .options > .comments,
.card.reels .options > .comment-form
{
    display: none;
}
.card.reels .options > .share button.icon:before {
    background-image: url(/application/we/modules/social/client/img/share.white.svg);
}
.card.reels .options > .emotions i.e
{
    color: #d3d3d3;
}
.card.reels .options > .emotions i._
{
    color: #fff;
}
.card.reels .options > .emotions:hover i {
    color: #777;
}

form.card .user-post {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-top: 0.5rem;
}
form.card .user-post input[name="post[title]"] {
    width: auto;
    flex-grow: 1;
}
form.card .user-post select[name="post[category]"] {
    -webkit-appearance: none;
    -moz-appearance: none;
    text-indent: 1px;
    text-overflow: '';
}
form.card .user-post select[name="post[category]"]::-ms-expand {
    display: none;
}
form.card .user-post select[name="post[category]"]:invalid {
    color: var(--secondary);
}
form.card .source-buttons:not(.hidden) {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
    width: 100%;
}
form.card .source-buttons:not(.hidden) > * {
    flex-grow: 1;
    text-align: center;
    max-width: calc(50% - 0.25rem);
}
form.card .source-buttons:not(.hidden) + .post-form-footer > a.source-link {
    display: none;
}
form.card .source-buttons.hidden + p {
    display: block;
    margin: 0.5rem 0 0 0;
}
form.card .source-buttons + p a {
    color: var(--secondary);
}
form.card .source-buttons + .alert {
    margin-top: 1rem;
}
form.card .btn-sm {
    padding: 0 10px;
}
form.card#post-form {
    padding: 0.5rem 1rem;
}
form.card.sticky#post-form {
    top: var(--head-height);
}
form.card#post-form:not(.sticky) i.close {
    display: none;
}
form.card#post-form .btn.btn-light {
    background-color: var(--bg-input);
}
form.card#post-form .btn.btn-light:hover {
    background-color: var(--bg-input-hover);
}
.post-form-header {
    display: flex;
    justify-content: left;
    align-items: center;
    gap: 0.5rem;
}
.post-form-header > div {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.5rem;
    color: var(--secondary);
    flex-grow: 1;
}
.post-form-header i.close {
    margin-left: auto;
}
form.card#post-form .post-form-header input[type="radio"] {
    display: none;
}
form.card#post-form .post-form-header input[type="radio"] + label.btn.btn-light {
    padding: 0 7px;
}
form.card#post-form .post-form-header input[type="radio"]:checked + label.btn.btn-light {
    color: var(--primary);
    background-color: var(--bg-light-primary);
}
form.card#post-form .alert {
    text-align: center;
}
.post-form-footer {
    display: flex;
    justify-content: left;
    align-items: center;
    gap: 0.5rem;
    margin: 0.5rem 0;
    flex-wrap: wrap;
}
#post-form .post-form-footer button[type="submit"]:before {
    content: attr(data-publish);
}
#post-form .post-form-footer > a.source-link {
    color: var(--secondary);
    margin-bottom: 0.5rem;
}
#post-form .post-form-footer > a.source-link + div {
    display: flex;
    gap: 0.5rem;
}
#post-form.delayed .post-form-footer button[type="submit"]:before {
    content: attr(data-save);
}
#post-form #post-form-delay {
    display: none;
}
/*
#post-form.delayed #post-form-delay {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    color: var(--secondary);
}
*/
#post-form .post-form-footer input[name^="future"] {
    margin: 0;
    width: auto;
}
#post-form:not(.delayed) .post-form-footer input[name^="future"] {
    display: none;
}
#post-form.delayed button.delayed-btn {
    display: none;
}
#post-form #post-poll {
    width: 100%;
}
#post-form #post-poll.hidden {
    display: none;
}
#post-form #post-poll .row:not(:last-child) {
    display: flex;
    position: relative;
    margin: 0 0 0.5rem 0;
}
#post-form #post-poll .row > label.btn[for^="photo"] {
    order: 1;
    padding: 0 8px;
    background-color: var(--bg-input);
    color: var(--secondary);
    width: 40px;
    min-width: 40px;
    text-align: center;
    background-size: cover;
    background-position: center center;
}
#post-form #post-poll .row > label.btn[for^="photo"][style^="background-image"] > svg {
    display: none;
}
#post-form #post-poll .row > input[type="text"] {
    order: 2;
    margin: 0;
}
#post-form #post-poll .row > label.btn.checkbox:before,
#post-form #post-poll .row > label.btn.checkbox:after
{
    content: '';
    display: none;
}
#post-form #post-poll .row > input[type="checkbox"] + label.btn.checkbox {
    background-color: var(--bg-input);
    padding: 0 10px;
    width: 40px;
    height: 40px;
    margin: 0;
    color: var(--gray);
    order: 3;
    display: flex;
    justify-content: center;
    align-items: center;
}
#post-form #post-poll .row > input[type="checkbox"]:checked + label.btn.checkbox {
    color: var(--primary);
    background-color: var(--bg-light-primary);
}
#post-form #post-poll .row > .btn.delete {
    padding: 0 8px;
    width: 40px;
    height: 40px;
    background-color: var(--bg-input);
    order: 4;
}
#post-form #post-poll .btn.plus {
    padding: 0 8px;
    background-color: var(--bg-input);
    width: 40px;
    height: 40px;
    text-align: center;
}
#modal-form-photos label.modal-upload-photos {
    display: flex;
    height: 80px;
    justify-content: center;
    align-items: center;
    background-color: var(--bg-input);
    gap: 1rem;
    color: var(--secondary);
    border-radius: 0.625rem;
    margin: 0 0 1rem 0;
    border: solid 1px var(--light);
    cursor: pointer;
}
#modal-form-photos label.modal-upload-photos:hover {
    border: solid 1px var(--gray);
}
#modal-form-photos button.btn.absolute {
    position: fixed;
    bottom: 4rem;
    z-index: 2;
    left: 50%;
    transform: translateX(-50%);
}
#post-form .user-post + ul.post-gallery li {
    position: relative;
}
#post-form .advertisement-fields:not(.hidden) {
    position: relative;
    display: grid;
    gap: 0.5rem;
    width: 100%;
    grid-template-columns: auto auto 90px;
}
#post-form .advertisement-fields .btn.btn-light {
    padding: 0.5rem;
    line-height: 20px;
    /*text-align: center;*/
}

ul.post-gallery {
    display: grid;
    grid-gap: 10px;
    grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
    margin-bottom: 1rem;
}
ul.post-gallery li input[type="checkbox"] + label {
    position: relative;
    overflow: hidden;
    cursor: pointer;
    display: flex;
}
ul.post-gallery li input[type="checkbox"] + label:before {
    content: '';
    display: block;
    padding-top: 100%;
    width: 100%;
    height: 100%;
}
ul.post-gallery li input[type="checkbox"]:checked + label:before {
    content: '';
    /*position: absolute;*/
    /*left: 0;*/
    /*top: 0;*/
    background-color: var(--black);
    opacity: 0.6;
    z-index: 2;
}
ul.post-gallery li input[type="checkbox"]:checked + label:after {
    content: '';
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 40px;
    height: 40px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512' height='40'%3E%3Cpath fill='%23ffffff' d='M504 256c0 136.967-111.033 248-248 248S8 392.967 8 256 119.033 8 256 8s248 111.033 248 248zM227.314 387.314l184-184c6.248-6.248 6.248-16.379 0-22.627l-22.627-22.627c-6.248-6.249-16.379-6.249-22.628 0L216 308.118l-70.059-70.059c-6.248-6.248-16.379-6.248-22.628 0l-22.627 22.627c-6.248 6.248-6.248 16.379 0 22.627l104 104c6.249 6.249 16.379 6.249 22.628.001z'/%3E%3C/svg%3E");
    opacity: 0.9;
    z-index: 3;
}
ul.post-gallery li input[type="checkbox"] + label > img {
    position: absolute;
    object-fit: cover;
    width: 100%;
    height: 100%;
    z-index: 1;
}


ul.post-gallery li .preview-container {
    position: relative;
    background-position: center center;
    background-size: cover;
    overflow: hidden;
    align-items: center;
    display: flex;
    justify-content: center;
}
ul.post-gallery li .preview-container:before {
    content: '';
    display: block;
    padding-top: 100%;
}
ul.post-gallery li .preview-container i.cancel,
#post-form .user-post + ul.post-gallery li a[data-m-action="modal_photo"] + i.cancel
{
    content: '';
    display: inline-block;
    position: absolute;
    width: 18px;
    height: 18px;
    background-color: rgba(255, 255, 255, 0.5);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32' height='14'%3E%3Cpath fill='%23666666' d='M 7.21875 5.78125 L 5.78125 7.21875 L 14.5625 16 L 5.78125 24.78125 L 7.21875 26.21875 L 16 17.4375 L 24.78125 26.21875 L 26.21875 24.78125 L 17.4375 16 L 26.21875 7.21875 L 24.78125 5.78125 L 16 14.5625 Z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center center;
    cursor: pointer;
    top: 5px;
    right: 5px;
    border-radius: 50%;
}
ul.post-gallery li .preview-container img {
    position: absolute;
    object-fit: cover;
    width: 100%;
    height: 100%;
}
ul.post-gallery li .preview-container progress[value] {
    position: absolute;
    left: 0;
    bottom: 0;
    height: 8px;
    -webkit-appearance: none;
    appearance: none;
    border-radius: 0;
    background: var(--bg-input);
    color: var(--primary);
    width: 100%;
    opacity: 0.9;
    padding: 0;
    margin: 0;
    border: none;
}
ul.post-gallery li .preview-container progress[value="100"] {
    color: var(--success);
}
ul.post-gallery li .preview-container progress[value]::-webkit-progress-value {
    background: var(--primary);
}
ul.post-gallery li .preview-container progress[value]::-moz-progress-bar
{
    background: var(--primary);
}
ul.post-gallery li .preview-container progress[value="100"]::-webkit-progress-value
{
    background: var(--success);
    background-color: var(--success);
    color: var(--success);
}
ul.post-gallery li .preview-container progress[value="100"]::-moz-progress-bar
{
    background: var(--success);
}



.iq-edit-profile .nav-link{
    padding:20px 15px;
    border-radius:0;
    text-align:center;
    font-size:16px;
}
.iq-edit-profile.nav-pills .nav-link.active{
    color:var(--white);
    background:var(--primary)
}
.iq-edit-profile.nav-pills .show>.nav-link{
    color:var(--white);
    background:var(--primary)
}
ul.iq-edit-profile li:first-child a{
    border-radius:5px 0 0 5px;
    border-left:none
}
ul.iq-edit-profile li:last-child a{
    border-radius:0 5px 5px 0
}

.dropdown {position: relative}
.dropdown-menu {
    position: absolute;
    z-index: 1000;
    display: none;
    min-width: 10rem;
    padding: 0 0;
    margin: 0;
    font-size: .875rem;
    color: var(--secondary);
    text-align: left;
    list-style: none;
    background-color: var(--bg-default);
    background-clip: padding-box;
    border-radius: .625rem;
    -webkit-animation: fade .4s ease forwards;
    animation: fade .4s ease forwards;
    overflow: hidden;
}
.dropdown-toggle {
    white-space: nowrap;
}
.card.post .dropdown .dropdown-toggle + .dropdown-menu {
    right: 0;
}
.dropdown .dropdown-toggle:hover + .dropdown-menu,
.dropdown .dropdown-toggle:focus + .dropdown-menu,
.dropdown .dropdown-toggle + .dropdown-menu:hover {
    display: block;
}
.dropdown-menu .dropdown-item {
    display: flex;
    width: 100%;
    padding: 1rem 0.75rem;
    clear: both;
    font-weight: 400;
    text-align: inherit;
    white-space: nowrap;
    background-color: transparent;
    border: 0;
    border-bottom-width: 0px;
    border-bottom-style: none;
    border-bottom-color: currentcolor;
    gap: 0.5rem;
    align-items: center;
}
.dropdown-menu .dropdown-item:hover {
    color: var(--dark);
    background-color: var(--bg-input-hover);
}

/**
 * Post option menu with 3 dots icon
 */
.post-options {
    position: relative;
}
.post-options > svg {
    display: inline-block;
    width: 22px;
    height: 22px;
    opacity: 0.5;
    -moz-transition: all 0.25s ease-in-out;
    -webkit-transition: all 0.25s ease-in-out;
    -o-transition: all 0.25s ease-in-out;
    transition: all 0.25s ease-in-out;
    cursor: pointer;
}
.post-options > svg:hover {
    opacity: 1;
    transform: rotate(90deg);
}
.post-options > svg + div {
    display: none;
    position: absolute;
    right: 0;
    background-color: var(--bg-default);
    font-size: .875rem;
    border-radius: .625rem;
    overflow: hidden;
    -webkit-animation: fade .4s ease forwards;
    animation: fade .4s ease forwards;
    z-index: 2;
    width: auto;
    /*min-width: 240px;*/
    margin-top: -0.125rem;
}
.post-options > svg:hover + div,
.post-options > svg + div:hover
{
    display: block;
}
.post-options > div > a {
    display: flex;
    width: 100%;
    padding: 1rem 0.75rem;
    gap: 0.5rem;
    justify-content: start;
    align-items: center;
    white-space: nowrap;
}
.post-options > div > a:hover {
    color: var(--dark);
    background-color: var(--bg-input-hover);
}
.post-options > div > a:not(:last-child) {
    border-bottom: 1px solid rgba(0,0,0,.05);
}


/**
 * Alerts
 */
.alert{
    position:relative;
    padding:1rem 1rem;
    margin-bottom:1rem;
    border: none;
    border-radius:5px;
    text-align: center;
}
.alert i {cursor: pointer}
.alert pre
{
    display: inline;
    word-break: break-all;
    background-color: var(--bg-input);
}
.alert-dismissible{
    padding-right:3.75rem
}
.alert-dismissible .btn-close{
    position:absolute;
    top:0;
    right:0;
    z-index:2;
    padding:1.5625rem 1.25rem
}
.alert-primary{
    color: var(--primary);
    background-color: var(--bg-light-primary);
}
.alert-primary a {
    color: #26577a
}
.alert-success,
.bg-success
{
    color:#1b7b6b;
    background-color: #2dcdb229;
}
.alert-success a {
    color:#166256
}
.alert-info,
.bg-info
{
    color:var(--info);
    background-color:#d592fe2b;
}
.alert-info a,
.card.bg-info a
{
    color: inherit;
}
.alert-warning,
.alert-notice,
.bg-warning
{
    color:#99703e;
    background-color:#feba6836;
}
.alert-warning a,
.alert-notice a
{
    color:#7a5a32
}
.alert-danger,
.bg-danger
{
    color:#bb5948;
    background-color:#fe9a8a38;
}
.alert-danger a{
    color:#7a4a42
}
.container > .alert {
    display: flex;
    width: 100%;
    flex: 0 0 100%;
    align-items: center;
    justify-content: center;
}


ul.channels-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 1.75rem;
}
ul.channels-list li {
    display: flex;
}
ul.channels-list li > span {
    margin-left: 1rem;
}
ul.channels-list li > span .h5 {
    padding: 0;
}
ul.channels-list li > span small {
    color: var(--secondary);
}
.m-dateranges {
    width: 100%;
    margin-bottom: 20px;
}
.m-dateranges .m-calendar {
    width: 100% !important;
    padding: 0;
    margin: 0;
}
.m-dateranges .m-calendar > li:nth-child(1) > select:nth-child(2) {
    min-width: 56px;
    width: calc(100%/7*2 - 4px);
}
.m-dateranges .m-calendar > li:nth-child(1) > select:nth-child(3) {
    min-width: 86px;
    width: calc(100%/7*3 - 4px);
}
.m-dateranges .m-calendar > li:nth-child(3) > button,
.m-dateranges .m-calendar > li:nth-child(2) > span,
.m-dateranges .m-calendar > li:nth-child(1) > i,
.m-dateranges .m-calendar > li:nth-child(2) > b {
    min-width: 26px;
    width: calc(100%/7 - 4px);
}
.m-dateranges .m-calendar > li:nth-child(3) > i,
.m-dateranges .m-calendar > li:nth-child(3) > span {
    min-width: 30px;
    width: calc(100%/7);
}

/**
 * Closest events widget
 */
.closest-events > a {
    margin-bottom: 1.5rem;
    display: flex;
    gap: .625rem;
    width: 100%;
    text-align: left;
}
.closest-events > a:hover {
    text-decoration: none;
}
.closest-events > a > div {
    width: 100%;
}
.closest-events > a p {
    margin: 0;
}
.closest-events > a .img-thumbnail {
    max-height: 130px;
    line-height: 130px;
    width: auto;
}
.closest-events > a p.date,
.closest-events > a p.place
{
    display: flex;
    align-items: center;
}
.closest-events > a p.date {
    color: var(--primary);
}
.closest-events > a p.place,
.closest-events > a small {
    color: var(--secondary);
}
img[class*="avatar-"] {
    height: auto;
    width: auto;
}
.avatar-30{
    max-height:30px;
    max-width:30px;
}
.avatar-40{
    max-height:40px;
    width:40px;
}
.avatar-50{
    max-height:50px;
    max-width:50px;
}
.avatar-60{
    max-height:60px;
    max-width:60px;
}
.avatar-100{
    max-height:100px;
    max-width:100px;
}
.avatar-150{
    max-height:150px;
    max-width:150px;
}

.list-group {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    padding-left: 0;
    margin-bottom: 0;
    border-radius: 5px;
}
.list-group-item {
    position: relative;
    display: block;
    padding: .625rem 1.25rem;
    color: var(--dark);
    background-color: var(--white);
    /*border: 1px solid rgba(0,0,0,.125);*/
}
/*
.list-group-item:first-child,
.list-group-item:first-of-type {
    border-top-left-radius: inherit;
    border-top-right-radius: inherit;
}
.list-group-item:last-child,
.list-group-item:last-of-type
{
    border-bottom-right-radius: inherit;
    border-bottom-left-radius: inherit;
}
*/
.list-group input[type="radio"]:checked + label.list-group-item {
    z-index: 2;
    color: var(--white);
    background-color: var(--primary);
    /*border-color: var(--primary);*/
}
.list-group input[type="radio"]:checked + label.list-group-item:before {
    content: '';
    display: inline-block;
    width: 10px;
    height: 6px;
    background-color: transparent;
    border-left: solid 2px var(--white);
    border-bottom: solid 2px var(--white);
    -ms-transform: rotate(-45deg) translate(2px, -2px);
    -webkit-transform: rotate(-45deg) translate(2px, -2px);
    transform: rotate(-45deg) translate(2px, -2px);
    margin-right: 0.5rem;
}
.list-group.with-border {
    overflow: hidden;
    border: solid 1px var(--border-color);
}
.list-group.with-border input[type="radio"] + label.list-group-item:not(:last-of-type) {
    border-bottom: solid 1px var(--border-color);
}

/**
 * Channels & profile headers
 */
/*
.header-for-bg .background-header[style^="background-image:"] {
    height: 300px;
}
.header-for-bg .background-header {
    max-height: 400px;
    overflow: hidden;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    position: relative;
}
.header-for-bg .background-header.size-min {
    height: 150px;
}
.header-for-bg .background-header.size-max {
    height: 500px;
}
.header-for-bg .background-header > img {
    display: none;
    position: absolute;
    width: 100%;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 0;
}
.header-for-bg .background-header:after {
    content: '';
    position: absolute;
    bottom: -3rem;
    width: 100%;
    height: 3rem;
    background-color: transparent;
    box-shadow: 0 0 5rem 0 rgba(0, 0, 0, 0.85);
    display: block;
    z-index: 1;
}
.profile-header-image .profile-img{
    margin-top:-4.375rem;
    position:relative
}
*/

/*
div[id^="__"] {
    display: none;
}
*/

ul.card.table {
    list-style: none;
}
ul.card.table > li {
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    flex: 0 0 100%;
}
ul.card.table > li:not(:last-child) {
    border-bottom: solid 1px var(--bg-default);
}
ul.card.table > li > * {
    padding: 0.625rem 0;
}

.overflow-x-auto {
    max-width: 100%;
    overflow-x: auto;
    -ms-overflow-style: none;
    scrollbar-width: none;
}

blockquote {
    background-color: var(--bg-default);
    border-left: 0.5rem solid var(--light);
    padding: 1rem;
    font-style: italic;
    font-family: serif;
    margin: 0 0 1rem 0;
    border-radius: 0.5rem;
    font-size: 1.25em;
}
blockquote:before {
    content: '\201C';
    font-size: 3em;
    line-height: 0;
    margin-right: 0.25em;
    vertical-align: -0.45em;
    opacity: 0.25;
}
blockquote:after {
    content: '\201D';
    font-size: 3em;
    line-height: 0;
    margin-left: 0;
    vertical-align: -0.45em;
    opacity: 0.25;
}
blockquote p {
    display: inline;
}


/**
 * Emotions icons
 */
i.emotion.like,
i.emotion.dislike,
i.emotion.heart,
i.emotion.funny,
i.emotion.surprised,
i.emotion.sad,
i.emotion.nausea,
i.emotion.angry
{
    display: inline-block;
    width: 18px;
    height: 18px;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 100%;
    vertical-align: middle;
}
i.emotion.like {
    background-image: url('/application/we/modules/social/client/img/like.svg');
}
i.emotion.dislike {
    background-image: url('/application/we/modules/social/client/img/dislike.svg');
}
i.emotion.heart {
    background-image: url('/application/we/modules/social/client/img/heart.svg');
}
i.emotion.funny {
    background-image: url('/application/we/modules/social/client/img/lol.svg');
}
i.emotion.surprised {
    background-image: url('/application/we/modules/social/client/img/surprised.svg');
}
i.emotion.sad {
    background-image: url('/application/we/modules/social/client/img/cry.svg');
}
i.emotion.nausea {
    background-image: url('/application/we/modules/social/client/img/facepalm.svg');
}
i.emotion.angry {
    background-image: url('/application/we/modules/social/client/img/angry.svg');
}

/**
 * Dark mode
 */

body.dark .card.post a.logo-link > img {
    opacity: 0.65;
}
body.dark .card.post a.logo-link > img:hover {
    opacity: 1;
}
body.dark .card.post .card .user-post-data,
body.dark .card .user-post-data a {
    color: var(--secondary);
}
body.dark .card.post > .post {
    background-color: var(--bg-light-gray);
}
body.dark .options .emotions:hover,
body.dark .options .comments:hover,
body.dark .options .share:hover
{
    /*border-color: #353e5e;*/
    background-color: var(--bg-light-gray);
}
body.dark .card.loading::before
{
    background-color: var(--black);
}
body.dark footer {
    background-color: #191a1c;
}
body.dark footer .h5 {
    color: var(--black);
}
body.dark .cookies-policy-notice {
    background-color: rgba(45, 49, 60, 0.9);
    color: #6c757b;
}
body.dark .alert-success {
    color: #12a68d;
    background-color: var(--bg-success);
}
body.dark .alert-warning,
body.dark .alert-notice
{
    color: #c27518;
    background-color: var(--bg-notice);
}
body.dark .alert-danger {
    color: #e65f48;
    background-color: var(--bg-danger);
}
body.dark .alert-info,
body.dark .bg-info
{
    color: #b67adb;
    background-color: var(--bg-info);
}

div.interests {
    columns: 1;
}
div.interests > div {
    margin: 0;
    padding: 0.5rem 0;
    text-align: left;
}
div.interests > div > label.checkbox {
    margin: 0;
}

div#content_items {
    min-height: 100vh;
}
div#content_items > .card.sticky {
    top: var(--head-height);
    z-index: 2;
}
div#content_items > #feed-auth-form {
    z-index: 3;
}

div.loader-block {
    min-height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
}


/**
 * Responsive design
 */

@media (min-width: 420px) {
    #post-form .post-form-footer > a.source-link {
        margin: 0 0 0 auto;
        order: 2;
    }
    /*
    #post-form .post-form-footer > a.source-link + div {
        order: 1;
        display: block;
        transform: translate(0, 0);
        visibility: visible;
        border-radius: 0;
        transition: none;
    }
    */
}

/* Up to 480px width */
@media (max-width: 480px) {
    form.card.sticky#post-form {
        padding-left: 0.625rem;
        padding-right: 0.625rem;
    }
}

/* Small devices (up to 576px width) */
@media (max-width: 576px) {
    .card.post .post-poll.two-images .post-poll-options {
        flex-flow: column;
    }
    .card.post .post-poll.two-images .post-poll-options > .post-poll-option {
        width: 100%;
    }
    .card.post .post-poll.two-images .post-poll-options:after {
        transform: translate(-50%, -50%);
    }

    .post-form-header input[type="radio"]#type-advertisement + label {
        display: none;
    }
    form.card.sticky#post-form .post-form-header a.logo-link {
        display: none;
    }
    .post-form-header > div {
        justify-content: center;
    }
}

/* Small devices from 576px width */
@media (min-width: 576px) {

}

/* Up to 768px width */
@media (max-width: 768px) {
    form.card.sticky#post-form .post-form-header a.logo-link + div > span:first-child {
        font-size: 0;
    }
    form.card.sticky#post-form .post-form-header a.logo-link + div > span:first-child:before {
        content: '+';
        font-size: 14px;
    }
    .post-form-header > div > span {
        display: none;
    }
}
/* Medium devises (from 768px up to 992px width) */
@media (min-width: 768px) {
    footer {
        text-align: left;
    }
    .container-links > .btn {
        padding: 0 1rem;
    }
    .container-links > .btn svg {
        display: inline-block;
    }
    .card.post .img-wrapper > button,
    .card.post .img-wrapper > a.btn
    {
        font-size: 1em;
    }
    form.card#post-form .post-form-header input[type="radio"] + label.btn.btn-light {
        padding: 0 1rem;
    }
    .card .card-header > a.arrow {
        display: none;
    }
    form.card .user-post select[name="post[category]"] {
        width: 180px;
        text-align: center;
    }
    div.interests {
        columns: 2;
    }
}

/* Large devises (from 992px up to 1200px width) */
@media (max-width: 992px) {

    .post-form-header > div {
        font-size: 0.95em;
    }
    .card.items-list .card-header > a.arrow {
        display: inline-block;
    }
    .card.items-list .card-header {
        -moz-transition: margin 0.25s ease-in-out;
        -webkit-transition: margin 0.25s ease-in-out;
        -o-transition: margin 0.25s ease-in-out;
        transition: margin 0.25s ease-in-out;
    }
    .card.items-list .card-header + div {
        -moz-transition: max-height 0.25s ease-in-out;
        -webkit-transition: max-height 0.25s ease-in-out;
        -o-transition: max-height 0.25s ease-in-out;
        transition: max-height 0.25s ease-in-out;
    }
    .card.items-list:not(.opened) .card-header {
        margin-bottom: -1rem;
        border: none;
    }
    .card.items-list:not(.opened) .card-header + div {
        max-height: 0;
        overflow: hidden;
    }
}
@media (min-width: 992px) {
    form.card.sticky#post-form {
        top: var(--head-height);
    }
    .m-w4 + .m-075 {
        width: 75%;
        flex: 0 0 75%;
    }
    .container > div.m-w3 > div#channels-card.sticky,
    .container > div.m-w3 > div#friends-card.sticky
    {
        top: 76px;
        max-height: calc(100vh - var(--head-height) - 2rem);
    }
    .container > div.m-w3 > div#channels-card.sticky > .card-header + div,
    .container > div.m-w3 > div#friends-card.sticky > .card-header + div
    {
        max-height: calc(100vh - var(--head-height) - 57px - 4rem);
    }
    .sign-in-page {
        min-height: calc(100vh - var(--head-height));
    }
    div.interests {
        columns: 3;
    }
    .modal div.interests,
    div#content_items div.interests,
    div#interests-bar div.interests
    {
        columns: 2;
    }
    div#content_items > .card.sticky {
        top: 70px;
    }
}

/* Extra large devises (from 1200px width) */
@media (min-width: 1200px) {

}