@font-face {
    font-family: roboto-bold;
    src: url(../../../assets/front_end/fonts/roboto/Roboto-Bold.woff);
}

@font-face {
    font-family: roboto-regular;
    src: url(../../../assets/front_end/fonts/roboto/Roboto-Regular.woff);
}

@font-face {
    font-family: roboto-medium;
    src: url(../../../assets/front_end/fonts/roboto/Roboto-Medium.ttf);
}

@font-face {
    font-family: markazi;
    src: url(../../../assets/front_end/fonts/Markazi.ttf);
}

* {
    font-family: roboto-regular, Segoe UI, markazi;
}

.green {
    color: #7bbb5e;
}

/*Common Font styles*/

.bold {
    font-weight: 700;
    text-transform: capitalize;
}

.grey {
    color: #c5c5c5;
}

.lite {
    font-weight: 300 !important;
}

.green {
    color: #7bbb5e;
}

.green-official {
    color: #7bbb5e;
}

.heart {
    color: #db3838;
}

.bird {
    color: #a2cf8d;
}

.smile {
    color: #ffc93a;
}

.thumb {
    color: #525252;
}

.sad {
    color: #ffc93a;
}

.box-border {
    border-radius: 10px;
    border-bottom: 3px solid #dddfe2;
}

.new-design-btn {
    background-color: #0570f6;
    padding: 6px 16px;
    border-radius: 22px;
    font-family: roboto-medium;
    font-weight: 400;
    color: #ffffff;
    font-size: 15px;
    cursor: pointer;
    border: none;
}

.new-green-btn {
    background-color: #72b72a;
}

.new-gray-btn {
    background-color: #f0f0f2;
    color: #000;
}

.prop-side-widget-goldenwall {
    /*text-align: center;*/
}

.prop-side-widget-goldenwall h5 {
    text-align: center;
}

.prop-side-widget-goldenwall a.btn,
.new-on-socio a {
    width: 100%;
    padding: 9px 10px 10px 10px;
    height: 38px;
    text-align: center;
    background-color: #0570f6;
    color: #fff;
    font-size: 15px;
    margin: 15px auto 0 auto;
    display: block;
    border-radius: 6px;
}

.new-on-socio p {
    color: #64697d;
}

.prop-side-widget-goldenwall-article {
    background-color: #fff !important;
}

.prop-side-widget-goldenwall-article.filling-container>.prop-side-widget-goldenwall>p {
    text-align: left;
}

.prop-side-widget-goldenwall-article.filling-container>.prop-side-widget-goldenwall>p a {
    color: #364a5d;
    background-color: transparent;
    text-decoration: underline;
}

img.center-block {
    margin: 0 auto;
    display: block;
}

.prop-side-widget-goldenwall-article>h3 {
    font-family: roboto-medium;
    font-weight: 400;
    color: #000;
    text-align: left;
    font-size: 15px;
    padding: 15px;
}

.prop-side-widget-goldenwall-article>.prop-side-widget-goldenwall {
    padding: 15px;
}

.prop-side-widget-goldenwall-article>.prop-side-widget-goldenwall>p {
    color: #64697d;
    font-size: 15px;
    text-align: left;
    line-height: 19px;
}

.prop-side-widget-goldenwall-article>.prop-side-widget-goldenwall>p>a {
    color: #456A8E;
    background-color: #7bbb5e;
    padding: 0px;
}

.social-icons {
    padding: 15px 0px;
    /*border-bottom: 1px solid #dddfe2;*/
    border-top: 1px solid #dddfe2;
}

.post-actions-holder .social-icons {
    display: none;
}

.social-icons .not-active {
    pointer-events: none;
    opacity: 0.5;
}

.social-icons .active_fb {
    color: #3b5998;
    opacity: 1;
}

.social-icons .active_tw {
    color: #00acee;
    opacity: 1;
}

.social-icons .active_ln {
    color: #007bb6;
    opacity: 1;
}

.social-icons .active_ig {
    color: #3f729b;
    opacity: 1;
}

.winitquiz {
    /*background: url('https://images.socioon.com/assets/images/winit_images/quiz-header.jpg') no-repeat center; */
    min-height: 220px;
    padding: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-size: 100%;
    width: 100%;
}

.winitquiz img {
    float: left;
}

.winitquiz .content {
    float: left;
    /* width: 50% */
}


.winitqiz .post-logo {
    margin-top: -34px;
    margin-left: 16px;

}

.winitqiz .hip-hop-img a {
    display: table-cell;
    height: 124px;
    vertical-align: middle;
}

.social-icons .active_wb {
    color: #329932;
    opacity: 1;
}

.social-icons .active_yt {
    color: #c4302b;
    opacity: 1;
}

.social-icons ul {
    float: left;
}

.social-icons span {
    /*vertical-align: sub;*/
    margin-left: 12px;
    font-size: 0.9em;
    color: #000;
}

.social-icons ul li {
    display: inline;
    margin: 2px 6px;
}

.social-icons ul li:first-child {
    position: relative;
    top: -1px;
}

.social-icons ul li i {
    font-size: 22px;
}

.social-icons ul li img {
    vertical-align: sub;
}


input,
select {
    outline: none !important;
}

a:hover {
    opacity: 0.8;
}

.space-between {
    justify-content: space-between;
}

.align-middle {
    align-items: center;
}

.inline-form {
    display: flex;
    flex-direction: row;
}

html {
    scroll-behavior: smooth;
}

body {
    background: #eeeff3;
    scroll-behavior: smooth;
    padding-top: 60px;
}

.home.d-inner-home.mobile {
    padding-top: 124px;
    padding-left: 10px;
    padding-right: 10px;
}

body.home.d-inner-home.mobile.popupopen {
    padding-left: 0;
    padding-right: 0;
}

@media (max-width:767px) {
    .home.d-inner-home.mobile.pub-padd {
        /* padding-top: 264px; */
        padding-top: 63px;
    }
}

@media (max-width:400px) {
    .home.d-inner-home.mobile.pub-padd {
       /*  padding-top: 307px; */
       padding-top: 63px;
    }
}

.site-wrapper {
    width: 100%;
    height: 100px;
}

/*============================== Header Style ====================================*/

.nav-top {
    background: #0570f6;
    position: fixed;
    z-index: 999999;
    width: 100%;
}

.nav-top .container {
    max-width: 1080px;
    margin: 0 auto;
    display: flex;
    flex-direction: row;
    padding: 0 15px;
}

@media screen and (max-width: 415px) {
    .nav-top .container {
        justify-content: space-between;
    }
}

.nav-top .container .brand {
    flex-basis: 20%;
    padding: 10px 0;
    display: flex;
    align-items: center;
}

.nav-top .container .brand img {
    display: block;
    max-width: 100%;
    height: auto;
    width: 170px;
    min-width: 120px;
}

.img100Width {
    width: 100%;
}

.notification-list .don-alrt-span {
    height: 26px;
    margin-top: -3px;
}

@media screen and (max-width: 415px) {
    .nav-top .container .brand img {
        min-width: 100px;
    }

    .social-icons ul {
        width: 100%;
    }

    .social-icons {
        text-align: center;
    }
}

.nav-top .container .search {
    flex-basis: 50%;
    padding: 10px 10px;
    position: relative;
}

@media screen and (max-width: 415px) {
    .nav-top .container .search {
        display: none;
    }
}

.nav-top .container .search .search-i {
    color: #fff;
    font-size: 18px;
    position: absolute;
    top: 17px;
    left: 20px;
}

.nav-top .container .search input {
    background: #3570be;
    box-shadow: none;
    border: none;
    width: 90%;
    color: #fff;
    padding: 10px 15px 10px 40px;
    border-radius: 5px;
    font-weight: 300;
    font-size: 12px;
}

.nav-top .container .search input::placeholder {
    color: #eeeff3;
}

.nav-top .container .menu {
    flex-basis: 24%;
    display: flex;
    justify-content: flex-end;
}

@media screen and (max-width: 415px) {
    .nav-top .container .menu {
        flex-basis: 50%;
    }
}

.nav-top .container .menu .dropdown {
    top: 42px;
}

.nav-top .container .menu .dropdown li {
    padding: 10px;
}

.nav-top .container .menu .dropdown li a {
    align-items: center;
}

.nav-top .container .menu .dropdown li a .icon {
    color: #4b4f56;
}

.nav-top .container .menu .dropdown li a .d-sub-heading {
    margin-top: 2px !important;
}

.nav-top .container .menu ul {
    list-style: none;
    display: flex;
    align-items: center;
    margin: 0;
}

@media screen and (max-width: 320px) {
    .nav-top .container .menu ul {
        margin-block-start: 0;
        margin-block-end: 0;
        padding-inline-start: 20px;
    }

    .islamic-widget-display li a {
        font-weight: 600 !important;
        font-size: 13px !important;
        margin: 10px !important;
        text-align: center !important;
        float: left !important;
    }
}

.nav-top .container .menu ul li {
    padding: 0 5px;
}

.nav-top .container .menu ul li .icon {
    font-size: 20px;
    color: #ffffff;
}

@media screen and (max-width: 415px) {
    .nav-top .container .menu ul li .icon {
        font-size: 15px;
    }
}

@media screen and (max-width: 415px) {
    .nav-top .container .menu ul li img {
        width: 25px;
    }
}

/*============================== Header Styles ====================================*/

/*============================== Main Content Styles ====================================*/


.post {
    width: 100%;
    background: #ffffff;
    /*border: 1px solid #dddfe2;*/
    /*border-top: 3px solid;*/
    border-top: none;
    margin-bottom: 10px;
    border-radius: 10px;
    border-bottom: 3px solid #dddfe2;
}

.post-popup-wrapper article.post {
    margin-bottom: 0;
}

.n_b_green {
    border-top-color: #7bbb5e;

}

.n_b_red {
    border-top-color: #dc0000;
}

.n_b_orange {
    border-top: 2px solid #ff9500;
}

.post .mEmotiHolder {
    padding: 0px;
    border-bottom: 14px solid #fff;
}

.post .revenue {
    display: flex;
    justify-content: space-between;
    /*padding: 10px 10px 10px 15px;*/
    padding: 10px 15px;
    border-bottom: 1px solid #dddfe2;
    align-items: center;
}

.post .revenue span {
    font-weight: 300;
}

.post .revenue span {
    font-size: 12px;
}

@media screen and (min-width: 320px) {
    .post .revenue span {
        font-size: calc(12px + 2 * ((100vw - 320px) / 760));
    }
}

@media screen and (min-width: 1080px) {
    .post .revenue span {

        font-size: 15px;
    }
}

.post .revenue span.post-type {
    color: #000000;
    font-size: 15px;
    font-family: roboto-medium;
    font-weight: 400;
    text-transform: capitalize;
}

.post .post-header {
    display: flex;
    flex-direction: row;
    padding: 10px;
    position: relative;
    /*align-items: center;*/
}

.discover-notilist .discover-noti li {
    position: relative;
}

.post .post-header.jadu {
    padding: 10px 15px;
}

.post.extraRepost .post-header.jadu {
    padding: 0 15px 4px 15px;
}

.post .post-header .user-profile-image {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: flex-start;
}

.post .post-header .user-profile-image img {
    width: 46px;
    border-radius: 50%;
    /*border: 1px solid #e2e2e5;*/
}

@media screen and (max-width: 415px) {
    .post .post-header .user-profile-image {
        /*bottom: 8px;*/
    }
}

.post .post-header .user-profile-image a {
    position: relative;
}

.post .post-header .user-profile-image .icon {
    position: absolute;
    bottom: 4px;
    right: -5px;
    background: #ffffff;
    border-radius: 50px;
    padding: 2px;
}

/*@media screen and (max-width: 415px) {
    .post .post-header .user-profile-image .icon {
        bottom: 15px;
        right: -5px;
    }
}*/
.sidebar .user_email {
    display: none;
}

.sidebar h3 {
    overflow: hidden;
    text-overflow: unset;
    white-space: normal;
}

a.timeline-main-name {
    display: flex;
    align-items: center;
}

.timeline-main-name .lftcntpd {
    padding: 0;
    min-height: 1px;
}

.post .post-header .post-meta {
    padding: 5px 5px 5px 0;
    /*max-width: 75%;*/
    flex: 1;
}

.promotion-area .promot-detail.flexbox {
    display: flex;
}

.post-promot-dropdown.open-promo a i.fa-arrow-circle-up {
    display: block;
}

.post-promot-dropdown a i.fa-arrow-circle-down {
    display: block;
}

.post-promot-dropdown.open-promo a i.fa-arrow-circle-down {
    display: none;
}

.post-promot-dropdown a i.fa-arrow-circle-up {
    display: none;
}

.post .post-header .post-meta .sec-top {
    padding: 0 10px;
}

.post .post-header .post-meta .sec-top {
    font-size: 15px;
}

.post .post-header .post-meta .sec-top span a,
.post .repost-holder .first-repost .post-header .post-meta .sec-top span.bold {
    font-size: 15px;
    color: #000000;
    font-family: roboto-medium;
    font-weight: 400;
}

.post .post-header .post-meta .sec-top span.green-official {
    font-family: roboto-medium;
    font-weight: 400;
    font-size: 13px;
}

.post .post-header .post-meta .sec-top span span.lite {
    text-transform: lowercase;
}

.post .post-header.post_donor .post-meta .sec-top span span.lite {
    text-transform: none;
    font-weight: 400 !important;
}

.post .post-header.post_donor .post-meta .sec-top span span.lite a {
    display: block;
}

.post .post-header.post_donor .post-meta .sec-top span span.lite i.fa-tint {
    color: #cc0900;
}

@media screen and (min-width: 320px) {
    .post .post-header .post-meta .sec-top {
        font-size: calc(14px + 0 * ((100vw - 320px) / 760));
    }
}

@media screen and (min-width: 1080px) {
    .post .post-header .post-meta .sec-top {
        font-size: 15px;
    }
}

@media screen and (max-width: 989px) {
    .post .post-header .post-meta .sec-top {
        padding-right: 14px;
    }

    .post .post-header.post_donor .post-meta .sec-top span span.lite a {
        display: unset;
    }

    .post-popup-wrapper article.post {
        margin-top: 10px;
    }
}

.post .post-header .post-meta .post-time {
    padding: 0 10px 5px 10px;
    color: #5f6670;
    font-size: 13px !important;
    font-family: roboto-regular;
}

.post .post-header .post-meta .post-time a.post_time {
    color: #5f6670;
    font-size: 13px;
}

.post .post-header .post-meta .post-time {
    font-size: 13px;
}

@media screen and (min-width: 320px) {
    .post .post-header .post-meta .post-time {
        font-size: calc(12px + 0 * ((100vw - 320px) / 760));
    }
}

@media screen and (min-width: 1080px) {
    .post .post-header .post-meta .post-time {
        font-size: 12px;
    }
}

.post .post-header .post-meta .post-time .globe {
    margin-left: 4px;
}

.post .post-header .post-meta .post-time .globe a {
    color: #5f6670;
}

.post .post-header .post-meta .post-time .globe ul.dropdown.privacyPostdropdown {
    left: 0;
    right: auto;
}

.post .post-header .post-meta .post-time .icon {
    margin: 0 1px;
}

.post .post-header .post-actions {
    /*position: absolute;
    right: 15px;
    padding: 3px;
    border: none;
    position: absolute;
    right: 2px;*/
    padding: 0 0 0 13px;
    border: none;
    align-self: center;
}

.post-actions .dropdown-container .dropdown-trigger i {
    color: #7f7f7f;
}

.extraRepost.post .post-header .post-actions {
    top: -44px;
}

.post .post-header .post-actions a .icon {
    font-size: 1.5em;
    color: #171717;
}

.post .post-content {
    padding: 0 15px 10px 15px;
}

.post .post-content ul li,
.post .post-content ul li label {
    font-size: 15px;
}

.post .post-content ul li label {
    margin-right: 8px;
}

.post .post-content p {
    margin: 0;
    padding: 0;
}

.post .repost-holder .post-header .post-meta .sec-top {
    font-size: 15px;
    color: #525252;
    /*font-family: roboto-bold;*/
}

ul.job-post-vacancy {
    border: 1px solid #e4e4e4;
    padding: 0;
    margin-bottom: 16px;
    border-bottom: 0;
}

ul.job-post-vacancy li {
    display: flex;
    color: #000;
    border-bottom: 1px solid #e4e4e4;
    padding: 6px 10px;
}

ul.job-post-vacancy.pop-up-job li {
    padding: 0;
    align-items: center;
}

ul.job-post-vacancy.pop-up-job li label {
    margin: 0 12px 0 0;
    padding: 6px 10px;
    font-size: 13px;
}

ul.job-post-vacancy li label {
    min-width: 50%;
    display: block;
    border-right: 1px solid #e4e4e4;
    margin: 0;
}

.pop-up-job-other h4 {
    font-size: 15px;
    color: #000;
    margin: 0 0 12px 3px;
}

.pop-up-job-other textarea {
    width: 100%;
    margin-bottom: 8px;
}

.post-content.job-data .msg_cnt {
    color: #000;
}

a.read_more_jobs {
    color: #0570f6;
}

.post .post-content a.read_more {
    font-size: 15px;
}

.repost-holder .post-meta .sec-top {
    /*font-family: roboto-regular;*/
    color: #525252;
}

.advert .advert {
    margin-right: 0;
    /*border-right: 1px solid #dddfe2;*/
    padding: 0 1px 0 10px;
}

.extraRepost .advert .advert {
    padding-right: 10px;
}

button.page-like-new-btn,
button.user-follower-official.ufo,
button.user-unfollower-official {
    /*position: absolute;
    right: 11px;
    top: 0;
    bottom: 0;
    margin: auto;*/
    font-size: 12px;
    background-color: #0570f6;
    color: #fff !important;
    border: none !important;
}

button.page-like-new-btn i,
button.user-follower-official.ufo i,
button.user-unfollower-official i {
    color: #fff !important;
}

button.user-unfollower-official i {
    display: none;
}

.post .post-content p {
    font-size: 12px;
}

@media screen and (min-width: 320px) {
    .post .post-content p {
        font-size: calc(12px + 2 * ((100vw - 320px) / 760));
    }
}

@media screen and (min-width: 1080px) {
    .post .post-content p {
        font-size: 15px;
    }
}

.post .post-content p a {
    color: #0570f6;
    display: block;
    text-decoration: none;
    padding: 5px 0;
    font-family: roboto-regular;
    font-weight: 400;
}

.post .post-content p span.bold {
    font-family: roboto-medium;
    font-weight: 400;
}

.post .post-media img {
    width: 100%;
    display: block;
    max-width: 100%;
    height: auto;
}

.post .post-reactions {
    display: flex;
    justify-content: space-between;
    padding: 7px 0 8px 5px;
    /*border-bottom: 1px solid #dddfe2;*/
    border-top: 1px solid #dddfe2;
}

.post-actions ul.promo-post-menu li a span {
    font-size: 15px;
}

.post .post-reactions .reactions {
    display: flex;
    flex-direction: row;
    align-items: center;
}

.post .post-reactions .reactions ul {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    flex-direction: row-reverse;
    justify-content: center;
    margin-left: 5px;
}

.post .post-reactions .reactions ul li {
    margin-left: -5px;
    margin-top: 3px;
}

.post .post-reactions .reactions ul li img,
.post .post-reactions .reactions ul li svg {
    width: 20px;
    height: 20px;
    color: #fff;
}

.post .post-reactions .reactions span {
    font-size: 15px;
    margin-left: 8px;
    font-family: 'roboto-regular';
}

.post .post-reactions .counters {
    display: flex;
    flex-direction: row;
    align-items: center;
}

.post .post-reactions .counters ul {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    flex-direction: row;
    justify-content: center;
}

.post .post-reactions .counters ul li {
    margin-left: 5px;
}

.post .post-reactions .counters ul li a .icon {
    color: #0570f6;
    font-weight: 400;
}

.post .post-reactions .counters span {
    font-size: 12px;
    margin-left: 5px;
}

.post .post-actions {
    padding: 10px 0;
    border-bottom: 1px solid #dddfe2;
    border-top: 1px solid #dddfe2;
}

.post .post-actions ul {
    display: flex;
    list-style: none;
    justify-content: space-evenly;
    margin: 0;
    padding: 0;
}

.post .post-actions ul li {
    min-width: 1px;

}

.post-actions.post-action-reaction ul li {
    min-width: 112px;
    text-align: center;
}

.post .post-actions ul li .emoticons-container {
    position: relative;
    left: -379px;
    top: 45px;
    display: none;
    transition: 0.5s linear;
}

.post .post-actions .dropdown-container ul li a {
    flex-direction: row;
    justify-content: flex-start;
    align-items: flex-start;
}

.post .post-reactions .reacted-user-btn.sendreactionfriendRequest span.reacted-user-btn-icon {
    display: flex;
    align-items: center;
    padding: 6px 6px;
    min-width: 141px;
    justify-content: center;
    background-color: #0570f6;
    color: #fff;
    border: none;
    height: auto;
    max-height: 30px;
    border-radius: 6px;
}

@media screen and (min-width: 415px) {
    .post .post-actions ul li .emoticons-container {
        top: 73px;
    }
}

.pst_like {
    cursor: pointer;
}

@media screen and (max-width: 768px) {
    .post .post-actions ul li .emoticons-container {
        left: -344px;
        top: 51px;
    }

    button.page-like-new-btn,
    button.user-follower-official.ufo {
        font-size: 12px;
        min-width: 32px;
    }
}

.post .post-actions ul li .emoticons-container .emoticons {
    display: flex;
    flex-direction: row;
    position: absolute;
    transform: scale(0.3);
    bottom: 25px;
    left: 88px;
    padding: 15px;
    background: #ffffff;
    z-index: 999;
    box-shadow: 0 1px 15px rgba(0, 0, 0, 0.4);
    border-radius: 6em;
    cursor: default;
}

@media screen and (max-width: 768px) {
    .post .post-actions ul li .emoticons-container .emoticons {
        transform: scale(0.34);
        bottom: 5px;
        left: 75px;
    }
}

.post .post-actions ul li a {
    text-decoration: none;
    margin: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    color: #5f6670;

}

/*.post-actions.post-action-reaction ul li a{*/
/*padding: 4px 0;*/
/*display: block;*/
/*}*/
.post .post-actions .dropdown-container ul li a:hover {
    opacity: 1;
}

.post .post-actions ul li a span {
    color: #5f6670;
}

.post .post-actions ul li a .icon {
    font-size: 22px;
    padding: 0 0 4px 0;
    text-align: center;
    color: #5f6670;
}

.post .post-actions ul li a.color-green span {
    color: #0570f6;
}

.post .post-actions ul li a.color-green .icon {
    color: #0570f6;
}

.post .post-actions ul li a span {
    color: #5f6670;
    font-family: roboto-regular;
    font-size: 15px;
    position: relative;
    top: 0;
    line-height: 1;
}

.post .post-actions ul li a span.d-sub-heading,
.post .post-actions ul li a span.d-heading {
    font-size: 13px;
}

.post .post-promo-meta {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    padding: 10px 0;
    align-items: center;
}

.post .post-promo-meta .post-a-meta span {
    color: #5f6670;
    font-weight: 400;
    font-family: 'roboto-regular';
}

.post .post-promo-meta .post-a-meta span {
    font-size: 12px;
}

@media screen and (min-width: 320px) {

    /*.post .post-promo-meta .post-a-meta span {
        font-size: calc(12px + 2 * ((100vw - 320px) / 760));
    }*/
    .post .post-promo-meta .post-a-meta span {
        font-size: 15px;
    }
}

@media screen and (min-width: 1080px) {
    .post .post-promo-meta .post-a-meta span {
        font-size: 15px;
        color: #5f6670;
        font-family: 'roboto-regular';
        display: flex;
    }
}

.post .post-promo-meta .post-a-meta span i {
    font-size: 18px;
    position: relative;
    top: 1px;
    margin-right: 4px;

}

.discover-notilist .discover-noti .DiscNotiContainer.active {
    background-color: #edf7fc;
}

.main-post-header.extraRepost {
    padding: 15px 0 15px 15px;
}

.main-post-header.extraRepost .post-header {
    border-left: 2px solid #0570f6;
}

.main-post-header.extraRepost .post-content {
    border-left: 2px solid #0570f6;
    padding-bottom: 0;
}

.comment_actions .dropdown-dots a.dropdown-toggle {
    overflow: hidden;
    height: 16px;
    display: block;
}

.comment_actions .dropdown-dots a i {
    font-size: 30px;
    margin-top: -3px;
    color: #525252;
}

.post .post-promo-meta .post-promo {
    display: flex;
}

.post .post-promo-meta .post-promo a {
    padding: 6px 10px;
    color: #000000;
    text-decoration: none;
    border-radius: 5px;
    margin: 0 0 0 6px;
    display: flex;
    align-items: center;
    height: auto;
}

.dropdown-dots ul.dropdown-menu li a {
    font-family: roboto-medium;
    font-size: 15px;
}

.post .post-promo-meta .post-promo a i {
    font-size: 17px;
    position: relative;
    top: 1px;
}

.post .post-promo-meta .post-promo a i.fa-bookmark {
    font-size: 15px;
}

.post .post-promo-meta .post-promo a span {
    display: block;
    font-family: roboto-regular;
}

.discover-noti li.DiscNotiContainer a:nth-child(2) {
    flex: 1;
}

.post .post-reactions .reacted-user-btn span.reacted-user-btn-icon span {
    font-size: 15px;
    margin-left: 2px;
}

.post .post-reactions .reacted-user-btn span.reacted-user-btn-icon {
    /*padding-top: 0;*/
    display: flex;
    align-items: center;
    padding: 6px 6px;
    min-width: 141px;
    justify-content: center;
    background-color: #0570f6;
    color: #fff;
    border: none;
    height: auto;
    max-height: 30px;
    border-radius: 6px;
}

.user-comment .commentContent span.count-new {
    position: absolute;
    right: -36px;
    bottom: 4px;
    background-color: #fff;
    box-shadow: 0 4px 5px rgba(0, 0, 0, 0.1);
    padding: 0 4px;
    border-radius: 50px;
    font-family: roboto-regular;
    display: flex;
    align-items: center;
    font-size: 15px;
    height: 25px;
}

/*.user-comment .commentContent span.count-new i {
    background-color: #fff;
    color: #7bbb5e;
    border-radius: 100%;
    font-size: 18px;
    margin-right: 2px;
    margin-top: -1px;
}*/
.user-comment .commentContent span.count-new svg {
    width: 18px;
    height: 18px;
}

.prop-sidebar-widget input:checked+label:after {
    content: '';
    display: block;
    position: absolute;
    top: 3px !important;
    left: 6px !important;
    width: 6px !important;
    height: 11px !important;
    border: solid #0570f6;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}


@media screen and (max-width: 415px) {
    .post .post-promo-meta .post-promo a {
        /*padding: 5px 10px;*/
        color: #000000;
        text-decoration: none;
        /*border-radius: 3px;*/
        display: flex;
        justify-content: center;
        text-align: center;
        align-items: center;
        /* margin: 0 0 0 5px; */
        line-height: 1;

    }

}

.post .post-promo-meta .post-promo a {
    font-size: 12px;
}

@media screen and (min-width: 320px) {
    .post .post-promo-meta .post-promo a {
        font-size: 15px;
    }
}

@media screen and (min-width: 1080px) {
    .post .post-promo-meta .post-promo a {
        font-size: 15px;
        min-width: 136px;
        display: block;
        text-align: center;
    }
}

@media screen and (max-width: 768px) {

    .post .post-promo-meta .post-promo a i {
        font-weight: 400;
    }

    .post .post-promo-meta .post-promo a {
        padding: 10px 10px 10px 10px;
        min-width: 105px;
        line-height: 1;
    }
}

.post .post-promo-meta .post-promo a.great-job {
    background: #f35555;
    color: #fff;
}

.post .post-promo-meta .post-promo a.coffee {
    background: #b17244;
    COLOR: #FFF;
}

.post .post-promo-meta .post-promo a.coffee.disabled i,
.post .post-promo-meta .post-promo a.great-job.disabled i,
.post .post-promo-meta .post-promo a.bookmark.disabled i {
    color: #7f7f7f;
}

.post .post-promo-meta .post-promo a.coffee.disabled,
.post .post-promo-meta .post-promo a.great-job.disabled,
.post .post-promo-meta .post-promo a.bookmark.disabled {
    background-color: #f6f7f9;
    opacity: 1 !important;
    color: #4b4f56;
}

.post .post-promo-meta .post-promo a.great-job.disabled .grtjob,
.post .post-promo-meta .post-promo a.coffee.disabled span {
    background-color: #f6f7f9;
    opacity: 0.4;
}

.promotion-area img.smal-thumb {
    border-radius: 100%;
}

.promotion-area .adv-post button.btn {
    font-family: roboto-bold;
    font-size: 15px;
}

.post .post-promo-meta .post-promo a.bookmark {
    background: #ffc357;
    /* c6c8d1 */
}

.post .post-comments {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px;
    background: #eaeaea;
}

.post .post-comments .user-profile-image {
    display: flex;
    justify-content: center;
    align-items: center;
}

.post .post-comments .user-profile-image img {
    display: block;
    max-width: 100%;
    height: auto;
    height: 35px;
    width: 35px;
    border-radius: 20px;
}

.post .post-comments .text-area {
    width: 100%;
    padding: 0 10px;
    position: relative;
    top: 8px;
}

.post .post-comments .text-area input {
    width: 100%;
    padding: 10px 5px;
    border-radius: 3px;
    border: 1px solid #dddfe2;
    font-size: 12px;
}

.post .post-comments .text-area .box-buttons {
    position: absolute;
    right: 12px;
    bottom: 15px;
    display: flex;
}

.post .post-comments .text-area .box-buttons a {
    color: #4b4f56;
    margin-right: 5px;
    position: relative;
    cursor: pointer;
}

.post .post-comments .text-area .box-buttons a input.img-upload {
    position: absolute;
    width: 100%;
    right: 0;
    cursor: pointer;
}

@media screen and (max-width: 415px) {
    .post .post-comments .text-area .box-buttons a input.img-upload {
        position: absolute;
        width: 100%;
        right: 0;
        cursor: pointer;
    }
}

.post .post-comments .text-area .box-buttons a {
    font-size: 18px;
}

@media screen and (min-width: 320px) {
    .post .post-comments .text-area .box-buttons a {
        font-size: calc(18px + 4 * ((100vw - 320px) / 760));
    }
}

@media screen and (min-width: 1080px) {
    .post .post-comments .text-area .box-buttons a {
        font-size: 22px;
    }
}

.post .post-actions-holder {
    margin: 0 15px;
}

.post-content.job-pp .post-actions-holder {
    margin: 0;
}

.post .image-up-preview {
    width: 86%;
    border: 1px solid #dddfe2;
    position: relative;
    padding: 5px;
    margin: 5px;
    border-radius: 15px;
    margin-left: 10%;
}

.post .image-up-preview .icon {
    position: absolute;
    right: 5px;
    top: 5px;
    color: #4b4f56;
}

.post .image-up-preview img {
    border-radius: 15px;
    width: 100px;
    height: 100px;
}

/*====================Comments Style ============================*/

.post-comment-holder {
    border-top: 1px solid #dddfe2;
}

.post-comment-holder .opened-comment .user-comment {
    display: flex;
    flex-direction: row;
}

.post-comment-holder .opened-comment .user-comment .user-profile-image {
    margin-right: 10px;
}

.post-comment-holder .opened-comment .user-comment .user-profile-image img {
    width: 40px;
    height: 40px;
    border-radius: 20px;
}


.post-comment-holder .opened-comment .user-comment .comment-data .comment-text {
    background: #f2f3f5;
    color: #4b4f56;
    padding: 10px 15px;
    border-radius: 15px;
}

.post-comment-holder .opened-comment .user-comment .comment-data .comment-text {
    font-size: 12px;
}

@media screen and (min-width: 320px) {
    .post-comment-holder .opened-comment .user-comment .comment-data .comment-text {
        font-size: calc(12px + 1 * ((100vw - 320px) / 760));
    }
}

@media screen and (min-width: 1080px) {
    .post-comment-holder .opened-comment .user-comment .comment-data .comment-text {
        font-size: 13px;
    }
}

.post-comment-holder .opened-comment .user-comment .comment-data .comment-text .user-name {
    text-decoration: none;
    color: #0570f6;
    font-weight: 600;
}

.post-comment-holder .opened-comment .user-comment .comment-data .comment-text .comment-link {
    color: #0570f6;
    text-decoration: none;
    margin-left: 5px;
}

.post-comment-holder .opened-comment .user-comment .comment-data .comment-text .comment-image {
    display: block;
    padding: 10px;
    border-radius: 25px;
    width: 200px;
    height: 200px;
}

.post-comment-holder .opened-comment .user-comment .comment-data .comment-text .fa-heart {
    color: rgba(255, 34, 0, 0.71);
}

.post-comment-holder .opened-comment .user-comment .comment-data .link-preview {
    display: flex;
    flex-direction: row;
    margin: 10px 0;
    border: 1px solid #dddfe2;
    border-radius: 15px;
    text-decoration: none;
}

.post-comment-holder .opened-comment .user-comment .comment-data .link-preview .lp-image {
    position: relative;
    width: 100px;
    height: 100px;
    overflow: hidden;
    border-top-left-radius: 15px;
    border-bottom-left-radius: 15px;
}

.post-comment-holder .opened-comment .user-comment .comment-data .link-preview .lp-image img {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    height: 100px;
}

.post-comment-holder .opened-comment .user-comment .comment-data .link-preview .lp-data {
    display: flex;
    flex-direction: column;
    margin: auto 10px;
    color: #4b4f56;
}

.post-comment-holder .opened-comment .user-comment .comment-data .link-preview .lp-data .lp-title {
    font-weight: 600;
    margin-bottom: 5px;
}

.post-comment-holder .opened-comment .user-comment .comment-data .link-preview .lp-data .lp-title {
    font-size: 12px;
}

@media screen and (min-width: 320px) {
    .post-comment-holder .opened-comment .user-comment .comment-data .link-preview .lp-data .lp-title {
        font-size: calc(12px + 1 * ((100vw - 320px) / 760));
    }
}

@media screen and (min-width: 1080px) {
    .post-comment-holder .opened-comment .user-comment .comment-data .link-preview .lp-data .lp-title {
        font-size: 13px;
    }
}

.post-comment-holder .opened-comment .user-comment .comment-data .link-preview .lp-data .lp-subtitle {
    font-size: 12px;
}

@media screen and (min-width: 320px) {
    .post-comment-holder .opened-comment .user-comment .comment-data .link-preview .lp-data .lp-subtitle {
        font-size: calc(12px + 1 * ((100vw - 320px) / 760));
    }
}

@media screen and (min-width: 1080px) {
    .post-comment-holder .opened-comment .user-comment .comment-data .link-preview .lp-data .lp-subtitle {
        font-size: 13px;
    }
}

.post-comment-holder .opened-comment .user-comment .comment-data .comment-actions {
    padding: 5px 10px;
    font-size: 12px;
    font-weight: 400;
}

.post-comment-holder .opened-comment .user-comment .comment-data .comment-actions a {
    color: #0570f6;
    text-decoration: none;
}

.post-comment-holder .opened-comment .user-comment .comment-data .comment-actions a:after {
    content: '-';
    margin: 0 5px;
}

.post-comment-holder .opened-comment .comment-reply {
    display: flex;
    flex-direction: row;
    padding: 10px 0 10px 50px;
}

.post-comment-holder .opened-comment .comment-reply .user-profile-image {
    margin-right: 10px;
    margin-top: 5px;
}

.post-comment-holder .opened-comment .comment-reply .user-profile-image img {
    width: 30px;
}

.post-comment-holder .opened-comment .comment-reply .comment-reply-data {
    /*Comment Text Styles*/
    /*Comment Text Styles*/
    /*Comment Actions Styles*/
    /*Comment Actions Styles*/
}

.post-comment-holder .opened-comment .comment-reply .comment-reply-data .comment-text {
    border: 1px solid #dddfe2;
    color: #4b4f56;
    padding: 10px 15px;
    border-radius: 15px;
}

.post-comment-holder .opened-comment .comment-reply .comment-reply-data .comment-text {
    font-size: 12px;
}

@media screen and (min-width: 320px) {
    .post-comment-holder .opened-comment .comment-reply .comment-reply-data .comment-text {
        font-size: calc(12px + 1 * ((100vw - 320px) / 760));
    }
}

@media screen and (min-width: 1080px) {
    .post-comment-holder .opened-comment .comment-reply .comment-reply-data .comment-text {
        font-size: 13px;
    }
}

.post-comment-holder .opened-comment .comment-reply .comment-reply-data .comment-text .user-name {
    text-decoration: none;
    color: #0570f6;
    font-weight: 600;
}

.post-comment-holder .opened-comment .comment-reply .comment-reply-data .comment-text .fa-heart {
    color: rgba(255, 34, 0, 0.71);
}

.post-comment-holder .opened-comment .comment-reply .comment-reply-data .comment-actions {
    padding: 5px 10px;
    font-size: 12px;
    font-weight: 400;
}

.post-comment-holder .opened-comment .comment-reply .comment-reply-data .comment-actions a {
    color: #0570f6;
    text-decoration: none;
}

.post-comment-holder .opened-comment .comment-reply .comment-reply-data .comment-actions a:after {
    content: '-';
    margin: 0 5px;
}

.post-comment-holder .opened-comment .comment-reply-box {
    display: flex;
    flex-direction: row;
    padding: 0 25px 10px 50px;
}

.post-comment-holder .opened-comment .comment-reply-box .user-profile-image {
    margin-right: 10px;
    margin-top: 5px;
}

.post-comment-holder .opened-comment .comment-reply-box .user-profile-image img {
    width: 30px;
}

.post-comment-holder .opened-comment .comment-reply-box .comment-reply-textfield {
    /*Comment Text Styles*/
    flex-basis: 80%;
    position: relative;
    /*Comment Text Styles*/
}

.post-comment-holder .opened-comment .comment-reply-box .comment-reply-textfield input {
    border: 1px solid #dddfe2;
    color: #4b4f56;
    padding: 10px 15px;
    border-radius: 15px;
    width: 95%;
}

.post-comment-holder .opened-comment .comment-reply-box .comment-reply-textfield input {
    font-size: 12px;
}

@media screen and (min-width: 320px) {
    .post-comment-holder .opened-comment .comment-reply-box .comment-reply-textfield input {
        font-size: calc(12px + 1 * ((100vw - 320px) / 760));
    }
}

@media screen and (min-width: 1080px) {
    .post-comment-holder .opened-comment .comment-reply-box .comment-reply-textfield input {
        font-size: 13px;
    }
}

.post-comment-holder .opened-comment .comment-reply-box .comment-reply-textfield .box-buttons {
    position: absolute;
    right: -10px;
    bottom: 7px;
}

.post-comment-holder .opened-comment .comment-reply-box .comment-reply-textfield .box-buttons a {
    color: #4b4f56;
    margin-right: 5px;
}

.post-comment-holder .opened-comment .comment-reply-box .comment-reply-textfield .box-buttons a {
    font-size: 18px;
}

@media screen and (min-width: 320px) {
    .post-comment-holder .opened-comment .comment-reply-box .comment-reply-textfield .box-buttons a {
        font-size: calc(18px + 4 * ((100vw - 320px) / 760));
    }
}

@media screen and (min-width: 1080px) {
    .post-comment-holder .opened-comment .comment-reply-box .comment-reply-textfield .box-buttons a {
        font-size: 22px;
    }
}

.post-comment-holder .opened-comment .image-up-preview-reply {
    width: 67%;
    border: 1px solid #dddfe2;
    position: relative;
    padding: 10px 10px 5px 10px;
    margin: 0 25px 10px 89px;
    border-radius: 15px;
}

.post-comment-holder .opened-comment .image-up-preview-reply .icon {
    position: absolute;
    right: 5px;
    top: 5px;
    color: #4b4f56;
}

.post-comment-holder .opened-comment .image-up-preview-reply img {
    width: 100px;
    height: 100px;
    border-radius: 15px;
}

.post-comment-holder .opened-comment .comment-reply-closed {
    display: flex;
    flex-direction: row;
    align-items: center;
    padding: 10px 0 10px 65px;
    position: relative;
}

.post-comment-holder .opened-comment .comment-reply-closed .user-profile-image {
    margin-right: 10px;
    margin-top: 5px;
}

.post-comment-holder .opened-comment .comment-reply-closed .user-profile-image img {
    width: 30px;
}

.post-comment-holder .opened-comment .comment-reply-closed .comment-reply-data .comment-text a {
    color: #0570f6;
    text-decoration: none;
}

.post-comment-holder .opened-comment .comment-reply-closed .comment-reply-data .comment-text a {
    font-size: 12px;
}

@media screen and (min-width: 320px) {
    .post-comment-holder .opened-comment .comment-reply-closed .comment-reply-data .comment-text a {
        font-size: calc(12px + 2 * ((100vw - 320px) / 760));
    }
}

@media screen and (min-width: 1080px) {
    .post-comment-holder .opened-comment .comment-reply-closed .comment-reply-data .comment-text a {
        font-size: 15px;
    }
}

.post-comment-holder .opened-comment .comment-reply-closed i.icon {
    transform: scaleY(-1);
}

.post-comment-holder .opened-comment .comment-reply-closed i.icon svg {
    transform: rotate(270deg);
    width: 25px;
    position: relative;
    top: 7px;
    right: 3px;
    color: #4b4f56;
}

/*====================Comments Style ============================*/

/*====================== Dropdown =================*/

.dropdown-container {
    position: relative;
    display: inline-block;
}

.dropup {
    bottom: 19px;
    top: unset !important;
}

.flip-up {
    transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
}

.dropdown {
    display: none;
    flex-direction: column;
    position: absolute;
    right: -7px;
    top: 20px;
    width: 246px;
    max-width: 300px;
    list-style: none;
    padding: 0;
    margin: 0;
    background: #ffffff;
    border: 1px solid #dddfe2;
    border-radius: 3px;
    box-shadow: 0px 0px 5px 1px rgba(0, 0, 0, 0.1);
    z-index: 4;
}

@media screen and (max-width: 415px) {
    .dropdown {
        right: -16px;
        top: 20px;
        width: 180px;
    }
}

.dropdown li {
    padding: 6px 10px;
    font-size: 15px;
    word-break: break-word;
    border-top: 1px solid rgba(0, 0, 0, 0.1);
    border-bottom: 1px solid rgba(0, 0, 0, 0);
}

.dropdown li a {
    text-decoration: none;
    color: #4b4f56;
    display: flex;
    flex-direction: row;
}

.dropdown li a .icon {
    font-size: 16px !important;
    padding-right: 10px !important;
}

.post .post-actions .dropdown li a .d-heading {
    font-weight: 400;
    font-size: 15px;
    margin: 0 !important;
    font-family: roboto-medium;
}

.dropdown li a .d-sub-heading {
    display: block;
    margin: 0 !important;
    font-size: 11px;
    color: #a2a7ad;
}

.dropdown li:hover {
    background: #0570f6;
    border-top: 1px solid #3570be;
    border-bottom: 1px solid #3570be;
    color: #ffffff !important;
    cursor: pointer;
}

.dropdown li:hover a {
    color: #ffffff !important;
}

.dropdown li:hover a .icon {
    color: #ffffff !important;
}

.dropdown li:hover a .d-heading {
    color: #ffffff !important;
}

.dropdown li:hover a .d-sub-heading {
    color: #ffffff !important;
}

.dropdown-trigger {
    text-decoration: none;
}

.emoji {
    width: 120px;
    height: 120px;
    margin: 15px 15px 15px;
    display: inline-block;
    border-radius: 50%;
    position: relative;
}

.emoji:after {
    position: absolute;
    bottom: -40px;
    font-size: 18px;
    width: 60px;
    left: calc(50% - 30px);
    color: #8A8A8A;
}

.emoji:hover {
    cursor: pointer;
    transform: scale(1.15);
    transition: 0.2s linear;
}

.emoji__face,
.emoji__eyebrows,
.emoji__eyes,
.emoji__mouth,
.emoji__tongue,
.emoji__heart,
.emoji__hand,
.emoji__thumb {
    position: absolute;
}

.emoji__face:before,
.emoji__face:after,
.emoji__eyebrows:before,
.emoji__eyebrows:after,
.emoji__eyes:before,
.emoji__eyes:after,
.emoji__mouth:before,
.emoji__mouth:after,
.emoji__tongue:before,
.emoji__tongue:after,
.emoji__heart:before,
.emoji__heart:after,
.emoji__hand:before,
.emoji__hand:after,
.emoji__thumb:before,
.emoji__thumb:after {
    position: absolute;
    content: '';
}

.emoji__face {
    width: inherit;
    height: inherit;
}

.emoji--like {
    background: #548DFF;
}

.emoji--like .emoji__hand {
    left: 25px;
    bottom: 30px;
    width: 20px;
    height: 40px;
    background: #FFFFFF;
    border-radius: 5px;
    z-index: 0;
    animation: hands-up 2s linear infinite;
}

.emoji--like .emoji__hand:before {
    left: 25px;
    bottom: 5px;
    width: 40px;
    background: inherit;
    height: 10px;
    border-radius: 2px 10px 10px 2px;
    box-shadow: 1px -9px 0 1px #FFFFFF, 2px -19px 0 2px #FFFFFF, 3px -29px 0 3px #FFFFFF;
}

.emoji--like .emoji__thumb {
    border-bottom: 20px solid #FFFFFF;
    border-left: 20px solid transparent;
    top: -25px;
    right: -25px;
    z-index: 2;
    transform: rotate(5deg);
    transform-origin: 0% 100%;
    animation: thumbs-up 2s linear infinite;
}

.emoji--like .emoji__thumb:before {
    border-radius: 50% 50% 0 0;
    background: #FFFFFF;
    width: 10px;
    height: 12px;
    left: -10px;
    top: -8px;
    transform: rotate(-15deg);
    transform-origin: 100% 100%;
    box-shadow: -1px 4px 0 -1px #FFFFFF;
}

.emoji--love {
    background: #F55064;
}

.emoji--love .emoji__heart {
    left: calc(50% - 40px);
    top: calc(50% - 40px);
    width: 80px;
    height: 80px;
    animation: heart-beat 1s linear infinite alternate;
}

.emoji--love .emoji__heart:before,
.emoji--love .emoji__heart:after {
    left: calc(50% - 20px);
    top: calc(50% - 32px);
    width: 40px;
    height: 64px;
    background: #FFFFFF;
    border-radius: 20px 20px 0 0;
}

.emoji--love .emoji__heart:before {
    transform: translate(20px) rotate(-45deg);
    transform-origin: 0 100%;
}

.emoji--love .emoji__heart:after {
    transform: translate(-20px) rotate(45deg);
    transform-origin: 100% 100%;
}

.emoji--haha .emoji__face {
    animation: haha-face 2s linear infinite;
}

.emoji--haha .emoji__eyes {
    width: 26px;
    height: 6px;
    border-radius: 2px;
    left: calc(50% - 13px);
    top: 35px;
    transform: rotate(20deg);
    background: transparent;
    box-shadow: -25px 5px 0 0 #000000, 25px -5px 0 0 #000000;
}

.emoji--haha .emoji__eyes:after {
    left: 0;
    top: 0;
    width: 26px;
    height: 6px;
    border-radius: 2px;
    transform: rotate(-40deg);
    background: transparent;
    box-shadow: -25px -5px 0 0 #000000, 25px 5px 0 0 #000000;
}

.emoji--haha .emoji__mouth {
    width: 80px;
    height: 40px;
    left: calc(50% - 40px);
    top: 50%;
    background: #000000;
    border-radius: 0 0 40px 40px;
    overflow: hidden;
    z-index: 1;
    animation: haha-mouth 2s linear infinite;
}

.emoji--haha .emoji__tongue {
    width: 70px;
    height: 30px;
    background: #F55064;
    left: calc(50% - 35px);
    bottom: -10px;
    border-radius: 50%;
}

.emoji--yay .emoji__face {
    animation: yay 1s linear infinite alternate;
}

.emoji--yay .emoji__eyebrows {
    left: calc(50% - 3px);
    top: 30px;
    height: 6px;
    width: 6px;
    border-radius: 50%;
    background: transparent;
    box-shadow: -6px 0 0 0 #000000, -36px 0 0 0px #000000, 6px 0 0 0 #000000, 36px 0 0 0px #000000;
}

.emoji--yay .emoji__eyebrows:before,
.emoji--yay .emoji__eyebrows:after {
    width: 36px;
    height: 18px;
    border-radius: 60px 60px 0 0;
    background: transparent;
    border: 6px solid black;
    box-sizing: border-box;
    border-bottom: 0;
    bottom: 3px;
    left: calc(50% - 18px);
}

.emoji--yay .emoji__eyebrows:before {
    margin-left: -21px;
}

.emoji--yay .emoji__eyebrows:after {
    margin-left: 21px;
}

.emoji--yay .emoji__mouth {
    top: 60px;
    background: transparent;
    left: 50%;
}

.emoji--yay .emoji__mouth:after {
    width: 80px;
    height: 80px;
    left: calc(50% - 40px);
    top: -75px;
    border-radius: 50%;
    background: transparent;
    border: 6px solid #000000;
    box-sizing: border-box;
    border-top-color: transparent;
    border-left-color: transparent;
    border-right-color: transparent;
    z-index: 1;
}

.emoji--yay .emoji__mouth:before {
    width: 6px;
    height: 6px;
    background: transparent;
    border-radius: 50%;
    bottom: 5px;
    left: calc(50% - 3px);
    box-shadow: -25px 0 0 0 #000000, 25px 0 0 0 #000000, -35px -2px 30px 10px #D5234C, 35px -2px 30px 10px #D5234C;
}

.emoji--wow .emoji__face {
    animation: wow-face 3s linear infinite;
}

.emoji--wow .emoji__eyebrows {
    left: calc(50% - 3px);
    height: 6px;
    width: 6px;
    border-radius: 50%;
    background: transparent;
    box-shadow: -18px 0 0 0 #000000, -33px 0 0 0 #000000, 18px 0 0 0 #000000, 33px 0 0 0 #000000;
    animation: wow-brow 3s linear infinite;
}

.emoji--wow .emoji__eyebrows:before,
.emoji--wow .emoji__eyebrows:after {
    width: 24px;
    height: 20px;
    border: 6px solid #000000;
    box-sizing: border-box;
    border-radius: 50%;
    border-bottom-color: transparent;
    border-left-color: transparent;
    border-right-color: transparent;
    top: -3px;
    left: calc(50% - 12px);
}

.emoji--wow .emoji__eyebrows:before {
    margin-left: -25px;
}

.emoji--wow .emoji__eyebrows:after {
    margin-left: 25px;
}

.emoji--wow .emoji__eyes {
    width: 16px;
    height: 24px;
    left: calc(50% - 8px);
    top: 35px;
    border-radius: 50%;
    background: transparent;
    box-shadow: 25px 0 0 0 #000000, -25px 0 0 0 #000000;
}

.emoji--wow .emoji__mouth {
    width: 30px;
    height: 45px;
    left: calc(50% - 15px);
    top: 50%;
    border-radius: 50%;
    background: #000000;
    animation: wow-mouth 3s linear infinite;
}

.emoji--sad .emoji__face {
    animation: sad-face 2s ease-in infinite;
}

.emoji--sad .emoji__eyebrows {
    left: calc(50% - 3px);
    top: 35px;
    height: 6px;
    width: 6px;
    border-radius: 50%;
    background: transparent;
    box-shadow: -40px 9px 0 0 #000000, -25px 0 0 0 #000000, 25px 0 0 0 #000000, 40px 9px 0 0 #000000;
}

.emoji--sad .emoji__eyebrows:before,
.emoji--sad .emoji__eyebrows:after {
    width: 30px;
    height: 20px;
    border: 6px solid #000000;
    box-sizing: border-box;
    border-radius: 50%;
    border-bottom-color: transparent;
    border-left-color: transparent;
    border-right-color: transparent;
    top: 2px;
    left: calc(50% - 15px);
}

.emoji--sad .emoji__eyebrows:before {
    margin-left: -30px;
    transform: rotate(-30deg);
}

.emoji--sad .emoji__eyebrows:after {
    margin-left: 30px;
    transform: rotate(30deg);
}

.emoji--sad .emoji__eyes {
    width: 14px;
    height: 16px;
    left: calc(50% - 7px);
    top: 50px;
    border-radius: 50%;
    background: transparent;
    box-shadow: 25px 0 0 0 #000000, -25px 0 0 0 #000000;
}

.emoji--sad .emoji__eyes:after {
    background: #548DFF;
    width: 12px;
    height: 12px;
    margin-left: 6px;
    border-radius: 0 100% 40% 50% / 0 50% 40% 100%;
    transform-origin: 0% 0%;
    animation: tear-drop 2s ease-in infinite;
}

.emoji--sad .emoji__mouth {
    width: 60px;
    height: 80px;
    left: calc(50% - 30px);
    top: 80px;
    box-sizing: border-box;
    border: 6px solid #000000;
    border-radius: 50%;
    border-bottom-color: transparent;
    border-left-color: transparent;
    border-right-color: transparent;
    background: transparent;
    animation: sad-mouth 2s ease-in infinite;
}

.emoji--sad .emoji__mouth:after {
    width: 6px;
    height: 6px;
    background: transparent;
    border-radius: 50%;
    top: 4px;
    left: calc(50% - 3px);
    box-shadow: -18px 0 0 0 #000000, 18px 0 0 0 #000000;
}

.emoji--angry {
    background: linear-gradient(#D5234C -10%, #FFDA6A);
    background-size: 100%;
    animation: angry-color 2s ease-in infinite;
}

.emoji--angry .emoji__face {
    animation: angry-face 2s ease-in infinite;
}

.emoji--angry .emoji__eyebrows {
    left: calc(50% - 3px);
    top: 55px;
    height: 6px;
    width: 6px;
    border-radius: 50%;
    background: transparent;
    box-shadow: -44px 5px 0 0 #000000, -7px 16px 0 0 #000000, 7px 16px 0 0 #000000, 44px 5px 0 0 #000000;
}

.emoji--angry .emoji__eyebrows:before,
.emoji--angry .emoji__eyebrows:after {
    width: 50px;
    height: 20px;
    border: 6px solid #000000;
    box-sizing: border-box;
    border-radius: 50%;
    border-top-color: transparent;
    border-left-color: transparent;
    border-right-color: transparent;
    top: 0;
    left: calc(50% - 25px);
}

.emoji--angry .emoji__eyebrows:before {
    margin-left: -25px;
    transform: rotate(15deg);
}

.emoji--angry .emoji__eyebrows:after {
    margin-left: 25px;
    transform: rotate(-15deg);
}

.emoji--angry .emoji__eyes {
    width: 12px;
    height: 12px;
    left: calc(50% - 6px);
    top: 70px;
    border-radius: 50%;
    background: transparent;
    box-shadow: 25px 0 0 0 #000000, -25px 0 0 0 #000000;
}

.emoji--angry .emoji__mouth {
    width: 36px;
    height: 18px;
    left: calc(50% - 18px);
    bottom: 15px;
    background: #000000;
    border-radius: 50%;
    animation: angry-mouth 2s ease-in infinite;
}

@keyframes heart-beat {
    25% {
        transform: scale(1.1);
    }

    75% {
        transform: scale(0.6);
    }
}

@keyframes haha-face {

    10%,
    30%,
    50% {
        transform: translateY(25px);
    }

    20%,
    40% {
        transform: translateY(15px);
    }

    60%,
    80% {
        transform: translateY(0);
    }

    70%,
    90% {
        transform: translateY(-10px);
    }
}

@keyframes haha-mouth {

    10%,
    30%,
    50% {
        transform: scale(0.6);
        top: 45%;
    }

    20%,
    40% {
        transform: scale(0.8);
        top: 45%;
    }

    60%,
    80% {
        transform: scale(1);
        top: 50%;
    }

    70% {
        transform: scale(1.2);
        top: 50%;
    }

    90% {
        transform: scale(1.1);
        top: 50%;
    }
}

@keyframes yay {
    25% {
        transform: rotate(-15deg);
    }

    75% {
        transform: rotate(15deg);
    }
}

@keyframes wow-face {

    15%,
    25% {
        transform: rotate(20deg) translateX(-25px);
    }

    45%,
    65% {
        transform: rotate(-20deg) translateX(25px);
    }

    75%,
    100% {
        transform: rotate(0deg) translateX(0);
    }
}

@keyframes wow-brow {

    15%,
    65% {
        top: 25px;
    }

    75%,
    100%,
    0% {
        top: 15px;
    }
}

@keyframes wow-mouth {

    10%,
    30% {
        width: 20px;
        height: 20px;
        left: calc(50% - 10px);
    }

    50%,
    70% {
        width: 30px;
        height: 40px;
        left: calc(50% - 15px);
    }

    75%,
    100% {
        height: 50px;
    }
}

@keyframes sad-face {

    25%,
    35% {
        top: -15px;
    }

    55%,
    95% {
        top: 10px;
    }

    100%,
    0% {
        top: 0;
    }
}

@keyframes sad-mouth {

    25%,
    35% {
        transform: scale(0.85);
        top: 70px;
    }

    55%,
    100%,
    0% {
        transform: scale(1);
        top: 80px;
    }
}

@keyframes tear-drop {

    0%,
    100% {
        display: block;
        left: 35px;
        top: 15px;
        transform: rotate(45deg) scale(0);
    }

    25% {
        display: block;
        left: 35px;
        transform: rotate(45deg) scale(2);
    }

    49.9% {
        display: block;
        left: 35px;
        top: 65px;
        transform: rotate(45deg) scale(0);
    }

    50% {
        display: block;
        left: -35px;
        top: 15px;
        transform: rotate(45deg) scale(0);
    }

    75% {
        display: block;
        left: -35px;
        transform: rotate(45deg) scale(2);
    }

    99.9% {
        display: block;
        left: -35px;
        top: 65px;
        transform: rotate(45deg) scale(0);
    }
}

@keyframes hands-up {
    25% {
        transform: rotate(15deg);
    }

    50% {
        transform: rotate(-15deg) translateY(-10px);
    }

    75%,
    100% {
        transform: rotate(0deg);
    }
}

@keyframes thumbs-up {
    25% {
        transform: rotate(20deg);
    }

    50%,
    100% {
        transform: rotate(5deg);
    }
}

@keyframes angry-color {

    45%,
    60% {
        background-size: 250%;
    }

    85%,
    100%,
    0% {
        background-size: 100%;
    }
}

@keyframes angry-face {

    35%,
    60% {
        transform: translateX(0) translateY(10px) scale(0.9);
    }

    40%,
    50% {
        transform: translateX(-5px) translateY(10px) scale(0.9);
    }

    45%,
    55% {
        transform: translateX(5px) translateY(10px) scale(0.9);
    }
}

@keyframes angry-mouth {

    25%,
    50% {
        height: 6px;
        bottom: 25px;
    }
}

.content-pub {
    width: 100%;
    height: 400px;
    padding-top: 50px;
}

.content-pub .container-pub {
    max-width: 1080px;
    margin: 0 auto;
    display: flex;
    flex-direction: row;
    padding: 0 15px;
}

@media screen and (max-width: 415px) {
    .content-pub .container-pub {
        padding: 0 5px;
    }
}

.content-pub .container-pub .middle-contents-pub {
    flex-basis: 100%;
    padding: 10px 0;
}

.menu .public-buttons .button-rounded {
    border: 1px solid #dddfe2;
    border-radius: 3px;
    color: #ffffff;
    text-decoration: none;
    padding: 5px 10px;
    margin-right: 5px;
}

.menu .public-buttons .button-rounded {
    font-size: 12px;
}

@media screen and (min-width: 320px) {
    .menu .public-buttons .button-rounded {
        font-size: calc(12px + 2 * ((100vw - 320px) / 760));
    }
}

@media screen and (min-width: 1080px) {
    .menu .public-buttons .button-rounded {
        font-size: 15px;
    }
}

.menu .public-buttons .button-green {
    border: 1px solid #7bbb5e;
    border-radius: 3px;
    background: #7bbb5e;
    color: #ffffff;
    text-decoration: none;
    padding: 5px 10px;
}

.menu .public-buttons .button-green {
    font-size: 12px;
}

@media screen and (min-width: 320px) {
    .menu .public-buttons .button-green {
        font-size: calc(12px + 2 * ((100vw - 320px) / 760));
    }
}

@media screen and (min-width: 1080px) {
    .menu .public-buttons .button-green {
        font-size: 15px;
    }
}

.header-bg {
    background-position: top center;
    background-size: cover;
    background-repeat: no-repeat;
}

.minimal-user-profile-container {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
    padding: 10px 30px;
}

@media screen and (max-width: 768px) {
    .minimal-user-profile-container {
        padding: 10px 0;
    }
}

.minimal-user-profile-container .user-profile-minimal {
    position: relative;
    border-radius: 5px;
    border: 1px solid #dddfe2;
    margin-bottom: 15px;
}

.minimal-user-profile-container .user-profile-minimal .minimal-header {
    position: relative;
    padding-bottom: 150px;
}

.minimal-user-profile-container .user-profile-minimal .minimal-header .buttons {
    width: 93%;
    position: absolute;
    top: 0;
    display: flex;
    margin: 0 auto;
    justify-content: space-between;
    z-index: 99;
    padding: 10px;
}

.minimal-user-profile-container .user-profile-minimal .minimal-header .buttons a {
    padding: 5px 10px;
    color: #ffffff;
    text-decoration: none;
    background: rgba(0, 0, 0, 0.5);
    border-radius: 3px;
}

.minimal-user-profile-container .user-profile-minimal .minimal-header .buttons a {
    font-size: 12px;
}

@media screen and (min-width: 320px) {
    .minimal-user-profile-container .user-profile-minimal .minimal-header .buttons a {
        font-size: calc(12px + 1 * ((100vw - 320px) / 760));
    }
}

@media screen and (min-width: 1080px) {
    .minimal-user-profile-container .user-profile-minimal .minimal-header .buttons a {
        font-size: 13px;
    }
}

.minimal-user-profile-container .user-profile-minimal .minimal-header img {
    filter: brightness(0.4);
    opacity: 0.8;
    border-top-right-radius: 5px;
    border-top-left-radius: 5px;
}

.minimal-user-profile-container .user-profile-minimal .user-information {
    width: 100%;
    position: absolute;
    top: 60px;
    z-index: 99;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin: 0 auto;
}

.minimal-user-profile-container .user-profile-minimal .user-information img {
    border: 2px solid #dddfe2;
    width: 75px;
    height: 75px;
    border-radius: 100px;
}

.minimal-user-profile-container .user-profile-minimal .user-information h2 {
    margin: 10px 0 5px 0;
    padding: 0;
    color: #4b4f56;
}

.minimal-user-profile-container .user-profile-minimal .user-information h2 {
    font-size: 15px;
}

@media screen and (min-width: 320px) {
    .minimal-user-profile-container .user-profile-minimal .user-information h2 {
        font-size: calc(14px + 2 * ((100vw - 320px) / 760));
    }
}

@media screen and (min-width: 1080px) {
    .minimal-user-profile-container .user-profile-minimal .user-information h2 {
        font-size: 15px;
    }
}

.minimal-user-profile-container .user-profile-minimal .user-information span {
    color: #4b4f56;
}

.minimal-user-profile-container .user-profile-minimal .user-information span {
    font-size: 12px;
}

@media screen and (min-width: 320px) {
    .minimal-user-profile-container .user-profile-minimal .user-information span {
        font-size: calc(12px + 2 * ((100vw - 320px) / 760));
    }
}

@media screen and (min-width: 1080px) {
    .minimal-user-profile-container .user-profile-minimal .user-information span {
        font-size: 15px;
    }
}

.minimal-user-profile-container .user-profile-minimal .user-information a {
    margin-top: 20px;
    padding: 5px 15px;
    color: #0570f6;
    text-decoration: none;
    border: 1px solid #0570f6;
    border-radius: 3px;
}

.minimal-user-profile-container .user-profile-minimal .user-information a {
    font-size: 12px;
}

@media screen and (min-width: 320px) {
    .minimal-user-profile-container .user-profile-minimal .user-information a {
        font-size: calc(12px + 1 * ((100vw - 320px) / 760));
    }
}

@media screen and (min-width: 1080px) {
    .minimal-user-profile-container .user-profile-minimal .user-information a {
        font-size: 13px;
    }
}

.minimal-user-profile-container .user-profile-minimal .user-information a .icon {
    margin-right: 5px;
}

.pagination {
    display: flex;
    justify-content: flex-end;
    padding: 0 30px;
}

@media screen and (max-width: 768px) {
    .pagination {
        padding: 0 5px;
    }
}

.pagination ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: row;
    align-items: center;
}

.pagination ul li {
    margin: 10px;
}

@media screen and (max-width: 415px) {
    .pagination ul li {
        margin: 5px;
    }
}

.pagination ul li a {
    color: #4b4f56;
    text-decoration: none;
}

.pagination ul li a {
    font-size: 12px;
}

@media screen and (min-width: 320px) {
    .pagination ul li a {
        font-size: calc(12px + 2 * ((100vw - 320px) / 760));
    }
}

@media screen and (min-width: 1080px) {
    .pagination ul li a {
        font-size: 15px;
    }
}

.pagination ul li a.active {
    border-bottom: 1px solid #0570f6;
}

.pagination ul .np-button {
    display: inherit;
}

.pagination ul .np-button a {
    border: 1px solid #0570f6 !important;
    padding: 5px 10px;
    margin: 0 5px;
}

.footer-pub {
    background: #3570be;
    padding: 15px 0 0 0;
}

@media screen and (max-width: 768px) {
    .footer-pub {
        padding: 15px;
    }
}

.footer-pub .middle-contents-pub {
    max-width: 1080px;
    width: 100%;
    margin: 0 auto;
    padding: 10px 0;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

@media screen and (max-width: 415px) {
    .footer-pub .middle-contents-pub {
        flex-direction: column;
        justify-content: center;
        align-items: center;
        text-align: center;
    }
}

.footer-pub .middle-contents-pub .ft-heading {
    color: #ffffff;
}

.footer-pub .middle-contents-pub .left {
    width: 17%;
}

@media screen and (max-width: 415px) {
    .footer-pub .middle-contents-pub .left {
        width: 40%;
    }
}

.footer-pub .middle-contents-pub .left .ft-heading {
    text-transform: uppercase;
    margin: 10px 0;
}

.footer-pub .middle-contents-pub .left .alphabet-links {
    margin: 10px 0;
}

.footer-pub .middle-contents-pub .left .alphabet-links a {
    color: #ffffff;
    text-decoration: none;
    text-transform: uppercase;
}

.footer-pub .middle-contents-pub .left .alphabet-links a {
    font-size: 12px;
}

@media screen and (min-width: 320px) {
    .footer-pub .middle-contents-pub .left .alphabet-links a {
        font-size: calc(12px + 1 * ((100vw - 320px) / 760));
    }
}

@media screen and (min-width: 1080px) {
    .footer-pub .middle-contents-pub .left .alphabet-links a {
        font-size: 13px;
    }
}

.footer-pub .middle-contents-pub .middle .download-btns {
    display: flex;
    flex-direction: column;
    margin-top: 10px;
}

.footer-pub .middle-contents-pub .middle .download-btns a {
    padding: 10px 20px;
    display: flex;
    flex-direction: row;
    align-items: center;
    background: #2d68b5;
    border-radius: 5px;
    margin: 5px 0;
    color: #ffffff;
    text-decoration: none;
}

.footer-pub .middle-contents-pub .middle .download-btns a {
    font-size: 12px;
}

@media screen and (min-width: 320px) {
    .footer-pub .middle-contents-pub .middle .download-btns a {
        font-size: calc(12px + 1 * ((100vw - 320px) / 760));
    }
}

@media screen and (min-width: 1080px) {
    .footer-pub .middle-contents-pub .middle .download-btns a {
        font-size: 13px;
    }
}

.footer-pub .middle-contents-pub .middle .download-btns a .icon {
    font-size: 30px;
    padding-right: 10px;
}

@media screen and (max-width: 415px) {
    .footer-pub .middle-contents-pub .right {
        margin-top: 5px;
    }
}

.footer-pub .middle-contents-pub .right .useful-links {
    list-style: none;
    margin: 0;
    margin-top: 10px;
    padding: 0;
}

.footer-pub .middle-contents-pub .right .useful-links li {
    margin-bottom: 3px;
}

.footer-pub .middle-contents-pub .right .useful-links li a {
    color: #ffffff;
    text-decoration: none;
}

.footer-pub .middle-contents-pub .right .useful-links li a {
    font-size: 12px;
}

@media screen and (min-width: 320px) {
    .footer-pub .middle-contents-pub .right .useful-links li a {
        font-size: calc(12px + 1 * ((100vw - 320px) / 760));
    }
}

@media screen and (min-width: 1080px) {
    .footer-pub .middle-contents-pub .right .useful-links li a {
        font-size: 13px;
    }
}

.footer-pub .copyright {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    background: #0570f6;
}

@media screen and (max-width: 415px) {
    .footer-pub .copyright .links {
        margin-bottom: 5px;
    }
}

.footer-pub .copyright .links ul {
    list-style: none;
    display: flex;
    margin: 0;
    padding: 0;
}

.footer-pub .copyright .links ul li {
    color: #ffffff;
    margin-right: 5px;
}

.footer-pub .copyright .links ul li {
    font-size: 12px;
}

@media screen and (min-width: 320px) {
    .footer-pub .copyright .links ul li {
        font-size: calc(12px + 1 * ((100vw - 320px) / 760));
    }
}

@media screen and (min-width: 1080px) {
    .footer-pub .copyright .links ul li {
        font-size: 13px;
    }
}

.footer-pub .copyright .links ul li a {
    color: #ffffff;
    text-decoration: none;
}

.footer-pub .copyright .copyright-text span {
    color: #ffffff;
}

.footer-pub .copyright .copyright-text span {
    font-size: 12px;
}

@media screen and (min-width: 320px) {
    .footer-pub .copyright .copyright-text span {
        font-size: calc(12px + 1 * ((100vw - 320px) / 760));
    }
}

@media screen and (min-width: 1080px) {
    .footer-pub .copyright .copyright-text span {
        font-size: 13px;
    }
}

.top-hundred .search-form {
    padding: 10px 0;
}

.top-hundred .search-form .search-form-inner {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    border: 1px solid #dddfe2;
    border-radius: 5px;
    padding: 30px 0;
}

.top-hundred .search-form .search-form-inner .inline-form {
    align-items: center;
    justify-content: center;
    width: 100%;
}

.top-hundred .search-form .search-form-inner .inline-form lable {
    color: #ffffff;
    margin: 0 5px;
}

.top-hundred .search-form .search-form-inner .inline-form input {
    border: none;
    border-radius: 3px;
    padding: 10px;
    margin: 0 5px;
    width: 30%;
}

.top-hundred .search-form .search-form-inner .inline-form select {
    border: none;
    border-radius: 3px;
    padding: 8px;
    margin: 0 5px;
    width: 20%;
}

.top-hundred .search-form .search-form-inner .inline-form .search-button {
    border-radius: 3px;
    padding: 10px;
    margin: 0 5px;
    background: #7bbb5e;
    color: #ffffff;
}

.top-hundred .top-hundred-container {
    background: #ffffff;
    border-radius: 5px;
    padding: 30px 50px;
}

@media screen and (max-width: 768px) {
    .top-hundred .top-hundred-container {
        padding: 30px 7px;
    }
}

.top-hundred .top-hundred-container .heading-container {
    text-align: center;
    width: 45%;
    margin: 0 auto;
}

@media screen and (max-width: 768px) {
    .top-hundred .top-hundred-container .heading-container {
        width: 100%;
    }
}

.top-hundred .top-hundred-container .heading-container .heading {
    font-size: 28px;
    color: #0570f6;
}

.top-hundred .top-hundred-container .navigation ul {
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    padding: 15px 0;
    border-top: 1px solid #dddfe2;
    border-bottom: 1px solid #dddfe2;
}

.top-hundred .top-hundred-container .navigation ul .title {
    color: #0570f6;
}

.top-hundred .top-hundred-container .navigation ul li {
    margin: 0 10px;
}

@media screen and (max-width: 768px) {
    .top-hundred .top-hundred-container .navigation ul li {
        margin: 10px;
    }
}

.top-hundred .top-hundred-container .navigation ul li a {
    color: #4b4f56;
    text-decoration: none;
}

.top-hundred .top-hundred-container .navigation ul li a {
    font-size: 12px;
}

@media screen and (min-width: 320px) {
    .top-hundred .top-hundred-container .navigation ul li a {
        font-size: calc(12px + 2 * ((100vw - 320px) / 760));
    }
}

@media screen and (min-width: 1080px) {
    .top-hundred .top-hundred-container .navigation ul li a {
        font-size: 15px;
    }
}

.top-hundred .top-hundred-container .navigation ul li select {
    border-radius: 5px;
    border-color: transparent;
    background-color: #eeeff3;
    height: 26px;
    display: inline-block;
}

@media screen and (max-width: 768px) {
    .top-hundred .top-hundred-container .navigation ul li select {
        display: inline-block;
    }
}

.top-hundred .top-hundred-container .navigation ul li select {
    font-size: 12px;
}

@media screen and (min-width: 410px) {
    .winner_detail {
        margin: 11px 20px;
    }
}

@media screen and (min-width: 320px) {
    .top-hundred .top-hundred-container .navigation ul li select {
        font-size: calc(12px + 2 * ((100vw - 320px) / 760));
    }

    .winner_detail {
        margin: 7px;
    }

    /* .winner_users{
     display: flex;
     flex-flow: column !important;
     margin-top: -60px; 
    
    }  */
}

@media screen and (min-width: 1080px) {
    .top-hundred .top-hundred-container .navigation ul li select {
        font-size: 15px;
    }

    .winner_detail {
        margin: 20px;
    }

}

.who_liked_container {
    width: 100%;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    border-bottom: 1px solid #fff;
}

.who_liked {
    display: flex;
    width: 50%;
    margin-bottom: 10px;
}

.user_profile {
    position: relative;
    margin-right: 10px;
}

.user_image a img {
    border-radius: 100px;
    border: 1px solid #d2d2d2;
}

.user_like_icon {
    position: absolute;
    right: 5px;
    top: 5px;
}

.user_like_icon img {
    width: 20px;
    border: 2px solid #d2d2d2;
    border-radius: 20px;
}

h2.liked_username a {
    font-weight: 500;
    font-size: 1.2rem;
    margin-bottom: 0;
    padding-bottom: 0;
}

p.liked_time {
    margin: 0;
    position: relative;
    bottom: 10px;
}

a.add_friend_liked {
    background: #fff;
    padding: 5px 10px;
    border-radius: 3px;
    border: 1px solid #dadada;
    font-size: 13px;
}

.bg-cmt {
    background: #eaeaea;
}

.load_more_liked {
    display: block;
    background: #fff;
    width: 87px;
    height: 30px;
    border-radius: 3px;
    border: 1px solid #dadada;
    font-size: 13px;
    text-align: center;
    padding: 0 5px;
    line-height: 28px;
    margin: 0 auto;
    margin-top: 10px;
}

@media screen and (max-width: 768px) {
    .who_liked {
        width: 100%;
    }

}

.Property_post {
    margin-bottom: 10px;
}

.Property_post h5 {
    margin: 5px 0;
    color: #4b4f56;
}

.post .post-content .Property_post p a {
    color: #4b4f56;
    margin: 5px 0;
    padding: 0;
    font-weight: bold;
    font-size: 15px;
}

.post .post-content .Property_post address {
    font-style: normal;
    font-size: 13px;
}

.post .post-promo-meta .post-promo a.property_btn {
    border: 1px solid #0570f6;
    border-radius: 3px;
    color: #0570f6;
    margin: 0 1px;
}

.post .post-promo-meta .post-promo a.apply-app-btn,
.post .post-promo-meta .post-promo a.view-app-btn {
    color: #fff;
    background-color: #0570f6;
    margin: 0 0 0 6px;
    border-radius: 5px;
}

.pst_like {
    margin: 0 15px;
}

.post_like:hover img {
    transform: scale(1.2);
    transition: 0.2s all;
}

.lds-ellipsis {
    display: inline-block;
    position: relative;
    width: 64px;
    height: 20px;
}

.lds-ellipsis div {
    position: absolute;
    top: 5px;
    width: 11px;
    height: 11px;
    border-radius: 50%;
    background: #0570f6;
    animation-timing-function: cubic-bezier(0, 1, 1, 0);
}

.lds-ellipsis div:nth-child(1) {
    left: 6px;
    animation: lds-ellipsis1 0.6s infinite;
}

.lds-ellipsis div:nth-child(2) {
    left: 6px;
    animation: lds-ellipsis2 0.6s infinite;
}

.lds-ellipsis div:nth-child(3) {
    left: 26px;
    animation: lds-ellipsis2 0.6s infinite;
}

.lds-ellipsis div:nth-child(4) {
    left: 45px;
    animation: lds-ellipsis3 0.6s infinite;
}

@keyframes lds-ellipsis1 {
    0% {
        transform: scale(0);
    }

    100% {
        transform: scale(1);
    }
}

@keyframes lds-ellipsis3 {
    0% {
        transform: scale(1);
    }

    100% {
        transform: scale(0);
    }
}

@keyframes lds-ellipsis2 {
    0% {
        transform: translate(0, 0);
    }

    100% {
        transform: translate(19px, 0);
    }
}

/* Reaction Popup */

li {
    list-style: none;
}

a {
    text-decoration: none;
    color: black;
}

.user-reaction-popup,
.user-action-popup {
    background-color: #fff;
    max-width: 500px;
    width: 500px;
    max-height: 600px;
    height: 600px;
    margin: auto;
    border-radius: 2px;
    box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.2);
    display: flex;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    transition: all ease-in-out 0.4s;
    border-radius: 3px;
}

@media screen and (max-width: 415px) {

    .user-reaction-popup,
    .user-action-popup {
        height: 500px;
        width: 340px;
    }

}

@media screen and (max-width: 320px) {

    .user-reaction-popup,
    .user-action-popup {
        height: 500px;
        width: 300px;
    }
}

.user-reaction-popup-wrapper {
    padding: 5px 10px 10px 10px;
    flex-basis: 100%;
}

.user-reaction-popup-icon-group {
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    align-items: center;
}

.user-reaction-popup-icon-group img {
    width: 20px;
    margin: 0;
}

.user-reaction-popup-icon-group p {
    font-size: 14px;
}

.user-reaction-popup-icon-group span {
    font-size: 12px;
    color: #000;
    margin-left: 3px;
}

.user-reaction-popup-icon-ul {
    display: flex;
}

.user-reaction-popup-icon-li {
    padding: 11px 5px 5px 3px;
    margin: 3px;
    position: relative;
    top: -5px;
}

.user-reaction-popup-top-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid rgba(0, 0, 0, .1);

}

.user-reacted-detail {

    display: flex;
}

.user-reaction-img {
    margin: 15px -5px 10px 10px;
    display: inline-block;
    position: relative;
    flex: 1;
}

.post .post-reactions .reactions ul li .user-reaction-img img {
    width: 40px;
    border-radius: 50%;
    margin-right: 10px;
    border: 1px solid #ededed;
    height: 40px;
    object-fit: cover;
}

.post .post-reactions .counters ul li .user-reaction-img img {
    width: 40px;
    border-radius: 50%;
    margin-right: 10px;
    border: 1px solid #ededed;
    height: 40px;
    object-fit: cover;
}

.user-reacted-reaction {
    position: absolute;
    right: 0px;
    bottom: -2px;
}

.user-reacted-reaction img {
    width: 20px;
    height: 20px;
    border: 3px solid #fff;
}

.reacted-user-name {
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    flex-direction: column;
    margin-top: 20px;
    flex: 5;
    transition: all ease-in-out .6s;
}

.reacted-user-btn {

    flex: 3;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    align-items: center;
}

.reated-mutual-friends {
    color: rgba(0, 0, 0, .6);
    font-size: 12px;
}

.user-reacted-wrapper {
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    flex: 7;
    transition: all ease-in-out .2s;
    border-bottom: 1px solid rgba(0, 0, 0, .1);
}

.user-reaction-close-modal svg,
.user-action-close-modal svg {
    width: 12px;
    color: #333;
}

.btn-theme-border {
    border: 1px solid #c8d5ef !important;
}

.reacted-user-btn {
    color: #0570f6;

}

.reacted-user-btn-icon {
    border: 1px solid #c8d5ef;
    padding: 5px;
    border-radius: 3px;
    color: #0570f6;
}

span.reacted-user-btn-icon svg {
    margin: 0;
    width: 13px;
}

.reacted-user-btn svg {
    width: 16px;
    color: #0570f6;
    margin-right: 5px;
}

li.active-reacted {
    border-bottom: 2px solid #0570f6;
}


.user-reaction-popup-body-ul::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
    border-radius: 10px;
    /* background-color: #F5F5F5; */
    opacity: 0.5;
    -moz-opacity: 0.5;
}

.user-reaction-popup-body-ul::-webkit-scrollbar {
    width: 6px;
    /* background-color: #F5F5F5; */
    opacity: 0.5;
    -moz-opacity: 0.5;
}

.user-reaction-popup-body-ul::-webkit-scrollbar-thumb {
    border-radius: 5px;
    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, .1);
    background-color: #555;
    opacity: 0.5;
    -moz-opacity: 0.5;
}

.post .post-reactions .reactions ul.user-reaction-popup-body-ul,
.post .post-reactions .counters ul.user-reaction-popup-body-ul {
    height: 500px;
    overflow-y: auto;
    overflow-x: hidden;
    -webkit-overflow-scrolling: touch;
    display: block !important;
}

.post .post-reactions .counters ul li {
    margin-left: -5px;
    margin-top: 3px;
}

@media screen and (max-width: 415px) {
    .post .post-reactions .reactions ul.user-reaction-popup-body-ul {
        height: 424px;
        overflow-y: auto;
        overflow-x: hidden;
        scroll-behavior: smooth;
        display: inline-block;
        width: 100%;
    }

    .post .post-reactions .reactions div.user-reaction-popup-body {
        overflow: hidden;
        padding: 10px 0;
    }

    .post .post-reactions .counters ul.user-reaction-popup-body-ul {
        height: 424px;
        overflow-y: auto;
        overflow-x: hidden;
        scroll-behavior: smooth;
        display: inline-block;
        width: 100%;
    }

    .post .post-reactions .counters div.user-reaction-popup-body {
        overflow: hidden;
        padding: 10px 0;
    }
}

@media screen and (max-width: 600px) {
    .user-reaction-popup {
        width: 560px;
        transition: all ease-in-out .3s;
    }
}

@media screen and (max-width: 560px) {
    .user-reaction-popup {
        width: 460px;
        transition: all ease-in-out .3s;
    }

    .reacted-user-name {
        flex: 3;
        transition: all ease-in-out .3s;
    }
}

@media screen and (max-width: 490px) {
    .user-reaction-popup {
        width: 360px;
        transition: all ease-in-out .3s;
    }

    .reacted-user-name {
        flex: 5;
        transition: all ease-in-out .3s;
    }

    .user-reacted-wrapper {
        flex-direction: row;
        transition: all ease-in-out .3s;
    }

    .reacted-user-name a h4 {
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        width: 120px;
    }


}


.loader {
    border: 4px solid #f3f3f3;
    border-radius: 50%;
    border-top: 4px solid #0570f6;
    width: 25px;
    height: 25px;
    -webkit-animation: spin 0.8s reverse-linear infinite;
    animation: spin 0.8s reverse infinite;
}


@-webkit-keyframes spin {
    0% {
        -webkit-transform: rotate(360deg);
    }

    100% {
        -webkit-transform: rotate(0deg);
    }
}

@keyframes spin {
    0% {
        transform: rotate(360deg);
    }

    100% {
        transform: rotate(0deg);
    }
}


.loader-holder {
    display: flex;
    justify-content: center;
    position: relative;
    margin-top: 30px;
}

.post .post-reactions .reactions ul.user-reaction-popup-body-ul .user-reaction-popup-body-li .user-reacted-detail a .user-reaction-img .user-reacted-reaction .twentyPx {
    width: 16px;
    height: 16px;
}

.post .post-reactions .counters ul.user-reaction-popup-body-ul .user-reaction-popup-body-li .user-reacted-detail a .user-reaction-img .user-reacted-reaction .twentyPx {
    width: 16px;
    height: 16px;
}

.p_container {
    background-color: rgba(0, 0, 0, 0.4);
    left: -50%;
    width: 180%;
    position: fixed;
    height: 153%;
    top: 0;
    z-index: 1050;
}

.disable-scrooll {
    position: static;
    overflow-y: hidden;
    padding-right: 15px;
}

.rp-middle {
    justify-content: center;
    align-items: center;
    height: 300px;
    width: 300px;
}

.loader-middle {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
}

@media screen and (max-width: 490px) {
    .user-reaction-popup {
        /* height: 500px; */
    }

    .user-reaction-popup {
        /*width: 300px;*/
        width: 95%;
    }
}

.emoticons .pst_like {
    cursor: pointer;
}

.commentsholder {
    /*padding: 0 10px;*/
}

.post .post-actions ul li a .color-red {
    color: #D90700;
}

.r-advert {
    width: 100%;
    display: inline-block;
    margin: 0;
    padding: 5px 0;
    height: 30px;
}

.repost-revenue {
    padding: 1px 10px;
    height: 20px;
    display: inline-block;
    text-align: center;
    line-height: 19px;
}

.lds-ellipsis-b {
    display: inline-block;
    height: 18px;
    margin: 0 auto;
    width: 100%;
    bottom: 17px;
    position: relative;
    left: -50%;
    right: 50%;
    transform: translate(90%, 50%);
}

.lds-ellipsis-b div {
    position: absolute;
    top: 35px;
    width: 11px;
    height: 11px;
    border-radius: 50%;
    background: #0570f6;
    animation-timing-function: cubic-bezier(0, 1, 1, 0);
}

.lds-ellipsis-b div:nth-child(1) {
    left: 6px;
    animation: lds-ellipsis1 0.6s infinite;
}

.lds-ellipsis-b div:nth-child(2) {
    left: 6px;
    animation: lds-ellipsis2 0.6s infinite;
}

.lds-ellipsis-b div:nth-child(3) {
    left: 26px;
    animation: lds-ellipsis2 0.6s infinite;
}

.lds-ellipsis-b div:nth-child(4) {
    left: 45px;
    animation: lds-ellipsis3 0.6s infinite;
}

@keyframes lds-ellipsis1 {
    0% {
        transform: scale(0);
    }

    100% {
        transform: scale(1);
    }
}

@keyframes lds-ellipsis3 {
    0% {
        transform: scale(1);
    }

    100% {
        transform: scale(0);
    }
}

@keyframes lds-ellipsis2 {
    0% {
        transform: translate(0, 0);
    }

    100% {
        transform: translate(19px, 0);
    }
}

.friends-new-sec {
    display: flex;
    justify-content: flex-start;
    align-items: center;
}

.friends-new-sec a img {
    border-radius: 50px;
    width: 50px;
    height: 50px;
}

.pymk {
    display: flex;
    justify-content: flex-start;
    align-items: center;
}

.pymk-u-data h5 a {
    width: 98%;
    color: #000;
}

.pymk-u-data {
    padding-left: 10px;
    width: 48%;
}

article .friends-new-sec .pymk-u-data {
    flex: 1;
}

/*article .friends-new-sec .btn-group.pymk{*/
/*display: block;*/
/*}*/
article .friends-new-sec .btn-group.pymk .removeRequest {
    background-color: #a5acaf;
    padding: 5px 10px;
    margin-right: 0;
}

article .friend-requests .friends-new-sec .btn-group.pymk .removeRequest {
    background-color: #dddddd;
}

.pymk-u-data span {
    width: 100%;
    display: block;
}

.margin-r-5 {
    margin-right: 5px;
}

.comment-verif-icon-holder {
    position: relative;
    display: block;
    float: left;
}

.comment-verif-icon {
    position: absolute;
    right: -43px;
    bottom: -41px;
    background: #fff;
    border-radius: 30px;
    padding: 2px;
}

.post-comment-holder .user-comment.parent .comment-verif-icon-holder .comment-verif-icon {
    right: -2px;
    bottom: 0;
}

.comment-verif-icon-textarea {
    position: absolute;
    right: 3px;
    bottom: -3px;
    background: #fff;
    border-radius: 30px;
    padding: 2px;
    transform: scale(0.8);
}

.repost-holder {
    padding: 0 15px;
}

.repost-holder .post-header {
    border-top: none;
    margin-left: 0;
    margin-top: 4px;
    border-left: 2px solid #0570f6;
}

.repost-holder .post-content {
    margin-left: 0;
    border-left: 2px solid #0570f6;
    margin-bottom: 20px;
    padding-bottom: 0;
}

.repost-holder .post-media,
.repost-holder .post-img,
.repost-holder .ytb-cover {
    border-left: 2px solid #0570f6;
    padding-left: 10px;
    margin-bottom: 10px;
    margin-left: 0;
}

.repost-holder .first-repost {
    border-top: 2px dotted #dddfe2;
}

.repost-holder .first-repost .post-header {
    padding-top: 0;
    margin-top: 15px;
}

.main-repost .post-header {
    border-left: none;
    padding: 15px 15px 5px 15px;
    margin-top: 0;
}

.main-repost .post-content {
    border-left: none;
    padding: 0 15px;
    margin-bottom: 10px;
}

.repost-holder .main-repost .post-media,
.repost-holder .main-repost .post-img,
.repost-holder .main-repost .ytb-cover {
    border-left: none;
    padding: 15px;
    margin-bottom: 0;
}

.repost-holder .main-repost .post-media a,
.repost-holder .main-repost .post-img a,
.repost-holder .main-repost .ytb-cover a {
    height: auto !important;
}

.repost-holder .main-repost {
    border: 1px solid #dddfe2;
    border-radius: 15px;
    margin-bottom: 15px;
    overflow: hidden;
}

.repost-holder .post-img {
    padding: 0 !important;
}

.post-type-border {
    border-right: 1px solid #d0d0d0;
    padding-right: 10px;
    line-height: 20px;
    color: #0570f6;
    font-size: 16px !important;
    font-family: 'Roboto', sans-serif;
    font-weight: 500 !important;
    display: flex;
    height: 60px;
    align-items: center;
    padding: 10px;
}

.repost-header {
    display: inline;
    align-items: center;
    padding: 10px 15px;
    width: 100%;
}

.post .revenue .repost-header {
    font-weight: 700;
}

.repost-header a {
    font-weight: 700;
    color: #0570f6;
}

.repost-header-text {
    padding-right: 10px;
    font-weight: 700;
}

.advert-repost {
    height: 62px;
    display: flex;
    align-items: center;
    border-left: 1px solid #d0d0d0;
    padding-left: 10px;
    margin-left: 10px;
    padding-right: 10px;
}

.post .post-content p a.hashify {
    display: inline-block;
    color: #0073b1;
    font-weight: 400;
}

.post .post-promo-meta .job_pst_actions a.property_btn {
    border-radius: 0;
}

#MostTrending a {
    color: #0073b1;
    font-weight: 700;
}

.post-content.sociotube_video_title a {
    margin-bottom: 10px;
    font-weight: bold;
    color: #427dcc;
}

.post .post-reactions .counters {
    display: flex;
    flex-direction: row;
    align-items: center;
}

.post .post-reactions .counters ul {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    flex-direction: row;
    justify-content: center;
}

.post .post-reactions .counters ul li {
    margin-left: 5px;
    cursor: pointer;
}

.post .post-reactions .counters ul li a .icon {
    color: #0570f6;
    font-weight: 400;
}

.post .post-reactions .counters span {
    font-size: 15px;
    margin-left: 1px;
    font-family: roboto-regular;
}

.post .post-reactions .counters ul li span i {
    color: #7f7f7f;
    font-weight: 400;
    font-size: 19px;
}

.post .post-reactions .counters span {
    margin-left: 5px;
    line-height: 1px;
}

.repost-holder .post-content p {
    font-size: 15px;
    color: #1d2129;
}

.repost-holder .post-content.clr_pst {
    margin-bottom: 0;
}

.repost-holder .post-content.color-white.clr_pst p {
    color: #fff;
}

.adverholder .adv-post {
    display: flex;
    padding: 10px 0;
    align-items: center;
}

.adverholder .lftcntpd {
    padding-left: 10px;
    flex: 1;
    line-height: 18px;
}

.adverholder .lftcntpd a {
    display: block;
    padding-left: 0;
}

.adverholder .lftcntpd a h5 {
    font-family: roboto-medium;
    font-weight: 400;
    font-size: 15px;
}

.adverholder .post-promot-dropdown {
    display: flex;
    padding: 2px;
}

.adverholder .post-promot-dropdown a {
    margin-left: 15px;
}

.adverholder .post-promot-dropdown a i {
    color: #7f7f7f;
    font-size: 26px;
}

.adverholder .post-promot-dropdown a i.fa-ellipsis-h {
    font-size: 30px;
}

.adverholder .lftcntpd h5>a {
    color: #171717;
    font-family: roboto-medium;
    font-size: 15px;
    font-weight: 400;
}

.adverholder .promotion-socio-youtube .lftcntpd h5>a {
    text-transform: capitalize;
}

.adverholder .promotion-socio-youtube a.socio-channel {
    background-color: #cc0900;
    color: #fff;
    font-family: roboto-medium;
    border-radius: 6px;
    padding: 4px 8px;
    display: flex;
    align-items: center;
}

.adverholder .promotion-socio-youtube a.socio-channel i {
    color: #fff;
    margin-right: 6px;
    font-size: 22px;
}

.adverholder .promotion-socio-youtube .adv-post {
    align-items: center;
}

.adverholder .lftcntpd span {
    font-size: 13px;
    color: #5f6670;
    font-family: roboto-regular;
}

.adverholder .advprv {
    border-top: 1px solid #dddfe2;
}

.promotion-area .promot-detail {
    display: flex;
    margin: 0 0 15px 0;
    background-color: #f6f7f9;
    align-items: center;
    display: none;
}

.promotion-area .promot-detail .promo-d-bg {
    min-width: 186px;
    min-height: 120px;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}

.promotion-area .promot-detail .promo-d-bg img {
    display: none;
}

.promotion-area .promot-detail .promo-text {
    padding-left: 18px;
}

.promotion-area .promot-detail .promo-text h1 {
    border: none;
    color: #525252;
    font-family: roboto-bold;
    font-size: 18px;
    padding: 5px 0 3px 0;
    background-color: transparent;
}

.promotion-area .promot-detail .promo-text p {
    color: #525252;
    font-family: roboto-regular;
    font-size: 15px;
    line-height: 1.2;
}


.winitquiz_results {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background: #F7F8FA;
    padding-top: 80px;
    margin-bottom: 15px;
    position: relative;
    max-width: 100%;
    font-size: 15px;
    background-image: url(https://images.socioon.com/assets/images/win-it-winners-bg1.png);
    background-position: center top;
    background-size: 100%;
    background-repeat: no-repeat;
}

.winners-heading h1 {
    font-size: 20px;
    color: #417bc7;
    font-weight: 400;
    /* padding: 1px 50px 8px 50px; */
    border-radius: 30px;
    border: 0;
    font-family: roboto-medium;
}

.winner_users {
    display: flex;
    flex-flow: row;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
}

.winner_detail {
    display: flex;
    flex-flow: column;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.winner_detail a {
    position: relative;
}

.correct_ans {
    top: 0px;
    right: -8px;
    position: absolute;
    background-color: #79b535;
    text-align: center;
    -webkit-border-radius: 2px;
    border-radius: 2px;
    color: #fff;
    font-size: 15px;
    padding: 0 2px;
    height: 24px;
    min-width: 24px;
    line-height: 1.4;
    border-radius: 50px;
    border: 2px solid #fff;

}

.winitquiz_results .winner_detail a img {
    width: 65px;
    border-radius: 50%;
    height: 65px;
    margin-bottom: 5px;
}

.text_color {
    color: #1d2129;
}

.heading-text_color {
    color: #fff !important;
}

.post-logo.td {
    margin-right: 10px;
}

.quiz-game-buttons {
    margin-top: 8px;
}

.timer-post {
    border: 1px solid #0570f6;
    color: #0570f6;
    font-weight: bold;
    border-radius: 4px;
    text-align: center;
    padding: 10px;
    margin: 10px 0 0px 0;
    font-size: 18px;
}

.post-header.table.w96 {
    margin-bottom: 15px;
    border: 1px solid #dddfe2;
    background-color: #fff;
}

.post-banner.td {
    padding-bottom: 4px;
}

.post-banner.td img {
    width: 100%;
}

.post-header.table.w96 .post-user-info.td {
    padding: 0 10px 10px 10px;
}

.win-it-quiz-create-btn {
    cursor: pointer;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -o-border-radius: 4px;
    border-radius: 4px;
    text-align: center;
    font-size: 15px;
    /* font-weight: 500; */
    padding: 2%;
    background-color: #0570f6;
    color: #fff;
    margin: 4px 15px 15px 15px;
}

.win-it-quiz-create-btn a {
    color: #fff;
}

.no-pointer {
    pointer-events: none;
}

.win-it-quiz-create-btn a {
    padding: 10px 100px;
    font-family: Roboto-regular;
}

.winit-winner-title {
    font-size: 15px;
    font-weight: 600;
}

.position-color {
    color: #417bc7;
    font-weight: 500;
}

.light-gray-color {
    color: #666666;
}

.text-padding {
    padding: 0 10px;
    text-align: center;
}

.winner_detail:first-child .position-color i {
    color: #D4AF37;
}

.winner_detail:nth-child(2) .position-color i {
    color: #C0C0C0;
}

.winner_detail:nth-child(3) .position-color i {
    color: #cd7f32;
}

.post_btn.create-new-post-btn {
    background: #0570f6;
    color: #fff;
    position: relative;
    font-size: .9286rem;
    padding: 7px 16px 9px 16px;
}

.post_btn.create-new-post-btn button#m_pst_btn {
    position: absolute;
    right: 6px;
    top: 3px;
    border-left: 1px solid #fff !important;
    border-radius: 0;
    width: auto;
    height: auto;
    padding: 8px 11px 7px 11px;
    font-size: 0.9286rem;
}

.advert a {
    font-size: 15px;
    font-family: roboto-medium;
}

.prop-side-widget-goldenwall {
    padding: 10px 10px 15px 10px;
}

.replies .user-comment .user-comment-right .dropdown-toggle {
    font-size: 10px;
    margin-left: 15px;
}

.user-comment .user-comment-right .dropdown-toggle {
    text-decoration: underline;
}

.messanger-container .messanger-serach i {
    padding: 10px 9px 10px 10px;
    border-right: 1px solid rgba(0, 0, 0, 0.1);
}

.set-h-view h5 span.font-12 {
    display: block;
    width: 100%;
}

.friend-widget .lftcntpd.pymk-u-data {
    width: 170px;
    overflow: hidden;
}

.friend-widget .lftcntpd.pymk-u-data h5 {
    width: 100%;
}

.friend-widget .friends-new-sec .btn-ignore-user {
    background-color: #ddd;
}

/********************************************************/
.virus-widget {
    background-color: #fff;
}

.virus-widget .vw-count {
    display: flex;
    align-items: center;
    padding: 15px 15px 0px 15px;
}

.virus-widget .vw-total {
    display: flex;
    flex: 1;
}

.vw-funds {
    text-align: center;
}

.vw-funds h2 {
    color: #1b1e63;
    font-size: 15px;
    font-family: roboto-medium;
    font-weight: 400;
    margin-bottom: 12px;
}

.vw-funds div {
    background-color: #eeeff3;
    padding: 18px 0;
    border-radius: 6px;
}

.vw-funds div p {
    color: #5e5e5e;
    font-size: 15px;
    font-family: roboto-medium;
    font-weight: 400;
    margin-bottom: 0;
}

.vw-funds:last-child {
    margin-left: 16px;
}

.vw-links {
    display: flex;
    /*justify-content: space-evenly;*/
    text-align: center;
    padding: 15px 0;
    border-top: 2px solid #eeeff3;
}

.vw-link {
    margin-left: 8px;
}

.vw-links a {
    background-color: #0570f6;
    color: #fff;
    font-family: roboto-medium;
    font-weight: 400;
    font-size: 15px;
    width: 100%;
    display: block;
    padding: 6px 12px;
    border-radius: 4px;
}

.vw-links .vw-green a {
    background-color: #0cba6a;
}

.vw-links p {
    color: #5f5f5f;
    font-weight: 600;
    font-size: 13px;
    margin: 5px 0 0 0;
}

.vw-links .vw-green a {
    background-color: #0cba6a;
}

.vw-links .vw-red a {
    background-color: #de4509;
}

.vw-links .vw-blue2 a {
    background-color: #4da0ff;
}

/*.post-promo-meta.post-donate{*/
/*border-bottom: 1px solid #dddfe2;*/
/*}*/
.post .post-promo-meta.post-donate .post-promo a.coffee {
    background: #216dcf;
}

.post .post-promo-meta.post-donate .post-promo a.great-job,
.post .post-promo-meta.post-donate .post-promo a span.grtjob {
    background: #19be62;
}

.donate-new-post {
    background-color: #ffffff;
    color: #fff;
    text-align: center;
    padding: 1% 15px 0 15px;
}

.donate-new-post img {
    margin-bottom: 15px;
}

.donate-new-post img.socioicon {
    margin: 0;
}

.donate-new-post.withdrawls {
    /*background-color: #1f68ce;*/
    background-image: url(https://images.socioon.com/assets/images/bg.svg);
    color: #fff;
    text-align: center;
    padding: 14% 8%;
    background-size: cover;
    background-repeat: no-repeat;
}

.donate-new-post.withdrawls h2 {
    margin-bottom: 12px;
    font-size: 22px;
    color: #fff;
}

.donate-new-post.withdrawls p {
    font-size: 18px;
    color: #000;
    font-weight: 600;
    margin-bottom: 3px;
}

.donate-new-post.withdrawls p span {
    display: block;
    margin-top: 20px;
    font-size: 13px;
}

.donate-new-post h2 {
    margin-bottom: 14px;
    font-size: 22px;
    color: #1f68ce;
}

.donate-new-post p {
    color: #000;
    font-weight: 600;
    font-size: 15px;
    margin-bottom: 3px;
}

.post .donate-new-post .post-actions-holder {
    margin: 0;
}

.post-promo-meta.post-donate {
    /* padding: 0; */
}

.adv-post a.new-design-btn,
.adv-post button.new-design-btn {
    align-self: center;
    padding: 10px 16px;
}


/*.overlay-see-phpto{*/
/*display: none;*/
/*}*/
.post-img .blurImage {
    filter: blur(40px);
    height: 100%;
}

.post-img.smig {
    overflow: hidden;
}

.three-images {
    display: flex;
    min-height: 196px;
}

.three-images .pos-rel {
    overflow: hidden;
}

.three-images a {
    display: block;
    width: 100%;
    height: 100%;
}

.three-images .overlay-see-phpto {
    /* display: none; */
    width: 195px;
    height: 196px;
}

.three-images .overlay-see-phpto .osp-detail h2,
.three-images .overlay-see-phpto .osp-detail p {
    display: none;
}

.three-images .pos-rel .mask2 {
    background: none;
    top: -76px;
}

.two-images.landscape .pos-rel {
    width: 100%;
}


.two-images {
    display: flex;
    width: 100%;
    justify-content: space-between;
}

.two-images .pos-rel {
    overflow: hidden;
    width: 49.99%;
    min-height: 290px;
}

.two-images .pos-rel a {
    width: 100%;
}

.two-images .pos-rel .osp-detail {
    line-height: 1.5;
}

.post-img {
    overflow: hidden;
}



.adverholder .adv-post .new-gray-btn.new-design-btn {
    border-radius: 6px;
    line-height: 1;
    align-self: center;
    background-color: #0570f6;
    color: #fff;
    font-family: roboto-regular;
    font-size: 15px;
    padding: 10px 16px;
}

.adverholder .adv-post .new-gray-btn.new-design-btn.user-unfollower {
    background-color: #f0f0f2;
    color: #000;
    line-height: 1;
}

.winit-new,
.covid-19 {
    background-color: #365c76;
    display: flex;
    align-items: center;
    padding: 14px;
    margin-bottom: 10px;
    border-radius: 10px;
}

.covid-19 {
    background-color: #00c7d9;
}

.winit-new h2,
.covid-19 h2 {
    color: #fff;
    flex: 1;
    font-size: 15px;
    font-family: roboto-medium;
    font-weight: 400;
    margin-bottom: 0;
}

.winit-new h2 span {
    margin-left: 12px;
}

.winit-new a,
.covid-19 a {
    background-color: #fff;
    margin-left: 10px;
    padding: 4px 12px;
    border-radius: 22px;
    font-family: roboto-medium;
    font-weight: 400;
    color: #365c76;
    font-size: 15px;
}

.winit-new a span.mb-hid,
.winit-new h2 span.mb-hid {
    font-family: roboto-medium;
    font-weight: 400;
    margin-left: 0;
}

@media(max-width: 380px) {

    .winit-new a span.mb-hid,
    .winit-new h2 span.mb-hid {
        display: none;
    }
}

.advert.money-matter span.advert a {
    color: #0570f6;
}

.adsense_post {
    padding: 5px;
    width: 100%;
    background: #fff;
    border-top: 0;
    margin-bottom: 10px;
    border-radius: 10px;
    border-bottom: 3px solid #DDDFE2;
}

.winit-new a.play-now {
    background-color: #72b72a;
    color: #fff;
}

.covid-19 a {
    color: #00c7d9;
}

.doner-req {
    margin-top: 15px;
    margin-bottom: 15px;
}

.doner-req h1 {
    color: #1c1f5f;
    font-family: roboto-medium;
    font-weight: 400;
    display: flex;
    justify-content: space-between;
    font-size: 15px;
    align-items: center;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}

.doner-req h1 a {
    background-color: #ebf2ff;
    color: #447fc6;
    padding: 4px 15px;
    border-radius: 20px;
    font-size: 15px;
}

.doner-req .doner-list {
    display: flex;
    background-color: #fff;
    padding: 12px 15px;
    justify-content: space-between;
    position: relative;
    min-height: 187px;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
}

.doner-req .doner-list .cirloader {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
}

.doner-list.d-timeline {
    flex-wrap: nowrap;
}

.doner-list.d-timeline a div,
.doner-list.d-timeline .d-viewall {
    width: 109px;
    height: 138px;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    border-radius: 14px;
    background-color: #eeeff3;
    margin: 0 auto;
}

.doner-list.d-timeline .d-viewall a {
    color: #0570f6;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: roboto-medium;
    font-weight: 400;
}

.doner-req .doner-list img {
    min-width: 95px;
    margin: 0 auto;
    display: block;
    border-radius: 14px;
}

.doner-req .doner-list h4 {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 110px;
    text-align: center;
    margin: 6px 0 0 0;
    font-family: roboto-medium;
    font-weight: 400;
    font-size: 15px;
    padding-left: 11px;
}

.d-p-inner {
    border-radius: 15px;
    background-color: #eeeff3;
    padding: 15px;
}

.donate-pics {
    display: flex;
    justify-content: flex-start;
    margin-top: 10px;
    margin-bottom: 10px;
}

.donate-pics a {
    display: block;
}

.donate-pics img {
    border-radius: 12px;
    max-width: 100%;
    margin: 0 3px;
}

.doner-req .carousel-control {
    position: absolute;
    z-index: 9;
    right: 18px;
    left: auto;
    top: -32px;
    width: auto;
    height: 23px;
}

.doner-req a.left.carousel-control {
    right: 48px;
}

.doner-req .carousel-control i {
    font-size: 22px;
    color: #a7a7a7;
}

.donate-pics div {
    width: 149px;
    height: 174px;
    background-repeat: no-repeat;
    border-radius: 14px;
    background-size: 99%;
    margin: 0 4px;
    position: relative;
    background-color: #eeeff3;
}

.doner-list i.far.slick-arrow {
    font-size: 26px;
    position: absolute;
    top: -34px;
    right: 15px;
    color: #b1b1b1;
    cursor: pointer;
}

.doner-list i.far.slick-arrow.fa-chevron-circle-left {
    right: 45px;
}

.donate-pics div.d-video:after {
    width: 99%;
    content: "";
    height: 99%;
    background-color: rgba(0, 0, 0, 0.4);
    position: absolute;
    left: 0;
    top: 0;
    border-radius: 14px;
}

.donate-pics div.d-video i {
    color: #fff;
    font-size: 40px;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    height: 40px;
    width: 42px;
    z-index: 9;
}

.doner-pop-amount {
    text-align: center;
    color: #000;
}

.doner-pop-amount span {
    font-size: 12px;
    color: #797988;
}

.doner-req .pagination {
    background-color: #fff;
    overflow: hidden;
    border: 1px solid #e2e2e5;
    padding: 10px;
}

.doner-req .pagination>li {
    display: inline;
}

.doner-req .pagination>li>a {
    position: relative;
    float: left;
    padding: 6px 12px;
    margin-left: -1px;
    line-height: 1.42857143;
    color: #337ab7;
    text-decoration: none;
    background-color: #fff;
    text-decoration: none !important;
    z-index: 0 !important;
    border: 1px solid #ddd;
    font-family: roboto-medium;
}

.doner-req .pagination>li:first-child>a {
    margin-left: 0;
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
}

.doner-req .pagination>.active>a,
.doner-req .pagination>.active>a:focus,
.doner-req .pagination>.active>a:hover {
    color: #fff;
    cursor: default;
    background-color: #0570f6;
    border-color: #0570f6;
}

.doner-req .pagination>li:last-child>a {
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
}

a.view-vw {
    padding: 0px 15px 10px 15px;
}

/********************************************************/

@media screen and (max-width: 991px) {

    .winit-new,
    .virus-widget {
        margin-top: 0;
    }

    .donate-pics div {
        min-width: 103px;
        height: 122px;
        width: auto;
    }

    .donate-pics {
        justify-content: center;
    }

    .virus-widget .vw-count {
        display: block;
        text-align: center;
        position: relative;
        padding: 2px 15px 0px 15px;
    }

    .virus-widget .vw-count img {
        position: absolute;
        z-index: 0;
        left: 0;
        right: 0;
        margin: 0 auto;
        opacity: 0.2;
        top: 0;
        display: none;
    }

    a.view-vw {
        font-size: 15px;
        padding: 8px 15px 10px 15px;
    }

    .virus-widget .vw-total {
        justify-content: center;
        margin-top: 12px;
        position: relative;
        z-index: 1;
    }

    .vw-funds {
        width: 100%;
    }

    .vw-link.vw-green,
    .vw-link.vw-blue {
        margin-bottom: 12px;
    }

    .vw-link {
        min-width: 138px;
        width: 44%;
        margin-left: 0;
    }

    .post .post-promo-meta.post-donate .post-promo a span {
        display: block;
    }

    .post .post-promo-meta.post-donate .post-promo a {
        width: auto;
    }

    .donate-new-post {
        /* padding: 11% 4%; */
    }

    .donate-new-post p {
        font-size: 15px;
    }

    .post .post-promo-meta.post-donate {
        /* padding: 0 10px; */
    }

    .vw-links {
        justify-content: space-evenly;
        flex-wrap: wrap;
        padding: 12px 0 5px 0;
    }

    .view-vw {
        text-align: center;
    }

    .winit-new a {
        padding: 4px 9px;
    }

    .doner-req .doner-list img {
        min-width: 1px;
        max-width: 79px;
    }

    .doner-req .doner-list h4 {
        font-size: 12px;
        max-width: 78px;
    }

    .donate-pics img {
        max-width: 94%;
    }

    .doner-req .doner-list {
        min-height: 135px;
    }

    .doner-list i.far.slick-arrow {
        font-size: 22px;
        top: -31px;
    }

    .sendRequest.special.nnnt1.btn-theme-border {
        margin-top: 0;
    }

    .post-user-info.td h2 {
        line-height: 27px;
        font-size: 15px;
    }

    .mng-font,
    .quiz-game-buttons button,
    .timer-post {
        font-size: 15px;
    }

    .timer-post {
        padding: 7px 0;
        width: 100%;
        margin: 8px 0 0px 0;
    }

    .post-header.table.w96 {
        padding: 9px;
    }

    .post-banner.td {
        padding-bottom: 1px;
    }

    .prop-side-widget-goldenwall a.btn {
        width: 55%;
        padding: 6px 10px 7px 10px;
        height: auto;
    }

    .post .post-reactions .counters span {
        font-size: 15px;
    }

    .header nav ul li {
        margin-right: 15px;
    }

    .doner-list.d-timeline a div,
    .doner-list.d-timeline .d-viewall {
        width: 80px;
        height: 100px;
    }

    .doner-list.d-timeline .d-viewall a {
        font-size: 15px;
    }

    .dropdown-container.globe ul.dropdown {
        left: 0;
        right: auto;
    }
}

@media screen and (max-width: 480px) {
    .winitquiz_results {
        padding-top: 40px;
        text-align: center;
        background-size: cover;
    }

    .winners-heading h1 {
        font-size: 20px;
    }

    .winit-winner-title {
        font-size: 15px;
    }

    .social-icons ul li {
        margin: 0 7px;
    }
}

@media screen and (max-width: 355px) {
    .doner-req .doner-list h4 {
        max-width: 65px;
    }

    .doner-req .doner-list img {
        max-width: 66px;
    }

    .doner-list.d-timeline a div,
    .doner-list.d-timeline .d-viewall {
        width: 68px;
        height: 88px;
    }

    .donate-pics div {
        min-width: 90px;
        height: 106px;
    }
}

.conversion-winning-price {
    font-size: 10px;

}

.videotimeline_post,
.videotimeline_post .post-comment,
.bsns_post-comment {
    background: #2a2a2a;
    margin-bottom: 10px;
}

.videotimeline_post p,
.videotimeline_post i,
.videotimeline_post a span,
.videotimeline_post .post-actions ul li a span {
    color: #fff !important;
}

.videotimeline_post .post-header .post-meta .sec-top span a,
.videotimeline_post .countlike,
.videotimeline_post .impressions,
.videotimeline_post .post-promo-meta .post-a-meta span,
.videotimeline_post .revenue span.post-type,
.videotimeline_post .post-reactions .counters ul li span i,
.videotimeline_post .count-action,
.videotimeline_post #pst_vid_view_cnt>a,
.videotimeline_post .post-reactions .counters span {
    color: #fff;
}

.videotimeline_post .user-reaction-popup a span {
    color: #0570f6;
}

.videotimeline_post .user-reaction-popup a {
    color: #000;
}

.videotimeline_post .user-reaction-popup .user-reaction-popup-icon-ul a span {
    color: #000;
}

.videotimeline_post .post-reactions {
    border-bottom: 1px solid #7d7d7d;
    border-top: 1px solid #7d7d7d;
}

.videotimeline_post .social-icons {
    border-bottom: 1px solid #7d7d7d;
    border-top: 1px solid #7d7d7d;
}

.videotimeline_post .post-actions {
    border-bottom: 1px solid #7d7d7d;
}

.videotimeline_post .likepage-advert,
.videotimeline_post .social-icons {
    display: none;
}

.videotimeline_post .btn-default,
.get-style ul li button,
.social_posting ul li button {
    border: none !important;
    background-color: #0570f6;
}

.videotimeline_post .btn-default i,
.videotimeline_post .btn-default strong {
    color: #fff !important;
    border: none;
}

.videotimeline_post .post-header .post-actions a .icon {
    color: #fff;
}

.videotimeline_post .green {
    color: #7bbb5e !important;
}

/*.videotimeline_post .post-promo-meta .post-promo a{*/
/*border-radius: 50%;*/
/*width: 42px;*/
/*height: 42px;*/
/*}*/



.videotimeline_post .post-actions .dropdown .icon,
.videotimeline_post .post-actions .dropdown span {
    color: #4b4f56 !important;
}

/*-----       Friends Widget   -----*/

article .friend-widget {
    display: flex;
}

.friend-widget.popular-pages {
    display: block;
}

article .friend-widget .col-md-4 {
    width: 33%;
    overflow: hidden;
}

article .friend-widget .col-md-4 .friends-new-sec {
    display: block;
    text-align: center;
    border-radius: 8px;
    border: 1px solid #e2e2e5 !important;
    padding: 0;
    margin: 12px 6px 11px 6px;
}

article .friend-widget .col-md-4 .friends-new-sec a .bg-img-dp {
    border-radius: 0;
    border: none;
    /*width: 110px;
    height: 105px;*/
    width: 100%;
    height: auto;
    margin: 0 auto;
    float: none;
    display: block;
    min-height: 144px;
    background-size: cover;
    background-color: #e9e9e9;
    background-repeat: no-repeat;
}

article .friend-widget .col-md-4 a.see-more-frnds {
    background-color: #e9e9e9;
    color: #0570f6;
    font-weight: 600;
    width: 90%;
    font-size: 15px;
    height: 224px;
    display: flex;
    margin: 12px 6px 5px 6px;
    overflow: hidden;
    justify-content: center;
    align-items: center;
}

@media(max-width: 575px) {
    article .friend-widget .col-md-4 .friends-new-sec a .bg-img-dp {
        min-height: 175px;
    }

    article .friend-widget .col-md-4 a.see-more-frnds {
        height: 254px;
        margin: 8px 6px;
    }
}

@media(max-width: 350px) {
    article .friend-widget .col-md-4 .friends-new-sec a .bg-img-dp {
        min-height: 140px;
    }

    article .friend-widget .col-md-4 a.see-more-frnds {
        height: 220px;
    }
}

article .friend-widget .col-md-4 .friends-new-sec .btn {
    width: 44%;
    height: 31px;
    margin-bottom: 7px;
    color: #0570f6;
    font-size: 15px;
}

article .friend-widget .col-md-4 .friends-new-sec .btn.sendRequest {
    background-color: #0570f6 !important;
    color: #ffffff;
    border: none !important;
}

article .friend-widget .col-md-4 .friends-new-sec .btn.sendRequest i {
    color: #fff !important;
}

article .friend-widget .col-md-4 .friends-new-sec .btn.btn-ignore-user {
    background-color: #f0f0f2 !important;
    color: #000;
}

article .friend-widget .col-md-4 .friends-new-sec .cancelRequest.new-design-btn {
    min-width: 90%;
    display: block;
    flex: 100%;
    margin: -9px 12px 0 42px;
    border-radius: 4px;
}

article .friend-widget i.slick-arrow {
    background-color: #fff;
    border: 1px solid #e2e2e5 !important;
    position: absolute;
    top: 0;
    bottom: 37px;
    margin: auto;
    width: 26px;
    height: 32px;
    font-size: 18px;
    padding: 5px 7px;
    left: 0;
    right: auto;
    z-index: 6;
    cursor: pointer;
    color: #777a82;
}

article .friend-widget i.slick-arrow.fa-chevron-left {
    border-left-width: 0 !important;
}

article .friend-widget i.slick-arrow.fa-chevron-right {
    right: 0;
    left: auto;
    border-right-width: 0 !important;
}

article .friend-widget .col-md-4 .friends-new-sec a.pos-rel {
    display: block;
}

#suggestion-div-cont article .friend-widget .col-md-4 .friends-new-sec a img {
    min-height: 72px;
}

article .friend-widget .col-md-4 .lftcntpd.pymk-u-data span.ellipsis {
    display: none;
}

article .friend-widget .col-md-4 .lftcntpd.pymk-u-data h5 {
    max-height: 24px;
    overflow: hidden;
}

article .friend-widget .col-md-4 .friends-new-sec a div {
    bottom: 2px;
    right: 3px;
    width: auto;
    height: auto;
}

#suggestion-div-cont article .friend-widget .col-md-4 .friends-new-sec a div {
    right: 0;
    bottom: 0;
}

article .friend-widget .col-md-4 .friends-new-sec a div i {
    top: auto;
    right: auto;
    left: auto;
    bottom: auto;
    font-size: 18px;
    padding: 1px;
    width: auto;
    height: auto;
    position: relative;
}

article .friend-widget .col-md-4 .lftcntpd.pymk-u-data {
    width: 100%;
    overflow: hidden;
    display: flex;
    align-items: center;
    padding-left: 0;
}

article .friend-widget .col-md-4 .btn-group.pymk {
    justify-content: center;
}

.about2-carousel-thumbs button.slick-prev.slick-arrow {
    border: 1px solid #e2e2e5 !important;
    position: absolute;
    top: 0;
    bottom: 37px;
    margin: auto;
    width: 26px;
    height: 32px;
    font-size: 18px;
    padding: 5px 7px;
    left: 0;
    right: auto;
    z-index: 6;
    cursor: pointer;
    color: #777a82;
}

.post-text-area.socio-new-sec {
    max-width: 1170px;
    margin: 0 auto;
    width: 75%;
    position: relative;
    left: 0px;
}

.media-slide-holder .slider-arrow.slider-next.fa.fa-angle-right.slick-arrow {
    background-color: #fff;
    padding: 2px 4px;
    font-size: 16px;
    right: -26px;
    left: auto;
    position: absolute;
    top: auto;
    bottom: 9px;
    color: #777a82;
    border-radius: 50%;
    width: 25px;
    height: 25px;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    -webkit-box-shadow: 0px 0px 7px 0px rgba(0, 1, 0, 0.15);
    -moz-box-shadow: 0px 0px 7px 0px rgba(0, 1, 0, 0.15);
    box-shadow: 0px 0px 7px 0px rgba(0, 1, 0, 0.15);
    cursor: pointer;
}

.media-slide-holder .slider-arrow.slider-prev.fa.fa-angle-left.slick-arrow {
    background-color: #fff;
    border: 1px solid #e2e2e5 !important;
    left: -31px;
    right: auto;
    position: absolute;
    top: auto;
    bottom: 9px;
    padding: 2px 4px;
    font-size: 16px;
    color: #777a82;
    display: none !important;
}

.media-slide-holder a.slick-slide>img {
    border-radius: 50%;
    object-fit: cover;
    object-position: center top;
}

.media-slide-holder {
    display: flex;
    justify-content: space-evenly;
    align-items: center;
    padding: 10px 0;
}

.about2-carousel-thumbs.friend-widget a img {
    max-width: 100%;
    height: auto;
    object-fit: cover;
    object-position: center top;
    border-radius: 50%;
}

/* .about2-carousel-thumbs.friend-widget {
    width: 75%;
} */

.about2-carousel-thumbs.friend-widget {
    width: 92%;
}

.custom-right-new-boxes p {
    font-size: 15px !important;
    line-height: 20px !important;
    color: #1f1d23 !important;
}

.custom-right-new-boxes p {
    margin: 0 0 15px;
}

.custom-right-new-boxes .pt-btns a {
    border-radius: 6px;
    margin-left: 0;
    padding: 10px 16px;
    line-height: 1;
    display: block;
}

.blue-btn-new {
    background: #e7f3ff;
    margin-left: 0;
    font-size: 15px;
    color: #0570f6;
}

.grey-btn-new {
    background: #f8fbf5;
    color: #4fab00;
}

.custom-right-new-boxes .pt-btns a.blue-btn-new {
    margin-bottom: 15px;
}

.custom-right-new-boxes>ul {
    margin: 0 0 0 10px;
    font-size: 15px;
    line-height: 20px;
    color: #1f1d23;
}

.custom-right-new-boxes>ul li {
    margin: 0 0 10px;
}

.custom-right-new-boxes>ul li:nth-child(2) {
    margin: 0 0 15px;
}

.custom-right-new-boxes>ul li i {
    padding-right: 10px;
}

.custom-right-new-boxes>ul li span {
    display: inline-block;
    vertical-align: top;
    width: 89%;
}

.custom-right-new-boxes>ul li i {
    display: inline-block;
    vertical-align: top;
    position: relative;
    top: 4px;
}

.media-socio-holder h3 {
    padding-right: 0;
    width: 187px;
}

.media-socio-holder ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    height: 40px;
}

.media-socio-holder ul li {
    margin-right: 15px;
}

.media-socio-holder ul li a svg {
    width: 40px;
    height: 40px;
}

.media-slide-holder {
    margin-bottom: 15px;
}

.new-widget-body1 {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

.new-widget-anchorhold {
    background: #fff;
    padding: 20px 15px;
    margin-bottom: 15px;
    margin-right: 15px;
    flex: 1;
}

.new-widget-anchorhold:last-child {
    margin-right: 0;
}

.no-margin-right {
    margin-right: 0;
}

.svg-hold1 {
    display: inline-block;
    vertical-align: middle;
    margin-right: 0px;
}
.svg-hold1-new {
    display: inline-block;
    vertical-align: middle;
    margin-right: 0px;
}
#time_main_sticky {
    color: #6e7994;
    display: block;
}

.small-box-info1 {
    display: inline-block;
    vertical-align: top;
}

.small-box-info1 h4 {
    color: #424242;
    font-weight: bold;
    font-size: 15px;
}

.small-box-info1 a {
    font-size: 13px;
    color: #0570f6;
    font-weight: 300;
    display: block;
}

.about2-carousel-thumbs.friend-widget .cw-tabs .cw-tab {
    min-width: 70px;
    padding: 0;
}

/************   re-design post with arrow on top right  ***********/
.post .revenue {
    position: relative;
}

.post .revenue span.post-type {
    flex: 1;
}

.post .revenue .user-follower-official {
    display: none;
}

.post .revenue .post-actions {
    font-size: 23px;
    border-bottom: none;
    padding: 0 10px;
    height: 22px;
    display: flex;
    align-items: center;
}

.editPost .post-button {
    display: flex;
    flex-direction: row-reverse;
}

.post .revenue button.page-like-new-btn {
    position: relative;
    margin-left: 5px;
    min-width: 89px;
}

.editComment .post-button {
    display: flex;
    flex-flow: row-reverse;
}

#header-full-search-rslt-container .nano-content a article.post-text-area img {
    border-radius: 100%;
}

#header-full-search-rslt-container .nano-content a article.post-text-area h5.search_users_detail_box div i.fa-check-circle {
    position: absolute;
    left: 35px;
    bottom: 10px;
    background-color: #fff;
    border-radius: 100%;
    font-weight: bold;
    font-size: 12px;
    border: 2px solid #fff;
}

.header-people a.imgModelPost.text-center {
    color: #0570f6;
}

/*************************************    Winit ******************************************************/
.winit-detail {
    display: flex;
}

.winit-detail .winit-text h2 {
    text-transform: uppercase;
    font-size: 15px;
    font-family: roboto-bold;
    letter-spacing: 0.5px;
    color: #525252;
    display: flex;
}

.winit-detail .winit-text h2 span {
    color: #0570f6;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 295px;
    display: block;
    margin-left: 6px;
}

.winit-detail .winit-text .mng-font {
    color: #525252;
    font-family: roboto-regular;
    font-size: 15px;
}

.winit-detail .winit-text .mng-font a {
    color: #0570f6;
}

.winit-detail .winit-text .quiz-game-buttons button.btn.btn-blue.btn-join-quiz {
    padding: 6px 10px;
    /*background-color: #0570f6;*/
    background-color: #0570f6;
    color: #fff;
    font-family: roboto-bold;
    font-size: 15px;
    min-width: 110px;
    height: 29px;
    overflow: hidden;
}

.winit-detail .winit-text .quiz-game-buttons button.btn.btn-share.btn-watch-now {
    background-color: #eeeff3;
    color: #525252;
    font-family: roboto-bold;
    margin-left: 10px;
    font-size: 15px;
    min-width: 85px;
    padding: 6px 0px;
    text-align: center;
    height: 29px;
    overflow: hidden;
    min-width: 110px;
}

#images_holder .popup-information img.smal-thumb {
    border-radius: 50px;
}

#images_holder .popup-information .lftcntpd h5 a {
    font-size: 15px;
    color: #171717;
    font-family: roboto-medium;
    font-weight: 400;
}

#images_holder .popup-information ul.post-link {
    display: flex;
    justify-content: space-around;
    padding: 10px 0;
}

#images_holder .popup-information ul.post-link li {
    float: none;
    width: auto;
    margin: 0;
}

#images_holder .popup-information ul.post-link li a {
    border: none;
    font-size: 15px;
    color: #4b4f56;
    font-family: roboto-medium;
    font-weight: 400;
}

#images_holder .popup-information ul.post-link:before {
    display: none;
}

/*************************************    Winit ******************************************************/
.job_list {
    min-height: 80px;
}

/*************************************    Mentor List ******************************************************/
.gurus-tabs {
    border-radius: 10px;
    border-bottom: 3px solid #dddfe2;
    background-color: #fff;
}

.mentor-tabs ul {
    display: flex;
    justify-content: space-around;
}

.mentor-tabs ul li {
    width: 50%;
    text-align: center;
}

.mentor-tabs ul li:first-child {
    border-right: 1px solid #eeeff3;
}

.mentor-tabs ul li a {
    padding: 12px 15px;
    display: block;
    width: 100%;
    color: #000;
    font-size: 15px;
    font-family: roboto-medium;
    font-weight: 400;
}

.mentor-tab-content {
    border-top: 1px solid #eeeff3;
}

.mentor-tab-content ul li {
    display: flex;
    padding: 12px 15px;
    align-items: center;
    border-bottom: 1px solid #eeeff3;
}

.mentor-tab-content ul li .dp-tab {
    width: 60px;
    height: 60px;
    border-radius: 100%;
    background-color: #eeeff3;
}

.mentor-tab-content ul li div.tab-name {
    flex: 1;
    margin-left: 16px;
    display: flex;
    justify-content: space-between;
}

.mentor-tab-content ul li div.tab-name h3 {
    color: #000;
    font-size: 15px;
    font-family: roboto-medium;
    font-weight: 400;
    margin-left: 0;
    padding-bottom: 4px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 250px;
}

.mentor-tab-content ul li div.tab-name h3 span {
    display: block;
    font-size: 15px;
    color: #a5a5a5;
    font-family: roboto-regular;
}

.mentor-tab-content ul li div.tab-name ul {
    display: flex;
}

.mentor-tab-content ul li div.tab-name ul li {
    display: block;
    padding: 0;
    border: none;
}

.mentor-tab-content ul li div.tab-name ul li a {
    background-color: #0570f6;
    padding: 4px 6px;
    font-size: 18px;
    margin-right: 5px;
    width: 32px;
    height: 32px;
    display: block;
    text-align: center;
    color: #ffffff;
    border-radius: 30px;
}


/*************************************    COVID and Help Center widget ******************************************************/

.covid-info,
.help-center,
.profile-edit,
.mentors {
    background-color: #fff;
    padding: 15px;
    margin-bottom: 10px;
    position: relative;
}

.mentors {
    margin-bottom: 0;
    padding-bottom: 0 !important;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}

.help-center.help-social {
    border-bottom: 3px solid #dddfe2;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
}

.new-widget-head h2 {
    color: #000000;
    font-size: 15px;
    font-family: roboto-medium;
    font-weight: 400;
    text-transform: capitalize;
}

.mentors .new-widget-head {
    display: flex;
    justify-content: space-between;
}

.mentors .tooltip-div i {
    background-color: #f0f2f5;
    padding: 0;
    display: block;
    font-size: 20px;
    margin-left: 10px;
    border-radius: 10px;
    color: #9e9da6;
    cursor: pointer;
}

.mentors .tooltip-div .tooltip-widget {
    position: absolute;
    z-index: 9;
    background-color: #fff;
    max-width: 250px;
    text-align: center;
    padding: 15px;
    border-radius: 10px;
    top: 37px;
    right: 15px;
    box-shadow: 0 0 15px rgba(0, 0, 0, 0.3);
    display: none;
}

.mentors .tooltip-div:hover .tooltip-widget {
    display: block;
}

.mentors .tooltip-div .tooltip-widget p {
    line-height: 1.3;
    font-size: 12px;
    color: #767582;
    text-align: left;
}

.mentors .tooltip-div a {
    background-color: #f0f2f5;
    padding: 12px 15px;
    display: block;
    flex: 1;
    border-radius: 10px;
    color: #767582;
    font-size: 15px;
    font-family: 'roboto-regular';
    font-weight: 400;
}

.sec-two-desc {
    color: #1f1d23;
}

.covid-info .new-widget-body a,
.profile-edit .new-widget-body,
.mentors .new-widget-body {
    display: flex;
    align-items: center;
    padding: 10px 10px;
    margin-top: 20px;
    border-radius: 6px;
    box-shadow: 0 0 6px rgba(0, 0, 0, 0.1);
    transition: 0.3s all;
}

.mentors .new-widget-body {
    padding: 0;
    box-shadow: none;
}

.covid-info .new-widget-body a span {
    font-family: 'roboto-medium';
    font-weight: 400;
    font-size: 15px;
    margin-left: 10px;
}

.help-center .new-widget-body {
    display: flex;
    /*justify-content: space-between;*/
    flex-wrap: wrap;
}

.help-center .new-widget-body a {
    padding: 8px;
    margin: 20px 23px 0 0;
    border-radius: 6px;
    box-shadow: 0 0 6px rgba(0, 0, 0, 0.1);
    display: block;
    width: 30.5%;
    transition: 0.3s all;
}

.help-center .new-widget-body a:first-child,
.help-center .new-widget-body a:nth-child(2),
.help-center .new-widget-body a:nth-child(3) {
    margin-top: 0;
}

.help-center .new-widget-body a:nth-child(3),
.help-center .new-widget-body a:nth-child(6) {
    margin-right: 0;
}

.help-center .new-widget-body a svg {
    width: 30px;
    height: auto;
}

.help-center .new-widget-body a:nth-child(2) svg {
    border-radius: 6px;
}

.help-center .new-widget-body a img {
    border-radius: 50%;
}

.help-center .new-widget-body a:nth-child(3) img {
    border-radius: 0;
}

.help-center .new-widget-body a:last-child img {
    border-radius: 30%;
}

.covid-info .new-widget-body a:hover,
.help-center .new-widget-body a:hover {
    box-shadow: 0 0 6px rgba(0, 0, 0, 0.3);
}

.help-center .new-widget-body a span {
    font-family: roboto-medium;
    font-weight: 400;
    font-size: 15px;
    display: block;
    margin-top: 2px;
    line-height: 1.3;
}

.covid-pops {
    display: none;
    /* Hidden by default */
    position: fixed;
    /* Stay in place */
    z-index: 999;
    /* Sit on top */
    padding-top: 0;
    /* Location of the box */
    left: 0;
    top: 0;
    width: 100%;
    /* Full width */
    height: 100%;
    /* Full height */
    overflow: auto;
    /* Enable scroll if needed */
    background-color: rgb(0, 0, 0);
    /* Fallback color */
    background-color: rgba(0, 0, 0, 0.4);
    /* Black w/ opacity */
}

.close-covid {
    position: absolute;
    right: 13px;
    top: 12px;
    padding: 6px 12px;
    cursor: pointer;
}

.close-covid i {
    font-size: 20px;
}

.pop-container {
    background-color: #fefefe;
    margin: 10% auto auto auto;
    padding: 20px;
    border: 1px solid #888;
    width: 80%;
    letter-spacing: -1px;
}

.covid-pop-content .row {
    display: flex;
    flex-wrap: wrap;
    margin-right: -15px;
    margin-left: -15px;
}


#cov-outer {
    text-transform: uppercase;
    color: #414141;
    line-height: 1;
    font-family: roboto-medium;
    font-weight: 400;
}

/* Title */
.cov-title {
    text-align: center;
    text-transform: uppercase;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 15px;
}

.cov-title span {
    margin: 0 0 0 10px;
    display: inline-block;
    vertical-align: middle;
    font-family: roboto-medium;
    font-weight: 400;
}

.covid-pop-content a {
    cursor: inherit;
}

/* Story Widget */
.story-widget {
    padding: 15px 15px 5px 15px;
}

.story-widget h2 {
    display: flex;
    justify-content: space-between;
    color: #000;
    font-size: 15px;
    font-family: roboto-medium;
    font-weight: 400;
    text-transform: capitalize;
    margin-bottom: 0;
    border-bottom: 1px solid #dee0e9;
    padding-bottom: 10px;
}

.black-head {
    color: #000;
}

h3.new-color {
    color: #000;
}

.story-widget h2 a {
    color: #2a72cc;
    font-size: 15px;
    font-family: roboto-medium;
    font-weight: 400;
    line-height: 1;
    position: relative;
    top: 5px;
}

.main-story {
    display: flex;
    overflow-x: auto;
}

.main-story .stories-here.create-st {
    margin-right: 15px;
    min-width: 120px;
}

.stories-here {
    display: flex;
    margin-top: 15px;
    overflow: visible !important;
    padding-bottom: 5px;
    /* width: 100%; */
    align-items: center;
}

.main-story .stories-here.stories-here-one {
    margin-top: 0;
}

.main-story::-webkit-scrollbar {
    height: 0px;
}

.main-story::-webkit-scrollbar-track {
    background: #f1f1f1;
    border-radius: 50px;
}

.main-story::-webkit-scrollbar-thumb {
    background: #888;
    border-radius: 50px;
}

.main-story::-webkit-scrollbar-thumb:hover {
    background: #555;
}

.stories-here a {
    display: block;
    width: 120px;
    min-width: 95px;
    text-align: center;
    background: #fff;
    height: 200px;
    border-radius: 10px;
    margin: 0 14px 0 0;
    overflow: hidden;
}

.stories-here a:last-child {
    margin-right: 0;
}

.st-post {
    position: relative;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: flex-end;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}

.st-post:after {
    content: "";
    position: absolute;
    height: 100%;
    width: 100%;
    /*background: rgba(0,0,0,0.2);*/
    background-image: linear-gradient(0deg, rgba(0, 0, 0, 0.4), transparent);
}

.st-thumb div,
.st-thumb i {
    position: absolute;
    left: 11px;
    top: 7px;
    width: 40px;
    height: 40px;
    background-size: cover;
    background-position: center;
    border-radius: 50%;
    z-index: 2;
    border: 3px solid #2283ff;
    background-repeat: no-repeat;
}

.st-thumb i {
    color: #fff;
    font-size: 22px;
    padding: 7px 6px 3px 6px;
}

.st-thumb-one i {
    left: 50%;
    top: auto;
    bottom: 0;
    transform: translate(-50%, 50%);
    background: #2283ff;
    border-width: 3px;
    margin-top: 19px;
    width: 35px;
    height: 35px;
    font-size: 14px;
    border: 3px solid #fff;
}

.st-post p {
    color: #fff;
    font-size: 15px;
    font-family: roboto-medium;
    font-weight: 400;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 90%;
    position: relative;
    z-index: 4;
}

.st-post-one {
    position: relative;
    background-position: 0 0;
    height: calc(100% - 22.5%);
}

.st-post-one::after {
    /* background: rgba(0, 0, 0, 0.2); */
    background-image: none;
}

.st-post-one p {
    font-size: 14px;
    color: #656770;
}

.thumb-p-new {
    font-size: 14px;
    padding-top: 18px;
    font-weight: bold;
}

.stories-here a {
    height: 206px;
}

/* Total */

._c_total {
    width: 25%;
    padding: 0 15px;
    font-size: 40px;
    text-align: center;
    font-family: roboto-medium;
    font-weight: 400;
}

._c_total .title {
    font-size: 1.1rem;
    color: #414141;
}

._c_total .total {
    color: #ff7200;
    font-size: 5.5rem;
}

/* Update */
.cov-update {
    font-size: 20px;
    text-align: center;
    margin-top: 50px;
}

/* List */
._c_sub {
    width: 50%;
    padding: 25px 15px;
    position: relative;
    font-family: roboto-medium;
    font-weight: 400;
}

._c_sub:before,
._c_sub:after {
    content: '';
    width: 4px;
    height: 100%;
    display: block;
    background: #dbebf8;
    position: absolute;
    border-radius: 50%;
    top: 0;
}

._c_sub:after {
    right: 0;
}

._c_sub:before {
    left: 0;
}

._c_sub_list {
    list-style-type: none;
    margin: 0 auto;
    padding: 0;
    column-count: 2;
    font-size: 32px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    position: relative;
}

._c_sub_list:before {
    content: '';
    width: 2px;
    height: 100%;
    display: block;
    background: #000;
    position: absolute;
    border-radius: 50%;
    top: 0;
}

._c_sub_list li {
    width: 50%;
    padding-left: 16px;
    font-size: 24px;
    color: #414141;
}

._c_sub_list li span {
    color: #128ebd;
    font-size: 35px;
}

/*Results*/
._c_results {
    width: 25%;
    padding: 0 15px;
    font-size: 38px;
    font-family: roboto-medium;
    font-weight: 400;
    color: #414141;
}

._c_results .deaths span {
    color: #f90101;
    display: block;
}

._c_results .recovered span {
    color: #2bb600;
    display: block;
}

body.home.d-inner-home.mobile.modal-open {
    height: auto;
    overflow-y: hidden;
}

/****************************** Corona virus new widget ***************************/
.vw-body {
    display: flex;
    justify-content: space-between;
    margin-top: 20px;
}

.vw-body .vw-tab {
    text-align: center;
    min-width: 140px;
}

.vw-body .vw-tab i {
    color: #5f666f;
    font-size: 24px;
    background-color: #f0f2f5;
    border-radius: 100%;
    padding: 10px;
    min-width: 46px;
    min-height: 45px;
    text-align: center;
}

.vw-body .vw-tab h2 {
    color: #000;
    font-size: 18px;
    font-family: roboto-medium;
    font-weight: 400;
    margin-top: 6px;
    margin-bottom: 6px;
}

.vw-body .vw-tab p {
    font-size: 13px;
    color: #65676b;
    font-family: roboto-regular;
    display: none;
}

.vw-body .vw-tab a {
    color: #1372ed;
    font-family: roboto-medium;
    font-weight: 400;
    font-size: 15px;
    background-color: #e6f3fe;
    width: 100%;
    display: block;
    padding: 7px 12px;
    border-radius: 8px;
}

.vw-footer {
    /*text-align: center;*/
    /*margin-top: 20px;*/
    /*margin-bottom: -4px;*/
    text-align: center;
    margin-top: 15px;
    margin-bottom: -4px;
    padding-top: 12px;
}

.vw-footer a {
    color: #000;
    font-family: roboto-regular;
    font-weight: 400;
    font-size: 15px;
    padding: 0 4px;
}

.vw-footer a:nth-child(2) {
    border-width: 0 1px 0 1px;
    border-color: #000;
    border-style: solid;
}

.vw-footer a:nth-child(3) {
    border-width: 0 1px 0 0;
    border-color: #000;
    border-style: solid;
}

/****************************** Progress Bar ***************************/
.progress {
    height: 14px;
    flex: 1;
    margin-bottom: 0;
    overflow: hidden;
    background-color: #f5f5f5;
    border-radius: 30px;
    -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, .1);
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, .1);
}

.progress-bar {
    float: left;
    width: 0%;
    height: 100%;
    font-size: 12px;
    line-height: 20px;
    color: #fff;
    text-align: center;
    border-radius: 30px;
    background-color: #72b72a;
    -webkit-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, .15);
    box-shadow: inset 0 -1px 0 rgba(0, 0, 0, .15);
    -webkit-transition: width .6s ease;
    -o-transition: width .6s ease;
    transition: width .6s ease;
}

.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
}

.profile-edit span.profile-status {
    color: #000;
    font-family: roboto-bold;
    font-weight: 400;
    margin: 0 15px 0 10px;
}

.profile-edit .complt-profile-btn,
.mentors .mentor-btn {
    background-color: #72b72a;
    margin-left: 0;
    padding: 10px 12px;
    border-radius: 6px;
    font-family: 'roboto-medium';
    font-weight: 400;
    color: #ffffff;
    font-size: 15px;
    line-height: 1;
}

.mentors .new-widget-body {
    justify-content: space-between;
    flex-wrap: wrap;
}

.mentors .mentor-btn {
    width: 49%;
    text-align: center;
}

.mentors .mentor-btn:first-child {
    background-color: #0570f6;
}

.mentors.mentors-selected .new-widget-body {
    box-shadow: none;
}

.ref-selected,
.ref-select {
    width: 48%;
    text-align: center;
    box-shadow: 0 0 6px rgba(0, 0, 0, 0.1);
    transition: 0.3s all;
    min-height: 192px;
    padding: 15px 0;
    margin-bottom: 5px;
}

.ref-selected img {
    width: 60px;
    border-radius: 100%;
}

.ref-selected h3 {
    color: #183172;
    font-family: roboto-bold;
    font-weight: 400;
    font-size: 15px;
}

.ref-selected h4 {
    color: #6e7994;
    font-family: roboto-medium;
    font-weight: 400;
    font-size: 15px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 90%;
    margin: 0 auto;
}

.ref-selected .ref-btns {
    display: flex;
    justify-content: center;
    margin-top: 6px;
}

.ref-selected .ref-btns a {
    background-color: #0570f6;
    color: #fff;
    padding: 6px 6px;
    display: block;
    width: 42%;
    font-size: 15px;
    font-family: roboto-medium;
    font-weight: 400;
    border-radius: 50px;
    margin: 0 4px;
}

.ref-selected .ref-btns a:last-child {
    background-color: #72b72a;
}

.ref-select {
    display: flex;
    justify-content: center;
    align-items: center;
}

.ref-select a {
    color: #c8c8ca;
    font-size: 37px;
    cursor: pointer;
}

.ref-select span {
    display: block;
    font-size: 15px;
    font-family: roboto-medium;
    font-weight: 400;
    margin-top: 8px;
}

.mentors .savebtns a.btn {
    background-color: #0570f6;
    margin: 12px 0 0 0;
    padding: 8px 20px;
    border-radius: 22px;
    font-family: roboto-medium;
    font-weight: 400;
    color: #ffffff;
    font-size: 15px;
    line-height: 1;
    height: auto;
}

.mentors .savebtns a.link {
    color: #0570f6;
    float: right;
    position: relative;
    top: 16px;
    text-decoration: underline;
}


.mentors .savebtns a.btn.btn-default.list_ref {
    color: #000 !important;
    background-color: #e1e1e1;
    border: none !important;
}

.mentors .select {
    overflow-y: auto;
    background-color: #f8f9fa;
    margin-top: 10px;
    border-radius: 6px;
    max-height: 245px;
    padding: 0 10px;
}

.mentors .select li {
    border-bottom: 1px solid #cccccc;
    cursor: pointer;
    height: auto;
    display: flex;
    align-items: center;
    padding: 10px 0px !important;
    position: relative;
}

.mentors .select li .sel_img {
    width: 40px;
    height: 40px;
    border-radius: 100%;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    background-color: #cccccc;
    float: none;
    margin-right: 15px;
}

.sel_btns a {
    background-color: #0570f6;
    margin-left: 0;
    padding: 8px 12px;
    border-radius: 22px;
    font-family: roboto-medium;
    font-weight: 400;
    color: #ffffff !important;
    font-size: 15px;
    line-height: 1;
    height: auto;
    border: none !important;
}

.sel_btns a.btn-green {
    background-color: #72b72a;
}

.mentors .select li .sel_exp {
    line-height: 1.4;
    flex: 1;
}

.mentors .select li .sel_exp a {
    color: #000;
    font-family: roboto-medium;
    font-weight: 400;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 190px;
    display: block;
}

.mentors .select li .sel_exp br {
    display: none;
}

.mentors .select li:last-child {
    border-bottom: none;
}

.mentors .form-group {
    margin-top: 12px;
}

.mentors .form-group label {
    color: #000;
    font-weight: 400;
    font-family: roboto-medium;
    font-size: 15px;
    margin-top: 15px;
}

.mentors .form-group input {
    background-color: #f8f9fa;
    border: none;
    display: block;
    width: 100%;
    height: calc(1.5em + .75rem + 5px);
    padding: .375rem .75rem;
    font-size: 0.9rem;
    font-weight: 400;
    line-height: 1.5;
    color: #495057;
    background-clip: padding-box;
    border-radius: 8px;
    transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
    margin-bottom: 2px;
}

.mentors .form-group a {
    color: #1a78fa;
    font-family: roboto-regular;
    font-weight: 400;
}

.mentors .select .cross-icon {
    position: absolute;
    right: -10px;
    top: 6px;
    cursor: pointer;
    padding: 0 10px;
}

.mentors .select .cross-icon img {
    width: 10px;
    height: 10px;
}

.your-mentors {
    background-color: #eeeff3;
    width: 100%;
    margin-top: 15px;
    padding: 15px;
}

.your-mentors h2 {
    color: #000;
    margin: 0 0 5px 0;
    line-height: 1;
    font-family: roboto-medium;
    font-weight: 400;
    font-size: 15px;
}

.your-mentors p {
    font-family: roboto-regular;
    font-size: 15px;
    line-height: 1.1;
    color: #000;
}

.your-mentors input {
    background-color: #ffffff;
    border: none;
    border-radius: 30px;
    padding: 4px 12px;
}

.your-mentors a.btn.btn-default {
    background-color: #0570f6;
    color: #fff !important;
    padding: 8px 24px;
    height: auto;
    line-height: 1;
    font-size: 15px;
    font-family: roboto-medium;
    font-weight: 400;
    border-radius: 50px;
    border: none;
}

.your-mentors a.btn.btn-default.amb_reff_whatsapp_cancel,
.your-mentors a.btn.btn-default.reff_whatsapp_cancel {
    background-color: #ffffff;
    color: #000 !important;
}

/**** Eid ****/
.eid-widget {
    background-color: #ffffff;
    position: relative;
    margin-bottom: 15px;
    padding-bottom: 15px;
    border-radius: 10px;
    border-bottom: 3px solid #dddfe2;
}

.eid-widget img {
    width: 100%;
}

.eid-widget h4 {
    color: #0c9248;
    font-size: 24px;
    font-family: roboto-medium;
    font-weight: 400;
    text-transform: capitalize;
    text-align: center;
    margin-bottom: 12px;
}

.eid-widget p {
    padding: 0 15px;
    font-family: roboto-regular;
    font-weight: 400;
    font-size: 15px;
    text-align: center;
    color: #676767;
    line-height: 24px;
}

.eid-widget span {
    position: absolute;
    z-index: 4;
    right: 12px;
    top: 10px;
    color: #5f6670;
    font-size: 20px;
    padding: 1px 8px;
    cursor: pointer;
    background-color: #f3f6f8;
    border-radius: 50%;
    display: none;
}

.post-smsg {
    border-left: 1px solid #dddfe2;
    padding: 0 0 0 10px;
    text-align: right;
}

.post-smsg p {
    font-size: 15px;
    margin-bottom: 0;
    font-family: roboto-regular, Segoe UI, markazi;
}

.post-smsg p a {
    /*background: #e4e4e4;*/
    width: 174px;
    color: #0570f6 !important;
    display: block;
    text-align: center;
    padding: 5px 0;
    border-radius: 6px;
    font-size: 15px;
    font-family: roboto-regular;
    font-weight: 400;
    margin: 7px auto 0 auto;
    text-decoration: none;
    line-height: 1;
}

.post-promo-meta.sp_msg .post-a-meta {
    text-align: center;
    padding: 0 10px 0 0;
}

.make-post-new {
    display: flex;
    padding: 15px;
}

.make-post-new.demo-t-area {
    border-bottom: 1px solid #dee0e9;
}

.make-post-new .dp {
    width: 45px;
    min-width: 45px;
    height: 45px;
    border-radius: 100%;
    background-size: cover;
    background-position: center;
    background-color: #f0f2f5;
}

.make-post-new textarea {
    height: auto !important;
    padding: 13px 0 0 15px;
    background-color: #f0f2f5;
    border-radius: 50px;
    margin-left: 10px;
    width: 100%;
}

.make-post-new textarea::placeholder {
    font-size: 15px;
    font-family: roboto-regular;
}

.l_e_c {
    background-color: #f0f2f5;
    margin: 0 10px 10px 10px;
    padding: 26px;
    border-radius: 10px;
    font-size: 15px;
}

#zuck-modal-content .story-viewer .tip {
    position: absolute;
    top: 0;
    bottom: auto;
    margin: auto auto auto auto;
    height: calc(100% - 80px);
    display: flex !important;
    align-items: center;
    max-width: 50vh;
    background: none !important;
    color: #fff !important;
    opacity: 1 !important;
}

.stories-here.stories-here-one a {
    margin: 0 10px 2px 0;
}

.mentors .mentor-btn {
    border-radius: 6px;
}

.youtube_sub_sec_one {
    display: flex;
    align-items: center;
}

.youtube_sub_sec_one .subscribe_btn {
    margin-left: auto;
}

.upload-bar h4 {
    color: #1f1d23;
}

.post-button .post_button.disabled {
    color: #1f1d23;
    opacity: 1 !important;
}

#cp-cross i {
    color: #1f1d23;
}

.pos-2-content textarea::placeholder {
    color: #1f1d23;
    font-size: 12px;
    opacity: 1;
}

.pos-2-content textarea:-moz-placeholder {
    /* Firefox 18- */
    color: #1f1d23;
}

.pos-2-content textarea::-moz-placeholder {
    /* Firefox 19+ */
    color: #1f1d23;
}

.pos-2-content textarea:-ms-input-placeholder {
    color: #1f1d23;
}

.pos-2-content textarea::placeholder {
    color: #1f1d23;
}

.social_list_detail>ul a,
.activity-list>ul a {
    padding: 6px 11px 6px 35px;
}

.feelings-category-list h3 {
    color: #1f1d23;
}

.top-nav-icons {
    color: #1f1d23;
}

.login-header ul.pubtimelinebtn li a i {
    color: #1f1d23;
}

#mylist .template-download {
    width: 22.8%;
    margin-bottom: 10px !important;
}

#mylist .template-download:nth-child(4n) {
    margin-right: 0;
}

@media (max-width: 1199px) {
    ._c_total {
        font-size: 35px;
    }

    ._c_total .total {
        font-size: 6rem;
    }

    ._c_sub_list {
        font-size: 32px;
    }

    ._c_sub_list li {
        padding-left: 20px;
    }

    ._c_sub_list li span {
        font-size: 40px;
    }

    ._c_results {
        font-size: 36px;
    }
}

@media (max-width: 991px) {
    ._c_total {
        font-size: 28px;
    }

    ._c_total .total {
        font-size: 5rem;
    }

    ._c_sub_list {
        font-size: 28px;
    }

    ._c_sub_list li {
        padding-left: 15px;
    }

    ._c_sub_list li span {
        font-size: 35px;
    }

    ._c_results {
        font-size: 30px;
    }

    .mentors .new-widget-body {
        box-shadow: none;
        padding: 0;
    }

    .post-promo-meta.sp_msg .post-a-meta {
        line-height: 1;
    }

    .post-smsg p {
        font-size: 15px;
    }

    .post .post-promo-meta.sp_msg .post-promo a.bookmark {
        padding: 8px 10px;
    }
}

@media (max-width: 767px) {

    .vw-body .vw-tab a span,
    .vw-footer a span {
        display: none;
    }

    .eid-widget p {
        font-size: 15px;
        line-height: 22px;
    }

    .vw-body .vw-tab {
        min-width: 1px;
    }

    ._c_total {
        width: 50%;
        margin: 26px auto 0 auto;
    }

    ._c_sub {
        width: 100%;
        order: 3;
        padding: 15px;
    }

    ._c_sub_list {
        text-align: center;
    }

    ._c_results {
        width: 50%;
        font-size: 3rem;
        margin: 30px auto 0 auto;
        text-align: center;
    }

    .pop-container {
        height: 100%;
        width: 100%;
        margin-top: 0;
    }

    .covid-pop-content .row {
        display: block;
    }

    ._c_sub_list li span,
    .cov-title {
        display: block;
    }

    ._c_total .title,
    .cov-title span {
        margin: 0;
    }

    .cov-title img {
        display: block;
        margin: 18px auto 10px auto;
    }

    .cov-title span {
        display: block;
        width: 100%;
    }

    .new-widget-head h2 {
        margin-bottom: 0;
    }

    .covid-info,
    .help-center,
    .profile-edit,
    .mentors {
        padding: 12px 15px;
    }

    .covid-info .new-widget-body a,
    .profile-edit .new-widget-body,
    .mentors .new-widget-body {
        margin-top: 12px;
    }

    .mentors .select li .sel_exp a {
        font-size: 15px;
        width: 108px;
        display: block;
    }

    .mentors .select li .sel_exp br {
        display: none;
    }

    .mentors .select {
        max-height: 236px;
    }

    .ref-selected .ref-btns a {
        width: 50%;
        margin: 0 2px;
    }

    .ref-select span {
        font-size: 15px;
    }

    .sel_btns a {
        padding: 8px;
    }

    .mentor-tab-content ul li div.tab-name h3 {
        width: 148px;
    }

    .mentors .select li .sel_img {
        margin-right: 10px;
    }

    .vw-footer {
        margin-top: 10px;
        padding-top: 6px;
    }

}

@media (max-width: 600px) {
    .cov-title {
        font-size: 23px;
    }

    ._c_sub_list {
        font-size: 25px;
    }

    ._c_sub_list li {
        padding: 0 10px;
    }

    ._c_sub_list li span {
        font-size: 28px;
    }

    ._c_total .total {
        font-size: 5rem;
    }

    ._c_results {
        font-size: 2.3rem;
    }

    .cov-update {
        font-size: 15px;
    }

    ._c_results span {
        font-size: 2.2rem;
    }
}

@media (max-width: 450px) {
    ._c_total .total {
        font-size: 3.2rem;
    }

    ._c_results {
        font-size: 1.8rem;
    }
}

@media (max-width: 400px) {
    ._c_total {
        font-size: 22px;
    }

    ._c_total .total {
        font-size: 3.2rem;
    }

    ._c_results {
        font-size: 1.5rem;
    }

    ._c_sub_list {
        font-size: 22px;
    }
}

@media (max-width: 370px) {
    .sel_btns a span {
        display: none;
    }
}

@media (max-width: 350px) {
    .ref-selected .ref-btns a {
        width: auto;
        padding: 6px 8px;
    }

    .sel_btns a {
        padding: 8px 6px;
        margin: 0 2px;
        text-transform: capitalize;
    }

    .mentors .select li .sel_img {
        min-width: 40px;
    }

    .mentors .select li .sel_btns {
        display: flex;
        justify-content: space-between;
    }

    .mentors .mentor-btn {
        padding: 6px 2px;
        font-size: 13px;
    }

    .help-center .new-widget-body a svg {
        width: 25px;
        margin: 2px 1px 0 2px;
    }
}



@media(max-width: 991px) {
    .likepage-advert .post-promot-dropdown a.socio-channel {
        font-size: 15px;
    }

    .post .post-actions ul li {
        min-width: 1px;
    }

    .post .post-header {
        position: static;
        padding: 10px 10px 5px 10px;
    }

    .main-post-header {
        position: relative;
    }

    .post .extraRepost .post-actions ul.dropdown.promo-post-menu {
        top: 54px;
    }

    .post .extraRepost .post-actions ul.dropdown.promo-post-menu:before {
        margin: auto 14px auto auto;
    }

    article .friend-widget .col-md-4 .friends-new-sec a img {
        min-height: 1px;
        /*width: 90px;*/
        /*height: 90px;*/
        width: 100%;
        height: 175px;
        background-color: #e2e2e5;
    }

    article .friend-widget .col-md-4 .friends-new-sec {
        margin: 8px 8px;
    }

    article .friend-widget .col-md-4 .friends-new-sec a.pos-rel {
        display: block;
    }

    .post .post-promo-meta .post-promo a.apply-app-btn,
    .post .post-promo-meta .post-promo a.view-app-btn,
    .post .post-promo-meta .post-promo a.pst_share,
    .post .post-promo-meta .post-promo a.bookmark {
        width: auto;
        height: auto;
        padding: 6px 10px;
    }

    /*article .friend-widget .col-md-4 .friends-new-sec a div{*/
    /*right: -4px;*/
    /*}*/
    .post .post-actions ul li a .icon {
        font-size: 22px;
    }

    .post .post-actions ul li a {
        padding: 0;
        display: flex;
    }

    .post .post-actions ul li a span {
        font-size: 15px;
        top: 0;
        margin-left: 0;
    }

    .likepage-advert .post-promot-dropdown a i.fa-ellipsis-h {
        font-size: 24px;
    }

    .likepage-advert .post-promot-dropdown a i {
        font-size: 22px;
    }

    .likepage-advert .post-promot-dropdown a {
        margin-left: 10px;
    }

    .advert-prv-box .post-comment {
        padding: 9px 10px 4px 10px;
        background-color: transparent;
        border: none;
    }

    .help-center .new-widget-body {
        /*position: absolute;*/
        /*right: 10px;*/
        /*top: 0;*/
        align-items: center;
        z-index: 1;
        justify-content: space-evenly;
        box-shadow: 0 0 6px rgba(0, 0, 0, 0.1);
        border-radius: 6px;

    }

    .help-center .new-widget-body a {
        display: block;
        width: auto;
        align-items: center;
        margin: 0;
        box-shadow: none;
        padding: 8px 6px 4px 6px;
    }

    .vw-body .vw-tab a {
        padding: 6px 8px;
        width: 100%;
    }

    .help-center .new-widget-body a span {
        display: none;
    }

    .vw-body .vw-tab h2 {
        font-size: 15px;
    }

    .help-center .new-widget-body a span br {
        display: none;
    }

    .post .post-actions-holder {
        margin: 0 0;
    }

    .post .post-promo-meta,
    .adverholder .adv-post,
    .post .post-reactions {
        padding: 10px 15px;
    }

    /*.post .post-reactions{*/
    /*padding: 10px;*/
    /*}*/
    .main-post-header.extraRepost {
        padding: 10px 0 10px 15px;
    }

    .post .post-reactions .reactions ul li img,
    .post .post-reactions .reactions ul li svg {
        width: 18px;
        height: 18px;
    }

    .post .post-reactions .counters ul li span i {
        font-size: 19px;
    }

    .post .post-reactions .reactions span,
    .promotion-area .promot-detail .promo-text h1 {
        font-size: 15px;
    }

    .comment_actions .dropdown-dots a.dropdown-toggle {
        position: relative;
        top: 4px;
        margin-left: 0;
        padding: 0 12px;
    }

    .comment_actions .dropdown-dots a i,
    .comment_actions .general-dropdown a i {
        font-size: 26px;
        margin-top: 0px;
        position: relative;
        top: -5px;
        color: #525252;
    }

    .promotion-area .promot-detail .promo-text p,
    .winit-detail .winit-text .mng-font,
    .advert a,
    .post .revenue span.post-type {
        font-size: 15px;
    }

    .post .post-promo-meta .post-a-meta span {
        font-size: 15px;
        display: flex;
        align-items: center;
    }

    .post .post-promo-meta .post-a-meta span i {
        top: 0;
        font-size: 16px;
    }

    .promotion-area .promot-detail .promo-text {
        padding: 0 10px;
    }

    .promotion-area .promot-detail.flexbox {
        display: block;
    }

    .advert .advert {
        margin-right: 0;
        padding: 0 0 0 10px;
    }

    .post .post-header .post-actions a .icon {
        font-size: 18px;
    }

    .post .revenue {
        /*padding: 12px 10px;*/
        /*line-height: 1;*/
    }

    .likepage-advert .promotion-area .lftcntpd {
        margin-right: 0;
    }

    .social-icons span {
        margin-left: 0;
        font-size: 0.9em;
        color: #000;
    }

    .post .post-reactions .reacted-user-btn span.reacted-user-btn-icon span {
        font-size: 12px;
        margin-left: 0;
    }

    .user-reaction-close-modal svg,
    .user-action-close-modal svg {
        width: 12px;
    }

    .promotion-area .promot-detail .promo-d-bg {
        background-image: none !important;
        min-width: 1px;
        min-height: 1px;
    }

    .promotion-area .promot-detail .promo-d-bg img {
        display: block;
        width: 100%;
    }

    .win-it-quiz-create-btn {
        margin: 4px 15px 2px 15px;
    }

    .win-it-quiz-create-btn a {
        padding: 10px 0;
    }

    .post .post-actions ul {
        padding: 0 0;
        margin: 0 -15px
    }

    .post .post-actions ul.dropdown.promo-post-menu {
        right: 0;
        min-width: 41vh;
        /* left: 0; */
        max-width: 100%;
        width: 100%;
        top: 55px;
        padding: 0;
        margin: 0;
    }

    .post .post-actions ul.dropdown.promo-post-menu:before {
        content: '';
        position: absolute;
        left: 0;
        right: 0;
        margin: auto 8px auto auto;
        bottom: auto;
        top: -10px;
        width: 0;
        height: 0;
        border-left: 9px solid transparent;
        border-right: 10px solid transparent;
        border-bottom: 10px solid #dddfe2;
        clear: both;
        z-index: 9;
    }

    .post .post-actions .dropdown-container {
        position: static;
    }

    .post .post-actions ul li:first-child {
        border-top: none;
    }

    .videotimeline_post.post .post-actions-holder {
        margin: 0 15px 10px 15px;
    }

    .winit-detail .winit-text h2 span {
        max-width: 200px;
        margin-left: 0;
        display: block;
    }

    .winit-detail .winit-text h2 {
        display: block;
        font-size: 15px;
        line-height: 1.2;
        margin-bottom: 6px;
    }

    .winit-detail .winit-text .quiz-game-buttons button.btn.btn-share.btn-watch-now,
    .winit-detail .winit-text .quiz-game-buttons button.btn.btn-blue.btn-join-quiz {
        min-width: 85px;
    }

    .post-header.table.w96 .post-user-info.td {
        padding: 0;
    }

    .winitquiz {
        background-position: center;
        background-size: cover;
        min-height: 145px;
    }

    .post .post-header .post-meta .sec-top span a,
    .post .repost-holder .post-header .post-meta .sec-top,
    .likepage-advert .lftcntpd h5>a,
    .post .repost-holder .first-repost .post-header .post-meta .sec-top span.bold {
        font-size: 15px;
    }

    .likepage-advert .btn.opinion-follower {
        font-size: 12px;
    }

    .post .post-reactions .reactions span {
        margin-left: 2px;
    }

    .post .post-reactions .reacted-user-btn.sendreactionfriendRequest span.reacted-user-btn-icon {
        min-width: 120px;
    }

    .post .post-reactions .reacted-user-btn span.reacted-user-btn-icon {
        min-width: 120px;
        width: 100%;
    }

    .post-content.job-data .msg_cnt {
        font-size: 16px !important;
    }

    .make-post-new {
        padding: 15px 15px 2px 15px;
    }

    .make-post-new.demo-t-area {
        padding: 15px;
    }

    .adverholder .adv-post .new-gray-btn.new-design-btn {
        padding: 10px 10px;
        font-size: 15px;
        border-radius: 6px;
        line-height: 1;
    }

    .promotion-area img.smal-thumb {
        width: 46px;
        height: 46px;
    }

    .post .revenue {
        padding: 10px 15px;
    }

    .post .post-promo-meta .post-promo a span {
        font-size: 14px;
    }

    .stories-here a {
        height: 190px;
        margin: 0 10px 0 0;
        width: 110px;
    }

    .thumb-p-new {
        font-size: 13px;
    }

    .main-story .stories-here.create-st {
        margin-right: 10px;
        min-width: 95px;
    }

    .mentors .mentor-btn {
        font-size: 14px;
        padding: 6px 8px;
    }

    .videotimeline_post .post-promo-meta {
        padding: 10px 0 0 0;
    }

    .videotimeline_post a.cnt_video_views {
        font-size: 13px !important;
        padding: 10px 15px !important;
    }

    .three-images {
        min-height: 128px;
    }

    .three-images .overlay-see-phpto {
        width: 99%;
        height: 130px;
    }

    .three-images .overlay-see-phpto span {
        font-size: 14px;
        padding: 22px 0;
    }

    .two-images .pos-rel {
        min-height: 175px;
        width: 49.86%;
    }

    .two-images .pos-rel .osp-detail h2,
    .two-images .pos-rel .osp-detail p {
        display: none;
    }

    .overlay-see-phpto {
        max-height: none;
    }

    .likepage-advert .lftcntpd h5>a {
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        max-width: 150px;
    }

    .islamic-seprator {
        display: none;
    }

    .islamic-widget-display li a {
        font-weight: 400;
        font-size: 13px;
    }

    .islamic-widget-display li:nth-child(n+2)::before {
        display: none;
    }
}

@media (max-width: 350px) {
    .vw-funds h2 {
        font-size: 15px;
    }

    .help-center .new-widget-body a {
        padding: 8px 3px 8px 3px;
    }

    .post .post-promo-meta .post-promo a {
        min-width: 1px;
        padding: 8px 10px;
    }

    .post .post-promo-meta .post-promo a span i {
        display: none;
    }

    .st-thumb i {
        font-size: 20px;
        padding: 8px 6px 3px 8px;
    }

    .mentors .mentor-btn {
        width: auto;
    }

    .islamic-seprator {
        display: none;
    }
}

.color-changed a {
    color: #fff !important;
}

.open-commment-image {
    cursor: pointer;
}

.fontSizeFixed {
    font-size: 15px !important;
    font-family: roboto-regular, Segoe UI, markazi;
    color: #000;
}

.ytimg {
    position: relative;
    cursor: pointer;
}

.play-btn {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.play-btn img {
    width: 70px
}

.post-youtube {
    width: 100%
}

.youtube_sub_sec .subscribe_btn {
    background-color: #c10404;
    border-radius: 6px;
    padding: 10px;
    line-height: 1;
}

.youtube_sub_sec .channel_title {
    line-height: 40px;
}

.islamic-widget {
    background-image: url('https://images.socioon.com/res/incomeon/image/upload/1612251682115.png');
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    border-radius: 8px;
    margin-bottom: 20px;
}

.islamic-widget-display li a {
    color: #fff;
    font-weight: 600;
}

.islamic-widget-display {
    display: flex;
    justify-content: space-around;
    align-items: center;
    color: #fff;
    height: 60px;
}

.islamic-widget-display .islamic-seprator {
    margin-left: 40px;
    color: #fff;
    font-weight: 600;
}

.islamic-widget-display li:nth-child(n+2)::before {
    content: " \0000a0|";
    font-weight: 600;
    padding-right: 50px;
}

.wallet-detail-sec {
    background: url('https://images.socioon.com/res/incomeon/image/upload/1619677608680.png') no-repeat left top;
    background-size: cover;
    border-radius: 0px;
}

.circle-holder {
    width: 93px;
    height: 93px;
    background: #fff;
    border-radius: 50%;
    margin: 0 0 14px;
    background-size: cover;
    border: 2px solid #fff;
}

.circle-block {
    display: flex;
    flex-direction: column;
    text-align: center;
    width: 120px;
    padding: 38px 15px 0;
}

.circle-txt-holder,
.circle-txt-holder p,
.circle-txt-holder span {
    font-size: 14px;
    line-height: 17px;
    color: #fff;
}

.circle-txt-holder p {
    margin: 0 0 5px;
}

.circle-blc-container {
    display: flex;
    /* padding: 0 24px; */
    margin: 0 0 30px;
    text-align: center;
    justify-content: center;
    flex-wrap: wrap;
}

.join-btn {
    margin-left: 0;
    display: flex;
    justify-content: center;
    color: #FFFFFF;
}

.join-button {
    background: linear-gradient(0deg, #59A33C, #01611C 90%) no-repeat;
    border: none;
    font-size: 15px;
    line-height: 1;
    padding: 10px 0;
    min-width: 157px;
    transition: width 2s linear 1s;
    border-radius: 6px;
    color: #fff;
    margin: 0 0 15px;
}

.join-button:hover {
    background: linear-gradient(0deg, #01611C, #59A33C 90%) no-repeat;
}

.join-btn-text1 {
    margin: 0 0 15px;
}

.w-menu .heading {
    margin: 0;
}

span#participant_counter {
    padding: 0 0 0 3px;
}

.win-text {
    border-radius: 30px;
    border: 0;
    background-color: #394a58;
    padding: 2px 8px;
}

.winner-wheel-links {
    display: flex;
    padding: 10px;
}

.winner-wheel-links a:nth-child(2) {
    margin-left: auto;
}

.winner-wheel-links a {
    /* font-weight: bold; */
    background: #f0f2f5;
    padding: 10px 10px;
    border-radius: 6px;
    border: 1px solid #ccc;
    line-height: 1;
    font-size: 0.9rem;
    color: #64697d;
    border: 1px solid #f0f2f9;
}

.binance-widget {
    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#1b78ff+0,39aeff+100 */
    background: #1b78ff;
    /* Old browsers */
    background: -moz-linear-gradient(top, #1b78ff 0%, #39aeff 100%);
    /* FF3.6-15 */
    background: -webkit-linear-gradient(top, #1b78ff 0%, #39aeff 100%);
    /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, #1b78ff 0%, #39aeff 100%);
    /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1b78ff', endColorstr='#39aeff', GradientType=0);
    /* IE6-9 */
    position: relative;
    margin-bottom: 15px;
    padding-bottom: 15px;
    border-radius: 10px;
    border-bottom: 3px solid #dddfe2;
    padding: 20px 20px 30px;
    background-repeat: no-repeat;
    background-size: cover;
    width: 100%;
}

.escrow-widget>h2 {
    color: #fff;
    margin: 0 0 15px;
    font-size: 18px;
}

.binance-widget p {
    font-size: 16px;
    line-height: 21px;
    font-weight: 600;
    margin: 0 0 23px;
}

.binance-widget>img {
    margin: 0 0 18px;
}

.binance-widget a i {
    font-size: 17px;
    padding-right: 6px;
}

.binance-apply-btn {
    font-family: roboto-medium;
    font-weight: 400;
    color: #fff;
    font-size: 16px;
    line-height: 19px;
    background-color: #000;
    margin: 0;
    display: inline-block;
    vertical-align: top;
    min-width: 120px;
    padding: 10px 16px;
    text-align: center;
    border-radius: 3px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
}

.binance-apply-facebook {
    background-color: #3b5998;
    margin-left: 10px;
    vertical-align: middle;
}

.binance-apply-youtube {
    background-color: #c4302b;
    margin-left: 10px;
    min-width: 185px;
}

.escrow-apply-usd {
    background-color: #0570f6;
    margin-left: 10px;
    vertical-align: middle;
}

.small-box-info1 span {
    font-size: 0.9286rem;
    color: #0570f6;
    display: block;
    line-height: 1.2rem;
}

.user-comment .comment_name {
    color: #000;
}

#pst_vid_view_cnt>a {
    color: #000;
}

.winitquiz_results-new {
    padding-bottom: 25px;
}

.main-story-new {
    margin-bottom: 10px;
}

.main-story .stories-here.stories-here-one {
    margin-top: 0;
    padding-bottom: 0px;
}

/* .newHeader h2 a {
    color: #5f6670;
} */

.margin-btm-zero {
    margin-bottom: 0 !important;
}

.ellipsis-one {
    padding-left: 8px;
    padding-right: 8px;
}

.user-social-follower-new {
    border-radius: 6px;
    padding: 10px;
}

@media (max-width: 768px) {
    .st-thumb-one i {
        left: 50%;
        top: 50%;
        transform: translate(-50%, 50%);
        background: #2283ff;
        border-width: 3px;
        margin-top: -5px;
        width: 30px;
        height: 30px;
        font-size: 12px;
    }

    .sel_btns a {
        font-size: 12px;
        margin: 0 2px;
        border-radius: 6px;
    }
}

@media (max-width: 576px) {
    


    .custom-right-new-boxes .pt-btns a.blue-btn-new {
        margin-bottom: 0;
    }

    .custom-right-new-boxes .pt-btns a.blue-btn-new.grey-btn-new {
        margin-bottom: 15px;
    }

    .post .post-promo-meta .post-promo a span {
        font-size: 14px;
        line-height: 1.25;
    }

    .cmt_loadmore {
        /* padding: 15px 8px 0; */
        color: #171717;
        display: block;
        font-family: roboto-medium;
        font-size: 13px;
        font-weight: 400;
        margin-left: 0;
    }

    .cmt_loadmore i.far.fa-comment-alt {
        padding-right: 2px;
    }

    .post-content .msg_cnt span a {
        color: #1d2129;
    }

    .user-comment .comment_actions * {
        font-size: 13px;
    }

    .youtube_sub_sec_one {
        padding-left: 0;
        padding-right: 0;
        position: relative;
        top: 11.1%;
        transform: translateY(-50%);
    }

    .binance-apply-facebook {
        margin-left: 0;
        margin-top: 10px;
        margin-bottom: 10px;
        display: block;
    }

    .binance-apply-youtube {
        margin-left: 0;
        display: block;
    }

    .binance-apply-btn {
        display: block;
    }

    .binance-widget>img {
        margin: 0 0 18px;
        margin-left: auto;
        margin-right: auto;
        width: 150px;
        display: block;
        object-fit: cover;
        object-position: center;
    }

    .escrow-apply-usd {
        margin-left: 0;
        margin-top: 10px;
    }

    .media-socio-holder ul li {
        margin-right: 7px;
        margin-bottom: 0px;
    }

    .post-text-area.socio-new-sec {
        max-width: none;
        width: 90.3%;
    }

    .media-socio-holder ul {
        display: flex;
        flex-wrap: wrap;
        margin: 5px 0 0 3px;
        align-items: center;
    }

    .media-socio-holder ul li a svg {
        width: 35px;
        height: 35px;
    }

    .media-socio-holder h3 {
        padding-right: 0;
        width: 100px;
        text-align: left;
        font-size: 14px;
    }

    .new-widget-anchorhold {
        margin-right: 8px;
        text-align: center;
        padding: 20px 8px;
    }

    .small-box-info1 h4 {
        font-size: 0.9rem;
    }

    .svg-hold1 {

        margin-right: 0;
        background: #fff;
       /*  margin-bottom: 7px; */
        border-radius: 50%;
        /* width: rem;
        height: 2.5rem; */
        display: flex;
        flex-direction: column;
        align-items: center;
        text-align: center;
        margin-left: auto;
        margin-right: auto;
    }

    .svg-hold1>svg {
        position: relative;
        top: 4px;
        width: 1.4rem;
    }
    .svg-hold1-new {

        margin-right: 0;
        border-radius: 50%;
        width: 2.5rem;
        height: 2.5rem;
        display: flex;
        flex-direction: column;
        align-items: center;
        text-align: center;
        margin-left: auto;
        margin-right: auto;
    }
    .new-kpl-widget{
        padding: 20px 15px !important;
    }
    .h4-class{
        font-size: 14px !important;
        margin-left: 0px !important;
    }
    .about2-carousel-thumbs.friend-widget {
        width: 86.8%;
        max-width: 600px;
        margin: 0 auto;
        padding: 0;
        overflow: hidden;
    }

    .about2-carousel-thumbs.friend-widget .cw-tabs .cw-arrows {
        border-radius: 50%;
        width: 25px;
        height: 25px;
        text-align: center;
        border: none;
        -webkit-box-shadow: 0px 0px 7px 0px rgba(0, 1, 0, 0.15);
        -moz-box-shadow: 0px 0px 7px 0px rgba(0, 1, 0, 0.15);
        box-shadow: 0px 0px 7px 0px rgba(0, 1, 0, 0.15);
        align-items: center;
        text-align: center;
        justify-content: center;
    }

    .about2-carousel-thumbs.friend-widget a img {
        width: 75px;
        height: 75px;
        margin: 0 auto;
    }

    .about2-carousel-thumbs.friend-widget .cw-tabs .cw-tab {
        min-width: 59px;
        padding: 0;
    }

    .about2-carousel-thumbs.friend-widget .cw-tabs .cw-tab {
        min-width: 80px;
        padding: 0;
    }

    .about2-carousel-thumbs.friend-widget .cw-tabs .cw-arrows {
        left: -10px;
        right: -10px;
        font-size: 13px;
    }

    .about2-carousel-thumbs.friend-widget .cw-tabs .cw-arrows.cw-right {
        left: auto;
        right: -10px;
    }

    .about2-carousel-thumbs.friend-widget .cw-tabs .cw-arrows.cw-left {
        right: auto;
        left: -10px;
    }

    .st-thumb-one i {
        left: 50%;
        top: auto;
        bottom: 0;
        transform: translate(-50%, 50%);
        background: #2283ff;
        border-width: 3px;
        margin-top: -5px;
        width: 32px;
        height: 32px;
        font-size: 12px;
    }

    .stories-here.stories-here-one a {
        height: 190px;
    }

    .thumb-p-new {
        font-size: 13px;
    }

    .movie-main-title-new {
        margin-bottom: 10px;
    }

    .stories-here.stories-here-one a {
        height: 190px;
        width: 110px;
    }

    .thumb-p-new {
        font-size: 12px;
    }

    .ref-selected-new .ref-btns a {
        font-size: 13px;
    }

    .ref-selected-new {
        padding: 15px 5px;
    }

    .small-box-info1 span {
        font-size: 0.8rem;
        color: #0570f6;
        display: block;
        line-height: 1.2rem;
    }

    .small-box-info1 h4 {
        font-size: 0.70rem;
    }

    .channel_title>h5 {
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap;
        width: 200px;
    }

    .image_upload_form {
        padding-bottom: 0;
    }

    .border-continer.create-post-job .border-dashed {
        color: #1f1d23;
    }

    .border-continer .border-dashed a i {
        color: #1f1d23 !important;
    }

    .create-post-job i.fa-times {
        padding-bottom: 50% !important;
    }

    #event-text #sts-lf-evnt-src {
        margin-right: 0;
    }

    button#remove_feeling_btn {
        color: #1f1d23;
    }

    .create-post-job .select-drop::after {
        top: 20px;
    }

    .custom-right-new-boxes .pt-btns a.blue-btn-new:nth-child(2) {
        margin-bottom: 0;
    }

    .custom-right-new-boxes p {
        margin-bottom: 10px;
    }

    .user-comment {
        padding: 5px 10px 5px 10px !important;
        border-top: 0;
        font-size: 12px;
    }

    .user-social-follower-new {
        border-radius: 6px;
        padding: 7px 10px;
    }

    .user-social-button-new {
        padding: 5px 15px;
        display: inline-block;
    }

}

@media (max-width: 320px) {
    #mylist .template-download {
        width: 22.0%;
    }

    .channel_title>h5 {
        width: 125px;
    }

    .ref-selected-new h3,
    .ref-selected-new h4 {
        font-size: 13px;
    }

    .st-thumb-one i {
        font-size: 12px;
    }

    .thumb-p-new {
        font-size: 13px;
    }

    .media-socio-holder ul li a svg {
        width: 30px;
        height: 30px;
    }

    .media-socio-holder ul li {
        margin-right: 1.13rem;
        height: 30px;
    }

    .media-socio-holder ul li:last-child {
        margin-right: 0;
    }

    .new-widget-anchorhold {
        padding: 15px 10px;
    }

    .small-box-info1 a {
        font-size: 0.85rem;
    }

    .small-box-info1 h4 {
        font-size: 0.85rem;
    }

    .media-socio-holder h3 {
        width: 100%;
    }

    .media-socio-holder ul {
        margin: 5px 0 0 0;
    }

    .media-socio-holder {
        flex-direction: column;
        padding-top: 0;
    }

    .media-socio-holder ul {
        justify-content: flex-start;
        margin-top: 8px;
    }
}
@media (max-width: 375px) {
.h4-class{
        font-size: 13px !important;
        margin-left: 0px !important;
    }
}

#ptr-light-indicator {
    width: 35px;
    z-index: 955555;
    margin: 0 auto;
    transform: translateY(0);
    position: relative;
    top: -55px;
    transition: transform 300ms ease
}

#ptr-light-spinner {
    display: block;
    height: 35px;
    width: 35px;
    position: absolute;
    top: 10px;
    background: url('https://images.socioon.com/assets/images/fav.ico');
    background-size: contain
}

.rotateLoop {
    -webkit-animation: rotation .9s infinite linear;
    -moz-animation: rotation .9s infinite linear;
    -o-animation: rotation .9s infinite linear;
    animation: rotation .9s infinite linear
}
 .new-kpl-widget{
            background-color: #4FAA48 !important; 
            margin-bottom: 0px;
            padding: 15px 70px;
        }
        .svg-hold-new{
            back
        }
        .small-box-info1-new{
            vertical-align:middle;
            display: inline-block;
        }
        .h4-class{
            color: #fff !important;
            margin-left: 15px;
            font-size:15px;
        }
@-webkit-keyframes rotation {
    from {
        -webkit-transform: rotate(0deg)
    }

    to {
        -webkit-transform: rotate(359deg)
    }
}

@-moz-keyframes rotation {
    from {
        -moz-transform: rotate(0deg)
    }

    to {
        -moz-transform: rotate(359deg)
    }
}

@-o-keyframes rotation {
    from {
        -o-transform: rotate(0deg)
    }

    to {
        -o-transform: rotate(359deg)
    }
}

@keyframes rotation {
    from {
        transform: rotate(0deg)
    }

    to {
        transform: rotate(359deg)
    }
}

.sidbar_sticky {

    transition: .8s ease;
    right: -120px;
    position: fixed;

    background-color: white;
    z-index: 999;
    bottom: 11%;
    border-left: 1px solid #dcdcdc;
    border-top: 1px solid #dcdcdc;
    border-bottom: 1px solid #dcdcdc;
    border-radius: 10px 0 0 10px;
}

.sidbar_sticky li {
    margin: 5px;
    border-bottom: 1px solid #e8eaeb;
    text-align: center;
}

.sidbar_sticky li:last-child {
    border-bottom: none;
    margin-bottom: 0px;
}
.video-container { position: relative; padding-bottom: 56.25%; padding-top: 0px; height: 0; overflow: hidden;margin: 0px 0px 0 0px; }
.video-container iframe, .video-container object, .video-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.kpl-banners{
    display: flex;
    list-style:none;
    justify-content: space-evenly;
    color: #000;
    font-weight: 600;
    font-size: 15px;
}
.margin-t-15{
    margin-top: 15px;
}
.kpl-text-trans{
    text-transform: uppercase;
}
.right_border_remove{
    border-right:none !important;

}
.ul_bottom_margin{
    margin-bottom: 15px;
}
.ad_image{
    /* background: url('https://images.socioon.com/res/incomeon/image/upload/1636715886269.png') no-repeat center center;  */
    background-color: #cccccc; /* Used if the image is unavailable */
    height: 281px; /* You must set a specified height */
    color: #fff;
    background-size: cover; /* Resize the background image to cover the entire container */
    border-radius: 6px;
    margin: 15px;
}
.flex-container{
    display: flex;
    flex-direction: column;
    padding: 36px;
    width: 75%;

}
.flex-container .p-size{
    font-size: 14px;
    margin-top: 5px;
    color: #fff;
    line-height: 18px;

}
.flex-container .heading-increased{
    font-size: 35px;
    line-height: 43px;
}
.ad_link{
    background: #845235;
    color: #fff;
    border: 0;
    outline: 0;
    border-radius: 6px;
    /* display: block; */
    cursor: pointer;
    padding: 10px 16px;
    /* line-height: 1; */
    font-size: 15px;
    margin-top: 10px;
    display: block;
    text-align: center;
    width: 50%

}
@media only screen and (max-width: 576px){
    .flex-container {
        width: 92% !important;
        padding: 20px !important;
    }
}