body {
    background-color: #f0eef3;
}

* {
    margin: 0;
    padding: 0;
    font-family: 'Roboto', sans-serif;
    font-size: 16px;
    color: #454545;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    -webkit-tap-highlight-color: rgba(255, 238, 236, 0.3);
    touch-action: manipulation;
}

button {
    border: none;
    background-color: transparent;
}

a {
    text-decoration: none;
}

input {
    -webkit-appearance: none;
    -webkit-border-radius: 0px;
}

textarea, select, input, button { outline: none; }

table { border-collapse:collapse; border-spacing: 0; }

td, th {
    padding: 0;
}

th {
    text-align: left;
}

/* clears the 'X' from Internet Explorer */
input[type=search]::-ms-clear {  display: none; width : 0; height: 0; }
input[type=search]::-ms-reveal {  display: none; width : 0; height: 0; }

/* clears the 'X' from Chrome */
input[type="search"]::-webkit-search-decoration,
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-results-button,
input[type="search"]::-webkit-search-results-decoration { display: none; }


::-webkit-scrollbar {
    display: none;
}

.a {
    cursor: pointer;
    color: #330cc0;
}

.root .primary-column {
    background-color: #f1eef3;
    min-height: 100vh;
}

/* alert */

.alert {
    background-color: #4a75b5;
    color: white;
    padding: 8px 15px;
    font-size: 14px;
    z-index: 1;
    position: relative;
}

/* modal */

.modal-open {
    bottom: 0;
    left: 0;
    right: 0;
    top: 0;
}

.slide-full-modal {
    animation-duration: 600ms;
}

/* biutest objects */

.section-title {
    margin-bottom: 20px;
    position: relative;
}

.section-title-margin-sm {
    margin-bottom: 10px;
}

.section-title .icon-box {
    width: 25px;
    text-align: center;
    position: absolute;
    top: 0;
    left: 0;
}

.section-title .icon-box i {
    color: #ff9e9e;
    font-size: 18px;
    padding-top: 3px;
}

.section-title .title {
    font-size: 21px;
    color: #ff9e9e;
    font-weight: 500;
    display: inline-block;
    letter-spacing: -0.5px;
    margin-left: 30px;
}

.section-title .title .count {
    font-size: 15px;
    margin-left: 3px;
    font-weight: 900;
}

.section-title .subtitle {
    display: block;
    margin-top: 3px;
    font-size: 12px;
    margin-left: 30px;
    color: #6d6d6d;
}

.section-title .subtitle i {
    color: #8b8b8b;
    font-size: 9px;
}

.section-title-no-icon .title,
.section-title-no-icon .subtitle {
    margin-left: 0;
}

.section-title-right-more-a {
    float: right;
    padding-top: 5px;
}

.more-a {
    font-size: 12px;
    color: #6277AE;
}

.menu-container {
    padding: 0 15px 15px 15px;    
}

.menu-container .menu-box {
    border-radius: 10px;
    background-color: #fbfbfb;
    border: 1px solid #D5D9D9;
    overflow: hidden;
}

.menu-container .menu-box .menu-row {
    border-bottom: 1px solid #D5D9D9;
    padding: 15px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.menu-container .menu-box .menu-row:hover {
    background-color: #f5f5f5;
}

.menu-container .menu-box .menu-row:last-child {
    border-bottom: none;
}

.menu-container .menu-box .menu-row .text-content {
    
}

.menu-container .menu-box .menu-row .text-content .text {
    
}

.menu-container .menu-box .menu-row .badge {
    font-size: 12px;
    background-color: #ff9d9d;
    border-radius: 10px;
    padding: 3px 7px;
    color: white;
    margin-left: 5px;
}

.menu-container .menu-box .menu-row .badge-green {
    background: linear-gradient(111deg, #272727 0%, #707070 100%);
    padding: 2px 12px;
    border-radius: 15px;
    font-size: 13px;
    color: white;
    font-weight: 500;
    margin-left: 5px;
    display: inline-block;
}

.menu-container .menu-box .menu-row .arrow {
    
}

.menu-container .menu-box .menu-row .arrow i {
    
}

.menu-container .menu-box .menu-row .amount {
    min-width: 80px;
    text-align: right;
    display: flex;
    flex-direction: column;
}

.menu-container .menu-box .menu-row .deposit {
    color: green;
    font-weight: 900;
}

.menu-container .menu-box .menu-row .withdrawal {
    color: red;
    font-weight: 900;
}

.menu-container .menu-box .menu-row .top {

}

.menu-container .menu-box .menu-row .bottom {
    display: flex;
    justify-content: flex-end;
    margin-top: 3px;
}

.menu-container .menu-box .menu-row .bottom .order-value {
    font-size: 14px;
    color: #8d8d8d;
}

.menu-container .menu-box .menu-row .transaction {
    display: flex;
    align-items: center;
}

.menu-container .menu-box .menu-row .transaction .image-sm {
    
}

.menu-container .menu-box .menu-row .transaction .image-sm .profile {
    height: 40px;
    margin-right: 10px;
    border: 1px solid #e9e9e9;
    border-radius: 5px;
}

.menu-container .menu-box .menu-row .transaction .info {
    display: flex;
    flex-direction: column;
}

.menu-container .menu-box .menu-row .transaction .info .top {
    display: block;
    font-weight: 500;
    color: #ff9e9e;
    margin-bottom: 0px;
    font-size: 14px;
}

.menu-container .menu-box .menu-row .transaction .info .biutest-transaction {
    color: #988b9e;
}

.menu-container .menu-box .menu-row .transaction .info .bottom {
    margin-bottom: 5px;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    font-size: 14px;
}

.menu-container .menu-box .menu-row .transaction .info .expiration {
    font-size: 14px;
    color: #8d8d8d;
}


.menu-alt-container {
    
}

.menu-alt-container .menu-alt-row {
    padding: 15px;
    border-bottom: 1px solid #e6e6e6;
    display: flex;
    justify-content: flex-start;
}

.menu-alt-container .menu-alt-row:last-child {
    border-bottom: none;
}

.menu-alt-container .menu-alt-space {
    height: 30px;
    border-bottom: 1px solid #e6e6e6;
}

.menu-alt-container .left {
    width: 50%;
    min-width: 165px;
}

.menu-alt-container .left-with-icon {
    padding-top: 5px;
}

.menu-alt-container .left .title {
    font-weight: 500;
}

.menu-alt-container .right {
    width: 50%;
    word-break: break-all;
}

.menu-alt-container .right .title,
.menu-alt-container .right .title * {
    color: #4a75b5;
}

.menu-alt-container .right .title p {
    display: block;
    margin-bottom: 10px;
} 

.menu-alt-container .right .title .range {
    font-size: 13px;
    color: #454545;
    padding: 5px 10px 5px 10px;
    background-color: #f0eef3;
    border: 1px solid #b9b9b9;
    border-radius: 10px;
    display: inline-block;
    margin-top: 10px;
}

.menu-alt-container .right .blank {
    font-weight: 500;
    display: block;
    border: 1px solid red !important;
    background-color: #fff7f7;
    border-radius: 10px;
    padding: 10px;
    color: red;
    font-size: 13px;
    cursor: pointer;
}

.menu-alt-container .right .blank i {
    font-size: 13px;
    color: red;
}

.bottom-menu-modal .biucredits-card-container {
    padding: 0px;
}

.biucredits-card-container {
    padding: 0 15px;
}

.biucredits-card-container .biucredits-card {
    background-color: #272727;
    border-radius: 20px;
    max-width: 380px;
    margin: auto;
    position: relative;
    overflow: hidden;
    min-height: 230px;
}

.bottom-menu-modal .biucredits-card-container .biucredits-card {
    min-height: 210px;
}

.biucredits-card-container .biucredits-card .bg-reflection {
    clip-path: polygon(50% 0, 100% 0%, 100% 100%, 0% 100%);
    background: linear-gradient(60deg, #404040 0%, #000000 100%);
    height: 100%;
    width: 80%;
    position: absolute;
    left: 130px;
}

.biucredits-card-container .biucredits-card .bg-content {
    position: absolute;
    width: 100%;
}

.biucredits-card-container .biucredits-card .top {
    padding: 20px;
    display: flex;
    min-height: 120px;
    flex-direction: column;
}

.bottom-menu-modal .biucredits-card-container .biucredits-card .top {
    min-height: 100px;
}

.biucredits-card-container .biucredits-card .top .text {
    color: white;
    font-size: 16px;
    font-weight: 200;
    display: block;
    margin-bottom: 5px;
}

.biucredits-card-container .biucredits-card .top .amount {
    color: white;
    font-size: 32px;
    font-weight: 900;
}

.biucredits-card-container .biucredits-card .bottom {
    padding: 20px;
    display: flex;
    border-top: 1px solid white;
    justify-content: space-between;
    align-items: center;
}

.biucredits-card-container .biucredits-card .bottom .biu-logo {
    height: 20px;
}

.biucredits-card-container .biucredits-card .bottom .user {
    display: flex;
}

.biucredits-card-container .biucredits-card .bottom .user .profile {
        width: 25px;
    height: 25px;
    object-fit: cover;
    border-radius: 50%;
    margin-right: 10px;
}

.biucredits-card-container .biucredits-card .bottom .user .user-name {
    font-size: 22px;
    font-weight: 200;
    color: white;
    letter-spacing: 1px;
}

.biucredits-card-container .title {
    display: block;
    margin-top: 15px;
    text-align: center;
    font-size: 18px;
    line-height: 24px;
    font-weight: 200;
    margin-bottom: 15px;
}

.biucredits-card-container .title a {
    font-size: 18px;
    line-height: 24px;
    font-weight: 200;
    background-image: linear-gradient(to bottom, transparent 0, #ffe5dd 0);
    background-position: 0 0.8em;
    background-repeat: no-repeat;
    -webkit-transition: background-position 0.08s ease-out;
    -ms-transition: background-position 0.08s ease-out;
    -moz-transition: background-position 0.08s ease-out;
    -o-transition: background-position 0.08s ease-out;
    transition: background-position 0.08s ease-out;
    cursor: pointer;
}


.wide-panel {
    display: flex;
    padding: 15px;
    justify-content: space-between;
    margin-bottom: 7px;
}

.wide-purple-panel {
    background-color: #432985;
}

.wide-black-panel {
    background-color: #272727;
}

.wide-panel .left {
    display: flex;
    align-items: center;
}

.wide-panel .left .title span {
    color: white;
    font-weight: 500;
    font-size: 18px;
}

.wide-panel .right {

}

.wide-panel .right .top {
    display: flex;
    justify-content: flex-end;
    align-items: center;
}

.wide-panel .right .top .more {

}

.wide-panel .right .top .more span {
    font-size: 13px;
    display: block;
    cursor: pointer;
}

#biuexp-home .right .top .more span {
    color: #A388E5;
}

#biucredits-home .right .top .more span {
    color: #959595;
}

.wide-panel .right .bottom {
    display: flex;
    justify-content: flex-end;
}

.wide-panel .right .bottom .index {
    display: flex;
    align-items: center;
}

.wide-panel .right .bottom .index span {
    font-size: 22px;
    color: white;
    font-weight: 900;
    margin-right: 7px;
}

.wide-panel .right .bottom .index i {
    color: #FFEB3B;
    font-size: 18px;
}

/* loader */

.loader-pagination {
    text-align: center;
    height: 100px;
}

.loader-section {
    text-align: center;
}

.loading-container {
    min-height: 640px;
}


#loader-pagination, #loader-section, #loader-section-wrapper, #loader-section-color, #loader-post-comments, #notifications-section, #loader-pagination-comments, #loader-comments-notifications-pagination, #loader-question-notifications-pagination, #loader-pagination-activity, .loader-pagination {
    text-align: center;
    background-color: #f1eef3;
}

#loader-pagination-coll-prod {
    text-align: center;
    background-color: white;
}

#loader-post-show, #loader-home, #loader-post-promote, #loader-post-promo {
    text-align: center;
}

#loader-section, #loader-section-color, .loader-section {
    height: 100vh;
}

.loader-min-height {
    min-height: 400px;
}

.loader-bg-w {
    background-color: white;
    text-align: center;
    padding-top: 20px;
    min-height: 150px;
}

.loader-pagination-padding {
    padding-bottom: 0px;
}

.loader-phrases {
    height: 64px;
    max-width: 250px;
    margin: auto;
    margin-bottom: 150px;
}

.loader-phrases-fixed {
    position: fixed;
    left: 0;
    right: 0;
    margin-top: 80px;
}

.loader-phrases .wrap {
    display: block;
    margin-bottom: 15px;
    line-height: 20px;
    color: #988b9e;
}

.pagination-w {
    background-color: white;
    text-align: center;
}

.pagination-w > nav span a, .pagination-w > nav span {
    color: white;
}

.pagination-c {
    background-color: #f0eef3;
    text-align: center;
}

.pagination-c > nav span a, .pagination-c > nav span {
    color: #f0eef3;
}

.lds-ellipsis-wh {
    display: inline-block;
    position: relative;
    width: 65px;
    height: 80px;
}

.lds-ellipsis-wh div {
    position: absolute;
    top: 40px;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background: white;
    animation-timing-function: cubic-bezier(0, 1, 1, 0);
}

.lds-ellipsis-wh div:nth-child(1) {
    left: 6px;
    animation: lds-ellipsis1 0.6s infinite;
}
.lds-ellipsis-wh div:nth-child(2) {
    left: 6px;
    animation: lds-ellipsis2 0.6s infinite;
}
.lds-ellipsis-wh div:nth-child(3) {
    left: 26px;
    animation: lds-ellipsis2 0.6s infinite;
}
.lds-ellipsis-wh div:nth-child(4) {
    left: 45px;
    animation: lds-ellipsis3 0.6s infinite;
}

.lds-ellipsis-color {
    display: inline-block;
    position: relative;
    width: 65px;
}
.lds-ellipsis-color div {
    position: absolute;
    top: 40px;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background: #ffe0d6;
    animation-timing-function: cubic-bezier(0, 1, 1, 0);
}

.lds-ellipsis-color div:nth-child(1) {
    left: 6px;
    animation: lds-ellipsis1 0.6s infinite;
}
.lds-ellipsis-color div:nth-child(2) {
    left: 6px;
    animation: lds-ellipsis2 0.6s infinite;
}
.lds-ellipsis-color div:nth-child(3) {
    left: 26px;
    animation: lds-ellipsis2 0.6s infinite;
}
.lds-ellipsis-color div:nth-child(4) {
    left: 45px;
    animation: lds-ellipsis3 0.6s infinite;
}

.loader-pagination .lds-ellipsis-color div,
.bottom-menu-modal .lds-ellipsis-color div,
.bottom-menu-modal-post .lds-ellipsis-color div {
    top: 0;
}

.lds-ellipsis-btn {
    display: inline-block;
    position: relative;
    width: 65px;
    height: 13px;
}
.lds-ellipsis-btn div {
    position: absolute;
    top: 0px;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background: white;
    animation-timing-function: cubic-bezier(0, 1, 1, 0);
}

.lds-ellipsis-btn div:nth-child(1) {
    left: 6px;
    animation: lds-ellipsis1 0.6s infinite;
}
.lds-ellipsis-btn div:nth-child(2) {
    left: 6px;
    animation: lds-ellipsis2 0.6s infinite;
}
.lds-ellipsis-btn div:nth-child(3) {
    left: 26px;
    animation: lds-ellipsis2 0.6s infinite;
}
.lds-ellipsis-btn 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);
    }
}

.bg-ellipsis {
    text-align: center;
}

.bg-ellipsis .lds-ellipsis-color div {
    /*top: 245px;*/
}

/* panels */

.pnl {
    background-color: white;
    margin-bottom: 7px;
    padding: 20px 15px 15px 15px;
}

.padding-left {
    background-color: white;
    margin-bottom: 7px;
    padding: 15px;
}

/* buttons */

.tbl-ing-btn {
    padding: 20px 0 5px 0;
}

.btn-md {
    display: inline-block;
    margin: auto;
    padding: 10px 15px;
    border: 1px solid #8d7399;
    color: #896b97;
    border-radius: 20px;
    font-weight: 500;
    cursor: pointer;
    background-color: white;
}

.btn-md i {
    color: #896b97;
    float: right;
    margin-left: 5px;
    margin-top: 2px;
}

.btn-md-inactive {
    color: #aaa7a7;
    border: 1px solid #cbc9c9;
    background-color: #ffffff;
}

.btn-md-inactive i {
    color: #aaa7a7;
}

.btn-md-gray {
    border: 1px solid #dcdcdc;
    color: #b9b9b9;
    margin-bottom: 8px;
}

.btn-md-wide {
    padding: 10px 25px;
}

.btn-md-gray i {
    color: #b9b9b9;
    font-size: 14px;
}

.btn-md-green {
    color: green;
    border: 1px solid green;
}

.btn-md-green i {
    color: green;
}

.btn-md-block {
    display: block;
}

.btn-sm {
    display: inline-block;
    padding: 6px 10px;
    border: 1px solid #8d7399;
    color: #896b97;
    border-radius: 20px;
    font-weight: 500;
    cursor: pointer;
    background-color: white;
    font-size: 14px;
}

.btn-sm i {
    color: #896b97;
    font-size: 12px;   
}

.btn-sm:hover {
    background-color: #f9f4fe;
}

.back-btn {
    width: 40px;
    height: 40px;
    background-color: #fff0ec;
    border-radius: 50%;
    text-align: center;
    position: absolute;
    top: 15px;
    left: 15px;
    z-index: 10;
}

.back-btn i {
    font-size: 20px;
    color: #ffa3a3;
    margin-top: 11px;
}

.top-menu-container {
    height: 55px;
    width: 100%;
    position: relative;
    background-color: #f8f8f8;
    display: flex;
    padding-top: 15px;
}

.top-menu-container .back-btn-menu {
    width: 40px;
    height: 40px;
    background-color: #ffffff;
    border-radius: 50%;
    text-align: center;
    z-index: 10;
    margin-left: 15px;
}

.top-menu-container .back-btn-menu i {
    font-size: 20px;
    color: #ffa3a3;
    margin-top: 11px;
}

.top-menu-container .title {
    font-size: 21px;
    color: #ff9e9e;
    font-weight: 500;
    letter-spacing: -0.5px;
    margin-top: 8px;
    margin-left: 15px;
}

/* font-awesome */

.fa-youtube {
    color: #F84949;
}

/* input */

.input {
    margin-bottom: 12px;
}

.input > .container {
    position: relative;
    border: 1px solid #9c9c9c;
    border-radius: 5px;
    padding-right: 10px;
}

.input .container .title {
    display: block;
    position: absolute;
    top: 2px;
    left: 10px;
}

.input .container .title .field {
    font-weight: 500 !important;
    font-size: 14px;
    color: #8d8d8d !important;
    text-transform: none !important;
}

.input .container-disabled .title .field {
    color: #454545;
}

.input .container .title .field-error {
    color: red !important;
}

.input .container .title .field-error i {
    color: red !important;
}

.input .container-error {
    border: 1px solid red !important;
    background-color: #fff7f7;
}

.input .container .title .error {
    font-size: 12px;
    color: red !important;
    display: inline-block;
    margin-left: 3px;
    font-weight: 500 !important;
}

.input .container input {
    height: 33px;
    background-color: transparent;
    border: none;
    width: 100%;
    padding-left: 10px;
    padding-top: 20px;
    border-radius: 5px;
}

.input .container input::placeholder {
    color: #c1c1c1;
}

.input .container select {
    height: 53px;
    background-color: transparent;
    width: 100%;
    padding-left: 5px;
    padding-top: 18px;
    border-radius: 5px;
    border: none;
}

#user_name img {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    position: absolute;
    top: 26px;
    left: 10px;
}

#user_name input {
    padding-left: 35px;
}

.input .container .input-error {
    color: red;
}

.input .container-disabled {
    background-color: #e8e8e8;
}

.input .container textarea {
    background-color: transparent;
    border: none;
    width: 100%;
    padding-left: 10px;
    padding-top: 26px;
    padding-bottom: 3px;
    border: 0;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
}

.input .container .count {
    font-size: 12px;
    font-weight: 900;
    position: absolute;
    right: 10px;
    top: 12px;
}

.container-input {
    padding: 15px;
}

.container-input > .title {
    border-bottom: 1px solid #c5c5c5;
    padding-bottom: 12px;
}

.container-input > .title span {
    font-size: 18px;
    font-weight: 900;
    color: #939393;
}

.container-input > .title span i {
    font-size: 14px;
    color: #939393;
}

.input-col {
    display: flex;
}

.input-col .input:nth-child(2n+1) {
    padding-right: 8px;
    width: 50%;
}

.input-col .input:nth-child(2n+2) {
    padding-left: 8px;
    width: 50%;
}

.address-inputs .checkbox {
    display: flex;
    align-items: center;
}

.address-inputs .checkbox .checkbox-col .selection {
    width: 22px;
    height: 22px;
    border: 2px solid #898B90;
    border-radius: 6px;
    margin: auto;
    cursor: pointer;
}

.address-inputs .checkbox .info-col {
    padding-left: 10px;
}

.address-inputs .checkbox .info-col span {
    display: block;
    cursor: pointer;
}

.address-inputs .checkbox .checkbox-col .active {
    background-color: white;
    border: 2px solid #FF9F9F;
}

.address-inputs .checkbox .checkbox-col .active .active-inner {
    width: 12px;
    height: 12px;
    border-radius: 2px;
    margin: 5px;
    background-color: #FF9F9F;
}

.send-btn .error,
#complete-review .error {
    height: 20px;
    padding-top: 5px;
    font-size: 14px;
    color: red;
    text-align: center;
}

.send-btn .error span,
#complete-review .error span {
    font-size: 14px;
    color: red;
    display: block;
    margin-top: 3px;
    text-align: center;
}

.send-btn .error-height {
    height: auto;
    margin-bottom: 5px;
}

.send-btn .error a {
    display: block;
    margin-top: 5px;
    margin-bottom: 15px;
    color: #0d007f;
}

.next-btn-error {
    display: block;
    font-size: 14px;
    color: red;
    margin-top: 5px;
    height: 14px;
    margin-bottom: 5px;
}

.next-btn-error a {
    font-size: 14px;
    color: #6277AE;
}

.send-btn {

}

.send-btn .send {
    background: linear-gradient(111deg, #2d1974 0%, #cd8aed 100%);
    color: white;
    border-radius: 10px;
    display: block;
    text-align: center;
    padding: 12px 0;
    font-weight: 900;
    border: none;
    width: 100%;
    cursor: pointer;
}

.send-btn .sending,
.bottom-menu-modal .sending,
#complete-review .sending {
    color: white;
    background-color: #c7c7c7;
    border-radius: 10px;
    display: none;
    text-align: center;
    padding: 12px 0;
    font-weight: 900;
    height: 20px;
}

.content-wrapper .wide-btn {
    font-weight: 500;
    color: #ff9f9f;
    background-color: white;
    border: 1px solid #ff9f9f;
    cursor: pointer;
}

.content-wrapper .wide-btn-transparent {
    background-color: transparent;
    color: white;
    border-color: white;
}

.wide-btn {
    border-radius: 10px;
    display: block;
    text-align: center;
    padding: 13px 0;
    font-weight: 500;
    background-color: white;
    width: 100%;
    cursor: pointer;
}

.content-wrapper-2-col > .container {
    display: table;
    width: 100%;
}

.content-wrapper-2-col .wide-btn-2-col {
    float: left;
    width: 50%;
}

.content-wrapper-2-col .wide-btn-2-col:nth-child(2n+1) .container {
    padding-right: 8px;
}

.content-wrapper-2-col .wide-btn-2-col:nth-child(2n+2) .container {
    padding-left: 7px;
}

.content-wrapper-2-col .wide-btn-2-col .wide-btn-2 {
    font-weight: 500;
    color: #ff9f9f;
    background-color: white;
    border: 1px solid #ff9f9f;
    border-radius: 10px;
    display: block;
    text-align: center;
    padding: 13px 0;
    font-weight: 500;
    background-color: white;
    width: 100%;
}

.wide-btn-white {
    color: #ffffff;
    border-radius: 10px;
    display: block;
    text-align: center;
    padding: 13px 0;
    font-weight: 500;
    border: 1px solid #ffffff;
    background: linear-gradient(111deg, #2d1974 0%, #cd8aed 100%);
    width: 100%;
    cursor: pointer;
}

.signed-out-participate,
.signed-out-suggest,
.signed-in-unconfirmed-participate,
.signed-in-participate,
.signed-in-suggest {
    background: linear-gradient(111deg, #2d1974 0%, #cd8aed 100%);
}

.content-wrapper .wide-btn-solid {
    color: white;
    background-color: #ff9f9f;
}

.content-wrapper .wide-btn-blue,
.content-wrapper-2-col .wide-btn-2-col .wide-btn-blue {
    color: white;
    background: linear-gradient(111deg, #2d1974 0%, #cd8aed 100%);
    border: none;
    font-weight: 900;
}

.wide-btn-white i {
    color: white;
}

.wide-btn-green {
    background-color: #4CAF50;
}

.wide-btn-red {
    background-color: #F44336;
}

.wide-btn-yellow {
    background-color: #ffc107;
}

.welcome-panel-container .wide-btn-purple {
    color: white;
    background: linear-gradient(111deg, #2d1974 0%, #cd8aed 100%);
    border: none;
    font-weight: 900;
    margin-bottom: 15px;
}

.close-wide-btn {
    color: #939393;
    background-color: #f0f0f0;
}

.show-user-milestones {
    cursor: pointer;
}

/* products */


.p-list-sm .p {
    /*height: 60px;*/
    display: block;
    padding: 10px 0;
}

.p-list-sm .p-b {
    height: 40px;
}

.p-list-sm .p img {
    width: 60px;
    border-radius: 10px;
    float: left;
}

.p-list-sm .p .info {
    padding-left: 70px;
}

.p-list-sm .p .info .brand {
    font-family: "Space Mono", sans-serif;
    text-transform: uppercase;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden
}

.p-list-sm .p .info .name {
    font-weight: 200;
    display: block;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    margin-bottom: 3px;
}

.p-list-sm .p .info .name > mark {
    font-weight: 200;
    background-color: #ffe9e2;
}

.p-list-sm .p .info .product-version {
    background-color: #f1f1f1;
    padding: 2px 10px 3px 10px;
    border-radius: 15px;
    color: #7b7b7b;
    font-size: 13px;
    display: table-cell;
}

.p-list-sm .p .info .category {
    font-size: 12px;
    display: block;
    color: #aaaaaa;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.p-list-sm .p .info .version-container {
    margin-top: 5px;
}

.p-list-sm .p .info .version-container .version {
    margin-right: 5px;
    display: inline-block;
}

.p-list-sm .p .info .version-container .version .bg {
    background-color: #ffffff;
    border: 1px solid #8d8d8d;
    padding: 1px 11px;
    border-radius: 10px;
}

.p-list-sm .p .info .version-container .version .bg .txt {
    color: #8d8d8d;
    font-size: 13px;
    margin: 3px 0 2px 0;
    display: block;
}

.p-list-sm .p .info .version-container .version .version-img {
    display: inline-block;
}

.p-list-sm .p .info .version-container .version .version-img .bg {
    background-color: #ffffff;
    border: 1px solid #a6a6a6;
    padding: 5px 8px 5px 5px;
    border-radius: 10px;
    display: table;
}

.p-list-sm .p .info .version-container .version .version-img .bg .img {
    width: 20px;
    height: 20px;
    float: left;
    border-radius: 5px;
    border: 1px solid #ffffff8f;
}

.p-list-sm .p .info .version-container .version .version-img .bg .text {
    color: #8d8d8d;
    font-size: 13px;
    margin: 4px 0 2px 5px;
    float: left;
}



.b-list .b, .b-list .s {
    padding-top: 10px;
    padding-bottom: 10px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.b-list .b img, .b-list .s img {
    width: 50px;
    height: 50px;
    background-color: #ffefec;
    border-radius: 50%;
    margin-right: 10px;
    margin-left: 10px;
    border: 1px solid lightgrey;
    float: left;
}

.b-list .b span, .b-list .s span {
    font-family: "Space Mono", monospace;
    font-size: 18px;
    color: #313131;
    -webkit-font-smoothing: antialiased;
    text-align: left;
    text-transform: uppercase;
    line-height: 50px;
}

.b-list .b span > mark, .b-list .s span > mark {
    font-family: "Space Mono", monospace;
    font-size: 18px;
    color: #313131;
    background-color: #ffe9e2;
}

/* title box */

.title-panel {
    background-color: white;
    padding-top: 15px;
}

.title-panel > .title-box {
    margin-bottom: 10px;
    padding: 0 15px;
}

.title-panel > .title-box-margin {
    margin-bottom: 0;
    padding: 0 15px;
}

.title-panel > .title-box > .title {
    font-size: 36px;
    font-weight: 900;
    display: block;
    line-height: 34px;
    margin-bottom: 3px;
}

.title-panel > .title-box > .subtitle {
    font-size: 14px;
    display: block;
    line-height: 16px;
    color: #A3A3A3;
}

.title-panel > .title-box > .subtitle a {
    color: #8d7398;
    font-size: 13px;
}

.verified-account-banner {
    width: 100%;
    background-color: #4CAF50;
    text-align: center;
}

.verified-account-banner .container {
    padding: 15px;
}

.verified-account-banner span {
    color: white;
    font-weight: 900;
}


/* feed */

.top-white {

}

#loading-container, 
.loading-container, 
#loading-container-wrapper {
    min-height: 640px;
}

.feed {
    text-align: left;
    position: relative;
}

.feed-preview {
    padding-bottom: 80px;
}

.feed-comment {
    padding-bottom: 100px;
}

.feed .panel {
    background-color: white;
    height: 500px;
}

.post-header-hr {
    margin: 0 15px 10px 15px;
    border-bottom: 1px solid #d7d7d7;
}

.posts-feed {
    background-color: #f0eef3;
}

.post, .post-promo-exclusive {
    background-color: white;
    margin-bottom: 7px;
    z-index: 1;
    position: relative;
}

.post-ad {
    background-color: white;
    margin-bottom: 7px;
}

.post-pinned {
    background-color: white;
}

.post .header, .post-promo-exclusive .header {
    padding: 12px 15px 5px 12px;
    position: relative;
    height: 41px;
}

.post > .product {
    height: 46px;
}

.post .header .user .profile, .post .header .brand .profile,
.post .header .store .profile, .post .header .community .profile,
.post-promo-exclusive .header .brand .profile,
.post-promo-exclusive .header .store .profile {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    border: 1px solid #e1e1e1;
    margin-top: 3px;
    float: left;
    object-fit: cover;
}

.post .user-header .user {
    display: inline-block;
}

.post .user-header .user .user-profile-container {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    border: 1px solid #e1e1e1;
    float: left;
    overflow: hidden;
    margin-top: 3px;
    object-fit: cover;
}

.post .user-header .user .user-profile-container .user-profile {
    width: 100%;
}

.post .user-header .user .user-profile-container .badge {

}

.post .user-header .user .user-profile-container .badge {
    position: absolute;
    left: 30px;
    top: 35px;
    background-color: #676767;
    border-radius: 50%;
    width: 15px;
    height: 15px;
    border: 2px solid white;
    text-align: center;
    display: flex;
}

.post .user-header .user .user-profile-container .brand {
    background-color: #676767;
}

.post .user-header .user .user-profile-container .badge .fa-check {
    color: white;
    font-size: 9px;
    margin-top: 3px;
    margin-left: 3px;
}

.post .user-header .user .user-profile-container .admin {
    background-color: #ff9e9e;
}

.post .user-header .user .user-profile-container .badge .fa-star {    
    color: white;
    font-size: 8px;
    margin-top: 3px;
    margin-left: 3px;
}

.post .user-header .user .user-profile-container .ambassador {
    background-color: #ff9800;
}

.post .user-header .user .user-profile-container .badge .fa-crown {
    color: white;
    font-size: 7px;
    margin-top: 4px;
    margin-left: 3px;
}

.post .user-header .user .user-profile-container .employee {
    background-color: #676767;
}

.post .user-header .user .info {
    float: left;
}

.post .user-header .user .info .top .time {
    font-size: 13px;
    color: #ADADAD;
    display: inline-block;
}

.post .user-header .user .info .bottom,
.post .user-header .user .info .bottom .user-skin-type,
.post .user-header .user .info .bottom .user-dob,
.post .header .community .info .user-owner .user-skin-type,
.post .header .community .info .user-owner .user-dob {
    color: #ADADAD;
    font-size: 13px;
    margin-left: 5px;
}

.post .user-header .user .info .bottom .user-skin-type {
    margin-left: 0;
}

.post .user-header .user .info .bottom {
    margin-left: 0;
}


.post .user-header .user .info .bottom .current-user-skin-type,
.post .header .community .info .user-owner .current-user-skin-type {
    color: #d3a7a7;
    font-size: 13px;
    margin: 0 5px;
}

.post .header .community .info .user-owner .user-skin-type {
    margin: 0 5px;
}

.post .header .community .info .user-owner {
    cursor: pointer;
}

.post .header .community .info .user-deleted {
    cursor: initial;
}

.post .header .community .info .user-owner i {
    font-size: 9px;
    color: #ADADAD;
    margin: 5px 0 0 3px;
}

.post .user-header .user .info .bottom .user-skin-type-circle {
    float: left;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    margin-left: 4px;
    margin-top: 4px;
}

.post .user-header .user .info .bottom .user-skin-type-normal {
    background-color: #00BCD4;
}

.post .user-header .user .info .bottom .user-skin-type-grasa {
    background-color: #ff9800;
}

.post .user-header .user .info .bottom .user-skin-type-mixta {
    background-color: #9c27b0;
}

.post .user-header .user .info .bottom .user-skin-type-seca {
    background-color: #cddc39;
}

.post .header .community .profile-follow {
    border-radius: 50%;
    height: 15px;
    width: 15px;
    background-color: #FF5072;
    text-align: center;
    position: absolute;
    left: 33px;
    top: 33px;
}

.post .header .community .profile-follow i {
    color: white;
    font-size: 9px;
    display: block;
    margin-top: 3px;
}

.post .header .user .info,
.post .header .brand .info,
.post .header .store .info,
.post .header .community .info,
.post-promo-exclusive .header .brand .info,
.post-promo-exclusive .header .store .info {
    margin-top: 1px;
    float: left;
    margin-left: 7px;
}

.post .header .user .info .top,
.post .header .brand .info .top,
.post .header .store .info .top,
.post .header .community .info .top,
.post-promo-exclusive .header .brand .info .top,
.post-promo-exclusive .header .store .info .top {
    height: 16px;
}

.post .user-header .user .info .top {
    height: 18px;
}

.post .header .product .info .top {
    height: 31px;
}

.post .header .community .info .top .name {
    font-weight: 900;
    font-size: 15px;
}

.post .header .community .info .user {
    display: flex;
    margin-top: 2px;
}

.post .header .product .info .user {
    display: flex;
    margin-top: 4px;
}

.post .header .user .info .top .user-name  {
    font-size: 13px;
    display: inline-block;
    font-weight: 900;
    color: #988b9e;
}

.post .header .community .info .top .brand-name {
    display: block;
    margin-top: -7px;
}

.post .header .community .info .top .brand-name a {
    font-weight: 900;
    font-family: "Space Mono", monospace;
    font-size: 14px;
}

.post .header .community .info .top .product-name {
    display: block;
    margin-top: -5px;
}

.post .header .community .info .top .product-name a {
    font-size: 14px;
    color: #6a6a6a;
}

.post .header .community .info .top .brand-community-name,
.post .header .community .info .top .store-community-name {
    font-family: "Space Mono", monospace;
    text-transform: uppercase;
}

.post .header .community .info .top .promo-post {
    height: 18px;
}

.post .header .community .info .top .promo-post span {
    text-transform: uppercase;
    color: #332FAC;
    font-weight: 900;
    font-size: 14px;
    float: left;
    margin-right: 5px;
}

.post .header .community .info .top .promo-post .exclusive {
    color: #ffc107;
}

.post .header .community .info .top .promo-post .standard {
    color: #54398a;
}

.post .header .community .info .top .promo-post .fa-star {
    font-size: 11px;
    color: #ffc107;
    float: left;
    margin-top: 2px;
}

.post .header .community .info .top .promo-post .fa-tags {
    font-size: 10px;
    color: #54398a;
    float: left;
    margin-top: 3px;
}

.post .header .brand .info .top .user-name,
.post .header .store .info .top .user-name,
.post-promo-exclusive .header .brand .info .top .user-name,
.post-promo-exclusive .header .store .info .top .user-name {
    font-weight: 900;
    font-size: 14px;
    font-family: "Space Mono", monospace;
    text-transform: uppercase;
}

.post .header .brand .info .top .user-name i,
.post .header .store .info .top .user-name i,
.post-promo-exclusive .header .brand .info .top .user-name i,
.post-promo-exclusive .header .store .info .top .user-name i {
    font-size: 10px;
    margin-left: -4px;
    margin-top: 3px;
    color: white;
}

.post .header-promo .brand .info .top .user-name,
.post .header-promo .store .info .top .user-name,
.post-promo-exclusive .header-promo .brand .info .top .user-name,
.post-promo-exclusive .header-promo .store .info .top .user-name {
    background-color: initial;
    border-radius: 0;
    padding: 0;
    color: #454545;
    margin-left: 0;
    font-size: 14px;
}

.post .header .user .info .time,
.post .header .brand .info .time,
.post .header .store .info .time,
.post .header .community .info .time,
.post .header .community .info .user-owner,
.post-promo-exclusive .header .brand .info .time,
.post-promo-exclusive .header .store .info .time {
    font-size: 13px;
    color: #ADADAD;
}

.post .header .community .info .user-owner {
    margin-right: 5px;
    display: flex;
}

.post .header .community .info .user-owner .user-name-container {
    display: flex;
    margin-right: 4px;
}

.post .header .community .info .user-owner .user-name-container .user-name {
    color: #ADADAD;
    font-size: 13px;
}

.post .header .community .info .user-owner .user-name-container i {
    font-size: 9px;
    color: #ADADAD;
    margin: 5px 0 0 3px;
}

.post .header .community .info .user-promo {
    margin-top: -3px;
    display: block;
    float: left;
}

.post .header .community .info .user-owner-promoted {
    font-size: 13px;
    color: gray;
    display: inline-block;
}



.post .header .community .info .brand-user,
.post .header .community .info .store-user {
    font-family: "Space Mono", monospace;
    text-transform: uppercase;
}

.post .header .community .info .brand-user i,
.post .header .community .info .store-user i {
    font-size: 12px;
    color: gray;
}

.post .header .action {
    position: absolute;
    top: 7px;
    right: 10px;
}

.post .header .action .post-menu-btn {
    color: #d3cdd5;
    width: 35px;
    height: 40px;
    text-align: center;
    float: left;
    cursor: pointer;
}

.post .header .action .post-menu-btn i {
    color: #d3cdd5;
    margin-top: 12px;
}

.post .header .action .post-bookmark-btn {
    color: #d3cdd5;
    width: 35px;
    height: 40px;
    text-align: center;
    margin-right: 0 !important;
    float: left;
    cursor: pointer;
}

.post .header .action .post-bookmark-btn .fa-bookmark-inactive {
    color: #d3cdd5;
    margin-top: 12px;
    font-size: 17px;
}

.post .header .action .post-bookmark-btn .fa-bookmark-active {
    color: #ff9f9f;
    font-size: 17px;
    margin-top: 12px;
}

.post .header .action .post-pin-btn {
    color: #d3cdd5;
    width: 35px;
    height: 40px;
    text-align: center;
    margin-right: 0 !important;
    float: left;
}

.post .header .action .post-pin-btn .fa-thumbtack-inactive {
    color: #d3cdd5;
    margin-top: 13px;
    font-size: 17px;
}

.post .header .action .post-pin-btn .fa-thumbtack-active {
    color: #fe5072;
    font-size: 17px;
    margin-top: 13px;
}


.post .body .card {
    padding: 25px 0 15px 0;
}

.post-show, .post-home-show, .post-promote, .post-promo {
    height: 100%;
    width: 100%;
    position: fixed;
    bottom: 0;
    top: 0;
    overflow-y: scroll;
    overflow-x: hidden;
    z-index: 99;
    display: none;
    animation-duration: 600ms;
}

.show-article-comments {
    background-color: #f0eef3;
}

.post-show > .container, .post-promote > .container, .post-promo > .container {
    margin: auto;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 0;
    background-color: #f0eef3;
}

.post-show .feed-show, .post-promote .feed-show, .post-promo .feed-show {
    background-color: #f0eef3;
}

/* ads */

.promoted-campaign-feed {
    text-align: left;
    position: relative;
    margin-top: 7px;
    min-height: 1000px;
}

.promoted-campaign-row, .promo-index-row {
    background-color: white;
    margin-bottom: 7px;
    display: table;
    width: 100%;
    min-height: 110px;
}

.promoted-campaign-row .container, .promo-index-row  .container {
    padding: 15px;
}

.promoted-campaign-row .image-col, .promo-index-row .image-col {
    width: 80px;
    height: 80px;
    float: left;
}

.promoted-campaign-row .image-col .image-container, .promo-index-row .image-col .image-container {
    overflow: hidden;
    border-radius: 10px;
    border: 1px solid #e8e8e8;
    background-color: #fcf2ee;
}

.promoted-campaign-row .image-col .image-container img, .promo-index-row .image-col .image-container img {
    width: 100%;
}

.promoted-campaign-row .image-col .image-placeholder, .promo-index-row .image-col .image-placeholder {
    width: 80px;
    height: 80px;
    background-color: #fcf2ee;
    border-radius: 10px;
    text-align: center;
    border: 1px solid #e8e8e8;
}

.promoted-campaign-row .image-col .image-placeholder i, .promo-index-row .image-col .image-placeholder i {
    color: #ecdfdf;
    font-size: 36px;
    margin-top: 22px;
}

.promoted-campaign-row .info-col, .promo-index-row .info-col {
    padding-left: 90px;
}

.promoted-campaign-row .info-col .title, .promo-index-row .info-col .title {
    font-weight: 900;
    display: block;
    line-height: 14px;
    margin-bottom: 8px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}

.promoted-campaign-row .info-col .post-type, .promo-index-row .info-col .post-type {
    display: block;
    font-size: 12px;
    margin-bottom: 5px;
    color: gray;
}

.promoted-campaign-row .info-col .post-type i, .promo-index-row .info-col .post-type i {
    font-size: 11px;
    color: #aaaaaa;
}

.promoted-campaign-row .info-col .results, .promo-index-row .info-col .results {
    font-size: 14px;
    color: gray;
    display: block;
    margin-bottom: 5px;
}

.promoted-campaign-row .info-col .objective, .promo-index-row .info-col .objective {
    font-size: 12px;
    color: gray;
    display: block;
    margin-bottom: 3px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}

.promoted-campaign-row .info-col .audience, .promo-index-row .info-col .audience {
    font-size: 12px;
    color: gray;
    display: block;
    margin-bottom: 5px;
    background-color: #ff9e9e;
    display: inline-block;
    color: white;
    font-weight: 900;
    padding: 2px 7px;
    border-radius: 10px;
}

.post-audience {
    padding: 10px 15px 10px 15px;
    background-color: #fff3ef;
    margin-bottom: 7px;
}

.post-audience .title {
    font-size: 14px;
    display: block;
    margin-bottom: 5px;
    color: #c4b5b2;
    font-weight: 900;
}

.post-audience > .audience {
    font-size: 13px;
    color: gray;
    display: block;
    margin-bottom: 5px;
    background-color: #c3b5b2;
    display: inline-block;
    color: white;
    font-weight: 900;
    padding: 2px 7px;
    border-radius: 10px;
}

.promoted-campaign-row .info-col .status, .promo-index-row .info-col .status {
    display: table;
}

.promoted-campaign-row .info-col .status .circle, .promo-index-row .info-col .status .circle {
    float: left;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    margin: 3px 4px 0 0;
}

.promoted-campaign-row .info-col .status .active, .promo-index-row .info-col .status .active {
    background-color: green;
}

.promoted-campaign-row .info-col .status .pending, .promo-index-row .info-col .status .pending {
    background-color: #FFC107;
}

.promoted-campaign-row .info-col .status .paused, .promoted-campaign-row .info-col .status .finished, .promo-index-row .info-col .status .paused, .promo-index-row .info-col .status .finished {
    background-color: gray;
}

.promoted-campaign-row .info-col .status .text, .promo-index-row .info-col .status .text {
    font-size: 13px;
    padding: 0;
    float: left;
    margin-top: 1px;
    font-weight: 500;
}

.pnl-no-pad {
    background-color: white;
    margin-bottom: 7px;
    padding: 20px 0 15px 0;
    overflow: hidden;
}

.pnl-no-pad .section-title {
    margin: 0 15px 20px 15px;
}

.pnl-no-pad .section-title-no-subtitle {
    margin-bottom: 10px;
}

.pnl-no-pad .complete-account-bar {
    margin: 20px 15px 20px 15px;
}

.container-input .pnl-no-pad .section-title {
    margin: 0 0 20px 0;
}

.pnl-no-pad .collection-want  {

}

.pnl-no-pad .collection-want .icon-box i,
.pnl-no-pad .collection-want .title,
.pnl-no-pad .collection-want .subtitle {
    color: #f44336;
}

.pnl-no-pad .collection-have .icon-box i,
.pnl-no-pad .collection-have .title,
.pnl-no-pad .collection-have .subtitle {
    color: #2ab529;
}


.container-input .pnl-border-bottom {
    border-bottom: 1px solid #c5c5c5;
    padding-bottom: 10px;
    margin-bottom: 0;
}

.content-wrapper {
    padding: 0 15px;
}

.content-wrapper .post .body .card {
    padding: 0;
}

.community-row-notifications {
    display: initial !important;
    position: initial !important;
}

/* complete account */

.complete-account-bar {
    position: relative;
}

.complete-account-bar .check {
    position: absolute;
    background-color: white;
    border: 2px solid #999adc;
    height: 20px;
    width: 20px;
    border-radius: 50%;
    right: -14px;
    top: -6px;
    text-align: center;
    z-index: 1;
}

.complete-account-bar .check i {
    color: #999adc;
    font-size: 12px;
    margin-top: 4px;
}

.complete-account-bar .star {
    position: absolute;
    background-color: white;
    border: 2px solid #bcbcbc;
    height: 20px;
    width: 20px;
    border-radius: 50%;
    right: 0;
    top: -6px;
    text-align: center;
    z-index: 1;
}

.complete-account-bar .star-green {
    position: absolute;
    background-color: white;
    border: 2px solid #bebebe;
    height: 20px;
    width: 20px;
    border-radius: 50%;
    right: 0;
    top: -6px;
    text-align: center;
    z-index: 1;
}

.complete-account-bar .star-green i {
    color: #999adc;
    font-size: 12px;
    position: absolute;
    left: 0;
    right: 0;
    top: 4px;
}

.complete-account-bar .star i {
    color: #b6b6b6;
    font-size: 12px;
    position: absolute;
    left: 0;
    right: 0;
    top: 4px;
}

.complete-account-bar .bar {
    height: 12px;
    width: 100%;
    background-color: white;
    border-radius: 10px;
}

.complete-account-bar .bar .segment {
    width: 5.88%;
    float: left;
    position: relative;
    height: 12px;
}

.complete-account-bar .bar .segment .pad-start {
    /*padding-right: 1.5px;*/
}

.complete-account-bar .bar .segment .pad-start .fill {
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
}

.complete-account-bar .bar .segment .pad-end {
    /*padding-left: 1.5px;*/
}

.complete-account-bar .bar .segment .pad-end .fill {
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
}

.complete-account-bar .bar .segment .pad {
    /*padding: 0 1.5px; */
}

.complete-account-bar .bar .segment .fill {
    height: 12px;
    width: 100%;
    background-color: #FFE7E0;
}

.c-1 { background: linear-gradient(90deg, #BEF0D1 0%, #BCEBD1 100%) !important; }
.c-2 { background: linear-gradient(90deg, #BCEBD1 0%, #B9E5D2 100%) !important; }
.c-3 { background: linear-gradient(90deg, #B9E5D2 0%, #B7E0D3 100%) !important; }
.c-4 { background: linear-gradient(90deg, #B7E0D3 0%, #B5DBD4 100%) !important; }
.c-5 { background: linear-gradient(90deg, #B5DBD4 0%, #B2D5D4 100%) !important; }
.c-6 { background: linear-gradient(90deg, #B2D5D4 0%, #B0D0D5 100%) !important; }
.c-7 { background: linear-gradient(90deg, #B0D0D5 0%, #AECAD5 100%) !important; }
.c-8 { background: linear-gradient(90deg, #AECAD5 0%, #ABC5D6 100%) !important; }
.c-9 { background: linear-gradient(90deg, #ABC5D6 0%, #A9C0D7 100%) !important; }
.c-10 { background: linear-gradient(90deg, #A9C0D7 0%, #A7BAD7 100%) !important; }
.c-11 { background: linear-gradient(90deg, #A7BAD7 0%, #A4B5D8 100%) !important; }
.c-12 { background: linear-gradient(90deg, #A4B5D8 0%, #A3B0D9 100%) !important; }
.c-13 { background: linear-gradient(90deg, #A3B0D9 0%, #A0AAD9 100%) !important; }
.c-14 { background: linear-gradient(90deg, #A0AAD9 0%, #9EA6DA 100%) !important; }
.c-15 { background: linear-gradient(90deg, #9EA6DA 0%, #9B9FDA 100%) !important; }
.c-16 { background: linear-gradient(90deg, #9B9FDA 0%, #999ADB 100%) !important; }
.c-17 { background: linear-gradient(90deg, #999ADB 0%, #9795DB 100%) !important; }

.complete-account-carousel {
    padding-left: 15px;
    height: 340px;
    margin-bottom: 25px;
    overflow: auto;
    white-space: nowrap;
    -webkit-overflow-scrolling: touch;
    overflow-y: hidden;
    overflow-x: scroll;
}

.complete-account-carousel-signed-out {
    height: 290px;
}

.complete-account-carousel .action {
    width: 200px;
    display: inline-block;
    margin-right: 8px;
    position: relative;
}

.complete-account-carousel .action .image {
    width: 200px;
    height: 200px;
    background-color: #FFE7E0;
    border-radius: 15px;
    margin-bottom: 10px;
    position: relative;
}

.complete-account-carousel .action .image img {
    width: 100%;
}

.complete-account-carousel .action .info {
    white-space: initial;
    padding-right: 15px;
    width: 200px;
}

.complete-account-carousel .action .info .title {
    font-weight: 900;
    font-size: 18px;
    line-height: 20px;
    display: block;
    margin-bottom: 6px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.complete-account-carousel .action .info .subtitle {
    font-size: 14px;
    line-height: 16px;
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    margin-bottom: 10px;
    color: gray;
}

.complete-account-carousel .completed .info .title {
    color: #b8b8b8;
}

.complete-account-carousel .completed .info .btn-md {
    border: 1px solid #c5c5c5;
    color: #b8b8b8;
}

.complete-account-carousel .completed .completed-icon {
    position: absolute;
    width: 40px;
    height: 40px;
    background-color: #4CAF50;
    bottom: 15px;
    right: 15px;
    border-radius: 50%;
    text-align: center;
}

.complete-account-carousel .completed .completed-icon i {
    color: white;
    font-size: 24px;
    margin-top: 9px;
}

.complete-account-bar .bar .full-colored-segment {
    width: 100%;
    position: absolute;
    height: 12px;
    background: linear-gradient(90deg, #BEF0D1 0%, #9693DC 100%) !important;
    border-radius: 8px;
}

.complete-account-bar .bar .white-segment {
    width: 100%;
    position: absolute;
    height: 12px;
    background: white;
    right: 0;
    border-top-right-radius: 8px;
    border-bottom-right-radius: 8px;
    -webkit-transition: all 1.2s ease-out;
    -o-transition: all 1.2s ease-out;
    transition: all 1.2s ease-out;
}

.complete-account-bar .bar .star-green-hidden {
    display: none;
}

.user-milestones-panel .completed-banner {
    background: linear-gradient(90deg, #ff5171 0%, #ff8aa0 100%) !important;
    padding: 20px;
    border-radius: 15px;
    margin: 0 15px 15px 15px;
    display: none;
}

.user-milestones-panel .completed-banner .title {
    color: white;
    font-size: 22px;
    font-weight: 900;
    display: block;
    margin-bottom: 7px;
}

.user-milestones-panel .completed-banner .title i {
    color: white;
    font-size: 20px;
}

.user-milestones-panel .completed-banner .subtitle {
    color: white;
    font-size: 16px;
    display: block;
    margin-bottom: 12px;
}

.completed-milestones-gift {
    display: none;
}

.user-milestones-panel .images-carousel {
    display: flex;
    flex-wrap: nowrap;
    overflow: auto;
    padding: 0 15px;
    -webkit-overflow-scrolling: touch;
    overflow-y: hidden;
    height: 190px;
    margin: 15px 0 15px 0;
}

.user-milestones-panel .images-carousel .image {
    border-radius: 15px;
    overflow: hidden;
    width: 300px;
    height: 190px;
    flex: 0 0 auto;
    margin-right: 10px;
    position: relative;
    background-color: #d6ffe6;
}

.user-milestones-panel .images-carousel .image img {
    width: 100%;
    overflow: hidden;
    height: 190px;
    position: relative;
}

.user-milestones-panel .completed-milestones-gift > .info {
    padding: 0 15px 10px 15px;
}

.user-milestones-panel .completed-milestones-gift > .info .title {
    font-size: 22px;
    font-weight: 900;
    display: block;
    margin-bottom: 5px;
}

.user-milestones-panel .completed-milestones-gift > .info .subtitle {
    font-size: 14px;
    line-height: 18px;
    display: block;
    color: #808080;
    margin-bottom: 10px;
}

.user-milestones-panel .completed-milestones-gift > .info .btn-md {

}

.user-milestones-panel .completed-milestones-gift > .info .coupon-code {
    background: linear-gradient(90deg, #9edeb6 0%, #9693DC 100%) !important;
    font-size: 20px;
    font-weight: 900;
    border-radius: 5px;
    padding: 8px 15px;
    display: inline-block;
    color: white;
}

.user-milestones-panel .section-title .close-panel {
    position: absolute;
    top: -3px;
    right: -3px;
    width: 30px;
    height: 30px;
    text-align: center;
}

.user-milestones-panel .section-title .close-panel i {
    font-size: 18px;
    color: #d8d8d8;
    margin-top: 3px;
}

.biutienda-gradient-bg {
    background: #f2d7ff;
    background: linear-gradient(180deg, #e9c6f8 0%, rgba(255,255,255,1) 69%, rgba(255,255,255,1) 100%);
    padding-top: 0;
    position: relative;
}

.biutienda-header-bg {
    position: relative;
    overflow: hidden;
    width: 100%;
    height: 160px;
}

.biutienda-header-bg .bg-cropped {

}

.biutienda-header-bg .bg-cropped .bg-img {
    width: 100%;
}

.biutienda-header {
    text-align: center;
    width: 290px;
    margin: auto;
    margin-bottom: 25px;
    position: absolute;
    top: 105px;
    z-index: 1;
    left: 0;
    right: 0;
}

.biutienda-header .biutienda-logo-feed {
    width: 90px;
    display: block;
    margin: auto;
    margin-bottom: 15px;
}

.biutienda-header .biutienda-subtitle {
    font-size: 14px;
    display: block;
    color: #0C057F;
}

.biutienda-product-available {
    padding: 0 15px;
    margin-bottom: 18px;
    text-align: center;
}

.biutienda-product-available .product {
    margin-bottom: 10px;
    display: none;
}

.biutienda-product-available .active {
    display: block;
}

.biutienda-product-available .product .container {
    margin: auto;
    display: inline-block;
    text-align: left;
    margin-bottom: 10px;
}

.biutienda-product-available .product img {
    width: 45px;
    height: 45px;
    border-radius: 50%;
    float: left;
    border: 1px solid lightgray;
}

.biutienda-product-available .product .version-visible img {
    margin-top: 10px;
    width: 50px;
    height: 50px;
}

.biutienda-product-available .product .info {
    padding-left: 55px;
    padding-top: 2px;
}

.biutienda-product-available .product .version-visible .info {
    padding-left: 60px;
}

.biutienda-product-available .product .info .brand {
    font-family: "Space Mono", sans-serif;
    text-transform: uppercase;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    font-size: 16px;
}

.biutienda-product-available .product .info .name {
    font-weight: 200;
    display: block;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    margin-top: -4px;
    font-size: 18px;
}

.biutienda-product-available > .brand {
    height: 50px;
    margin-bottom: 12px;
}

.biutienda-product-available .product .info .versions-row {
    margin-top: 5px;
}

.biutienda-product-available .product .info .versions-row-text {

}

.biutienda-product-available .product .info .version-container {
    display: inline-block;
}

.biutienda-product-available .product .info .version-container .version {
    margin-right: 5px;
    display: inline-block;
}

.biutienda-product-available .product .info .version-container .version .bg {
    background-color: #fff1ec;
    border: 1px solid #ffd1d1;
    padding: 1px 11px;
    border-radius: 10px;
}

.biutienda-product-available .product .info .version-container .version .bg .txt {
    color: #FFA3A3;
    font-size: 13px;
    margin: 3px 0 2px 0;
    display: block;
}

.biutienda-product-available .brand .container {
    margin: auto;
    display: inline-block;
    text-align: left;
}

.biutienda-product-available .brand img {
    width: 45px;
    height: 45px;
    border-radius: 50%;
    float: left;
    border: 1px solid lightgray;
}

.biutienda-product-available .brand .info {
    padding-left: 55px;
    padding-top: 2px;
}

.biutienda-product-available .brand .info .brand {
    font-family: "Space Mono", sans-serif;
    text-transform: uppercase;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    font-size: 16px;
}

.biutienda-product-available .brand .info .name {
    font-weight: 400;
    display: block;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    margin-top: -2px;
    font-size: 15px;
}

.biutienda-banners-carousel {
    display: flex;
    flex-wrap: nowrap;
    overflow: auto;
    padding: 0 15px;
    -webkit-overflow-scrolling: touch;
    overflow-y: hidden;
    margin-bottom: 20px;
}

.title-panel .biutienda-banners-carousel {
    margin: 15px 0 5px 0;
}

.biutienda-banners-carousel .banner {
    width: 314px;
    height: 120px;
    float: left;
    text-align: center;
    flex: 0 0 auto;
    position: relative;
    padding-right: 10px;
}

.biutienda-banners-carousel .container {
    border-radius: 15px;
    overflow: hidden;
    height: 120px;
    background-color: #f0eef3;
}

.biutienda-banners-carousel .container img {
    width: 100%;
}

.biutienda-products-title-feed {
    margin: 0 0 15px 15px;
    display: block;
    font-size: 18px;
    font-weight: 500;
    color: #B49A92;
}

.biutienda-banner {
    background-color: #f8eeeb;
    height: 125px;
    margin-bottom: 15px;
    margin-top: -7px;
}

.biutienda-index-header {
    background: #f2d7ff;
    background: linear-gradient(180deg, #e9c6f8 0%, rgba(255,255,255,1) 69%, rgba(255,255,255,1) 100%);
    padding-top: 0;
    position: relative;
}

.biutienda-index-header .biutienda-header-bg {
    position: relative;
    overflow: hidden;
    width: 100%;
    height: 180px;
}

.biutienda-index-header .biutienda-header-bg .bg-cropped {

}

.biutienda-index-header .biutienda-header-bg .bg-cropped .bg-img {
    width: 100%;
}

.biutienda-index-header .biutienda-header {
    text-align: center;
    width: 290px;
    margin: auto;
    margin-bottom: 25px;
    position: absolute;
    top: 115px;
    z-index: 1;
    left: 0;
    right: 0;
}

.biutienda-index-header .biutienda-header .biutienda-subtitle {
    font-size: 14px;
    display: block;
    color: #0C057F;
}

/* card */

.card .image {
    width: 100%;
    border-top-right-radius: 15px;
    border-top-left-radius: 15px;
    margin-bottom: 0;
    margin-bottom: -4px;
    background-color: #e3e3e3;
    overflow: hidden;
    position: relative;
    border-left: 1px solid #e4e4e4;
    border-top: 1px solid #e4e4e4;
    border-right: 1px solid #e4e4e4;
}

.promo-exclusive .image {
    height: 180px;
}

.card .image-show, .campaign .image, .article .image {
    max-height: initial;
}

.card .image > img {
    width: 100%;
    margin-bottom: -4px;
    object-fit: cover;
}

.card .image .brands {
    position: absolute;
    top: 12px;
    right: 12px;
}

.card .image .brands > img {
    width: 45px;
    height: 45px;
    border-radius: 50%;
    border: 2px solid white;
    float: right;
    margin-left: -8px;
}

.post-campaign .campaign .image {
    min-height: 330px;
}

.promo-exclusive .image {

}

.card .box {
    background-color: #fff9f6;
    padding: 15px 15px 20px 15px;
    border-bottom-right-radius: 15px;
    border-bottom-left-radius: 15px;
    border: 1px solid #e4e4e4;
}

.card .box > .giveaway-title {
    font-size: 14px;
    font-weight: 900;
    margin-bottom: 5px;
    display: block;
    color: white;
}

.card .box > .giveaway-title i {
    font-size: 11.5px;
    color: white;
}

.card .box > .section {
    font-size: 14px;
    font-weight: 900;
    margin-bottom: 5px;
    display: block;
    color: #FF5072;
}

.card .box > .title {
    font-size: 22px;
    line-height: 22px;
    font-weight: 900;
    margin-bottom: 5px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    min-height: 28px;
}

.card .box > .event-title i {
    color: #FF5072;
    font-size: 14px;
}

.card .box > .event-title {
    color: #FF5072;
    font-size: 14px;
    font-weight: 900;
    margin-bottom: 5px;
    display: block;
}

.event-container {
    padding: 0 15px;
}

.event .box .footer .text {
    float: left;
    padding-top: 5px;
    padding: 7px 10px;
    border-radius: 15px;
    background-color: #ff5071;
}

.event .box .footer .disabled {
    background-color: #e4cfc9;
}

.campaign .box > .title {
    color: #ffa3a3;
}

.campaign .box > .value {
    color: #6D6D6D;
    font-size: 13px;
    display: inline-block;
    margin: 10px 0 0px 0px;
    font-weight: 900;
}



.article .box > .title {
    -webkit-line-clamp: initial;
}

.card .box .extract {
    font-size: 14px;
    line-height: 16px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    color: #7e7a80;
}

.campaign .box .extract {
    color: #c7c3e1;
}

.card .box .extract-full {
    display: initial;
    -webkit-line-clamp: unset;
}

.card .box .footer {
    display: table;
    width: 100%;
    margin-top: 20px;
}

.campaign .box > .footer {
    display: flex;
    width: 100%;
    margin-top: 0;
}

.card .box .footer .button {
    padding: 6px 15px;
    border-radius: 20px;
    float: right;
    font-size: 16px;
    font-weight: 500;
}

.card .box .footer .active {
    color: #FF5072;
    border: 1px solid #FF5072;
    background-color: white;
}

.card .box .footer .active i {
    color: #FF5072;
    font-size: 13px;
}

.card .box .footer .transparent-btn {
    border: 1px solid white;
    background-color: transparent;
    color: white;
    margin-right: 5px;
}

.card .box .footer .solid-btn {
    border: 1px solid #4739c5;
    color: #4739c5;
}

.card .box .footer .green {
    color: green;
    border: 1px solid green;
}

.card .box .footer .green i {
    color: green;
}

.card .box .footer .inactive {
    color: #0e007f;
    border: 1px solid #0e007f;
    background-color: #ffffff;
}

.card .box .footer .text {
    float: left;
    padding-top: 5px;
}

.card .box .footer .text span, .card a .box .footer .text span i {
    color: #938d8b;
    font-size: 14px;
}

.event .box .footer .text span,
.event a .box .footer .text span i {
    color: #ffffff;
    font-size: 14px;
    font-weight: 500;
}

.event .box .footer .disabled span,
.event a .box .footer .disabled span i {
    color: #ffffff;
    font-size: 14px;
    font-weight: 500;
}

.campaign .box .footer .button {
    float: none;
    display: inline-block;
    margin-top: 10px;
    font-size: 13px;
    padding: 0;
    border: none;
}

.card .image .comments {
    background-color: #FF5072;
    display: inline-block;
    padding: 5px 10px;
    border-radius: 8px;
    position: absolute;
    bottom: 12px;
    right: 12px;
}

.card .image .comments i {
    font-size: 16px;
    color: white;
    float: left;
    margin-top: 4px;
    margin-right: 3px;
}

.card .image .comments span {
    color: white;
    font-size: 15px;
    float: left;
    margin-top: 3px;
    margin-bottom: 1px;
}

.image-wide {
    height: 130px;
    background-color: #ff9e9e;
    border-radius: 15px;
    margin-bottom: 15px;
    overflow: hidden;
}

.image-wide img {
    width: 100%;
}

/* related cards */

.related-card-container {
    display: flex;
    flex-wrap: nowrap;
    overflow: auto;
    padding: 0 15px;
    -webkit-overflow-scrolling: touch;
    overflow-y: hidden;
    height: 250px;
}

.related-card-container .card {
    border-radius: 15px;
    overflow: hidden;
    width: 230px;
    height: 245px;
    flex: 0 0 auto;
    margin-right: 10px;
    position: relative;
    border: 1px solid #dfdfdf;
    cursor: pointer;
}

.related-card-container .card  .about-img {
    width: 100%;
    overflow: hidden;
    height: 143px;
    background-color: #e6e6e6;
}

.related-card-container .card  .about-img > img {
    width: 100%;
    margin-top: -8px;
    background-color: #FCF2EF;
}

.related-card-container .card  .profile-img {
    width: 80px;
    height: 80px;
    border: 2px solid white;
    border-radius: 50%;
    position: absolute;
    top: 73px;
    background-color: white;
    z-index: 1;
    left: 5px;
    overflow: hidden;
}

.related-card-container .card  .profile-img > .image {
    width: 100%;
}

.related-card-container .card  .bg {
    background-color: #fbfbfb;
    padding: 20px 15px 13px 15px;
    border-bottom-left-radius: 15px;
    border-bottom-right-radius: 15px;
    position: relative;
    height: 71px;
}

.related-card-container .card  .bg > .brand-name {
    font-family: "Space Mono", monospace;
    color: #656565;
    display: block;
    text-transform: uppercase;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    line-height: 19px;
}

.related-card-container .card  .bg > .not-brand-name {
    color: #656565;
    font-weight: 900;
    display: block;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    line-height: 19px;
}

.related-card-container .card  .bg > .description {
    font-size: 12px;
    color: #868686;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    height: 47px;
    position: relative;
    margin-top: 3px;
    line-height: 16px;
}

.related-card-container .card .follow-box {
    margin-top: 8px;
    position: absolute;
    bottom: 0;
    width: 100%;
}

.related-card-container .card .follow-box .container {
    padding: 7px 15px 9px 15px;
    background-color: #fbfbfb;
}

.related-card-container .card-more {
    border-radius: 15px;
    overflow: hidden;
    width: 160px;
    height: 215px;
    flex: 0 0 auto;
    margin-right: 30px;
    position: relative;
    text-align: center;
    padding: 15px;
    border: 1px solid #d9d1d1;
    cursor: pointer;
}

.related-card-container .card-more span {
    color: #938d8b;
    margin-top: 70px;
    display: block;
}

.related-card-container .card-more i {
    color: #938d8b;
    font-size: 22px;
    margin-top: 10px;
}

.article-card-container {
    display: flex;
    flex-wrap: nowrap;
    overflow: auto;
    padding: 0 15px;
    -webkit-overflow-scrolling: touch;
    overflow-y: hidden;
    height: 353px;
}

.article-card-container .article-sm-card {
    border-radius: 15px;
    overflow: hidden;
    width: 228px;
    height: 350px;
    flex: 0 0 auto;
    margin-right: 11px;
    position: relative;
    border: 1px solid #e4e4e4;
}

.article-card-container .article-sm-card .image {
    width: 100%;
    overflow: hidden;
    height: 174px;
    background-color: gainsboro;
    position: relative;
}

.article-card-container .article-sm-card .image img {
    width: 100%;
}

.article-card-container .article-sm-card .image .comments {
    background-color: #FF5072;
    display: inline-block;
    padding: 5px 7px;
    border-radius: 8px;
    position: absolute;
    bottom: 12px;
    right: 12px;
}

.article-card-container .article-sm-card .image .comments .fa-comment {
    font-size: 15px;
    color: white;
    float: left;
    margin-top: 3px;
    margin-right: 3px;
}

.article-card-container .article-sm-card .image .comments span {
    color: white;
    font-size: 14px;
    float: left;
    margin-top: 1px;
    margin-bottom: 1px;
}

.article-card-container .article-sm-card .box {
    background-color: #fff9f6;
    padding: 15px 15px 20px 15px;
    border-bottom-right-radius: 15px;
    border-bottom-left-radius: 15px;
    height: 162px;
}

.article-card-container .article-sm-card .box .section {
    font-size: 14px;
    font-weight: 900;
    margin-bottom: 5px;
    display: block;
    color: #FF5072;
}

.article-card-container .article-sm-card .box .title {
    font-size: 18px;
    line-height: 18px;
    font-weight: 900;
    margin-bottom: 5px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    min-height: 28px;
    color: #504d4c;
}

.article-card-container .article-sm-card .box .extract {
    font-size: 13px;
    line-height: 16px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    color: #938d8b;
}

.article-card-container .article-sm-card-more {
    border-radius: 15px;
    overflow: hidden;
    width: 198px;
    height: 320px;
    flex: 0 0 auto;
    margin-right: 30px;
    position: relative;
    text-align: center;
    padding: 15px;
    border: 1px solid #bbbbbb;
}

.article-card-container .article-sm-card-more .article-more-txt {
    color: #868686;
    margin-top: 130px;
    display: block;
}

.article-card-container .article-sm-card-more i {
    color: #868686;
    font-size: 22px;
    margin-top: 10px;
}

.article-feed #loader-pagination {
    background-color: white;
}

.giveaway-card-container {
    display: flex;
    flex-wrap: nowrap;
    overflow: auto;
    padding: 0 15px;
    -webkit-overflow-scrolling: touch;
    overflow-y: hidden;
    height: 435px;
    margin: 25px 0 15px 0;
}

.container-recommended-results .giveaway-card-container {
    margin-top: 15px;
}

.giveaway-card-container .giveaway-sm-card {
    border-radius: 15px;
    overflow: hidden;
    width: 228px;
    height: 433px;
    flex: 0 0 auto;
    margin-right: 10px;
    position: relative;
    border: 1px solid #e4e4e4;
}

.giveaway-card-container .giveaway-sm-card .image {
    width: 100%;
    overflow: hidden;
    height: 228px;
    background-color: gainsboro;
    position: relative;
}

.giveaway-card-container .giveaway-sm-card .image img {
    width: 100%;
}

.giveaway-card-container .giveaway-sm-card .box {
    background-color: #fbf1ee;
    padding: 15px 15px 20px 15px;
    border-bottom-right-radius: 15px;
    border-bottom-left-radius: 15px;
    height: 170px;
}

.giveaway-card-container .giveaway-sm-card .box .giveaway-title {
    font-size: 14px;
    font-weight: 900;
    margin-bottom: 5px;
    display: block;
    color: #FF5072;
}

.giveaway-card-container .giveaway-sm-card .box .giveaway-title i {
    font-size: 11.5px;
    color: #FF5072;
}

.giveaway-card-container .giveaway-sm-card .box .title {
    font-size: 18px;
    line-height: 18px;
    font-weight: 900;
    margin-bottom: 5px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    min-height: 28px;
}

.giveaway-card-container .giveaway-sm-card .box .value {
    color: #ffffff;
    font-size: 14px;
    display: inline-block;
    margin: 5px 0 2px -3px;
    font-weight: 500;
    padding: 5px 12px;
    background-color: #ff5171;
    border-radius: 10px;
}

.giveaway-card-container .giveaway-sm-card .box .footer {
    display: table;
    width: 100%;
    margin-top: 5px;
}

.giveaway-card-container .giveaway-sm-card .box .footer .text {
    float: left;
    padding-top: 3px;
    width: 100%;
}

.giveaway-card-container .giveaway-sm-card .box .footer .text span {
    color: #938d8b;
    font-size: 14px;
}

.giveaway-card-container .giveaway-sm-card .box .footer .text i {
    color: #938d8b;
    font-size: 14px;
}

.giveaway-card-container .giveaway-sm-card .box .footer .button {
    float: left;
    font-size: 15px;
    font-weight: 500;
    display: inline-block;
    margin: auto;
    padding: 10px 15px;
    border-radius: 20px;
    font-weight: 500;
    cursor: pointer;
    margin-top: 10px;
}

.giveaway-card-container .giveaway-sm-card .box .footer .active {
    color: #FF5072;
    border: 1px solid #FF5072;
    background-color: white;
}

.giveaway-card-container .giveaway-sm-card .box .footer .inactive {
    color: #9c9c9c;
    border: 1px solid #bdbdbd;
    background-color: #ffffff;
}

.giveaway-card-container .giveaway-sm-card .box .footer .green {
    color: green;
    border: 1px solid green;
}

.giveaway-card-container .giveaway-sm-card .box .footer .green i {
    color: green;
}

.giveaway-card-container .giveaway-sm-card .box .footer .campaign-winners {
    float: left;
    height: 26px;
}

.giveaway-card-container .giveaway-sm-card .box .footer .campaign-winners .title {
    color: #938d8b;
    font-size: 14px;
    float: left;
    margin-top: 7px;
    font-weight: 400;
}

.giveaway-card-container .giveaway-sm-card .box .footer .campaign-winners .title i {
    color: #938d8b;
    font-size: 12px;
    margin-right: 4px;
}

.giveaway-card-container .giveaway-sm-card .box .footer .campaign-winners .users {
    padding-left: 8px;
    display: inline-block;
}

.giveaway-card-container .giveaway-sm-card .box .footer .campaign-winners .users img {
    width: 22px;
    height: 22px;
    border-radius: 50%;
    margin-left: -6px;
    border: 2px solid #fcf2ef;
    float: left;
    object-fit: cover;
}

.giveaway-card-container .giveaway-sm-card .box .footer .campaign-winners .users .user-plus {
    width: 22px;
    height: 22px;
    border-radius: 50%;
    margin-left: -10px;
    border: 2px solid #fcf2ef;
    background-color: #d3c6c2;
    display: inline-block;
    text-align: center;
    float: left;
}

.giveaway-card-container .giveaway-sm-card .box .footer .campaign-winners .users .user-plus span {
    color: #ffffff;
    font-size: 11px;
    font-weight: 900;
}

.giveaway-card-container .giveaway-sm-card-more {
    border-radius: 15px;
    overflow: hidden;
    width: 198px;
    height: 403px;
    flex: 0 0 auto;
    margin-right: 30px;
    position: relative;
    text-align: center;
    padding: 15px;
    border: 1px solid #bbbbbb;
}

.giveaway-card-container .giveaway-sm-card-more .giveaway-more-txt {
    color: #868686;
    margin-top: 186px;
    display: block;
}

.giveaway-card-container .giveaway-sm-card-more i {
    color: #868686;
    font-size: 22px;
    margin-top: 10px;
}

.giveaway-micro-card-container {
    display: flex;
    flex-wrap: nowrap;
    overflow: auto;
    padding: 0 15px;
    -webkit-overflow-scrolling: touch;
    overflow-y: hidden;
    height: 195px;
    margin: 25px 0 15px 0;
}

.giveaway-micro-card-container .giveaway-micro-card {
    overflow: hidden;
    width: 152px;
    height: 200px;
    flex: 0 0 auto;
    margin-right: 10px;
    position: relative;
}

.giveaway-micro-card-container .giveaway-micro-card .image {
    width: 100%;
    overflow: hidden;
    height: 152px;
    background-color: gainsboro;
    position: relative;
    border-radius: 10px;
}

.giveaway-micro-card-container .giveaway-micro-card .image img {
    width: 100%;
}

.giveaway-micro-card-container .giveaway-micro-card .name {
    font-size: 14px;
    line-height: 16px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    min-height: 32px;
    margin-top: 10px;
}

/* articles */


.pnl .article {

}

.body-article .body {
    margin-bottom:  50px;
}

.pnl .article p,
.body-article p {
    display: block;
    line-height: 26px;
}

.pnl .article p {
    margin-bottom: 0;
    display: block;
    line-height: 24px;
    font-size: 16px;
}

.body-quill p {
    line-height: 24px;
}

.pnl .article p a,
.body-article .body p a {
    text-decoration: underline;
    cursor: pointer;
    color: #330cc0;
}

.pnl .article p a {
    font-size: 16px;
}

.body-quill p a {
    background-image: linear-gradient(to bottom, transparent 0, #ffe5dd 0);
    background-position: 0 0.8em;
    background-repeat: no-repeat;
    -webkit-transition: background-position 0.08s ease-out;
    -ms-transition: background-position 0.08s ease-out;
    -moz-transition: background-position 0.08s ease-out;
    -o-transition: background-position 0.08s ease-out;
    transition: background-position 0.08s ease-out;
    cursor: pointer;
    color: #866097;
    font-weight: 500;
}

.pnl .article .capital-letter,
.body-article .capital-letter,
.body-quill .capital-letter {
    font-size: 125px;
    font-weight: 700;
    float: left;
    margin-top: 10px;
    margin-left: -5px;
    margin-right: 10px;
    color: #ffcfc1;
    line-height: 90px;
}

.pnl .article h2,
.body-article h2,
.body-quill h2 {
    margin-top: 20px;
    margin-bottom: 10px;
    line-height: 28px;
    font-size: 24px;
    color: #364a63;
    font-family: 'Roboto', sans-serif;
    font-weight: 500;
    display: block;
    letter-spacing: initial;
    font-weight: 900;
    border-top: 1px solid #c7c9d6;
    padding-top: 50px;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.pnl .article h2 a,
.body-article h2 a,
.body-quill h2 a {
    line-height: 26px;
    font-size: 22px;
    color: #536484;
    text-decoration: underline;
}

.pnl .article h3,
.body-article h3,
.body-quill h3 {
    font-size: 20px;
    display: block;
    line-height: 24px;
    margin-top: 10px;
    margin-bottom: 8px;
    color: #ff9e9e;
    font-family: "Roboto", sans-serif;
    letter-spacing: initial;
    font-weight: 900;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.pnl .article h3 a,
.body-article h3 a,
.body-quill h3 a {
    font-size: 20px;
    line-height: 24px;
    color: #ff9e9e;
    text-decoration: underline;
}

.pnl .article h4,
.body-article h4,
.body-quill h4 {
    font-size: 17px;
    display: block;
    color: #536484;
    line-height: 20px;
    margin-top: 10px;
    margin-bottom: 5px;
    font-family: "Roboto", sans-serif;
    letter-spacing: initial;
    font-weight: 900;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.pnl .article h4 a,
.body-article h4 a,
.body-quill h4 a {
    font-size: 18px;
    line-height: 22px;
    text-decoration: underline;
}

/**/

.pnl .article ol,
.pnl .article ul,
.body-article ol,
.body-article ul,
.body-quill ul,
.body-quill ol {
    margin-left: 0;
    margin-top: 10px;
    padding-left: 0 !important;
}

.ql-editor li::before {
    width: initial;
}

.pnl .article ul>li::before,
.body-article ul>li::before,
.body-quill ul>li::before {
    content: '\2022';
    unicode-bidi: isolate;
    font-variant-numeric: tabular-nums;
    text-transform: none;
    text-indent: 0px !important;
    text-align: start !important;
    text-align-last: start !important;
}

.pnl .article li:not(.ql-direction-rtl)::before,
.body-article li:not(.ql-direction-rtl)::before,
.body-quill ul>li:not(.ql-direction-rtl)::before {
    margin-left: -20px;
    margin-right: 14px;
    text-align: right;
}

.pnl .article li,
.body-article li,
.body-quill li {
    padding-left: 30px !important;
    margin-bottom: 15px;
    line-height: 22px;
    display: block;
    font-family: "Roboto", sans-serif;
    font-size: 16px;
    letter-spacing: initial;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    color: #364a63;
    font-weight: 400;
}

.pnl .article li a,
.body-article li a,
.body-quill li a {
    font-family: "Roboto", sans-serif;
    font-size: 16px;
    letter-spacing: initial;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}


.pnl .article h4 + ul,
.body-article h4 + ul,
.body-quill h4 + ul{
    border: 1px solid #6576fe;
    overflow: hidden;
    margin-bottom: 15px;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
    border-top: none;
    background-color: #f9f9ff;
    padding: 15px 10px 5px 10px !important;
    margin-top: 0;
}

.body-quill h4 + ul {
    margin-bottom: 0 !important;
}

.pnl .article h4,
.body-article h4,
.body-quill h4 {
    background-color: #e7e9ff;
    padding: 15px 10px 15px 15px;
    border: 1px solid #6576fe;
    border-bottom: none;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    margin-bottom: 0 !important;
    color: #6576fe;
    font-size: 18px;
}

.pnl .article h4 + ul ~ h4,
.body-article h4 + ul ~ h4,
.body-quill h4 + ul ~ h4{
    background-color: #e7e9ff;
    padding: 15px 10px 15px 20px;
    border: 1px solid #6576fe;
    border-bottom: none;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    margin-bottom: 0 !important;
    color: #6576fe;
    font-size: 18px;
}

/**/

.pnl .article .image,
.body-article .image,
.body-quill .image {
    margin-bottom: 30px;
}

.pnl .article img,
.body-article img,
.body-quill img {
    width: 100%;
}

.pnl .article .image-footer, 
.body-article .image-footer,
.body-quill .image-footer,
.ql-size-small {
    line-height: 26px;
    font-style: italic;
    color: gray;
    margin-bottom: 30px;
    font-size: 14px !important;
    margin-top: 0;
}

.pnl .article .image-footer,
.pnl .article .image-footer a {
    font-size: 14px;
}

.pnl .article .image-footer a, 
.body-article .image-footer a,
.body-quill .image-footer a,
.ql-size-small a {
    font-style: italic;
    color: gray;
    font-size: 14px !important;
}

.pnl .article .image-footer-empty, 
.body-article .image-footer-empty {
    
}

.pnl .article .embeded-container,
.pnl .article .instagram-media,
.pnl .article .giphy-embed,
.body-article .embeded-container,
.body-article .instagram-media,
.body-article .giphy-embed,
.body-quill .embeded-container,
.body-quill .instagram-media,
.body-quill .giphy-embed {
    width:100%;
    display: block;
    margin-bottom: 30px !important;
}

.pnl .article .youtube-container,
.body-article .youtube-container,
.body-quill .youtube-container {
    position: relative; 
    padding-bottom: 56.25%; 
    padding-top: 25px; 
    height: 0;
}

.pnl .article .youtube-container iframe,
.body-article .youtube-container iframe,
.body-quill .youtube-container iframe {
    position: absolute; 
    top: 0; 
    left: 0; 
    width: 100%;
    height: 100%;
}

.pnl .article .giphy-container,
.body-article .giphy-container,
.body-quill .giphy-container {
    width:100%;
    height:0;
    padding-bottom:75%;
    position:relative;    
    margin-bottom: 30px !important;
}

.pnl .article .giphy-container iframe,
.body-article .giphy-container iframe,
.body-quill .giphy-container iframe {
    position: absolute; 
    width: 100%;
    height: 100%;
}


.pnl-purple {
    background-color: #422985;
}

.pnl-purple .icon-box i,
.pnl-purple .title,
.pnl-purple .subtitle {
    color: white;
}

.pnl-purple .special {
    font-size: 21px;
    font-weight: 500;
    background: -webkit-linear-gradient(90deg, #ffffff, #ffc107);
    -webkit-text-fill-color: transparent;
    -webkit-background-clip: text;
}

.pnl-bg-purple {
    background-color: #422985;
    padding-bottom: 40px;
    margin-bottom: 7px;
}

.pnl-bg-purple .header-lg .title .top,
.pnl-bg-purple .header-lg .title .bottom,
.pnl-bg-purple .icon-list-container .list-item .right-col .title {
    color: white;
}

.pnl-bg-purple .header-lg .subtitle span,
.pnl-bg-purple .icon-list-container .list-item .right-col .subtitle {
    color: #b6add2
}

.pnl-bg-purple .header-lg .title .bottom .special {
    background: -webkit-linear-gradient(90deg, #ffffff, #ffc107);
    -webkit-background-clip: text;
}

.pnl-bg-purple .header-lg .hr {
    border-bottom: 1px solid white;
}

.pnl-bg-purple .icon-list-container .list-item .left-col .bg i {
    color: #422985;
}

.pnl-bg-purple .icon-list-container .list-item .left-col .bg {
    background-color: #ffffff;
}

.pnl-bg-purple .content-wrapper .wide-btn-blue {
    background: linear-gradient(111deg, #896ab8 0%, #cd8aed 100%)
}

.pnl-bg-purple .content-wrapper .wide-btn-transparent {
    border: 1px solid #b6acd2;
    color: #b6acd2;
    background-color: transparent;
}

.pnl .article .video-js,
.body-article .video-js,
.body-quill .video-js {
    font-size: 10px;
    color: #fff;
    outline: none;
    width: 100%;
}

.body-quill .video-js .vjs-tech {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.content-snippet-product-title {
    margin-bottom: 15px;
}

.content-snippet-product-title .product, 
.content-snippet-product-community .product {
    display: flex;
    flex-direction: row;
}

.content-snippet-product-title .product .left,
.content-snippet-product-community .product .left {
    width: 50%;
    padding-right: 7px;
}

.content-snippet-product-title a,
.content-snippet-product-community a {
    background-image: initial;
    background-position: initial;
    background-repeat: initial;
    -webkit-transition: initial;
    -ms-transition: initial;
    -moz-transition: initial;
    -o-transition: initial;
    transition: initial;
    cursor: pointer;
    color: initial;
    font-weight: initial;
}

.content-snippet-product-title .product .left img,
.content-snippet-product-community .product .left img {
    width: 100%;
    border-radius: 10px;
}

.content-snippet-product-title .product .right,
.content-snippet-product-community .product .right {
    width: 50%;
    padding-left: 7px;
}

.content-snippet-product-title .product .right .brand,
.content-snippet-product-community .product .right .brand {
    font-family: "Space Mono", sans-serif;
    font-size: 16px;
    display: block;
    line-height: 16px;
    color: #5C5C5C;
    text-transform: uppercase;
    margin-bottom: 2px;
}

.content-snippet-product-title .product .right .name,
.content-snippet-product-community .product .right .name {
    font-weight: 200;
    font-size: 17px;
    line-height: 18px;
    margin-bottom: 16px;
}

.content-snippet-product-title .product .right .category,
.content-snippet-product-community .product .right .category {
    font-size: 11px;
    color: #B1B1B1;
    display: block;
    line-height: 11px;
    margin: 3px 0 6px 0;
}

.content-snippet-product-title .product .right .version-container,
.content-snippet-product-community .product .right .version-container {
    display: flex;
    flex-wrap: wrap;
}

.content-snippet-product-title .product .right .version-container .version,
.content-snippet-product-community .product .right .version-container .version {

}

.content-snippet-product-title .product .right .version-container .version > .bg,
.content-snippet-product-community .product .right .version-container .version > .bg {
    background-color: #ffffff;
    border: 1px solid #b8b8b8;
    padding: 1px 10px;
    border-radius: 10px;
    margin: 0 3px 5px 0;
    cursor: pointer;
}

.content-snippet-product-title .product .right .version-container .version .bg .txt,
.content-snippet-product-community .product .right .version-container .version .bg .txt {
    color: #887b7a;
    font-size: 12px;
}

.content-snippet-product-title .product .right .version-container .version .version-img,
.content-snippet-product-community .product .right .version-container .version .version-img {

}

.content-snippet-product-title .product .right .version-container .version .version-img .bg,
.content-snippet-product-community .product .right .version-container .version .version-img .bg {
    background-color: white;
    border-radius: 5px;
    border: 1px solid #b8b8b8;
    padding: 0px 0px;
    display: flex;
    align-items: center;
    overflow: hidden;
    margin-bottom: 5px;
}

.content-snippet-product-title .product .right .version-container .version .version-img .bg .img,
.content-snippet-product-community .product .right .version-container .version .version-img .bg .img {
    width: 25px;
}

.content-snippet-product-title .product .right .version-container .version .version-img .bg .text,
.content-snippet-product-community .product .right .version-container .version .version-img .bg .text {
    color: #887b7a;
    font-size: 12px;
    padding: 5px;
}

.content-snippet-product-title .product .right .rating, 
.content-snippet-product-community .product .right .rating {
    margin-bottom: 5px;
    display: flex;
}

.content-snippet-product-title .product .right .rating .product-star {
    
}

.content-snippet-product-title .product .right .rating .score {
    font-size: 14px;
    font-weight: 900;
    margin-left: 3px;
}

.content-snippet-product-community .product .right .rating .score {
    font-size: 28px;
    font-weight: 900;
    margin-left: 3px;
}

.content-snippet-product-title .product .right .rating .score-base {
    color: #A3A3A3;
    font-size: 13px;
    margin-top: 1px;
    margin-left: 5px;
}

.content-snippet-product-community .product .right .rating .score-base {
    color: #A3A3A3;
    font-size: 13px;
    margin-top: 1px;
    margin-left: 5px;
}

.content-snippet-product-title .product .right .description {
    font-size: 12px;
    color: #A3A3A3;
    display: -webkit-box;
    -webkit-line-clamp: 5;
    -webkit-box-orient: vertical;
    overflow: hidden;
    line-height: 18px;
}

.content-snippet-product-community .product .right .description {
    font-size: 12px;
    color: #A3A3A3;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    line-height: 18px;
}

.content-snippet-product-community {
    background-color: #FAF1EE;
    padding: 15px;
    border-radius: 10px;
    border: 1px solid #e8dfde;
}

.content-snippet-product-community .headline {
    display: flex;
    border-bottom: 1px solid #D8C6C4;
    padding-bottom: 20px;
    margin-bottom: 25px;
}

.content-snippet-product-community .headline .left {
    margin-top: 4px;
}

.content-snippet-product-community .headline .left i {
    color: #ff9f9f;
    font-size: 20px;
}

.content-snippet-product-community .headline .right {
    margin-left: 10px;
}

.content-snippet-product-community .headline .right .title {
    color: #ff9f9f;
    font-weight: 500;
    display: inline-block;
    letter-spacing: -0.5px;
    font-size: 22px;
}

.content-snippet-product-community .headline .right .subtitle {
    display: block;
    margin-top: 3px;
    font-size: 13px;
    color: #6d6d6d;
}

.content-snippet-product-community .product {
    margin-bottom: 20px;
    border-bottom: 1px solid #d8c6c3;
    padding-bottom: 20px;
}

.content-snippet-product-community .section-title {
    font-size: 14px;
    font-weight: 900;
    display: block;
    color: #887e8d;
    margin-bottom: 4px;
}

.content-snippet-product-community .review-specs-ratings {
    background-color: initial;
    padding: 0;
    margin-top: 20px;
}

.content-snippet-product-community .review-specs-ratings .specs .col .circle {
    width: 35px;
    height: 35px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.content-snippet-product-community .review-specs-ratings .specs .col .circle .container {
    margin-top: 0;
}

.content-snippet-product-community .review-cards-container {
    margin-left: -15px;
    margin-right: -15px;
}

.content-snippet-product-community .review-cards .review-card {
    background-color: white;
    border: 1px solid #d8c6c3;
}

.content-snippet-product-community .content-wrapper {
    padding: 0;
}

/* info-box */

.info-box {
    margin: -5px 15px 40px 15px;
}

.info-box .subtitle {
    color: #5D5D5D;
    display: block;
    line-height: 20px;
    margin-bottom: 15px;
}

/* campaign */

.feed-campaign {
    margin-top: -20px;
}

.feed .post .body .campaign, .feed .campaign {
    padding: 25px 15px 15px 15px;
}

.pnl .campaign {
    margin-bottom: 30px;
}

.campaign a .image {
    border-radius: 10px;
}

.campaign a .box {
    padding: 15px 0 0 0;
    background-color: white;
    border: none;
}

.campaign a .box .title {
    color: #432985;
    font-size: 18px;
    min-height: auto;
    margin-bottom: 7px;
    line-height: 20px;
}

.campaign a .box .winners {
    display: flex;
    flex-direction: column;
    margin-top: 5px;
}

.campaign a .box .winners span {
    font-size: 14px;
    font-weight: 900;
    color: #ff9e9f;
}

.campaign a .box .winners .users {
    display: flex;
    margin-left: 5px;
    margin-top: 2px;
}

.campaign a .box .winners .users img {
    width: 18px;
    height: 18px;
    object-fit: cover;
    border-radius: 50%;
    margin-left: -5px;
    border: 2px solid white;
}

.campaign a .box .extract {
    color: #6D6D6D;
    font-size: 14px;
}

.campaign a .box .footer .campaign-winners {
    
}

.campaign a .box .footer .campaign-winners .title {
    color: #ff9e9e;
    font-size: 12px;
    font-weight: 900;
    float: left;
    margin-top: 7px;
}

.campaign a .box .footer .campaign-winners .title i {
    color: #ff9e9e;
    font-size: 12px;
    float: left;
    margin-right: 3px;
}

.campaign a .box .footer .campaign-winners .users {
    padding-left: 8px;
    display: inline-block;
}

.campaign a .box .footer .campaign-winners .users img {
    width: 17px;
    height: 17px;
    border-radius: 50%;
    margin-left: -6px;
    border: 2px solid #fcf2ef;
    float: left;
    object-fit: cover;
    margin-top: 4px;
}

.campaign a .box .footer .campaign-winners .users .user-plus {
    width: 22px;
    height: 22px;
    border-radius: 50%;
    margin-left: -10px;
    border: 2px solid #fcf2ef;
    background-color: #d3c6c2;
    display: inline-block;
    text-align: center;
    float: left;
}

.campaign a .box .footer .campaign-winners .users .user-plus span {
    color: #ffffff;
    font-size: 11px;
    font-weight: 900;
}


/* promos */

.promo-brands {
    background-color: white;
    margin-top: 7px;
    padding: 20px 0 15px 0;
}

.promo-brands-row {
    padding-left: 15px;
    height: 125px;
    overflow: auto;
    white-space: nowrap;
    -webkit-overflow-scrolling: touch;
    overflow-y: hidden;
    overflow-x: scroll;
}


.promo-brand {

}

.promo-brand .brand-col {
    width: 90px;
    height: 120px;
    text-align: center;
    display: inline-table;
    position: relative;
    cursor: pointer;
}

.promo-brand .brand-col div {
    width: 75px;
    height: 75px;
    box-shadow: -4px 4px 4px #e4e4e4;
    border-radius: 50%;
    display: block;
    margin: auto;
    margin-bottom: 15px;
    background-color: #ffe7e0;
    overflow: hidden;
}

.promo-brand .selected div {
    border: 4px solid #ff9e9e;
    margin-bottom: 11px;
}

.promo-brand .brand-col div img {
    width: 100%;
}

.promo-brand .brand-col span {
    font-family: "Space Mono", monospace;
    font-weight: 700;
    font-size: 13px;
    color: #191919;
    text-transform: uppercase;
    line-height: 14px;
    display: block;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    white-space: normal;
}

.promo-brand .brand-col .biustore {
    font-family: "Roboto";
    font-size: 16px;
    text-transform: initial;
    font-weight: 900;
    color: #332fab;
}

.post .body .promo, .post-promo-exclusive .body .promo {
    padding: 0 15px 15px 15px;
    position: relative;
}

.promo .box {
    padding: 30px 15px 20px 15px;
}

.promo .box > .exclusive {
    font-size: 14px;
    font-weight: 900;
    margin-bottom: 5px;
    display: block;
    color: #FF5072;
}

.promo .box > .exclusive i {
    font-size: 11.5px;
    color: #FF5072;
}

.promo .box > .title {
    font-size: 22px;
    line-height: 24px;
}

.promo .box .code {
    background: linear-gradient(111deg, #0c007f 0%, #7768ff 100%);
    padding: 8px 12px;
    display: inline-block;
    margin-bottom: 10px;
    margin-top: 2px;
    border-radius: 4px;
    box-shadow: 2px 2px 4px #00000038;
}

.promo .box .code span {
    font-weight: 900;
    color: white;
}

.promo .box .end-date {
    margin-bottom: 10px;
}

.promo .box .end-date > span {
    color: #938d8b;
    font-size: 14px;
    font-weight: 900;
}

.promo .box .end-date i {
    color: #938d8b;
    font-size: 14px;
}

.promo .box .footer .text > span {
    color: #c7b5ad;
    font-size: 14px;
    font-weight: 500;
}

.post .promoted-action {

}

.post .promoted-action .container {
    background-color: #F7F7F7;
    padding: 0px 15px 0 20px;
    height: 45px;
}

.post .promoted-action .container span {
    color: #727272;
    float: left;
    font-size: 13px;
    margin-top: 15px;
}

.post .promoted-action .container a {
    color: #FF5072;
    border: 1px solid #FF5072;
    background-color: white;
    padding: 4px 15px;
    border-radius: 15px;
    float: right;
    font-size: 14px;
    font-weight: 500;
    margin-top: 10px;
}

.promo-exclusive {

}

.promo-exclusive .img {
    width: 110% !important;
    margin-bottom: -4px;
    margin-left: -10px;
    -webkit-filter: blur(10px);
}

.promo-exclusive .profile, .promo .profile {
    height: 80px;
    width: 80px;
    border-radius: 50%;
    border: 3px solid white;
    position: absolute;
    top: 110px;
    left: 30px;
    background-color: white;
    object-fit: cover;
}

.promo-exclusive .box {
    padding: 30px 15px 20px 15px;
    background: linear-gradient(111deg, #2d1974 0%, #7b56b1 100%);
}

.promo-exclusive .box > .exclusive,
.promo-exclusive .box > .exclusive i {
    color: #ffc007;
}

.promo-exclusive .box .extract {
    color: #F1A4A3;
}

.promo-exclusive .box > .title,
.promo-exclusive .box .end-date > span,
.promo-exclusive .box .end-date i {
    color: white;
}

.promo-exclusive .box .footer .button {
    float: left;
}

.promo-exclusive .box .footer .active {
    color: #0F007F;
    border: none;
    background-color: white;
    padding: 10px 15px;
}

.promo-exclusive .box .footer .transparent-btn {
    border: 1px solid white;
    background-color: transparent;
    color: white;
    margin-right: 10px;
}


.post-sign-up {
    text-align: center;
    position: relative;
    z-index: 4;
    margin-top: -300px;
    width: 100%;
}

.post-sign-up .gradient {
    background: linear-gradient(0deg, #e8c6f8 0%, rgba(255,255,255,0) 100%);
    height: 200px;
}

.post-sign-up .bg {
    background: linear-gradient(0deg, #d8b7e8 0%, #e8c6f8 100%);
    padding: 120px 25px 240px 25px;
}

.post-sign-up .signed-out-title {
    font-size: 28px;
    font-weight: 800;
    display: block;
    line-height: 28px;
    margin: auto;
    margin-bottom: 15px;
    color: #0C057F;
    text-shadow: -2px 2px 0px #faf0ff;
}

.post-sign-up .signed-out-subtitle {
    font-size: 18px;
    line-height: 22px;
    max-width: 300px;
    display: block;
    margin: auto;
    margin-bottom: 30px;
    color: #0c067f;
}

.post-sign-up .signed-out-btns {
    display: block;
}

.post-sign-up .signed-out-btns .solid-btn {
    background: linear-gradient(111deg, #2d1974 0%, #cd8aed 100%);
    color: white;
    margin-left: 5px;
}


.scroll-up-btn {
    padding: 8px 20px;
    border-radius: 20px;
    border: 1px solid #ff9e9e;
    background-color: #ff9e9e;
    color: white;
    font-weight: 500;
    z-index: 10;
    position: fixed;
    left: 50%;
    top: 80px;
    transform: translate(-50%,-50%);
    box-shadow: 2px 2px 4px #00000038;
    display: none;
    cursor: pointer;
}

.scroll-up-btn i {
    color: white;
    font-size: 13px;
}

.scroll-up-btn-community {
    top: 110px;
}

.scroll-up-btn-no-menu {
    top: 45px;
}


/* interaction */

.interactions-wrapper {
    height: 42px;
    width: 100%;
    background-color: white;
}

.interactions {
    height: 42px;
    width: 100%;
    background-color: white;
    z-index: 40;
}

.post-pinned .interactions {
    background-color: transparent;
}

.interactions-fixed-signed-in {
    position: fixed;
    bottom: 62px;
}

.interactions-fixed-signed-out {
    position: fixed;
    bottom: 0;
}

.interactions > .container {
    padding: 0 10px;
}

.interactions > .container > .row {
    border-top: 1px solid #8080801f;
}

.interactions > .container > .row > .container {
    display: table;
    width: 100%;
}

.interactions > .container > .row > .container > .vote {
    float: left;
    width: 33%;
    padding-top: 5px;
}

.interactions > .container > .row > .container > .vote .container {
    margin: auto;
    display: table;
}

.interactions > .container > .row > .container > .vote .thumbs-box-left {
    height: 25px;
    padding-top: 6px;
    width: 31px;
    float: left;
    text-align: center;
    cursor: pointer;
    border-radius: 10px;
}


.interactions > .container > .row > .container > .vote .thumbs-box-right {
    height: 23px;
    padding-top: 8px;
    width: 31px;
    float: left;
    text-align: center;
    cursor: pointer;
    border-radius: 10px;
}



.interactions > .container > .row > .container > .vote .thumbs-box-left > .fa-thumbs-up {
    color: #988b9e;
    font-size: 15px;
}

.interactions > .container > .row > .container > .vote .thumbs-box-right > .fa-thumbs-down {
    color: #988b9e;
    font-size: 15px;
}

.interactions > .container > .row > .container > .vote .voted-thumb i {
    color: #ff9f9f !important;
    font-size: 15px;
}

.interactions > .container > .row > .container > .vote span {
    color: #988b9e;
    font-weight: 500;
    font-size: 15px;
    margin: 0 0px;
    float: left;
    height: 30px;
    padding-top: 6px;
}



.interactions > .container > .row > .container > .vote > .voted {
    color: #ff9f9f;
}

.interactions > .container > .row > .container > .vote-disabled > .thumbs-box-left,
.interactions > .container > .row > .container > .vote-disabled > .thumbs-box-right {
    color: #dbdbdb;
}

.interactions > .container > .row > .container > .vote-disabled > .thumbs-box-left i,
.interactions > .container > .row > .container > .vote-disabled > .thumbs-box-right i {
    color: #dbdbdb;
}


.interactions > .container > .row > .container > .post-comment-feed,
.interactions > .container > .row > .container > .post-comment {
    float: left;
    width: 36%;
    text-align: center;
    height: 31px;
    padding-top: 5px;
    cursor: pointer;
}

.interactions > .container > .row > .container .post-comment-feed-btn,
.interactions > .container > .row > .container .post-comment-btn {
    padding: 6px 5px;
    border-radius: 10px;
}

.interactions > .container > .row > .container > .post-comment-feed i,
.interactions > .container > .row > .container > .post-comment i {
    color: #988b9e;
    margin-right: 3px;
    font-size: 16px;
}

.interactions > .container > .row > .container > .post-comment-feed .comment-count,
.interactions > .container > .row > .container > .post-comment .comment-count {
    color: #988b9e;
    font-weight: 500;
    font-size: 15px;
}

.interactions > .container > .row > .container > .comment-disabled .comment-count {
    color: #dbdbdb;
    font-weight: 500;
    font-size: 15px;
}

.interactions > .container > .row > .container > .comment-disabled i {
    color: #dbdbdb;
    margin-right: 3px;
    font-size: 16px;
}

.interactions > .container > .row > .container > .inactive-comment-btn i,
.interactions > .container > .row > .container > .inactive-comment-btn .comment-count {
    color: lightgray;
}


.interactions > .container > .row > .container > .share {
    float: left;
    width: 31%;
    text-align: center;
    padding-top: 5px;
    cursor: pointer;
}

.interactions > .container > .row > .container > .share .share-btn {
    padding: 6px 0;
    border-radius: 10px;
}

.interactions > .container > .row > .container > .share i {
    color: #988b9e;
    margin-right: 3px;
    font-size: 16px;
}

.interactions > .container > .row > .container > .share span {
    color: #988b9e;
    font-weight: 500;
    font-size: 15px;
}

.interactions > .container > .row > .container > .vote-disabled .thumbs-box-left .fa-thumbs-up,
.interactions > .container > .row > .container > .vote-disabled .thumbs-box-right .fa-thumbs-down,
.interactions > .container > .row > .container > .vote-disabled span {
    color: lightgray;
    font-size: 15px;
}

.featured-comment {
    padding: 0 10px 15px 10px;
}

.featured-comment .comments {
    border-top: 1px solid #8080801f;
    padding: 15px 2px 0 2px;
}

.featured-comment .comments .new-comment-container  {
    margin-bottom: 15px;
    display: none;
}

.featured-comment .comment-container {
    display: flex;
}

.featured-comment .comment-container .user-profile {
    width: 30px;
    height: 30px;
    position: relative;
}

.featured-comment .comment-container .user-profile img {
    width: 30px;
    height: 30px;
    background-color: #e6eaeb;
    border-radius: 50%;
    border: 1px solid #e1e1e1;
    object-fit: cover;
}

.featured-comment .comment-container .user-profile .badge,
.featured-comment .create-comment .user-profile .badge {
    position: absolute;
    left: 18px;
    top: 18px;
    background-color: #676767;
    border-radius: 50%;
    width: 15px;
    height: 15px;
    border: 2px solid white;
    text-align: center;
    display: flex;
}

.featured-comment .create-comment .user-profile .badge {
    left: 19px;
    top: 34px;
}

.featured-comment .comment-container .user-profile .brand,
.featured-comment .create-comment .user-profile .brand {
    background-color: #676767;
}

.featured-comment .comment-container .user-profile .badge .fa-check,
.featured-comment .create-comment .user-profile .badge .fa-check {
    color: white;
    font-size: 9px;
    margin-top: 3px;
    margin-left: 3px;
}

.featured-comment .comment-container .user-profile .admin,
.featured-comment .create-comment .user-profile .admin {
    background-color: #ff9e9e;
}

.featured-comment .comment-container .user-profile .badge .fa-star,
.featured-comment .create-comment .user-profile .badge .fa-star {    
    color: white;
    font-size: 8px;
    margin-top: 3px;
    margin-left: 3px;
}

.featured-comment .comment-container .user-profile .ambassador,
.featured-comment .create-comment .user-profile .ambassador {
    background-color: #ff9800;
}

.featured-comment .comment-container .user-profile .badge .fa-crown,
.featured-comment .create-comment .user-profile .badge .fa-crown {
    color: white;
    font-size: 7px;
    margin-top: 4px;
    margin-left: 3px;
}

.featured-comment .comment-container .user-profile .employee,
.featured-comment .create-comment .user-profile .employee {
    background-color: #676767;
}


.featured-comment .comment-container .comment {
    padding: 0;
    padding-left: 10px;
    display: flex;
    align-items: center;
}

.featured-comment .comment-container .comment span {
    font-size: 14px;
    line-height: 16px;
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 6;
    -webkit-box-orient: vertical;
}

.featured-comment .create-comment {
    display: flex;
    padding: 15px 2px 0 2px;
    position: relative;
}

.featured-comment .create-comment .user-profile {
    width: 30px;
}

.featured-comment .create-comment .user-profile img {
    width: 30px;
    height: 30px;
    background-color: #e6eaeb;
    border-radius: 50%;
    border: 1px solid #e1e1e1;
    object-fit: cover;
}

.featured-comment .create-comment .comment-btn-col {
    margin-left: 10px;
    width: 100%;
}

.featured-comment .create-comment .comment-btn-col .comment-btn {
    background-color: #f0eef3;
    color: #8d7399;
    padding: 8px 15px 8px 15px;
    border-radius: 10px;
    font-size: 15px;
    display: block;
    cursor: pointer;
}

.featured-comment .create-comment .comment-btn-col .comment-btn i {
    color: #8d7399;
    float: left;
    margin: 1px 6px 0 0;
    font-size: 15px;
}

.first-new-comment-container {
    
}

.promote-post {
    padding: 5px 15px 15px 15px;
    text-align: right;
    background-color: #ffffff;
}

.promote-post .btn-md-promote {
    color: #ffffff;
    border: 1px solid #ffffff;
    background: linear-gradient(111deg, #2d1974 0%, #cd8aed 100%);
    margin-bottom: 0px;
    font-size: 15px;
}

.promote-post .btn-md-promote i {
    color: #ffffff;
    font-size: 14px;
    margin-top: 2px;
    float: right;
    margin-left: 6px;
}

.promote-section {
    margin-top: 7px;
}

.promote-section-error-msg {
    margin-bottom: 25px;
}

.promote-section > .title {
    background-color: white;
    padding: 15px 15px 12px 15px;
}

.promote-section > .title > i {
    color: #FF9F9F;
    float: left;
    margin: 1px 10px 0 8px;
}

.promote-section > .title > span {
    color: #FF9F9F;
    font-weight: 500;
}

.promote-section > .hr-container {
    padding: 0 15px;
    background-color: white;
}

.promote-section > .hr-container .hr {
    border-top: 1px solid #80808057;
}

.promote-section > .content {
    padding: 15px;
    background-color: white;
}

.promote-section > .content .option {
    margin-bottom: 15px;
}

.promote-section > .content .option .option-col-1 {
    float: left;
    width: 35px;
    height: 35px;
}

.promote-section > .content .option .option-col-1 .selection {
    width: 22px;
    height: 22px;
    border: 2px solid #898B90;
    border-radius: 50%;
    margin: auto;
    margin-top: 6px;
}

.promote-section > .content .option .option-col-1 .disabled, .promote-section > .content .option .option-col-1-multiple .disabled {
    border: 2px solid lightgray;
}

.promote-section > .content .option .option-col-1 .active {
    background-color: white;
    border: 2px solid #FF9F9F;
}

.promote-section > .content .option .option-col-1 .selection .active-inner {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    margin: 5px;
    background-color: #FF9F9F;
}

.promote-section > .content .option .option-col-2, .promote-section > .content .option .option-col-2-multiple  {
    padding-left: 45px;
}

.promote-section > .content .option .option-col-2 .title-description, .promote-section > .content .option .option-col-2-multiple .title-description {
    font-weight: 500;
    display: block;
}

.promote-section > .content .option .option-col-2 .description, .promote-section > .content .option .option-col-2-multiple .description {
    font-size: 13px;
    color: #727272;
    display: block;
}

.promote-section > .content .option .option-col-2-single {
    padding-top: 9px;
}

.promote-section > .content .option .option-col-2 .title-description-biu-segment, .promote-section > .content .option .option-col-2-multiple .title-description-biu-segment {
    display: table;
}

.promote-section > .content .option .option-col-2 .title-description-biu-segment .title, .promote-section > .content .option .option-col-2-multiple .title-description-biu-segment .title {
    font-weight: 900;
    color: #ff9e9e;
    float: left;
}

.promote-section > .content .option .option-col-2 .title-description-biu-segment .number, .promote-section > .content .option .option-col-2-multiple .title-description-biu-segment .number {
    background-color: #ff9e9e;
    color: white;
    padding: 1px 5px;
    font-size: 12px;
    border-radius: 5px;
    float: left;
    margin: 2px 0 0 5px;
}

.promote-section > .content .option .option-col-2 .text-disabled, .promote-section > .content .option .option-col-2-multiple .text-disabled, .textarea-disabled {
    color: lightgray !important;
}

.promote-section > .content .option .option-col-2-multiple .number-disabled {
    background-color: lightgray !important;
}

.promote-section .content .input {
    margin-bottom: 0;
    margin-top: 20px;
}

.promote-section .content .input .container {
    position: relative;
    border: 1px solid #bebebe;
    border-radius: 5px;
    padding-right: 10px;
}

.blocked-user-section .content .input .container {
    padding-right: 0;
    border: none;
}

.promote-section .content .input .container .title {
    display: block;
    position: absolute;
    top: 4px;
    left: 10px;
}

.promote-section .content .input .container .title .field {
    font-weight: 900;
    font-size: 14px;
    color: #a4a4a4;
}

.promote-section .content .input .container .title .field > i {
    color: #a4a4a4;
    font-size: 12px;
}

.promote-section .content .input .container .title .error {
    font-size: 12px;
    color: red;
    display: inline-block;
    margin-left: 3px;
}

.promote-section .content .input .container #question_title {

}

.promote-section .content-center {
    text-align: center;
}

.promote-section .content .text-lg {
    display: block;
    color: #FF9F9F;
    font-size: 22px;
    margin-bottom: 12px;
    font-weight: 500;
}

.promote-section .content .title-1 {
    display: block;
    margin-bottom: 5px;
}

.promote-section .content .promo-starts {
    color: #727272;
}

.promote-section-last {
    margin-bottom: 120px;
}

.promote-footer {
    position: fixed;
    bottom: 0;
    background-color: white;
    border-top: 1px solid #e7e7e7;
    width: 100%;
    z-index: 5;
}

.promote-footer .container {
    padding: 10px 15px 25px 15px;
}

.promote-footer .send-btn {
    margin-bottom: 5px;
}

.promote-footer .error {
    display: none;
}

.promote-footer .disclaimer {

}

.promote-footer .disclaimer span {
    font-size: 13px;
    color: gray;
}

.promote-footer .disclaimer a {
    font-size: 13px;
    color: gray;
    text-decoration: underline;
}

.promote-footer .no-credits {
    font-weight: 900;
    color: #FF5072;
}

.promote-results-box {
    background-color: white;
    padding: 15px 25px 15px 25px;
}

.promote-results-box .date-range {
    font-size: 14px;
    color: gray;
    margin-bottom: 20px;
    display: block;
}

.promote-results-box .text-lg {
    display: block;
    text-align: center;
    color: #FF9F9F;
    font-size: 22px;
    font-weight: 500;
    margin-bottom: 7px;
}

.promote-results-box .text-lg-subtitle {
    text-align: center;
    display: block;
    font-weight: 500;
    margin-bottom: 25px;
}

.promote-results-box .results-table {

}

.promote-results-box .results-table table {
    width: 100%;
}

.promote-results-box .results-table table tr {

}

.promote-results-box .results-table table tr td:first-child {
    font-size: 14px;
    color: gray;
    width: 80px;
    padding-bottom: 12px;
}

.promote-results-box .results-table table tr td:last-child {
    text-align: right;
    color: gray;
    font-size: 14px;
    font-weight: 500;
    width: 100px;
}

.promote-section-box {
    background-color: white;
    padding: 25px 15px 0 15px;
}

.promote-section-box .container {
    border-bottom: 1px solid #80808057;
    padding-bottom: 25px;
}

.promote-section-box .container > .title {
    display: table;
    width: 100%;
    margin-bottom: 5px;
}

.promote-section-box .container > .title i {
    color: #FF9F9F;
    float: left;
    margin: 1px 10px 0 8px;
}

.promote-section-box .container > .title span {
    float: left;
    color: #FF9F9F;
    font-weight: 500;
}

.promote-section-box .container > .title .circle {
    float: left;
    height: 18px;
    width: 18px;
    border-radius: 50%;
    margin-right: 8px;
    margin-left: 8px;
}

.promote-section-box .container > .title .pending {
    background-color: #FFC107;
}

.promote-section-box .container > .title .active {
    background-color: green;
}

.promote-section-box .container > .title .finished {
    background-color: gray;
}

.promote-section-box .container > .title .not-approved {
    background-color: #ff5171;
}

.promote-section-box .container > .title .paused {
    background-color: #FFC107;
}

.promote-section-box .info {
    padding-left: 35px;
}

.promote-section-box .info .segment-box {
    margin-bottom: 15px;
}

.promote-section-box .info .title {
    font-weight: 500;
    display: block;
}

.promote-section-box .info .title i {
    font-size: 12px;
    color: #FF9F9F;
}

.promote-section-box .info .description {
    font-size: 13px;
    color: #727272;
    display: block;
}

.promote-section-box .info .action-btn {
    color: #FF5072;
    border: 1px solid #FF5072;
    background-color: white;
    padding: 4px 15px;
    border-radius: 15px;
    float: none;
    font-size: 14px;
    font-weight: 500;
    margin: 5px 0 8px 0;
    display: inline-block;
}

.promote-section > .content .footer {
    font-size: 13px;
    color: #727272;
    display: block;
    margin-top: 10px;
}

.edit-promoted-campaign {
    text-align: center;
    padding: 20px 15px;
    background-color: white;
}

.promote-section > .content .select-title {
    font-weight: 500;
    display: block;
    margin-bottom: 15px;
    margin-top: 10px;
}

.promote-section > .content select {
    outline: none;
    border: 1px solid #bebebe;
    border-radius: 5px;
    padding: 12px;
    font-size: 16px;
    text-align: right;
    margin-bottom: 15px;
    background-color: white;
}

.blocked-user-section > .content select {
    width: 100%;
    margin-bottom: 0;
    margin-top: 0;
    padding-top: 30px;
}

.promote-section #promo_start_date_3i, .promote-section #promo_end_date_3i {
    width: 20%;
    margin-right: 5px;
}

.promote-section #promo_start_date_2i, .promote-section #promo_end_date_2i {
    width: 48%;
    margin-right: 5px;
}

.promote-section #promo_start_date_1i, .promote-section #promo_end_date_1i {
    width: 25%;
}

.promote-section .select-date-error {
    border: 1px solid red !important;
    background-color: #fff7f7;
}

.promote-section .end-date-error {
    color: red;
    font-size: 14px;
    margin-top: -10px;
    display: block;
}

.promote-section .select-title-error {
    color: red
}

.promote-section #promo_discount_percent {
    margin-top: 10px;
}

.promote-section .promo-section-about-img {
    width: 100%;
    border-radius: 15px;
    margin-bottom: 15px;
}

.promote-section-question {
    margin-bottom: 15px;
    display: block;
}

.promote-section .promo-image-preview {
    height: 220px;
    overflow: hidden;
    border-radius: 15px;
    border: 1px solid #eeeeee;
    display: none;
}

.promote-section .promo-image-preview img {
    width: 100%;
}

.promote-section .promo-featured-image-preview {
    overflow: hidden;
    border-radius: 15px;
    border: 1px solid #eeeeee;
    display: none;
}

.promote-section .promo-featured-image-preview img {
    width: 100%;
}

.promote-section .promote-products-list, .promote-section-box .promote-products-list {
    display: block;
}

.promote-section #list-of-products .option-col-1, .option-col-1-multiple {
    float: left;
    width: 35px;
    height: 35px;
    margin-top: 12px;
}

.option-col-1-multiple-no-margin-top {
    margin-top: 0;
}

.promote-section #list-of-products .option-col-1 .selection, .option-col-1-multiple .selection {
    width: 22px;
    height: 22px;
    border: 2px solid #898B90;
    border-radius: 6px;
    margin: auto;
    margin-top: 6px;
}

.promote-section #list-of-products .option-col-1 .active, .option-col-1-multiple .active {
    background-color: white;
    border: 2px solid #FF9F9F;
}

.promote-section #list-of-products .option-col-1 .active .active-inner, .option-col-1-multiple .active .active-inner {
    width: 12px;
    height: 12px;
    border-radius: 2px;
    margin: 5px;
    background-color: #FF9F9F;
}

.promote-section .promote-product {
    padding-left: 30px;
}

#promo-upload-featured-image {
    display: none;
    padding-top: 10px;
}

.promo-status {
    background-color: #ff5171;
    padding: 15px 15px 15px 15px;
}

.promo-status-inactive {
    background-color: #ff5171;
}

.promo-status-active {
    background-color: #4caf50;
}

.promo-status-pending-review {
    background-color: #FFC107;
}

.promo-status .info {
    padding-left: 24px;
}

.promo-status .title {
    font-weight: 900;
    color: white;
    display: block;
}

.promo-status .description {
    display: block;
    color: white;
    font-size: 14px;
}

.promo-status a {
    display: block;
    color: white;
    font-size: 14px;
    text-decoration: underline;
}

.promo-status i {
    color: white;
    float: left;
    margin-right: 8px;
    margin-top: 3px;
}

.promo-show-preview {
    margin-top: 15px;
}

.promo-show-preview img {
    width: 100%;
    border-radius: 15px;
}

.promos-hero {
    padding-top: 5px;
    background-color: white;
}

.promos-biutienda-hero {
    padding: 5px 0 5px 0;
    background-color: transparent;
}

.promos-hero .cards {
    padding-left: 15px;
    height: 282px;
    overflow: auto;
    white-space: nowrap;
    -webkit-overflow-scrolling: touch;
    overflow-y: hidden;
    overflow-x: scroll;
}

.promos-hero .cards .placeholder {

}

.promos-hero .cards .placeholder .card {
    height: 280px;
    width: 230px;
    background-color: lightgray;
    border-radius: 15px;
    margin-right: 15px;
    display: inline-block;
}

.promos-hero .cards .featured-promos-carousel {
    display: none;
}

.promos-hero .card {
    height: 280px;
    width: 230px;
    background: linear-gradient(111deg, #ffecec 0%, #ffe9e9 100%);
    display: inline-block;
    margin-right: 7px;
    position: relative;
    border-radius: 15px;
    overflow: hidden;
    cursor: pointer;
    border: 1px solid #dfdfdf;
}

.promos-hero .card-exclusive {
    background-color: #d5d5d5;
}

.promos-hero .card .bg {
    width: 100%;
    border-radius: 0;
}

.promos-hero .card .brand {
    border-radius: 50%;
    width: 60px;
    position: absolute;
    top: 10px;
    right: 10px;
}

.promos-hero .card .text {
    position: absolute;
    left: 0;
    bottom: 15px;
    width: 200px;
    padding: 0 15px;
    white-space: initial;
}

.promos-hero .card .text .store {
    color: #0C057E;
    font-weight: 900;
    line-height: 24px;
    margin-bottom: 0px;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    font-family: "Space Mono", monospace;
    text-transform: uppercase;
    font-size: 14px;
}

.promos-hero .card .text .biustore {
    font-family: 'Roboto', sans-serif;
    text-transform: initial;
    font-size: 17px;
}

.promos-hero .card .text .exclusive {
    color: #ffc007;
    font-weight: 900;
    margin-bottom: 0px;
    font-size: 14px;
}

.promos-hero .card .text .exclusive i {
    color: #ffc007;
    font-size: 13px;
    float: left;
    margin: 3px 5px 0 0;
}

.promos-hero .card .text .title {
    font-size: 22px;
    display: block;
    color: #0C057E;
    font-weight: 900;
    line-height: 24px;
    margin-bottom: 5px;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.promos-hero .card .text .subtitle {
    font-size: 14px;
    display: block;
    color: #0C057E;
    font-weight: 500;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    margin-bottom: 0px;
    line-height: 16px;
}

.promos-hero .card-loader {
    background-color: white;
    position: absolute;
    padding-top: 100px;
    height: 178px;
    padding-left: 30px;
    width: 100px;
}


/* slide comments modal */

.post .body .article {
    padding: 10px 15px 15px 15px;
}

.slide-full-modal-comments {
    background-color: #FFE7E0 !important;
}

.back-ribbon {
    background-color: white;
    margin-bottom: 7px;
}

.back-ribbon .article > button {
    width: 50px;
    float: left;
    height: 87px;
    text-align: center;
}

.back-ribbon .article > button i {
    color: #B7B7B7;
    font-size: 24px;
}

.back-ribbon .article .content {
    display: table;
    padding: 15px 15px 15px 0;
}

.back-ribbon .article .content button {
    float: left;
}

.back-ribbon .article .content button img {
    height: 53px;
    border-radius: 8px;
    margin-right: 10px;
    width: 61px;
    background-color: #fcf5f3;
}

.back-ribbon .article .content span {
    font-weight: 900;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}

.end-of-content-wh {
    background-color: white;
    padding: 0px 0 15px 0;
    display: none;
    height: 120px;
    text-align: center;
    width: 100%;
}

.end-of-content-wh span {
    color: #f8d0c3;
    display: block;
    font-size: 28px;
    font-style: italic;
    margin-bottom: 5px;
}

.end-of-content-wh button {
    color: #f8d0c3;
    font-size: 20px;
    font-style: italic;
}

.end-of-content {
    background-color: #f0eef3;
    padding: 15px 0 15px 0;
    display: none;
    height: 120px;
    text-align: center;
    width: 100%;
}

.end-of-content span {
    color: #98a5aa;
    display: block;
    font-size: 28px;
    font-style: italic;
    margin-bottom: 5px;
}

.end-of-content button {
    color: #c3a8a0;
    font-size: 20px;
    font-style: italic;
}


/* products */

.products-bg {
    background-color: white;
    display: block;
    min-height: 250px;
    padding: 15px;
}

.products-bg .products-box {
    display: table;
    width: 100%;
}

.products-bg .products-box .product {
    width: 50%;
    float: left;
    padding-bottom: 35px;
}

.products-bg .products-box .product:nth-child(2n+1) > .container {
    padding-right: 7px;
}

.products-bg .products-box .product:nth-child(2n+2) > .container {
    padding-left: 7px;
}

.products-bg .products-box .product:nth-child(2n+1) {
    clear: left;
}

.product-carousel {
    display: flex;
    flex-wrap: nowrap;
    overflow: auto;
    padding: 0 15px;
    -webkit-overflow-scrolling: touch;
    overflow-y: hidden;
    margin-bottom: 10px;
}

.products-bg .products-box .product a {

}

.product-carousel .product {
    width: 152px;
    float: left;
    text-align: center;
    flex: 0 0 auto;
    margin-right: 10px;
    position: relative;
}

.products-bg .products-box .product .image {
    background-color: #f6f6f6;
    border-radius: 10px;
    margin-bottom: 5px;
    background-image: url("<%= asset_path 'icons/product-placeholder.png' %>");
    background-size: cover;
    background-position: center;
    margin: auto;
    border-radius: 10px;
    position: relative;
    display: none;
}

.products-bg .products-box .product .image-versions .image {
    display: none;
}

.products-bg .products-box .product .image-versions > .active {
    display: block;
}

.products-bg .products-box .product .image .collection-menu {
    position: absolute;
    top: 5px;
    right: 5px;
}

.products-bg .products-box .product .image .menu-btn {
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.products-bg .products-box .product .image .menu-btn i {
    color: #d3cdd5cc;
    font-size: 18px;
    -webkit-text-stroke: 2px white;
}

.product-carousel .product .image {
    width: 150px;
    height: 150px;
    background-image: url("<%= asset_path 'icons/product-placeholder.png' %>");
    background-size: cover;
    background-position: center;
    margin: auto;
    border-radius: 8px;
    border: 1px solid #f0eef3;
    position: relative;
}

.product-carousel .product .image .remove {
    position: absolute;
    bottom: 10px;
    right: 10px;
}

.product-carousel .product .image .remove .remove-btn {
    border: 1px solid #ff9d9e;
    border-radius: 10px;
    width: 30px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: white;
}

.product-carousel .product .image .remove .remove-btn i {
    color: #ff9e9f;
}

.product-carousel .product .image-vertical {
    height: 195px;
}

.product-carousel .product .image .discount-bubble {
    padding: 7px;
    background: linear-gradient(111deg, #2d1974 0%, #cd8aed 100%);
    position: absolute;
    border-radius: 10px;
    margin-top: 15px;
    margin-left: -8px;
    display: flex;
    flex-direction: column;
}

.product-carousel .product .image .discount-bubble .discount {
    font-weight: 900;
    color: white;
}

.product-carousel .product .image .discount-bubble-shipping {
    padding: 7px 12px;
    background: linear-gradient(111deg, #467f46 0%, #8ede8e 100%);
    position: absolute;
    border-radius: 10px;
    margin-top: 15px;
    margin-left: -8px;
    display: flex;
    flex-direction: column;
}

.product-carousel .product .image .discount-bubble-shipping .discount {
    font-weight: 900;
    color: white;
}

.product-carousel .product .image .discount-bubble-shipping .min-order {
    font-weight: 900;
    color: white;
}

.product-carousel .product .image .discount-bubble-stacked {
    margin-top: 55px;
}

.products-in-biutienda {
    text-align: center;
    background: #f8eeeb;
    background: linear-gradient(180deg, #e9c6f8 0%, #ffffff 69%, #ffffff 100%);
    padding: 15px 15px 0 15px;
}

.products-bg .products-box .product .image .discount-bubble {
    padding: 7px;
    background: linear-gradient(111deg, #2d1974 0%, #cd8aed 100%);
    position: absolute;
    border-radius: 10px;
    margin-top: 15px;
    margin-left: -8px;
}

.products-bg .products-box .product .image .discount-bubble .discount {
    font-weight: 900;
    color: white;
}

.products-bg .products-box .product .image .discount-bubble-shipping {
    padding: 7px 12px;
    background: linear-gradient(111deg, #467f46 0%, #8ede8e 100%);
    position: absolute;
    border-radius: 10px;
    margin-top: 15px;
    margin-left: -8px;
}

.products-bg .products-box .product .image .discount-bubble-shipping .discount {
    font-weight: 900;
    color: white;
}

.products-bg .products-box .product .image .discount-bubble-shipping .min-order {
    font-weight: 900;
    color: white;
}

.products-bg .products-box .product .image .discount-bubble-stacked {
    margin-top: 55px;
}

.products-bg .products-box .product .image img, .product-carousel .product .image .img {
    width: 100%;
    object-fit: cover;
    border: 1px solid #f0eef3;
    border-radius: 10px;
}

.product-carousel .product .image .img {
    width: 150px;
    height: 150px;
    object-fit: cover;
}

.product-carousel .product .image .img-vertical {
    width: 150px;
    height: 195px;
    object-fit: cover;
    border-radius: 8px;
}

.product-carousel .product .image .img {
    margin-bottom: -4px;
}

.products-bg .products-box .product .product-placeholder, .product-carousel .product .product-placeholder {
    width: 100%;
    border-radius: 10px;
}

.product-carousel .product .info {
    padding: 8px 5px 5px 0px;
    border-bottom-left-radius: 15px;
    border-bottom-right-radius: 15px;
    height: 120px;
    text-align: left;
}

.products-bg .products-box .product .info {
    margin-top: 10px;
}

.products-bg .products-box .product .brand, .product-carousel .product .brand {
    color: #6D6D6D;
    display: block;
    font-weight: 500;
    font-size: 14px;
    margin-bottom: 3px;
}

.products-bg .products-box .product .name, .product-carousel .product .name {
    color: #6D6D6D;
    font-size: 16px;
    display: block;
    line-height: 18px;
    font-weight: 200;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.product-carousel .product .container .info .version {
    background-color: #fff1ec;
    border: 1px solid #ffd1d1;
    padding: 1px 11px;
    border-radius: 15px;
    display: inline-flex;
    margin-top: 3px;
}

.product-carousel .product .container .info .version span {
    color: #FFA3A3;
    margin: 3px 0 2px 0;
    display: block;
    font-size: 13px;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.products-bg .products-box .product .products {
    color: #A3A3A3;
    font-size: 14px;
    margin-top: 1px;
}


.product-carousel .product .info .price {
    display: flex;
    flex-direction: column;
    margin-top: 5px;
}

.product-carousel .product .info .products {
    color: #A3A3A3;
    font-size: 13px;
    margin-top: 1px;
}

.product-carousel .product .info .price .final {
    display: flex;
    margin-top: 2px;
    justify-content: space-around;
    flex-direction: column;
}

.product-carousel .product .info .price .list-price {
    color: #b3b3b3;
    font-size: 13px;
    font-weight: 500;
    display: block;
    margin-top: 5px;
    text-decoration: line-through;
}

.product-carousel .product .info .price .final-price {
    color: #6D6D6D;
    font-size: 13px;
    font-weight: 900;
    display: block;
}

.product-carousel .product .info .price .final .final-price-discount {
    color: #ff9e9e;
}

.product-carousel .product .info .price .final .stock-info {
    margin: 4px 0 0 0px;
    text-align: left;
}

.product-carousel .product .info .price .final .stock-info .text {
    font-size: 11px;
    font-weight: 500;
    color: white;
    background-color: #fe9e9e;
    padding: 3px 7px;
    border-radius: 10px;
    display: inline-block;
}

.products-bg .products-box .product .not-available,
.product-carousel .product .info .not-available,
.collection-items .collection-item .container .info .not-available {
    font-size: 12px;
    font-weight: 500;
    color: #b4afbd;
    background-color: #f0eef3;
    padding: 3px 7px;
    border-radius: 10px;
    display: inline-block;
    margin-top: 8px;
}

.products-bg .products-box .product .versions {
    display: flex;
    margin-top: 10px;
    flex-wrap: wrap;
}

.products-bg .products-box .product .versions .version {
    background-color: #ffffff;
    border: 1px solid #c2c0c3;
    padding: 1px 10px;
    border-radius: 10px;
    color: #707070;
    font-size: 12px;
    margin: 0 3px 5px 0;
    cursor: pointer;
}

.products-bg .products-box .product .versions .version:hover {
    background-color: #f3f3f3;
}

.products-bg .products-box .product .versions .active {
    border: 1px solid #ff9d9e;
    background-color: #ff9e9e;
    color: white;
}

.products-bg .products-box .product .versions .active:hover {
    background-color: #ff9e9e;
}

.products-bg .products-box .product .info-versions {

}

.products-bg .products-box .product .info-versions .info-version {
    display: none;
}

.products-bg .products-box .product .info-versions > .active {
    display: block;
}

.products-bg .products-box .product .add-to-cart {
    background: linear-gradient(111deg, #2d1974 0%, #cd8aed 100%);
    display: flex;
    justify-content: space-between;
    padding: 0 15px;
    border-radius: 10px;
    border: 1px solid white;
    margin-top: 10px;
    align-items: center;
    min-height: 40px;
    margin-bottom: 15px;
    cursor: pointer;
}

.products-bg .products-box .product .add-to-cart:hover {
    background: linear-gradient(111deg, #2d1974 0%, #a459c8 100%);
}

.products-bg .products-box .product .add-to-cart .left {

}

.products-bg .products-box .product .add-to-cart .left .mobile {
    font-size: 14px;
    color: white;
    font-weight: 500;    
}

.products-bg .products-box .product .add-to-cart .left i {
    font-size: 12px;
    color: white;
}

.products-bg .products-box .product .add-to-cart .left .desktop {
    display: none;
}

.products-bg .products-box .product .add-to-cart .right {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
}

.products-bg .products-box .product .add-to-cart .right .final {
    font-size: 13px;
    font-weight: 900;
    display: block;
    color: white;
}

.products-bg .products-box .product .add-to-cart .right .discount {
    text-decoration: line-through;
    font-size: 12px;
    font-weight: 500;
    display: block;
    color: #e9ccfc;
}

.products-bg .products-box .product .out-of-stock {
    border: 1px solid #e1dfe5;
    background: #fcfbfd;
    cursor: initial;
}

.products-bg .products-box .product .out-of-stock:hover {
    background: #fcfbfd;
}

.products-bg .products-box .product .out-of-stock .left {
    font-size: 14px;
}

.products-bg .products-box .product .out-of-stock .left,
.products-bg .products-box .product .out-of-stock .left i,
.products-bg .products-box .product .out-of-stock .right .final {
    color: #c2bbcd;
}

.products-bg .products-box .product .out-of-stock .right .discount {
    color: #c6c6c6;
}

.product-carousel .product .name {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.product-carousel .product-more {
    border-radius: 15px;
    overflow: hidden;
    width: 121px;
    height: 268px;
    flex: 0 0 auto;
    margin-right: 30px;
    position: relative;
    text-align: center;
    padding: 15px;
    border: 1px solid #ff9e9e;
}

.product-carousel .product-more span {
    color: #ff9e9e;
    margin-top: 105px;
    display: block;
}

.product-carousel .product-more i {
    color: #ff9e9e;
    font-size: 22px;
    margin-top: 10px;
}


.products-bg .products-box .product .info .price {
    display: flex;
    flex-direction: column;
    margin-top: 3px;
}

.products-bg .products-box .product .info .price .final {
    display: flex;
    margin-top: 2px;
}

.products-bg .products-box .product .info .price .list-price {
    color: #b3b3b3;
    font-size: 13px;
    font-weight: 500;
    display: block;
    margin-top: 0;
    text-decoration: line-through;
}

.products-bg .products-box .product .info .price .final-price {
    color: #6D6D6D;
    font-size: 13px;
    font-weight: 900;
    display: block;
}

.products-bg .products-box .product .info .price .final .final-price-discount {
    color: #ff9e9e;
}

.products-bg .products-box .product .info .price .final .stock-info {
    display: flex;
    margin: -2px 0 0 8px;
}

.products-bg .products-box .product .info .price .final .stock-info .text {
    font-size: 11px;
    font-weight: 500;
    color: white;
    background-color: #f44336;
    padding: 3px 7px;
    border-radius: 10px;
}

.products-bg .products-box .product .info .no-stock {
    font-size: 12px;
    font-weight: 500;
    color: white;
    background-color: #f44336;
    padding: 3px 7px;
    border-radius: 10px;
    display: inline-block;
    margin-top: 5px;
}

.custom-collections-cards {
    padding: 0 15px 0px 15px;
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
}

.custom-collections-cards .collection {
    width: 50%;
}

.custom-collections-cards .collection:nth-child(2n+1) .card {
    margin-right: 7px;
}

.custom-collections-cards .collection:nth-child(2n+2) .card {
    margin-left: 7px;
}

.custom-collections-cards .collection .card {
    background-color: #f0eef3;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    padding: 15px;
    border-radius: 8px;
    border: 1px solid #f0eef3;
    min-height: 220px;
    margin-bottom: 15px;
}

.custom-collections-cards .collection .title {
    font-size: 18px;
    color: #432985;
    display: block;
    margin-bottom: 10px;
}

.custom-collections-cards .collection .subtitle {
    color: #747474;
    font-size: 14px;
    display: -webkit-box;
    -webkit-line-clamp: 9;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.custom-collections-cards .collection .products {
    color: #ffffff;
    font-size: 14px;
    display: inline-block;
    background-color: #ff9e9e;
    padding: 2px 7px;
    border-radius: 4px;
    margin-top: 8px;
}


/* full screen modal */

.modal-bg-dark,
.modal-bg-dark-bottom-menu-modal-post {
    background-color: #0000006b;
    height: 100vh;
    width: 100vw;
    position: fixed;
    z-index: 60;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    display: none;
}

.modal-bg-dark-overlay {
    background-color: #0000006b;
    height: 100vh;
    width: 100vw;
    position: fixed;
    z-index: 100;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    display: none;
}

.full-screen-modal {
    width: 100%;
    height: 100vh;
    position: fixed;
    bottom: 0;
    top: 0;
    overflow-y: scroll;
    overflow-x: hidden;
    z-index: 62;
    animation-duration: 600ms;
    display: none;
}

.full-screen-modal > .container {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    top: 12px;
    padding: 5px 0 10px 0;
}

.full-screen-modal > .container-android {
    padding: 0;
}

.full-screen-modal .container .relative {
    position: relative;
    border-radius: 15px;
    overflow: hidden;
}

.full-screen-modal .container .relative > .bg {
    background-color: white;
    border-radius: 15px;
    overflow-y: scroll;
}


.full-screen-modal .container .btn-a .container {
    padding: 10px;
    background-color: white;
    overflow: hidden;
    border-bottom-right-radius: 15px;
    border-bottom-left-radius: 15px;
}

.full-screen-modal .container .relative .bg .content {
    text-align: left;
}

.full-screen-modal .container .btn-a {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: white;
    height: 67px;
    border-bottom-right-radius: 15px;
    border-bottom-left-radius: 15px;
    overflow: hidden;
    z-index: 50;
}

.top-close-bar {
    width: 100%;
    text-align: center;
    padding-bottom: 12px;
}

.top-close-bar .close-full-screen-modal {
    color: white;
    font-weight: 900;
    font-size: 18px;
    cursor: pointer;
}

.top-close-bar .close-full-screen-modal i {
    color: white;
    font-size: 15px;
}

#product-preview-modal .container .relative .bg .content {
    text-align: left;
}

.product-preview-img-placeholder {
    width: 100%;
}

.bg-placeholder-center {
    text-align: center !important;
}

.comment-modal .container .close-new-comment, .comment-modal .container .close-update-comment {
    border-radius: 50%;
    left: 12px;
    top: 15px;
    position: absolute;
    z-index: 40;
    width: 40px;
    height: 40px;
}

.comment-modal .container .close-new-comment i, .comment-modal .container .close-update-comment i {
    font-size: 28px;
    color: #dddddd;
    cursor: pointer;
}

#product-preview-modal .fa-chevron-circle-down {
    position: absolute;
    margin-left: auto;
    margin-right: auto;
    left: 0;
    right: 0;
}

#product-preview-modal .btn-space {
    height: 90px;
    width: 100%;
}

.btn-a-white {
    position: absolute;
    bottom: 65px;
    left: 0;
    right: 0;
    height: 40px;
    background: linear-gradient(0deg, rgba(255,255,255,1) 0%, rgba(255, 255, 255, 0.94) 20%, rgba(255, 255, 255, 0.54) 50%, rgba(255, 255, 255, 0.32) 75%, rgba(255,255,255,0) 100%);
    z-index: 50;
}

.user-signed-out {
    padding-top: 50px;
    text-align: center;
}

.signed-as-brand {
    padding-top: 15px;
}

.close-signed-as-brand, .close-signed-as-unconfirmed {
    position: absolute;
    right: 40px;
}

.close-signed-as-brand i, .close-signed-as-unconfirmed i {
    font-size: 28px;
    color: #dddddd;
}

.user-signed-out .logo {
    width: 120px;
    margin: auto;
    display: block;
}

.user-signed-out .img {
    width: 100%;
    max-width: 320px;
    margin: auto;
    display: block;
    margin-top: 25px;
    margin-bottom: 25px;
}

.user-signed-out .signed-out-title {
    font-size: 28px;
    font-weight: 800;
    display: block;
    line-height: 28px;
    margin: auto;
    margin-bottom: 15px;
}

.user-signed-out .signed-out-subtitle {
    font-size: 18px;
    line-height: 22px;
    max-width: 300px;
    display: block;
    margin: auto;
    margin-bottom: 30px;
}

.user-signed-out .signed-out-subtitle strong {
    font-size: 18px;
    font-weight: 900;
}

.user-signed-out-footer {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: white;
    border-bottom-right-radius: 15px;
    border-bottom-left-radius: 15px;
    overflow: hidden;
    z-index: 50;
}

.user-signed-out-footer .container {
    padding: 10px 15px 5px 15px;
    background-color: white;
    overflow: hidden;
    border-bottom-right-radius: 15px;
    border-bottom-left-radius: 15px;
}

.user-signed-out .register-a {
    text-align: center;
    margin: 15px 0;
}

#product-preview-modal .image {
    width: 100%;
    background-image: url("<%= asset_path 'icons/product-placeholder.png' %>");
    background-size: cover;
}

#product-preview-modal .image .carousel {

}

#product-preview-modal .image .carousel img {
    width: 100%;
}

#product-preview-modal .info {
    padding: 12px 15px 0 15px;
}

#product-preview-modal .info .brand {
    font-family: "Space Mono", sans-serif;
    font-size: 20px;
    display: block;
    line-height: 20px;
    text-transform: uppercase;
    margin-bottom: 3px;
}

#product-preview-modal .info .name {
    font-weight: 200;
    font-size: 18px;
    display: block;
    line-height: 20px;
    margin-bottom: 3px;
}

#product-preview-modal .info .review-versions {
    display: table;
    width: 100%;
    margin-bottom: 5px;
}

#product-preview-modal .info .review-versions .stars {

}

#product-preview-modal .info .review-versions  #review-stars {
    width: 75px;
    float: left;
    padding: 0;
    margin-top: 0;
    margin-right: 3px;
}

#product-preview-modal .info .review-versions  #review-average {
    display: none;
}

#product-preview-modal .info .review-versions .reviews-count {
    font-size: 12px;
    color: #b8b8b8;
    float: left;
    margin-top: 3px;
}

#product-preview-modal .info .review-versions .versions {
    float: left;
    margin-left: 8px;
}

#product-preview-modal .info .review-versions .versions .version {
    padding: 3px 10px 2px 10px;
    font-size: 12px;
    background-color: #F0F0F0;
    color: #aeaeae;
    display: inline-block;
    border-radius: 8px;
}

#product-preview-modal .info .review-versions .versions .active {
    color: #ff9f9f;
    background-color: #fff1ec;
}

#product-preview-modal .info .category {
    font-size: 12px;
    color: #c0c0c0;
    display: block;
    margin-bottom: 8px;
}

#product-preview-modal .action {
    margin-bottom: 8px;
    padding: 0 12px;
    height: 60px;
}

#product-preview-modal .action .col {
    width: 25%;
    float: left;
}

#product-preview-modal .action .col div {
    padding-right: 3px;
    padding-left: 3px;
}

#product-preview-modal .action .btn {
    text-align: center;
    border: 1px solid #ff9f9f;
    border-radius: 10px;
    padding: 12px 0px 10px 0;
    display: block;
    background-color: #fffaf8;
}

#product-preview-modal .action button {
    width: 100%;
}

#product-preview-modal .action .btn i {
    color: #ff9f9f;
    display: block;
    margin-bottom: 3px;
    font-size: 18px;
}

#product-preview-modal .action .btn span {
    color: #ff9f9f;
    font-size: 13px;
    display: block;
}


#product-preview-modal .action .active {
    background-color: #F1F8E9;
    border: 1px solid #c5cbbf;
}

#product-preview-modal .action .active i, #product-preview-modal .action .active span {
    color: #9aa292;
}

#product-preview-modal .description {
    padding: 0px 15px 10px 15px;
}

#product-preview-modal .description span {
    font-size: 12px;
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow: hidden;
    color: #A3A3A3;
    line-height: 16px;
}

#product-preview-modal .description a {
    font-size: 12px;
    color: #6277AE;
    position: absolute;
    bottom: 13px;
    right: 15px;
    background-color: white;
    padding-left: 9px;
}

#product-preview-modal .ribbon {
    background-color: #fff1ec;
    padding: 0 15px;
    height: 60px;
    margin-bottom: 7px;
}

#product-preview-modal .ribbon i {
    float: left;
    color: #ff9f9f;
    font-size: 18px;
    margin-right: 8px;
    margin-top: 20px;
}

#product-preview-modal .ribbon .buy {
    float: left;
    color: #ff9f9f;
    font-size: 21px;
    font-weight: 500;
    margin-top: 17px;
    letter-spacing: -0.5px;
}

#product-preview-modal .ribbon .promo {
    float: right;
    background-color: white;
    margin-right: 15px;
    font-size: 12px;
    text-transform: uppercase;
    color: #ff9f9f;
    padding: 5px 8px;
    border-radius: 10px;
    margin-top: 18px;
}

#product-preview-modal .ribbon .amount {
    float: right;
    margin-top: 10px;
    text-align: right;
}

#product-preview-modal .ribbon .amount .number {
    font-size: 20px;
    color: #ff9f9f;
    display: block;
    font-weight: 900;
    margin-bottom: -5px;
}

#product-preview-modal .ribbon .amount .number span {
    font-size: 14px;
    color: #ff9f9f;
}

#product-preview-modal .ribbon .amount a {
    font-size: 12px;
    color: #6277AE;
}

.content-section {
    padding: 15px 15px 25px 15px;
}

.tbl-ing-preview {
    margin-top: -15px !important;
}

.content-section-photos {
    padding: 15px 15px 10px 15px;
}

.divider {
    height: 7px;
    width: 100%;
    background-color: #f0eef3;
    display: block;
}

#product-preview-modal .photos {
    margin-top: -10px;
    padding: 0 0 0 18px;
    overflow: auto;
    white-space: nowrap;
    -webkit-overflow-scrolling: touch;
    overflow-y: hidden;
    position: relative;
    height: 150px;
    margin-bottom: 15px;
}

#product-preview-modal .photos div {
    display: inline-block;
    margin-right: 8px;
    background-color: #f4f4f4;
    border-radius: 10px;
}

#product-preview-modal .photos a {
    width: 120px;
    height: 150px;
    display: flex;
    justify-content: center;
    overflow: hidden;
    border-radius: 5px;
}

#product-preview-modal .photos a img {
    height: 140%;
    flex: none;
    border-radius: 5px;
    margin-top: -28px;
}

#product-preview-modal .questions {
    padding: 0 5px;
}

#product-preview-modal .questions a {
    display: block;
    margin-bottom: 18px;
    font-size: 16px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

#product-preview-modal .more {
    font-size: 12px;
    color: #6277AE;
    margin-left: 5px;
    display: block;
}

#product-preview-modal .more-photos {
    margin-left: 18px;
    margin-bottom: 20px;
}

#product-preview-modal .reviews {
    padding: 0 5px;
}

#product-preview-modal .reviews .review {
    position: relative;
    margin-bottom: 18px;
}

#product-preview-modal .reviews .review .title {
    color: #6081b4;
    font-size: 17px;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    font-weight: 500;
}

#product-preview-modal .reviews .review i {
    color: #cbcfd5;
    font-size: 15px;
}

#product-preview-modal .reviews .review .stars {
    padding: 0;
    position: absolute;
    top: 3px;
    right: 0;
    background-color: white;
    padding-left: 4px;
    padding-bottom: 4px;
}

#product-preview-modal .reviews .review .body {
    font-size: 16px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

#product-preview-modal .reviews .review a {
    position: absolute;
    bottom: 0;
    right: 0;
    color: #6277AE;
    font-size: 12px;
    background-color: white;
    padding-left: 10px;
}

#user-collections .bg {
    background-color: white;
    border-radius: 15px;
    height: 420px;
    overflow-y: scroll;
    text-align: left;
}

#user-collections .bg .header {
    height: 50px;
    background: linear-gradient(111deg, #2d1974 0%, #cd8aed 100%);
}

#user-collections .bg .header .container {
    text-align: center;
    position: relative;
}

#user-collections .bg .header .container button {
    position: absolute;
    right: 15px;
    top: 13px;
    color: white;
}

#user-collections .bg .header .container button i {
    font-size: 26px;
    color: white;
}

#user-collections .bg .header .container span {
    font-size: 18px;
    font-weight: 900;
    display: block;
    padding-top: 15px;
    color: white;
}

#user-collections .bg .header .container span i {
    font-size: 18px;
    margin-left: 3px;
    color: white;
}

#user-collections .bg .product-header {
    padding: 10px 15px 0px 15px;
}

#user-collections .bg .product-header .container {
    border-bottom: 1px solid lightgray;
    display: flex;
    flex-direction: row;
}

#user-collections .bg .product-header img {
    height: 45px;
    margin-right: 5px;
    border-radius: 10px;
}

#user-collections .bg .product-header > div {
    display: flex;
    flex-direction: column;
    padding-bottom: 7px;
}

#user-collections .bg .product-header div .brand {
    font-family: "Space Mono", sans-serif;
    font-size: 14px;
    display: block;
    line-height: 16px;
    color: #5C5C5C;
    text-transform: uppercase;
    margin-bottom: 2px;
    margin-top: 6px;
}

#user-collections .bg .product-header div .name {
    font-weight: 200;
    font-size: 17px;
    display: block;
    line-height: 18px;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden
}

#user-collections .bg .product-header div .version {
    font-size: 13px;
    font-weight: 200;
    margin-top: 3px;
}

#user-collections .bg .body {
    padding: 15px;
}

#user-collections .collection-ellipsis {
    text-align: center;
}

#user-collections #collection-list {

}

#user-collections #collection-new {
    display: none;
}

#user-collections .bg .slider,
#edit-form .slider,
#new-collection .slider {
    margin-bottom: 60px;
}

#user-collections .bg .slider span,
#edit-form .slider span,
#new-collection .slider span {
    font-weight: 900;
    font-size: 15px;
}

.coll-private-box {
    text-align: center;
    display: block;
    margin-top: 10px;
}

.switch {
    margin-bottom: 15px;
    float: left;
}

.cmn-toggle {
  position: absolute;
  margin-left: -9999px;
  visibility: hidden;
}
.cmn-toggle + label {
  display: inline-block;
  position: relative;
  cursor: pointer;
  outline: none;
  user-select: none;
}

input.cmn-toggle-round-flat + label {
  padding: 2px;
  width: 66px; /*120*/
  height: 26px; /*60*/
  background-color: #dddddd;
  border-radius: 30px; /*60*/
  transition: background 0.4s;
}
input.cmn-toggle-round-flat + label:before,
input.cmn-toggle-round-flat + label:after {
  position: absolute;
  content: "";
}
input.cmn-toggle-round-flat + label:before {
  top: 2px;
  left: 2px;
  bottom: 2px;
  right: 2px;
  background-color: #fff;
  border-radius: 30px;
  transition: background 0.4s;
}
input.cmn-toggle-round-flat + label:after {
  top: 4px;
  left: 4px;
  bottom: 4px;
  width: 22px; /*52*/
  background-color: #dddddd;
  border-radius: 52px;
  transition: margin 0.4s, background 0.4s;
}
input.cmn-toggle-round-flat:checked + label {
  background-color: #ff5173;
}
input.cmn-toggle-round-flat:checked + label:after {
  margin-left: 40px;
  background-color: #ff5173;
}

/* collection list */

.collection-list-container {
    overflow: hidden;
    overflow-y: scroll;
}

.collection-list-title {
    display: block;
    height: 20px;
    margin-bottom: 10px;
}

.collection-list-title span {
    font-size: 13px;
    color: gray;
}

.collection-list {
    margin-bottom: 25px;
}

.collection-list  a{
    height: 40px;
    margin-bottom: 10px;
    display: block;
}

.collection-list img {
    float: left;
    width: 40px;
    margin-right: 10px;
    border-radius: 10px;
}

.collection-list .img {
    width: 40px;
    height: 40px;
    border-radius: 10px;
    background-color: white;
    float: left;
    margin-right: 10px;
    text-align: center;
    border: 1px solid lightgrey;
    overflow: hidden;
}

.collection-list .img i {
    font-size: 18px;
    margin-top: 12px;
    color: #c5c5c5;
}

.collection-list .col {
    padding: 1px 5px 0 50px;
    position: relative;
}

.collection-list .col span {
    font-size: 19px;
    font-weight: 500;
    margin-top: 7px;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden
}

.collection-list .col span i {
    color: #c5c5c5;
    position: absolute;
    right: 0;
    font-size: 12px;
    top: 19px;
}

.collection-list-empty {
    font-size: 18px;
    color: gray;
    text-align: center;
    margin: auto;
    display: block;
    margin-top: 30px;
}

.bubble-down-alert {
    bottom: 90px;
    position: fixed;
    z-index: 50;
    text-align: center;
    display: none;
    padding: 0 15px;
    left: 0;
    right: 0;
}

.bubble-down-alert span {
    background-color: #FF5072;
    color: #ffffff;
    padding: 8px 20px;
    border-radius: 15px;
    font-weight: 500;
    display: inline-block;
}

.bubble-down-alert i {
    color: #ffffff;
    font-size: 14px;
}

.bubble-top-alert {
    top: 30px;
    position: fixed;
    z-index: 100;
    text-align: center;
    display: none;
    padding: 0 15px;
    left: 0;
    right: 0;
}

.bubble-top-alert-navbar {
    top: 60px;
}

.bubble-top-alert span {
    background-color: #FF5072;
    color: #ffffff;
    padding: 8px 20px;
    border-radius: 15px;
    font-weight: 500;
    display: inline-block;
    box-shadow: -3px 3px 5px #0000001a;
}

.bubble-top-alert i {
    color: #ffffff;
    font-size: 14px;
}

.bubble-top-alert-biuexp {
    top: 30px;
    position: fixed;
    z-index: 101;
    text-align: center;
    display: none;
    padding: 0 15px;
    left: 0;
    right: 0;
}

.bubble-top-alert-biuexp .info {
    background-color: #432985;
    padding: 8px 20px;
    border-radius: 15px;
    box-shadow: -3px 3px 5px #0000001a;
    display: inline-flex;
    align-items: center;
}

.bubble-top-alert-biuexp .info .number {
    color: white;
    font-weight: 500;
    margin-right: 5px;
}

.bubble-top-alert-biuexp .info i {
    color: #FFEB3B;
    font-size: 14px;
}

.bubble-top-alert-biuexp .info .text {
    color: white;
    font-weight: 500;
    margin-left: 5px;
}

.bubble-top-alert-biucredits {
    top: 30px;
    position: fixed;
    z-index: 101;
    text-align: center;
    display: none;
    padding: 0 15px;
    left: 0;
    right: 0;
}

.bubble-top-alert-biucredits .info {
    background-color: #272727;
    padding: 8px 20px;
    border-radius: 15px;
    box-shadow: -3px 3px 5px #0000001a;
    display: inline-flex;
    align-items: center;
}

.bubble-top-alert-biucredits .info .number {
    color: white;
    font-weight: 500;
    margin-right: 5px;
}

.bubble-top-alert-biucredits .info .text {
    color: white;
    font-weight: 500;
    margin-right: 5px;
}

.bubble-top-alert-second-level {
    top: 75px;
}


/* unfollow modal */

.unfollow-modal {
    height: 170px;
    width: 100%;
    position: fixed;
    bottom: 0;
    overflow-y: scroll;
    overflow-x: hidden;
    z-index: 62;
    animation-duration: 600ms;
    display: none;
}

.unfollow-modal > .container {
    padding: 15px;
}

.unfollow-modal > .container > .bg {
    padding: 15px 15px 15px 15px;
    border-radius: 15px;
    background-color: white;
    max-width: 360px;
    margin: auto;
}

.unfollow-modal > .container > .bg > div > .button-box {
    height: 60px;
}

.unfollow-modal > .container > .bg > div > .button-box > a {
    display: block;
    padding: 12px 0;
    width: 100%;
    text-align: left;
}

.unfollow-modal > .container > .bg > div > .button-box > a > div {
    float: left;
    width: 30px;
    text-align: center;
    margin-right: 10px;
}

.unfollow-modal > .container > .bg > div > .button-box > a > div > i {
    font-size: 20px;
    color: #939393;
}

.unfollow-modal > .container > .bg > div > .button-box > a > span {
    font-size: 18px;
    color: #939393;
    font-weight: 500;
}


/* Bottom Menu Modal */

.bottom-menu-modal,
.bottom-menu-modal-post {
    width: 100%;
    position: fixed;
    bottom: 0;
    overflow-y: scroll;
    overflow-x: hidden;
    z-index: 100;
    animation-duration: 600ms;
    display: none;
}

.bottom-menu-modal-post {
    z-index: 97;
}

.bottom-menu-modal > .container,
.bottom-menu-modal-post > .container {
    padding: 15px;
}

.bottom-menu-modal > .container > .bg,
.bottom-menu-modal-post > .container > .bg {
    padding: 15px 15px 15px 15px;
    border-radius: 15px;
    background-color: white;
    max-width: 360px;
    margin: auto;
}

.bottom-menu-modal > .container > .bg .lds-ellipsis-container,
.bottom-menu-modal-post > .container > .bg .lds-ellipsis-container {
    text-align: center;
    margin-top: 65px;
    margin-bottom: 80px;
}

.bottom-menu-modal > .container > .bg > div > div > .button-box {
    margin-bottom: 10px;
}

.bottom-menu-modal > .container > .bg > div > div > .button-box-sort {
    height: 225px;
}

.bottom-menu-modal > .container > .bg > div > div > .button-box > .button-row {
    display: block;
    padding: 12px 0;
    width: 100%;
    text-align: left;
    cursor: pointer;
}

.bottom-menu-modal > .container > .bg > div > div > .button-box > .button-row > div {
    float: left;
    width: 30px;
    text-align: center;
    margin-right: 10px;
}

.bottom-menu-modal > .container > .bg > div > div > .button-box > .post-hashid {
    display: table;
    width: 100%;
    margin-bottom: 20px;
    padding-bottom: 15px;
    border-bottom: 1px solid #d0d0d0;
}

.bottom-menu-modal > .container > .bg > div > div > .button-box > .post-hashid .icon-col {
    float: left;
    width: 50px;
}

.bottom-menu-modal > .container > .bg > div > div > .button-box > .post-hashid .icon-col .icon {
    width: 45px;
    height: 45px;
    border-radius: 50%;
    background-color: #FFA5A5;
    text-align: center;
}

.bottom-menu-modal > .container > .bg > div > div > .button-box > .post-hashid .icon-col .icon i {
    color: white;
    font-size: 22px;
    margin-top: 12px;
}

.bottom-menu-modal > .container > .bg > div > div > .button-box > .post-hashid .info {
    padding-left: 55px;
}

.bottom-menu-modal > .container > .bg > div > div > .button-box > .post-hashid .info .title {
    font-size: 18px;
    line-height: 20px;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    margin-bottom: 5px;
}

.bottom-menu-modal > .container > .bg > div > div > .button-box > .post-hashid .info .link {
    display: block;
    color: #988b9e;
}

.top-profile-user {
    position: relative;
    text-align: left;
    z-index: 12;
}

.top-profile-user > .container {
    background-color: white;
    width: 100%;
    z-index: 29;
}

.top-profile-user > .container > .header {
    height: 150px;
    width: 100%;
    position: relative;
    text-align: center;
    justify-content: center;
    overflow: hidden;
    background-color: #fcf5f3;
}

.top-profile-user > .container > .header-color {
    height: 150px;
    width: 100%;
    position: relative;
    text-align: center;
    justify-content: center;
    overflow: hidden;
    background-color: #e6e6e6;
}

.top-profile-user > .container > .header > .about {
    height: 150px;
    width: 100%;
    object-fit: cover;
}

.top-profile-user > .container .profile {
    height: 80px;
    width: 80px;
    border-radius: 50%;
    border: 3px solid white;
    position: absolute;
    top: 80px;
    left: 15px;
    background-color: white;
    object-fit: cover;
}

.top-profile-user > .container > .info {
    padding: 15px 15px 5px 15px;
    text-align: left;
}

.top-profile-user > .container > .info > .top {
    width: 100%;
    display: flex;
    margin-bottom: 5px;
    justify-content: space-between;
}

.top-profile-user > .container > .info > .top-no-desc {
    margin-bottom: 2px;
}

.top-profile-user > .container > .info > .top > .user-container {
    display: flex;
    flex-direction: column;
    width: 100%;
}

.top-profile-user > .container > .info > .top > .user-container > .user {
    width: 100%;
    display: flex;
    justify-content: space-between;
}

.top-profile-user > .container > .info > .top > .user-container > .user .user-name {
    font-size: 22px;
    font-weight: 900;
    margin-right: 5px;
}

.top-profile-user > .container > .info > .top > .user-container > .info {
    display: flex;
    align-items: center;
    margin-top: 3px;
}

.top-profile-user > .container > .info > .top > .user-container > .info > .biuexp {
    margin-right: 5px;
}

.top-profile-user > .container > .info > .top > .user-container > .info > .biuexp .bg {
    background-color: #432985;
    padding: 3px 7px 2px 7px;
    border-radius: 10px;
    display: flex;
    align-items: center;
}

.top-profile-user > .container > .info > .top > .user-container > .info > .biuexp .bg .number {
    color: white;
    font-size: 12px;
    margin-right: 4px;
}

.top-profile-user > .container > .info > .top > .user-container > .info > .biuexp .bg i {
    color: #FFEB3B;
    font-size: 11px;
}

.top-profile-user > .container > .info > .top > .user-container > .info > .biuexp .bg .text {
    color: white;
    font-size: 12px;
    margin-left: 3px;
}

.top-profile-user > .container > .info .biucredits {
    
}

.top-profile-user > .container > .info .biucredits .bg {
    background: linear-gradient(111deg, #272727 0%, #707070 100%);
    padding: 3px 7px 2px 7px;
    border-radius: 10px;
    display: flex;
    align-items: center;
}

.top-profile-user > .container > .info .biucredits .bg .currency {
    font-size: 12px;
    color: white;
}

.top-profile-user > .container > .info .biucredits .bg .amount {
    font-size: 12px;
    color: white;
    margin-left: 5px;
}

.top-profile-user > .container > .info > .top > .user-container > .info > .badges {
    margin-right: 5px;
}

.top-profile-user > .container > .info > .top > .user-container > .info > .badges .bg {
    padding: 3px 7px 2px 7px;
    border-radius: 10px;
    display: flex;
    align-items: center;
}

.top-profile-user > .container > .info > .top > .user-container > .info > .badges span {
    color: white;
    font-size: 12px;
    margin-right: 3px;
}

.top-profile-user > .container > .info > .top > .user-container > .info > .badges i {
    color: white;
    font-size: 10px;
}

.top-profile-user > .container > .info > .top > .user-container > .info > .badges .admin {
    background-color: #454545;
}

.top-profile-user > .container > .info > .top > .user-container > .info > .badges .employee {
    background-color: #454545;
}

.top-profile-user > .container > .info > .top > .user-container > .info > .badges .brand {
    background-color: #454545;
}

.top-profile-user > .container > .info > .top > .user-container > .info > .badges .ambassador {
    background-color: #ff9800;
}

.top-profile-user > .container > .info > .top .user-container .user .follow .follow-btn {
    padding: 4px 12px;
    border-radius: 15px;
    float: right;
    margin-top: -2px;
    font-size: 13px;
    cursor: pointer;
    background: linear-gradient(111deg, #2d1974 0%, #cd8aed 100%);
    color: white;
    margin-left: 10px;
}

.top-profile-user > .container > .info > .top .user-container .user .follow > .follow-btn i {
    color: white;
    font-size: 11px;
}

.top-profile-user > .container > .info > .top > .user-stats {
    margin-top: 7px;
}

.top-profile-user > .container > .info > .top > .user-stats .text {
    font-size: 13px;
    color: #9e8b84;
    padding: 5px 12px;
    background-color: #fdeee8;
    border-radius: 15px;
    display: inline-block;
}

.top-profile-user > .container > .info > .description {
    position: relative;
    overflow: hidden;
    text-align: left;
    margin-bottom: -10px;
}

.top-profile-user > .container > .info > .description * {
    font-size: 14px;
}

.top-profile-user > .container > .info > .description p {
    display: block;
    margin-bottom: 10px;
    line-height: 18px;
}

.top-profile-user > .container > .info .menu {
    display: flex;
    margin: 0 -5px;
    margin-top: 15px;
}

.top-profile-user > .container > .info .menu .col {
    width: 50%;
    padding: 0 5px;
}

.top-profile-user > .container > .info .menu .col .container {
    border: 1px solid #8d7398;
    color: #896b97;
    border-radius: 20px;
    font-weight: 500;
    cursor: pointer;
    background-color: white;
    width: 100%;
    padding: 10px 0;
}

.top-profile-user > .container > .info .menu .col .container {
    color: #896b97;
}

.top-profile-user > .container > .info .menu .col .container i {
    color: #896b97;
}

.top-profile-user .joined-since {
    margin-top: 10px;
}

.top-profile-user .joined-since i {
    color: #b1aab5;
    font-size: 14px;
}

.top-profile-user .joined-since span {
    color: #b1aab5;
    font-size: 14px;
    font-weight: 500;
}

.top-profile-user .scheduled-to-delete {
    margin-top: 10px;
    background-color: #ffecec;
    padding: 15px;
    border-radius: 10px;
    border: 1px solid red;
}

.top-profile-user .scheduled-to-delete i {
    color: red;
    font-size: 14px;
}

.top-profile-user .scheduled-to-delete span {
    color: red;
    font-size: 14px;
    font-weight: 500;
}

.stats {
    position: relative;
    background-color: white;
    /*border-bottom: 1px solid #ebebeb;*/
    height: 45px;
    padding-top: 7px;
}

.stats > .container {
    display: flex;
    width: 100%;
    overflow: auto;
    white-space: nowrap;
    -webkit-overflow-scrolling: touch;
    overflow-y: hidden;
}

.stats .col,
.stats .col-2 {
    display: inline-block;
    padding: 0 12px 0 0;
}

.stats .col:first-child {
    padding-left: 10px;
}

.stats .col .container,
.stats .col-2 .container {
    display: flex;
}

.stats .col-2 .container div {
    background-color: #f0eef3;
    padding: 2px 10px 3px 10px;
    border-radius: 10px;
    border: 1px solid #b9b9b9;
    margin-top: 6px;
}

.stats .col-2 .container div span {
    font-size: 13px;
    color: #454545;
}

.stats .col .container .info {
    display: flex;
    flex-direction: column;
    padding-top: 5px;
}

.stats .col .container .info-3 {
    padding-top: 0;
}

.stats .col .container .info span {
    font-size: 12px;
    display: block;
    margin-bottom: -2px;
}

.stats .col .container .info small {
    font-size: 10px;
    display: block;
    color: red;
}

.stats .col-2 .container  {
    
}

.stats .col-2 .container {
    
}

.stats .col img {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    margin-right: 5px;
    border: 2px solid white;
    z-index: 5;
}

.stats .col span {

}

.stats .col .double {
    margin-left: -23px;
    z-index: 3;
}

.bottom-menu-modal .container .bg .top-profile-user {
    margin: -15px -15px 0 -15px;
}

.bottom-menu-modal .container .bg .stats {
    margin-bottom: 15px;
    border-bottom: 1px solid #ebebeb;
}

.bottom-menu-modal .container .bg .stats .container {
    margin-left: -7px;
    margin-right: 5px;
}


/* Report */

#report-menu .title {
    font-weight: 900;
    margin-bottom: 10px;
    display: block;
    color: #AFB1B2;
}

#report-menu hr {
    margin-bottom: 12px;
    border: 0.5px solid #e1e1e1;
}

#report-menu {
    display: none;
    position: relative;
}

/* Comments */

.post-comments-container {
    min-height: 60px;
    position: absolute;
    width: 100%;
    background-color: #f0eef3;
}

.post-comments-container .comments {
    padding-bottom: 0;
}

.post-comments-container .comments-signed-in {
    padding-bottom: 61px;
}

.post-comments-empty {
    width: 100%;
    height: 7px;
}

.comments-single-thread {
    margin-bottom: 69px;
}

.comment-root {
    padding: 7px 15px 8px 0;
    margin-bottom: 7px;
    background-color: white;
    position: relative;
}

.collapse-angle {
    position: absolute;
    right: 22px;
    top: 11px;
}

.collapse-angle i {
    color: lightgrey;
    cursor: pointer;
}

.comment {
    padding: 0 0 0 15px;
    overflow: hidden;
}

.comment .header {
    height: 25px;
    position: relative;
    z-index: 0;
}

.comment .header .user, .comment .header .user-detached, .comment .header .user-brand, .comment .header .user-store {
    display: inline-block;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 4;
}

.comment .header .user img, .comment .header .user-detached img, .comment .header .user-brand img, .comment .header .user-store img {
    width: 18px;
    height: 18px;
    border-radius: 50%;
    float: left;
    margin-top: 3px;
    border: 1px solid lightgray;
    cursor: pointer;
    object-fit: cover;
}

.comment .header .user .user-name {
    font-size: 13px;
    color: #A3A7A8;
    float: left;
    margin-top: 5px;
    margin-left: 5px;
    cursor: pointer;
}

.comment .header .user .user-name i {
    font-size: 9px;
    color: #A3A7A8;
}

.comment .header .user-detached .user-name-detached {
    font-size: 13px;
    color: #b0b0b0;
    float: left;
    margin-top: 6px;
    margin-left: 5px;
}

.comment .header .user .current-user-name, .comment .header .user-brand .current-user-name, .comment .header .user-store .current-user-name {
    color: green;
    font-weight: 500;
}

.comment .header .user .current-user-name i, .comment .header .user-brand .current-user-name i, .comment .header .user-store .current-user-name i {
    color: green;
    font-size: 9px;
    float: right;
    margin-left: 4px;
    margin-top: 3px;
}

.comment .header .user .post-user-name {
    color: #4876b7;
    font-weight: 500;
}

.comment .header .user .post-user-name i {
    color: #4876b7;
    font-size: 9px;
    float: right;
    margin-left: 4px;
    margin-top: 3px;
}

.comment .header .user-brand .user-name, .comment .header .user-store .user-name {
    font-family: "Space Mono", sans-serif;
    font-size: 12px;
    font-weight: 900;
    text-transform: uppercase;
    float: left;
    margin-top: 4px;
    margin-left: 4px;
    background-color: #676767;
    border-radius: 10px;
    padding: 0px 6px;
    color: white;
}

.comment .header .user-brand .user-name i, .comment .header .user-store .user-name i {
    font-size: 10px;
    float: right;
    margin-left: 4px;
    margin-top: 3px;
    color: white;
}

.comment .header .user .created, .comment .header .user-detached .created, .comment .header .user-brand .created, .comment .header .user-store .created {
    font-size: 12px;
    color: #A3A7A8;
    float: left;
    margin-top: 7px;
    margin-left: 4px;
}


.comment .header .collapse {
    height: 30px;
    position: relative;
}

.comment .header .collapse i {
    color: #d3cdd5;
    font-size: 17px;
    position: absolute;
    right: 7px;
    top: 7px;
}

.comments .comment .body {
    margin-top: 5px;
    margin-bottom: -15px;
}

.comment .body-margin {
    margin-bottom: 1px;
}

.comment .body span {

}

.comment .body .detached p {
    font-style: italic;
    color: #aeaeae;
}

.comment .body p {
    font-size: 16px;
    line-height: 20px;
    display: block;
    color: #5a5a5a;
    margin-bottom: 16px;
}

.comment .body ol, .comment .body ul {
    padding-left: 20px;
    margin-bottom: 10px;
}

.comment .body li {
    font-size: 16px;
    margin-bottom: 2px;
}

.comment .body a {
    font-size: 16px;
    color: #2196F3;
}

.comment .body strong, .comment .body em {
    font-size: 16px;
}

.comment .body blockquote, .cke_editable blockquote {
    font-style: italic;
    padding: 2px 0;
    border-style: solid;
    border-color: #ccc;
    border-width: 0;
    padding-left: 15px;
    padding-right: 8px;
    border-left-width: 5px;
    display: block;
    margin-top: 25px;
    margin-bottom: 25px;
    margin-left: 15px;
    line-height: 18px;
}

.comment .body blockquote > p, .cke_editable blockquote > p {
    font-size: 15px
}


.comment .footer {
    display: table;
    width: 100%;
    height: 30px;
}

.comment .footer .comment-menu, .comment .footer .comment-menu-detached {
    height: 23px;
    padding-top: 7px;
    width: 35px;
    float: right;
    text-align: center;
    margin: 0 6px;
    cursor: pointer;
}

.comment .footer .comment-menu i, .comment .footer .comment-menu-detached i {
    color: #d3cdd5;
    font-size: 15px;
}

.comment .footer .new-comment, .comment .footer .new-comment-detached {
    height: 23px;
    padding-top: 7px;
    width: 35px;
    float: right;
    text-align: center;
    margin: 0 6px;
    border-radius: 8px;
    cursor: pointer;
}

.comment .footer .new-comment i {
    color: #988b9e;
    font-size: 15px;
}

.comment .footer .new-comment-detached i {
    color:#d3cdd5 !important;
    font-size: 15px;
}

.comment .footer .thumbs-box-left {
    height: 24px;
    padding-top: 6px;
    width: 34px;
    float: right;
    text-align: center;
    margin: 0 6px;
}

.comment .footer .comment-thumbs-box {
    display: table;
    float: right;
}

.comment .footer .thumbs-box-right {
    height: 23px;
    padding-top: 7px;
    width: 35px;
    float: right;
    text-align: center;
    margin-right: -4px;
}

.comment .footer .thumbs-box-left .fa-thumbs-up {
    color: #988b9e;
    font-size: 15px;
    cursor: pointer;
}

.comment .footer .thumbs-box-right .fa-thumbs-down {
    color: #988b9e;
    font-size: 15px;
    cursor: pointer;
}

.comment .footer .thumbs-box-disabled .fa-thumbs-up, .comment .footer .thumbs-box-disabled .fa-thumbs-down {
    color: lightgray;
    font-size: 15px;
}

.comment .footer .voted-thumb i {
    color: #feb9a2 !important;
    font-size: 15px;
}

.comment .footer .thumbs-box-detached i, .comment .footer .thumbs-box-detached .vote {
    color: #d3cdd5 !important;
}

.comment .footer .thumbs-box-left span {
    color: #988b9e;
    font-size: 15px;
    font-weight: 500;
    width: 15px;
    display: inline-block;
    text-align: left;
}

.comment .footer .thumbs-box-left .voted {
    color: #feb9a2 !important;
    font-size: 15px;
}

.comment .footer .comment-saved {
    height: 23px;
    padding-top: 7px;
    width: 34px;
    float: right;
    text-align: center;
}

.comment .footer .comment-saved i {
    color: #feb9a2;
    font-size: 15px;
}

.comment .footer .comment-disabled i {
    color: lightgray;
}


.comment .nested-comments {
    padding-left: 5px;
}


/* Comment Modal */

.user-comment-btn {
    position: fixed;
    bottom: 0;
    width: 100%;
    z-index: 10;
    border-top: 1px solid #e7e7e7;
    cursor: pointer;
}

.user-comment-btn .container {
    background-color: white;
    padding: 15px 15px 20px 15px;
    height: 26px;
    cursor: pointer;
}

.user-comment-btn img {
    width: 25px;
    height: 25px;
    border-radius: 50%;
    border: 1px solid #e1e1e1;
    float: left;
    margin-left: 2px;
    object-fit: cover;
}

.user-comment-btn span {
    float: left;
    font-size: 16px;
    margin: 4px 0 0 10px;
    color: #988b9e;
    margin-top: 5px;
    padding-top: 0;
}

.user-comment-btn hr {
    border-bottom: 0px solid #c2c2c2;
    margin-top: 26px;
    margin-left: 40px;
}



/* Signed as Brand Modal */

.signed-as-brand-modal {
    width: 100%;
    position: fixed;
    bottom: 0;
    overflow-y: scroll;
    overflow-x: hidden;
    z-index: 62;
    animation-duration: 600ms;
    display: none;
}

.signed-as-brand-modal > .container {
    padding: 15px;
}

.signed-as-brand-modal .container .relative {
    position: relative;
    border-radius: 15px;
    overflow: hidden;
}

.signed-as-brand-modal .container .relative .bg {
    background-color: white;
    border-radius: 15px;
    overflow-y: scroll;
}

.signed-as-brand-modal > .container .relative > .bg .lds-ellipsis-container {
    text-align: center;
    margin-top: 225px;
}


/* Comment Modal */

.comment-modal {
    width: 100%;
    position: fixed;
    bottom: 0;
    overflow-y: scroll;
    overflow-x: hidden;
    z-index: 100;
    animation-duration: 600ms;
    display: none;
}

.comment-modal > .container {
    padding: 5px;
}

.comment-modal .container .relative {
    position: relative;
    border-radius: 15px;
    overflow: hidden;
}

.comment-modal .container .relative .bg {
    background-color: white;
    border-radius: 15px;
    overflow-y: scroll;
}

.comment-modal > .container .relative > .bg .lds-ellipsis-container {
    text-align: center;
    margin-top: 155px;
    margin-bottom: 80px;
}

.comment-modal > .container .relative > .bg > div .header {
    background-color: white;
    position: absolute;
    width: 100%;
    height: 65px;
}

.comment-modal > .container .relative > .bg > div .publish-comment-box {
    right: 15px;
    top: 17px;
    position: absolute;
    cursor: pointer;
}

.comment-modal > .container .relative > .bg > div .publish-comment-box .publish-comment, .comment-modal > .container .relative > .bg > div .publish-comment-box .publish-comment-btn {
    z-index: 40;
    font-weight: 900;
    color: #0c007f;
    background-color: #0c007f;
    border-radius: 10px;
    color: white;
    padding: 9px 15px;
    font-size: 14px;
    border: none;
}

.comment-modal > .container .relative > .bg  div form > .container {
    padding: 65px 15px 15px 15px;
}

.comment-modal > .container .relative > .bg  div .container .user, .comment-modal > .container .relative > .bg  div .container .user-brand {
    display: inline-block;
    margin-bottom: 2px;
}

.comment-modal > .container .relative > .bg  div .container .user img, .comment-modal > .container .relative > .bg  div .container .user-brand img {
    width: 18px;
    height: 18px;
    border-radius: 50%;
    float: left;
    margin-top: 7px;
    border: 1px solid lightgray;
}

.comment-modal > .container .relative > .bg  div .container .user .comment-user-name {
    font-size: 13px;
    color: #A3A7A8;
    float: left;
    margin-top: 8px;
    margin-left: 5px;
}

.comment-modal > .container .relative > .bg  div .container .user-brand .comment-user-name {
    font-family: "Space Mono", sans-serif;
    font-size: 12px;
    font-weight: 900;
    text-transform: uppercase;
    float: left;
    margin-top: 7px;
    margin-left: 4px;
    color: #aeaeae;
}

.comment-modal > .container .relative > .bg  div .container .user-brand .user-name i {
    font-size: 10px;
    float: right;
    margin-left: 4px;
    margin-top: 3px;
}

.comment-modal > .container .relative > .bg  div .container .user .created, .comment-modal > .container .relative > .bg  div .container .user-brand .created {
    font-size: 13px;
    color: #A3A7A8;
    float: left;
    margin-top: 8px;
    margin-left: 4px;
}

.comment-modal > .container .relative > .bg  div .container .post-title {
    padding-bottom: 5px;
    border-bottom: 1px solid gray;
    margin-bottom: 15px;
}

.comment-modal > .container .relative > .bg  div .container .post-title span {
    font-size: 20px;
    font-weight: 500;
    line-height: 22px;
    margin-bottom: 10px;
    display: block;
}

#new-comment-ckeditor {
    height: 244px;
    background-color: #eaedef;
    margin-bottom: 0;
}

#new-comment-ckeditor .container {
    padding-right: 0;
    border: none;
    border-radius: 0;
    position: relative;
}

#new-comment-ckeditor .container .title {
    top: 45px;
    display: block;
    position: absolute;
    left: 10px;
}

#new-comment-ckeditor * {
    font-family: "Roboto", sans-serif;
}

.ck.ck-editor__editable_inline {
    height: 204px;
}


/* Filter Modal */

.filter-menu-container {
    margin-bottom: 15px;
}

.filter-menu {
    overflow: auto;
    white-space: nowrap;
    -webkit-overflow-scrolling: touch;
    overflow-y: hidden;
    padding: 2px 0 0 10px;
    text-align: left;
}

.filter-menu-signed-out {
    height: 7px;
    width: 100%;
}

.filter-menu-wh {
    background-color: #f0eef3;
    margin-top: -8px;
}

.filter-menu > .container {
    display: inline-block;
    padding: 0 8px;
}

.filter-menu > .container > .btn {
    padding: 13px 0px;
    cursor: pointer;
}


.filter-menu > .container > .btn > .text {
    font-weight: 900;
    color: #988b9e;
    font-size: 15px;
}

.filter-menu > .container > .btn > .text > i {
    color: #988b9e;
    font-size: 14px;
    float: left;
    margin-right: 5px;
    margin-top: 3px;
}

.filter-menu > .container > .btn > .text > .fa-chevron-down {
    float: right;
    margin-left: 5px;
    margin-top: 6px;
    font-size: 12px;
}

.filter-menu > .container > .btn > .text > .fa-caret-down {
    color: #988b9e;
    font-size: 18px;
    float: right;
    margin: 1px 0 0 5px;
}

.filter-menu > .container > .btn > .text .alphabet-letter {
    margin-right: 5px;
    background-color: #a0938f;
    width: 18px;
    display: inline-block;
    border-radius: 50%;
    text-align: center;
    height: 18px;
    float: left;
    margin-top: 1px;
}

.filter-menu > .container > .btn > .text .alphabet-letter > span {
    color: #fce8e1;
    font-size: 12px;
    margin-top: 2px;
    display: block;
}

.filter-menu > .container-show-all {
    float: right;
    padding: 0 8px;
    margin-right: 7px;
}

.filter-menu > .container-show-all > .btn {
    padding: 13px 0px;
}

.filter-menu > .container-show-all > .btn > .text {
    font-weight: 900;
    color: #848da8;
    font-size: 14px;
}

.filter-menu .alphabet {
    display: block;
    margin-top: 10px;
}

.filter-menu .alphabet .letter {
    color: #8b99a0;
}

.filter-menu .alphabet .active {
    font-weight: 900;
    color: #656565;
}

.filter-menu-2-container {
    height: 135px;
    background-color: white;
}

.filter-menu-2 {
    background-color: white;
    position: relative;
    height: 140px;
    border-bottom: 1px solid #ebebeb;
}

.filter-menu-3-container {
    height: 95px;
}

.filter-menu-3 {
    height: 95px;
}

.fixed-filter-menu-2 {
    position: fixed !important;
    top: 0;
    z-index: 30;
    width: 100%;
}

.fixed-filter-menu-index {
    position: fixed !important;
    top: 0;
    z-index: 30;
    width: 100%;
}

.filter-menu-2 .top-row {
    display: flex;
    padding: 10px 15px 0 15px;
    min-height: 35px;
}

.filter-menu-2 .top-row .row {
    width: 100%;
}

.filter-menu-2 .top-row .col {
    width: 50%;
}

.filter-menu-2 .top-row .col:nth-child(2n+1) {
    padding-right: 5px;
}

.filter-menu-2 .top-row .col:nth-child(2n+2) {
    padding-left: 5px;
}

.filter-menu-2 .top-row .btn-wide {
    border: 1px solid #C2C0C3;
    background-color: white;
    padding: 0 15px;
    border-radius: 8px;
    text-align: center;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.filter-menu-2 .top-row .btn-wide span {
    font-size: 14px;
    color: #707070;
}

.filter-menu-2 .top-row .btn-wide i {
    font-size: 12px;
    color: #707070;
    margin-left: 5px;
}

.filter-menu-2 .top-row .col-wide {
    width: 100%;
}

.filter-menu-2 .top-row .col-wide .btn-wide {
    
}

.filter-menu-2 .top-row .col-wide .btn-wide span {
    
}

.filter-menu-2 .top-row .col-wide .btn-wide i {
    
}

.filter-menu-2 .top-row  .active {
    border: 1px solid #ff9e9e;
    background-color: #ff9e9e;
}

.filter-menu-2 .top-row .active span {
    color: white;
}

.filter-menu-2 .top-row .active i {
    color: white;
}

.filter-menu-2 .bottom-row {
    display: inline-block;
    width: 100%;
    overflow: auto;
    white-space: nowrap;
    -webkit-overflow-scrolling: touch;
    overflow-y: hidden;
    padding: 10px 0 5px 0;
}

.filter-menu-2 .bottom-row .btn-space {
    width: 12px;
    height: 15px;
    display: inline-block;
}

.filter-menu-2 .bottom-row .btn {
    border: 1px solid #c2c0c3;
    background-color: white;
    padding: 5px 15px;
    border-radius: 15px;
    display: inline-block;
    cursor: pointer;
}

.filter-menu-2 .top-row .btn-wide:hover,
.filter-menu-2 .bottom-row .btn:hover {
    background-color: #f3f3f3;
}

.filter-menu-2 .top-row .active:hover,
.filter-menu-2 .bottom-row .active:hover {
    background-color: #ff9e9e;
}

.filter-menu-2 .bottom-row .btn span {
    font-size: 14px;
    color: #707070;
}

.filter-menu-2 .bottom-row .btn i {
    font-size: 12px;
    color: #707070;
}

.filter-menu-2 .bottom-row .active {
    border: 1px solid #ff9e9e;
    background-color: #ff9e9e;
}

.filter-menu-2 .bottom-row .active span {
    color: white;
}

.filter-menu-2 .bottom-row .active .fa-check,
.filter-menu-2 .bottom-row .active .fa-fire,
.filter-menu-2 .bottom-row .active .fa-clock-o,
.filter-menu-2 .bottom-row .active .fa-pencil-alt,
.filter-menu-2 .bottom-row .active .fa-dollar-sign,
.filter-menu-2 .bottom-row .active .fa-font {
    color: white;
}

/* feed headline */

.section-headline {
    height: 35px;
    position: fixed;
    width: 100%;
    top: 0;
    z-index: 11;
    background-color: #ffa3a3;
    overflow: hidden;
}

.section-headline-z-top {
    z-index: 11;
}

.section-headline .container {
    display: table;
    margin: auto;
}

.section-headline .headline-profile {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    float: left;
    margin-top: 8px;
    object-fit: cover;
}

.section-headline .brand-name {
    font-family: "Space Mono", sans-serif;
    font-size: 14px;
    float: left;
    margin: 7px 0px 0 7px;
    color: white;
}

.section-headline .not-brand-name {
    font-weight: 900;
    float: left;
    margin: 9px 0px 0 7px;
    color: white;
    font-size: 15px;
}

.section-headline .container span i {
    color: #ffffff73;
    font-size: 11px;
    float: right;
    margin: 3px 0 0 5px;
}

.fixed-section-menu {
    position: fixed !important;
    top: 35px;
    z-index: 30;
    width: 100%;
}

.fixed-home-section-menu {
    position: fixed !important;
    top: 0;
    z-index: 30;
    width: 100%;
}

.fixed-filter-menu {
    position: fixed;
    top: 8px;
    z-index: 30;
    width: 100%;
}


.bottom-menu-modal > .container {
    padding: 15px;
}

.bottom-menu-modal > .container > .bg {
    padding: 15px 15px 15px 15px;
    border-radius: 15px;
    background-color: white;
    overflow: hidden;
}

.bottom-menu-modal-post > .container .bg-no-padding {
    background-color: white;
    border-radius: 15px;
    overflow: hidden;
    max-width: 600px;
    margin: auto;
    position: relative;
}

.bottom-menu-modal-post > .container .bg-top {
    padding: 15px 15px 0 15px;
    background-color: white;
}

.bottom-menu-modal-post > .container .bg-bottom {
    padding: 0 15px 15px 15px;
    background-color: white;
}

.bottom-menu-modal > .container > .bg .title,
.bottom-menu-modal-post > .container .bg-top .title {
    font-weight: 900;
    margin-bottom: 10px;
    display: block;
    color: #939393;
}

.bottom-menu-modal > .container > .bg .title > span {
    font-weight: 900;
    color: #939393;
    text-transform: lowercase;
}

.bottom-menu-modal > .container > .bg .biucredits-card-container > .title {
    display: block;
    margin-top: 15px;
    text-align: center;
    font-size: 18px;
    line-height: 24px;
    font-weight: 200;
    margin-bottom: 30px;
    color: #454545;
}

.bottom-menu-modal > .container > .bg .sort-back-btn {
    float: left;
    margin-right: 7px;
    margin-top: -1px;
}

.bottom-menu-modal > .container > .bg .sort-back-btn > i{
    color: #988b9e;
}

.bottom-menu-modal > .container .bg hr,
.bottom-menu-modal-post > .container .bg-top hr {
    margin-bottom: 12px;
    border: none;
    border-bottom: 1px solid #e1e1e1;
}

.bottom-menu-modal > .container .bg .button-box,
.bottom-menu-modal-post > .container .bg-bottom .button-box {
    padding-bottom: 15px;
}

.bottom-menu-modal > .container .bg .button-box-letters {
    height: 305px;
    overflow-y: scroll;
    padding-bottom: 50px;
}

.bottom-menu-modal > .container .bg .button-box-letters-container {
    position: relative;
}

.bottom-menu-modal > .container .bg .button-box-letters-footer {
    position: absolute;
    bottom: 45px;
    height: 50px;
    width: 100%;
    background: white;
    background: linear-gradient(180deg, #ffffff00 0%, #ffffff 69%, #ffffff 100%);
}

.bottom-menu-modal > .container .bg .button-box-quantity {
    max-height: 220px;
    overflow: hidden;
    overflow-y: scroll;
}

.bottom-menu-modal > .container > .bg .button-box > button,
.bottom-menu-modal > .container > .bg .button-box > a,
.bottom-menu-modal-post > .container .bg-bottom .button-box > a {
    display: block;
    padding: 12px 0;
    width: 100%;
    text-align: left;
    cursor: pointer;
}

.bottom-menu-modal > .container > .bg .button-box > button > div,
.bottom-menu-modal > .container > .bg .button-box > a > div,
.bottom-menu-modal-post > .container .bg-bottom .button-box > a > div {
    float: left;
    width: 30px;
    text-align: center;
    margin-right: 10px;
}

.bottom-menu-modal > .container > .bg .button-box > button > div > i,
.bottom-menu-modal > .container > .bg .button-box > a > div > i,
.bottom-menu-modal-post > .container .bg-bottom .button-box > a > div > i,
.bottom-menu-modal > .container > .bg > div > div > .button-box > .button-row > div > i {
    font-size: 20px;
    color: #939393;
}

.bottom-menu-modal > .container > .bg .button-box .inactive > div > i,
.bottom-menu-modal > .container > .bg .button-box .inactive > span {
    color: #dfdfdf;
}

.bottom-menu-modal > .container > .bg .button-box > button > span,
.bottom-menu-modal > .container > .bg .button-box > a > span,
.bottom-menu-modal-post > .container .bg-bottom .button-box > a > span,
.bottom-menu-modal > .container > .bg > div > div > .button-box > .button-row > span {
    font-size: 18px;
    color: #939393;
    font-weight: 500;
}

.bottom-menu-modal > .container > .bg > div > div > .button-box > .button-row > span .added {
    font-size: 14px;
    color: #2ab529;
}

.bottom-menu-modal > .container > .bg .button-box > button img{
    width: 26px;
    margin-top: -3px;
    margin-bottom: -6px;
}

.bottom-menu-modal .wide-btn-blue {
    background: linear-gradient(111deg, #2d1974 0%, #cd8aed 100%);
    font-weight: 900;
    color: white;
    margin-bottom: 15px;
}

.bottom-menu-modal > .container .info .title {
    display: block;
    margin-bottom: 8px;
    color: #939393;
}

.bottom-menu-modal > .container .info .title i {
    color: #939393;
    font-size: 15px;
}

.bottom-menu-modal > .container .info .body {
    display: block;
    margin-bottom: 18px;
    font-size: 15px;
    color: gray;
}

.bottom-menu-modal > .container .info .body a {
    font-size: 15px;
}

.bottom-menu-modal > .container .info .body strong {
    font-size: 15px;
    color: gray;
    font-weight: 900;
}

.fa-dollar-sign-sm {
    font-size: 14px !important;
}

#sort-by-for-me, #sort-by-promos, #sort-by-posts, #sort-by-exclusive, #sort-by-activity, #sort-by-products, #sort-by-products-brand, #sort-by-alphabet, #sort-by-questions, #sort-by-reviews,
#select-categories, #select-categories-brand, #select-characteristics, #select-brands, #select-skin, #select-age, #select-pversion, #select-rating {
    display: none;
}

.button-box-report {
    height: 400px;
    overflow: hidden;
    overflow-y: scroll;
    position: relative;
}

.report-menu-gradient {
    position: absolute;
    bottom: 55px;
    height: 40px;
    width: 100%;
    background: linear-gradient(0deg, rgba(255,255,255,1) 0%, rgba(255, 255, 255, 0.54) 50%, rgba(255,255,255,0) 100%);
    z-index: 50;
}

.button-row-rule {

}

.button-row-rule .icon {
    float: left;
    width: 30px;
    text-align: center;
    margin-right: 10px;
    height: 40px;
    margin-top: 2px;
}

.button-row-rule .icon i {
    font-size: 20px;
    color: #988b9e;
}

.button-row-rule .text-col {
    padding-left: 20px;
}

.button-row-rule .text-col .text {
    font-size: 18px;
    color: #988b9e;
    font-weight: 500;
}

.products-box .product .info .product-reviews,
.product-carousel .product .info .product-reviews {
    display: flex;
    margin-top: 5px;
}


.biustore-overlay .products-box .product .info .product-reviews {
    display: table;
    width: 100%;
    margin-bottom: -5px;
}

.products .product .col .product-reviews {
    display: table;
    margin-bottom: -5px;
    margin-bottom: 5px;
}

.biustore-carousel .product .info .product-reviews,
.biustore-full .product .info .product-reviews {
    display: table;
    width: 100%;
    margin-bottom: -2px;
}

.products .product .col .product-reviews .product-star,
.product-carousel .product .info .product-reviews .product-star,
.products-box .product .info .product-reviews .product-star,
.biustore-carousel .product .info .product-reviews .product-star,
.biustore-full .product .info .product-reviews .product-star {
    padding: 0;
    float: left;
    z-index: 0;
}

.products .product .col .product-reviews .score,
.product-carousel .product .info .product-reviews .score,
.products-box .product .info .product-reviews .score,
.biustore-carousel .product .info .product-reviews .score,
.biustore-full .product .info .product-reviews .score {
    color: #A3A3A3;
    font-size: 14px;
    font-weight: 900;
    margin-left: 3px;
}

.products .product .col .product-reviews .score-base,
.product-carousel .product .info .product-reviews .score-base,
.products-box .product .info .product-reviews .score-base,
.biustore-carousel .product .info .product-reviews .score-base,
.biustore-full .product .info .product-reviews .score-base {
    color: #A3A3A3;
    font-size: 13px;
    margin-top: 1px;
    margin-left: 5px;
}


/* Content Modal */

.content-modal-btn {
    position: fixed;
    z-index: 15;
    height: 60px;
    width: 60px;
    bottom: 50px;
    right: 15px;
}

.content-modal-btn .container {
    width: 60px;
    height: 60px;
    text-align: center;
    border-radius: 50%;
    border: 4px solid white;
    position: relative;
    background: linear-gradient(111deg, #2d1974 0%, #a57bb9 100%);
    box-shadow: 2px 2px 4px #00000038;
}

.content-modal-btn .container i {
    font-size: 28px;
    color: white;
    margin-top: 17px;
}

.new-content-modal {
    width: 100%;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    overflow-y: scroll;
    overflow-x: hidden;
    z-index: 65;
    animation-duration: 600ms;
    display: none;
    z-index: 100;
}

.slide-community-content-modal {
    height: 335px;
}

.slide-community-content-modal-fb {
    height: 465px;
}

.new-content-modal > .container {
    text-align: center;
    padding: 15px;
}

.new-content-modal > .container > .bg {
    padding: 15px 15px 15px 15px;
    border-radius: 15px;
    background-color: white;
    max-width: 360px;
    margin: auto;
}

.new-content-modal > .container > .bg > span {
    font-weight: 900;
    margin-bottom: 10px;
    display: block;
}

.new-content-modal > .container > .bg > hr {
    margin-bottom: 25px;
    border-color: white;
}

.new-content-modal > .container > .bg .brand, .new-content-modal > .container > .bg .product {
    margin: auto;
    display: table;
    margin-bottom: 20px;
}

.new-content-modal > .container > .bg .fb-broswer {
    background-color: white;
    height: 100%;
    width: 100%;
    position: absolute;
    opacity: 0.75;
}

.new-content-modal > .container > .bg .open-chrome {
    margin-top: -10px;
    margin-bottom: 15px;
    padding: 15px;
    text-align: left;
    background-color: #d8ddeb;
    border-radius: 15px;
}

.new-content-modal > .container > .bg .open-chrome .row {
    display: table;
    width: 100%;
    margin-top: 15px;
}

.new-content-modal > .container > .bg .open-chrome > span {
    font-size: 14px;
    display: block;
}

.new-content-modal > .container > .bg .open-chrome .row img {
    width: 35px;
    border-radius: 50%;
    float: left;
}

.new-content-modal > .container > .bg .open-chrome .row span {
    float: left;
    font-weight: 900;
    margin: 8px;
}

.new-content-modal > .container > .bg .open-chrome .row button {
    float: right;
    border: 1px solid gray;
    padding: 6px 15px;
    border-radius: 15px;
    margin-top: 3px;
    background-color: white;
}

.new-content-modal > .container > .bg .brand > .container > img {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    float: left;
    background-color: white;
    border: 1px solid lightgray;
}

.new-content-modal > .container > .bg .brand > .container > span {
    font-family: "Space Mono", sans-serif;
    float: left;
    margin-top: 7px;
    margin-left: 8px;
    font-size: 18px;
}

.new-content-modal > .container > .bg .brand > .container > .not-brand {
    font-family: "Roboto", sans-serif;
    font-weight: 900;
    margin-top: 9px;
}

.new-content-modal > .container > .bg .product > .container > img {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    float: left;
    background-color: white;
    border: 1px solid lightgray;
}

.new-content-modal > .container > .bg .product > .container > .product {
    float: left;
    text-align: left;
    padding-left: 8px;
    margin-bottom: 5px;
    margin-top: -1px;
}

.new-content-modal > .container > .bg .product > .container > .product .brand {
    font-family: "Space Mono", sans-serif;
    font-size: 16px;
    text-transform: uppercase;
    display: block;
    margin-bottom: -3px;
}

.new-content-modal > .container > .bg .product > .container > .product .name {
    font-family: "Roboto", sans-serif;
    margin-top: 9px;
}

.new-content-modal > .container > .bg .brand-color-btn {
    color: gray;
}

.new-content-modal > .container > .bg .actions {
    display: table;
    width: 100%;
    margin-bottom: 15px;
    position: relative;
}

.new-content-modal > .container > .bg .actions .action {
    width: 33.33%;
    float: left;
    margin-bottom: 15px;
    cursor: pointer;
}

.new-content-modal > .container > .bg .actions .action:nth-child(3n+1) {
    clear: left;
}

.new-content-modal > .container > .bg .actions .action-col-2 {
    width: 50%;
}

.new-content-modal > .container > .bg .actions .action-col-2:nth-child(2n+1) {
    clear: none;
}

.new-content-modal > .container > .bg .actions .action-col-4 {
    width: 25%;
}

.new-content-modal > .container > .bg .actions .action-col-4:nth-child(2n+1),
.new-content-modal > .container > .bg .actions .action-col-4:nth-child(3n+1) {
    clear: none;
}


.new-content-modal > .container > .bg .actions .action div {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    display: block;
    margin: auto;
    margin-bottom: 10px;
    background-color: #0c007f;
}

.action-row-2 {
    padding: 0 50px;
}

.new-content-modal > .container > .bg .actions .action div i {
    font-size: 22px;
    margin-top: 14px;
    color: white;
}

.new-content-modal > .container > .bg .actions .action span {
    color: #0c007f;
    font-weight: 900;
}

.new-content-modal > .container > .bg .actions .review div {
    background-color: #E7A33E;
}

.new-content-modal > .container > .bg .actions .review span {
    color: #E7A33E;
}

.new-content-modal > .container > .bg .actions .question div {
    background-color: #FF9F9F;
}

.new-content-modal > .container > .bg .actions .question span {
    color: #FF9F9F;
}

.new-content-modal > .container > .bg .actions .photo div {
    background-color: #70B5F9;
}

.new-content-modal > .container > .bg .actions .photo span {
    color: #70B5F9;
}

.new-content-modal > .container > .bg .actions .video div {
    background-color: #7FC05E;
}

.new-content-modal > .container > .bg .actions .video span {
    color: #7FC05E;
}

.new-content-modal > .container > .bg .actions .link div {
    background-color: #6D5DF2;
}

.new-content-modal > .container > .bg .actions .link span {
    color: #6D5DF2;
}

.new-content-modal > .container > .bg .actions .text div {
    background-color: #ef5350;
}

.new-content-modal > .container > .bg .actions .text span {
    color: #ef5350;
}



/* table ing */

.tbl-ing {
    width: 100%;
}

.tbl-ing .tr-h {
    height: 35px;
    background-color: #FFE7E0;
}

.tbl-ing .tr-h > .th-l {
    text-align: left;
    color: #9F8B85;
    font-size: 12px;
    padding-left: 10px;
    font-weight: 500;
}

.tbl-ing .tr-h > .th-r {
    text-align: right;
    color: #9F8B85;
    font-size: 12px;
    padding-right: 10px;
    font-weight: 500;
}

.tbl-ing .tr-d  {
    height: 40px;
    border-bottom: 1px solid lightgrey;
    padding: 5px 0;
}

.tbl-ing .tr-d-active {
    height: 40px;
    border-bottom: none;
    padding: 5px 0;
}

.tbl-ing .tr-d-hidden > td .product {
    display: none;
}

.tbl-ing .tr-d .td-l  {
    padding-left: 5px;
}

.tbl-ing .tr-d .td-l a {
    font-size: 15px;
    display: inline-block;
}

.tbl-ing .tr-d .td-r  {
    text-align: right;
    padding-right: 10px;
}

.tbl-ing .tr-d .td-r span {
    font-size: 14px;
}

.tbl-ing .tr-d .td-r div {
    display: inline-block;
}

.tbl-ing .tr-d .td-r .td-r-a-sm {
    font-size: 12px;
    color: #6277AE;
}

.tbl-ing .tr-d .td-r .td-r-a-sm i {
    font-size: 10px;
    color: #6277AE;
}

.tbl-ing-footer {
    display: block;
    margin-top: 5px;
    font-size: 12px;
    margin-left: 5px;
    color: #A3A3A3;
}

.p-list-sm-hidden {
    display: none;
}

/* more articles */

.more .card {
    margin-bottom: 35px;
}

.more .articles {
    margin-bottom: -15px;
}

.more .articles .article {
    margin-bottom: 25px;
    min-height: 100px;
}

.more .articles .article a {
    display: flex;
    -webkit-box-align: end;
    align-items: end;
}

.more .articles .article .info {
    padding-right: 10px;
}

.more .articles .article .info .title  {
    font-size: 18px;
    font-weight: 900;
    line-height: 20px;
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow: hidden;
    margin-bottom: 5px;
}

.more .articles .article img {
    height: 105px;
    border-radius: 15px;
}

.more .articles .info .comments {
    display: inline-block;
}

.more .articles .info .comments i {
    font-size: 12px;
    color: #FF5072;
    float: left;
    margin-top: 4px;
    margin-right: 3px;
}

.more .articles .info .comments span {
    color: #FF5072;
    font-size: 12px;
    float: left;
    margin-top: 3px;
    margin-bottom: 1px;
    font-weight: 500;
}

.wide-btn-rose {
    background-color: white;
    color: #ff9f9f;
    border: 1px solid #ff9f9f;
}

.wide-btn-rose i {
    color: #ff9f9f;
}

.wide-btn-gray {
    background-color: white;
    color: #6A6868;
    border: 1px solid #707070;
}

.wide-btn-gray i {
    color: #6A6868;
}


/* explore */

.explore {
    display: table;
    width: 100%;
}

.explore .col-lg {
    width: 50%;
    float: left;
    margin-bottom: 15px;
}

.explore .col-lg .btn {
    font-weight: 900;
    color: white;
    display: block;
    border-radius: 15px;
    padding: 12px;
    cursor: pointer;
    height: 120px;
}

.explore .col-lg:nth-child(2n+1) > .container {
    padding-right: 8px;
}

.explore .col-lg:nth-child(2n+2) > .container {
    padding-left: 8px;
}

.explore .col-lg .btn > .container {
    position: relative;
    height: 100%;
}

.explore .col-lg .btn span {
    color: white;
    position: absolute;
    bottom: 0;
    text-transform: uppercase;
}

.explore .col-lg .left {
    background-color: #BDE26D;
}

.explore .col-lg .right {
    background-color: #FE8356;
}


/* Brands Cards */

.brand-cards {
    padding: 15px;
    background-color: white;
    display: table;
}

.brand-cards-no-padding {
    padding: 0;
    padding-bottom: 30px;
}

.brand-cards .card {
    margin-bottom: 60px;
}

.brand-cards .card:last-of-type {
    margin-bottom: 0;
}

.brand-cards .card {
    display: block;
    overflow: hidden;
    margin-bottom: 30px;
    border: 1px solid #dfdfdf;
    border-radius: 15px;
}

.brand-cards .card .about-box {
    position: relative;
    min-height: 100px;
    background-color: #e6e6e6;
}

.brand-cards .card .about-box .about  {
    width: 100%;
    margin-bottom: -5px;
}

.brand-cards .card .about-box .profile  {
    height: 80px;
    width: 80px;
    border-radius: 50%;
    border: 3px solid white;
    position: absolute;
    bottom: -10px;
    left: 15px;
    background-color: white;
    object-fit: cover;
}

.brand-cards .card .info  {
    background-color: #fbfbfb;
    padding: 12px 15px 20px 15px;
    height: 70px;
    border-bottom-left-radius: 15px;
    border-bottom-right-radius: 15px;
}

.brand-cards .card .info .brand {
    font-family: "Space Mono", sans-serif;
    font-size: 18px;
    color: #656565;
    display: block;
    text-transform: uppercase;
}

.brand-cards .card .info .no-brand {
    font-size: 20px;
    font-weight: 900;
    color: #656565;
    display: block;
}

.brand-cards .card .info .about {
    font-size: 12px;
    color: #868686;
    overflow: hidden;
    text-overflow: ellipsis;
    display: inline-block;
    line-height: 16px;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}

.container-body-bottom, .container-body-padding {
    padding:  0 15px 0 15px;
}


/* promo */

.new-promo-btn {
    position: fixed;
    z-index: 10;
    height: 60px;
    width: 60px;
    bottom: 50px;
    right: 15px;
}

.new-promo-btn .container {
    width: 60px;
    height: 60px;
    text-align: center;
    border-radius: 50%;
    border: 4px solid white;
    position: relative;
    background: linear-gradient(111deg, #2d1974 0%, #a57bb9 100%);
    box-shadow: 2px 2px 4px #00000038;
}

.new-promo-btn .container i {
    font-size: 28px;
    color: white;
    margin-top: 17px;
}

.onboarding-bg {
    -webkit-box-sizing: content-box;
    box-sizing: content-box;
    z-index: 999999;
    opacity: 1;
    position: fixed;
    top: 0;
    width: 100%;
    height: 100%;
    display: none;
}

.onboarding-box {
    -webkit-box-sizing: content-box;
    box-sizing: content-box;
    position: fixed;
    z-index: 999998;
    -webkit-transition: all .3s ease-out;
    -o-transition: all .3s ease-out;
    transition: all .3s ease-out;
    box-shadow: #21212180 0px 0px 0px 5000px;
    opacity: 1;
    display: none;
}

.onboarding-dialog {
    background: linear-gradient(111deg, #0c007f 0%, #7768ff 100%);
    padding: 20px;
    width: 270px;
    position: absolute;
    z-index: 9999999;
    border-radius: 20px;
    display: none;
}

.onboarding-dialog .title {
    color: white;
    display: block;
    font-size: 24px;
    font-weight: 900;
    margin-bottom: 8px;
}

.onboarding-dialog .title i {
    color: white;
    font-size: 24px;
}

.onboarding-dialog .subtitle {
    color: white;
    display: block;
    margin-bottom: 15px;
    font-weight: 500;
}

.onboarding-dialog .subtitle i {
    color: white;
    font-size: 15px;
}

.onboarding-dialog .subtitle .username {
    font-weight: 900;
    color: #ffeb3b;
}

.onboarding-dialog .next {
    float: right;
}

.onboarding-dialog .sign-in {
    display: none;
}

.onboarding-dialog .resend-confirmation, .onboarding-dialog .done {
    display: none;
    float: right;
}

.onboarding-dialog .prev, .onboarding-dialog .restart {
    color: white;
    font-weight: 500;
    float: right;
    margin: 12px 15px 0 0;
    display: none;
    cursor: pointer;
}

.onboarding-dialog .restart i {
    color: white;
    font-size: 14px;
    margin-left: 4px;
}

.onboarding-dialog .transparent-btn {
    background-color: transparent;
    color: white;
    border: 1px solid white;
}

.onboarding-dialog .solid-btn {
    border: 1px solid #555555;
    color: #606060;
}

.onboarding-dialog .arrow-down {
    border: 10px solid transparent;
    content: "";
    position: absolute;
    bottom: -20px;
    left: 132px;
    border-top-color: #FEBBA3;
    display: none;
}

.onboarding-dialog .arrow-up {
    border: 10px solid transparent;
    content: "";
    position: absolute;
    top: -20px;
    left: 132px;
    border-bottom-color: #ffa9a9;
    display: none;
}

.onboarding-exit {
    position: absolute;
    top: 15px;
    right: 15px;
}

.onboarding-dialog .exit-top {
    position: absolute;
    top: -50px;
    right: 15px;
    color: white;
    font-weight: 500;
    display: none;
    padding: 8px 13px;
    border: 1px solid white;
    border-radius: 20px;
    cursor: pointer;
}

.onboarding-dialog .exit-bottom {
    position: absolute;
    bottom: -50px;
    right: 15px;
    color: white;
    font-weight: 500;
    display: none;
    padding: 8px 13px;
    border: 1px solid white;
    border-radius: 20px;
    cursor: pointer;
}

.onboarding-dialog .exit-top i, .onboarding-dialog .exit-bottom i {
    color: white;
    margin-left: 5px;
}

.overflow-hidden {
    overflow-y: hidden;
}

.onboarding-dialog .sign-up-show {
    display: inline-block;
}


/* biustore full */

.biustore-full {
    padding: 0 15px;
    margin-bottom: 10px;
}

.biustore-full .product {
    width: 100%;
    overflow: hidden;
}

.biustore-full .product .container {
    border: 1px solid #e3e6e8;
    border-radius: 15px;
    overflow: hidden;
}

.biustore-full .product .container .images-container {
    width: 100%;
    height: 290px;
    background-size: cover;
    overflow: hidden;
    background-color: #f7f7f7;
    position: relative;
}

.biustore-full .product .container .images-container .biustore-image {
    display: none;
    width: 100%;
    height: 290px;
    margin: auto;
}

.biustore-full .product .container .image {
    display: none;
    width: 100%;
    height: 280px;
    margin: auto;
}

.biustore-full .product .container .images-container .image-floor {
    position: absolute;
    height: 27px;
    width: 100%;
    bottom: 0;
    background-color: #f7f7f7;
}

.biustore-full .product .container .images-container .active {
    display: block;
}

.biustore-full .product .container .biustore-image .profile {
    width: 220px;
    margin: auto;
    display: block;
    position: relative;
    z-index: 4;
}

.biustore-full .product .container .kit-image .profile {
    width: 293px;
}

.biustore-full .product .container .image .profile {
    height: 280px;
    margin: auto;
    display: block;
}

.biustore-full .product .container .info {
    background-color: #f7f7f7;
    padding: 0px 10px 10px 10px;
    /*min-height: 152px;*/
    position: relative;
}

.biustore-full .product .container .info .top {

}

.biustore-full .product .container .info .top .general {

}

.biustore-full .product .container .info .top .general .brand {
    display: block;
    margin-bottom: 4px;
}

.biustore-full .product .container .info .top .general .brand .text {
    font-family: "Space Mono", sans-serif;
    font-size: 16px;
    line-height: 18px;
    color: #5C5C5C;
    text-transform: uppercase;
    display: inline-block;
}

.biustore-full .product .container .info .top .general .name {
    display: block;
    margin-bottom: 5px;
}

.biustore-full .product .container .info .top .general .name .text {
    font-weight: 200;
    font-size: 18px;
    line-height: 20px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.biustore-full .product .container .info .top .general .category {
    font-size: 13px;
    color: #b2b2b2;
    display: block;
    line-height: 11px;
    margin-bottom: 8px;
}

.biustore-full .product .container .info .top .general .products-count,
.brand-related-card .bg .products-count {
    font-size: 13px;
    color: #5c5c5c;
    display: inline-block;
    margin-bottom: 5px;
    background-color: #ffffff;
    padding: 5px 10px;
    border-radius: 15px;
    margin-top: 1px;
    border: 1px solid #8d8d8d;
}

.biustore-full .product .container .info .top .general .description {
    font-size: 14px;
    color: #b2b2b2;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    line-height: 20px;
    margin-bottom: 8px;
}

.biustore-full .product .container .info .top .price {

}

.biustore-full .product .container .info .versions-row {
    margin-top: 10px;
    margin-bottom: -10px;
}

.biustore-full .product .container .info .versions-row-text {
    overflow: hidden;
}

.biustore-full .product .container .info .versions-row-text .version {
    margin-right: 5px;
    display: inline-block;
}

.biustore-full .product .container .info .versions-row-text .version-container {
    display: inline-block;
    margin-bottom: 5px;
}

.biustore-full .product .container .info .versions-row-image {
    overflow: hidden;
}

.biustore-full .product .container .info .versions-row-image .version-container-img {
    display: inline-block;
}

.biustore-full .product .container .info .versions-row-image .version-container-img .version {
    display: inline-block;
}



.biustore-full .product .container .info .versions-row .version .bg {
    background-color: #ffffff;
    border: 1px solid #8d8d8d;
    padding: 1px 11px;
    border-radius: 10px;
}

.biustore-full .product .container .info .versions-row .version .active {
    background-color: #FFA3A3 !important;
    border: 1px solid #ffa3a3 !important;
}

.biustore-full .product .container .info .versions-row .version .bg .txt {
    color: #8d8d8d;
    font-size: 13px;
    margin: 3px 0 2px 0;
    display: block;
}

.biustore-full .product .container .info .versions-row .version .active .txt {
    color: #ffffff;
}

.biustore-full .product .container .info .versions-row .version .version-img {
    display: inline-block;
}

.biustore-full .product .container .info .versions-row .version .version-img .bg {
    background-color: #ffffff;
    border: 1px solid #c3c3c3;
    padding: 5px 8px 5px 5px;
    border-radius: 10px;
    display: table;
}

.biustore-full .product .container .info .versions-row .version .version-img .bg .img {
    width: 20px;
    float: left;
    border-radius: 5px;
    border: 1px solid #ffffff8f;
}

.biustore-full .product .container .info .versions-row .version .version-img .bg .text {
    color: #8d8d8d;
    font-size: 13px;
    margin: 4px 0 2px 5px;
    float: left;
}

.biustore-full .product .container .info .versions-row .version .version-img .active .text {
    color: white;
}

.biustore-full .product .container .info .see-more-versions {
    font-size: 13px;
    color: #898989;
    text-decoration: underline;
    display: none;
    margin: 15px 0 -8px 0;
    display: none;
}

.biustore-full .product .container .info .see-more-versions-img {
    margin-top: 20px;
}

.biustore-full .product .container .info .price {
    margin-top: 20px;
    max-width: 180px;
}

.biustore-full .product .container .info .kit-price {
    margin-top: 10px;
}

.biustore-full .product .container .info .more-versions-price {
    margin-top: 25px;
}

.biustore-full .product .container .info .price .prices-loader {
    padding: 9px 12px;
    border-radius: 10px;
    height: 18px;
    background: linear-gradient(111deg, #0c007f 0%, #7768ff 100%);
    text-align: center;
}

.biustore-full .product .container .info .price .prices-loader .lds-ellipsis-wh div {
    top: 3px;
    height: 12px;
    width: 12px;
}

.biustore-full .product .container .info .price .prices-container {

}

.biustore-full .product .container .info .price .prices-container .price-btn-wrapper {

}

.biustore-full .product .container .info .price .prices-container .price-btn-wrapper .price-btn {
    padding: 9px 12px;
    border-radius: 10px;
    display: none;
    height: 18px;
    background: linear-gradient(111deg, #0c007f 0%, #7768ff 100%);
}

.biustore-full .product .container .info .price .prices-container .price-btn-wrapper .active {
    display: block;
}

.biustore-full .product .container .info .price .prices-container .price-btn-wrapper .price-btn .add-to {
    font-size: 13px;
    color: #ffffff;
    float: left;
    margin-top: 1px;
    font-weight: 900;
}

.biustore-full .product .container .info .price .prices-container .price-btn-wrapper .price-btn .right {
    float: right;
}

.biustore-full .product .container .info .price .prices-container .price-btn-wrapper .price-btn .right .currency {
    color: #ffffff;
    font-size: 10px;
    display: inline-block;
    margin-top: 5px;
    float: right;
    margin-right: 2px;
}

.biustore-full .product .container .info .price .prices-container .price-btn-wrapper .price-btn .right .symbol {
    color: #ffffff;
    font-size: 12px;
    display: inline-block;
    margin-top: 3px;
    float: right;
}

.biustore-full .product .container .info .price .prices-container .price-btn-wrapper .price-btn .right .amount {
    color: #ffffff;
    font-weight: 900;
    display: inline-block;
    float: right;
}

.pnl-no-margin {
    margin-bottom: 0;
}

.biustore-divider {
    background-color: #f0eef3;
    height: 7px;
    width: 100%;
}

.biustore-brand-cards { height: 285px; }
.biustore-brand-cards .card { height: 280px; }
.biustore-brand-cards .card .bg { height: 108px; }
.biustore-brand-cards .card .bg .brand-name { -webkit-line-clamp: 1; }
.biustore-brand-cards .card .bg .products-count { margin-top: 8px; }

.biustore-brand-cards .card-more { height: 250px; }
.biustore-brand-cards .card-more span { margin-top: 90px; }

.root .ribbon-sign-in  {
    position: fixed;
    background: linear-gradient(111deg, #ff6e6e 0%, #ff9e9e 100%);
    width: 100%;
    z-index: 60;
    bottom: 0;
    display: none;
}

.root .ribbon-biutesting {
    display: block;
    position: initial;
    bottom: initial;
    background: linear-gradient(111deg, #8bc34a 0%, #4caf50 100%);
}

.root .ribbon-sign-in > .container {
    position: relative;
    padding: 20px 20px 30px 20px;
}

.root .ribbon-sign-in > .container .close-ribbon-sign-in {
    position: absolute;
    right: 13px;
    width: 30px;
    height: 30px;
    text-align: center;
    top: 12px;
}

.root .ribbon-sign-in > .container .close-ribbon-sign-in i {
    color: #e2b1fb;
    font-size: 22px;
    margin-top: 4px;
}


.root .ribbon-sign-in .primary-column-ribbon .top {
    display: block;
    font-weight: 900;
    font-size: 22px;
    color: white;
    margin-bottom: 2px;
}

.root .ribbon-sign-in .primary-column-ribbon .bottom {
    display: block;
    color: white;
    font-size: 14px;
}

.root .ribbon-sign-in .sidebar-column-ribbon {
    padding-top: 15px;
}

.root .ribbon-sign-in .sidebar-column-ribbon .transparent-btn {
    border: 1px solid white;
    background-color: transparent;
    color: white;
    margin-right: 5px;
}

.root .ribbon-sign-in .sidebar-column-ribbon .solid-btn {
    border: 1px solid #ff9695;
    color: #ff7879;
}

.root .ribbon-biutesting .sidebar-column-ribbon .solid-btn {
    border: 1px solid #64b64f;
    color: #69b84e;
}

.about-us-modal {

}

.about-us-modal .color-panel {
    text-align: center;
}

.about-us-modal .color-panel-1 {
    background-color: #f7e8e1;
}

.about-us-modal .color-panel-2 {
    background-color: #c8e6fd;
}

.about-us-modal .color-panel-3 {
    background-color: #f6e7e1;
}

.about-us-modal .color-panel-4 {
    background-color: #FFA5A5;
}

.about-us-modal .color-panel-5 {
    background-color: #fbc6c6;
}

.about-us-modal .color-panel-6 {
    background-color: #4caf50;
}

.about-us-modal .color-panel .container {
    padding: 60px 0 30px 0;
}

.about-us-modal .color-panel .container .title {
    font-size: 28px;
    font-weight: 900;
    display: block;
    max-width: 300px;
    margin: auto;
    color: #52375e;
    margin-bottom: 10px;
}

.about-us-modal .color-panel .container .description {
    display: block;
    max-width: 280px;
    margin: auto;
    color: #52375e;
    margin-bottom: 20px;
    line-height: 22px;
}

.about-us-modal .color-panel .container .image {
    width: 300px;
    height: 195px;
    margin: auto;
    margin-bottom: 30px;
}

.about-us-modal .color-panel .container .image img {
    width: 100%;
}

.about-us-modal .color-panel .container .sub-row {
    margin-top: 60px;
}

.about-us-modal .color-panel .container .sub {
    margin-bottom: 30px;
}

.about-us-modal .color-panel .container .sub .subtitle {
    display: block;
    max-width: 320px;
    margin: auto;
    color: #486378;
    font-weight: 900;
    font-size: 24px;
    margin-bottom: 10px;
}

.about-us-modal .color-panel .container .sub .subtitle i {
    color: #486378;
    font-size: 24px;
}

.about-us-modal .color-panel .container .sub .subdescription {
    display: block;
    max-width: 280px;
    margin: auto;
    color: #486378;
    line-height: 22px;
}

.privacy-container .container {
    text-align: left;
    padding: 30px 30px 150px 30px;
}

.privacy-container .title {
    font-size: 28px;
    font-weight: 900;
    display: block;
    margin: auto;
    color: #52375e;
    margin-bottom: 30px;
}

.privacy-container .txt-subtitle {
    font-size: 20px;
    font-weight: 900;
    display: block;
    margin: auto;
    color: #52375e;
    margin-bottom: 10px;
}

.privacy-container .txt-about {
    font-size: 16px;
    display: block;
    margin: auto;
    color: #52375e;
    margin-bottom: 10px;
}

.privacy-container .txt-about strong {
    color: #52375e;
}

.privacy-container ul {
    margin: 20px 0;
}

.privacy-container ul li {
    font-size: 16px;
    margin-left: 20px;
    color: #52375e;
    margin-bottom: 5px;
}

.question-notif-container,
.review-notif-container {
    overflow: auto;
    white-space: nowrap;
    -webkit-overflow-scrolling: touch;
    overflow-y: hidden;
    padding: 0 5px 15px 15px;
}

.question-notif-container .question-notif-card,
.review-notif-container .review-notif-card {
    display: inline-block;
    width: 198px;
    background-color: #FCF2EE;
    padding: 15px 15px 0 15px;
    border-radius: 15px;
    margin-right: 7px;
    min-height: 305px;
    vertical-align: top;
    border: 1px solid #dfdfdf;
    cursor: pointer;
}

.review-notif-container .review-notif-card {
    min-height: 268px;
}

.bottom-menu-modal-post .question-notif-container .question-notif-card .title {
    color: #454545;
    display: -webkit-box;
}

.bottom-menu-modal-post .question-notif-container .question-notif-card {
    min-height: 255px;
}

.question-notif-container .question-notif-card .header,
.review-notif-container .review-notif-card .header {
    height: 42px;
    margin-bottom: 10px;
}

.question-notif-container .question-notif-card .header .image,
.review-notif-container .review-notif-card .header .image {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    float: left;
    border: 1px solid #e1e1e1;
    background-color: white;
    overflow: hidden;
}

.question-notif-container .question-notif-card .header .image img,
.review-notif-container .review-notif-card .header .image img {
    width: 100%;
}

.question-notif-container .question-notif-card .header .info-product,
.review-notif-container .review-notif-card .header .info-product {
    padding-left: 10px;
    float: left;
    margin-top: -4px;
    width: 145px;
    overflow: hidden;
}

.question-notif-container .question-notif-card .header .info-product .brand,
.review-notif-container .review-notif-card .header .info-product .brand {
    font-family: "Space Mono", sans-serif;
    font-size: 14px;
    font-weight: 900;
    color: #6f6f6f;
    display: block;
    margin-bottom: -3px;
}

.question-notif-container .question-notif-card .header .info-product .name,
.review-notif-container .review-notif-card .header .info-product .name {
    font-size: 14px;
    color: #6f6f6f;
    display: block;
}

.question-notif-container .question-notif-card .header .info-product .type,
.review-notif-container .review-notif-card .header .info-product .type {
    font-size: 12px;
    color: #6f6f6f;
    display: block;
}

.question-notif-container .question-notif-card .header .info,
.review-notif-container .review-notif-card .header .info {
    padding-left: 10px;
    padding-top: 2px;
    float: left;
    width: 145px;
    overflow: hidden;
}

.question-notif-container .question-notif-card .header .info .brand,
.review-notif-container .review-notif-card .header .info .brand {
    font-family: "Space Mono", sans-serif;
    font-size: 16px;
    font-weight: 900;
    color: #6f6f6f;
    display: block;
    margin-bottom: -3px;
}

.question-notif-container .question-notif-card .header .info .name,
.review-notif-container .review-notif-card .header .info .name {
    font-size: 14px;
    font-weight: 900;
    color: #6f6f6f;
    display: block;
}

.question-notif-container .question-notif-card .header .info .type,
.review-notif-container .review-notif-card .header .info .type {
    font-size: 13px;
    color: #6f6f6f;
    display: block;
}

.question-notif-container .question-notif-card .question-group {
    padding: 2px 0 7px 0;
}

.question-notif-container .question-notif-card .question-group .bg {
    background-color: white;
    border: 1px solid #aba19e;
    padding: 1px 11px;
    border-radius: 15px;
    display: inline-block;
    margin-left: -3px;
    max-height: 20px;
}

.question-notif-container .question-notif-card .question-group .bg .text {
    color: #868180;
    font-size: 13px;
    margin: 2px 0 2px 0;
    display: block;
}

.question-notif-container .question-notif-card .title,
.review-notif-container .review-notif-card .title {
    font-size: 18px;
    font-weight: 900;
    width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    white-space: initial;
    margin-bottom: 7px;
    line-height: 20px;
}

.question-notif-container .question-notif-card .body,
.review-notif-container .review-notif-card .body {
    font-size: 14px;
    color: #9B9694;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 5;
    -webkit-box-orient: vertical;
    white-space: initial;
}

.review-notif-container .review-notif-card .body {
    -webkit-line-clamp: 3;
}

.question-notif-container .question-notif-card .btn,
.review-notif-container .review-notif-card .btn {
    padding-top: 15px;
}

.question-notif-container .question-notif-card .btn .btn-md {

}

.review-notif-container .top-row, .question-cards .question-card .top-row {
    display: table;
    width: 100%;
    margin-bottom: 5px;
}

.review-notif-container .top-row .star {
    float: left;
    padding: 0;
    z-index: 0;
    margin-right: 2px;
}

.review-notif-container .top-row .review-number {
    color: #FEC109;
    font-weight: 900;
    float: left;
    margin-top: -2px;
    font-size: 19px;
}

.review-notif-container .top-row i {
    color: #C4B6B0;
    float: right;
}

.review-notif-container .top-row .fa-camera, .question-cards .question-card .top-row .fa-camera {
    float: right;
    color: #C4B6B0;
    font-size: 18px;
}

.home-brand-panel {
    background-color: #ffffffa8;
    position: relative;
    border-bottom: 1px solid #f6e1d9;
}

.home-brand-panel .brand-panel {
    background-color: #F9EFEC;
}

.home-brand-panel .brand-panel .btn {
    height: 45px;
}

.home-brand-panel .brand-panel .text {
    font-size: 15px;
    color: #B49A92;
    font-weight: 900;
    margin-top: 14px;
    display: inline-block;
    margin-left: 15px;
}

.home-brand-panel .brand-panel .text i {
    font-size: 14px;
    color: #B49A92;
    margin-right: 4px;
}

.home-brand-panel .brand-panel .text-right {
    color: #B49A92;
    font-weight: 900;
    margin-top: 9px;
    float: right;
    margin-right: 10px;
    padding: 6px 12px;
    border: 1px solid #B49A92;
    border-radius: 15px;
    font-size: 13px;
    background-color: white;
}

.home-brand-panel .brand-panel .text-right i {
    font-size: 12px;
    color: #B49A92;
}

.brand-segments, .brand-clicks {
    padding: 0 15px 8px 15px;
    display: none;
}

.brand-panel .segments, .brand-panel .clicks {
    width: 100%;
}

.brand-panel .segments .segment-row, .brand-panel .clicks .click-row {
    height: 20px;
}

.brand-panel .segments .curious {
    color: #e59d7b;
}

.brand-panel .segments .lead {
    color: #80BAC4;
}

.brand-panel .segments .in-the-know {
    color: #5D78AD;
}

.brand-panel .segments .ambassador {
    color: #444D5F;
}

.brand-panel .segments .segment-row .segment {
    font-size: 15px;
    font-weight: 900;
}

.brand-panel .segments .segment-row .users {
    text-align: right;
    font-size: 15px;
    font-weight: 900;
}

.brand-panel .segments .segment-row .growth {
    text-align: right;
    font-size: 15px;
    font-weight: 900;
    color: #b49a91;
}

.brand-panel .clicks .click-row .source {
    color: #B49A92;
    font-size: 15px;
    text-align: left;
    font-weight: 500;
}

.brand-panel .clicks .click-row .source a {
    color: #B49A92;
    font-size: 15px;
    text-align: left;
    font-weight: 500;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.brand-panel .clicks .click-row .source a strong {
    font-weight: 900;
    color: #B49A92;
    font-size: 15px;
}

.brand-panel .clicks .click-row .number {
    color: #B49A92;
    font-size: 15px;
    text-align: right;
}

.brand-panel .footer {
    height: 18px;
    padding-top: 5px;
    border-top: 1px solid #d3beb6;
    margin-top: 5px;
}

.brand-panel .footer .left {
    text-align: left;
    font-size: 14px;
    font-weight: 500;
    color: #B49A92;
    float: left;
    cursor: pointer;
}

.brand-panel .footer .left i {
    font-size: 12px;
    color: #B49A92;
    float: left;
    margin: 3px 4px 0 0;
}

.brand-panel .footer .right {
    text-align: right;
    font-size: 14px;
    font-weight: 500;
    color: #B49A92;
    float: right;
}

.brand-clicks  {
    text-align: right;
    font-size: 14px;
    font-weight: 900;
    color: #B49A92;
}

.what-to-do, .user-milestones {
    background-color: white;
    padding: 20px 0 20px 0;
    margin-bottom: 7px;
    position: relative;
}

.what-to-do .section-title, .user-milestones .section-title  {
    margin: 0 15px 15px 15px;
}

.what-to-do .section-title .title, .user-milestones .section-title .title {
    margin-left: 0;
}

.what-to-do .section-title .subtitle, .user-milestones .section-title .subtitle {
    margin-left: 0;
}

.what-to-do .carousel, .user-milestones .carousel {
    display: flex;
    flex-wrap: nowrap;
    overflow: auto;
    padding: 0 15px;
    -webkit-overflow-scrolling: touch;
    overflow-y: hidden;
    height: 250px;
}

.what-to-do .carousel-milestones, .user-milestones .carousel-milestones {
    height: 230px;
}

.what-to-do .carousel .card, .user-milestones .carousel .card {
    width: 285px;
    display: inline-block;
    height: 250px;
}

.what-to-do .carousel .card .container, .user-milestones .carousel .card .container {
    padding-right: 10px;
}

.what-to-do .carousel .card .container .img, .user-milestones .carousel .card .container .img {
    background-color: #ebd8f7;
    height: 110px;
    width: 270px;
    border-radius: 15px;
    overflow: hidden;
}

.what-to-do .carousel .card .container .img img, .user-milestones .carousel .card .container .img img {
    width: 100%;
}

.what-to-do .carousel .card .container .text, .user-milestones .carousel .card .container .text {
    padding-top: 10px;
    padding: 10px 0 0 3px;
}

.what-to-do .carousel .card .container .text .title, .user-milestones .carousel .card .container .text .title {
    font-size: 19px;
    font-weight: 900;
    display: block;
    line-height: 20px;
    margin-bottom: 5px;
}

.what-to-do .carousel .card .container .text .subtitle, .user-milestones .carousel .card .container .text .subtitle {
    font-size: 14px;
    display: block;
    line-height: 16px;
    color: #808080;
}

.what-to-do .carousel .card .container .text .subtitle i, .user-milestones .carousel .card .container .text .subtitle i {
    font-size: 14px;
    color: #808080;
}

.what-to-do .card .container .text .btn-md, .user-milestones .card .container .text .btn-md {
    margin-top: 10px;
}

.sign-in-box {
    margin-bottom: 10px;
    margin-top: 10px;
}

.sign-in-box .bg {
    background: linear-gradient(111deg, #190C8E 0%, #7060F6 100%);
    border-radius: 10px;
    padding: 15px;
}

.sign-in-box .bg .title {
    display: block;
    color: white;
    font-size: 24px;
    font-weight: 900;
    margin-bottom: 5px;
}

.sign-in-box .bg .subtitle {
    display: block;
    color: white;
    font-size: 14px;
    margin-bottom: 15px;
}

.sign-in-box .bg .transparent-btn {
    border: 1px solid white;
    background-color: transparent;
    color: white;
    margin-right: 5px;
}

.select-interests-container {
    margin: 0 15px;
}

.select-interests-img {
    background-color: #FFA5A5;
    height: 150px;
    width: 100%;
    border-radius: 15px;
    overflow: hidden;
}

.select-interests-img img {
    width: 100%;
}

.communities {
    padding: 0 15px 30px 15px;
}

.communities .community-container {
    margin-bottom: 30px;
}

.communities .community-container .header {
    padding-bottom: 10px;
    border-bottom: 1px solid #ffa5a5;
    margin-bottom: 7px;
}

.communities .community-container .header .name {
    color: #FFA5A5;
    font-size: 22px;
    font-weight: 900;
}

.communities .community-container .rows {
    max-height: 265px;
    overflow: hidden;
}

.communities .community-container .footer {

}

.communities .community-container .footer .btn-md {

}

.select-user-interests {
    background-color: white;
}

.select-user-interests .bg {
    background: linear-gradient(111deg, #0c007f 0%, #7768ff 100%);
    width: 100%;
}

.select-user-interests .bg .container {
    padding: 20px;
}

.select-user-interests .title {
    color: white;
    display: block;
    font-size: 24px;
    font-weight: 900;
    margin-bottom: 8px;
}

.select-user-interests .title i {
    color: white;
    font-size: 24px;
}

.select-user-interests .subtitle {
    color: white;
    display: block;
    margin-bottom: 5px;
    font-weight: 500;
}

.interests {
    background-color: white;
    padding: 15px 15px 0 15px;
    margin-bottom: 7px;
}

.interests .title {
    font-size: 21px;
    font-weight: 900;
    color: #ff9f9f;
    display: block;
}

.interests .buttons {
    overflow: hidden;
    padding: 10px 0;
}

.interests .button-container {
    height: 143px;
    overflow: hidden;
}

.interests .buttons a {
    font-size: 16px;
    padding: 10px 12px;
    border: 1px solid #8d7398;
    color: #886b97;
    border-radius: 20px;
    margin-bottom: 8px;
    margin-right: 4px;
    font-weight: 500;
}

.interest-container {
    background-color: #f0eef3;
}

.interests .interest-cat {

}

.interests .interest-subcat {
    background-color: #FFFDE7;
}

.interests .interest-subsubcat {
    background-color: #E8F5E9;
}

.interests .buttons .active {
    background-color: #ff9f9f;
    color: white;
    border: 1px solid #ff9f9f;
}

.interests .footer {
    text-align: center;
    border-top: 1px solid #b4b3b5;
    padding: 15px 0 18px 0;
    margin-top: 5px;
}

.interests .footer-none {
    border: none;
    margin-top: 0;
}

.interests .footer span {
    font-weight: 500;
    color: #876b97;
    cursor: pointer;
}

.interests .footer i {
    font-size: 12px;
    color: #876b97;
}

.interests-footer {
    background-color: white;
    padding: 30px 15px 40px 15px;
    text-align: center;
}

.user-interests {
    background-color: white;
}

.user-interests .processing {
    text-align: center;
    padding: 0 20px 0px 20px;
}

.user-interests .processing i {
    font-size: 62px;
    margin-top: 40px;
    color: #988b9e;
}

.user-interests .processing .title {
    display: block;
    margin-top: 15px;
    font-size: 20px;
    font-weight: 900;
    color: #988b9e;
}

.user-interests .processing .subtitle {
    display: block;
    margin-top: 15px;
    font-size: 16px;
    color: #988b9e;
}

.user-interests .processing .lds-ellipsis-color {
    height: 30px;
}

.user-interests .processing .lds-ellipsis-color div {
    top: 31px;
}

/* hero */

.hero {
    width: 100%;
    position: relative;
    text-align: center;
    background-color: #F0EEF3;
    padding-top: 50px;
    padding-bottom: 10px;
    min-height: 495px;
}

.hero .menu {
    display: flex;
    flex-wrap: nowrap;
    overflow: auto;
    padding: 0 15px;
    -webkit-overflow-scrolling: touch;
    overflow-y: hidden;
    height: 40px;
    margin: 0 0 0 0;
    background-color: white;
    align-items: center;
}

.hero .menu a {
    flex: 0 0 auto;
    margin-right: 20px;
    position: relative;
    color: #0C057F;
    font-size: 15px;
    font-weight: 500;
}

.hero .carousel {

}

.hero .carousel .container {
    width: 100%;
    margin: auto;
    display: flex;
    justify-content: center;
}

.hero .carousel .card {
    width: 100%;
    overflow: hidden;
    display: flex;
    background-color: #dbd4df;
}

.hero .carousel .card img {
    width: 100%;
    object-fit: cover;
}

.hero .carousel .illus-card {
    width: 100%;
    margin: 45px 15px 15px 15px;
    overflow: hidden;
    border-radius: 10px;
}

.hero .carousel .illus-card-1 {
    background-color: #C8E6FD;
}

.hero .carousel .illus-card-2 {
    background-color: #DFC5F7;
}

.hero .carousel .illus-card-3 {
    background-color: #D98AFF;
}

.hero .carousel .illus-card .top {
    width: 100%;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    overflow: hidden;
}

.hero .carousel .illus-card .top img {
    width: 100%;
}

.hero .carousel .illus-card .bottom {
    padding: 0 20px 20px 20px;
}

.hero .carousel .illus-card .bottom .info-text {
    color: #432985;
    display: block;
    font-size: 18px;
    max-width: 240px;
    margin: auto;
    margin-bottom: 15px;
}

.hero .carousel .illus-card .bottom .text-white {
    color: white;
}

.hero .carousel .illus-card .bottom .info-text .bold {
    font-weight: 900;
    color: #FF5F98;
    font-size: 18px;
}

.hero .carousel .illus-card .bottom .info-text .bold-purple {
    font-weight: 900;
    color: #432985;
    font-size: 18px;
}

.hero .carousel .illus-card .bottom .text-white .bold {
    font-weight: 900;
    font-size: 18px;
    color: white;
}

.hero .carousel .illus-card .bottom .btn-md {
    border: 1px solid #432985;
    color: #432985;
}

.flickity-page-dots .dot {
    display: inline-block;
    width: 8px;
    height: 8px;
    margin: 0 5px;
    background: #988B9E;
    border-radius: 50%;
    opacity: .25;
    cursor: pointer;
}

.flickity-button {
    opacity: 0.4;
}

.flickity-prev-next-button {
    top: 115px; 
}

.hero .carousel-bg {

}

.hero .menu-cards-container {
    position: absolute;
    top: 365px;
    width: 100%;
}

.hero .menu-cards,
.md-cards {
    display: flex;
    flex-wrap: nowrap;
    overflow: auto;
    padding: 0 10px;
    -webkit-overflow-scrolling: touch;
    overflow-y: hidden;
    height: 180px;
    background: linear-gradient(1deg,#f0eef2 60%, #f0eef2ab 80%, #f0eef230 90%, transparent);
}

.md-cards {
    background: transparent;
}

.hero .menu-cards .card,
.md-cards .card {
    height: 180px;
    width: 135px;
    background-color: white;
    border-radius: 10px;
    /* padding: 15px; */
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    align-content: flex-start;
    margin-right: 10px;
}

.hero .menu-cards .card-sign-up,
.md-cards .card-sign-up {
    width: 225px;
    justify-content: center;
}

.hero .menu-cards .card-sign-up .info,
.md-cards .card-sign-up .info {
    width: 195px;
    text-align: left;
    display: flex;
    flex-direction: column;
    margin-bottom: 15px;
    padding: 0 15px;
}

.hero .menu-cards .card-sign-up .info .title,
.md-cards .card-sign-up .info .title {
    font-weight: 900;
    font-size: 18px;
    color: #432985;
}

.hero .menu-cards .card-sign-up .info .subtitle,
.md-cards .card-sign-up .info .subtitle {
    color: #432985;
    font-size: 14px;
}

.hero .menu-cards .card-sign-up .btns,
.md-cards .card-sign-up .btns {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 0 15px;
}

.hero .menu-cards .card-sign-up .btns .top,
.md-cards .card-sign-up .btns .top {
    margin-bottom: 15px;
}

.hero .menu-cards .card-sign-up .btns .top .btn-md,
.md-cards .card-sign-up .btns .top .btn-md {
    border: none;
    background: linear-gradient(111deg, #2d1974 0%, #cd8aed 100%);
    color: white;
    padding: 13px 20px;
    border-radius: 25px;
}

.hero .menu-cards .card-sign-up .btns .bottom,
.md-cards .card-sign-up .btns .bottom {
    padding-left: 5px;
}

.hero .menu-cards .card-sign-up .btns .bottom a,
.md-cards .card-sign-up .btns .bottom a {
    color: #432985;
    font-weight: 500;
}

.hero .menu-cards .card > .top,
.md-cards .card > .top {
    width: 135px;
    height: 45px;
}

.md-cards .card > .top {
    background-color: #f0eef3;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    display: flex;
    align-items: center;
}

.hero .menu-cards .card .top .container,
.md-cards .card .top .container {
    padding: 7px 10px;
    text-align: left;
}

.hero .menu-cards .card .top .container .title,
.md-cards .card .top .container .title {
    font-size: 14px;
    line-height: 15px;
    color: #432985;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.hero .menu-cards .card > .bottom,
.md-cards .card > .bottom {
    height: 135px;
    width: 135px;
    background-color: #dbd4df;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
    overflow: hidden;
}

.hero .menu-cards .card .bottom .container,
.md-cards .card .bottom .container {
    width: 135px;
    height: 135px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.hero .menu-cards .card .bottom .container img,
.md-cards .card .bottom .container img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.hero .menu-cards .card .bottom .container .brand-img {
    height: 100px;
    width: 100px;
    border-radius: 50%;
    border: 3px solid white;
    box-shadow: 2px 2px 4px #00000038;
}

.md-cards {

}

.menu-white-bg {
    background-color: white;
    padding: 10px 0 0 0;
    margin-bottom: 7px;
}

.menu-white-bg-signed-in {
    margin-bottom: 7px;
}

.menu-white-bg .menu {
    display: flex;
    flex-wrap: nowrap;
    overflow: auto;
    padding: 0 15px;
    -webkit-overflow-scrolling: touch;
    overflow-y: hidden;
    height: 45px;
    padding: 0px 0 10px 15px;
}

.hero .menu .btn-md,
.menu-white-bg .menu .btn-md {
    color: white;
    border: 1px solid #0C087F;
    background-color: initial;
    margin-right: 5px;
    display: inline-flex;
}

.menu-white-bg .menu .btn-md {
    border: 1px solid #8d7399;
    color: #8d7399;
}

.hero .menu .btn-md i,
.menu-white-bg .menu .btn-md i {
    color: #8d7399;
    margin: 2px 6px 0 0;
}

.menu-white-bg .menu .btn-md i {
    color: #8d7399;
}

.hero .menu .btn-md span,
.menu-white-bg .btn-md span {
    color: #8d7399;
}

.menu-white-bg .btn-md span {
    color: #8d7399;
}

.hero-signed-in .menu .btn-md span,
.hero-signed-in .menu .btn-md i {
    color: #0c0a7f;
}

.hero .text {
    margin: auto;
    max-width: 320px;
    padding-top: 70px;
    margin-bottom: 20px;
}

.hero .text .slogan {
    font-size: 30px;
    font-weight: 900;
    color: #0C057F;
    display: block;
    max-width: 300px;
    margin: auto;
    margin-bottom: 20px;
    text-shadow: -2px 2px 0px #faf0ff;
}

.hero .text .btn-md {
    background-color: initial;
    border: 1px solid #0C057F;
    color: #0C057F;
    padding: 10px 20px;
}

.hero .text > .btn-md i {
    color: #0C057F;
}

.hero .search {
    width: 100%;
}

.hero-signed-in .search {
    position: absolute;
    z-index: 10;
    top: 120px;
}

.hero .search .search-modal-hero-btn {
    padding: 12px 20px;
    font-weight: 900;
    font-size: 18px;
    background-color: #FFFFFF;
    border-radius: 20px;
    display: table;
    margin: auto;
    margin-bottom: 10px;
    color: #0C057F;
}

.hero .search .search-modal-hero-btn i {
    color: #0C057F;
}

.hero .search .search-modal-hero-btn .wrap {
    font-size: 20px;
    color: #0C057F;
}

.hero .search button i {
    color: #5679b2;
}

.hero .img-signed-out {
    overflow: hidden;
    width: 100%;
    margin-bottom: -50px;
}

.hero .img-signed-out img {
    width: 100%;
    display: block;
}

.hero .img-signed-in {
    overflow: hidden;
    width: 100%;
    min-height: 130px;
    z-index: 0;
    position: absolute;
    top: 100px;
}

.hero .img-signed-in img {
    width: 100%;
    display: block;
}

.menu-modal .menu-nav .footer {
    padding: 20px 15px 15px 10px;
}

.menu-modal .menu-nav .footer .nav {
    border-top: 1px solid #c8c1cb;
    padding-top: 20px;
}

.menu-modal .menu-nav .footer .nav a,
.menu-modal .menu-nav .footer .nav span {
    font-size: 13px;
    margin: 0 5px 8px 0;
    display: inline-block;
    color: #988b9e;
    cursor: pointer;
}

.menu-modal .menu-nav .footer .nav a i {
    color: #988b9e;
}



.bottom-menu-modal > .container > .bg .menu-container {
    padding: 0;
    padding-bottom: 20px;
    max-height: 400px;
    overflow: hidden;
    overflow-y: scroll;
}

.bottom-menu-modal > .container > .bg .menu-container .menu-box {
    border-radius: 10px;
    background-color: #fbfbfb;
    border: 1px solid #D5D9D9;
    overflow: hidden;
}

.bottom-menu-modal > .container > .bg .menu-container .menu-box .menu-row {
    border-bottom: 1px solid #D5D9D9;
    padding: 15px;
    display: flex;
    justify-content: space-between;
}

.bottom-menu-modal > .container > .bg .menu-container .menu-box .menu-row:last-child,
.menu-container .menu-box .user-address:last-child {
    border-bottom: none;
}

.bottom-menu-modal > .container > .bg .user-address,
.menu-container .menu-box .user-address {
    padding: 15px;
    border-bottom: 1px solid #d5d9d9;
    cursor: pointer;
}

.bottom-menu-modal > .container > .bg > .active {
    cursor: initial;
}

.bottom-menu-modal > .container > .bg .user-address > .row,
.menu-container .menu-box .user-address > .row {
    display: flex;
    flex-direction: row;
}

.bottom-menu-modal > .container > .bg .user-address .row .info .title,
.menu-container .menu-box .user-address .row .info .title {
    font-size: 14px;
    background-color: #ffa3a3;
    border-radius: 10px;
    padding: 4px 10px;
    color: white;
    display: inline-block;
    margin-bottom: 10px;
}

.bottom-menu-modal > .container > .bg .user-address .row .info .name,
.menu-container .menu-box .user-address .row .info .name {
    font-weight: 900;
    display: block;
    margin-bottom: 5px;
    margin-top: 0px;
    font-size: 18px;
}

.bottom-menu-modal > .container > .bg .user-address .row .info .address .row,
.menu-container .menu-box .user-address .row .info .address .row {
    display: block;
    margin-bottom: 3px;
}

.bottom-menu-modal > .container > .bg .user-address .row .info .address .additional-info,
.menu-container .menu-box .user-address .row .info .address .additional-info {
    font-style: italic;
    margin-top: 10px;
    font-size: 14px;
}

.bottom-menu-modal > .container > .bg .user-address .actions {
    display: none;
    margin-top: 10px;
}

.bottom-menu-modal > .container > .bg .user-address .active,
.menu-container .menu-box .user-address .active {
    display: block;
}

.bottom-menu-modal > .container > .bg .user-address .actions .row-top {
    margin-bottom: 10px;
}

.bottom-menu-modal > .container > .bg .user-address .actions .row-top .wide-btn {
    background: linear-gradient(111deg, #2d1974 0%, #cd8aed 100%);
    border: none;
    font-weight: 900;
    color: white;
}

.menu-container .menu-box .user-address .actions {
    margin-top: 10px;
}

.bottom-menu-modal > .container > .bg .user-address .actions .row-bottom,
.menu-container .menu-box .user-address .actions {
    display: flex;
    justify-content: space-between;
}

.bottom-menu-modal > .container > .bg .btn-md-wide {
    padding: 10px 25px;
}

.carousel-card-history-marketplace {
    height: 193px;
}

.brand-card-sm {
    border-radius: 15px;
    overflow: hidden;
    width: 150px;
    height: 190px;
    flex: 0 0 auto;
    margin-right: 10px;
    position: relative;
    border: 1px solid #dfdfdf;
    cursor: pointer;
}

.brand-card-sm .about-img {
    width: 100%;
    overflow: hidden;
    height: 93px;
    background-color: #e6e6e6;
}

.brand-card-sm .about-img img {
    width: 150px;
    margin-top: -8px;
    background-color: #FCF2EF;
    object-fit: cover;
    height: 100px;
}

.brand-card-sm .profile-img {
    width: 70px;
    height: 70px;
    border: 2px solid white;
    border-radius: 50%;
    position: absolute;
    top: 36px;
    background-color: white;
    z-index: 1;
    left: 5px;
    overflow: hidden;
}

.brand-card-sm .profile-img img {
    width: 100%;
}

.brand-card-sm .bg {
    background-color: #fbfbfb;
    padding: 20px 10px 0px 10px;
    border-bottom-left-radius: 15px;
    border-bottom-right-radius: 15px;
    position: relative;
    height: 78px;
    overflow: hidden;
}

.brand-card-sm .bg .brand-name {
    font-family: "Space Mono", monospace;
    color: #656565;
    display: block;
    text-transform: uppercase;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    line-height: 19px;
}

.brand-card-sm .bg .description {
    font-size: 13px;
    color: #868686;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    height: 43px;
    position: relative;
    margin-top: 3px;
    line-height: 14px;
}

.section-title .icon-box .icon-img {
    width: 25px;
}

.list-carousel {

}

.list-carousel .lists {
    display: flex;
    flex-wrap: nowrap;
    overflow: auto;
    padding: 0 15px;
    -webkit-overflow-scrolling: touch;
    overflow-y: hidden;
    height: 350px;
    margin-bottom: 0px;
}

.list-carousel .lists .list {
    display: flex;
    flex-direction: column;
    width: 300px;
    flex-wrap: wrap;
    height: 345px;
}

.list-carousel .lists .list {
    
}

.list-carousel .lists .list .row {
    display: flex;
    margin-bottom: 15px;
}

.list-carousel .lists .list .row .img-col {
    width: 65px;
    padding-right: 10px;
}

.list-carousel .lists .list .row .img-col img {
    width: 65px;
    height: 65px;
    border-radius: 50%;
    border: 1px solid #efefef;
}

.list-carousel .lists .list .row .text-col {
    width: 210px;
    padding-right: 15px;
}

.list-carousel .lists .list .row .text-col .brand {
    font-family: "Space Mono", monospace;
    color: #656565;
    display: block;
    text-transform: uppercase;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    line-height: 19px;
}

.list-carousel .lists .list .row .text-col .description {
    font-size: 13px;
    color: #868686;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    height: 43px;
    position: relative;
    margin-top: 3px;
    line-height: 14px;
}

.fixed-filter-menu-2 {
    top: 0;
}

.fixed-filter-menu-index {
    top: 0;
}

.custom-collection-panel {
    background-color: white;
    margin-bottom: 7px;
    padding: 0 0 15px 0;
}

.custom-collection-panel .header {
    background-color: #f0eef3;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    padding: 40px 30px 30px 30px;
    position: relative;
}

.custom-collection-panel .header-bg {
    
}

.custom-collection-panel .header-fg {
    
}

.custom-collection-panel .header .title {
    font-size: 26px;
    color: #432985;
    font-weight: 900;
    display: block;
    margin-bottom: 10px;
    text-shadow: -2px 2px white;
}

.custom-collection-panel .header .title > i {
    font-size: 14px;
    color: #7d6189;
}

.custom-collection-panel .header .subtitle {
    color: #7D6189;
}

.custom-collection-panel .header .title .edit {
    font-size: 12px;
    background-color: #f0eef3;
    padding: 0px 10px;
    border-radius: 16px;
    color: #7d6189;
    font-weight: 500;
    display: inline-block;
    text-shadow: initial;
    border: 1px solid #b3a6b9;
    margin-left: 5px;
}

.custom-collection-panel .header .title .edit i {
    font-size: 9px;
    color: #7d6189;
}


.wide-banner {
    display: flex;
    margin-bottom: 7px;
    background-color: white;
    width: 100%;
    justify-content: center;
}

.wide-banner a {
    display: flex;
    cursor: pointer;
    width: 100%;
    height: 100%;
}

.wide-banner img {
    width: 100%;
    object-fit: cover;
}

.edit-panel-container {
    min-height: 240px;
}

.edit-form {
    padding-top: 5px;
    position: relative;
}

.edit-form form > .container {
    max-height: 400px;
    overflow: scroll;
}

.edit-form .close {
    position: absolute;
    right: -5px;
    padding: 5px 10px;
    top: -2px;
}

.edit-form .close i {
    color: #b7acbd;
    font-size: 26px;
    cursor: pointer;
}

.edit-form .title {
    font-size: 21px;
    font-weight: 900;
    color: #ff9f9f !important;
    margin-bottom: 0 !important;
}

.edit-form .subtitle {
    font-size: 14px;
    color: #AFAFAF;
    display: block;
    margin-top: 3px;
    margin-bottom: 15px;
}

.edit-form .info {
    padding: 15px 0 5px 0;
    margin-bottom: -10px;
}

.edit-form .info .text {
    font-size: 14px;
    display: list-item;
    margin-bottom: 10px;
    color: gray;
    margin-left: 20px;
}

.edit-form .add-media {
    margin-top: 20px;
    margin-bottom: 30px;
}

.edit-form .file-field-input {
    display: none;
}

.edit-form .btn-md-new-content {
    margin-bottom: 8px;
    margin-right: 4px;
    background-color: white;
}

.edit-form .photo-previews {
    
}

.edit-form .add-photo {
    display: none;
}

.edit-form .add-photo .btn-md-photo{
    margin-top: 5px;
    margin-bottom: 15px;
    color: #8a8a8a;
    border: 1px solid #a4a4a4;
}

.edit-form .add-photo .tag-brand {
    margin-top: -3px;
    display: none;
    margin-bottom: 15px;
}

.edit-form .add-photo .tag-brand i {
    font-size: 14px;
    color: gray;
    float: left;
    margin-top: 2px;
}

.edit-form .add-photo .tag-brand span {
    font-size: 14px;
    color: gray;
    display: block;
    line-height: 18px;
    padding-left: 20px;
}

.edit-form .edit-hidden-panel {
    display: none;
}


.select-inputs {
    margin-bottom: 20px;
}

.select-inputs .row {
    display: flex;
}

#user_dob_3i {
    width: 20%;
}

#user_dob_2i {
    width: 55%;
}

#user_dob_1i {
    width: 25%;
}

.select-inputs .row select {
    height: 50px;
    background-color: transparent;
    padding-left: 5px;
    padding-top: 5px;
    border-radius: 5px;
    border: 1px solid #bebebe;
    margin-right: 5px;
}

.select-inputs .row .input-wide {
    width: 100%;
}


.input .helper {
    font-size: 14px;
    display: inline-block;
    line-height: 15px;
    color: #A3A3A3;
    margin-top: 5px;
}


.skin-type-row,
.hair-texture-row {
    display: flex;
    margin-bottom: 20px;
}

.skin-phototype-row {
    display: flex;
    margin-bottom: 20px;
    flex-direction: column;
}

.skin-type-row .col,
.hair-texture-row .col {
    width: 25%;
    text-align: center;
}

.skin-phototype-row .row {
    text-align: center;
    background-color: #fffaf8;
    border-radius: 10px;
    margin-bottom: 15px;
    overflow: hidden;
    border: 1px solid #ffdad1;
}

.skin-type-row .col .image,
.hair-texture-row .col .image {
    width: 65px;
    height: 65px;
    background-color: #ebd8f7;
    border-radius: 50%;
    margin: auto;
    margin-bottom: 10px;
    overflow: hidden;
    cursor: pointer;
}

.skin-phototype-row .row .image {
    width: 100%;
}

.skin-type-row .col .selected,
.hair-texture-row .col .selected {
    border: 3px solid #ff5d96;
    width: 59px;
    height: 59px;
}

.skin-phototype-row .selected {
    border: 3px solid #ff5d96;
}

.hair-texture-detail-row .row .selected {
    border: 3px solid #ff5d96;
    width: 59px;
    height: 59px;
}

.skin-type-row .col .image img,
.hair-texture-row .col .image img {
    width: 100%;
}

.skin-phototype-row .row .image img {
    width: 100%;
}

.skin-type-row .col .text {
    
}

.skin-phototype-row .row .text {
    display: flex;
    flex-direction: column;
    padding: 5px 15px 10px 15px;
}

.skin-phototype-row .row .text .txt {
    color: #7f5c55;
}

.skin-phototype-row .row .text .description {
    font-size: 14px;
    color: #b6958e;
}


.hair-row {
    display: flex;
}

.hair-row .image {
    
}

.hair-row .image img {
    width: 30px;
    border-radius: 50%;
    margin-right: 8px;
}

.hair-row .info {
    
}

.hair-row .info .title {
    display: block;
    font-weight: 500;
    font-size: 16px;
}

.hair-row .info .title small {
    font-size: 14px;
    font-weight: 400;
    color: #4a75b5;
}

.hair-row .info .subtitle {
    color: #4a75b5;
    font-size: 13px;
    display: block;
}

.hair-row .single {
    display: flex;
}

.hair-row .single img {
    width: 30px;
    border-radius: 50%;
    margin-right: 7px;
}

.hair-row .single span {
    margin-top: 7px;
    color: #4a75b5;
}


.hair-texture-detail-row {
    margin-bottom: 40px;
    display: none;
}

.hair-texture-detail-row-selected {
    display: block;
}

.hair-texture-detail-row .devise-title {
    font-size: 21px;
    font-weight: 900;
    color: #ff9f9f;
    margin-bottom: 15px;
    display: block;
}

.hair-texture-detail-row .row {
    width:  100%;
    display: table;
    margin-bottom: 8px;
    cursor: pointer;
}

.hair-texture-detail-row .row .image  {
    width: 65px;
    height: 65px;
    background-color: #ebd8f7;
    border-radius: 50%;
    margin: auto;
    margin-bottom: 10px;
    overflow: hidden;
    cursor: pointer;
    float: left;
}

.hair-texture-detail-row .row .image img {
    width: 100%;
}

.hair-texture-detail-row .row .info {
    padding-left: 75px;
    margin-bottom: 0;
    padding-top: 0;
}

.hair-texture-detail-row .row .info .title {
    font-weight: 900;
    font-size: 16px;
    color: #454545 !important;
}

.hair-texture-detail-row .row .info .subtitle {
    font-size: 14px;
    display: block;
    line-height: 18px;
    color: #545454;
}

.alert-new-post {
    background-color: #FF5072;
    padding: 15px;
    border-radius: 10px;
    display: flex;
    margin-bottom: 20px;
}

.alert-new-post .left-col {
    margin-right: 12px;
}

.alert-new-post .left-col i {
    color: white;
    font-size: 18px;
}

.alert-new-post .right-col {
    
}

.alert-new-post .right-col .title {
    font-size: 18px;
    font-weight: 900;
    color: white;
    display: block;
    margin-bottom: 5px;    
}

.alert-new-post .right-col .subtitle {
    color: white;
    font-size: 14px;
    display: block;
}

.kueski-container {
    padding: 15px;
}

.biucredits-offer-container {
    padding: 15px;
}

.biucredits-offer {
    background: linear-gradient(111deg, #272727 66%, #707070 100%);
    padding: 20px 20px 15px 20px;
    border-radius: 10px;
}

.biucredits-offer .title {
    display: block;
    font-weight: 900;
    font-size: 20px;
    line-height: 20px;
    color: white;
    margin-bottom: 5px;
}

.biucredits-offer .subtitle {
    display: inline-block;
    line-height: 20px;
    font-size: 15px;
    color: white;
}

.biucredits-offer .subtitle a {
    font-size: 14px;
    color: #959595;
    text-decoration: underline;
}

.biucredits-offer .btns {
    margin-top: 15px;
}

.biucredits-offer .btns .solid {
    border: 1px solid #606060;
    color: #272727;
    display: inline-block;
    margin: auto;
    padding: 7px 15px;
    font-size: 14px;
    border-radius: 20px;
    font-weight: 500;
    cursor: pointer;
    background-color: white;
}

.biucredits-offer .btns .outline {
    border: 1px solid white;
    background-color: transparent;
    color: white;
    margin-right: 5px;
    display: inline-block;
    margin: auto;
    padding: 7px 15px;
    font-size: 14px;
    border-radius: 20px;
    font-weight: 500;
    cursor: pointer;
    margin-bottom: 7px;
}

.kueski-offer {
    border: 1px solid #d5d9d9;
    border-radius: 10px;
    padding: 10px 15px;
    background-color: #fbfbfb;
}

.kueski-offer-cart {
    background-color: #f8f8f8;
}

.kueski-offer-seller-info {
    margin-top: 15px;
    margin-bottom: -3px;
    background-color: transparent;
    border-radius: initial;
    border: none;
    padding: 0;
    border-bottom: 1px solid #dbdbdb;
    padding-bottom: 10px;
}

.kueski-offer span {
    display: inline-block;
    line-height: 20px;
    font-size: 15px;
}

.kueski-offer-seller-info span {
    color: #575959;
}

.kueski-offer strong {
    color: #008bd8;
    font-size: 15px;
}

.kueski-offer .logo {
    height: 24px;
    margin-bottom: -6px;
    margin-left: -2px;
    margin-right: -4px;
}

.kueski-offer .link {
    color: #472B88;
    font-size: 14px;
    display: inline;
    cursor: pointer;
}

.kueski-info {

}

.kueski-info .logo {
    height: 40px;
    margin: auto;
    display: block;
    margin-bottom: 15px;
}

.bottom-menu-modal > .container > .bg .kueski-info .title {
    font-size: 18px;
    color: #008bd8;
    font-weight: 500;
    text-align: center;
    margin-bottom: 15px;
}

.kueski-info .row {
    display: flex;
    text-align: center;
}

.kueski-info .row .col {
    width: 33.33%;   
}

.kueski-info .row .col:nth-child(3n+1) .container {
    padding-right: 7px;
}

.kueski-info .row .col:nth-child(3n+2) .container {
    padding-left: 7px;
    padding-right: 7px;
}

.kueski-info .row .col:nth-child(3n+3) .container {
    padding-left: 7px;
}

.kueski-info .row .col img {
    width: 80px;
}

.bottom-menu-modal > .container > .bg .kueski-info .row .col .title {
    font-size: 16px;
    margin-bottom: 5px;
    color: #454545;
    font-weight: 900;
}

.kueski-info .row .col .subtitle {
    font-size: 13px;
    display: block;
}

.kueski-info .disclaimer {
    color: #A2A2A2;
    margin-bottom: 15px;
    font-size: 12px;
    display: inline-block;
    margin-top: 35px;
    margin-bottom: 13px;
    
}

.alert-biutesting {
    border: 1px solid #f34436;
    padding: 15px;
    border-radius: 10px;
    margin-bottom: 15px;
    background-color: #ffedef;
}

.alert-biutesting .title {
    font-size: 24px;
    display: block;
    font-weight: 900;
    color: #f44336;
}

.alert-biutesting .description {
    display: block;
    line-height: 22px;
    font-size: 16px;
    margin: 10px 0 0 0;
}


.review-cards, .question-cards {
    overflow: auto;
    white-space: nowrap;
    -webkit-overflow-scrolling: touch;
    overflow-y: hidden;
    position: relative;
    padding: 15px 5px 15px 15px;
}

.review-cards .review-card, .question-cards .question-card {
    display: inline-block;
    width: 160px;
    background-color: #FCF2EE;
    padding: 15px;
    border-radius: 15px;
    margin-right: 10px;
    min-height: 199px;
    vertical-align: top;
}

.question-cards .question-card {
    min-height: 228px;
}

.review-cards .review-card .top-row, .question-cards .question-card .top-row {
    display: table;
    width: 100%;
    margin-bottom: 7px;
}

.review-cards .review-card .top-row .star {
    float: left;
    padding: 0;
    z-index: 0;
    margin-right: 2px;
}

.review-cards .review-card .top-row .review-number {
    color: #FEC109;
    font-weight: 900;
    float: left;
    margin-top: -2px;
    font-size: 19px;
}

.review-cards .review-card .top-row .fa-camera, .question-cards .question-card .top-row .fa-camera {
    float: right;
    color: #C4B6B0;
    font-size: 18px;
    cursor: pointer;
}

.review-cards .review-card .top-row .fa-video, .question-cards .question-card .top-row .fa-video {
    float: right;
    color: #C4B6B0;
    font-size: 18px;
}

.question-cards .question-card .top-row .fa-comment {
    color: #FF9F9F;
    float: left;
    margin-right: 4px;
}

.question-cards .question-card .top-row .comment-count {
    float: left;
    color: #FF9F9F;
    font-weight: 900;
    margin-top: -1px;
}

.review-cards .review-card .user, .question-cards .question-card .user {
    margin-bottom: 7px;
}

.review-cards .review-card .review-type {
    margin: -5px 0 8px 0;    
}

.review-cards .review-card .review-type .regular {
    font-size: 12px;
    font-weight: 900;
    background-color: #9b9694;
    color: #fcf2ef;
    padding: 2px 6px;
    border-radius: 5px;
}

.review-cards .review-card .review-type .first {
    font-size: 12px;
    font-weight: 900;
    background-color: #ff9d9e;
    color: #fcf2ef;
    padding: 2px 6px;
    border-radius: 5px;
}

.review-cards .review-card .user .user-name, .question-cards .question-card .user .user-name {
    font-size: 13px;
    display: block;
    font-weight: 900;
    color: #9B9694;
    margin-bottom: -3px;
}

.review-cards .review-card .user .skin-type-age, .question-cards .question-card .user .skin-type-age {
    color: #9B9694;
    font-size: 13px;
}

.question-cards .question-card .question-group {
    padding: 2px 0 10px 0;
}

.question-cards .question-card .question-group .bg {
    background-color: white;
    border: 1px solid #aba19e;
    padding: 1px 11px;
    border-radius: 15px;
    display: inline-block;
    margin-left: -3px;
}

.question-cards .question-card .question-group .bg .text {
    color: #868180;
    font-size: 13px;
    margin: 2px 0 2px 0;
    display: block;
    cursor: pointer;
}

.review-cards .review-card .title, .question-cards .question-card .title {
    font-size: 14px;
    font-weight: 900;
    width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    white-space: initial;
    margin-bottom: 7px;
    cursor: pointer;
}

.review-cards .review-card .body, .question-cards .question-card .body {
    font-size: 14px;
    color: #9B9694;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 5;
    -webkit-box-orient: vertical;
    white-space: initial;
    cursor: pointer;
}


.no-content {
    margin: 15px;
    background-color: #fbfbfb;
    border-radius: 15px;
    padding: 15px;
    margin-top: 10px;
    border: 1px solid #dfdfdf;
}

.no-content .row {
    margin-bottom: 15px;
    min-height: 50px;
}

.no-content .row .col {
    float: left;
    margin-right: 10px;
}

.no-content .row .col .circle {
    width: 50px;
    height: 50px;
    background-color: #FF9F9F;
    border-radius: 50%;
    text-align: center;
}

.no-content .row .col .circle i {
    margin-top: 15px;
    font-size: 22px;
    color: white;
}

.no-content .row .col .circle .no-data-star-icon  {
    margin: auto;
    padding-top: 10px;
    z-index: 0;
}

.no-content .text {
    padding-left: 60px;
}

.no-content .text span {
    font-size: 14px;
    color: #868686;
    display: block;
    line-height: 18px;
}

.no-content .text span i {
    font-size: 11px;
    color: #868686;
}

.no-content .wide-btn {
    border: 1px solid #FF9F9F;
    color: #FF9F9F;
}

.no-content .wide-btn i {
    color: #FF9F9F;
}

.photos-grid, .info-photos-grid {
    padding-bottom: 10px;
    margin-top: -5px;
    padding: 0 15px;
    height: auto;
}

.photos-grid > .container, .info-photos-grid > .container {
    width: 100%;
    display: none;
}

.photos-grid > .active, .info-photos-grid > .active {
    display: table;
}

.photos-grid .photo, .info-photos-grid .photo {
    width: 25%;
    height: 112px;
    float: left;
    overflow: hidden;
    margin-bottom: 4px;
}

.info-photos-grid .photo-social {
    height: initial;
}

.info-photos-grid .photo-social .post_type {
    font-size: 14px;
    color: #6d6d6d;
}

.photos-grid > .container .empty, .info-photos-grid > .container .empty {
    color: #989898;
    font-size: 14px;
}

.photos-grid .photo .container, .info-photos-grid .photo .container {
        
}

.photos-grid .photo:nth-child(4n+1) .container, .info-photos-grid .photo:nth-child(4n+1) .container {
    padding-right: 3px;
}

.photos-grid .photo:nth-child(4n+2) .container, 
.photos-grid .photo:nth-child(4n+3) .container,
.info-photos-grid .photo:nth-child(4n+2) .container, 
.info-photos-grid .photo:nth-child(4n+3) .container {
    padding: 0 3px;
}

.photos-grid .photo:nth-child(4n+4) .container, .info-photos-grid .photo:nth-child(4n+4) .container {
    padding-left: 3px;
}

.photos-grid .photo .container .bg, .info-photos-grid .photo .container .bg {
    background-color: #e6eaeb;
    height: 110px;
    width: 100%;
    border-radius: 5px;
    overflow: hidden;
    border: 1px solid #e2e2e2;
    text-align: center;
    position: relative;
    cursor: pointer;
}

.photos-grid .photo .container .bg img, .info-photos-grid .photo .container .bg img {
    height: 100%;
    width: 100%;
    object-fit: cover;
}

.photos-grid .photo .container .bg i, .info-photos-grid .photo .container .bg i {
    position: absolute;
    font-size: 36px;
    color: #ffffffc4;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
}


.biutesting-row {
    padding: 0 15px;
    background-color: white;
    padding-bottom: 20px;
}

.biutesting-row-banner {
    background-color: transparent;
    padding: 0px 0px 7px 0px;
}

.biutesting-row a {
    
}

.biutesting-row a .container {
    display: flex;
    background-color: #fbfbfb;
    border-radius: 10px;
    border: 1px solid #D5D9D9;
    overflow: hidden;
}

.biutesting-row-banner a .container {
    background-color: white;
    border-radius: 0;
    border: none;
    padding-left: 0;
}

.biutesting-row a .container img {
    width: 100px;
}

.biutesting-row a .container .info {
    padding: 15px;
}

.biutesting-row a .container .info .title {
    font-weight: 900;
    display: block;
    color: #432985;
    margin-bottom: 0px;
    font-size: 14px;
}

.biutesting-row a .container .info .name {
    display: block;
    font-weight: 900;
    font-size: 18px;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    margin-bottom: 5px;
}

.biutesting-row a .container .info .description {
    
}

.biutesting-row a .container .info .btn {
    font-size: 14px;
    display: block;
}

.items-container {
    background-color: white;
    display: block;
    min-height: 250px;
    padding: 15px;
}

.items-container-carousel {
    padding: 0;
}

.items-box {
    display: flex;
    width: 100%;    
}

.items-container .items-col-lg  {
    flex-wrap: wrap;
}

.items-container .items-col-lg .item {
    width: 50%;
}

.items-container .items-col-carousel {
    display: flex;
    flex-wrap: nowrap;
    overflow: auto;
    padding: 0 15px;
    -webkit-overflow-scrolling: touch;
    overflow-y: hidden;
}

.items-container .items-col-carousel .item {
    width: 153px;
    margin-right: 10px;
}

.items-container .items-col-carousel .more {
    border-radius: 15px;
    overflow: hidden;
    width: 121px;
    height: 268px;
    flex: 0 0 auto;
    margin-right: 30px;
    position: relative;
    text-align: center;
    padding: 15px;
    border: 1px solid #ff9e9e;
    cursor: pointer;
}

.items-container .items-col-carousel .more-transparent {
    width: 121px;
    height: 268px;
    flex: 0 0 auto;
    margin-right: 30px;
    position: relative;
    text-align: center;
    padding: 15px;
    cursor: pointer;
}

.items-container .items-col-carousel .more span {
    color: #ff9e9e;
    margin-top: 105px;
    display: block;
}

.items-container .items-col-carousel .more i {
    color: #ff9e9e;
    font-size: 22px;
    margin-top: 10px;
}

.items-container .items-box .item  {
    padding-bottom: 30px;
}

.items-container .items-box .item:nth-child(2n+1) > .container {
    padding-right: 7px;
}

.items-container .items-box .item:nth-child(2n+2) > .container {
    padding-left: 7px;
}

.items-container .items-col-carousel .item:nth-child(2n+1) > .container,
.items-container .items-col-carousel .item:nth-child(2n+2) > .container {
    padding: 0;
}

.items-container .items-box .item .image {
    background-color: #f6f6f6;
    border-radius: 10px;
    margin-bottom: 5px;
    background-image: url("<%= asset_path 'icons/product-placeholder.png' %>");
    background-size: cover;
    background-position: center;
    margin: auto;
    border-radius: 10px;
    position: relative;
    display: none;
}

.items-container .items-box .item .image img {
    border-radius: 10px;
    object-fit: cover;
}

.items-container .items-box .item .image-versions .image {
    display: none;
}

.items-container .items-box .item .image-versions > .active {
    display: block;
}

.items-container .items-box .item .image .collection-menu {
    position: absolute;
    top: 5px;
    right: 5px;
}

.items-container .items-box .item .image .menu-btn {
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.items-container .items-box .item .image .menu-btn i {
    color: #d3cdd5cc;
    font-size: 18px;
    -webkit-text-stroke: 2px white;
}

.items-container .items-box .item .image .remove {
    position: absolute;
    bottom: 8px;
    right: 8px;
}

.items-container .items-box .item .image .remove .remove-btn {
    border: 1px solid #ff9d9e;
    border-radius: 5px;
    width: 30px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: white;
}

.items-container .items-box .item .image .remove .remove-btn i {
    color: #ff9e9f;
}


.items-container .items-box .item .image .discount-bubble {
    padding: 7px;
    background: linear-gradient(111deg, #2d1974 0%, #cd8aed 100%);
    position: absolute;
    border-radius: 10px;
    margin-top: 15px;
    margin-left: -8px;
    display: flex;
    flex-direction: row;
    align-items: center;
}

.items-container .items-box .item .image .discount-bubble .discount {
    font-weight: 900;
    color: white;
}

.items-container .items-box .item .image .discount-bubble .min-order {
    font-weight: 400;
    color: white;
    font-size: 13px;
    font-style: italic;
    margin-left: 5px;
}

.items-container .items-box .item .image .discount-bubble-shipping {
    padding: 7px 12px;
    background: linear-gradient(111deg, #467f46 0%, #8ede8e 100%);
    position: absolute;
    border-radius: 10px;
    margin-top: 15px;
    margin-left: -8px;
    display: flex;
    flex-direction: column;
}

.items-container .items-box .item .image .discount-bubble-shipping .discount {
    font-weight: 900;
    color: white;
}

.items-container .items-box .item .image .discount-bubble-shipping .min-order {
    font-weight: 400;
    color: white;
    font-size: 13px;
    font-style: italic;
}

.items-container .items-box .item .image .discount-bubble-stacked {
    margin-top: 55px;
}

.items-container .items-box .item .image {
    width: 100%;
    object-fit: cover;
    border: 1px solid #f0eef3;
    border-radius: 10px;
}

.items-container .items-box .item .product-placeholder {
    width: 100%;
    border-radius: 10px;
}

.items-container .items-box .item .info {
    margin-top: 10px;
}


.items-container .items-box .item .brand {
    color: #6D6D6D;
    display: block;
    font-weight: 500;
    font-size: 14px;
    margin-bottom: 3px;
}

.items-container .items-box .item .name {
    color: #6D6D6D;
    font-size: 16px;
    display: block;
    line-height: 18px;
    font-weight: 200;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.items-container .items-box .item .product-reviews {
    display: flex;
    margin-top: 5px;
}

.items-container .items-box .item .product-reviews .product-star {
    padding: 0;
    float: left;
    z-index: 0;
}

.items-container .items-box .item .product-reviews .score {
    color: #A3A3A3;
    font-size: 14px;
    font-weight: 900;
    margin-left: 3px;
}

.items-container .items-box .item .product-reviews .score-base {
    color: #A3A3A3;
    font-size: 13px;
    margin-top: 1px;
    margin-left: 5px;
}

.items-container .items-box .item .products {
    color: #A3A3A3;
    font-size: 14px;
    margin-top: 1px;
}


.items-container .items-box .item .not-available {
    font-size: 12px;
    font-weight: 500;
    color: #b4afbd;
    background-color: #f0eef3;
    padding: 3px 7px;
    border-radius: 10px;
    display: inline-block;
    margin-top: 8px;
}

.items-container .items-box .item .versions {
    display: flex;
    margin-top: 10px;
    flex-wrap: wrap;
}

.items-container .items-box .item .versions .version {
    background-color: #ffffff;
    border: 1px solid #c2c0c3;
    padding: 1px 10px;
    border-radius: 10px;
    color: #707070;
    font-size: 12px;
    margin: 0 3px 5px 0;
    cursor: pointer;
}

.items-container .items-box .item .versions .version:hover {
    background-color: #f3f3f3;
}

.items-container .items-box .item .versions .active {
    border: 1px solid #ff9d9e;
    background-color: #ff9e9e;
    color: white;
}

.items-container .items-box .item .versions .active:hover {
    background-color: #ff9e9e;
}

.items-container .items-box .item .info-versions {

}

.items-container .items-box .item .info-versions .info-version {
    display: none;
}

.items-container .items-box .item .info-versions > .active {
    display: block;
}

.items-container .items-box .item .add-to-cart {
    background: linear-gradient(111deg, #2d1974 0%, #cd8aed 100%);
    display: flex;
    justify-content: space-between;
    padding: 0 15px;
    border-radius: 10px;
    border: 1px solid white;
    margin-top: 10px;
    align-items: center;
    min-height: 40px;
    margin-bottom: 15px;
    cursor: pointer;
}

.items-container .items-col-carousel .item .add-to-cart {
    padding: 0 10px;
}

.items-container .items-box .item .add-to-cart:hover {
    background: linear-gradient(111deg, #2d1974 0%, #a459c8 100%);
}

.items-container .items-box .item .add-to-cart .left {

}

.items-container .items-box .item .add-to-cart .left .mobile {
    font-size: 14px;
    color: white;
    font-weight: 500;    
}

.items-container .items-col-carousel .item .add-to-cart .left .mobile {
    margin-left: -1px;
}

.items-container .items-box .item .add-to-cart .left i {
    font-size: 12px;
    color: white;
}

.items-container .items-box .item .add-to-cart .left .desktop {
    display: none;
}

.items-container .items-box .item .add-to-cart .right {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
}

.items-container .items-box .item .add-to-cart .right .final {
    font-size: 13px;
    font-weight: 900;
    display: block;
    color: white;
}

.items-container .items-box .item .add-to-cart .right .discount {
    text-decoration: line-through;
    font-size: 12px;
    font-weight: 500;
    display: block;
    color: #e9ccfc;
}

.items-container .items-box .item .out-of-stock {
    border: 1px solid #e1dfe5;
    background: #fcfbfd;
    cursor: initial;
}

.items-container .items-box .item .out-of-stock:hover {
    background: #fcfbfd;
}

.items-container .items-box .item .out-of-stock .left {
    font-size: 14px;
}

.items-container .items-box .item .out-of-stock .left,
.items-container .items-box .item .out-of-stock .left i,
.items-container .items-box .item .out-of-stock .right .final {
    color: #c2bbcd;
}

.items-container .items-box .item .out-of-stock .right .discount {
    color: #c6c6c6;
}

.error-page {

}

.error-page .giphy-container {
    width:100%;
    height:0;
    padding-bottom: 57%;
    position:relative;    
    margin-bottom: 30px !important;
}

.error-page .giphy-container iframe {
    position: absolute; 
    width: 100%;
    height: 100%;    
}

.error-page .body {
    text-align: center;
    padding: 15px 60px 100px 60px;
}

.error-page .body .title {
    font-size: 28px;
    font-weight: 900;
    color: #988b9e;
    display: block;
    margin-bottom: 15px;
}

.error-page .body .subtitle {
    color: #988b9e;
    display: block;
    margin-bottom: 35px;
}

.error-page .body .wide-btn {
    background: linear-gradient(111deg, #2d1974 0%, #cd8aed 100%);
    border: none;
    font-weight: 900;
    color: white;
}

.sellers .info-sellers .seller-price {
    padding: 15px 15px 15px 15px;
    background-color: #F8F8F8;
    border: 1px solid #D5D9D9;
    border-radius: 10px;
    margin: 0 15px 25px 15px;
    position: relative;
}

.bottom-menu-modal .sellers .info-sellers .seller-price {
    margin: 15px 0px 15px 0px;
    padding-bottom: 0;
}

.bottom-menu-modal .sellers .info-sellers {
    /*height: 305px;
    overflow-y: scroll;
    padding-bottom: 50px;*/
}

.bottom-menu-modal .sellers .info-sellers .seller-price > .header .left .price-col .initial .title {
    margin-top: 0;
    margin-bottom: 0;
}

.sellers .info-sellers .seller-price > .header {
    border-bottom: 1px solid #DBDBDB;
    padding-bottom: 12px;
    display: flex;
    flex-direction: column;
}

.bottom-menu-modal .sellers .info-sellers .seller-price > .header {
    padding-bottom: 10px;
}

.sellers .info-sellers .seller-price > .header .row .left {
    display: flex;
}

.sellers .info-sellers .seller-price > .header .right {
    
}

.sellers .info-sellers .seller-price > .header .right .promo-btn {
    background-color: #FFC008;
    padding: 5px 10px;
    color: #575959;
    font-size: 13px;
    border-radius: 20px;
    font-weight: 500;
}

.sellers .info-sellers .seller-price > .header .right .promo-btn i {
    color: #575959;
    font-size: 10px;
}

.sellers .info-sellers .seller-price > .header {
    border-bottom: 1px solid #DBDBDB;
    padding-bottom: 15px;
}

.sellers .info-sellers .seller-price > .header .row {
    display: flex;
    justify-content: space-between;
}

.sellers .info-sellers .seller-price > .header .row-savings {
    border-top: 1px solid #DBDBDB;
    margin-top: 7px;
    padding-top: 10px;
    margin-bottom: -7px;
}

.sellers .info-sellers .seller-price > .header .left {
    display: flex;
    flex-direction: column;
}

.sellers .info-sellers .seller-price > .header .left .price-col {
    display: flex;
    flex-direction: column;
}

.sellers .info-sellers .seller-price > .header .left .price-col .price {
    display: flex;
    margin-top: 8px;
}

.bottom-menu-modal .sellers .info-sellers .seller-price > .header .left .price-col .price {
    margin-top: 0;
}

.sellers .info-sellers .seller-price > .header .left .price-col-initial .price {
    margin-top: 0;
}

.sellers .info-sellers .seller-price > .header .left .price-col .initial {
    margin-bottom: 2px;
}

.sellers .info-sellers .seller-price > .header .left .price-col .price .title {
    width: 45px;
    display: block;
    margin-top: 3px;
    margin-right: 6px;
    text-align: right;
}

.sellers .info-sellers .seller-price > .header-sm .left .price-col .price .title {
    width: 40px;
}

.sellers .info-sellers .seller-price > .header-sm .left .price-col-initial .initial .title,
.sellers .info-sellers .seller-price > .header-sm .left .price-col-initial .current .title,
.sellers .info-sellers .seller-price > .header-sm .left .price-col-initial .savings .title {
    width: 50px;
}

.sellers .info-sellers .seller-price > .header .left .price-col .initial .title {
    margin-top: 0;
}

.sellers .info-sellers .seller-price > .header .left .price-col .current .title span,
.sellers .info-sellers .seller-price > .header .left .price-col .savings .title span {
    color: #575959;
    font-weight: 500;
}

.sellers .info-sellers .seller-price > .header .left .price-col .initial .container {
    position: relative;
    display: flex;
}

.sellers .info-sellers .seller-price > .header .left .price-col .current .title span,
.sellers .info-sellers .seller-price > .header .left .price-col .savings .title span {
    font-size: 13px;
}

.sellers .info-sellers .seller-price > .header .left .price-col .initial .title span {
    color: #575959;
    font-weight: 500;    
    font-size: 13px;
}

.sellers .info-sellers .seller-price > .header .left .price-col .price .currency {
    width: 8px;
    text-align: right;
    margin-top: 2px;
}

.sellers .info-sellers .seller-price > .header .left .price-col .initial .currency {
    margin-top: 0;
}

.sellers .info-sellers .seller-price > .header .left .price-col .current .currency span {
    color: #E34261;
    font-size: 14px;
    margin: 0 0 0 0;
}

.sellers .info-sellers .seller-price > .header .left .price-col .savings .currency span {
    color: #7d7d7d;
    font-size: 14px;
    margin: 0 0 0 0;
}

.sellers .info-sellers .seller-price > .header .left .price-col .initial .currency span {
    color: #939393;
    font-size: 12px;
    margin: 0 0 0 0;
}

.sellers .info-sellers .seller-price > .header .left .price-col .price .amount {
    width: 45px;
    text-align: right;
}

.sellers .info-sellers .seller-price > .header .left .price-col .price .amount-1k {
    width: 60px;
}

.sellers .info-sellers .seller-price > .header .left .price-col .current .amount span {
    color: #E34261;
    font-size: 24px;
    font-weight: 500;
    margin: 0 0 0 0;
}

.sellers .info-sellers .seller-price > .header .left .price-col .savings .amount span {
    color: #7d7d7d;
    font-size: 22px;
    font-weight: 500;
    margin: 0 0 0 0;
}

.sellers .info-sellers .seller-price > .header .left .price-col .initial .amount span {
    color: #939393;
    font-size: 16px;
    font-weight: 400;
    margin: 0 0 0 0;
}

.sellers .info-sellers .seller-price > .header .left .price-col .price .cents {
    width: 15px;
    margin-left: 2px;
}

.sellers .info-sellers .seller-price > .header .left .price-col .current .cents span {
    color: #E34261;
    font-size: 14px;
    margin: 0 0 0 0;
}

.sellers .info-sellers .seller-price > .header .left .price-col .savings .cents span {
    color: #7d7d7d;
    font-size: 14px;
    margin: 0 0 0 0;
}

.sellers .info-sellers .seller-price > .header .left .price-col .initial .cents span {
    color: #939393;
    font-size: 11px;
    margin: 2px 0 0 0;
    display: block;
}

.sellers .info-sellers .seller-price > .header .left .price-col .price .percent {
    margin: 3px 0 0 8px;
}

.sellers .info-sellers .seller-price > .header .left .price-col .current .percent span {
    color: #E34261;
    font-size: 14px;
    font-weight: 500;
}

.sellers .info-sellers .seller-price > .header .left .price-col .savings .percent span {
    color: #7d7d7d;
    font-size: 14px;
    font-weight: 500;
}

.sellers .info-sellers .seller-price > .header .left .price-col .initial .container .cross {
    position: absolute;
    width: 100%;
    height: 1px;
    background-color: #838989;
    top: 9px;
    padding: 0px;
}

.sellers .info-sellers .seller-price > .header .promo-btn-container {
    margin-top: 10px;
    text-align: center;
}

.sellers .info-sellers .seller-price > .header .row-savings .promo-btn-container {
    margin-top: 0;
}

.sellers .info-sellers .seller-price > .header .promo-btn-container .promo-btn {
    background-color: #FFF0C4;
    padding: 5px 10px;
    font-size: 12px;
    border-radius: 20px;
    font-weight: 500;
    border: 1px solid #D9B036;
    color: #7B6011;
    cursor: pointer;
}

.sellers .info-sellers .seller-price > .header .promo-btn-container .promo-btn i {
    color: #7B6011;
    font-size: 11px;
}

.sellers .info-sellers .seller-price > .header .promo-btn-container .promo-btn:hover {
    background-color: #ffeaaf;
}

.sellers .info-sellers .seller-price > .header .right .btn-color {
    display: inline-block;
    margin: auto;
    padding: 10px 15px;
    border-radius: 20px;
    cursor: pointer;
    background: linear-gradient(111deg, #2d1974 0%, #cd8aed 100%);
    border: none;
    font-weight: 500;
    color: white;
}

.sellers .info-sellers .seller-price > .header .right .btn-color:hover {
    background: linear-gradient(111deg, #2d1974 0%, #ad71c9 100%);
}

.sellers .info-sellers .seller-price .availability {
    padding: 15px 0 0 0;
    display: flex;
}

.bottom-menu-modal .sellers .info-sellers .seller-price .availability {
    padding: 7px 0 0 0;
}

.sellers .info-sellers .seller-price .availability div {
    width: 15px;
    height: 15px;
    border-radius: 50%;
    margin: 1px 0 0 5px;
}

.sellers .info-sellers .seller-price .availability span {
    font-size: 14px;
    font-weight: 500;
}

.sellers .info-sellers .seller-price .available div {
    background-color: #329D32;
}

.sellers .info-sellers .seller-price .available span {
    color: #007000;
}

.sellers .info-sellers .seller-price .not-available div {
    background-color: red;
}

.sellers .info-sellers .seller-price .not-available span {
    color: red;
}

.sellers .info-sellers .seller-price .promos {
    display: none;
}

.sellers .info-sellers .seller-price .body {
    
}

.sellers .info-sellers .seller-price .body > .info {
    margin-top: 20px;
}

.sellers .info-sellers .seller-price .body .info .row {
    margin-bottom: 20px;
    display: flex;
}

.sellers .info-sellers .seller-price .body .info .row-attention {
    background-color: #FFECB5;
    margin: -10px -15px 12px -15px;
    padding: 15px;
}

.sellers .info-sellers .seller-price .body .cart-info .promo {
    margin: 0;
    display: none;
}

.sellers .info-sellers .seller-price .body .info .hidden-row {
    display: none;
}

.sellers .info-sellers .seller-price .body .info .more-details-row {
    margin-bottom: 0;
}

.sellers .info-sellers .seller-price .body .info .row .icon {
    width: 45px;
}

.sellers .info-sellers .seller-price .body .cart-info .info .row .icon {
    width: 45px;
    text-align: center;
}

.sellers .info-sellers .seller-price .body .info .row .icon .biucredits {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: linear-gradient(111deg, #272727 44%, #cccccc 100%);
    display: flex;
    align-items: center;
    justify-content: center;
}

.sellers .info-sellers .seller-price .body .info .row .icon .biucredits span {
    color: white;
    font-size: 14px;
    font-weight: 900;
}

.sellers .info-sellers .seller-price .body .info .row .right .text .biucredits-badge {
    background: linear-gradient(111deg, #272727 66%, #707070 100%);
    border-radius: 4px;
    padding: 1px 5px;
    color: white;
    font-weight: 500;
    font-size: 14px;
}

.sellers .info-sellers .seller-price .body .info .row-attention .icon i {
    color: #776485;
}

.sellers .info-sellers .seller-price .body .cart-info .info .row .icon i {
    color: #a192ac;
    font-size: 18px;
    margin: 0 7px 0 0;
}

.sellers .info-sellers .seller-price .body .cart-info .info .active .icon i {
    color: #349135;
}

.sellers .info-sellers .seller-price .body .info .row .icon img {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    border: 1px solid #d5d9d9;
}

.sellers .info-sellers .seller-price .body .info .row .icon .fa-truck {
    font-size: 19px;
    margin: 2px 0 0 4px;
    color: #776485;
}

.sellers .info-sellers .seller-price .body .info .row .icon .fa-cube {
    font-size: 20px;
    margin: 0px 0 0 4px;
}

.sellers .info-sellers .seller-price .body .info .row .icon .fa-map-marker-alt {
    font-size: 22px;
    margin: 0 0 0 8px;
}

.sellers .info-sellers .seller-price .body .info .row .right {
    display: flex;
    flex-direction: column;
    width: 100%;
    flex-wrap: nowrap;
    align-items: flex-start;
}

.sellers .info-sellers .seller-price .body .info .row .right .text {
    color: #575959;
    font-weight: 500;
}

.sellers .info-sellers .seller-price .body .cart-info .info .active .right .text {
    color: #007000;
}

.sellers .info-sellers .seller-price .body .info .row .right .strong {
    color: #472B88;
    font-weight: 900;
}

.sellers .info-sellers .seller-price .body .info .row .right .attention {
    color: #e44160;
    font-weight: 900;
}

.sellers .info-sellers .seller-price .body .cart-info .info .active .right .strong {
    color: #007000;
}

.sellers .info-sellers .seller-price .body .cart-info .info .row .right .promo-btn {
    background-color: #FFF0C4;
    padding: 2px 12px;
    font-size: 11px;
    border-radius: 20px;
    font-weight: 500;
    border: 1px solid #D9B036;
    color: #7B6011;
    display: inline-block;
    margin-top: 8px;
    cursor: pointer;
}

.sellers .info-sellers .seller-price .body .cart-info .info .row .right .promo-btn i {
    color: #7B6011;
    font-size: 11px;
}

.sellers .info-sellers .seller-price .body .cart-info .info .row .right .promo-btn:hover {
    background-color: #ffeaaf;
}

.sellers .info-sellers .seller-price .body .info .row .right .promo-btn-white {
    background-color: white;
    padding: 5px 10px;
    font-size: 12px;
    border-radius: 20px;
    font-weight: 500;
    border: 1px solid white;
    color: #472B88;
    margin-top: 10px;
    cursor: pointer;
}

.sellers .info-sellers .seller-price .body .info .row .right .promo-btn-white i {
    color: #472B88;
    font-size: 12px;
}

.sellers .info-sellers .seller-price .body .info .row .right .link {
    font-size: 14px;
    color: #472B88;
    font-weight: 400;
    margin-top: 2px;
    cursor: pointer;
}

.sellers .info-sellers .seller-price .body .info .row .right .link i {
    font-size: 11px;
    color: #472B88;
}

.sellers .info-sellers .seller-price .body .hidden-seller-info {
    display: none;
}

.sellers .info-sellers .seller-price .body .quantity {
    margin-bottom: 20px;
}

.sellers .info-sellers .seller-price .body .cart-info {
    margin-bottom: 10px;
    border-bottom: 1px solid #dbdbdb;
    padding: 15px 0 15px 0;
    border-top: 1px solid #dbdbdb;
    margin-top: 15px;
}

.sellers .info-sellers .seller-price .body .cart-info .chart {
    
}

.sellers .info-sellers .seller-price .body .cart-info .chart .header {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    margin-bottom: 15px;
}

.sellers .info-sellers .seller-price .body .cart-info .chart .header .left {
    margin-top: -2px;
}

.sellers .info-sellers .seller-price .body .cart-info .chart .header .left i {
    color: #467F46;
    font-size: 14px;
}

.sellers .info-sellers .seller-price .body .cart-info .chart .header .left span {
    color: #007000;
    font-weight: 900;
}

.sellers .info-sellers .seller-price .body .cart-info .bar {
    position: relative;
    width: 100%;
    height: 10px;
}

.sellers .info-sellers .seller-price .body .cart-info .show-info {
    height: 35px;
}

.sellers .info-sellers .seller-price .body .cart-info .no-milestones {
    height: 10px;
}

.sellers .info-sellers .seller-price .body .cart-info .bar .bg {
    height: 8px;
    width: 100%;
    background-color: #dddddd;
    border-radius: 10px;
    position: absolute;
    top: 0;
}

.sellers .info-sellers .seller-price .body .cart-info .bar .fill {
    height: 8px;
    background: rgb(72,126,72);
    background: linear-gradient(90deg, rgba(72,126,72,1) 0%, rgba(29,181,29,1) 100%);
    border-radius: 10px;    
    position: absolute;
    top: 0;    
}

.sellers .info-sellers .seller-price .body .cart-info .bar .milestone {
    position: absolute;
    top: -4px;
    display: flex;
    flex-direction: column;
    width: 60px;
    height: 16px;
}

.sellers .info-sellers .seller-price .body .cart-info .show-info .milestone {
    height: 40px;
}

.sellers .info-sellers .seller-price .body .cart-info .show-info .milestone-hidden-labels {
    height: 17px;
}

.sellers .info-sellers .seller-price .body .cart-info .milestone-hidden-labels .pipe,
.sellers .info-sellers .seller-price .body .cart-info .milestone-hidden-labels .text {
    display:  none !important;
}

.sellers .info-sellers .seller-price .body .cart-info .bar .right {
    position: absolute;
    top: -4px;
    display: flex;
    flex-direction: column;
    width: 65px;
    height: 40px;
}

.sellers .info-sellers .seller-price .body .cart-info .bar .milestone .circle {
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background-color: #dddddd;
    text-align: center;
    display: flex;
    position: absolute;
    left: 22px;
    top: -1px;
    align-items: center;
    justify-content: center;
}

.sellers .info-sellers .seller-price .body .cart-info .bar .right .circle {
    right: 0px;
    left: initial;
}

.sellers .info-sellers .seller-price .body .cart-info .bar .completed .circle {
    background-color: #379437;
}

.sellers .info-sellers .seller-price .body .cart-info .bar .warning .circle {
    background-color: #ff9800;
}

.sellers .info-sellers .seller-price .body .cart-info .info .warning .icon i {
    color: #ff9800;
}



.sellers .info-sellers .seller-price .body .cart-info .bar .milestone .circle i {
    color: white;
    font-size: 12px;
}

.sellers .info-sellers .seller-price .body .cart-info .bar .milestone .pipe {
    background-color: #B2AFAF;
    height: 10px;
    width: 1px;
    left: 30px;
    position: absolute;
    top: 16px;
    display: none;
}

.sellers .info-sellers .seller-price .body .cart-info .show-info .milestone .pipe {
    display: block;
}

.sellers .info-sellers .seller-price .body .cart-info .bar .right .pipe {
    left: initial;
    right: 8px;
}

.sellers .info-sellers .seller-price .body .cart-info .bar .completed .pipe {
    background-color: #007000;
}

.sellers .info-sellers .seller-price .body .cart-info .bar .milestone .text {
    position: absolute;
    top: 22px;
    width: 60px;
    text-align: center;
    display: none;
}

.sellers .info-sellers .seller-price .body .cart-info .show-info .milestone .text {
    display: block;
}

.sellers .info-sellers .seller-price .body .cart-info .bar .right .text {
    width: 65px;
    text-align: right;
}

.sellers .info-sellers .seller-price .body .cart-info .bar .milestone .text span {
    color: #888783;
    font-size: 12px;
    font-weight: 500;
}

.sellers .info-sellers .seller-price .body .cart-info .bar .milestone .text span i {
    color: #888783;
    font-size: 11px;
}

.sellers .info-sellers .seller-price .body .cart-info .bar .completed .text span,
.sellers .info-sellers .seller-price .body .cart-info .bar .completed .text span i {
    color: #007000;
}

.sellers .info-sellers .seller-price .body .cart-info .bar .milestone .right {

}

.sellers .info-sellers .seller-price .body .cart-info .chart > .info {
    padding: 20px 0 0px 0;
    display: none;
    margin-bottom: 0;
}

.sellers .info-sellers .seller-price .body .cart-info .btn-container {
    margin-top: 10px;
}

.sellers .info-sellers .seller-price .body .cart-info .btn-container .cart-info-preview {
    font-size: 14px;
    color: #007000;
    display: block;
    margin-bottom: 10px;
}

.sellers .info-sellers .seller-price .body .cart-info .btn-container .cart-info-preview strong {
    font-weight: 500;
    color: #007000;
    font-size: 14px;
}

.sellers .info-sellers .seller-price .body .cart-info .btn-container .cart-info-warning {
    background-color: #fef1c4;
    padding: 5px 10px;
    border-radius: 10px;
    border: 1px solid #d9b035;
    display: flex;
    align-items: center;
}

.sellers .info-sellers .seller-price .body .cart-info .btn-container .cart-info-warning .icon-col {
    width: 25px;
}

.sellers .info-sellers .seller-price .body .cart-info .btn-container .cart-info-warning .icon-col .circle {
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background-color: #ff9800;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 10px;
}

.sellers .info-sellers .seller-price .body .cart-info .btn-container .cart-info-warning .icon-col .circle i {
    color: white;
    font-size: 12px;
}

.sellers .info-sellers .seller-price .body .cart-info .btn-container .cart-info-warning span {
    color: #7c6010;
    font-size: 14px;
}

.sellers .info-sellers .seller-price .body .cart-info .btn-container .cart-info-warning span strong {
    font-weight: 500;
    color: #7c6010;
    font-size: 14px;
}

.sellers .info-sellers .seller-price .body .cart-info .btn-container .cart-info-btn {
    font-size: 14px;
    border-radius: 20px;
    color: #472a88;
    cursor: pointer;
}

.sellers .info-sellers .seller-price .body .cart-info .btn-container .cart-info-btn i {
    color: #472a88;
    font-size: 11px;
}

.sellers .info-sellers .seller-price .body .add .wide-btn-blue {
    background: linear-gradient(111deg, #2d1974 0%, #cd8aed 100%);
    border: none;
    font-weight: 900;
    color: white;
}

.sellers .info-sellers .seller-price .body .add .wide-btn-gray {
    background: linear-gradient(111deg, #bbbbbb 0%, #dcdcdc 100%);
    border: none;
    font-weight: 900;
    color: white;
    cursor: initial;
}

.sellers .info-sellers .seller-price .body .add .wide-btn-blue:hover {
    background: linear-gradient(111deg, #2d1974 0%, #ad71c9 100%);
}

.sellers .info-sellers .seller-price .body .footer {
    margin-top: 15px;
}

.sellers .info-sellers .seller-price .body .footer .text {
    font-size: 14px;
    color: #A2A2A2;
    display: block;
}

.sellers .info-sellers .seller-price .body .footer .link {
    font-size: 14px;
    color: #472B88;
    cursor: pointer;
}

.sellers .info-sellers .updating {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    background-color: #ffffffd4;
    overflow-y: scroll;
    display: none; 
    z-index: 33;
    border-radius: 12px;
    bottom: 0;
}

.sellers .info-sellers .updating .container {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100vh;
}

.sellers .info-sellers .updating .container .lds-ellipsis-container {
    text-align: center;
    padding-top: 0;
    margin-top: -140px;
}

.live-raffle-panel {
    padding: 160px 30px 80px 30px;
    background-color: white;
    margin-bottom: 7px;
    background: linear-gradient(181deg, #f0eef3 0%, #c8e6fe 50%, #c8e6fe 100%);
    height: 100vh;
}

.live-raffle-panel .info {
    display: flex;
    margin-bottom: 30px;
    flex-direction: column;
    align-items: center;
}

.live-raffle-panel .info .left {
    margin-bottom: 30px;
}

.live-raffle-panel .info .left img {
    width: 150px;
}

.live-raffle-panel .info .right {
    display: flex;
    flex-direction: column;
    text-align: left;
    align-items: center;
}

.live-raffle-panel .info .right .title {
    font-size: 22px;
    font-weight: 900;
    color: #422985;
    line-height: 22px;
    margin-bottom: 10px;
}

.live-raffle-panel .info .right .subtitle {
    color: #422985;
    text-align: center;
}

.live-raffle-panel .btns {

}

.live-raffle-panel .btns .live {
    border-radius: 10px;
    display: block;
    text-align: center;
    padding: 13px 0;
    font-weight: 500;
    font-weight: 500;
    color: #d90e5f;
    background-color: transparent;
    border: 1px solid #d90e5f;
    margin-bottom: 15px;
}

.live-raffle-panel .btns .participate {
    color: white;
    background: linear-gradient(111deg, #2d1974 0%, #cd8aed 100%);
    border: none;
    font-weight: 900;
    border-radius: 10px;
    display: block;
    text-align: center;
    padding: 13px 0;
}

.live-raffle-panel .btns .participating {
    color: #008001;
    font-weight: 900;
    display: block;
    text-align: center;
    padding: 14px 0;
    border-radius: 10px;
    background-color: #dbffdc;
}

.live-raffle-panel .btns .participating i {
    color: #008001;
    font-size: 14px;
}

.ad-padding {
    padding: 15px;
}

.ad-image {
    width: 100%;
}

.ad-margin-bottom {
    margin-bottom: 15px;
}

.ad-banner-text {
    padding-bottom: 5px;
    position: relative;
    display: flex;
    height: 20px;
    justify-content: center;
}

.ad-banner-text hr {
    position: absolute;
    top: 9px;
    width: 100%;
    border-top: 1px solid #ff9e9f;
    border-bottom: none;
}

.ad-banner-text span {
    background-color: white;
    padding: 0 8px;
    position: absolute;
    font-size: 14px;
    color: #ff9e9f;
    font-weight: 900;
}

@media (min-width: 320px) {

    .feed .post .body .article a img, .article .image > img { height: 252px; }
    .items-container .items-col-lg .item .image img, 
    .items-container .items-col-lg .item .image { height: 138px; width: 138px; }
    .items-container .items-col-lg .item .image-vertical img, 
    .items-container .items-col-lg .item .image-vertical { height: 179px; width: 138px; }

    .items-container .items-col-carousel .item .image img, 
    .items-container .items-col-carousel .item .image { height: 150px; width: 150px; }
    .items-container .items-col-carousel .item .image-vertical img, 
    .items-container .items-col-carousel .item .image-vertical { height: 195px; width: 150px; }
    .hero .carousel .card { height: 280px; }
    .wide-banner { height: 61px; }

}

@media (min-width: 360px) {

    .interactions > .container > .row > .container > .vote .thumbs-box-left { width: 35px; }
    .interactions > .container > .row > .container > .vote .thumbs-box-right { width: 35px; }

    .feed .post .body .article a img, .article .image > img { height: 287px; }

    .interactions > .container > .row { padding: 0 ; }

    .items-container .items-col-lg .item .image img, 
    .items-container .items-col-lg .item .image { height: 158px; width: 158px; }
    .items-container .items-col-lg .item .image-vertical img, 
    .items-container .items-col-lg .item .image-vertical { height: 205px; width: 158px; }

    .interactions > .container > .row > .container > .post-comment-feed .post-comment-feed-btn,
    .interactions > .container > .row > .container > .post-comment-feed .post-comment-feed { padding: 6px 10px; }
    .interactions > .container > .row > .container > .share .share-btn { padding: 6px 4px; }

    .what-to-do .carousel { height: 270px; }
    .what-to-do .carousel .card {width: 325px;height: 270px;}
    .what-to-do .carousel .card .container .img {height: 128px;width: 315px;}

    .user-milestones .carousel { height: 246px; }
    .user-milestones .carousel .card {width: 325px;height: 246px;}
    .user-milestones .carousel .card .container .img {height: 127px;width: 315px;}

    .hero { min-height: 530px; }
    .hero .menu-cards-container { top: 400px; }
    .hero .carousel .card { height: 315px; }
    .wide-banner { height: 69px; }
    .flickity-prev-next-button { top: 115px; }

}

@media (min-width: 375px) {

    .feed .post .body .article a img, .article .image > img { height: 300px; }

    .items-container .items-col-lg .item .image img, 
    .items-container .items-col-lg .item .image { height: 166px; width: 166px; }
    .items-container .items-col-lg .item .image-vertical img, 
    .items-container .items-col-lg .item .image-vertical { height: 215px; width: 166px; }

    .section-title .title { font-size: 22px; }
    .section-title .title .special { font-size: 22px; }
    .section-title .icon-box i { font-size: 20px; }
    .section-title .subtitle { font-size: 13px; }

    .related-card-container { height: 243px; }
    .article-card-container { height: 368px; }
    .giveaway-card-container { height: 445px; }
    .complete-account-carousel { height: 370px; }
    .complete-account-carousel-signed-out { height: 320px; }

    .related-card-container .card { width: 215px; height: 240px; }
    .article-card-container .article-sm-card { width: 215px; height: 365px; }
    .giveaway-card-container .giveaway-sm-card { width: 215px; height: 440px; }
    .complete-account-carousel .action { width: 215px; height: initial; }

    .biustore-brand-cards { height: 283px; }
    .biustore-brand-cards .card { height: 280px; }

    .related-card-container .card .about-img { height: 134px; }
    .article-card-container .article-sm-card .image { height: 187px; }
    .giveaway-card-container .giveaway-sm-card .image { height: 215px; }
    .complete-account-carousel .action .image { height: 215px; width: 215px; }
    .complete-account-carousel .action .info { width: 200px; }
    .complete-account-carousel .action .info .title { font-size: 19px; }

    .related-card-container .card .profile-img { top: 65px; }

    .article-card-container .article-sm-card .box { height: 144px; }
    .giveaway-card-container .giveaway-sm-card .box { height: 190px; }

    .giveaway-card-container .giveaway-sm-card .box .title { font-size: 19px; line-height: 20px; }

    .related-card-container .card-more { height: 210px; }
    .article-card-container .article-sm-card-more { height: 331px; }
    .article-card-container .article-sm-card-more .article-more-txt { margin-top: 160px; }
    .giveaway-card-container .giveaway-sm-card-more { height: 410px; }
    .giveaway-card-container .giveaway-sm-card-more .giveaway-more-txt { margin-top: 190px; }

    .biustore-brand-cards .card-more {height: 250px;}

    .related-card-container .card .bg > .description { font-size: 13px; }

    .post .header, .post-promo-exclusive .header { height: 45px; }

    .post > .product { height: 50px; }

    .post .header .user .profile, .post .header .brand .profile, .post .header .store .profile, .post .header .community .profile, .post-promo-exclusive .header .brand .profile, .post-promo-exclusive .header .store .profile, .post .user-header .user .user-profile-container { width: 34px; height: 34px; margin-top: 2px; }
    .post .user-header .user .user-profile-container .badge { left: 33px; }
    .post .header .community .profile-follow { left: 36px; top: 36px; }

    .post .header .user .info .top, .post .header .brand .info .top, .post .header .store .info .top, .post .header .community .info .top, .post-promo-exclusive .header .brand .info .top, .post-promo-exclusive .header .store .info .top { height: 18px; }

    .post .header .product .info .top { height: 31px; }

    .post .header .community .info .top .name { font-size: 16px; }

    .post .header .user .info .time, .post .header .brand .info .time, .post .header .store .info .time, .post .header .community .info .time, .post .header .community .info .user-owner, .post-promo-exclusive .header .brand .info .time, .post-promo-exclusive .header .store .info .time, .post .header .user .info .top .user-name, .post .header .community .info .user-owner-promoted, .post .user-header .user .info .top .time, .post .user-header .user .info .bottom, .post .user-header .user .info .bottom .user-skin-type, .post .user-header .user .info .bottom .user-dob, .post .header .community .info .user-owner .user-skin-type, .post .header .community .info .user-owner .user-dob { font-size: 14px; }

    .interactions > .container > .row > .container > .vote .thumbs-box-left > .fa-thumbs-up,
    .interactions > .container > .row > .container > .vote .thumbs-box-right > .fa-thumbs-down,
    .interactions > .container > .row > .container > .post-comment-feed i,
    .interactions > .container > .row > .container > .post-comment-btn i,
    .interactions > .container > .row > .container > .share i
    { font-size: 17px; }

    .interactions > .container > .row > .container > .vote span,
    .interactions > .container > .row > .container > .post-comment-feed .comment-count,
    .interactions > .container > .row > .container > .post-comment-btn .comment-count,
    .interactions > .container > .row > .container > .share span
    { font-size: 16px; }

    .biutienda-header { top: 109px; }

    .biutienda-banners-carousel .banner { width: 326px; height: 124px; }

    .biutienda-banners-carousel .container { height: 124px; }

    .what-to-do .carousel { height: 280px; }
    .what-to-do .carousel .card {width: 340px;height: 280px;}
    .what-to-do .carousel .card .container .img {height: 134px;width: 330px;}

    .what-to-do .carousel .card .container .text .title { font-size: 20px; line-height: 22px; }

    .user-milestones .carousel { height: 255px; }
    .user-milestones .carousel .card {width: 340px;height: 255px;}
    .user-milestones .carousel .card .container .img {height: 134px;width: 330px;}

    .user-milestones .carousel .card .container .text .title { font-size: 20px; line-height: 22px; }

    .image-wide {height: 140px;}

    .new-content-modal > .container > .bg { max-width: 320px; }

    .hero { min-height: 520px; }
    .hero .menu-cards-container { top: 390px; }
    .hero .carousel .card { height: 328px; }
    .wide-banner { height: 72px; }
    .flickity-prev-next-button { top: 120px; }

}

@media (min-width: 412px) {

    .feed .post .body .article a img, .article .image > img { height: 332px; }

    .interactions > .container > .row { padding: 0 5px; }

    .related-card-container { height: 250px; }
    .article-card-container { height: 383px; }
    .giveaway-card-container { height: 445px; }
    .complete-account-carousel { height: 370px; }
    .complete-account-carousel-signed-out { height: 320px; }

    .related-card-container .card { width: 230px; height: 245px; }
    .article-card-container .article-sm-card { width: 230px; height: 380px; }
    .giveaway-card-container .giveaway-sm-card { width: 230px; height: 440px; }
    .complete-account-carousel .action { width: 230px; height: initial; }

    .related-card-container .card .about-img { height: 143px; }
    .article-card-container .article-sm-card .image { height: 200px; }
    .giveaway-card-container .giveaway-sm-card .image { height: 230px; }
    .complete-account-carousel .action .image { height: 230px; width: 230px; }

    .related-card-container .card .profile-img { top: 73px;width: 80px;height: 80px; }

    .article-card-container .article-sm-card .box { height: 146px; }
    .giveaway-card-container .giveaway-sm-card .box { height: 175px; }

    .related-card-container .card-more { height: 215px; }
    .article-card-container .article-sm-card-more { height: 350px; }
    .article-card-container .article-sm-card-more .article-more-txt { margin-top: 160px; }
    .giveaway-card-container .giveaway-sm-card-more { height: 410px; }
    .giveaway-card-container .giveaway-sm-card-more .giveaway-more-txt { margin-top: 195px; }

    .section-title .title { font-size: 23px; }
    .section-title .title .special { font-size: 23px; }
    .section-title .icon-box i { font-size: 21px; }
    .section-title .subtitle { font-size: 14px; }

    .post .header, .post-promo-exclusive .header { height: 47px; }

    .post > .product { height: 52px; }

    .post .header .user .profile, .post .header .brand .profile, .post .header .store .profile, .post .header .community .profile, .post-promo-exclusive .header .brand .profile, .post-promo-exclusive .header .store .profile, .post .user-header .user .user-profile-container { width: 35px; height: 35px; }
    .post .user-header .user .user-profile-container .badge { left: 35px; }
    .post .header .community .profile-follow { left: 38px; top: 38px; }

    .related-card-container .card-more span { margin-top: 80px; }

    .items-container .items-col-lg .item .image img, 
    .items-container .items-col-lg .item .image { height: 184px; width: 184px; }
    .items-container .items-col-lg .item .image-vertical img, 
    .items-container .items-col-lg .item .image-vertical { height: 239px; width: 184px; }

    .biutienda-header-bg { height: 170px; }
    .biutienda-header { top: 120px; }

    .biutienda-banners-carousel .banner { width: 360px; height: 137px; }

    .biutienda-banners-carousel .container { height: 137px; }

    .what-to-do .carousel { height: 310px; }
    .what-to-do .carousel .card {width: 380px;height: 305px;}
    .what-to-do .carousel .card .container .img {height: 148px;width: 370px;}

    .what-to-do .carousel .card .container .text .title { font-size: 22px; line-height: 24px; }
    .what-to-do .carousel .card .container .text .subtitle { font-size: 16px; line-height: 18px; }

    .user-milestones .carousel { height: 275px; }
    .user-milestones .carousel .card {width: 380px;height: 275px;}
    .user-milestones .carousel .card .container .img {height: 148px;width: 370px;}

    .user-milestones .carousel .card .container .text .title { font-size: 22px; line-height: 24px; }
    .user-milestones .carousel .card .container .text .subtitle { font-size: 16px; line-height: 18px; }

    .image-wide {height: 155px;}

    .wide-btn, .wide-btn-white { padding: 15px 0; font-size: 17px; }

    .hero { min-height: 540px; }
    .hero .menu-cards-container { top: 410px; }
    .hero .carousel .card { height: 360px; }
    .wide-banner { height: 79px; }
    .flickity-prev-next-button { top: 125px; }

}

@media (min-width: 414px) {

    .feed .post .body .article a img, .article .image > img { height: 334px; }
    .items-container .items-col-lg .item .image img, 
    .items-container .items-col-lg .item .image { height: 184px; width: 184px; }
    .items-container .items-col-lg .item .image-vertical img, 
    .items-container .items-col-lg .item .image-vertical { height: 239px; width: 184px; }
    .hero { min-height: 540px; }
    .hero .menu-cards-container { top: 410px; }
    .hero .carousel .card { height: 362px; }
    .wide-banner { height: 80px; }
}

@media (min-width: 425px) {
    .hero { min-height: 550px; }
    .hero .menu-cards-container { top: 420px; }
    .hero .carousel .card { height: 372px; }
    .wide-banner { height: 81px; }
    .flickity-prev-next-button { top: 130px; }
}

@media (min-width: 500px) {
    .hero { min-height: 600px; }
    .hero .menu-cards-container { top: 470px; }
    .hero .carousel .card { height: 437px; }
    .wide-banner { height: 96px; }
    .flickity-prev-next-button { top: 155px; }
}

@media (min-width: 680px) {

    body {
        background-color: white;
    }

    .btn-md:hover {
        background-color: #f9f4fe;
    }

    .transparent-btn:hover {
        color: gray;
    }

    .btn-md-active:hover {
        background-color: #ffa3a3;
    }

    .content-modal-btn {
        display: none;
    }

    .post-user .top .user-profile {
        margin-top: 3px;
    }

    .scroll-up-btn {
        transform: initial;
        left: -110px;
        right: 0;
        margin: auto;
        width: 115px;
    }

    .post .header .action .post-bookmark-btn:hover .fa-bookmark-inactive,
    .post .header .action .post-bookmark-btn:hover .fa-bookmark-active {
        color: #ff9f9f;
    }

    .wide-btn:hover {
        background-color: #fff8f8;
    }

    .close-wide-btn:hover {
        background-color: #e3e5e6;
    }

    .interactions > .container > .row { padding: 0 5px; }

    .feed-show .interactions > .container > .row { padding: 0 30px; }

    .interactions > .container > .row > .container > .vote .thumbs-box-left { width: 31px; }
    .interactions > .container > .row > .container > .vote .thumbs-box-right { width: 31px; }

    .interactions > .container > .row > .container > .post-comment-feed,
    .interactions > .container > .row > .container > .post-comment { width: 34%; }
    .interactions > .container > .row > .container > .share { width: 33%; }
    .interactions > .container > .row > .container > .share .share-btn {
        padding: 6px 6px;
    }

    .interactions > .container > .row > .container > .vote .thumbs-box-left > .fa-thumbs-up,
    .interactions > .container > .row > .container > .vote .thumbs-box-right > .fa-thumbs-down,
    .interactions > .container > .row > .container > .post-comment-feed i,
    .interactions > .container > .row > .container > .post-comment-btn i
    { font-size: 16px; }

    .interactions > .container > .row > .container > .share i
    { font-size: 15px; }

    .interactions > .container > .row > .container > .vote span,
    .interactions > .container > .row > .container > .post-comment-feed .comment-count,
    .interactions > .container > .row > .container > .post-comment-btn .comment-count,
    .interactions > .container > .row > .container > .share span
    { font-size: 16px; }

    .root .menu-top .menu-nav > .container .nav-a > .container:hover {
        background-color: #fff5f5;
    }

    .interactions > .container > .row > .container > .vote .thumbs-box-right:hover,
    .interactions > .container > .row > .container > .vote .thumbs-box-left:hover {
        background-color: #fff5f5;
    }

    .interactions > .container > .row > .container > .vote .thumbs-box-left:hover > .fa-thumbs-up,
    .interactions > .container > .row > .container > .vote .thumbs-box-right:hover > .fa-thumbs-down {
        color: #FF9F9F;
    }

    .interactions > .container > .row > .container > .post-comment-feed:hover .post-comment-feed-btn,
    .interactions > .container > .row > .container > .post-comment:hover .post-comment-btn {
        background-color: #fff5f5;
    }

    .interactions > .container > .row > .container > .post-comment-feed:hover .post-comment-feed-btn i,
    .interactions > .container > .row > .container > .post-comment-feed:hover .post-comment-feed-btn .comment-count,
    .interactions > .container > .row > .container > .post-comment:hover .post-comment-btn i,
    .interactions > .container > .row > .container > .post-comment:hover .post-comment-btn .comment-count     {
        color: #FF9F9F;
    }

    .interactions > .container > .row > .container > .share:hover .share-btn {
        background-color: #fff5f5;
    }

    .interactions > .container > .row > .container > .share:hover .share-btn i,
    .interactions > .container > .row > .container > .share:hover .share-btn span {
        color: #FF9F9F;
    }

    .comment .footer .new-comment:hover,
    .comment .footer .new-comment-detached:hover {
        background-color: #fff5f5;
    }

    .comment .footer .new-comment:hover i,
    .comment .footer .new-comment-detached:hover i {
        color: #FF9F9F;
    }

    .wide-btn, .wide-btn-white { padding: 12px 0; font-size: 16px; }

    /* desktop wrapper */

    .root {
        height: 100%;
    }

    .root > .container  {
        min-height: 796px;
        z-index: 0;
        width: 100%;
        margin: auto;
        max-width: 673px;
    }

    .root > .container .menu-column {
        position: relative;
    }

    .root .ribbon-sign-in  {
        position: fixed;
        background: linear-gradient(111deg, #ff6e6e 0%, #ff9e9e 100%);
        width: 100%;
        bottom: 0;
        height: 80px;
        padding: 0;
        border-top-left-radius: 0;
        border-top-right-radius: 0;
        display: block;
    }

    .root .ribbon-biutesting {
        display: block;
        position: initial;
        bottom: initial;
        background: linear-gradient(111deg, #8bc34a 0%, #4caf50 100%);
        height: initial;
        padding: 20px;
        width: initial;
    }

    .root .ribbon-sign-in > .container  {
        z-index: 0;
        width: 100%;
        margin: auto;
        max-width: 673px;
        padding: 0;
    }

    .root .ribbon-sign-in .menu-column-ribbon {

    }

    .root .ribbon-sign-in .main-column-ribbon {
        padding-left: 15px;
    }

    .root .ribbon-sign-in .main-column-ribbon .primary-column-ribbon {
        float: left;
        height: 70px;
        padding-top: 20px;
    }

    .root .ribbon-sign-in .main-column-ribbon .primary-column-ribbon .top {
        display: block;
        font-weight: 900;
        font-size: 18px;
        color: white;
    }

    .root .ribbon-sign-in .main-column-ribbon .primary-column-ribbon .bottom {
        display: block;
        color: white;
        cursor: pointer;
    }

    .root .ribbon-sign-in .main-column-ribbon .sidebar-column-ribbon {
        padding: 20px;
        float: left;
    }

    .root .ribbon-sign-in .main-column-ribbon .sidebar-column-ribbon .transparent-btn {
        border: 1px solid white;
        background-color: transparent;
        color: white;
        margin-right: 5px;
    }

    .root .menu-column {

    }

    .root .menu-column > .menu {
        height: 100%;
        top: 0px;
        position: fixed;
        width: 88px;
    }

    .root .menu-column > .menu > .container {
        overflow-y: auto;
        height: 100%;
        padding-left: 15px;
        padding-right: 15px;
    }

    .root .menu-top {

    }

    .root .menu-top .biulogo {
        padding-top: 5px;
        padding-bottom: 15px;
    }

    .root .menu-top .biulogo > .container {

    }

    .root .menu-top .biulogo > .container .biutest-lg {
        display: inline-block;
        padding: 10px 15px;
        border-radius: 20px;
        display: none;
    }

    .root .menu-top .biulogo > .container .biutest-lg:hover {
        background-color: #fff5f5;
    }

    .root .menu-top .biulogo > .container .biutest-lg .biutest-logo {
        width: 135px;
    }

    .root .menu-top .biulogo > .container .biutest-sq {
        display: block;
        overflow: hidden;
        border-radius: 50%;
        height: 75px;
        width: 75px;
        margin: auto;
        margin-left: -6px;
    }

    .root .menu-top .biulogo > .container .biutest-sq .biutest-logo {
        width: 75px;
        height: 75px;
    }

    .root .menu-top .menu-nav {
        width: 100%;
    }

    .root .menu-top .menu-nav > .container {

    }

    .root .menu-top .menu-nav > .container .nav-a {
        display: inline-block;
        width: 70px;
    }

    .root .menu-top .menu-nav > .container .nav-a > .container {
        max-width: 100%;
        padding: 12px 0px 11px 0;
        height: 51px;
        border-radius: 20px;
        text-align: center;
        margin-left: -7px;
    }

    .root .menu-top .menu-nav > .container .nav-a > .container .nav-icon {
        float: initial;
        height: 35px;
        width: 35px;
        text-align: center;
        margin: auto;
    }

    .root .menu-top .menu-nav > .container .nav-a > .container .nav-text-col {
        line-height: 12px;
        font-size: 12px;
        font-weight: 700;
        overflow-wrap: break-word;
        min-width: 0px;
        max-width: 100%;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .root .menu-top .menu-nav > .container .nav-a > .container .nav-text-col .nav-text {
        font-family: inherit;
        overflow-wrap: break-word;
        min-width: 0px;
        font-size: 12px;
        font-weight: 900;
        color: #988b9e;
        font: inherit;
        white-space: inherit;
        font-size: 11px;
    }

    .root .menu-top .menu-nav > .container .nav-a > .container:hover .nav-text-col .nav-text,
    .root .menu-top .menu-nav > .container .nav-a > .container:hover .nav-icon i {
        color: #FF9F9F;
    }

    .root .menu-top .menu-nav > .container .nav-a > .container .nav-icon i {
        color: #988b9e;
        font-size: 24px;
        margin-top: 4px;
    }

    .root .menu-top .menu-nav > .container .active > .container .nav-icon i {
        color: #FF9F9F;
    }

    .root .menu-top .menu-nav > .container .active .container .nav-text-col > .nav-text {
        color: #FF9F9F !important;
    }

    .root .menu-top .menu-action {
        margin-top: 12px;
        margin-left: 0;
    }

    .root .menu-top .menu-action .action-btn-lg {
        height: 20px;
        cursor: pointer;
        border-radius: 10px;
        display: block;
        text-align: center;
        padding: 13px 0;
        width: 100%;
        background: linear-gradient(111deg, #2d1974 0%, #cd8aed 100%);
        max-width: 200px;
        display: none;
    }

    .root .menu-top .menu-action .action-btn-lg > .container  {
        display: table;
        margin: auto;
    }

    .root .menu-top .menu-action .action-btn-lg > .container i {
        color: white;
        margin: 0px 7px 0 0;
        font-size: 20px;
        float: left;
    }

    .root .menu-top .menu-action .action-btn-lg > .container .text {
        color: white;
        font-weight: 900;
        font-size: 18px;
        float: left;
        margin: -1px 0 0 0;
    }

    .root .menu-top .menu-action .action-btn-lg:hover {
        background: linear-gradient(111deg, #2d1974 0%, #ad71c9 100%);
    }

    .root .menu-top .menu-action .action-btn-sq {
        cursor: pointer;
        margin: auto;
        width: 50px;
        height: 50px;
        text-align: center;
        border-radius: 50%;
        border: 4px solid white;
        position: relative;
        background: linear-gradient(111deg, #2d1974 0%, #cd8aed 100%);
        box-shadow: 2px 2px 4px #00000038;
    }

    .root .menu-top .menu-action .action-btn-sq i {
        color: white;
        font-size: 24px;
        margin-top: 14px;
    }

    .root .menu-top .menu-action .action-btn-sq:hover {
        background: linear-gradient(111deg, #2d1974 0%, #ad71c9 100%);
    }

    .root .menu-bottom {
        position: absolute;
        bottom: 15px;
        margin-left: -5px;
        left: 0;
        right: 0;
        width: 72px;
        margin: auto;
    }

    .root .menu-bottom > .user-profile {
        cursor: pointer;
        margin: auto;
    }

    .root .menu-bottom > .user-profile > .container {
        align-items: center;
        padding: 12px;
        border-radius: 20px;
    }

    .root .menu-bottom > .user-profile > .container:hover {
        background-color: #fff5f5;
    }

    .root .menu-bottom > .user-profile > .container > .user-profile {
        height: 45px;
        width: 45px;
        border-radius: 50%;
        overflow: hidden;
        margin: auto;
    }

    .root .menu-bottom > .user-profile > .container > .user-profile .user-profile-img {
        width: 100%;
    }

    .root .menu-bottom > .user-profile > .container .user-info {

    }

    .root .menu-bottom > .user-profile > .container .user-info > .container {
        max-width: 100%;
        margin-top: 6px;
        text-align: center;
    }

    .root .menu-bottom > .user-profile > .container .user-info > .container .user-info-top {

    }

    .root .menu-bottom > .user-profile > .container .user-info > .container .user-info-top .user-info-name {
        font-size: 12px;
        font-weight: 900;
    }

    .root .menu-bottom > .user-profile > .container .user-info > .container .user-info-top .brand-name {
        font-family: "Space Mono", sans-serif;
        text-transform: uppercase;
    }

    .root .menu-bottom > .user-profile > .container .user-info > .container .user-info-top .brand-name i {
        color: #676767;
        margin-left: 3px;
        display: none;
    }

    .root .menu-bottom > .user-profile > .container .user-info > .container .user-info-bottom {

    }

    .root .menu-bottom > .user-profile > .container .user-info > .container .user-info-bottom span {
        font-size: 11px;
        display: block;
        color: #909090;
    }

    .root .menu-bottom > .user-profile > .container > .user-profile-sign-in {
        border: 3px solid #ff9e9e;
        width: 45px;
        height: 45px;
        border-radius: 50%;
        margin: auto;
        margin-top: 2px;
        float: left;
        text-align: center;
    }

    .root .menu-bottom > .user-profile > .container > .user-profile-sign-in i {
        font-size: 24px;
        margin: auto;
        margin-top: 10px;
        color: #ff9e9e;
    }

    .root .main-column {
        padding-left: 90px;
    }

    .root .main-column > .container {
        width: 100%;
        min-height: 100%;
    }

    .root .main-column .primary-column {
        width: 100%;
        float: left;
        min-height: 100vh;
        border-left: 1px solid #E5E5E5;
        border-right: 1px solid #E5E5E5;
        overflow: hidden;
        background-color: #f0eef3;
        position: relative;
    }

    .root .main-column .primary-column,
    .fixed-home-section-menu,
    .feed .interactions-wrapper,
    .feed .interactions,
    .post-show-div .user-comment-btn,
    .post-show-div .post-comments-container {
        max-width: 360px;
    }

    .root .main-column .primary-column .filter-menu > .container > .btn > .text {
        font-size: 15px;
    }

    .giveaway-card-container .btns-nav-scroll .left-btn,
    .giveaway-card-container .btns-nav-scroll .right-btn {
        margin-top: 180px;
    }

    .biutienda-gradient-bg .btns-nav-scroll .left-btn,
    .biutienda-gradient-bg .btns-nav-scroll .right-btn {
        top: 178px;
    }

    .biutienda-brand .btns-nav-scroll .left-btn,
    .biutienda-brand .btns-nav-scroll .right-btn {
        top: 298px;
    }

    .article-card-container .btns-nav-scroll .left-btn,
    .article-card-container .btns-nav-scroll .right-btn {
        margin-top: 170px;
    }

    .review-notif-container .btns-nav-scroll .left-btn,
    .review-notif-container .btns-nav-scroll .right-btn {
        margin-top: 90px;
    }

    .question-notif-container .btns-nav-scroll .left-btn,
    .question-notif-container .btns-nav-scroll .right-btn {
        margin-top: 110px;
    }

    .product-carousel .btns-nav-scroll .left-btn,
    .product-carousel .btns-nav-scroll .right-btn {
        margin-top: 100px;
    }

    .related-card-container .btns-nav-scroll .left-btn,
    .related-card-container .btns-nav-scroll .right-btn {
        margin-top: 90px;
    }

    .carousel-card-history .btns-nav-scroll .left-btn,
    .carousel-card-history .btns-nav-scroll .right-btn {
        margin-top: 55px;
    }

    .user-milestones-panel,
    .promos-hero {
        position: relative;
    }

    .user-milestones-panel .btns-nav-scroll .left-btn,
    .user-milestones-panel .btns-nav-scroll .right-btn {
        top: 188px;
    }

    .promos-hero .btns-nav-scroll .left-btn,
    .promos-hero .btns-nav-scroll .right-btn {
        top: 110px;
    }

    .root .main-column .primary-column .btns-nav-scroll {
        top: 60px;
    }

    .root .main-column .primary-column .items-box .btns-nav-scroll {
        margin-top: 60px;
    }

    .btns-nav-scroll .left-btn {
        width: 50px;
        height: 50px;
        background-color: #eff2f5eb;
        border-radius: 50%;
        text-align: center;
        position: absolute;
        left: 15px;
        z-index: 10;
        border: 4px solid white;
        box-shadow: 2px 2px 4px #00000038;
        cursor: pointer;
        display: none;
    }

    .btns-nav-scroll .left-btn i {
        font-size: 26px;
        color: #0000004d;
        margin-top: 12px;
        margin-left: -2px;
    }

    .btns-nav-scroll .right-btn {
        width: 50px;
        height: 50px;
        background-color: #eff2f5eb;
        border-radius: 50%;
        text-align: center;
        position: absolute;
        right: 15px;
        z-index: 10;
        border: 4px solid white;
        box-shadow: 2px 2px 4px #00000038;
        cursor: pointer;
    }

    .btns-nav-scroll .right-btn i {
        font-size: 26px;
        color: #0000004d;
        margin-top: 12px;
        margin-left: 2px;
    }

    .tagged-products .btns-tagged-scroll {

    }

    .tagged-products .btns-tagged-scroll .left-btn,
    .tw-menu .btns-tw-menu-scroll .left-btn {
        width: 30px;
        height: 30px;
        background-color: #eff2f5eb;
        border-radius: 50%;
        text-align: center;
        position: absolute;
        left: 15px;
        z-index: 10;
        border: 4px solid white;
        box-shadow: 2px 2px 4px #00000038;
        cursor: pointer;
        margin-top: 1px;
        display: none;
    }

    .tagged-products .btns-tagged-scroll .left-btn i,
    .tw-menu .btns-tw-menu-scroll .left-btn i {
        font-size: 19px;
        color: #0000004d;
        margin-top: 6px;
        margin-left: -2px;
    }

    .tagged-products .btns-tagged-scroll .right-btn,
    .tw-menu .btns-tw-menu-scroll .right-btn {
        width: 30px;
        height: 30px;
        background-color: #eff2f5eb;
        border-radius: 50%;
        text-align: center;
        position: absolute;
        right: 15px;
        z-index: 10;
        border: 4px solid white;
        box-shadow: 2px 2px 4px #00000038;
        cursor: pointer;
        margin-top: 1px;
    }

    .tagged-products .btns-tagged-scroll .right-btn i,
    .tw-menu .btns-tw-menu-scroll .right-btn i {
        font-size: 19px;
        color: #0000004d;
        margin-top: 6px;
        margin-left: 2px;
    }

    .tagged-products .btns-tagged-scroll .right-btn-bg,
    .tw-menu .btns-tw-menu-scroll .right-btn-bg {
        background: linear-gradient(90deg, #ffffff00 0%, #ffffff 15%, #ffffff 100%);
        height: 45px;
        width: 72px;
        position: absolute;
        right: 0;
        z-index: 9;
    }

    .tw-menu .btns-tw-menu-scroll .right-btn-bg {
        height: 43px;
    }

    .tagged-products .btns-tagged-scroll .left-btn-bg,
    .tw-menu .btns-tw-menu-scroll .left-btn-bg {
        background: linear-gradient(90deg, #ffffff 0%, #ffffff 75%, #ffffff00 100%);
        height: 45px;
        width: 85px;
        position: absolute;
        left: 0;
        z-index: 9;
        display: none;
    }

    .tw-menu .btns-tw-menu-scroll .left-btn-bg {
        height: 43px;
    }

    .root .main-column .primary-column .biutienda-header-bg {
        margin-bottom: 30px;
        height: 130px;
    }

    .root .main-column .primary-column .biutienda-header-bg .bg-cropped .bg-img {
        height: 145px;
    }

    .root .main-column .sidebar-column {
        height: 100%;
        float: right;
        width: 220px;
    }

    .root .main-column .sidebar-column > .container {
        padding: 0 15px;
        height: 100%;
        position: fixed;
        width: 190px;
        overflow-y: scroll;
    }

    .root .main-column .sidebar-column > .container .search {
        width: 190px;
        padding-bottom: 15px;
        padding-top: 15px;
        position: fixed;
        background-color: white;
        z-index: 20;
    }

    .root .main-column .sidebar-column > .container .search .bar {
        background-color: #f0eef3;
        border-radius: 10px;
        padding: 13px 10px;
        cursor: pointer;
    }

    .root .main-column .sidebar-column > .container .search .bar span {
        color: #66566c;
        display: -webkit-box;
        -webkit-line-clamp: 1;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }

    #search-in-biutest-text {
        display: initial;
    }

    #search-products-text {
        display: none;
    }

    .root .main-column .sidebar-column > .container .search .bar i {
        color: #66566c;
        font-size: 14px;
        margin: 3px 5px 0 5px;
        float: left;
    }

    .root .main-column .sidebar-column > .container .search .bar:hover {
        background-color: #e8e5e8;
    }

    .root .main-column .sidebar-column > .container .sidebar-panels {
        margin-bottom: 15px;
        padding-top: 135px;
    }

    .root .main-column .sidebar-column > .container .sidebar-panels .sidebar-panel {
        background-color: #ffffff;
        border-radius: 10px;
        margin-bottom: 15px;
        border: 1px solid #e5e5e5;
        padding: 15px 0 15px 0;
    }

    .root .main-column .sidebar-column > .container .sidebar-panels .sidebar-panel-gray {
        background-color: #fcfbfd;
    }

    .root .main-column .sidebar-column > .container .sidebar-panels .sidebar-panel-biutienda {
        background: #e8c6f8;
        background: linear-gradient(180deg, #e8c6f8 0%, #ffffff 69%, #ffffff 100%);
        padding-top: 0;
        position: relative;
    }

    .root .main-column .sidebar-column > .container .sidebar-panels .sidebar-panel-biutienda .biutienda-header {
        width: 210px;
    }

    .root .main-column .sidebar-column > .container .sidebar-panels .sidebar-panel .header {
        margin: 0 15px 15px 15px;
    }

    .root .main-column .sidebar-column > .container .sidebar-panels .sidebar-panel .header .title {
        font-size: 21px;
        line-height: 22px;
        color: #ff9f9f;
        font-weight: 900;
        display: inline-block;
        letter-spacing: -0.5px;
        margin-left: 0;
    }

    .root .main-column .sidebar-column > .container .sidebar-panels .sidebar-panel .header .subtitle {
        display: block;
        margin-top: 3px;
        font-size: 14px;
        line-height: 17px;
        color: #6d6d6d;
        margin-left: 0;
    }

    .notifications-sidebar-panel {
        background-color: #ffffff;
        border-radius: 10px;
        margin-bottom: 15px;
        border: 1px solid #e5e5e5;
    }

    .notifications-sidebar-panel .top {
        display: table;
        width: 180px;
        padding: 0px 0px 0 10px;
/*        border-bottom: 1px solid #e5e5e5;*/
    }

    .notifications-sidebar-panel .top .left {
        cursor: pointer;
        float: left;
        height: 44px;
        overflow: hidden;
    }

    .notifications-sidebar-panel .top .right {
        cursor: pointer;
        float: left;
        height: 44px;
        overflow: hidden;
    }

    .notifications-sidebar-panel .top .left .container {
        padding: 12px 7px;
        height: 17px;
        border-top-left-radius: 9px;
        border-top-right-radius: 8px;
    }

    .notifications-sidebar-panel .top .right .container {
        padding: 12px 7px;
        height: 20px;
        border-top-left-radius: 8px;
        border-top-right-radius: 8px;
    }

    .notifications-sidebar-panel .top .active {
        background-color: white;
    }

    .notifications-sidebar-panel .top .left .container:hover,
    .notifications-sidebar-panel .top .right .container:hover {
        background-color: #fff5f5;
    }

    .notifications-sidebar-panel .top .left .underline-placeholder {

    }

    .notifications-sidebar-panel .top .left .underline-placeholder .underline {
        background-color: #ff9f9f;
        height: 3px;
        display: block;
    }

    .notifications-sidebar-panel .top .left .text,
    .notifications-sidebar-panel .top .right .text {
        float: left;
    }

    .notifications-sidebar-panel .top .left .text span,
    .notifications-sidebar-panel .top .right .text span {
        color: #b1a8b5;
        font-size: 18px;
        font-weight: 900;
    }

    .notifications-sidebar-panel .top .right .text .activity-full {
        display: none;
    }

    .notifications-sidebar-panel .top .right .text .activity-sm {
        display: initial;
    }

    .notifications-sidebar-panel .top .left .text i,
    .notifications-sidebar-panel .top .right .text i {
        color: #b1a8b5;
        font-size: 15px;
    }

    .notifications-sidebar-panel .top .active .text span,
    .notifications-sidebar-panel .top .active .text i {
        color: #FF9F9F;
    }

    .notifications-sidebar-panel .top .left .circle,
    .notifications-sidebar-panel .top .right .circle {
        width: 16px;
        height: 16px;
        background-color: #FF5072;
        border-radius: 50%;
        text-align: center;
        float: left;
        margin-left: 5px;
        margin-top: 3px;
    }

    .notifications-sidebar-panel .top .left .circle span,
    .notifications-sidebar-panel .top .right .circle span {
        color: white;
        font-size: 13px;
        font-weight: 900;
        display: block;
        margin-top: 1px;
    }

    .notifications-sidebar-panel .bottom {

    }

    .notifications-sidebar-panel .bottom .ribbon {
        background-color: #ffffff;
        padding: 7px 13px 0px 13px;
        margin-bottom: 10px;
    }

    .notifications-sidebar-panel .bottom .ribbon span {
        font-size: 14px;
        color: #6d6d6d;
    }

    .notifications-sidebar-panel .bottom .ribbon i {
        font-size: 14px;
        color: white;
    }

    .notifications-sidebar-panel .item-row {
        height: 45px;
        margin-bottom: 10px;
        padding: 0 15px;
    }

    .notifications-sidebar-panel .item-row .img-col {
        height: 40px;
        width: 40px;
        border-radius: 50%;
        overflow: hidden;
        float: left;
        border: 1px solid lightgray;
        margin-top: 4px;
    }


    .notifications-sidebar-panel .item-row .img-col .img {
        width: 100%;
    }

    .notifications-sidebar-panel .item-row .info-col {
        padding: 8px 0 0 50px;
        width: 130px;
    }

    .notifications-sidebar-panel .item-row .info-col .info-a {
        display: inline-block;
        max-width: 150px;
    }

    .notifications-sidebar-panel .item-row .info-col .see-more {
        padding: 7px 12px;
        border: 1px solid #ff9e9e;
        color: #ff9e9e;
        border-radius: 10px;
        font-weight: 500;
        cursor: pointer;
        background-color: white;
        position: absolute;
        right: 30px;
        display: inline-block;
        font-size: 14px;
    }

    .notifications-sidebar-panel .item-row .info-col .see-more:hover {
        background-color: #fff5f5;
    }

    .notifications-sidebar-panel .item-row .info-col .name {
        font-weight: 900;
        display: block;
        font-size: 16px;
        line-height: 16px;
        display: -webkit-box;
        -webkit-line-clamp: 1;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }

    .notifications-sidebar-panel .item-row .info-col .brand {
        font-family: "Space Mono";
        text-transform: uppercase;
    }

    .notifications-sidebar-panel .item-row .info-col .type {
        font-size: 14px;
        color: gray;
        overflow: hidden;
        height: 19px;
        display: inline-block;
    }

    .root .main-column .sidebar-column > .container .sidebar-panels .sidebar-panel-hero-signed-in {
        position: relative;
        background-color: #E9C6F8;
        width: auto;
        border: none;
        padding: 0;
        overflow: hidden;
        height: 227px;
    }

    .root .main-column .sidebar-column > .container .sidebar-panels .sidebar-panel-hero-signed-in .slogan {
        font-size: 20px;
        line-height: 22px;
        font-weight: 900;
        color: #0C057E;
        display: block;
        max-width: 220px;
        padding: 15px;
        position: absolute;
        z-index: 5;
        text-shadow: -2px 2px 0px #faf0ff;
    }

    .root .main-column .sidebar-column > .container .sidebar-panels .sidebar-panel-hero-signed-in .img {
        margin-top: -55px;
        position: absolute;
        width: 320px;
        top: 110px;
        z-index: 1;
    }

    .root .main-column .sidebar-column > .container .sidebar-panels .sidebar-panel-hero-signed-in .img img {
        width: 100%;
    }

    .root .main-column .sidebar-column > .container .sidebar-panels .sidebar-panel-hero-signed-out {
        position: relative;
        background-color: #E9C6F8;
        width: auto;
        border: none;
        padding: 0;
        overflow: hidden;
        height: 277px;
        margin-bottom: 0;
        border-bottom-left-radius: 0;
        border-bottom-right-radius: 0;
    }

    .root .main-column .sidebar-column > .container .sidebar-panels .sidebar-panel-hero-signed-out .top {
        position: relative;
        padding: 15px;
        max-width: 220px;
        z-index: 2;
    }

    .root .main-column .sidebar-column > .container .sidebar-panels .sidebar-panel-hero-signed-out .slogan {
        font-size: 20px;
        line-height: 22px;
        font-weight: 900;
        color: #0C057E;
        display: block;
        z-index: 5;
    }

    .root .main-column .sidebar-column > .container .sidebar-panels .sidebar-panel-hero-signed-out .btn-md {
        background-color: transparent;
        color: #0c067e;
        border: 1px solid #0c067e;
        margin-top: 15px;
    }

    .root .main-column .sidebar-column > .container .sidebar-panels .sidebar-panel-hero-signed-out .btn-md:hover {
        background-color: white;
        color: #0c067e;
    }

    .root .main-column .sidebar-column > .container .sidebar-panels .sidebar-panel-hero-signed-out .img {
        position: absolute;
        width: 320px;
        top: 105px;
        z-index: 1;
        right: 0;
    }

    .root .main-column .sidebar-column > .container .sidebar-panels .sidebar-panel-hero-signed-out .img img {
        width: 100%;
    }

    .root .main-column .sidebar-column > .container .sidebar-panels .sidebar-panel-what-to-do {
        width: 100%;
        border-top-left-radius: 0;
        border-top-right-radius: 0;
        border-top: none;
    }

    .root .main-column .sidebar-column > .container .sidebar-panels .sidebar-panel-what-to-do-signed-in {
        border-radius: 10px;
        border: 1px solid #e5e5e5;
    }

    .root .main-column .sidebar-column > .container .sidebar-panels .sidebar-panel-what-to-do .carousel {
        display: flex;
        flex-wrap: nowrap;
        overflow: auto;
        padding: 0 15px;
        -webkit-overflow-scrolling: touch;
        overflow-y: hidden;
        height: 213px;
    }

    .root .main-column .sidebar-column > .container .sidebar-panels .sidebar-panel-what-to-do .carousel {
        height: 245px;
    }

    .root .main-column .sidebar-column > .container .sidebar-panels .sidebar-panel-what-to-do-signed-in .carousel {
        height: 235px;
    }

    .root .main-column .sidebar-column > .container .sidebar-panels .sidebar-panel-what-to-do .carousel .card {
        width: 185px;
        height: 210px;
        display: inline-block;
    }

    .root .main-column .sidebar-column > .container .sidebar-panels .sidebar-panel-what-to-do .carousel .card .container {
        padding-right: 15px;
    }

    .root .main-column .sidebar-column > .container .sidebar-panels .sidebar-panel-what-to-do .carousel .card .container .img {
        background-color: #FFA5A5;
        height: 69px;
        width: 170px;
        border-radius: 15px;
        overflow: hidden;
    }

    .root .main-column .sidebar-column > .container .sidebar-panels .sidebar-panel-what-to-do .carousel .card .container .img img {
        width: 100%;
    }

    .root .main-column .sidebar-column > .container .sidebar-panels .sidebar-panel-what-to-do .carousel .card .container .text {
        padding-top: 10px;
        padding: 10px 0 0 3px;
    }

    .root .main-column .sidebar-column > .container .sidebar-panels .sidebar-panel-what-to-do .carousel .card .container .text .title {
        font-size: 16px;
        font-weight: 900;
        display: block;
        line-height: 16px;
        margin-bottom: 5px;
    }

    .root .main-column .sidebar-column > .container .sidebar-panels .sidebar-panel-what-to-do .carousel .card .container .text .subtitle {
        font-size: 14px;
        display: block;
        line-height: 16px;
        color: #808080;
    }

    .root .main-column .sidebar-column > .container .sidebar-panels .sidebar-panel-what-to-do .carousel .card .container .text .subtitle i {
        font-size: 12px;
        color: #808080;
    }

    .root .main-column .sidebar-column > .container .sidebar-panels .sidebar-panel-what-to-do .btns-nav-scroll .right-btn,
    .root .main-column .sidebar-column > .container .sidebar-panels .sidebar-panel-what-to-do .btns-nav-scroll .left-btn {
        margin-top: 40px;
    }

    .root .main-column .sidebar-column > .container .sidebar-panels .sidebar-panel-what-to-do .btns-nav-scroll .left-btn {
        margin-left: 35px;
    }

    .root .main-column .sidebar-column > .container .sidebar-panels .sidebar-panel-what-to-do-signed-in .btn-md,
    .root .main-column .sidebar-column > .container .sidebar-panels .sidebar-panel-what-to-do .btn-md {
        margin-top: 10px;
        font-size: 14px;
    }

    .giveaway-row {
        padding: 0 15px;
        height: 260px;
        margin-bottom: 15px;
    }

    .giveaway-row a {
        display: block;
        margin-bottom: 10px;
    }

    .giveaway-row a .img-col {
        width: 80px;
        height: 80px;
        border-bottom-left-radius: 10px;
        border-top-left-radius: 10px;
        overflow: hidden;
        float: left;
        background-color: #ffe7e0;
    }

    .giveaway-row a .img-col .img {
        width: 100%;
    }

    .giveaway-row a .info-col {
        background-color: white;
        padding: 12px 5px 10px 90px;
        border-top-right-radius: 10px;
        border-bottom-right-radius: 10px;
        height: 57px;
        border: 1px solid #E5E5E5;
        border-radius: 10px;
    }

    .giveaway-row a .info-col .name {
        font-weight: 900;
        font-size: 15px;
        display: block;
        line-height: 16px;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }

    .giveaway-row a .info-col .duration {
        font-size: 13px;
        color: gray;
    }

    .sidebar-panel .article-row {
        height: 440px;
        display: block;
        padding: 0 15px;
    }

    .sidebar-panel .article-row a {
        display: block;
        margin-bottom: 10px;
    }


    .sidebar-panel .article-row a .img-col {
        width: 80px;
        height: 99px;
        border-bottom-left-radius: 10px;
        border-top-left-radius: 10px;
        overflow: hidden;
        float: left;
        background-color: #ffe7e0;
    }

    .sidebar-panel .article-row a .img-col .img {
        height: 100%;
        margin-left: -18px;
    }

    .sidebar-panel .article-row a .info-col {
        background-color: white;
        padding: 12px 5px 10px 90px;
        border-top-right-radius: 10px;
        border-bottom-right-radius: 10px;
        height: 75px;
        border: 1px solid #E5E5E5;
        border-radius: 10px;
    }

    .sidebar-panel .article-row a .info-col .title {
        font-weight: 900;
        font-size: 15px;
        display: block;
        line-height: 16px;
        display: -webkit-box;
        -webkit-line-clamp: 3;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }

    .sidebar-panel .article-row a .info-col .comments {
        background-color: #FF5072;
        display: inline-block;
        padding: 1px 7px 2px 7px;
        border-radius: 8px;
        margin-top: 5px;
    }

    .sidebar-panel .article-row a .info-col .comments i {
        font-size: 10px;
        color: white;
        float: left;
        margin-top: 4px;
        margin-right: 3px;
    }

    .sidebar-panel .article-row a .info-col .comments span {
        color: white;
        font-size: 11px;
        float: left;
        margin-top: 3px;
        margin-bottom: 1px;
    }

    .milestone-row {
        padding: 0 15px;
        margin-bottom: 15px;
    }

    .milestone-row a {

    }

    .milestone-row a .img-col {
        width: 250px;
        height: 100px;
        overflow: hidden;
        background-color: #ffe7e0;
        border-radius: 15px;
    }

    .milestone-row a .img-col .img {
        width: 100%;
    }

    .milestone-row a .info-col {
        padding: 12px 0px 0px 0px;
        border-radius: 10px;
    }

    .milestone-row a .info-col .title {
        font-weight: 900;
        font-size: 18px;
        display: block;
        line-height: 20px;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }

    .milestone-row a .info-col .subtitle {
        font-size: 14px;
        color: gray;
    }

    .interest-row {
        height: 45px;
        margin-bottom: 10px;
        padding: 0 15px;
    }

    .interest-row a {

    }

    .interest-row a .img-col {
        height: 45px;
        width: 45px;
        border-radius: 50%;
        overflow: hidden;
        float: left;
        border: 1px solid lightgray;
    }

    .interest-row a .img-col .img {
        width: 100%;
    }

    .interest-row a .info-col {
        padding: 8px 0 0 60px;
    }

    .interest-row a .info-col-product {
        padding: 0 0 0 60px;
    }

    .interest-row a .info-col .name {
        font-weight: 900;
        display: block;
        font-size: 16px;
        line-height: 16px;
        display: -webkit-box;
        -webkit-line-clamp: 1;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }

    .interest-row a .info-col .brand,
    .interest-row a .info-col-product .brand {
        font-family: "Space Mono";
        text-transform: uppercase;
        color: #656565;
    }

    .interest-row a .info-col-product .brand {
        font-size: 15px;
    }

    .interest-row a .info-col-product .name {
        display: block;
        font-size: 14px;
        line-height: 14px;
        display: -webkit-box;
        -webkit-line-clamp: 1;
        -webkit-box-orient: vertical;
        overflow: hidden;
        color: #808080;
    }

    .interest-row a .info-col .type {
        font-size: 14px;
        color: gray;
        display: -webkit-box;
        -webkit-line-clamp: 1;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }

    .root .main-column .sidebar-column .alert-panel {
        border-radius: 10px;
        background: linear-gradient(111deg, #ff5072 0%, #ff9fb5 100%);
        padding: 15px;
        margin-bottom: 15px;
    }

    .root .main-column .sidebar-column .green-panel {
        border-radius: 10px;
        background: linear-gradient(111deg, #4caf50 0%, #81d784 100%);
        padding: 15px;
        margin-bottom: 15px;
    }

    .root .main-column .sidebar-column .alert-panel .title,
    .root .main-column .sidebar-column .green-panel .title {
        color: white;
        display: block;
        font-size: 21px;
        font-weight: 900;
        margin-bottom: 8px;
        letter-spacing: -0.5px;
    }

    .root .main-column .sidebar-column .alert-panel .title i,
    .root .main-column .sidebar-column .green-panel .title i {
        color: white;
        font-size: 22px;
    }

    .root .main-column .sidebar-column .alert-panel .subtitle,
    .root .main-column .sidebar-column .green-panel .subtitle {
        color: white;
        display: block;
        margin-bottom: 15px;
        font-weight: 500;
        font-size: 15px;
    }

    .root .main-column .sidebar-column .mod-panel {
        border-radius: 10px;
        background-color: #F9EFEC;
        padding: 15px;
        margin-bottom: 15px;
        display: block;
    }

    .root .main-column .sidebar-column .mod-panel .text {
        color: #B49A92;
        font-size: 17px;
        font-weight: 900;
    }

    .root .main-column .sidebar-column .mod-panel .notif-count {
        float: right;
        height: 26px;
        background-color: #FF5072;
        text-align: center;
        float: right;
        margin-left: 5px;
        margin-top: -3px;
        padding: 0 8px;
        border-radius: 8px;
    }

    .root .main-column .sidebar-column .mod-panel .notif-count span {
        color: white;
        font-size: 13px;
        font-weight: 900;
        display: block;
        margin-top: 6px;
    }

    .root .main-column .sidebar-column .cart {
        padding-bottom: 10px;
        padding-top: 0;
        position: fixed;
        background-color: white;
        z-index: 20;
        top: 75px;
        width: 320px;
    }

    .root .main-column .sidebar-column .cart .container {
        border-radius: 10px;
        background: linear-gradient(111deg, #438842 0%, #1db51d 100%);
        padding: 0 15px 0 13px;
        display: flex;
        justify-content: space-between;
        align-items: center;
        height: 46px;
        cursor: pointer;
    }

    .root .main-column .sidebar-column .cart:hover .container {
        background: linear-gradient(111deg, #438842 0%, #439b43 100%);
    }

    .root .main-column .sidebar-column .cart .left {

    }

    .root .main-column .sidebar-column .cart .left i {
        color: white;
        font-size: 14px;
    }

    .root .main-column .sidebar-column .cart .left .text {
        color: white;
        font-size: 16px;
        font-weight: 500;
        margin-left: 0px;
    }

    .root .main-column .sidebar-column .cart .left .small {
        color: #aff0af;
        font-size: 13px;
    }

    .root .main-column .sidebar-column .cart .right {
        display: flex;
        flex-direction: row;
    }

    .root .main-column .sidebar-column .cart .right .cart-value {
        background-color: white;
        border-radius: 5px;
        padding: 3px 7px;
        display: flex;
    }

    .root .main-column .sidebar-column .cart .right .cart-value .currency {
        color: #3a5a3a;
        font-size: 10px;
        font-weight: 500;
        margin: 3px 2px 0 0;
    }

    .root .main-column .sidebar-column .cart .right .cart-value .amount {
        color: #3a5a3a;
        font-size: 16px;
        font-weight: 500;
    }

    .root .main-column .sidebar-column .cart .right .cart-value .cents {
        color: #3a5a3a;
        font-size: 10px;
        font-weight: 500;
        margin: 1px 0 0 1px;
    }

    .root .main-column .sidebar-column .cart .right .cart-value-updating {
        background-color: white;
        border-radius: 5px;
        padding: 3px 7px;
        display: flex;
        display: none;
    }

    .root .main-column .sidebar-column .cart .right .cart-value-updating .lds-ellipsis-green {
        display: inline-block;
        position: relative;
        width: 65px;
    }

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

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

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

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

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

    .root .main-column .sidebar-column .brand-panels {
        margin-bottom: 15px;
        border-radius: 10px;
        overflow: hidden;
    }

    .root .main-column .sidebar-column .brand-panels .home-brand-panel {
        border: none;
    }

    .root .main-column .sidebar-column > .container > .footer {
        padding: 0 0px 100px 5px;
    }

    .root .main-column .sidebar-column > .container > .footer .nav {

    }

    .root .main-column .sidebar-column > .container > .footer .nav a,
    .root .main-column .sidebar-column > .container > .footer .nav span {
        font-size: 13px;
        margin: 0 5px 4px 0;
        display: inline-block;
        color: #988b9e;
        cursor: pointer;
    }

    .root .main-column .sidebar-column > .container > .footer .nav a i {
        color: #988b9e;
    }

    .content-wrapper .wide-btn-blue:hover {
        background-color: #2d1974;
    }

    .content-wrapper-2-col .wide-btn-2-col .wide-btn-2:hover {
        background-color: #2d1974;
    }

    .full-screen-modal {
    }

    .full-screen-modal > .container {
        width: 600px;
        margin: auto;
        top: 10px;
    }

    .user-modal > .container {
        width: 600px;
        margin: auto;
        top: 10px;
    }

    .onboarding-bg {
        width: 360px;
        margin: auto;
        left: -130px;
        right: 0;
    }

    .about-us-modal .color-panel .container .title,
    .about-us-modal .color-panel .container .description {
        max-width: 420px;
    }

    .about-us-modal .color-panel .container .sub-row {
        display: table;
        margin-top: 40px;
        padding: 0 20px 0 40px;
    }

    .about-us-modal .color-panel .container .sub {
        float: left;
        width: 33%;
    }

    .about-us-modal .color-panel .container .sub-2 {
        float: left;
        width: 50%;
    }

    .about-us-modal .color-panel .container .sub {
        margin-bottom: 50px;
    }

    .about-us-modal .color-panel .container .sub .subtitle {
        font-size: 22px;
    }

    .about-us-modal .color-panel .container .sub .subdescription {
        font-size: 14px;
        padding: 0 10px;
        line-height: 18px;
    }

    .p-list-sm .p,
    .b-list .b,
    .b-list .s {
        display: block;
        padding: 10px;
        border-radius: 10px;
        cursor: pointer;
    }

    .p-list-sm .p:hover,
    .b-list .b:hover,
    .b-list .s:hover {
        background-color: #f2f2f2;
    }

    .p-list-sm .p:hover .product-version {
        background-color: white;
    }

    .p-list-sm .p img {
        width: 60px;
        height: 60px;
    }

    .new-content-modal > .container > .bg .actions {
        display: table;
        width: 320px;
        position: relative;
        margin: auto;
        margin-bottom: 10px;
        margin-top: -7px;
    }

    .new-content-modal > .container > .bg .actions .action:nth-child(3n+1) {
        clear: initial;
    }

    .new-content-modal > .container > .bg .actions .action {
        width: 80px;
        float: left;
        margin-bottom: 15px;
        cursor: pointer;
        margin: 0 2px 10px 2px;
        border-radius: 10px;
        padding: 10px;
    }

    .new-content-modal > .container > .bg .actions .action:hover {
        background-color: #f3f3f3;
    }

    .post-show > .container, .post-promote > .container, .post-promo > .container {
        width: 600px;
    }

    .home-brand-panel .brand-panel .text {
        font-size: 16px;
        height: 18px;
        overflow: hidden;
    }

    .home-brand-panel .brand-panel .text i {
        font-size: 15px;
    }

    .brand-panel .segments .segment-row, .brand-panel .clicks .click-row {
        height: 22px;
    }

    .brand-panel .footer {
        padding-top: 7px;
    }

    .brand-segments, .brand-clicks {
        padding: 0 15px 8px 15px;
        display: block;
    }

    .brand-panel .footer .left,
    .brand-panel .footer .right {
        font-size: 13px;
    }

    .post-show .user-comment-btn {
        width: 600px;
        cursor: pointer;
    }

    .comment-modal > .container {
        padding: 15px;
        width: 570px;
        margin: auto;
    }

    .bottom-menu-modal > .container > .bg > div > div > .button-box > .button-row {
        cursor: pointer;
        border-radius: 7px;
    }

    .bottom-menu-modal > .container > .bg > div > div > .button-box > .button-row:hover,
    .bottom-menu-modal > .container > .bg .button-box > a:hover,
    .bottom-menu-modal > .container > .bg .button-box > button:hover {
        background-color: #f2f2f2;
    }

    .bottom-menu-modal > .container > .bg > div > div > .button-box > .button-row > div,
    .bottom-menu-modal > .container > .bg .button-box > a > div,
    .bottom-menu-modal > .container > .bg .button-box > button > div {
        margin-left: 7px;
    }

    .bottom-menu-modal > .container > .bg .button-box > a,
    .bottom-menu-modal > .container > .bg .button-box > button {
        cursor: pointer;
        border-radius: 7px;
    }

    .bottom-menu-modal > .container > .bg .menu-container {
        max-height: 560px;
    }

    .post-comments-container {
        border-left: 1px solid #e5e5e5;
        border-right: 1px solid #e5e5e5;
        position: initial;
    }

    .sidebar-panels .sidebar-panel .featured-product-row {
        display: table;
        width: 100%;
        margin-bottom: 0px;
    }

    .sidebar-panels .sidebar-panel .featured-product-row .img-col {
        height: 60px;
        width: 60px;
        border-radius: 50%;
        overflow: hidden;
        float: left;
        border: 1px solid lightgray;
        margin-left: 15px;
    }

    .sidebar-panels .sidebar-panel .featured-product-row .img-col .profile {
        width: 100%;
    }

    .sidebar-panels .sidebar-panel .featured-product-row .info-col {
        padding: 0 10px 0 85px;
    }

    .sidebar-panels .sidebar-panel .featured-product-row .info-col .brand {
        font-weight: 900;
        font-family: "Space Mono", sans-serif;
        display: -webkit-box;
        -webkit-line-clamp: 1;
        -webkit-box-orient: vertical;
        overflow: hidden;
        margin-bottom: -2px;
        color: #656565;
    }

    .sidebar-panels .sidebar-panel .featured-product-row .info-col .name {
        color: #808080;
        display: -webkit-box;
        -webkit-line-clamp: 1;
        -webkit-box-orient: vertical;
        overflow: hidden;
        margin-bottom: -2px;
    }

    .sidebar-panels .sidebar-panel .featured-product-row .info-col .category {
        font-size: 13px;
        color: #b0b0b0;
    }

    .sidebar-card {
        background-color: #ffffff;
        border-radius: 10px;
        margin-bottom: 15px;
        border: 1px solid #e5e5e5;
        position: relative;
        overflow: hidden;
    }

    .sidebar-card .about-img {
        width: 100%;
        overflow: hidden;
        height: 152px;
        background-color: gainsboro;
    }

    .sidebar-card .about-img .image {
        width: 100%;
        background-color: #FCF2EF;
    }

    .sidebar-card .profile-img {
        width: 80px;
        height: 80px;
        border: 2px solid white;
        border-radius: 50%;
        position: absolute;
        top: 85px;
        background-color: white;
        z-index: 1;
        left: 5px;
        overflow: hidden;
    }

    .sidebar-card .profile-img .image {
        width: 100%;
        border-top-right-radius: 10px;
        border-top-left-radius: 10px;
        margin-bottom: 0;
        margin-bottom: -4px;
        background-color: #e3e3e3;
        overflow: hidden;
        position: relative;
        max-height: 220px;
    }

    .sidebar-card .bg {
        background-color: #f8f8f8;
        padding: 20px 15px 13px 15px;
        border-bottom-left-radius: 10px;
        border-bottom-right-radius: 10px;
        position: relative;
        height: 57px;
    }

    .sidebar-card .bg .brand-name {
        font-family: "Space Mono", monospace;
        font-size: 18px;
        color: #656565;
        display: block;
        text-transform: uppercase;
        display: -webkit-box;
        -webkit-line-clamp: 1;
        -webkit-box-orient: vertical;
        overflow: hidden;
        line-height: 19px;
    }

    .sidebar-card .bg .name {
        font-size: 18px;
        font-weight: 900;
        color: #656565;
        display: block;
        display: -webkit-box;
        -webkit-line-clamp: 1;
        -webkit-box-orient: vertical;
        overflow: hidden;
        line-height: 19px;
    }

    .sidebar-card .bg .description {
        font-size: 13px;
        color: #868686;
        text-overflow: ellipsis;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
        height: 33px;
        position: relative;
        margin-top: 3px;
        line-height: 16px;
    }

    .title-panel {
        padding-top: 25px;
    }

    .fixed-filter-menu {
        max-width: 350px;
    }

    .article-feed .feed {
        width: 100%;
        display: table;
    }

    .section-headline {
        width: 360px;
    }

    .fixed-section-menu {
        width: 360px;
    }

    .loader-pagination-padding {
        padding-bottom: 80px;
    }

    .items-container .items-box .item {
        padding-bottom: 30px;
    }

    .root .sidebar-column .biutienda-header {
        width: 360px;
        max-width: 280px;
        top: 85px;
    }

    .what-to-do {
        padding: 15px 0 25px 0;
    }

    .what-to-do .carousel {
        height: 260px;
    }

    .what-to-do .carousel-milestones {
        height: 260px;
    }

    .what-to-do .carousel .card .container .img {
        height: 110px;
        width: 280px;
    }

    .user-milestones {
        padding: 15px 0 25px 0;
    }

    .user-milestones .carousel {
        height: 200px;
    }

    .user-milestones .carousel-milestones {
        height: 278px;
    }

    .user-milestones .carousel .card .container .img {
        height: 110px;
        width: 280px;
    }

    .root .main-column .primary-column .user-milestones .btns-nav-scroll .left-btn,
    .root .main-column .primary-column .user-milestones .btns-nav-scroll .right-btn {
        margin-top: 40px;
    }

    .promo-exclusive .profile, .promo .profile {
        height: 110px;
        width: 110px;
        top: 80px;
    }

    .select-community-to-post .container .relative .bg .header .select-community-to-post-title {
        margin-left: 20px;
    }

    .image-wide {
        height: 173px;
    }

    .root .main-column .biutienda-header {
        top: 105px;
        width: 290px;
    }

    .post:nth-child(2n+1) .body .article {
        padding-right: 7px;
    }

    .post:nth-child(2n+2) .body .article {
        padding-left: 7px;
    }

    .show-article-comments, .user-comment-btn {
        width: 600px;
    }

    .about-us-modal .color-panel .container .image {
        width: 400px;
        height: 250px;
    }

    .promote-footer {
        width: 540px;
    }

    .biutienda-header-bg { height: 250px; }
    .biutienda-header { top: 180px; width: 460px; }

    .biutienda-header .biutienda-subtitle { font-size: 16px; }

    .biustore-brand-cards { height: 283px; }
    .biustore-brand-cards .card { height: 280px; }
    .biustore-brand-cards .card-more { height: 250px;}

    .container-input {
        padding: 20px;
    }

    .filter-menu-2-container,
    .filter-menu-2 {
        height: 171px;
    }

    .filter-menu-2 .bottom-row {
        white-space: initial;
        padding: 10px 15px 5px 15px;
    }

    .filter-menu-2 .bottom-row .btn-space {
        display: none;
    }

    .filter-menu-2 .bottom-row .btn {
        margin-bottom: 7px;
    }

    .fixed-filter-menu-2, .fixed-filter-menu-index { width: 360px; }

    .hero {
        min-height: 370px;
        padding-top: 0;
    }

    .hero .carousel .card {
        height: 210px;
    }

    #menu-cards-index .btns-nav-scroll,
    #about-cards .btns-nav-scroll {
        margin-top: 60px;
    }

    .hero .menu-cards-container {
        top: 190px;
    }

    .hero .menu-cards {
        background: linear-gradient(1deg, #f0eef2 80%, #f0eef2eb 85%, #f0eef275 90%, #f0eef20d 95%, transparent);
    }

    .custom-collections-cards .collection {
        
    }

    .custom-collections-cards .collection:nth-child(2n+1) .card {
        
    }

    .custom-collections-cards .collection:nth-child(2n+2) .card {
        
    }

    .custom-collections-cards .collection .card {
        min-height: 140px;
    }

    .custom-collections-cards .collection .card .title {
        font-size: 20px;
        line-height: 21px;
    }

    .custom-collections-cards .collection .card .subtitle {
        font-size: 14px;
    }

    .edit-form > form > .container {
        max-height: 600px;
    }

    .items-container .items-col-lg .item .add-to-cart .left {
        font-size: 15px;
    }

    .items-container .items-col-lg .item .add-to-cart .left .desktop {
        display: inline-block;
        color: white;
        font-size: 14px;
        font-weight: 500;
    }

    .items-container .items-col-carousel .item .add-to-cart .left .desktop {
        display: none;
    }

    .items-container .items-col-lg .item .image,
    .items-container .items-col-lg .item .image img {
        height: 156px;
        width: 156px;
        margin-bottom: 5px;
    }

    .items-container .items-col-lg .item .image-vertical,
    .items-container .items-col-lg .item .image-vertical img {
        height: 202px;
        width: 156px;
        margin-bottom: 5px;
    }

    .custom-collection-panel .header {
        min-height: 45px;
    }

    .content-snippet-product-title .product .right .description {
        -webkit-line-clamp: 8;
    }

    .content-snippet-product-title .product .left, 
    .content-snippet-product-community .product .left {
        width: 33%;
    }

    .content-snippet-product-community .review-specs-ratings .specs .col .circle {
        width: 40px;
        height: 40px;
    }

    .live-raffle-panel {
        padding: 80px 80px 80px 80px;
    }

}

/* 680px */

@media (min-width: 725px) {

    .scroll-up-btn {
        left: -157px;
    }

    .interactions > .container > .row > .container > .vote span {
        padding: 6px 1px 0 1px;
    }

    .root > .container {
        max-width: 713px;
    }

    .root .ribbon-sign-in > .container {
        max-width: 713px;
    }

    .root .ribbon-sign-in .main-column-ribbon {
        padding-left: 40px;
    }

    .root .main-column .primary-column,
    .fixed-home-section-menu,
    .feed .interactions-wrapper,
    .feed .interactions,
    .post-show-div .user-comment-btn,
    .post-show-div .post-comments-container {
        max-width: 360px;
    }

    .root .main-column-ribbon .primary-column-ribbon {
        width: 360px;
    }

    .root .main-column .sidebar-column {
        width: 260px;
    }

    .root .main-column .sidebar-column > .container {
        width: 230px;
    }

    .root .main-column .sidebar-column > .container .search {
        width: 230px;
    }

    .notifications-sidebar-panel .top {
        width: 220px;
    }

    .post-sign-up .signed-out-title {
        font-size: 38px;
        line-height: 38px;
    }

    .root .main-column .biutienda-header {
        top: 112px;
    }

    .hero {
        min-height: 390px;
    }

    .hero .carousel .card {
        height: 233px;
    }

    .hero .menu-cards-container {
        top: 210px;
    }

    .items-container .items-col-lg .item .image,
    .items-container .items-col-lg .item .image img {
        height: 156px;
        width: 156px;
        margin-bottom: 5px;
    }

    .items-container .items-col-lg .item .image-vertical,
    .items-container .items-col-lg .item .image-vertical img {
        height: 202px;
        width: 156px;
        margin-bottom: 5px;
    }

}

@media (min-width: 768px) {

    .scroll-up-btn {
        left: -160px;
    }

    .interactions > .container > .row > .container > .vote span {
        padding: 6px 3px 0 3px;
    }

    .root > .container {
        max-width: 753px;
    }

    .root .ribbon-sign-in > .container {
        max-width: 753px;
    }

    .root .ribbon-sign-in .main-column-ribbon {
        padding-left: 50px;
    }

    .root .main-column .primary-column,
    .fixed-home-section-menu,
    .feed .interactions-wrapper,
    .feed .interactions,
    .post-show-div .user-comment-btn,
    .post-show-div .post-comments-container {
        max-width: 400px;
    }

    .root .main-column-ribbon .primary-column-ribbon {
        width: 370px;
    }

    .fixed-filter-menu-2, .fixed-filter-menu-index { width: 400px; }

    .fixed-filter-menu {
        max-width: 390px;
    }

    .section-headline {
        width: 400px;
    }

    .fixed-section-menu {
        width: 400px;
    }

    .root .main-column .primary-column .biutienda-header-bg .bg-cropped .bg-img {
        height: 160px;
    }

    .hero {
        min-height: 390px;
    }

    .hero .carousel .card {
        height: 233px;
    }

    .hero .menu-cards-container {
        top: 210px;
    }

    .items-container .items-col-lg .item .image,
    .items-container .items-col-lg .item .image img {
        height: 186px;
        width: 186px;
        margin-bottom: 5px;
    }

    .items-container .items-col-lg .item .image-vertical,
    .items-container .items-col-lg .item .image-vertical img {
        height: 241px;
        width: 186px;
        margin-bottom: 5px;
    }

}

@media (min-width: 780px) {

    .root > .container {
        max-width: 773px;
    }

    .root .ribbon-sign-in > .container {
        max-width: 773px;
    }

    .root .main-column .primary-column,
    .fixed-home-section-menu,
    .feed .interactions-wrapper,
    .feed .interactions,
    .post-show-div .user-comment-btn,
    .post-show-div .post-comments-container {
        max-width: 420px;
    }

    .root .main-column-ribbon .primary-column-ribbon {
        width: 380px;
    }

    .fixed-filter-menu-2, .fixed-filter-menu-index { width: 420px; }

    .root .main-column .sidebar-column {
        width: 260px;
    }

    .root .main-column .sidebar-column > .container {
        width: 230px;
    }

    .root .main-column .sidebar-column > .container .search {
        width: 230px;
    }

    .onboarding-bg {
        width: 423px;
        margin: auto;
        left: -170px;
        right: 0;
    }

    .fixed-filter-menu {
        max-width: 410px;
    }

    .section-headline {
        width: 420px;
    }

    .fixed-section-menu {
        width: 420px;
    }

    .what-to-do .carousel {
        height: 280px;
    }

    .what-to-do .carousel-milestones {
        height: 280px;
    }

    .what-to-do .carousel .card .container .img {
        height: 130px;
        width: 320px;
    }

    .user-milestones .carousel {
        height: 220px;
    }

    .user-milestones .carousel-milestones {
        height: 258px;
    }

    .user-milestones .carousel .card .container .img {
        height: 130px;
        width: 320px;
    }

    .root .main-column .biutienda-header {
        top: 120px;
        width: 370px;
    }

    .hero {
        min-height: 400px;
    }

    .hero .carousel .card {
        height: 245px;
    }

    .hero .menu-cards-container {
        top: 220px;
    }

}

@media (min-width: 832px) /*ipad pro*/ {

    .scroll-up-btn {
        left: -210px;
    }

    .root > .container {
        max-width: 823px;
    }

    .root .ribbon-sign-in > .container {
        max-width: 823px;
    }

    .root .ribbon-sign-in .main-column-ribbon {
        padding-left: 100px;
    }

    .root .main-column-ribbon .primary-column-ribbon {
        width: 410px;
    }

    .root .ribbon-sign-in .main-column-ribbon .primary-column-ribbon {
        padding-top: 15px;
    }

    .root .ribbon-sign-in .main-column-ribbon .primary-column-ribbon .top {
        font-size: 24px;
    }

    .root .main-column .primary-column,
    .fixed-home-section-menu,
    .feed .interactions-wrapper,
    .feed .interactions,
    .post-show-div .user-comment-btn,
    .post-show-div .post-comments-container {
        max-width: 470px;
    }

    .filter-menu-2-container,
    .filter-menu-2 {
        height: 181px;
    }

    .filter-menu-3-container,
    .filter-menu-3 {
        height: 135px;
    }

    .fixed-filter-menu-2, .fixed-filter-menu-index { width: 470px; }

    .onboarding-bg {
        width: 475px;
        margin: auto;
        left: -170px;
        right: 0;
    }

    .fixed-filter-menu {
        max-width: 460px;
    }

    .post .body .article {
        width: 208px;
        float: left;
    }

    .article-feed .post:nth-child(2n+1) .body .article {
        padding-right: 7px;
        clear: left;
    }

    .article-feed .post:nth-child(2n+2) .body .article {
        padding-right: 7px;
    }

    .section-headline {
        width: 470px;
    }

    .fixed-section-menu {
        width: 470px;
    }

    .items-container .items-col-lg .item .image,
    .items-container .items-col-lg .item .image img {
        height: 210px;
        width: 210px;
        margin-bottom: 5px;
    }

    .items-container .items-col-lg .item .image-vertical,
    .items-container .items-col-lg .item .image-vertical img {
        height: 272px;
        width: 210px;
        margin-bottom: 5px;
    }

    .items-container .items-col-lg .item .brand {
        font-size: 16px;
    }

    .items-container .items-col-lg .item .name {
        font-size: 18px;
        line-height: 20px;
    }

    .items-container .items-col-lg .item .category {
        font-size: 13px;
    }

    .items-container .items-col-lg .item .price-1 {
        font-size: 16px;
    }

    .items-container .items-col-lg .item .price-1 > span {
        font-size: 14px;
    }

    .feed .post .body .article a img, .article .image > img {
        height: auto;
    }

    .root .main-column .primary-column .biutienda-header-bg .bg-cropped .bg-img {
        height: 188px;
    }

    .root .sidebar-column .biutienda-header {
        top: 85px;
    }

    .root .main-column .primary-column .biutienda-header-bg {
        margin-bottom: 10px;
        height: 180px;
    }

    .biutienda-banners-carousel .banner {
        width: 420px;
        height: 160px;
    }

    .biutienda-banners-carousel .container {
        height: 160px;
    }

    .biutienda-gradient-bg .btns-nav-scroll .left-btn, .biutienda-gradient-bg .btns-nav-scroll .right-btn {
        top: 240px;
    }

    .root .main-column .biutienda-header {
        top: 145px;
    }

    .hero {
        min-height: 430px;
    }

    .hero .carousel .card {
        height: 275px;
    }

    .hero .menu-cards-container {
        top: 245px;
    }

}

@media (min-width: 960px) {

    .interactions > .container > .row { padding: 0 10px; }

    .scroll-up-btn {
        left: -210px;
    }

    .root > .container {
        max-width: 943px;
    }

    .root .ribbon-sign-in > .container {
        max-width: 943px;
    }

    .root .menu-top .biulogo .container .biutest-sm {
        display: block;
    }

    .root .ribbon-sign-in .main-column-ribbon {
        padding-left: 90px;
    }

    .root .main-column .primary-column,
    .fixed-home-section-menu,
    .feed .interactions-wrapper,
    .feed .interactions,
    .post-show-div .user-comment-btn,
    .post-show-div .post-comments-container {
        max-width: 540px;
    }

    .root .main-column-ribbon .primary-column-ribbon {
        width: 540px;
    }

    .fixed-filter-menu-2, .fixed-filter-menu-index { width: 540px; }

    .root .ribbon-sign-in .main-column-ribbon .primary-column-ribbon {
        padding-top: 15px;
    }

    .root .main-column .sidebar-column {
        width: 310px;
    }

    .root .main-column .sidebar-column > .container {
        width: 320px;
    }

    .root .main-column .sidebar-column > .container .search {
        width: 320px;
    }


    .root .main-column .sidebar-column > .container .sidebar-panels .sidebar-panel-what-to-do-signed-in .carousel {
        height: 230px;
    }

    .root .main-column .sidebar-column > .container .sidebar-panels .sidebar-panel-what-to-do .carousel .card {
        width: 225px;
        height: 210px;
    }

    .root .main-column .sidebar-column > .container .sidebar-panels .sidebar-panel-what-to-do .carousel .card .container .img {
        height: 85px;
        width: 210px;
    }

    .items-container .items-col-lg .item .image img, 
    .items-container .items-col-lg .item .image {
        height: 245px;
        width: 245px;
        margin-bottom: 5px;
    }

    .items-container .items-col-lg .item .image-vertical img, 
    .items-container .items-col-lg .item .image-vertical {
        height: 317px;
        width: 245px;
        margin-bottom: 5px;
    }

    #search-products-text {
        display: -webkit-box;
    }

    #search-in-biutest-text {
        display: none;
    }

    .post-sign-up .bg {
        background: linear-gradient(0deg, #d8b7e8 0%, #e8c6f8 100%);
        padding: 120px 100px 250px 100px;
    }

    .root .main-column .primary-column .text .promo-image {
        height: 280px;
    }

    .root .main-column .primary-column .promo-exclusive .image {
        height: 280px;
    }

    .notifications-sidebar-panel .top {
        width: 310px;
        padding: 0px 0px 0 7px;
    }

    .notifications-sidebar-panel .top .left {
        margin-right: 5px;
    }

    .notifications-sidebar-panel .top .right .container {
        padding: 12px 8px 12px 8px;
    }

    .notifications-sidebar-panel .top .right .container .text .activity-full {
        display: initial;
    }

    .notifications-sidebar-panel .top .right .container .text .activity-sm {
        display: none;
    }

    .onboarding-bg {
        width: 540px;
        margin: auto;
        left: -220px;
        right: 0;
    }

    .brand-panel .footer .left,
    .brand-panel .footer .right {
        font-size: 14px;
    }

    .sidebar-card .about-img {
        height: 185px;
    }

    .sidebar-card .profile-img {
        top: 115px;
    }

    .fixed-filter-menu {
        max-width: 530px;
    }

    .post .body .article {
        width: 243px;
        float: left;
    }

    .post .user-header .user .user-profile-container .badge { 
        left: 38px;
        top: 38px; 
    }

    .section-headline {
        width: 540px;
    }

    .fixed-section-menu {
        width: 540px;
    }

    .root .main-column .sidebar-column > .container .sidebar-panels .sidebar-panel-biutienda .biutienda-header {
        width: 240px;
    }

    .root .main-column .primary-column .biutienda-header-bg .bg-cropped .bg-img {
        height: 215px;
    }

    .root .sidebar-column .biutienda-header {
        top: 85px;
    }

    .biutienda-header .biutienda-subtitle {
        font-size: 15px;
    }

    .root .main-column .primary-column .biutienda-header-bg {
        margin-bottom: 10px;
        height: 210px;
    }

    .biutienda-gradient-bg .btns-nav-scroll .left-btn, .biutienda-gradient-bg .btns-nav-scroll .right-btn {
        top: 258px;
    }

    .biutienda-banners-carousel .container {
        height: 180px;
    }

    .biutienda-banners-carousel .banner {
        width: 475px;
        height: 180px;
    }

    .biutienda-gradient-bg .btns-nav-scroll .left-btn, .biutienda-gradient-bg .btns-nav-scroll .right-btn {
        top: 280px;
    }

    .root .primary-column .biutienda-header {
        top: 170px;
    }

    .promo-exclusive .profile, .promo .profile {
        top: 180px;
    }

    .hero {
        min-height: 460px;
    }

    .hero .carousel .card {
        height: 315px;
    }

    .hero .menu-cards-container {
        top: 280px;
    }

    .flickity-prev-next-button {
        top: 45%;
    }

    .feed-campaign,
    .article-feed .feed {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: flex-start;
    }

    .feed .post .body .campaign, .feed .campaign {
        padding: 25px 15px 15px 15px;
        width: 44%;
    }

}


@media (min-width: 1100px) {

    .left-banner .banner {
        width: 275px;
    }

}

@media (min-width: 1140px) {

    .scroll-up-btn {
        left: -17px;
    }

    .root > .container {
        max-width: 1128px;
    }

    .root .ribbon-sign-in > .container {
        max-width: 1128px;
    }

    .root .main-column {
        padding-left: 275px;
    }

    .root .ribbon-sign-in .main-column-ribbon {
        padding-left: 275px;
    }

    .root .menu-column > .menu {
        width: 275px;
    }

    .root .menu-top .biulogo {
        padding: 0;
        padding-top: 3px;
    }

    .root .menu-top .biulogo > .container .biutest-sq {
        display: none;
    }

    .root .menu-top .biulogo > .container {
        padding: 10px 15px 10px 0;
    }

    .root .menu-top .biulogo > .container .biutest-lg {
        display: inline-block;
    }

    .root .menu-top .menu-nav > .container {
        padding-left: 10px;
    }

    .root .menu-top .menu-nav > .container .nav-a {
        display: inline-block;
        width: initial;
    }

    .root .menu-top .menu-nav > .container .nav-a > .container {
        max-width: 100%;
        padding: 12px 12px 11px 12px;
        height: 36px;
        border-radius: 20px;
    }

    .root .menu-top .menu-nav > .container .nav-a > .container .nav-icon {
        float: left;
        height: 35px;
        width: 35px;
        text-align: center;
        margin-right: 10px;
    }

    .root .menu-top .menu-nav > .container .nav-a > .container .nav-text-col {
        margin-right: 15px;
        margin-left: 15px;
        line-height: 24px;
        font-size: 20px;
        font-weight: 700;
        overflow-wrap: break-word;
        min-width: 0px;
        max-width: 100%;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        margin-top: 5px;
    }

    .root .menu-top .menu-nav > .container .nav-a > .container .nav-text-col .nav-text {
        font-family: inherit;
        overflow-wrap: break-word;
        min-width: 0px;
        font-size: 20px;
        font-weight: 900;
        color: #988b9e;
        font: inherit;
        white-space: inherit;
    }

    .root .menu-top .menu-action {
        margin-top: 15px;
        margin-left: 10px;
    }

    .root .menu-top .menu-action .action-btn-lg {
        display: block;
    }

    .root .menu-top .menu-action .action-btn-sq {
        display: none;
    }

    .root .menu-bottom {
        margin-left: 0px;
        width: initial;
        left: 15px;
        right: initial;
    }

    .root .menu-bottom > .user-profile > .container {
        display: flex;
        align-items: center;
        padding: 12px;
        border-radius: 20px;
    }

    .root .menu-bottom > .user-profile > .container .user-info {

    }

    .root .menu-bottom > .user-profile > .container .user-info > .container {
        max-width: 100%;
        margin-left: 12px;
        margin-right: 12px;
        text-align: left;
        margin-top: -1px;
    }

    .root .menu-bottom > .user-profile > .container .user-info > .container .user-info-top {

    }

    .root .menu-bottom > .user-profile > .container .user-info > .container .user-info-top .user-info-name {
        font-size: 16px;
        font-weight: 900;
    }

    .root .menu-bottom > .user-profile > .container .user-info > .container .user-info-bottom {

    }

    .root .menu-bottom > .user-profile > .container .user-info > .container .user-info-bottom .user-info-text {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        font-size: 12px;
        display: block;
    }

    .root .menu-bottom > .user-profile > .container .user-info > .container .user-info-bottom .user-sensitive-text {
        display: block;
        font-size: 12px;
        margin-top: -3px;
    }

    .onboarding-bg {
        width: 540px;
        margin: auto;
        left: -37px;
        right: 0;
    }

    .root .menu-bottom > .user-profile > .container .user-info > .container .user-info-top .brand-name i {
        display: initial;
    }
}

@media (min-width: 1190px) {
    .root .main-column .sidebar-column > .container {
        padding: 0 0 0 15px;
    }

}

@media (min-width: 1280px) {

    .root > .container {
        max-width: 1138px;
    }

}
/* navbar */

navbar {
    position: relative;    
    height: 50px;
    width: 100%;
    z-index: 13;  
}

navbar > .navbar {
    position: relative;
    background-color: #f8f8f8;
    z-index: 29;
    text-align: center;
    width: 100%;
    height: 50px;
}

navbar > .navbar > .container {
    position: absolute;
    width: 100%;
    height: 50px;
}

navbar > .navbar > .container > .biu-logo > a > img {
    width: 115px;
    margin-top: 11px;
}

navbar > .navbar > .container div {
    border: none;
    background-color: transparent;
}

navbar > .navbar > .container > .menu {
    left: 5px;
    position: absolute;
    height: 50px;
    width: 50px;
}

navbar > .navbar > .container > .menu i {
    font-size: 24px;
    color: #ff9f9f;
    padding-top: 13px;
}

navbar > .navbar > .container > .search {
    left: 55px;
    position: absolute;
    height: 50px;
    width: 50px;
    display: block;
    height: 100%;    
}


navbar > .navbar > .container > .search > button {
    width: 100%;
    height: 100%;
}

navbar > .navbar > .container > .search > button > i {
    font-size: 18px;
    color: #ff9f9f;
}

navbar > .navbar > .container > .search > i {
    font-size: 18px;
    color: #ff9f9f;
    padding-top: 16px;
}

navbar > .navbar > .container > .cart {
    right: 55px;
    position: absolute;
    height: 50px;
    width: 50px;
    display: block;
    height: 100%;
    top: 0;
}

navbar > .navbar > .container > .cart > button {
    width: 100%;
    height: 100%;
}

navbar > .navbar > .container > .cart > button i {
    font-size: 18px;
    color: #ff9f9f;
}

navbar > .navbar > .container > .cart i {
    font-size: 21px;
    color: #ff9f9f;
    padding-top: 15px;
}

navbar > .navbar > .container > .cart .notification-bubble {
    background-color: #FF5072;
    border-radius: 50%;
    height: 18px;
    width: 18px;
    text-align: center;
    margin-left: 30px;
    position: relative;
    margin-top: -30px;
    border: 2px solid white;
}

navbar > .navbar > .container > .cart .hidden {
    display: none;
}

navbar > .navbar > .container > .cart .notification-bubble span {
    font-size: 14px;
    color: white;
    font-weight: 900;
    margin-top: 2px;
    position: absolute;
    top: -1px;
    right: 0;
    letter-spacing: -1px;
    left: -2px;
}

navbar > .navbar > .container > .user {
    right: 3px;
    position: absolute;
    height: 50px;
    width: 50px;
    top: 0;
}

navbar > .navbar > .container > .user img {
    width: 35px;
    height: 35px;
    margin-top: 8px;
    border-radius: 50%;
    border: 1px solid white;
    background-color: #e6eaeb;
    object-fit: cover;
}

navbar > .navbar > .container > .user > .user-sign-in {
    border: 2px solid #ff9f9f;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    margin: auto;
    margin-top: 9px;
}

navbar > .navbar > .container > .user > .user-sign-in > i {
    color: #ff9f9f;
    font-size: 18px;
    margin: auto;
    margin-top: 6px;
}

navbar > .navbar > .container > .user .notification-bubble {
    background-color: #FF5072;
    border-radius: 50%;
    height: 18px;
    width: 18px;
    text-align: center;
    margin-left: 28px;
    position: relative;
    margin-top: -41px;
    border: 2px solid white;
}

navbar > .navbar > .container > .user .notification-bubble span {
    font-size: 14px;
    color: white;
    font-weight: 900;
    margin-top: 2px;
    position: absolute;
    top: -1px;
    right: 0;
    letter-spacing: -1px;
    left: -2px;
}


.unhide {
    display: block !important;
}


/* Search Modal */

#full-screen-modal .container .relative .bg .lds-ellipsis-container {
    text-align: center;
}

#full-screen-modal .container-top-search {
    width: 100%;
    background-color: white;
    z-index: 1;
    overflow-y: scroll;
}

#full-screen-modal .recommended-to-user {
    position: relative;
}

.container-top-search > .container {
    padding: 15px 15px 0 15px;
}

#full-screen-modal .container-recommended-results {
    margin-top: 0;
}

#full-screen-modal .container-search-results {
    display: none;
    margin-top: 5px;
}

#full-screen-modal .container-body {
    padding: 0 15px;
}

#full-screen-modal .container-body-bottom {
    padding: 0 15px 15px 15px;
}

#full-screen-input {
    position: relative;
    margin-bottom: 15px;
}

.select-community-to-post .container .relative .bg .container .wrapper, #full-screen-modal .container .relative .bg .container .wrapper {
    position: relative;
    border: 1px solid #bebebe;
    border-radius: 5px;
    padding-right: 10px;
    margin: 0 15px;
}

.select-community-to-post .container .relative .bg .container .wrapper {
    margin-top: 2px;
}

#full-screen-modal .container .relative .bg .container .wrapper {
    margin: 0;
}

.select-community-to-post .container .relative .bg .container .wrapper .title, #full-screen-modal .container .relative .bg .container .wrapper .title {
    display: block;
    position: absolute;
    top: 4px;
    left: 10px;
}

.select-community-to-post .container .relative .bg .container .wrapper .title .field, #full-screen-modal .container .relative .bg .container .wrapper .title .field {
    font-weight: 900;
    font-size: 14px;
    color: #a4a4a4;
}

.select-community-to-post .container .relative .bg .container .wrapper .title .field i, #full-screen-modal .container .relative .bg .container .wrapper .title .field i {
    font-size: 12px;
    color: #a4a4a4;
}

.select-community-to-post .container .relative .bg .container .wrapper .ais-SearchBox, #full-screen-modal .container .relative .bg .container .wrapper .ais-SearchBox {
    position: relative;
}

.select-community-to-post .ais-SearchBox-input, #full-screen-modal .ais-SearchBox-input {
    background-color: transparent;
    border: none;
    width: 100%;
    padding-left: 10px;
    padding-top: 26px;
    padding-bottom: 5px;
    border: 0;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
    height: 55px;
    font-size: 18px;
}

.select-community-to-post .ais-SearchBox-submit, #full-screen-modal .ais-SearchBox-submit {
    display: none;
}

.select-community-to-post .ais-SearchBox-reset, #full-screen-modal .ais-SearchBox-reset {
    position: absolute;
    right: -3px;
    top: 9px;
    padding: 10px;
    background-color: #ffffff;
}


/* search card carousel recommended */

.container-recommended-results {
    padding-bottom: 80px;
}

.carousel-card-md {
    display: flex;
    flex-wrap: nowrap;
    overflow: auto;
    padding: 0 15px;
    -webkit-overflow-scrolling: touch;
    overflow-y: hidden;
    height: 222px;
    margin-bottom: 30px;
}

.container-recommended-results .carousel-card-md {
    margin-bottom: 60px;
}

.carousel-card-md-no-follow {
    height: initial;
    margin-bottom: 0;
}

#search-results-brand .carousel-card-md {
    height: 186px;
}

.carousel-card-md .card {
    border-radius: 15px;
    overflow: hidden;
    width: 150px;
    height: 220px;
    flex: 0 0 auto;
    margin-right: 10px;
    position: relative;
    border: 1px solid #dfdfdf;
}

.carousel-card-no-follow {
    height: 182px;
}

.carousel-card-no-follow .card {
    height: 180px;
}

.carousel-card-md-no-follow .card {
    height: 186px;
}

#search-results-brand .carousel-card-md .card {
    height: 183px;
}

.carousel-card-md .card  .about-img {
    width: 100%;
    overflow: hidden;
    height: 80px;
    background-color: gainsboro;
}

.carousel-card-md .card  .about-img img {
    width: 100%;
    margin-top: -8px;
    background-color: #FCF2EF;
}

.carousel-card-md .card  .bg {
    background-color: #f8f8f8;
    padding: 20px 15px 13px 15px;
    border-bottom-left-radius: 15px;
    border-bottom-right-radius: 15px;
    position: relative;
    height: 107px;
}

.carousel-card-md-no-follow .card > .bg {
    height: 68px;
}

#search-results-brand .carousel-card-md .card  .bg {
    height: 71px;    
}

.carousel-card-md .card  .profile-img {
    width: 65px;
    height: 65px;
    border: 2px solid white;
    border-radius: 50%;
    position: absolute;
    top: 30px;
    background-color: white;
    z-index: 1;
    left: 5px;
    overflow: hidden;
}

.carousel-card-md .card  .profile-img > .image {
    width: 100%;
}

.carousel-card-md .card  .bg > .brand-name {
    font-family: "Space Mono", monospace;
    color: #656565;
    display: block;
    text-transform: uppercase;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    line-height: 19px;
}

.carousel-card-md .card  .bg > .name {
    color: #656565;
    font-weight: 900;
    display: block;
    margin: 3px 0 5px 0;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.carousel-card-md .card  .bg > .category-name {
    color: #656565;
    font-weight: 900;
    display: block;
    margin: 3px 0 5px 0;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    line-height: 16px;
}

.carousel-card-md .card  .bg > .description {
    font-size: 12px;
    color: #868686;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    height: 42px;
    position: relative;
    margin-top: 3px;
}

.carousel-card-md .card  .bg > .category-description {
    font-size: 12px;
    color: #868686;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    height: 42px;
    position: relative;
    margin-top: 3px;
}

.carousel-card-md .card .follow-box {
    margin-top: 8px;
    position: absolute;
    bottom: 0;
    width: 100%;
}

.carousel-card-md .card .follow-box .container {
    padding: 7px 15px 15px 15px;
    background-color: #f8f8f8;
}

.carousel-card-md-no-follow .card .follow-box .container {
    padding: 7px 15px 9px 15px;
}

.carousel-card-md .card .follow-btn {
    background: linear-gradient(111deg, #2d1974 0%, #cd8aed 100%);
    color: white;
    padding: 5px 12px;
    border-radius: 15px;
    font-size: 14px;
    display: block;
    text-align: center;
}

.carousel-card-md .card .follow-btn i {
    font-size: 12px;
    color: white;
}

.carousel-card-md .card .following-btn {
    background-color: white;
    color: #ff9f9f;
    border: 1px solid #ff9f9f;
    padding: 5px 12px;
    border-radius: 15px;
    font-size: 14px;
    display: block;
    text-align: center;
}

.carousel-card-md-no-follow .card-more {
    border-radius: 15px;
    overflow: hidden;
    width: 122px;
    height: 158px;
    flex: 0 0 auto;
    margin-right: 30px;
    position: relative;
    text-align: center;
    padding: 15px;
    background-color: #f4f4f4;
}

.carousel-card-md-no-follow .card-more span {
    color: #868686;
    margin-top: 43px;
    display: block;
}

.carousel-card-md-no-follow .card-more i {
    color: #868686;
    font-size: 22px;
    margin-top: 10px;
}


/* history card */

.carousel-card-history {
    display: flex;
    flex-wrap: nowrap;
    overflow: auto;
    padding: 0 15px;
    -webkit-overflow-scrolling: touch;
    overflow-y: hidden;
    height: 180px;
    margin-bottom: 20px;
}

.carousel-card-history .card {
    border-radius: 15px;
    overflow: hidden;
    width: 150px;
    height: 178px;
    flex: 0 0 auto;
    margin-right: 10px;
    position: relative;
    border: 1px solid #dfdfdf;
}

.carousel-card-history .card .about-img {
    width: 100%;
    overflow: hidden;
    height: 110px;
    background-color: gainsboro;
}

.carousel-card-history .card .about-img img {
    height: 100%;
    background-color: #FCF2EF;
}

.carousel-card-history .card .product-img {
    width: 100%;
    height: 99px;
    background-color: gainsboro;
}

.carousel-card-history .card .product-img img {
    width: 100%;
    margin-top: 0;
    background-color: #FCF2EF;
}

.carousel-card-history .card .profile-img {
    width: 65px;
    height: 65px;
    border: 2px solid white;
    border-radius: 50%;
    position: absolute;
    top: 55px;
    background-color: white;
    z-index: 1;
    left: 5px;
    overflow: hidden;
}

.carousel-card-history .card .profile-img img {
    width: 100%;
    border-top-right-radius: 15px;
    border-top-left-radius: 15px;
    margin-bottom: 0;
    margin-bottom: -4px;
    background-color: #e3e3e3;
    overflow: hidden;
    position: relative;
    max-height: 220px;
}

.carousel-card-history .card .bg {
    background-color: #f8f8f8;
    padding: 20px 15px 13px 15px;
    border-bottom-left-radius: 15px;
    border-bottom-right-radius: 15px;
    position: relative;
    height: 35px;
}

.carousel-card-history .product .bg {
    background-color: #f8f8f8a8;
    padding: 5px 10px 13px 10px;
    border-bottom-left-radius: 15px;
    border-bottom-right-radius: 15px;
    position: relative;
    height: 61px;
}

.carousel-card-history .card .brand-name {
    font-family: "Space Mono", monospace;
    color: #656565;
    display: block;
    text-transform: uppercase;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    line-height: 16px;
}

.carousel-card-history .product .brand {
    font-family: "Space Mono", monospace;
    color: #656565;
    display: block;
    text-transform: uppercase;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    line-height: 13px;
    font-size: 13px;
}

.carousel-card-history .card .name {
    color: #656565;
    font-weight: 900;
    display: block;
    margin: 3px 0 2px 0;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    line-height: 16px;
}

.carousel-card-history .product .name {
    font-weight: 400;
    font-size: 15px;
    margin-bottom: -3px;
}

.carousel-card-history .card .type {
    font-size: 12px;
    color: #aaaaaa;
    margin-top: 3px;
    font-weight: 500;
    display: block;
    margin: 3px 0 0px 0;
}

.ph-card-history-carousel {
    display: flex;
    flex-wrap: nowrap;
    overflow: auto;
    padding: 0 15px;
    -webkit-overflow-scrolling: touch;
    overflow-y: hidden;
    height: 180px;
    margin-bottom: 20px;
}

.ph-card-history-carousel .card {
    border-radius: 15px;
    overflow: hidden;
    width: 150px;
    height: 178px;
    flex: 0 0 auto;
    margin-right: 10px;
    position: relative;
    border: 1px solid #dfdfdf;
}

.ph-card-history-carousel .card .about-img {
    width: 100%;
    overflow: hidden;
    height: 110px;
    background-color: #F4F4F4;
}

.ph-card-history-carousel .card .profile-img {
    width: 65px;
    height: 65px;
    border: 2px solid #ededed;
    border-radius: 50%;
    position: absolute;
    top: 55px;
    background-color: white;
    z-index: 1;
    left: 5px;
    overflow: hidden;
}

.ph-card-history-carousel .card .bg {
    background-color: white;
    padding: 20px 15px 13px 15px;
    border-bottom-left-radius: 15px;
    border-bottom-right-radius: 15px;
    position: relative;
    height: 35px;
}

.ph-card-history-carousel .card .bg .ph-bg {
    animation-duration: 1s;
    animation-fill-mode: forwards;
    animation-iteration-count: infinite;
    animation-name: placeHolderShimmer;
    animation-timing-function: linear;
    background: #f6f7f8;
    background: linear-gradient(to right, #eeeeee 8%, #dddddd 18%, #eeeeee 33%);
    background-size: 800px 104px;
    height: 32px;
    position: relative;
}

.ph-bg div,
.ph-bg-2 div,
.ph-bg-3 div {
    background: #fff;
    position: absolute;
}

.ph-card-history-carousel .card .bg .ph-bg .ph-bar {
    top: 12px;
    left: 0;
    right: 0;
    height: 8px;
}

.ph-card-content-carousel {
    overflow: auto;
    white-space: nowrap;
    -webkit-overflow-scrolling: touch;
    overflow-y: hidden;
    padding: 0 5px 15px 15px;
}

.ph-card-reviews-carousel .card {
    display: inline-block;
    width: 198px;
    background-color: #ffffff;
    padding: 15px 15px 0 15px;
    border-radius: 15px;
    margin-right: 7px;
    min-height: 215px;
    vertical-align: top;
    border: 1px solid #dfdfdf;
    cursor: pointer;
}

.ph-card-questions-carousel .card {
    display: inline-block;
    width: 198px;
    background-color: #ffffff;
    padding: 15px 15px 0 15px;
    border-radius: 15px;
    margin-right: 7px;
    min-height: 255px;
    vertical-align: top;
    border: 1px solid #dfdfdf;
    cursor: pointer;
}

.ph-card-content-carousel .card .header {
    height: 42px;
    margin-bottom: 10px;
}

.ph-card-content-carousel .card .header .image {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    float: left;
    border: 1px solid #e1e1e1;
    background-color: white;
    overflow: hidden;
}

.ph-card-content-carousel .card .header .info-product {
    padding-left: 10px;
    float: left;
    width: 145px;
    overflow: hidden;
}

.ph-card-content-carousel .card .header .info-product .ph-bg {
    animation-duration: 1s;
    animation-fill-mode: forwards;
    animation-iteration-count: infinite;
    animation-name: placeHolderShimmer;
    animation-timing-function: linear;
    background: #f6f7f8;
    background: linear-gradient(to right, #eeeeee 8%, #dddddd 18%, #eeeeee 33%);
    background-size: 800px 104px;
    height: 42px;
    position: relative;
}

.ph-card-content-carousel .card .header .info-product .ph-bg .ph-bar-1 {
    top: 10px;
    left: 0;
    right: 0;
    height: 6px;
}

.ph-card-content-carousel .card .header .info-product .ph-bg .ph-bar-2 {
    top: 26px;
    left: 0;
    right: 0;
    height: 6px;
}

.ph-card-content-carousel .card .header .info-product .ph-bg .ph-bar-3 {
    top: 32px;
    left: 55px;
    right: 0;
    height: 10px;
}

.ph-card-content-carousel .card .ph-bg-2 {
    animation-duration: 1s;
    animation-fill-mode: forwards;
    animation-iteration-count: infinite;
    animation-name: placeHolderShimmer;
    animation-timing-function: linear;
    background: #f6f7f8;
    background: linear-gradient(to right, #eeeeee 8%, #dddddd 18%, #eeeeee 33%);
    background-size: 800px 104px;
    height: 55px;
    position: relative;
    margin-top: 40px;
}

.ph-card-content-carousel .card .ph-bg-2 .ph-bar-1 {
    top: 14px;
    left: 0;
    right: 0;
    height: 6px;
}

.ph-card-content-carousel .card .ph-bg-2 .ph-bar-2 {
    top: 34px;
    left: 0;
    right: 0;
    height: 6px;
}

.ph-card-content-carousel .card .ph-bg-2 .ph-bar-3 {
    top: 40px;
    left: 95px;
    right: 0;
    height: 15px;
}

.ph-card-content-carousel .card .ph-bg-3 {
    animation-duration: 1s;
    animation-fill-mode: forwards;
    animation-iteration-count: infinite;
    animation-name: placeHolderShimmer;
    animation-timing-function: linear;
    background: #f6f7f8;
    background: linear-gradient(to right, #eeeeee 8%, #dddddd 18%, #eeeeee 33%);
    background-size: 800px 104px;
    height: 42px;
    position: relative;
    margin-top: 15px;
}

.ph-card-content-carousel .card .ph-bg-3 .ph-bar-1 {
    top: 10px;
    left: 0;
    right: 0;
    height: 6px;
}

.ph-card-content-carousel .card .ph-bg-3 .ph-bar-2 {
    top: 26px;
    left: 0;
    right: 0;
    height: 6px;
}

.ph-card-content-carousel .card .ph-bg-3 .ph-bar-3 {
    top: 32px;
    left: 95px;
    right: 0;
    height: 10px;
}

.ph-card-brands-carousel {
    display: flex;
    flex-wrap: nowrap;
    overflow: auto;
    padding: 0 15px;
    -webkit-overflow-scrolling: touch;
    overflow-y: hidden;
    height: 250px;
}

.ph-card-brands-carousel .card {
    border-radius: 15px;
    overflow: hidden;
    width: 230px;
    height: 245px;
    flex: 0 0 auto;
    margin-right: 10px;
    position: relative;
    border: 1px solid #dfdfdf;
}

.ph-card-brands-carousel .card .about-img {
    width: 100%;
    overflow: hidden;
    height: 143px;
    background-color: #F4F4F4;
}

.ph-card-brands-carousel .card .profile-img {
    width: 80px;
    height: 80px;
    border: 2px solid #ededed;
    border-radius: 50%;
    position: absolute;
    top: 73px;
    background-color: white;
    z-index: 1;
    left: 5px;
    overflow: hidden;
}

.ph-card-brands-carousel .card .bg {
    background-color: white;
    padding: 20px 15px 13px 15px;
    border-bottom-left-radius: 15px;
    border-bottom-right-radius: 15px;
    position: relative;
    height: 71px;
}

.ph-card-brands-carousel .card .bg .ph-bg {
    animation-duration: 1s;
    animation-fill-mode: forwards;
    animation-iteration-count: infinite;
    animation-name: placeHolderShimmer;
    animation-timing-function: linear;
    background: #f6f7f8;
    background: linear-gradient(to right, #eeeeee 8%, #dddddd 18%, #eeeeee 33%);
    background-size: 800px 104px;
    height: 66px;
    position: relative;
}

.ph-card-brands-carousel .card .bg .ph-bg .ph-bar-1 {
    top: 0;
    left: 100px;
    right: 0;
    height: 17px;
}

.ph-card-brands-carousel .card .bg .ph-bg .ph-bar-2 {
    top: 17px;
    left: 0;
    right: 0;
    height: 7px;
}

.ph-card-brands-carousel .card .bg .ph-bg .ph-bar-3 {
    top: 34px;
    left: 0;
    right: 0;
    height: 6px;
}

.ph-card-brands-carousel .card .bg .ph-bg .ph-bar-4 {
    top: 50px;
    left: 0;
    right: 0;
    height: 6px;
}

.ph-card-brands-carousel .card .bg .ph-bg .ph-bar-5 {
    top: 56px;
    left: 100px;
    right: 0;
    height: 12px;
}

.ph-card-products-carousel {
    display: flex;
    flex-wrap: nowrap;
    overflow: auto;
    padding: 0 15px;
    -webkit-overflow-scrolling: touch;
    overflow-y: hidden;
    margin-bottom: 10px;
}

.ph-card-products-carousel .card {
    width: 152px;
    float: left;
    text-align: center;
    overflow: hidden;
    flex: 0 0 auto;
    margin-right: 10px;
    position: relative;
}

.ph-card-products-carousel .card .image {
    width: 150px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    background-size: cover;
    border-top: 1px solid #e3e6e8;
    overflow: hidden;
    border-left: 1px solid #e3e6e8;
    border-right: 1px solid #e3e6e8;
    height: 150px;
    background-color: #f4f4f4;
}

.ph-card-products-carousel .card .info {
    background-color: white;
    padding: 15px 10px 13px 10px;
    border-bottom-left-radius: 15px;
    border-bottom-right-radius: 15px;
    height: 100px;
    border-left: 1px solid #e3e6e8;
    border-bottom: 1px solid #e3e6e8;
    border-right: 1px solid #e3e6e8;
}

.ph-card-products-carousel .card .info .ph-bg {
    animation-duration: 1s;
    animation-fill-mode: forwards;
    animation-iteration-count: infinite;
    animation-name: placeHolderShimmer;
    animation-timing-function: linear;
    background: #f6f7f8;
    background: linear-gradient(to right, #eeeeee 8%, #dddddd 18%, #eeeeee 33%);
    background-size: 800px 104px;
    height: 95px;
    position: relative;
}

.ph-card-products-carousel .card .info .ph-bg .ph-bar-1 {
    top: 0;
    left: 70px;
    right: 0;
    height: 16px;
}

.ph-card-products-carousel .card .info .ph-bg .ph-bar-2 {
    top: 16px;
    left: 0;
    right: 0;
    height: 8px;
}

.ph-card-products-carousel .card .info .ph-bg .ph-bar-3 {
    top: 36px;
    left: 0;
    right: 0;
    height: 8px;
}

.ph-card-products-carousel .card .info .ph-bg .ph-bar-4 {
    top: 55px;
    left: 0;
    right: 0;
    height: 8px;
}

.ph-card-products-carousel .card .info .ph-bg .ph-bar-5 {
    top: 74px;
    left: 0;
    right: 0;
    height: 8px;
}

.ph-card-products-carousel .card .info .ph-bg .ph-bar-6 {
    top: 82px;
    left: 70px;
    right: 0;
    height: 13px;
}

.ph-card-articles-carousel {
    display: flex;
    flex-wrap: nowrap;
    overflow: auto;
    padding: 0 15px;
    -webkit-overflow-scrolling: touch;
    overflow-y: hidden;
    height: 395px;
}

.ph-card-articles-carousel .card {
    border-radius: 15px;
    overflow: hidden;
    width: 230px;
    height: 393px;
    flex: 0 0 auto;
    margin-right: 10px;
    position: relative;
    border: 1px solid #dfdfdf;
}

.ph-card-articles-carousel .card .about-img {
    width: 100%;
    overflow: hidden;
    height: 230px;
    background-color: #F4F4F4;
}

.ph-card-articles-carousel .card .bg {
    background-color: white;
    padding: 20px 15px 13px 15px;
    border-bottom-left-radius: 15px;
    border-bottom-right-radius: 15px;
    position: relative;
    height: 130px;
}

.ph-card-articles-carousel .card .bg .ph-bg {
    animation-duration: 1s;
    animation-fill-mode: forwards;
    animation-iteration-count: infinite;
    animation-name: placeHolderShimmer;
    animation-timing-function: linear;
    background: #f6f7f8;
    background: linear-gradient(to right, #eeeeee 8%, #dddddd 18%, #eeeeee 33%);
    background-size: 800px 104px;
    height: 66px;
    position: relative;
}

.ph-card-articles-carousel .card .bg .ph-bg .ph-bar-1 {
    top: 0;
    left: 100px;
    right: 0;
    height: 17px;
}

.ph-card-articles-carousel .card .bg .ph-bg .ph-bar-2 {
    top: 17px;
    left: 0;
    right: 0;
    height: 7px;
}

.ph-card-articles-carousel .card .bg .ph-bg .ph-bar-3 {
    top: 34px;
    left: 0;
    right: 0;
    height: 6px;
}

.ph-card-articles-carousel .card .bg .ph-bg .ph-bar-4 {
    top: 50px;
    left: 0;
    right: 0;
    height: 6px;
}

.ph-card-articles-carousel .card .bg .ph-bg .ph-bar-5 {
    top: 56px;
    left: 100px;
    right: 0;
    height: 12px;
}






@keyframes placeHolderShimmer{
    0%{
        background-position: -468px 0
    }
    100%{
        background-position: 468px 0
    }
}


#search-results-container {
    margin-top: 15px;
}

.brand-card-search {
    width: 50%;
    float: left;
    margin-bottom: 15px;
}

.brand-card-search .container {
    position: relative;
    overflow: hidden;
}

.ais-Hits-item:nth-child(2n+1) .brand-card-search .container {
    padding-right: 7px;
}

.ais-Hits-item:nth-child(2n+2) .brand-card-search .container {
    padding-left: 7px;
}

.brand-card-search .header, .categories-card .header {
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;
    overflow: hidden;
    height: 100px;
    background-color: #fce8e1;
}

.brand-card-search .header img, .categories-card .header img {
    width: 120%;
    position: relative;
    text-align: center;
    justify-content: center;
    overflow: hidden;
    background-color: #fcf5f3;
}

.brand-card-search .profile-photo {
    width: 65px;
    height: 65px;
    border-radius: 50%;
    position: absolute;
    top: 45px;
    left: 8px;
    background-color: white;
    border: 2px solid white;
    overflow: hidden;
}

.brand-card-search .profile-photo img {
    width: 100%;
}

.ais-Hits-item:nth-child(2n+2) .brand-card-search .profile-photo {
    left: 15px;
}

.brand-card-search .info {
    background-color: #f2f2f2;
    padding: 15px 15px 18px 15px;
    border-bottom-left-radius: 15px;
    border-bottom-right-radius: 15px;
    height: 60px;
    overflow: hidden;
}

.brand-card-search .info .brand-card-name {
    font-family: "Space Mono", sans-serif;
    font-weight: 900;
    text-transform: uppercase;
    color: #656565;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    position: relative;
    line-height: 19px;  
}

.brand-card-search .info .brand-card-about {
    font-size: 12px;
    color: #868686;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    height: 42px;
    position: relative;
}

.brand-card-search .footer {
    position: absolute;
    bottom: 0;
    width: 83%;
    margin-left: 12px;
}

.brand-card-search .footer div {
    background-color: #f2f2f2;
    width: 100%;
    height: 10px;
}


.ais-Hits-list .ais-Hits-item{
    list-style-type: none;
}

.search-results-empty {
    display: none;
}

.search-results-empty .section-title i, .search-results-empty .section-title span {
    color: lightgrey;
}

.search-results-empty .section-title {
    margin-bottom: 8px;
}

.search-results-empty .empty {
    font-size: 12px;
    margin-left: 2px;
    color: #b4b4b4;
}

.fa-rotate-45 {
    transform: rotate(-45deg);
}

#full-screen-modal .p-list-sm {
    display: block;
    margin-top: -10px;
}

#searchbox-brands-2-navbar, #searchbox-products-navbar, #searchbox-communities-navbar, #searchbox-categories-navbar, #searchbox-articles-navbar, #searchbox-users-navbar {
    display: none;
}

#search-results-brands {
    margin-top: -5px;
    display: block;
    width: 100%;
    display: table;
}

#search-results-products, #search-results-communities, #search-results-categories, #search-results-articles, #search-results-users, #search-results-products-community {
    padding: 0 15px;
}

#search-results-products {
    margin-top: -15px;
}

.ais-SearchBox-loadingIndicator {
    position: absolute;
    top: 17px;
    right: 3px;
}


/* search community */

.communities-container {
    padding: 15px 15px 30px 15px;
}

.community-row {
    height: 65px;
    display: block;
    position: relative;
    padding: 10px 0;
}

/*.community-row-type {
    height: 95px;
}*/

.community-row img {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    border: 1px solid lightgrey;
    float: left;
}

.community-row-disabled img {
    opacity: 0.5;
}

.community-row > .info-col {
    padding-left: 75px;
}

.community-row > .info-col > .top-col > .name, .community-row > .info-col > .name  {
    display: block;
    font-weight: 900;
    margin-bottom: 2px;
    line-height: 18px;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;    
}

.community-row > .info-col > .top-col > .brand, .community-row > .info-col > .name {
    font-family: "Space Mono", monospace;
    text-transform: uppercase;
}

.community-row-disabled > .info-col > .top-col > .name, .community-row-disabled > .info-col > .name  {
    color: #bbbbbb;
}

.community-row-disabled > .info-col > .top-col > .brand, .community-row-disabled > .info-col > .name {
    color: #bbbbbb;
}

.community-row > .info-col > .top-col > .type {
    color: #c7c7c7;
    font-size: 13px;
    font-weight: 900;
    display: block;
    margin: 0px 0 2px 0;
}

.community-row > .info-col > .top-col > .type-highlight {
    color: red;
}

.community-row > .info-col > .description  {
    font-size: 11px;
    line-height: 14px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.community-row-disabled > .info-col > .description  {
    color: #bbbbbb;
}

.community-row > .info-col > .product-name  {
    font-size: 14px;
    line-height: 14px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.community-row > .info-col > .top-col {
    width: 135px;
    display: inline-block;
}

.community-row > .info-col > .follow { 
    position: absolute;
    top: 15px;
    right: 0;
    width: 90px;
    height: 30px;
}

.community-row > .info-col > .follow .follow-btn {
    border: 1px solid #ff9f9f;
    background-color: #ff9f9f;
    color: white;    
    padding: 5px 12px;
    border-radius: 15px;
    font-size: 14px;
}

.community-row > .info-col > .follow .follow-btn i {
    font-size: 12px;
    color: white;
    
}

.community-row > .info-col > .follow .active {
    background-color: white !important;
    color: #ff9f9f !important;
    border: 1px solid #ff9f9f !important;
}

.container-recommended-results .container-body {
    padding: 0 15px;
    margin-top: 15px;
} 

.container-body .title i, .container-body-bottom .title i {
    color: #eea996;
    font-size: 14px;
}

.recommended-body-padding {
    padding: 0 15px 110px 15px;
}

.search-section-box {
    margin-bottom: 20px;
}

.container-recommended-results .pnl-no-pad .section-title {
    margin: 0 15px 15px 15px;
}

.communities-container .follow-alert {
    background: linear-gradient(90deg, #ff5171 0%, #ff8aa0 100%) !important;
    padding: 20px;
    border-radius: 15px;
    margin: 0 0 20px 0;
}

.communities-container .follow-alert .title {
    color: white;
    font-size: 22px;
    font-weight: 900;
    display: block;
    margin-bottom: 7px;
}

.communities-container .follow-alert .title i {
    color: white;
    font-size: 20px;
}

.communities-container .follow-alert .subtitle {
    color: white;
    font-size: 16px;
    display: block;
    margin-bottom: 12px;
}

.communities-container .follow-alert .btn-md {

}


/* search articles */

.article-row {
    height: 90px;
    display: block;
}

.article-row > img {
    width: 90px;
    height: 80px;
    border-radius: 10px;
    float: left;
}

.article-row > .info-col {
    padding-left: 100px;
}

.article-row > .info-col > .section {
    font-family: "Space Mono", monospace;
    font-size: 10px;
    text-transform: uppercase;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    color: #FF5072;
    margin-bottom: 2px;
}

.article-row > .info-col > .title {
    font-weight: 900;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    margin-bottom: 3px;
}

.article-row > .info-col > .title > mark {
    font-weight: 900;
    background-color: #ffe9e2;
}


/* search category */

.search-category-row {
    height: 50px;
    display: block;
}

.search-category-row > img {
    width: 35px;
    height: 35px;
    border-radius: 50%;
    float: left;
}

.search-category-row > .info-col {
    float: left;
    padding-left: 10px;
}

.search-category-row > .info-col-cat {
    float: left;
    padding-left: 10px;
    margin-top: 9px;
}

.search-category-row > .info-col > .name, .search-category-row > .info-col-cat > .name {
    display: block;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.search-category-row > .info-col > .name > mark, .search-category-row > .info-col-cat > .name > mark {
    background-color: #ffe9e2;
}

.search-category-row > .info-col > .cat-sub-names {
    font-size: 12px;
    display: block;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    color: #aaaaaa;
}

.search-category-row > .info-col > .cat-sub-names > mark {
    font-size: 12px;
    background-color: #ffe9e2;
}



/* search users */

.user-row {
    height: 60px;
    display: block;
    padding-left: 5px;
}

.user-row > img {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    float: left;
    border: 1px solid lightgrey;
}

.user-row > .info-col {
    padding-left: 50px;
}

.user-row > .info-col > .name {
    font-weight: 900;
    font-size: 18px;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    margin-bottom: 3px;
    float: left;
    margin-top: 8px;
}

.user-row > .info-col > .name > mark {
    font-weight: 900;
    font-size: 18px;
    background-color: #ffe9e2;
}


/* search ingredient */

#ingredient-hits .ingredient {
    height: 35px;
    padding-left: 5px;
}

#ingredient-hits .ingredient > span > mark {
    background-color: #ffe9e2;
}

/*No results*/

.empty-results {
    padding: 0 10px 20px 10px;
}

.empty-results .title {
    font-weight: 900;
    font-size: 25px;
    display: block;
    margin-bottom: 10px;
}

.empty-results .subtitle {
    display: block;
    margin-bottom: 15px;
    line-height: 20px;
}

#suggest-form, #suggest-thanks, #suggest-form-community, #suggest-thanks-community {
    display: none;
    padding: 5px 15px;
}

#suggest-form .input .container,
#suggest-form-community .input .container {
    margin-bottom: 10px;
}

#suggest-form .send-btn {
    margin-top: 20px;
}


/* Menu Modal */

.menu-modal {
    width: 75%;
    height: 100%;
    position: fixed;
    bottom: 0;
    overflow-y: scroll;
    overflow-x: hidden;
    z-index: 65;
    animation-duration: 600ms;
    display: none;
}

.menu-modal > .container {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
}

.menu-modal .container .relative {
    position: relative;
    overflow: hidden;
    height: 100%;
}


.menu-modal .container .relative .bg {
    background-color: white;
    overflow-y: scroll;
    height: 100vh;
}

.menu-modal .lds-ellipsis-container {
    text-align: center;
    padding-top: 100px;
}

/* Menu Modal */

.menu-modal {

}

.menu-modal .container {

}

.menu-modal .container .user-profile {
    text-align: left;
    padding-left: 15px;
    padding-right: 15px;
    padding-bottom: 10px;
}

.menu-modal .container .user-profile .container {
    
}

.menu-modal .container .user-profile .photo {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    overflow: hidden;
    margin-top: 20px;
    background-color: #DDDDDD;
    margin-left: 5px;
}

.menu-modal .container .user-profile .photo img {
    width: 50px;
    height: 50px;
    object-fit: cover;
}

.menu-modal .container .user-profile .user-name {
    margin-top: 7px;
    display: flex;
    font-weight: 900;
    font-size: 18px;
    margin-left: 5px;
}

.menu-modal .container .user-profile .user-name .badges {
    margin-left: 5px;
}

.menu-modal .container .user-profile .user-name .badges .admin {
    color: white;
    font-size: 12px;
    background-color: #ff9e9e;
    padding: 2px 7px 1px 7px;
    border-radius: 10px;
    border: 1px solid #ff9e9e;
    font-weight: 400;
}

.menu-modal .container .user-profile .user-name .badges .employee {
    color: white;
    font-size: 12px;
    background-color: #454545;
    padding: 2px 7px 1px 7px;
    border-radius: 10px;
    border: 1px solid #454545;
    font-weight: 400;
}

.menu-modal .container .user-profile .user-name .badges .brand {
    color: white;
    font-size: 12px;
    background-color: #454545;
    padding: 2px 7px 1px 7px;
    border-radius: 10px;
    border: 1px solid #454545;
    font-weight: 400;
}

.menu-modal .container .user-profile .user-name .badges .ambassador {
    color: white;
    font-size: 12px;
    background-color: #ff9800;
    padding: 2px 7px 1px 7px;
    border-radius: 10px;
    border: 1px solid #ff9800;
    font-weight: 400;
}

.menu-modal .container .user-profile .user-name .badges i {
    color: white;
    font-size: 10px;
}

.menu-modal .container .user-info {
    display: flex;
    margin-left: 5px;
    margin-top: 3px;
}

.menu-modal .container .user-profile .user-info .icon-left {
    
}

.menu-modal .container .user-profile .user-info .icon-left .circle-icon {
    width: 20px;
    height: 20px;
    background-color: #4EA94E;
    border-radius: 50%;
    text-align: center;
    margin: auto;
    margin-top: 5px;
}

.menu-modal .container .user-profile .user-info .icon-left .circle-icon > i {
    color: white;
    font-size: 12px;
}

.menu-modal .container .user-profile .user-info .info-right {
    padding-left: 5px;
    padding-top: 5px;
    display: flex;
    flex-direction: row;
    align-items: center;
}

.menu-modal .container .user-profile .user-info .info-right .biuexp-number {
    font-size: 15px;
    font-weight: 900;
    display: block;
}

.menu-modal .container .user-profile .user-info .info-right .biuexp-text {
    font-size: 13px;
    color: #8c7a94;
    display: block;
    margin-left: 5px;
}

.menu-modal .container .alert-row {
    padding: 15px 0 0px 0;
}

.menu-modal .container .menu-nav-divider {
    padding: 15px;
}

.menu-modal .container .menu-nav-divider .container {
    border-bottom: 1px solid #c8c1cb;
} 

.menu-modal .container .alert-row .alert-btn {
    background: linear-gradient(111deg, #2d1974 0%, #cd8aed 100%);
    border-radius: 10px;
    padding: 12px 15px 13px 15px;
    display: block;
}

.menu-modal .container .alert-row .alert-btn .title {
    color: white;
    font-weight: 900;
    display: block;
    margin-bottom: 2px;
}

.menu-modal .container .alert-row .alert-btn .subtitle {
    color: white;
    font-size: 14px;
    display: block;
    line-height: 18px;
}

.menu-modal .container .close-menu-modal {
    position: absolute;
    right: 8px;
    top: 9px;
    height: 40px;
    width: 40px;
    text-align: center;
}

.menu-modal .container .close-menu-modal i {
    font-size: 28px;
    color: #DDDDDD;
    margin-top: 6px;
}

.menu-modal .container .menu-ribbon {
    background: linear-gradient(111deg, #2d1974 0%, #cd8aed 100%);
    width: 100%;
    margin-bottom: 10px;
}

.menu-modal .container .menu-ribbon .container {
    padding: 20px 20px 25px 20px;
}

.menu-modal .container .menu-ribbon .container .logo {
    width: 90px;
    height: 20px;
    display: block;
    margin-bottom: 20px;
}

.menu-modal .container .menu-ribbon .container .title {
    display: block;
    font-weight: 900;
    font-size: 20px;
    line-height: 20px;
    color: white;
    margin-bottom: 5px;
}

.menu-modal .container .menu-ribbon .container .subtitle {
    display: block;
    color: white;
    font-size: 14px;
}

.menu-modal .container .menu-ribbon .container .btns {
    margin-top: 15px;
}

.menu-modal .container .menu-ribbon .container .btns .btn-menu-transparent {
    border: 1px solid white;
    background-color: transparent;
    color: white;
    margin-right: 5px;
    display: inline-block;
    margin: auto;
    padding: 7px 15px;
    font-size: 14px;
    border-radius: 20px;
    font-weight: 500;
    cursor: pointer;
    margin-bottom: 7px;
}

.menu-modal .container .menu-ribbon .container .btns .btn-menu-solid {
    border: 1px solid #67419f;
    color: #623e9c;
    display: inline-block;
    margin: auto;
    padding: 7px 15px;
    font-size: 14px;
    border-radius: 20px;
    font-weight: 500;
    cursor: pointer;
    background-color: white;
}

.menu-modal .menu-nav {
    width: 100%;
}

.menu-modal .menu-nav > .container {
    padding-left: 7px;
    padding-bottom: 100px;
}

.menu-modal .menu-nav > .container .nav-a {
    display: inline-block;
    width: initial;
}

.menu-modal .menu-nav .container .active {
    
}

.menu-modal .menu-nav .container .nav-a > .container {
    width: 260px;
    padding: 12px 0px 7px 12px;
    height: 42px;
    border-radius: 20px;
    text-align: left;
    margin-left: -7px;
    display: flex;
    justify-content: space-between;
}

.menu-modal .menu-nav .container .nav-a > .container > i {
    color: #8c7994;
    margin-right: 15px;
    margin-top: 12px;
    font-size: 13px;
}

.menu-modal .menu-nav > .container .nav-a .container .info {
    
}

.menu-modal .menu-nav .container .nav-a .container .info .nav-icon {
    float: left;
    height: 30px;
    width: 35px;
    text-align: center;
    margin-right: 10px;
    margin: auto;
}

.menu-modal .menu-nav .container .nav-a .container .info .nav-icon i {
    color: #8c7994;
    font-size: 16px;
    margin-top: 4px;
}

.menu-modal .menu-nav .container .active .container .info .nav-icon i {
    color: #FF9F9F;
}

.menu-modal .menu-nav .container .nav-a .container .info .nav-text-col {
    margin-right: 15px;
    margin-left: 40px;
    line-height: 24px;
    font-size: 20px;
    font-weight: 700;
    overflow-wrap: break-word;
    min-width: 0px;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    margin-top: 0px;
}

.menu-modal .menu-nav .container .nav-a .container .info .nav-text-col .nav-text {
    overflow-wrap: break-word;
    min-width: 0px;
    font-size: 17px;
    font-weight: 500;
    color: #8c7994;
    white-space: inherit;
    display: block;
    margin-bottom: -6px;
    line-height: 24px;
}

.menu-modal .menu-nav .container .nav-a .container .info .nav-text-col .nav-subtext {
    font-size: 13px;
    font-weight: 400;
    color: #8c7994;
}

.menu-modal .menu-nav .container .active .container .info .nav-text-col .nav-text {
    color: #FF9F9F !important;
}

.menu-modal .menu-nav .container .nav-collapse-menu {
    display: none;
}

.menu-modal .menu-nav .container > .nav-collapse-menu > .container {
    padding-left: 45px;
    display: flex;
    flex-direction: column;
    padding-bottom: 30px;
}

.menu-modal .menu-nav .container .nav-collapse-menu .element {
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.menu-modal .menu-nav .container .nav-collapse-menu .element {
    
}

.menu-modal .menu-nav .container .nav-collapse-menu .element .text {
    color: #8c7994;
    font-weight: 500;
}

.menu-modal .menu-nav .container .nav-collapse-menu .element i {
    color: #8c7994;
    font-size: 13px;
    margin-right: 25px;
}

.menu-modal .menu-nav .container .nav-collapse-menu-collections .element i {
    margin-right: 5px;
}

.menu-modal .menu-nav .container .nav-collapse-menu .nav-collapse-cat {
    display: none;
}

.menu-modal .menu-nav .container .nav-collapse-menu .nav-collapse-cat .container {
    padding-left: 15px;
    padding-bottom: 30px;
}

.menu-modal .menu-nav .container .nav-collapse-menu .nav-collapse-cat .container .element {
    
}

.menu-modal .menu-nav .container .nav-collapse-menu .nav-collapse-cat .container .element .text {
    color: #8c7994;
    font-weight: 500;
}

.menu-modal .menu-nav .container .nav-collapse-menu .nav-collapse-cat .container .element .text i {
    color: #8c7994;
    font-size: 13px;
}


.menu-modal .menu-nav .container .nav-collapse-menu .nav-collapse-subcat {
    display: none;
}

.menu-modal .menu-nav .container .nav-collapse-menu > .active {
    display: block;
}

.menu-modal .menu-nav .container .nav-collapse-menu .nav-collapse-subcat .container {
    padding-left: 15px;
}

.menu-modal .menu-nav .container .nav-collapse-menu .nav-collapse-subcat .element .text {
    color: #8c7994;
    font-weight: 500;
}

.menu-modal .menu-nav .container .nav-collapse-menu .nav-collapse-subcat .element .text i {
    color: #8c7994;
    font-size: 13px;
}


.menu-modal .menu-nav .container .nav-collapse-menu .nav-collapse-subsubcat {
    display: none;
}

.menu-modal .menu-nav .container .nav-collapse-menu .nav-collapse-subsubcat .container {
    padding-left: 15px;
}

.menu-modal .menu-nav .container .nav-collapse-menu .nav-collapse-subsubcat .element {
    padding-right: 15px;
}

.menu-modal .menu-nav .container .nav-collapse-menu .nav-collapse-subsubcat .element .text {
    color: #8c7994;
    font-weight: 500;
}

.menu-modal .menu-nav .container .nav-collapse-menu .nav-collapse-icon {
    display: none;
}

.menu-modal .menu-nav .container .nav-collapse-menu .nav-collapse-icon .container {
    padding-bottom: 30px;
}

.menu-modal .menu-nav .container .nav-collapse-menu .nav-collapse-icon .element {
    justify-content: left;
}

.menu-modal .menu-nav .container .nav-collapse-menu .nav-collapse-icon .element .profile {
    width: 18px;
    height: 18px;
    border-radius: 50%;
    margin-right: 10px;
    border: 1px solid #dfdfdf;
}

.menu-modal .menu-nav .container .nav-collapse-menu .nav-collapse-icon .element .text {
    color: #8c7994;
    font-weight: 500;
}

.menu-modal .menu-nav .container .nav-collapse-menu .nav-collapse-icon .element .text i {
    color: #8c7994;
    font-size: 13px;
}



/* Cart Modal */

/* Menu Modal */

.cart-modal {
    width: 100%;
    height: 100%;
    position: fixed;
    bottom: 0;
    overflow-y: scroll;
    overflow-x: hidden;
    z-index: 65;
    animation-duration: 600ms;
    display: none;
}

.cart-modal > .container {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
}

.cart-modal .container .relative {
    position: relative;
    overflow: hidden;
    height: 100%;
}


.cart-modal .container .relative > .bg {
    background-color: white;
    overflow-y: scroll;
    height: 100vh;
}

.cart-modal .lds-ellipsis-container {
    text-align: center;
    padding-top: 100px;
}

.cart-modal .container .relative .bg  {

}

.cart-modal .container .relative .bg .container {
    
}

.cart-modal .container .relative .bg .container .cart-header {
    display: flex;
    padding: 20px 15px;
    justify-content: space-between;
}

.cart-modal .container .relative .bg .container .cart-header-empty {
    justify-content: flex-end;
}

.cart-modal .container .relative .bg .container .cart-header .title {
    font-size: 28px;
    font-weight: 900;
}

.cart-modal .container .relative .bg .container .cart-header .close-cart-modal {
    width: 40px;
    height: 40px;
    margin-top: -5px;
    cursor: pointer;
}

.cart-modal .container .relative .bg .container .cart-header .close-cart-modal i {
    color: #DDDDDD;
    font-size: 28px;
}

.cart-modal .container .relative .bg .container .summary-ph {
    padding: 0 15px 15px 15px;
}

.cart-modal .container .relative .bg .container .summary-ph .table {
    margin-bottom: 20px;
}

.cart-modal .container .relative .bg .container .summary-ph .table .row {
    animation-duration: 1s;
    animation-fill-mode: forwards;
    animation-iteration-count: infinite;
    animation-name: placeHolderShimmer;
    animation-timing-function: linear;
    background: #f6f7f8;
    background: linear-gradient(to right, #eeeeee 8%, #dddddd 18%, #eeeeee 33%);
    background-size: 800px 104px;
    height: 19px;
    position: relative;
    display: flex;
    justify-content: space-between;
    margin-bottom: 7px;
}


.cart-modal .container .relative .bg .container .summary-ph .table .row .white-bar {
    background: #fff;
    position: absolute;
}

.cart-modal .container .relative .bg .container .summary-ph .table .row-1 .white-bar {
    width: 45%;
    height: 19px;
    left: 35%;
}

.cart-modal .container .relative .bg .container .summary-ph .table .row-2 .white-bar {
    width: 64%;
    height: 19px;
    left: 20%;
}

.cart-modal .container .relative .bg .container .summary-ph .table .row-3 .white-bar {
    width: 40%;
    height: 19px;
    left: 45%;
}

.cart-modal .container .relative .bg .container .summary-ph .table .row-promo .white-bar {
    width: 34%;
    height: 19px;
    left: 55%;
}

.cart-modal .container .relative .bg .container .summary-ph .table .total-row {
    border-top: 1px solid #DBDBDB;
    margin-top: 12px;
    display: flex;
    justify-content: space-between;
    padding-top: 10px; 
}

.cart-modal .container .relative .bg .container .summary-ph .table .total-row .container {
    animation-duration: 1s;
    animation-fill-mode: forwards;
    animation-iteration-count: infinite;
    animation-name: placeHolderShimmer;
    animation-timing-function: linear;
    background: #f6f7f8;
    background: linear-gradient(to right, #eeeeee 8%, #dddddd 18%, #eeeeee 33%);
    background-size: 800px 104px;
    height: 21px;
    position: relative;
    width: 100%;
}

.cart-modal .container .relative .bg .container .summary-ph .table .total-row  .container .white-bar {
    background: #fff;
    position: absolute;
    width: 40%;
    height: 21px;
    left: 35%;
}

.cart-modal .container .relative .bg .container .summary-ph .wide-btn-ph {
    animation-duration: 1s;
    animation-fill-mode: forwards;
    animation-iteration-count: infinite;
    animation-name: placeHolderShimmer;
    animation-timing-function: linear;
    background: #f6f7f8;
    background: linear-gradient(to right, #eeeeee 8%, #dddddd 18%, #eeeeee 33%);
    background-size: 800px 104px;
    height: 45px;
    position: relative;
}

.cart-modal .container .relative .bg .container .body-ph {
    padding: 15px;
    background-color: #F8F8F8;
    height: 100vh;
}

.cart-modal .container .relative .bg .container .summary {
    padding: 0 15px 5px 15px;
}

.cart-modal .container .relative .bg .container .summary .table {
    
}

.cart-modal .container .relative .bg .container .summary .table .row {
    display: flex;
    justify-content: space-between;
    margin-bottom: 7px;
}

.cart-modal .container .relative .bg .container .summary .table .biucredits-row {
    background-color: #272727;
    padding: 8px 15px;
    margin-left: -15px;
    margin-right: -15px;
    margin-bottom: 0px;
}

.cart-modal .container .relative .bg .container .summary .table .biucredits-row .col-left {

}

.cart-modal .container .relative .bg .container .summary .table .biucredits-row .col-left .text {
    color: white;
}

.cart-modal .container .relative .bg .container .summary .table .biucredits-row .col-left .remove-biucredits {
    font-size: 13px;
    color: white;
    cursor: pointer;
    margin-top: 2px;
    background-color: transparent;
    padding: 0px 6px;
}

.cart-modal .container .relative .bg .container .summary .table .biucredits-row .col-left .remove-biucredits i {
    color: white;
    font-size: 14px;
}

.cart-modal .container .relative .bg .container .summary .table .biucredits-row .col-left .remove-biucredits:hover {
    
}

.cart-modal .container .relative .bg .container .summary .table .biucredits-row .col-right {

}

.cart-modal .container .relative .bg .container .summary .table .biucredits-row .col-right .text {
    font-size: 16px;
    color: white;
    font-weight: 500;
}

.cart-modal .container .relative .bg .container .summary .table .row-subtotal {
    border-top: 1px solid #DBDBDB;
    margin-top: 12px;
    padding-top: 10px;
    margin-bottom: 30px;
}

.cart-modal .container .relative .bg .container .summary .table .row-border-bottom {
    border-bottom: 1px solid #DBDBDB;
    padding-bottom: 12px;
    margin-bottom: 12px;
}

.cart-modal .container .relative .bg .container .summary .table .row-border-bottom .row {
    margin-bottom: 0;
}

.cart-modal .container .relative .bg .container .summary .table .row .col-left {
    display: inline-flex;
    align-items: center;
}

.cart-modal .container .relative .bg .container .summary .table .row .col-left .text {
    font-weight: 500;
}

.cart-modal .container .relative .bg .container .summary .table .row .promo-text {
    color: #68519b;
}

.cart-modal .container .relative .bg .container .summary .table .row .promo-tag {
    background-color: #e1d6e9;
    padding: 2px 5px;
    border-radius: 4px;
    color: #554069;
    margin-right: -4px;
}

.cart-modal .container .relative .bg .container .summary .table .row .promo-tag-left {
    margin-right: 5px;
    font-size: 14px;
    padding: 3px 8px;
}

.cart-modal .container .relative .bg .container .summary .table .total-row .col-left button,
.cart-modal .container .relative .bg .container .summary .table .total-row-2 .col-left button {
    font-size: 13px;
    margin-left: 10px;
    color: #896b97;
    cursor: pointer;
    margin-top: -1px;
    background-color: white;
    border: 1px solid #a8a8a8;
    padding: 3px 10px;
    border-radius: 15px;
}

.cart-modal .container .relative .bg .container .summary .table .total-row .col-left button i,
.cart-modal .container .relative .bg .container .summary .table .total-row-2 .col-left button i {
    font-size: 9px;
    color: #7557bb;
}

.cart-modal .container .relative .bg .container .summary .table .row .col-right {
    display: inline-flex;
    align-items: center;
}

.cart-modal .container .relative .bg .container .summary .table .row .col-right .text {
    font-weight: 500;
}

.cart-modal .container .relative .bg .container .summary .table .total-row,
.cart-modal .container .relative .bg .container .summary .table .subtotal-row {
    border-top: 1px solid #DBDBDB;
    margin-top: 12px;
    display: flex;
    justify-content: space-between;
    padding-top: 10px;
}

.cart-modal .container .relative .bg .container .summary .table .subtotal-row {
    padding-bottom: 7px;
}

.cart-modal .container .relative .bg .container .summary .table .total-row-2 {
    display: flex;
    justify-content: space-between;
    padding-top: 10px;
}

.cart-modal .container .relative .bg .container .summary .table .total-row .col-left,
.cart-modal .container .relative .bg .container .summary .table .total-row-2 .col-left {
    display: flex;
}

.cart-modal .container .relative .bg .container .summary .table .total-row .col-left .text-strong,
.cart-modal .container .relative .bg .container .summary .table .total-row-2 .col-left .text-strong {
    font-size: 18px;
    font-weight: 900;
}

.cart-modal .container .relative .bg .container .summary .table .subtotal-row .col-left .text-strong {
    font-weight: 500;
}

.cart-modal .container .relative .bg .container .summary .table .total-row .col-right,
.cart-modal .container .relative .bg .container .summary .table .total-row-2 .col-right {
    
}

.cart-modal .container .relative .bg .container .summary .table .total-row .col-right .text-red,
.cart-modal .container .relative .bg .container .summary .table .total-row-2 .col-right .text-red {
    color: #E34261;
    font-weight: 900;
    font-size: 18px;
}

.cart-modal .container .relative .bg .container .summary .table .subtotal-row .col-right .text-red {
    font-weight: 500;
}

.cart-modal .container .relative .bg .container .summary .table .savings-row {
    display: flex;
    justify-content: space-between;
}

.cart-modal .container .relative .bg .container .summary .table .code-container {
    display: flex;
    width: 100%;
    margin-bottom: -10px;
    margin-top: 7px;
}

.cart-modal .container .relative .bg .container .summary .table .savings-row .code-container {
    
}

.cart-modal .container .relative .bg .container .summary .table .code-container .code {
    background: linear-gradient(111deg, #ff5171 0%, #ea2549 100%);
    padding: 0px 0 0 10px;
    border-radius: 4px;
    display: flex;
    align-items: center;
    margin-right: 7px;
    margin-bottom: 10px;
}

.cart-modal .container .relative .bg .container .summary .table .code-container .code span {
    font-weight: 900;
    color: white;
    font-size: 14px;
    text-transform: uppercase;
    display: flex;
}

.cart-modal .container .relative .bg .container .summary .table .code-container .code .remove-code {
    width: 25px;
    height: 27px;
    margin-left: -4px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.cart-modal .container .relative .bg .container .summary .table .code-container .code .remove-code i {
    color: #ff99ab;
    font-size: 13px;
}

.cart-modal .container .relative .bg .container .summary .table .savings-row .col-right {
    
}

.cart-modal .container .relative .bg .container .summary .table .savings-row .col-right .text-purple {
    background-color: #e1d7e9;
    padding: 4px 8px;
    border-radius: 4px;
    margin-top: 6px;
    display: flex;
    align-items: center;
}

.cart-modal .container .relative .bg .container .summary .table .savings-row .col-right .text-purple .text {
    font-weight: 500;
    font-size: 14px;
    color: #55406a;
    margin-right: 5px;
}

.cart-modal .container .relative .bg .container .summary .table .savings-row .col-right .text-purple .number {
    font-weight: 500;
    font-size: 14px;
    color: #55406a;
}

.cart-modal .container .relative .bg .container .kueski-offer-container,
.cart-modal .container .relative .bg .container .biucredits-offer-container {
    padding: 0 0 15px 0;
    margin-top: -15px;
}

.biucredits-summary-container {
    margin-bottom: 20px;
}

.biucredits-summary-container .biucredits {
    background: linear-gradient(111deg, #272727 66%, #707070 100%);
    border-radius: 10px;
    padding: 9px 15px;
}

.biucredits-summary-container .available-biucredits {
    background: initial;
    background-color: white;
    border: 1px solid #d5d9d9;
}

.biucredits-summary-container .biucredits {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.biucredits-summary-container .biucredits .left {
    display: flex;
    align-items: flex-start;
    flex-direction: column;
    justify-content: center;
}

.biucredits-summary-container .biucredits .left .top span {
    color: white;
    font-weight: 500;
    font-size: 16px;
}

.biucredits-summary-container .biucredits .left .top .btn-sm:hover {
    background-color: black;
}

.biucredits-summary-container .biucredits .left .bottom {
    
}

.biucredits-summary-container .biucredits .left .bottom span {
    font-size: 13px;
    display: block;
    cursor: pointer;
    color: #959595;
    text-decoration: underline;
}

.biucredits-summary-container .biucredits .right {
    display: flex;
    align-items: center;
}

.biucredits-summary-container .biucredits .right .btn-sm {
    font-size: 13px;
    margin-right: 5px;
    color: white;
    cursor: pointer;
    background-color: transparent;
    border: 1px solid white;
    padding: 3px 10px;
    border-radius: 15px;
    min-width: 38px;
}

.biucredits-summary-container .biucredits .right .amount .currency {
    font-size: 14px;
    color: white;
    font-weight: 400;
    margin-right: 5px;
}

.biucredits-summary-container .biucredits .right .amount .number {
    font-size: 16px;
    color: white;
    font-weight: 500;
}

.biucredits-summary-container .available-biucredits .right .amount .currency,
.biucredits-summary-container .available-biucredits .right .amount .number {   
    color: #454545;
    font-weight: 400;
    font-size: 15px;
}

.biucredits-summary-container .available-biucredits .left .top span {
    color: #454545;
    font-weight: 500;
    font-size: 16px;
}

.biucredits-summary-container .available-biucredits .left .bottom span {
    color: #888783;
    font-weight: 400;
    font-size: 14px;
}

.biucredits-summary-container .available-biucredits .right .currency {   
    font-size: 14px;
    margin-right: 3px;
    margin-top: 1px;
}

.cart-modal .container .relative .bg .container .pay-btn-box {
    height: 83px;
}

.cart-modal .container .relative .bg .container .pay-btn-box .pay-btn {
    background-color: white;
}

.cart-modal .container .relative .bg .container .pay-btn-box .pay-btn .container {
    padding: 15px 15px 15px 15px;
}

.cart-modal .container .relative .bg .container .pay-btn-box .fixed-pay-btn {
    position: fixed !important;
    top: 0;
    z-index: 30;
    width: 100%;
}

.cart-modal .container .relative .bg .container .pay-btn-box .pay-btn .wide-btn {
    background: linear-gradient(111deg, #2d1974 0%, #cd8aed 100%);
    border: none;
    font-weight: 900;
    color: white;
}

.cart-modal .container .relative .bg .container .pay-btn-box .pay-btn .wide-btn:hover {
    background: linear-gradient(111deg, #2d1974 0%, #ad71c9 100%);
}

.cart-modal .container .relative .bg .container .divider {
    background-color: #F0EEF3;
    height: 7px;
    width: 100%;
}

.cart-modal .container .relative .bg .container .body {
    padding: 30px 15px 15px 15px;
    background-color: #f0eef3;
}

.cart-modal .container .relative .bg .container .body .shipping-details-header {
    font-size: 14px;
    color: #A2A2A2;
    display: block;
    margin-bottom: 15px;
}

.cart-modal .container .relative .bg .container .body .shipping {
    padding: 15px;
    border-radius: 10px;
    background-color: white;
    border: 1px solid #CDCDCD;
    margin-bottom: 20px;
}

.cart-modal .container .relative .bg .container .body .shipping-header {
    padding: 0 5px 20px 5px;
    margin-bottom: 20px;
    background-color: transparent;
    border: none;
    border-radius: initial;
    border-bottom: 1px solid #CDCDCD;
}

.cart-modal .container .relative .bg .container .body .shipping > .header {
    border-bottom: 1px solid #DBDBDB;
    padding-bottom: 15px;
    margin-bottom: 15px;
}

.cart-modal .container .relative .bg .container .body .shipping .header .top {
    display: flex;
    justify-content: space-between;
}

.cart-modal .container .relative .bg .container .body .shipping .header .left {
    
}

.cart-modal .container .relative .bg .container .body .shipping .header .left .title {
    color: #FF9F9F;
    font-size: 21px;
    font-weight: 900;
    display: block;
    margin-bottom: 3px;
}

.cart-modal .container .relative .bg .container .body .shipping .header .left .subtitle {
    display: block;
}

.cart-modal .container .relative .bg .container .body .shipping .header .left .subtitle a {
    color: #472B88;
}

.cart-modal .container .relative .bg .container .body .shipping .header .right {
    
}

.cart-modal .container .relative .bg .container .body .shipping .header .right .profile {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    border: 1px solid #e1e1e1;
}

.cart-modal .container .relative .bg .container .body .shipping .header .shipping-time {
    color: #468046;
    font-size: 18px;
    font-weight: 900;
    display: block;
    line-height: 20px;
    margin-top: 2px;
}

.cart-modal .container .relative .bg .container .body .shipping .shipping-details {
    
}

.cart-modal .container .relative .bg .container .body .shipping .shipping-details .shipping-section-title {
    color: #FF9F9F;
    font-size: 21px;
    font-weight: 900;
    display: block;
    margin-bottom: 5px;
}

.cart-modal .container .relative .bg .container .body .shipping .shipping-details .shipping-info {
    display: inline-flex;
    align-items: center;
}

.cart-modal .container .relative .bg .container .body .shipping .shipping-details .shipping-time-container {
    
}

.cart-modal .container .relative .bg .container .body .shipping .shipping-details .shipping-time-container .shipping-time {
    color: #468046;
    font-size: 18px;
    font-weight: 900;
    display: block;
    line-height: 20px;
    margin-top: 2px;
}

.cart-modal .container .relative .bg .container .body .shipping .header .cashback {
    display: flex;
    margin-top: 10px;
    align-items: center;
}

.cart-modal .container .relative .bg .container .body .shipping .header .cashback .info {
    background: linear-gradient(111deg, #272727 66%, #707070 100%);
    border-radius: 4px;
    padding: 3px 8px;
    color: white;
    font-weight: 500;
    font-size: 14px;
}

.cart-modal .container .relative .bg .container .body .shipping .header .cashback .link {
    font-size: 14px;
    margin-left: 5px;
    text-decoration: underline;
    cursor: pointer;
    color: gray;
}

.cart-modal .container .relative .bg .container .body .shipping .header .cashback .promo {
    background-color: #e1d7e9;
    font-size: 14px;
    padding: 3px 8px;
    border-radius: 4px;
    color: #55406a;
    font-weight: 500;
    font-size: 14px;
    display: block;
    text-align: center;
    margin-left: 5px;
}

.cart-modal .container .relative .bg .container .body .shipping .header .cashback .promo i {
    font-size: 12px;
    color: #55406a;
}

.cart-modal .container .relative .bg .container .body .shipping .shipping-details .title {
    display: block;
    font-weight: 900;
    margin-bottom: 5px;
    margin-top: 5px;
    font-size: 17px;
}

.cart-modal .container .relative .bg .container .body .shipping .shipping-details .title-red {
    background: linear-gradient(111deg, #467f46 0%, #8ede8e 100%);
    color: white;
    padding: 4px 10px 3px 10px;
    border-radius: 4px;
    display: inline-block;
    font-size: 14px;
    margin-bottom: 5px;
    text-transform: uppercase;
}

.cart-modal .container .relative .bg .container .body .shipping .shipping-details .shipping-info .savings {
    background-color: #e1d7e9;
    font-size: 14px;
    padding: 3px 8px;
    border-radius: 4px;
    color: #55406a;
    font-weight: 500;
    font-size: 14px;
    display: block;
    text-align: center;
    margin-left: 5px;
}

.cart-modal .container .relative .bg .container .body .shipping .shipping-details .subtitle {
    color: #5A5A5A;
    display: block;
}

.cart-modal .container .relative .bg .container .body .shipping .shipping-details .cart-info {
    margin-top: 5px;
}

.cart-modal .container .relative .bg .container .body .shipping .shipping-details .cart-info .chart {
    
}

.cart-modal .container .relative .bg .container .body .shipping .shipping-details .cart-info .chart .header {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    margin-bottom: 15px;
}

.cart-modal .container .relative .bg .container .body .shipping .shipping-details .cart-info .chart .header .left {
    margin-top: -2px;
}

.cart-modal .container .relative .bg .container .body .shipping .shipping-details .cart-info .chart .header .left i {
    color: #467F46;
    font-size: 16px;
}

.cart-modal .container .relative .bg .container .body .shipping .shipping-details .cart-info .chart .header .left span {
    color: #007000;
    font-weight: 900;
    font-size: 19px;
}

.cart-modal .container .relative .bg .container .body .shipping .shipping-details .cart-info .chart .header .left span small {
    color: #94a694;
    font-weight: 500;
    font-size: 12px;
    display: flex;
    margin-left: 21px;
    margin-top: 3px;
}

.cart-modal .container .relative .bg .container .body .shipping .shipping-details .cart-info .bar {
    position: relative;
    width: 100%;
    height: 10px;
}

.cart-modal .container .relative .bg .container .body .shipping .shipping-details .cart-info .show-info {
    height: 35px;
}

.cart-modal .container .relative .bg .container .body .shipping .shipping-details .cart-info .no-milestones {
    height: 10px;
}

.cart-modal .container .relative .bg .container .body .shipping .shipping-details .cart-info .bar .bg {
    height: 8px;
    width: 100%;
    background-color: #dddddd;
    border-radius: 10px;
    position: absolute;
    top: 0;
}

.cart-modal .container .relative .bg .container .body .shipping .shipping-details .cart-info .bar .fill {
    height: 8px;
    background: rgb(72,126,72);
    background: linear-gradient(90deg, rgba(72,126,72,1) 0%, rgba(29,181,29,1) 100%);
    border-radius: 10px;    
    position: absolute;
    top: 0;    
}

.cart-modal .container .relative .bg .container .body .shipping .shipping-details .cart-info .bar .milestone {
    position: absolute;
    top: -4px;
    display: flex;
    flex-direction: column;
    width: 60px;
    height: 16px;
}

.cart-modal .container .relative .bg .container .body .shipping .shipping-details .cart-info .show-info .milestone {
    height: 40px;
}

.cart-modal .container .relative .bg .container .body .shipping .shipping-details .cart-info .show-info .milestone-hidden-labels {
    height: 17px;
}

.cart-modal .container .relative .bg .container .body .shipping .shipping-details .cart-info .bar .milestone-hidden-labels .pipe,
.cart-modal .container .relative .bg .container .body .shipping .shipping-details .cart-info .bar .milestone-hidden-labels .text {
    display:  none !important;
}

.cart-modal .container .relative .bg .container .body .shipping .shipping-details .cart-info .bar .right {
    position: absolute;
    top: -4px;
    display: flex;
    flex-direction: column;
    width: 65px;
    height: 40px;
}

.cart-modal .container .relative .bg .container .body .shipping .shipping-details .cart-info .bar .milestone .circle {
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background-color: #dddddd;
    text-align: center;
    display: flex;
    position: absolute;
    left: 22px;
    top: -1px;
    justify-content: center;
    align-items: center;
}

.cart-modal .container .relative .bg .container .body .shipping .shipping-details .cart-info .bar .right .circle {
    right: 0px;
    left: initial;
}

.cart-modal .container .relative .bg .container .body .shipping .shipping-details .cart-info .bar .completed .circle {
    background-color: #379437;
}

.cart-modal .container .relative .bg .container .body .shipping .shipping-details .cart-info .bar .warning .circle {
    background-color: #ff9800;
}

.cart-modal .container .relative .bg .container .body .shipping .shipping-details .cart-info .bar .milestone .circle i {
    color: white;
    font-size: 11px;
}

.cart-modal .container .relative .bg .container .body .shipping .shipping-details .cart-info .bar .milestone .pipe {
    background-color: #B2AFAF;
    height: 10px;
    width: 1px;
    left: 30px;
    position: absolute;
    top: 16px;
    display: none;
}

.cart-modal .container .relative .bg .container .body .shipping .shipping-details .cart-info .show-info .milestone .pipe {
    display: block;
}

.cart-modal .container .relative .bg .container .body .shipping .shipping-details .cart-info .bar .right .pipe {
    left: initial;
    right: 8px;
}

.cart-modal .container .relative .bg .container .body .shipping .shipping-details .cart-info .bar .completed .pipe {
    background-color: #007000;
}

.cart-modal .container .relative .bg .container .body .shipping .shipping-details .cart-info .bar .milestone .text {
    position: absolute;
    top: 22px;
    width: 65px;
    text-align: center;
    display: none;
}

.cart-modal .container .relative .bg .container .body .shipping .shipping-details .cart-info .show-info .milestone .text {
    display: block;
}

.cart-modal .container .relative .bg .container .body .shipping .shipping-details .cart-info .bar .right .text {
    width: 65px;
    text-align: right;
}

.cart-modal .container .relative .bg .container .body .shipping .shipping-details .cart-info .bar .milestone .text .label {
    color: #888783;
    font-size: 12px;
    font-weight: 500;
}

.cart-modal .container .relative .bg .container .body .shipping .shipping-details .cart-info .bar .milestone .text .icon {
    display: none;
}

.cart-modal .container .relative .bg .container .body .shipping .shipping-details .cart-info .bar .milestone .text .icon i {
    color: #888783;
    font-size: 12px;
}

.cart-modal .container .relative .bg .container .body .shipping .shipping-details .cart-info .bar .milestone .text span i {
    color: #888783;
    font-size: 11px;
}

.cart-modal .container .relative .bg .container .body .shipping .shipping-details .cart-info .bar .completed .text span,
.cart-modal .container .relative .bg .container .body .shipping .shipping-details .cart-info .bar .completed .text span i {
    color: #007000;
}

.cart-modal .container .relative .bg .container .body .shipping .shipping-details .cart-info .bar .milestone .right {

}

.cart-modal .container .relative .bg .container .body .shipping .shipping-details .cart-info > .info {
    padding: 20px 0 0px 0;
    display: none;
    margin-bottom: 0px;
}

.cart-modal .container .relative .bg .container .body .shipping .shipping-details .cart-info .btn-container {
    margin-top: 10px;
}

.cart-modal .container .relative .bg .container .body .shipping .shipping-details .cart-info .btn-container .cart-info-preview {
    font-size: 14px;
    color: #007000;
    display: block;
}

.cart-modal .container .relative .bg .container .body .shipping .shipping-details .cart-info .btn-container .cart-info-preview .more {
    font-size: 14px;
    color: #007000;
    display: inline-flex;
    align-items: center;
}

.cart-modal .container .relative .bg .container .body .shipping .shipping-details .cart-info .btn-container .cart-info-preview .more .fas {
    font-size: 10px;
    color: #007000;
    margin-left: 3px;
    margin-top: 2px;
}

.cart-modal .container .relative .bg .container .body .shipping .shipping-details .cart-info .btn-container .cart-info-preview strong {
    font-weight: 500;
    color: #007000;
    font-size: 14px;
}

.cart-modal .container .relative .bg .container .body .shipping .shipping-details .cart-info .btn-container .cart-info-warning {
    background-color: #fef1c4;
    padding: 5px 10px;
    border-radius: 10px;
    border: 1px solid #d9b035;
    display: flex;
    align-items: center;
    cursor: pointer;
}

.cart-modal .container .relative .bg .container .body .shipping .shipping-details .cart-info .btn-container .cart-info-success {
    background-color: #e4f5e4;
    padding: 5px 10px;
    border-radius: 10px;
    border: 1px solid #a0b2a0;
    display: flex;
    align-items: center;
    cursor: pointer;
}

.cart-modal .container .relative .bg .container .body .shipping .shipping-details .cart-info .btn-container .cart-info-preview .icon-col {
    width: 35px;
}

.cart-modal .container .relative .bg .container .body .shipping .shipping-details .cart-info .btn-container .cart-info-preview .icon-col .circle {
    width: 25px;
    height: 25px;
    border-radius: 50%;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 10px;
    margin-left: 2px;
}

.cart-modal .container .relative .bg .container .body .shipping .shipping-details .cart-info .btn-container .cart-info-warning .icon-col .circle {
    background-color: #ff9800;
}

.cart-modal .container .relative .bg .container .body .shipping .shipping-details .cart-info .btn-container .cart-info-success .icon-col .circle {
    background-color: #467f46;
}

.cart-modal .container .relative .bg .container .body .shipping .shipping-details .cart-info .btn-container .cart-info-preview .icon-col .circle i {
    color: white;
    font-size: 14px;
}

.cart-modal .container .relative .bg .container .body .shipping .shipping-details .cart-info .btn-container .cart-info-preview span {
    font-size: 15px;
    line-height: 20px;
}

.cart-modal .container .relative .bg .container .body .shipping .shipping-details .cart-info .btn-container .cart-info-preview span strong {
    font-weight: 900;
    font-size: 15px;
}

.cart-modal .container .relative .bg .container .body .shipping .shipping-details .cart-info .btn-container .cart-info-warning span, 
.cart-modal .container .relative .bg .container .body .shipping .shipping-details .cart-info .btn-container .cart-info-warning strong {
    color: #7c6010;
}

.cart-modal .container .relative .bg .container .body .shipping .shipping-details .cart-info .btn-container .cart-info-success span, 
.cart-modal .container .relative .bg .container .body .shipping .shipping-details .cart-info .btn-container .cart-info-success strong {
    color: #467f46;
}

.cart-modal .container .relative .bg .container .body .shipping .shipping-details .cart-info .btn-container .cart-info-warning .more,
.cart-modal .container .relative .bg .container .body .shipping .shipping-details .cart-info .btn-container .cart-info-warning .more .fas {
    color: #9d8c5c;
}

.cart-modal .container .relative .bg .container .body .shipping .shipping-details .cart-info .btn-container .cart-info-success .more,
.cart-modal .container .relative .bg .container .body .shipping .shipping-details .cart-info .btn-container .cart-info-success .more .fas {
    color: #669564;
}

.cart-modal .container .relative .bg .container .body .shipping .shipping-details .cart-info .btn-container .cart-info-btn {
    font-size: 14px;
    border-radius: 20px;
    color: #472a88;
    cursor: pointer;
}

.cart-modal .container .relative .bg .container .body .shipping .shipping-details .cart-info .btn-container .cart-info-btn i {
    color: #472a88;
    font-size: 11px;
}

.cart-modal .container .relative .bg .container .body .shipping .shipping-details > .info {
    padding: 20px 0 0px 0;
    display: none;
    margin-bottom: 35px;
}

.cart-modal .container .relative .bg .container .body .shipping .shipping-details .info .row {
    margin-bottom: 20px;
    display: flex;
}

.cart-modal .container .relative .bg .container .body .shipping .shipping-details .info div:last-child {
    margin-bottom: 0;
}

.cart-modal .container .relative .bg .container .body .shipping .shipping-details .info .row-attention {
    background-color: #FFECB5;
    margin: -10px -15px 12px -15px;
    padding: 15px;
}

.cart-modal .container .relative .bg .container .body .shipping .shipping-details .info .row .icon {
    width: 45px;
    text-align: center;
}

.cart-modal .container .relative .bg .container .body .shipping .shipping-details .info .row .icon i {
    color: #8c7f97;
}

.cart-modal .container .relative .bg .container .body .shipping .shipping-details .info .active .icon i {
    color: #26a828;
}

.cart-modal .container .relative .bg .container .body .shipping .shipping-details .info .warning .icon i {
    color: #ff9800;
    font-size: 22px;
}

.cart-modal .container .relative .bg .container .body .shipping .shipping-details .info .row .right {
    display: flex;
    flex-direction: column;
    width: 100%;
    flex-wrap: nowrap;
    align-items: flex-start;
}

.cart-modal .container .relative .bg .container .body .shipping .shipping-details .info .row .right .text {
    color: #575959;
    font-weight: 500;
}

.cart-modal .container .relative .bg .container .body .shipping .shipping-details .info .active .right .text {
    color: #007000;
}

.cart-modal .container .relative .bg .container .body .shipping .shipping-details .info .row .right .strong {
    color: #472B88;
    font-weight: 900;
}

.cart-modal .container .relative .bg .container .body .shipping .shipping-details .info .row .right .attention {
    color: #e44160;
    font-weight: 900;
}

.cart-modal .container .relative .bg .container .body .shipping .shipping-details .info .active .right .strong {
    color: #007000;
}

.cart-modal .container .relative .bg .container .body .shipping .shipping-details .info .warning .right .text,
.cart-modal .container .relative .bg .container .body .shipping .shipping-details .info .warning .right .strong {
    color: #ff9800;
}

.cart-modal .container .relative .bg .container .body .shipping .shipping-details .info .row .right .promo-btn {
    background-color: #FFF0C4;
    padding: 2px 12px;
    font-size: 11px;
    border-radius: 20px;
    font-weight: 500;
    border: 1px solid #D9B036;
    color: #7B6011;
    display: inline-block;
    margin-top: 8px;
    cursor: pointer;
}

.cart-modal .container .relative .bg .container .body .shipping .shipping-details .info .row .right .promo-btn i {
    color: #7B6011;
    font-size: 11px;
}

.cart-modal .container .relative .bg .container .body .shipping .shipping-details .info .row .right .promo-btn-white {
    background-color: white;
    padding: 5px 10px;
    font-size: 12px;
    border-radius: 20px;
    font-weight: 500;
    border: 1px solid white;
    color: #472B88;
    margin-top: 10px;
}

.cart-modal .container .relative .bg .container .body .shipping .shipping-details .info .row .right .promo-btn-white i {
    color: #472B88;
    font-size: 12px;
}

.cart-modal .container .relative .bg .container .body .shipping .shipping-details .info .row .right .link {
    font-size: 14px;
    color: #472B88;
    font-weight: 400;
    margin-top: 2px;
}

.cart-modal .container .relative .bg .container .body .shipping .shipping-details .info .row .right .link i {
    font-size: 11px;
    color: #472B88;
}

.cart-modal .container .relative .bg .container .body .shipping .shipping-details .info .promo {
    margin: 0px 0 20px 0;
    display: none;
}

.cart-modal .container .relative .bg .container .empty-cart {
    max-width: 250px;
    margin: auto;
    text-align: center;
}

.cart-modal .container .relative .bg .container .empty-cart .icon-container {
    margin-bottom: 30px;
}

.cart-modal .container .relative .bg .container .empty-cart .icon-container .bg {
    background-color: #f8f8f8;
    width: 200px;
    height: 200px;
    border-radius: 50%;
    margin: auto;
    display: flex;
    align-items: center;
    justify-content: center;
}

.cart-modal .container .relative .bg .container .empty-cart .icon-container .bg i {
    font-size: 80px;
    margin-left: -10px;
    margin-top: 7px;
    color: #ff9e9e;
}

.cart-modal .container .relative .bg .container .empty-cart .title {
    font-size: 24px;
    font-weight: 200;
    display: block;
    margin-bottom: 15px;
}

.cart-modal .container .relative .bg .container .empty-cart .subtitle {
    color: darkgrey;
}

.cart-modal .container .relative .bg .container .empty-cart .subtitle a {
    text-decoration: underline;
    color: #fe9e9e;
}

.cart-modal .container .relative .bg .container .body .promos {
    background-color: #FF5072;
    border-radius: 10px;
    padding: 15px;
    position: relative;
    overflow: hidden;
    margin-bottom: 20px;
}

.cart-modal .container .relative .bg .container .body .shipping .items .item .promos {
    background-color: initial;
}

.cart-modal .container .relative .bg .container .body .promos .foreground {
    position: relative;
    z-index: 1;
}

.cart-modal .container .relative .bg .container .body .promos .foreground .header {
    display: flex;
}

.cart-modal .container .relative .bg .container .body .promos .foreground .header .title {
    font-size: 20px;
    font-weight: 900;
    color: white;
    display: flex;
}

.cart-modal .container .relative .bg .container .body .promos .foreground .header .title .circle {
    width: 20px;
    height: 20px;
    background-color: white;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-left: 5px;
    margin-top: 1px;    
}

.cart-modal .container .relative .bg .container .body .promos .foreground .header .title .circle span {
    color: #ff5171;
}

.cart-modal .container .relative .bg .container .body .promos .foreground .bar {
    position: relative;
    width: 100%;
    height: 7px;
    margin-top: 15px;
    margin-bottom: 15px;
}

.cart-modal .container .relative .bg .container .body .promos .foreground .bar .bg {
    height: 7px;
    width: 100%;
    background-color: white;
    border-radius: 10px;
    position: absolute;
    top: 0;
}

.cart-modal .container .relative .bg .container .body .promos .foreground .bar .fill {
    height: 7px;
    background: rgb(72,126,72);
    background: linear-gradient(111deg, #2d1974 0%, #cd8aed 100%);
    border-radius: 10px;
    position: absolute;
    top: 0;
}

.cart-modal .container .relative .bg .container .body .promos .foreground .bar .milestone {
    position: absolute;
    top: -6px;
    right: 0;
}

.cart-modal .container .relative .bg .container .body .promos .foreground .bar .milestone .circle {
    width: 26px;
    height: 26px;
    border-radius: 50%;
    background-color: white;
    text-align: center;
    display: flex;
    position: absolute;
    right: 0;
    top: -4px;
    justify-content: center;
    align-items: center;
}

.cart-modal .container .relative .bg .container .body .promos .foreground .bar .milestone .warning {
    background: linear-gradient(111deg, #ffffff 0%, #fffe00 100%);
    display: none;
}

.cart-modal .container .relative .bg .container .body .promos .foreground .bar .milestone .completed {
    background: linear-gradient(111deg, #ffffff 0%, #8ad98a 100%);
    display: none;
}

.cart-modal .container .relative .bg .container .body .promos .foreground .bar .milestone .visible {
    display: flex;
}

.cart-modal .container .relative .bg .container .body .promos .foreground .bar .milestone .fa-check {
    font-size: 14px;
    color: #ff728c;
}

.cart-modal .container .relative .bg .container .body .promos .foreground .bar .milestone .fa-exclamation {
    font-size: 14px;
    color: #ff5171;
}

.cart-modal .container .relative .bg .container .body .promos .foreground .bar .active .fa-check {
    font-size: 14px;
    color: #2f8d2d;
}

.cart-modal .container .relative .bg .container .body .promos .foreground .btn-container {

}

.cart-modal .container .relative .bg .container .body .promos .foreground .btn-container .text {
    color: white;
    line-height: 22px;
}

.cart-modal .container .relative .bg .container .body .promos .foreground .btn-container .text strong {
    color: white;
    font-weight: 900;
}

.cart-modal .container .relative .bg .container .body .promos .foreground .btn-container .link {
    font-size: 14px;
    color: #ffdfe5;
    cursor: pointer;
}

.cart-modal .container .relative .bg .container .body .promos .foreground .btn-container .link i {
    font-size: 11px;
    color: #ffdfe5;
    cursor: pointer;
}

.cart-modal .container .relative .bg .container .body .promos .foreground .info {
    padding: 20px 0 0px 0;
    display: none;
    margin-bottom: 0px;
}

.cart-modal .container .relative .bg .container .body .promos .foreground .info .row {
    margin-bottom: 20px;
    display: flex;
}

.cart-modal .container .relative .bg .container .body .promos .foreground .info .row .icon {
    width: 45px;
    text-align: center;
}

.cart-modal .container .relative .bg .container .body .promos .foreground .info .row .icon i {
    color: white;
}

.cart-modal .container .relative .bg .container .body .promos .foreground .info .row .right {
    display: flex;
    flex-direction: column;
    width: 100%;
    flex-wrap: nowrap;
    align-items: flex-start;
}

.cart-modal .container .relative .bg .container .body .promos .foreground .info div:last-child {
    margin-bottom: 0;
}

.cart-modal .container .relative .bg .container .body .promos .foreground .info .row .right .text {
    color: white;
    font-weight: 500;
}

.cart-modal .container .relative .bg .container .body .promos .foreground .info .row .right .text strong {
    color: white;
    font-weight: 900;
}

.cart-modal .container .relative .bg .container .body .promos .foreground .info .active .right .text,
.cart-modal .container .relative .bg .container .body .promos .foreground .info .active .right .text strong,
.cart-modal .container .relative .bg .container .body .promos .foreground .info .active .icon i {
    color: #ab3a50;
}

.cart-modal .container .relative .bg .container .body .promos .foreground .info .row .right .promo-btn {
    background-color: #fff4d5;
    padding: 2px 12px;
    font-size: 11px;
    border-radius: 20px;
    font-weight: 500;
    color: #7B6011;
    display: inline-block;
    margin-top: 8px;
    cursor: pointer;
}

.cart-modal .container .relative .bg .container .body .promos .foreground .info .row .right .promo-btn i {
    color: #7B6011;
    font-size: 11px;
}

.cart-modal .container .relative .bg .container .body .promos .foreground .info .promo {
    margin: 0px 0 20px 0;
    display: none;
}

.cart-modal .container .relative .bg .container .body .promos .background {
    
}

.cart-modal .container .relative .bg .container .body .promos .background i {
    font-size: 150px;
    color: #ff728c;
    right: -50px;
    position: absolute;
    top: 15px;
}

.bottom-menu-modal > .container > .bg .action {
    position: absolute;
    top: 9px;
    right: 10px;
}

.bottom-menu-modal > .container > .bg .action .input-btn {
    display: inline-block;
    margin: auto;
    padding: 8px 15px;
    border: 1px solid #8d7399;
    color: #896b97;
    border-radius: 20px;
    font-weight: 500;
    cursor: pointer;
    background-color: white;
    font-size: 15px;
}

.comparison-promo {
    background-color: white;
    padding: 15px 15px 0px 15px;
    margin-left: -15px;
    margin-right: -15px;
    border: none;
}

.comparison-promo .container {
    border-bottom: 1px solid #dbdbdb;
    padding-bottom: 20px;
}

.comparison-promo .store-title {
    display: table;
    width: 100%;
    margin-bottom: 8px;
}

.comparison-promo .store-title img {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    border: 1px solid #e1e1e1;
    margin-top: 3px;
    float: left;
}

.comparison-promo .store-title .info {
    margin-top: 1px;
    float: left;
    margin-left: 7px;
}

.comparison-promo .store-title .info .top {
    height: 16px;
}

.comparison-promo .store-title .info .top .promo-post {
    height: 18px;
}

.comparison-promo .store-title .info .top .promo-post span {
    text-transform: uppercase;
    color: #332FAC;
    font-weight: 900;
    font-size: 14px;
    float: left;
    margin-right: 5px;
}

.comparison-promo .store-title .info .top .promo-post .standard {
    color: #332FAC;
}

.comparison-promo .store-title .info .top .promo-post .fa-tags {
    font-size: 10px;
    color: #332FAC;
    float: left;
    margin-top: 3px;
}

.comparison-promo .store-title .info .top .promo-post .exclusive {
    color: #ffc107;
}

.comparison-promo .store-title .info .top .promo-post .fa-star {
    font-size: 11px;
    color: #ffc107;
    float: left;
    margin-top: 2px;
}

.comparison-promo .store-title .info .user-promo {
    margin-top: -3px;
    display: block;
    float: left;
}

.comparison-promo .store-title .info .user-promo .store-user {
    font-size: 13px;
    color: gray;
    display: inline-block;
    font-family: "Space Mono", monospace;
    text-transform: uppercase;
}

.comparison-promo .promo {
    margin-bottom: 0;
    overflow: hidden;
}

.comparison-promo .promo-exclusive .image {
    width: 100%;
    border-top-right-radius: 15px;
    border-top-left-radius: 15px;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
    margin-bottom: 0;
    margin-bottom: -4px;
    background-color: #e3e3e3;
    overflow: hidden;
    position: relative;
    height: 180px;
    float: initial;
    margin-left: 0;
    border: none;
    text-align: initial;
}

.comparison-promo .promo-exclusive .img {
    width: 110% !important;
    margin-bottom: -4px;
    margin-left: -10px;
    -webkit-filter: blur(10px);
}

.comparison-promo .promo-exclusive .profile {
    height: 80px;
    width: 80px;
    border-radius: 50%;
    border: 3px solid white;
    position: absolute;
    top: 110px;
    left: 15px;
    background-color: white;
}


.comparison-promo .promo-exclusive .footer {
    background: initial;
    padding: 0;
}

.comparison-promo .img-rounded {
    border-radius: 10px;
}


.cart-modal .container .relative .bg .container .body .shipping .items {
    padding-top: 30px;
}

.cart-modal .container .relative .bg .container .body .shipping .items .item {
    padding-bottom: 25px;
    border-bottom: 1px solid #DBDBDB;
    margin-bottom: 25px;
}

.cart-modal .container .relative .bg .container .body .shipping .items .item:last-child {
    border-bottom: none;
    margin-bottom: 0;
}

.cart-modal .container .relative .bg .container .body .shipping .items .item .container {
    display: flex;
}

.cart-modal .container .relative .bg .container .body .shipping .items .item .left-col {
    width: 150px;
    padding-right: 10px;
}

.cart-modal .container .relative .bg .container .body .shipping .items .item .left-col .profile {
    width: 100px;
    border-radius: 10px;
}

.cart-modal .container .relative .bg .container .body .shipping .items .item .right-col {
    width: 100%;
}

.cart-modal .container .relative .bg .container .body .shipping .items .item .right-col .info {
    display: flex;
    flex-direction: column;
}

.cart-modal .container .relative .bg .container .body .shipping .items .item .right-col .info .brand {
    
}

.cart-modal .container .relative .bg .container .body .shipping .items .item .right-col .info .brand a {
    font-family: "Space Mono", sans-serif;
    display: block;
    line-height: 16px;
    color: #5C5C5C;
    text-transform: uppercase;
    margin-bottom: 4px;
}

.cart-modal .container .relative .bg .container .body .shipping .items .item .right-col .info .name {
    
}

.cart-modal .container .relative .bg .container .body .shipping .items .item .right-col .info .name a {
    font-weight: 200;
    line-height: 20px;
    margin-bottom: 5px;
    font-size: 18px;
    display: block;
}

.cart-modal .container .relative .bg .container .body .shipping .items .item .right-col .info .version {
    margin-bottom: 10px;
}

.cart-modal .container .relative .bg .container .body .shipping .items .item .right-col .info .version .bg {
    background-color: #fff1ec;
    border: 1px solid #ffd1d1;
    padding: 1px 11px;
    border-radius: 10px;
    display: inline-block;
}

.cart-modal .container .relative .bg .container .body .shipping .items .item .right-col .info .version .bg span {
    color: #FFA3A3;
    font-size: 14px;
    margin: 3px 0 3px 0;
    display: block;
}

.cart-modal .container .relative .bg .container .body .shipping .items .item .right-col .price {
    display: flex;
    flex-direction: column;
    padding: 0 0 0 0;
}

.cart-modal .container .relative .bg .container .body .shipping .items .item .right-col .price .initial-price {
    display: flex;
    margin-bottom: 3px;
}

.cart-modal .container .relative .bg .container .body .shipping .items .item .right-col .price .initial-price .container {
    position: relative;
    display: flex;
    width: 85px;
}

.cart-modal .container .relative .bg .container .body .shipping .items .item .right-col .price .initial-price .container-thou {
    width: 100px;
}

.cart-modal .container .relative .bg .container .body .shipping .items .item .right-col .price .initial-price .container .currency {
    color: #bcbcbc;
    font-size: 14px;
    width: 8px;
    margin-top: 3px;
}

.cart-modal .container .relative .bg .container .body .shipping .items .item .right-col .price .initial-price .container .amount {
    color: #bcbcbc;
    font-weight: 900;
    width: 48px;
    text-align: right;
    font-size: 20px;
}

.cart-modal .container .relative .bg .container .body .shipping .items .item .right-col .price .initial-price .container-thou .amount {
    width: 72px;
}

.cart-modal .container .relative .bg .container .body .shipping .items .item .right-col .price .initial-price .container .cents {
    color: #bcbcbc;
    font-size: 14px;
    width: 20px;
    margin-top: 2px;
    margin-left: 2px;
}

.cart-modal .container .relative .bg .container .body .shipping .items .item .right-col .price .initial-price .container .cross {
    position: absolute;
    width: 100%;
    height: 1px;
    background-color: #bcbcbc;
    top: 9px;
    padding: 0px;
}

.cart-modal .container .relative .bg .container .body .shipping .items .item .right-col .price .initial-price .text {
    margin-left: 13px;
}

.cart-modal .container .relative .bg .container .body .shipping .items .item .right-col .price .initial-price .initial {
    color: #939393;
    font-size: 14px;
}

.cart-modal .container .relative .bg .container .body .shipping .items .item .right-col .price .final-price {
    display: flex;
}

.cart-modal .container .relative .bg .container .body .shipping .items .item .right-col .price .final-price .container {
    width: 80px;
}

.cart-modal .container .relative .bg .container .body .shipping .items .item .right-col .price .final-price .container-thou {
    width: 105px;
}

.cart-modal .container .relative .bg .container .body .shipping .items .item .right-col .price .final-price .container .currency {
    font-size: 14px;
    width: 8px;
    margin-top: 4px;
    margin-right: 7px;
}

.cart-modal .container .relative .bg .container .body .shipping .items .item .right-col .price .final-price .container .amount {
    font-size: 24px;
    font-weight: 900;
    text-align: right;
    width: 42px;
}

.cart-modal .container .relative .bg .container .body .shipping .items .item .right-col .price .final-price .container-thou .amount {
    width: 65px;
}

.cart-modal .container .relative .bg .container .body .shipping .items .item .right-col .price .final-price .container .cents {
    font-size: 14px;
    margin-left: 3px;
    margin-top: 3px;
}

.cart-modal .container .relative .bg .container .body .shipping .items .item .right-col .price .savings-price {
    display: flex;
    margin: 0 0 5px 0;
}

.cart-modal .container .relative .bg .container .body .shipping .items .item .right-col .price .savings-price .container {
    position: relative;
    display: flex;
    width: 85px;
}

.cart-modal .container .relative .bg .container .body .shipping .items .item .right-col .price .savings-price .container-thou {
    width: 105px;
}

.cart-modal .container .relative .bg .container .body .shipping .items .item .right-col .price .savings-price .container .currency {
    color: #68529a;
    font-size: 14px;
    width: 16px;
    margin-top: 3px;
}

.cart-modal .container .relative .bg .container .body .shipping .items .item .right-col .price .savings-price .container .amount {
    color: #68529a;
    font-weight: 900;
    width: 42px;
    text-align: right;
    font-size: 20px;
}

.cart-modal .container .relative .bg .container .body .shipping .items .item .right-col .price .savings-price .container-thou .amount {
    width: 72px;
}

.cart-modal .container .relative .bg .container .body .shipping .items .item .right-col .price .savings-price .container .cents {
    color: #68529a;
    font-size: 14px;
    width: 20px;
    margin-top: 2px;
    margin-left: 2px;
}

.cart-modal .container .relative .bg .container .body .shipping .items .item .right-col .price .savings-price .text {
    margin-left: 5px;
    margin-top: -2px;
}

.cart-modal .container .relative .bg .container .body .shipping .items .item .right-col .price .savings-price .text .savings {
    background-color: #e1d7e9;
    font-size: 14px;
    padding: 3px 8px;
    border-radius: 4px;
    color: #55406a;
    font-weight: 500;
    font-size: 14px;
    display: block;
    text-align: center;
}

.cart-modal .container .relative .bg .container .body .shipping .items .item .right-col .price .no-price {
    
}

.cart-modal .container .relative .bg .container .body .shipping .items .item .right-col .price .promo-btn-container {
    text-align: center;
    display: flex;
    margin-top: 10px;
    margin-bottom: 5px;
}

.cart-modal .container .relative .bg .container .body .shipping .items .item .right-col .price .promo-btn-container .promo-btn {
    background-color: #FFF0C4;
    padding: 5px 10px;
    font-size: 12px;
    border-radius: 20px;
    font-weight: 500;
    border: 1px solid #D9B036;
    color: #7B6011;
    cursor: pointer;
}

.cart-modal .container .relative .bg .container .body .shipping .items .item .right-col .price .promo-btn-container .promo-btn i {
    color: #7B6011;
    font-size: 11px;
}

.cart-modal .container .relative .bg .container .body .shipping .items .item .right-col .price .promo-btn-container .promo-get-y {
    background: linear-gradient(111deg, #ff5171 0%, #ea2549 100%);
    color: white;
    border: none;
    border-radius: 5px;
    font-weight: 900;
    padding: 5px 10px;
    font-size: 14px;
    margin-top: -10px;
}

.cart-modal .container .relative .bg .container .body .shipping .items .item .right-col .availability {
    margin-bottom: 10px;
}

.cart-modal .container .relative .bg .container .body .shipping .items .item .right-col .availability .available {
    color: #007000;
    font-size: 13px;
}

.cart-modal .container .relative .bg .container .body .shipping .items .item .right-col .availability .unavailable {
    color: red;
    font-size: 13px;
}

.cart-modal .container .relative .bg .container .body .shipping .items .item .right-col .actions {
    display: flex;
}

.cart-modal .container .relative .bg .container .body .shipping .items .item .right-col .actions .col {
    margin-right: 15px;
}

.cart-modal .container .relative .bg .container .body .shipping .items .item .right-col .actions .col .btn-md-wide {
    padding: 10px 20px;
}

.cart-modal .container .relative .bg .container .body .shipping .items .item .promos {
    display: none;
}

.cart-alerts {
    position: fixed;
    left: 0;
    right: 0;
    z-index: 200;
}

.cart-alert {
    width: 100%;
    position: fixed;
    top: 0;
    overflow-y: scroll;
    overflow-x: hidden;
    z-index: 100;
    animation-duration: 600ms;
    display: none;
}

.cart-alert .container {
    padding: 15px;
    display: flex;
}

.cart-alert .container .bg {
    overflow: hidden;
    max-width: 360px;
    margin: auto;
    background-color: #FF5072;
    color: #ffffff;
    padding: 15px;
    border-radius: 15px;
    font-weight: 500;
    display: inline-block;
    box-shadow: -3px 3px 5px #0000001a;
    width: 100%;
}

.cart-alert .container .bg .header {
    border-bottom: 1px solid #ffffff;
    margin-bottom: 15px;
    padding-bottom: 15px;
    text-align: center;
}

.cart-alert .container .bg .header i {
    color: white;
    margin-right: 5px;
}

.cart-alert .container .bg .header span {
    font-weight: 900;
    color: white;
}

.cart-alert .container .bg .body {
    
}

.cart-alert .container .bg .body .item {
    display: flex;
}

.cart-alert .container .bg .body .item .col-img {
    width: 80px;
    position: relative;
}

.cart-alert .container .bg .body .item .col-img img {
    width: 60px;
    border-radius: 8px;
    height: 60px;
    background-color: white;
    object-fit: cover;
}

.cart-alert .container .bg .body .item .col-img .quantity {
    position: absolute;
    width: 25px;
    height: 25px;
    background-color: #ff9e9e;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    bottom: 20px;
    right: -12px;
}

.cart-alert .container .bg .body .item .col-img .quantity span {
    color: white;
    font-weight: 900;
    font-size: 15px;
}

.cart-alert .container .bg .body .item .col-info {
    width: 100%;
    padding-left: 20px;
}

.cart-alert .container .bg .body .item .col-info .brand {
    font-family: "Space Mono", sans-serif;
    display: block;
    line-height: 16px;
    color: white;
    text-transform: uppercase;
    margin-bottom: 4px;
}

.cart-alert .container .bg .body .item .col-info .name {
    font-weight: 400;
    line-height: 20px;
    margin-bottom: 5px;
    font-size: 18px;
    display: block;
    color: white;
}

.cart-alert .container .bg .body .item .col-info .version {
    background-color: #ffffff;
    padding: 1px 11px;
    border-radius: 10px;
    display: inline-block;
}

.cart-alert .container .bg .body .item .col-info .version span {
    color: #ff5071;
    font-size: 14px;
    margin: 3px 0 3px 0;
    display: block;
}

.cart-alert .container .bg .action {
    margin-top: 20px;
}

.cart-alert .container .bg .action .wide-btn {
    border-radius: 10px;
    display: block;
    text-align: center;
    padding: 10px 0;
    font-weight: 500;
    background-color: #ff5071;
    width: 100%;
    cursor: pointer;
    color: white;
    border: 1px solid white;
}

.bottom-menu-modal > .container > .bg .button-box > button > div > .circle-active {
    background-color: white;
    width: 15px;
    height: 15px;
    border-radius: 50%;
    margin-left: 5px;
    border: 2px solid #a1a1a1;
    display: flex;
    align-items: center;
    justify-content: center;
}

.bottom-menu-modal > .container > .bg .button-box > button > div > .circle-active .inner-active {
    background-color: #a1a1a1;
    width: 10px;
    height: 10px;
    border-radius: 50%;
}

.cart-modal .updating {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    background-color: #ffffffd4;
    overflow-y: scroll;
    height: 100vh;
    display: none;
    z-index: 33;
}

.cart-modal .updating .container {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100vh;
}

.cart-modal .updating .container .lds-ellipsis-container {
    text-align: center;
    padding-top: 0;
    margin-top: -140px;
}

.cart-modal .policies {
    padding: 0px 4px 50px 5px;
}

.cart-modal .policies span {
    color: #A2A2A2;
    font-size: 14px;
    display: block;
    line-height: 20px;
}

.cart-modal .policies span a {
    color: #472B88;
    font-size: 14px;
}

/* User Modal */

.user-modal {
    width: 100%;
    height: 100%;
    position: fixed;
    bottom: 0;
    overflow-y: scroll;
    overflow-x: hidden;
    z-index: 60;
    animation-duration: 600ms;
    display: none;
    right: 0;
}

.user-modal > .container {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
}

.user-modal .container .relative {
    position: relative;
    overflow: hidden;
    height: 100%;
}


.user-modal .container .relative .bg {
    background-color: #f0eef3;
    overflow-y: scroll;
    height: 100vh;

}

.user-modal .lds-ellipsis-container {
    text-align: center;
    padding-top: 100px;
}

.notifications {
    background-color: #f0eef3;
    height: 100%;
    display: block;
    width: 100%;
}

.notif-header {
    position: relative;
    text-align: center;
    width: 100%;
    height: 50px;    
    background-color: white;
}

.notif-header .user {
    left: 0;
    position: absolute;
    height: 50px;
    width: 60px;
    margin-left: 5px;
    z-index: 10;
}

.notif-header .user img {
    width: 35px;
    height: 35px;
    margin-top: 9px;
    border-radius: 50%;
    margin-left: -11px;
    object-fit: cover;
}

.notif-header .title {
    margin-top: 16px;
    position: absolute;
    left: 0;
    right: 0;
}

.notif-header .title span {
    font-weight: 900;
    color: #565656;
    font-size: 20px;
}

.notif-header .menu {
    right: 50px;
    position: absolute;
    height: 50px;
    width: 40px;
    display: none;
    height: 100%;
    cursor: pointer;
}

.notif-header .menu i {
    color: #dfd7e6;
    margin-top: 19px;
}

.notif-header .close {
    border-radius: 50%;
    right: 8px;
    top: 9px;
    position: absolute;
    z-index: 40;
    width: 40px;
    height: 40px;
    cursor: pointer;
}

.notif-header .close i {
    font-size: 28px;
    color: #dfd7e6;
}

.notifications .tw-menu {
    background-color: white;
}

.notifications .tw-menu > .container > .btn-container > .btn > a > span, .tw-menu > .container > .btn-container > .btn > span > span {
    /*font-size: 16px !important;*/ 
}

/* twitter menu */

.section-menu-container {
    height: 40px;
    background-color: white;
    /*padding-top: 3px;*/
}

.tw-menu {
    position: relative;
    background-color: white;
    border-bottom: 1px solid #ebebeb;
    height: 40px;
}

.tw-menu-white {
    margin-bottom: 8px;
}

.tw-menu-empty {
    height: 10px;
    width: 100%;
}

.tw-menu .container {
    display: inline-block;
    width: 100%;
    overflow: auto;
    white-space: nowrap;
    -webkit-overflow-scrolling: touch;
    overflow-y: hidden;    
}

.tw-menu .container > .white-gap {
    width: 15px;
    height: 10px;
    display: inline-block;
}

.tw-menu .container > .white-gap-end {
    width: 65px;
    height: 10px;
    display: inline-block;
}

.tw-menu .container > .btn-container-col {
    display: inline-block;
    width: 50%;
    text-align: center;
    cursor: pointer;
}

.tw-menu .container > .btn-container {
    display: inline-block;
    padding: 0 3px;
}

.tw-menu .container .btn-container-col > .btn-container {
    width: 100px;
    margin: auto;
}

.tw-menu-white > .container > .btn-container {
    padding: 0 2px;
}

.tw-menu .container > .btn-container > .btn, .tw-menu .container .btn-container-col .btn-container > .btn {
    padding: 8px 8px 8px 8px;
    border-radius: 10px;
    cursor: pointer;
}

.tw-menu .container > .btn-container > .btn > .tw-menu-btn, .tw-menu .container > .btn-container-col .btn-container > .btn > .tw-menu-btn {
    font-weight: 900;
    color: #b1aab5;    
}

.tw-menu .container > .btn-container > .btn > .tw-menu-btn > span, 
.tw-menu .container > .btn-container-col .btn-container > .btn > .tw-menu-btn > span {
    font-weight: 900;
    color: #b1aab5;
    display: inline-block;
    font-size: 18px
}

.tw-menu .container > .btn-container > .btn > .tw-menu-btn > span i,
.tw-menu .container > .btn-container-col .btn-container > .btn > .tw-menu-btn > span i {
    color: #b1a9b5;
}

.tw-menu-white > .container > .btn-container > .btn > .tw-menu-btn > span, .tw-menu-white > .container > .btn-container-col .btn-container > .btn > .tw-menu-btn > span {
    font-weight: 900;
    color: #b1aab5;
    display: inline-block;
    font-size: 18px;
}

.tw-menu .container > .btn-container > .btn > .tw-menu-btn > div, .tw-menu .container > .btn-container > .btn > span > div, .tw-menu .container > .btn-container-col .btn-container > .btn > .tw-menu-btn > div, .tw-menu .container > .btn-container-col .btn-container > .btn > span > div {
    background-color: #FF5072;
    border-radius: 50%;
    height: 17px;
    width: 17px;
    text-align: center;
    display: inline-block;
    margin-left: 4px;
    position: relative;
    margin-top: 3px;
    float: right;
}

.tw-menu .container > .btn-container > .btn > .tw-menu-btn > div > span, .tw-menu .container > .btn-container > .btn > span > div > span, .tw-menu .container > .btn-container-col .btn-container > .btn > .tw-menu-btn > div > span, .tw-menu .container > .btn-container-col .btn-container > .btn > span > div > span {
    font-size: 13px;
    color: white;
    font-weight: 900;
    margin-top: 2px;
    position: absolute;
    top: -1px;
    right: 0;
    letter-spacing: -1px;
    left: -1px;
}

.tw-menu .container > .btn-container > .btn > .active > span, .tw-menu .container > .btn-container-col .btn-container > .btn > .active > span {
    color: #ff9e9e;
    font-weight: 900;
}

.tw-menu-notif > .container > .btn-container > .btn > .active > span,
.tw-menu-notif > .container > .btn-container > .btn > .active > span i {
    color: #ff9e9e !important;
}

.tw-menu-notif > .container > .btn-container .underline {
    background-color: #ff9e9e !important;
}

.tw-menu .container > .btn-container .underline-placeholder .underline, .tw-menu .container > .btn-container-col .btn-container .underline-placeholder .underline {
    height: 3px;
    display: block;
}

.tw-menu-home {
    background-color: white;
    height: 43px;
}

.tw-menu-home > .container {
    width: 100%;
}

.tw-menu-home > .container > .btn-container-col .btn-container > .btn {
    padding: 13px 8px 10px 8px;
}

.tw-menu-home .container-padding {
    padding: 3px 15px 0 15px;
}

.user-notification {
    background-color: white;
    padding: 10px 10px 15px 10px;
    margin-bottom: 7px;
    cursor: pointer;
}

.user-notification .top-row {
    display: table;
    width: 100%;
}

.user-notification .top-row .user-img {
    height: 20px;
    width: 20px;
    border-radius: 50%;
    float: left;
    border: 1px solid white;
    object-fit: cover;
}

.user-notification-accessed .top-row .user-img {
    opacity: 0.5;
}

.user-notification .top-row .info {
    padding-left: 26px; 
}

.user-notification .top-row .info .text {
    font-size: 16px;
    line-height: 20px;
    display: block;
    color: #5a5a5a;
}

.user-notification .top-row .info .text .red {
    color: #FF5072;
}

.user-notification-accessed .top-row .info .text,
.user-notification-accessed .top-row .info .text strong {
    color: #A3A3A4;
}

.user-notification-accessed .top-row .info .promo-banner img {
    opacity: 0.4;
}

.user-notification .top-row .info .text .brand {
    font-family: "Space Mono", sans-serif;
    font-size: 12px;
    font-weight: 900;
    text-transform: uppercase;
    margin-top: 4px;
    background-color: #676767;
    border-radius: 10px;
    padding: 0px 6px;
    color: white;
    margin-right: 2px;
}

.user-notification-accessed .top-row .info .text .brand {
    background-color: #A3A3A4;
}

.user-notification-accessed .btn-md {
    color: #c7c7c7;
    border: 1px solid #c3c3c3;
}

.user-notification .top-row .info .text .brand i {
    font-size: 10px;
    margin-left: -4px;
    margin-top: 3px;
    color: white;
}

.user-notification .top-row .info .promo-banner {
    width: 100%;
    min-height: 117px;
    border-radius: 15px;
    margin-bottom: 10px;
    margin-top: 8px;
    max-width: 320px;
    background-color: #e2e2e2;
    overflow: hidden;
}

.user-notification .top-row .info .promo-banner img {
    width: 100%;
    margin-bottom: -4px;
}

.user-notification .source-row {
    display: table;
    padding-left: 25px;
    margin-top: 7px;
}

.user-notification .source-row .source {
    color: #A3A3A4;
}

.user-notification .source-row .source .profile-picture {
    height: 20px;
    width: 20px;
    border-radius: 50%;
    float: left;
    border: 1px solid #dddddd;
}

.user-notification-accessed .source-row .source .profile-picture {
    opacity: 0.5;
}

.user-notification .source-row .source .community {
    font-size: 14px;
    font-weight: 900;
    color: #3d3d3d;
    float: left;
    margin-top: 3px;
    margin-left: 3px;
}

.user-notification .source-row .source .brand {
    font-family: "Space Mono", sans-serif;
    text-transform: uppercase;
    font-size: 14px;
    font-weight: 900;
    color: #3d3d3d;
    float: left;
    margin-left: 3px;
}

.user-notification-accessed .source-row .source .community, .user-notification-accessed .source-row .source .brand {
    color: #A3A3A4;
}

.user-notification .source-row > .product, .user-notification .source-row > .brand {
    background-color: #eff2f7;
    padding: 5px 10px 5px 7px;
    border-radius: 10px;
    display: inline-flex;
    margin-right: 2px;
    max-width: 150px;
    height: 28px;
}

.user-notification .source-row .product .profile, .user-notification .source-row > .brand .profile {
    height: 25px;
    width: 25px;
    border-radius: 50%;
    float: left;
    border: 1px solid white;
    margin-top: 1px;
}

.user-notification .source-row .product .info, .user-notification .source-row > .brand .info {
    padding-left: 5px;
    max-width: 120px;
}

.user-notification .source-row .product .info .brand {
    font-family: "Space Mono", sans-serif;
    font-size: 12px;
    font-weight: 900;
    display: block;
    color: #6375AE;
    text-transform: uppercase;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    margin-bottom: -3px;
}

.user-notification .source-row .product .info .name {
    font-size: 12px;
    color: #6375AE;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
}


.user-notification .source-row .brand .info .name {
    font-family: "Space Mono", sans-serif;
    font-weight: 900;
    text-transform: uppercase;
    font-size: 12px;
    color: #6375AE;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    margin-top: 6px;
}

.user-notification .biutesting-user-source {
    display: flex;
    padding-left: 25px;
    margin-bottom: 10px;
    padding-right: 20px;
}

.user-notification .biutesting-user-source .container {
    display: flex;
    align-items: center;
    background-color: #f0f2f6;
    padding: 7px;
    border-radius: 10px;
    width: 100%;
}

.user-notification .biutesting-user-source .container img {
    width: 50px;
    height: 50px;
    border-radius: 5px;
    object-fit: cover;
}

.user-notification .biutesting-user-source .container .info {
    padding-left: 10px;
}

.user-notification .biutesting-user-source .container .info .type {
    display: block;
    font-size: 13px;
    color: gray;
}

.user-notification .biutesting-user-source .container .info .name {
    font-size: 14px;
    font-weight: 900;
    color: #3d3d3d;
    float: left;
    margin-top: 0px;
}

.user-notification .comment-row {
    padding-left: 25px;
    margin-top: 5px;
}

.user-notification .comment-row .notification-body, .user-notification .comment-row .notification-body p {
    font-size: 14px;
    color: #707070;
}

.user-notification .comment-row .notification-question-body, .user-notification .comment-row .notification-question-body p {
    font-size: 16px;
    color: #636363;
    display: inline-block;
    line-height: 20px;
}

.user-notification .comment-row .notification-question-body strong, .user-notification .comment-row .notification-question-body p strong {
    font-size: 16px;
    color: #A3A3A4;
}

.user-notification-accessed .comment-row .notification-question-body, .user-notification-accessed .comment-row .notification-question-body p {
    color: #A3A3A4;
}

.user-notification .comment-row .notification-comment .body ol, .user-notification .comment-row .notification-comment .body ul {
    padding-left: 20px;
    margin-bottom: 10px;
}

.user-notification .comment-row .notification-comment .body li {
    font-size: 16px;
    margin-bottom: 2px;
}

.user-notification .comment-row .notification-comment .body a {
    font-size: 16px;
    color: #2196F3;
}

.user-notification .comment-row .notification-comment .body strong, .comment .body em {
    font-size: 16px;
}

.user-notification .comment-row .notification-comment .body blockquote, .cke_editable blockquote {
    font-style: italic;
    padding: 2px 0;
    border-style: solid;
    border-color: #ccc;
    border-width: 0;
    padding-left: 15px;
    padding-right: 8px;
    border-left-width: 5px;
    display: block;
    margin-top: 25px;
    margin-bottom: 25px;
    margin-left: 15px;
    line-height: 18px;
}

.user-notification .comment-row .notification-comment .body blockquote > p, .cke_editable blockquote > p {
    font-size: 15px
}

.user-notification .comment-row .created-at {
    font-size: 12px;
    color: #A3A7A8;
    margin-top: 7px;
    display: block;
}

.container-recommended-results .question-notif-container .question-notif-card{
    min-height: 255px;
}

.container-recommended-results .review-notif-container .review-notif-card {
    min-height: 215px;
}

#notifications-container .pagination a,
#notifications-container .pagination span {
    color: #e6eaeb;
}

.header-banner {
    background-color: #a0f0f7;
    z-index: 12;
    position: relative;
    min-height: 77px;
}

.header-banner .header-banner-carousel {
    
}

.header-banner .header-banner-banner {
    width: 100%;
}

.header-banner .header-banner-banner .header-banner-container {
    padding: 10px 37px;
    display: flex;
    justify-content: center;
    text-align: center;
    min-height: 38px;
    align-items: center;
}

.header-banner .header-banner-banner .header-banner-container .header-banner-span {
    color: #006670;
    font-weight: 900;
}

.header-banner .flickity-prev-next-button {
    width: 24px;
    height: 24px;
    top: 30px;
    background: #a0f0f7;
}

.header-banner .flickity-prev-next-button .flickity-button-icon {
    fill: #38abb7;
}

@media (min-width: 360px) {

    .community-row > .info-col > .top-col {
        width: 175px;
    }

    .tw-menu .container .btn-container-col > .btn-container { width:145px; }
}

@media (min-width: 375px) {

    .community-row > .info-col > .top-col {
        width: 191px;
    }

    .tw-menu .container .btn-container-col > .btn-container { width:145px; }
    .header-banner { min-height: 58px; }
    .biucredits-summary-container .biucredits .right .btn-sm { margin-right: 10px; }

}

@media (min-width: 414px) {

    .community-row > .info-col > .top-col {
        width: 230px;
    }

    .section-menu-container {
        height: 44px;
    }    

    .tw-menu {
        height: 44px;
    }

    .tw-menu-home {
        height: 47px;
    }

    .tw-menu-home .container-padding {
        padding: 3px 15px 0 15px;
    }    

    .tw-menu .container > .btn-container > .btn, 
    .tw-menu .container .btn-container-col .btn-container > .btn {
        padding: 8px 8px 9px 8px;
    }

    .tw-menu .container > .btn-container > .btn > .tw-menu-btn > span, .tw-menu .container > .btn-container-col .btn-container > .btn > .tw-menu-btn > span {
        font-size: 20px;
    }    

    .tw-menu .container .btn-container-col > .btn-container { width:160px; }

    .tw-menu .container > .btn-container-col .btn-container > .btn > .tw-menu-btn > span i {
        font-size: 20px;
        margin-right: 3px;
    }        
}

@media (min-width: 680px) {
    
    .tw-menu .container > .btn-container > .btn:hover, 
    .tw-menu .container .btn-container-col .btn-container > .btn:hover {
        background-color: #fff5f5;
    }

    .tw-menu .container .btn-container-col .btn-container > .btn:hover > .tw-menu-btn > span,
    .tw-menu .container .btn-container-col .btn-container > .btn:hover > .tw-menu-btn > span i,
    .tw-menu .container > .btn-container > .btn:hover > .tw-menu-btn span,
    .tw-menu .container > .btn-container > .btn:hover > .tw-menu-btn span i {
        color: #ff9e9e;
    }

    .select-community-to-post .container .relative .bg .container .wrapper .title .field, #full-screen-modal .container .relative .bg .container .wrapper .title .field {
        font-size: 15px;
    }

    .brand-card-search {
        width: 33%;
        float: left;
    }

    .brand-card-search .container {
        position: relative;
        overflow: hidden;
    }

    .ais-Hits-item:nth-child(2n+1) .brand-card-search .container {
        padding-right: 0px;
    }

    .ais-Hits-item:nth-child(2n+2) .brand-card-search .container {
        padding-left: 0px;
    }    

    .ais-Hits-item:nth-child(3n+1) .brand-card-search .container {
        padding-right: 7px;
    }

    .ais-Hits-item:nth-child(3n+2) .brand-card-search .container {
        padding-left: 7px;
        padding-right: 7px;
    }    

    .ais-Hits-item:nth-child(3n+3) .brand-card-search .container {
        padding-left: 7px;
    }    

    .brand-card-search:hover .info,
    .brand-card-search:hover .footer,
    .brand-card-search:hover .footer div {
        background-color: #faf5f3;
    }

    .user-modal {
        z-index: 62;
    }

    .user-modal .container .relative .bg {
        border-radius: 15px;
    }

    .community-row {
        padding: 10px;
        border-radius: 10px;
    }    

    .community-row:hover {
        background-color: #f2f2f2;
    }

    .recommended-to-user .section-title .icon-box i {
        font-size: 19px;
    }

    .recommended-to-user .section-title .title {
        font-size: 20px;
    }

    .recommended-to-user .section-title-margin-sm {
        margin-bottom: 15px;
    }

    .tw-menu {
        height: 43px;
    }    

    .tw-menu-home {
        height: 47px;
    }

    .tw-menu-white {
        border-bottom: none;
    }

    .cart-modal {
        width: 30%;
        max-width: 420px;
        right: 0;
    }

    .cart-modal .container .relative .bg .container .body .shipping .items .item .left-col {
        width: 160px;
    }

    .cart-modal .container .relative .bg .container .body .shipping .items .item .left-col .profile {
        width: 110px;
    }

    .header-banner-mobile {
        display: none;
    }

    .cart-modal .container .relative .bg .container .pay-btn-box {
        height: 76px;
    }

}

@media (min-width: 780px) {

    .tw-menu .container .btn-container-col > .btn-container { width: 120px;}

}


@media (min-width: 960px) {

    .tw-menu .container .btn-container-col > .btn-container { width: 140px;}

}





/* select product */

.wrapping {
    margin-top: 50px;
}

.user-content {

}

.user-content .product-headline {
    height: 35px;
    position: fixed;
    width: 100%;
    top: 0;
    z-index: 5;
    background-color: #ffa3a3;
    display: none;
    overflow: hidden;
}

.user-content .product-headline .container {
    display: table;
    margin: auto;
}

.user-content .product-headline .container .brand-name {
    font-family: "Space Mono", sans-serif;
    font-size: 14px;
    float: left;
    margin: 7px 0px 0 7px;
    color: white;
}

.user-content .product-headline .container .not-brand-name {
    font-size: 14px;
    font-weight: 900;
    float: left;
    margin: 10px 0px 0 7px;
    color: white;
}

.user-content .product-headline .container .version {
    display: inline-block;
    margin-top: 9px;
    margin-left: 8px;
}

.user-content .product-headline .container .version .bg {
    background-color: white;
    border: 1px solid white;
    padding: 1px 5px;
    border-radius: 10px;
}

.user-content .product-headline .container .version .bg .txt {
    color: #ffa3a3;
    font-size: 12px;
    margin: 0px 0 -1px 0;
    display: block;
    font-weight: 500;
    display: none;
}

.user-content .product-headline .container .version .bg .selected {
    display: block;
}

.user-content .product-relative > .header {
    background: linear-gradient(111deg, #2d1974 0%, #cd8aed 100%);
}

.user-content .fixed {
    position: fixed;
    width: 100%;
    top: 0;
    z-index: 7;
}

.user-content .product-relative {
    position: relative;
    width: 100%;
    z-index: 7;
}

.user-content .product-relative > .header {
    height: 50px;
}

.user-content .header .container {
    text-align: center;
    position: relative;
    height: 50px;
}

.user-content .header a {
    position: absolute;
    right: 15px;
    top: 13px;
    color: white;
}

.user-content .header a i {
    font-size: 26px;
    color: white;
}

.user-content .header span {
    font-size: 18px;
    font-weight: 900;
    display: block;
    padding-top: 15px;
    color: white;
}

.user-content .header span i {
    font-size: 18px;
    margin-left: 3px;
    color: white;
}

.user-content .search {
    background-color: white;
    z-index: 1;
    overflow-y: scroll;
    height: 130px;
    padding: 15px 15px 0 15px;
    top: 50px;
}

.user-content .search .search-input {
    position: relative;
    margin-bottom: 10px;
}

.user-content .search .search-input i {
    color: #BFBFBF;
    font-size: 18px;
    position: absolute;
    top: 17px;
    left: 10px;
    z-index: 1;
}

.user-content .search .search-input .ais-SearchBox-input {
    background-color: #F7F7F7;
    border: none;
    padding: 16px 0 15px 40px;
    width: 100%;
}

.user-content > .select-product {
    position: relative;
    margin-top: 195px;
    overflow-y: scroll;
    padding: 0 15px 40px 15px;
}


/* select brand or product */

.new-content-section {
    padding: 0 15px 10px 15px;
    background-color: white;
}

.user-content .body .btns {
    display: table;
    width: 100%;
}

.user-content .body .btns .col {
    width: 50%;
    float: left;
}

.user-content .body .btns .col:nth-child(2n+1) .container {
    padding-right: 8px;
}

.user-content .body .btns .col:nth-child(2n+2) .container {
    padding-left: 8px;
}

.user-content .body .btns .col .container button {
    border-radius: 10px;
    padding: 15px;
    min-height: 250px;
}

.user-content .body .btns .col .container button div {

}

.user-content .body .btns .col .container button div .brand {
    height: 100px;
    width: 100px;
    border-radius: 50%;
    display: block;
    margin: auto;
    margin-bottom: 20px;
}

.user-content .body .btns .col .container button div .product {
    height: 110px;
    width: 110px;
    display: block;
    margin: auto;
    margin-bottom: 20px;
}

.user-content .body .btns .col .container button div span {
    font-weight: 900;
}

.user-content .body .content-subject {
    padding: 0px;
    display: table;
    width: 100%;
    margin-top: -5px;
}

.user-content .body .content-subject img {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    float: left;
    border: 1px solid lightgray;
}

.user-content .body .content-subject .info {
    padding-left: 65px;
}

.user-content .body .content-subject .name {
    font-weight: 900;
    display: block;
}

.user-content .body .content-subject .brand-name {
    font-family: "Space Mono", sans-serif;
    font-weight: 900;
    text-transform: uppercase;
    display: block;
}

.user-content .body .content-subject .type {
    color: #c7c7c7;
    font-size: 13px;
    font-weight: 900;
    display: block;
    margin: -2px 0 2px 0;
}

.user-content .body .content-subject .description {
    font-size: 11px;
    line-height: 14px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.user-content .body .content-subject .description-btn {
    font-size: 14px;
    line-height: 16px;
    display: block;
    color: gray;
}

.user-content .body .content-subject-product {
    margin-top: 0;
    padding: 10px 0 15px 0;
}

.user-content .body .content-subject-product img {
    width: 35px;
    height: 35px;
}

.user-content .body .content-subject-product .product {
    text-align: left;
    padding-left: 45px;
    margin-bottom: 5px;
    margin-top: -3px;
}

.user-content .body .content-subject-product .product .product-brand {
    font-family: "Space Mono", sans-serif;
    font-size: 15px;
    text-transform: uppercase;
    display: block;
    margin-bottom: -3px;
    margin-top: 1px;
}

.user-content .body .content-subject-product .product .product-name {
    font-family: "Roboto", sans-serif;
    margin-top: 9px;
    color: #6a6a6a;
}

.user-content .body .community-rules {
    position: absolute;
    right: 0;
    top: 27px;
    font-weight: 900;
    color: #a4a4a4;
    font-size: 14px;
    text-transform: uppercase;
    text-decoration: underline;
}

.send-btn-hidden, .input-hidden {
    display: none;
}

.container-search-results {
    display: none;
}


/* Posts From Brand */

.back-ribbon-brand {
    background-color: white;
    margin-bottom: 7px;
}

.back-ribbon-brand > .btn {
    width: 50px;
    float: left;
    height: 39px;
    text-align: center;
    padding-top: 16px;
}

.back-ribbon-brand > .btn > i {
    color: #B7B7B7;
    font-size: 24px;
}

.back-ribbon-brand > .brand {
    display: table;
    padding: 10px 0 10px 0;
}

.back-ribbon-brand > .brand > a > img {
    height: 35px;
    border-radius: 50%;
    float: left;
    margin-right: 10px;
}

.back-ribbon-brand > .brand > span {
    font-family: "Space Mono", monospace;
    font-size: 16px;
    color: #313131;
    -webkit-font-smoothing: antialiased;
    text-align: left;
    text-transform: uppercase;
    line-height: 34px;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
}

/* Posts From Community */

.back-ribbon-placeholder {
    height: 55px;
    width: 100%;
}

.back-ribbon-post {
    background-color: #ffa9a9;
    position: fixed;
    width: 100%;
    z-index: 90;
    top: 0;
}

.back-ribbon-post-show {
    position: relative;
    top: initial;
    height: 55px;
    z-index: 10;
}

.back-ribbon-post > .btn {
    width: 50px;
    float: left;
    height: 39px;
    text-align: center;
    padding-top: 16px;
    cursor: pointer;
}

.back-ribbon-post > .btn > i {
    color: white;
    font-size: 24px;
}

.back-ribbon-post > .source {
    padding: 11px 0 9px 0;
    min-height: 35px;
    display: none;
}

.back-ribbon-post > .source > .image img {
    height: 35px;
    width: 35px;
    border-radius: 50%;
    float: left;
    margin-right: 10px;
    margin-top: -1px;
}

.back-ribbon-article > .source > .image img {
    height: 35px;
    border-radius: 10px;
}

.back-ribbon-post > .source > .community {
    font-size: 16px;
    font-weight: 900;
    color: #313131;
    text-align: left;
    line-height: 34px;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.back-ribbon-post > .source > .brand {
    font-size: 16px;
    font-weight: 900;
    color: white;
    text-align: left;
    line-height: 34px;
    font-family: "Space Mono", sans-serif;
    text-transform: uppercase;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.back-ribbon-post > .source > .promos {
    font-size: 17px;
    font-weight: 900;
    color: #313131;
    text-align: left;
    line-height: 36px;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.back-ribbon-post .post-type {
    color: white;
    width: 100%;
    text-align: center;
    padding-top: 16px;
    font-weight: 900;
    font-size: 20px;
    margin-left: -50px;
}

.back-ribbon-post .post-type i {
    color: white;
    font-size: 14px;
}


/* Link */

.link {

}

.link .container {
    padding: 0 15px;
    min-height: 103px;
}

.link .container-full {
    padding: 0 15px;
}

.link .title {
    width: auto;
}

.link .title a, .link .title span {
    font-size: 20px;
    font-weight: 500;
    line-height: 22px;
    margin-bottom: 15px;
    display: block;
}

.link .full-image {

}

.link .image {
    width: 115px;
    height: 90px;
    background-color: #f9cdc1;
    border-radius: 10px;
    position: relative;
    float: right;
    margin-left: 15px;
    overflow: hidden;
    border: 1px solid #efeceb;
    text-align: center;
}

.link .image img {
    width: 100%;
}

.link .image i {
    font-size: 40px;
    color: white;
    margin-top: 16px;
}

.link .site {
    height: 22px;
    width: 100%;
    background-color: #00000073;
    position: absolute;
    bottom: 0;
    text-align: center;
}

.link .site span {
    font-size: 12px;
    color: white;
}

.link .site span i {
    font-size: 11px;
    color: white;
    margin-left: 3px;
}

.link .full-image img {
    width: 100%;
}

.link .full-image .play {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background-color: #4876b7db;
    position: absolute;
    margin-left: auto;
    margin-right: auto;
    left: 0;
    right: 0;
    text-align: center;
    border: 3px solid white;
}

.link .full-image .play i {
    color: white;
    margin-top: 16px;
    font-size: 20px;
    margin-left: 4px;
}

.link .full-image .image-video-container {
    position: relative;
    background-color: #eaedef;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
}

.link .video-container {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 30px;
    height: 0;
    overflow: hidden;
    margin-top: -5px;
    background-color: #eaedef;
}

.video-container iframe,
.video-container object,
.video-container embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.video-container-edit {
    margin-bottom: 15px;
    border-radius: 10px;
    overflow: hidden;
}

.link .full-image .instagram-container {
    position: relative;
    background-color: #eaedef;
}

/* Text */

.text-photo .processing, .edit-text .processing {
    background-color: #f8cdc1;
    width: 100%;
    height: 330px;
    text-align: center;
    margin-bottom: -1px;
}

.text-photo .processing i, .edit-text .processing i {
    color: white;
    font-size: 102px;
    margin-top: 90px;
}

.text-photo .processing span, .edit-text .processing span {
    color: white;
    display: block;
    margin-top: 15px;
    font-size: 18px;
    font-style: italic;
    margin-bottom: -20px;
}

.post-photo {
    width: 100%;
    margin-bottom: -4px;
}

.post > .text {

}

.post .body .container > .contents {
    padding-bottom: 15px;
}

.post .text .container {
    padding: 0 15px;
}

.post .text .container-image-content {
    min-height: 150px;
}

.post .text .container-image-text {
    min-height: 100px;
}

.post .text .container-image-question-version-row {
    /*min-height: 175px;*/
}

.post .text .container-content {
    /*padding-bottom: 8px;*/
}

.post .text .container-image-text {
    min-height: 105px;
}

.post .text .container .exclusive {
    font-size: 14px;
    font-weight: 900;
    margin-bottom: 5px;
    display: block;
    color: #FF5072;
}

.post .text .container .exclusive i {
    font-size: 11.5px;
    color: #FF5072;
}

#text > .container {
    padding-right: 0;
    border: none;
    border-radius: 0;
}

#text .container .title {
    top: 45px;
}

#text-title .container textarea, 
#link-title textarea, 
#question-title textarea, 
#photo-title textarea, 
#video-title textarea {
    font-weight: 500;
    font-size: 18px;
}

.text .image {
    width: 115px;
    height: 90px;
    background-color: #eaedef;
    border-radius: 10px;
    position: relative;
    float: right;
    margin-left: 15px;
    overflow: hidden;
    border: 1px solid #e1e1e1;
    text-align: center;
}

.question .image, .review .image {
    margin-top: 10px;
}

.text .image img {
    object-fit: cover;
    width: 115px;
    height: 90px;
}

.text-image .full-image {
    background-color: #eaedef;
    position: relative;
    z-index: 2;
}

.text-image .full-image img {
    width: 100%;
}

.text .container .image .media-counter {
    position: absolute;
    padding: 3px 8px 4px 8px;
    background-color: #00000057;
    border-radius: 10px;
    right: 5px;
    bottom: 7px;
    z-index: 10;
}

.text .container .image .media-counter-top {
    bottom: 37px;
}

.text .container .image .media-counter .fa-camera {
    font-size: 11px;
    color: white;
    float: left;
    margin: 5px 5px 0 0;
}

.text .container .image .media-counter .fa-video {
    font-size: 11px;
    color: white;
    float: left;
    margin: 5px 5px 0 0;
}

.text .container .image .media-counter .fa-tags {
    font-size: 11px;
    color: white;
    float: left;
    margin: 5px 5px 0 0;
}

.text .container .image .media-counter .number {
    font-size: 12px;
    color: white;
    font-weight: 900;
}

.text .title {
    width: auto;
    /*margin-top: 7px;*/
}


.text .title span {
    font-size: 20px;
    font-weight: 500;
    line-height: 22px;
    margin-bottom: 10px;
    display: block;
}

.text .title-sm span {
    font-size: 18px;
    line-height: 20px;
    margin-bottom: 5px;
}

.text .text-body {
    width: auto;
}

.text .text-body p,
.card .box .extract-full p,
.community-article p {
    font-size: 16px;
    line-height: 20px;
    display: block;
    color: #5a5a5a;
    margin-bottom: 16px;
}

.text .text-body-sm p,
.text .text-body-sm span {
    font-size: 14px;
    line-height: 16px;
    display: block;
    margin-bottom: 20px;
}

.text .text-body-sm span {
    margin-bottom: 0;
    max-height: 82px;
    overflow: hidden;
}

.text .text-body-sm-promo {
    margin-top: 10px;
}

.text .text-body-sm-promo p,
.text .text-body-sm-promo span {
    font-size: 14px;
    line-height: 16px;
    display: block;
    margin-bottom: 20px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}

.comparison-promo .text-body-sm-promo span {
    margin-bottom: 0;
}

.text .text-body-sm-promo p,
.text .text-body-sm-promo span {
    -webkit-line-clamp: 4;
}

.text .text-body-sm-promo .min-order {
    background-color: #efedf2;
    display: inline-block;
    padding: 5px 10px;
    border-radius: 5px;
    color: #4e4e4e;
    margin-bottom: 0;
}

.text .used-promo-warning {
    font-size: 11px;
    background-color: #fef1c4;
    padding: 2px 15px;
    border-radius: 19px;
    margin-top: 5px;
    display: inline-flex;
    color: #7b6011;
    border: 1px solid #d8b035;
    font-weight: 500;
    text-transform: uppercase;
}

.text .text-body-show-promo p,
.text .text-body-show-promo span {
    -webkit-line-clamp: initial;
}

.text .text-body ol,
.text .text-body ul,
.card .box .extract-full ul,
.card .box .extract-full ol,
.community-article ol,
.community-article ul {
    padding-left: 20px;
    margin-bottom: 10px;
}

.text .text-body li,
.card .box .extract-full li,
.community-article li {
    font-size: 16px;
    margin-bottom: 2px;
}

.text .text-body a,
.card .box .extract-full a,
.community-article a {
    font-size: 16px;
    color: #2196F3;
}

.text .text-body strong,
.text .text-body em,
.card .box .extract-full strong,
.card .box .extract-full em,
.community-article ol, {
    font-size: 16px;
}

.text .text-body blockquote,
.cke_editable blockquote,
.card .box .extract-full blockquote,
.community-article blockquote {
    font-style: italic;
    padding: 2px 0 0px 0;
    border-style: solid;
    border-color: #ccc;
    border-width: 0;
    padding-left: 15px;
    padding-right: 8px;
    border-left-width: 5px;
    display: block;
    margin-top: 20px;
    margin-bottom: 20px;
    margin-left: 15px;
    line-height: 18px;
}

.text .text-body blockquote > p,
.cke_editable blockquote > p,
.card .box .extract-full blockquote > p,
.community-article blockquote > p {
    font-size: 15px;
}

.text .container .end-date {
    margin: 8px 0 0 0;
}

.text .container .end-date-no-promo-code {
    margin-top: 0;
}

.text .container .end-date > span {
    color: #a6a6a6;
    font-size: 14px;
    font-weight: 500;
}

.text .container .end-date i {
    color: #a6a6a6;
    font-size: 14px;
}

.promo-suggested-by {
    margin-top: -5px;
    background-color: #ffefef;
    padding: 15px;
}

.promo-suggested-by .top {
    margin-bottom: 10px;
}

.promo-suggested-by .top .title {
    color: #a6a6a6;
    font-size: 14px;
    font-weight: 500;
    display: inline-block;
}

.promo-suggested-by .top .user {
    display: inline-block;
}

.promo-suggested-by .top .user a {

}

.promo-suggested-by .top .user a .img {
    float: left;
    width: 15px;
    height: 15px;
    border-radius: 50%;
    overflow: hidden;
    margin: 3px 5px 0 0;
}

.promo-suggested-by .top .user a .user-name {
    color: #9c8886;
    font-size: 14px;
    font-weight: 900;
}

.promo-suggested-by .bottom {
    margin-left: -3px;
}

.text .container .code {
    background: linear-gradient(111deg, #ff5171 0%, #ea2549 100%);
    padding: 8px 12px;
    display: inline-block;
    margin-top: 10px;
    border-radius: 4px;
}

.text .container .code span {
    font-weight: 900;
    color: white;
}

.text .container .add-remove-to-cart {
    font-size: 14px;
    margin: auto;
    padding: 10px 12px;
    border: 1px solid #8d7399;
    color: #896b97;
    border-radius: 20px;
    font-weight: 500;
    cursor: pointer;
    background-color: white;
    margin-left: 5px;
}

.text .container .add-remove-to-cart i {
    font-size: 13px;
    color: #896b97;
}

.text .container .general-rating {
    margin: 0 10px 0 0;
    float: left;
}

.text .container .general-rating .star {
    display: inline-block;
    margin: 0;
    padding: 0;
    margin-right: -3px;
}

.text .container .general-rating .number {
    font-size: 24px;
    color: #FEC109;
    font-weight: 900;
    display: inline-block;
}

.text .container .general-rating .base {
    font-size: 13px;
    color: #707070;
    display: inline-block;
    margin-left: -2px;
}

.text .container .review-top {
    display: table;
    width: 100%;
    margin-bottom: 7px;
}

.text .product-version-row {
    margin: 0px 0 5px 0px;
}

.text .question-show-headline > .product-version-row {
    float: left;
    margin-right: 10px;
}

.text .review-top > .product-version-row {
    float: left;
    margin-top: 2px;
    margin-bottom: 0;
}

.text .review-updated {
    color: #3f903d;
    font-size: 14px;
    display: block;
    margin-top: 2px;
    float: left;
    margin-left: 10px;
    background-color: #dcf7e2;
    padding: 4px 10px;
    border-radius: 15px;
    border: 1px solid #3f903d;
}

.photo .product-version-row,
.video .product-version-row {
    margin: 0px 0 5px 0px;
}

.text .product-version-row .product-version-img,
.photo .product-version-row .product-version-img,
.video .product-version-row .product-version-img {

}

.text .product-version-row .product-version-img .bg,
.photo .product-version-row .product-version-img .bg,
.video .product-version-row .product-version-img .bg {
    background-color: #fff1ec;
    border: 1px solid #ffd1d1;
    padding: 5px 8px 5px 5px;
    border-radius: 10px;
    display: table;
}

.text .product-version-row .product-version-img .bg img,
.photo .product-version-row .product-version-img .bg img,
.video .product-version-row .product-version-img .bg img {
    width: 15px;
    float: left;
    border-radius: 5px;
    border: 1px solid #ffffff8f;
}

.text .product-version-row .product-version-img .bg .text,
.photo .product-version-row .product-version-img .bg .text,
.video .product-version-row .product-version-img .bg .text {
    color: #FFA3A3;
    font-size: 13px;
    margin: 2px 0 0px 5px;
    float: left;
}

.text .product-version-row .text-version-container,
.photo .product-version-row .text-version-container {

}

.text .product-version-row .text-version-container .bg,
.photo .product-version-row .text-version-container .bg,
.video .product-version-row .text-version-container .bg {
    background-color: #fff1ec;
    border: 1px solid #ffd1d1;
    padding: 1px 11px;
    border-radius: 10px;
    display: inline-block;
}

.text .question-show-headline {
    display: table;
    width: 100%;
    padding: 0;
    margin-bottom: 7px;
}

.bottom-menu-modal-post .question-group-row {
    display: table;
    width: 100%;
    margin-bottom: 15px;
}

.bottom-menu-modal-post .question-group-row .source-img {
    height: 26px;
    width: 26px;
    border-radius: 50%;
    overflow: hidden;
    border: 1px solid #e1e1e1;
    float: left;
}

.bottom-menu-modal-post .question-group-row .source-img img {
    width: 100%;
}

.bottom-menu-modal-post .question-group-row .chev-right {
    float: left;
    width: 20px;
    text-align: center;
}

.bottom-menu-modal-post .question-group-row .chev-right i {
    color: #B2B2B2;
    margin-top: 7px;
    font-size: 14px;
}

.text .question-show-headline .question-group,
.bottom-menu-modal-post .question-group {
    float: left;
    margin-right: 7px;
}

.text .question-show-headline .question-group .bg,
.bottom-menu-modal-post .question-group .bg {
    background-color: #ffffff;
    border: 1px solid #7c7c7c;
    padding: 1px 11px;
    border-radius: 15px;
}

.text .question-show-headline .question-group .bg .text,
.bottom-menu-modal-post .question-group .bg .text {
    color: #737373;
    font-size: 14px;
    margin: 3px 0 3px 0;
    display: block;
}

.text .question-show-headline .classify-question,
.bottom-menu-modal-post .classify-question {
    float: left;
}

.text .question-show-headline .classify-question .bg,
.bottom-menu-modal-post .classify-question .bg {
    background-color: #FF5072;
    border: 1px solid #FF5072;
    padding: 1px 11px;
    border-radius: 15px;
}

.text .question-show-headline .classify-question .bg .text,
.bottom-menu-modal-post .classify-question .bg .text {
    color: #ffffff;
    font-size: 14px;
    margin: 3px 0 3px 0;
    display: block;
}

.text .question-show-headline .classify-question .bg .text i,
.bottom-menu-modal-post .classify-question .bg .text i {
    color: #ffffff;
    font-size: 13px;
    margin-right: -2px;
}

.text .container .no-comment-review {
    margin-bottom: 15px;
}

.text .container .no-comment-review .text {
    font-size: 14px;
    color: #a2a2a2;
    cursor: pointer;
}

.text .container .review-type {
    display: inline-block;
    margin: 0px 0 5px 0;
}

.text .container .review-type .text {
    font-size: 14px;
    color: #ff9e9e;
    display: inline-block;
    font-weight: 500;
}

.text .product-version-row .text-version-container .bg .text,
.photo .product-version-row .text-version-container .bg .text,
.video .product-version-row .text-version-container .bg .text {
    color: #FFA3A3;
    font-size: 14px;
    margin: 3px 0 3px 0;
    display: block;
}

.review-specs-ratings {
    background-color: #fff0ec;
    padding: 18px 15px 5px 15px;
    margin-top: 25px;
}

.review-specs-ratings-feed {
    margin-top: 5px;
    padding: 10px 15px 0px 15px;
}

.rating-specs-ratings {
    margin-top: 10px;
}

.reviews-summary .review-specs-ratings {
    padding: 0;
}

.review-specs-ratings .specs {
    display: table;
    width: 100%;
}

.review-specs-ratings .specs .col {
    width: 50%;
    float: left;
    margin-bottom: 10px;
}

.review-specs-ratings .specs .col .circle {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background-color: white;
    text-align: center;
    float: left;
}

.reviews-summary .review-specs-ratings .specs .col .circle {
    width: 35px;
    height: 35px;
}

.review-specs-ratings .specs .col .circle .container {
    margin-top: 5px;
}

.reviews-summary .review-specs-ratings .specs .col .circle .container {
    margin-top: 8px;
}

.review-specs-ratings .specs .col .circle .star {
    display: inline-block;
    margin: 0;
    padding: 0;
    margin-right: -4px;
}

.review-specs-ratings .specs .col .circle .rating {
    color: white;
    display: inline-block;
    font-size: 17px;
    font-weight: 900;
}

.review-specs-ratings .specs .col .text {
    float: left;
    margin-top: 7px;
    margin-left: 8px;
    font-size: 14px;
    color: #897a7a;
    font-weight: 500;
}

.review-specs-ratings-feed .specs .col .circle {
    width: 25px;
    height: 25px;
}

.review-specs-ratings-feed .specs .col .circle .container {
    margin-top: 3px;
}

.review-specs-ratings-feed .specs .col .circle .rating {
    font-size: 14px;
}

.review-specs-ratings-feed .specs .col .text {
    margin-top: 5px;
}

.reviews-summary .review-specs-ratings .specs .col .text {
    margin-top: 10px;
}

.review-specs-ratings .text-footer {
    padding-bottom: 5px;
    border-top: 1px solid #d3c6c2;
    padding-top: 20px;
    margin-top: 10px;
}

.review-specs-ratings .text-footer-no-border {
    border-top: none;
    padding-top: 10px;
    margin-top: 0px;
}

.review-specs-ratings-feed .text-footer {
    display: none;
}

.review-specs-ratings-feed .text-footer-more {
    padding-bottom: 13px;
    text-align: center;
    display: flex;
    justify-content: center;
    height: 5px;
    padding-top: 10px;
}

.review-specs-ratings-feed .text-footer-more button {
    font-size: 14px;
    color: #bfb0af;
    font-weight: 500;
    position: absolute;
    margin-top: -8px;
    background-color: #fef0ec;
    padding: 0 7px;
    cursor: pointer;
}

.review-specs-ratings-feed .text-footer-more button i {
    font-size: 11px;
    color: #bfb0af;
}

.review-specs-ratings-feed .text-footer-more .line {
    border-top: 1px solid #c4b5b2;
    width: 100%;
}

.review-specs-ratings .text-footer .row {
    margin-bottom: 17px;
}

.review-specs-ratings .text-footer .row .icon {
    float: left;
    width: 18px;
    text-align: center;
    margin-right: 3px;
}

.review-specs-ratings .text-footer .row .text-col {
    padding-left: 23px;
}

.review-specs-ratings .text-footer .row .text {
    font-size: 14px;
    color: #897a7a;
    font-weight: 500;
    display: block;
    line-height: 16px;
}

.review-specs-ratings .text-footer .row .fa-clock,
.review-specs-ratings .text-footer .row .fa-cube,
.review-specs-ratings .text-footer .row .fa-hand-paper-o,
.review-specs-ratings .text-footer .row .fa-hand-pointer-o,
.review-specs-ratings .text-footer .row .fa-arrows,
.review-specs-ratings .text-footer .row .fa-arrow-down, 
.review-specs-ratings .text-footer .row .fa-hourglass-half,
.review-specs-ratings .text-footer .row .fa-check-square-o,
.review-specs-ratings .text-footer .row .fa-commenting-o,
.review-specs-ratings .text-footer .row .fa-shower {
    font-size: 13px;
    color: #897a7a;
    margin-top: 2px;
    display: block;
}

.review-specs-ratings .text-footer .row .fa-calendar-alt {
    font-size: 13px;
    color: #897a7a;
    margin-top: 1px;
    display: block;
}

.review-specs-ratings .text-footer .row .icon > .fa-sun {
    font-size: 13px;
    color: #897a7a;
    margin-top: 2px;
    display: block;
}

.review-specs-ratings .text-footer .row .icon > .fa-moon {
    font-size: 13px;
    color: #897a7a;
    margin-top: 2px;
    display: block;
}

.review-specs-ratings .text-footer .row .fa-sync {
    font-size: 13px;
    color: #897a7a;
    margin-top: 2px;
    display: block;
}

.review-specs-ratings .text-footer .row .fa-eye {
    font-size: 13px;
    color: #897a7a;
    margin-top: 2px;
    display: block;
}

.review-specs-ratings .text-footer .row .fa-wind {
    font-size: 13px;
    color: #897a7a;
    margin-top: 1px;
    display: block;
}

.review-specs-ratings .text-footer .row .fa-signal {
    font-size: 13px;
    color: #897a7a;
    margin-top: 0px;
    display: block;
}

.review-specs-ratings .text-footer .row .fa-dollar-sign {
    font-size: 13px;
    color: #897a7a;
    margin-top: 2px;
    display: block;
}

.review-specs-ratings .text-footer .row .fa-times {
    font-size: 14px;
    color: #ed6c63;
    margin-top: 1px;
    display: block;
}

.review-specs-ratings .text-footer .row .fa-check {
    font-size: 12px;
    color: #50a763;
    margin-top: 2px;
    display: block;
}

.review-specs-ratings .text-footer .row .fa-question {
    font-size: 13px;
    color: #897a7a;
    margin-top: 0px;
    display: block;
}

.review-specs-ratings .text-footer .row .fa-exclamation-triangle {
    font-size: 13px;
    margin-top: 2px;
    display: block;
}

.review-specs-ratings .text-footer .row .fa-grin-hearts,
.review-specs-ratings .text-footer .row .fa-smile-beam,
.review-specs-ratings .text-footer .row .fa-smile,
.review-specs-ratings .text-footer .row .fa-meh,
.review-specs-ratings .text-footer .row .fa-frown {
    font-size: 15px;
    color: #897a7a;
    margin-top: 1px;
    display: block;
}



.review-specs-ratings .text-footer .row .red-text,
.review-specs-ratings .text-footer .row .red-icon {
    color: #ed6c63;
}

.review-specs-ratings .text-footer .row .yellow-text,
.review-specs-ratings .text-footer .row .yellow-icon {
    color: #ff9800;
}

.review-specs-ratings .text-footer .row .green-text {
    color: #50a763;
}

.send-btn .send, .accept-wide-btn {
    background: linear-gradient(111deg, #2d1974 0%, #cd8aed 100%);
    color: white;
}

.send-btn .send, .accept-wide-btn:hover {
    background: linear-gradient(111deg, #2d1974 0%, #cd8aed 100%);
    color: white;
}

.text .promo-image {
    width: 100%;
    margin-bottom: 0;
    background-color: #f0eef3;
    overflow: hidden;
    position: relative;
    height: 180px;
}

.text .promo-image-show {
    width: 100%;
    margin-bottom: 0;
    background-color: #f0eef3;
    overflow: hidden;
    position: relative;
    height: auto;
}

.text .promo-image-show > img {
    width: 100%;
    margin-bottom: -4px;
}

.text .promo-image > img {
    width: 100%;
    margin-bottom: -4px;
}

.comparison-promo .promo-image {
    margin-top: 10px;
    border-top-right-radius: 10px;
    border-top-left-radius: 10px;
}

.text .footer {
    background-color: #FCF2EF;
    padding: 7px 15px 6px 15px;
}

.comparison-promo .footer {
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
}

.text .footer .footer-container {
    display: table;
    width: 100%;
}

.text .footer .footer-container .button {
    padding: 4px 15px;
    border-radius: 20px;
    float: right;
    font-size: 13px;
    font-weight: 500;
}

.text .footer .footer-container .active {
    color: #FF5072;
    border: 1px solid #FF5072;
    background-color: white;
}

.text .footer .footer-container .active i {
    color: #FF5072;
    font-size: 11px;
    float: right;
    margin: 2px 0 0 5px;
}

.text .footer .footer-container .green {
    color: green;
    border: 1px solid green;
}

.text .footer .footer-container .green i {
    color: green;
}

.text .footer .footer-container .inactive {
    color: #d1b6ae;
    border: 1px solid #e8e1e0;
    background-color: #ffffff;
}

.text .footer .footer-container .text {
    float: left;
    padding-top: 3px;
}

.text .footer .footer-container .text span {
    color: #938d8b;
    font-size: 13px;
}



.card .box .extract-full p,
.card .box .extract-full ul,
.card .box .extract-full ol,
.card .box .extract-full li,
.card .box .extract-full a,
.card .box .extract-full strong,
.card .box .extract-full em,
.card .box .extract-full blockquote,
.card .box .extract-full blockquote > p {
    color: #938d8b;
}

.post-text-products {
    background-color: white;
    padding-top: 15px;
    margin-bottom: -2px;
}

.file-field-input {
    display: none;
}

.btn-md-photo {
    margin-top: 5px;
    margin-bottom: 15px;
    color: #8a8a8a;
    border: 1px solid #a4a4a4;
}

.btn-md-photo i {
    color: #8a8a8a;
}

.btn-md-video {
    margin-top: 5px;
    margin-bottom: 15px;
    color: #8a8a8a;
    border: 1px solid #a4a4a4;
}

.btn-md-video i {
    color: #8a8a8a;
}

.btn-md-green {
    color: green;
    border: 1px solid green;
    background-color: #E8F5E9;
    margin-bottom: 7px;
    margin-top: 5px;
}

.btn-md-green i {
    color: green;
}

.text-image-preview {
    margin-bottom: 15px;
    height: 90px;
    display: none;
}

.text-image-preview img {
    height: 100%;
    border: 1px solid #eeeeee;
    border-radius: 5px;
}

.photo-image-preview {
    margin-bottom: 10px;
    width: 100%;
    display: none;
}

.video-clip-preview {
    margin-bottom: 10px;
    width: 100%;
}

.video-clip-preview video {
    width: 100%;
    border: 1px solid #eeeeee;
    border-radius: 10px;
}

.photo-image-preview img {
    width: 100%;
    border: 1px solid #eeeeee;
    border-radius: 10px;
}

.canvas-image-preview,
.canvas-clip-preview {
    margin-bottom: 10px;
    border-radius: 10px;
    width: 100%;
    border: 1px solid #e4e4e4;
    display: none;
    image-orientation: none;
}

.canvas-featured-image-preview {
    margin-bottom: 10px;
    border-radius: 10px;
    width: 100%;
    border: 1px solid #e4e4e4;
    display: none;
}

.edit-image-box {
    margin-bottom: 10px;
    border-radius: 10px;
    border: 1px solid #e4e4e4;
    overflow: hidden;
    background-color: #dedede;
}

.edit-image-preview {
    width: 100%;
}

.photo-image-error,
.video-clip-error {
    color: red;
    border: 1px solid red;
    background-color: #fff7f7;
}

.photo-image-error i,
.video-clip-error i {
    color: red;
}

.photo-image-error-text,
.video-clip-error-text {
    color: red !important;
    font-weight: 500;
}

/* Direct Upload */

.direct-upload {
    display: block;
    position: relative;
    padding: 7px 15px;
    margin: 0 0px 15px 0;
    border: 1px solid rgba(0, 0, 0, 0.3);
    font-size: 11px;
    line-height: 13px;
    font-weight: 500;
    text-align: center;
    overflow: hidden;
    border-radius: 5px;
}

.direct-upload__progress {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  opacity: 0.5;
  background: #4CAF50;
  transition: width 120ms ease-out, opacity 60ms 60ms ease-in;
  transform: translate3d(0, 0, 0);
}

.direct-upload__filename {
    color: #8a8a8a;
}

.direct-upload__filename i {
    color: #8a8a8a;
}

.direct-upload--complete .direct-upload__progress {
  opacity: 0.2;
}

.direct-upload--error {
  border-color: red;
}

input[type=file][data-direct-upload-url][disabled] {
  display: none;
}


/* Photo */

.post .photo {

}

.post .photo .product-version-row,
.post .video .product-version-row {
    padding: 0 15px;
}

.post .photo .title {
    padding: 0 15px;
}

.post .photo .title span, .photo .title a {
    font-size: 20px;
    font-weight: 500;
    line-height: 22px;
    margin-bottom: 10px;
    display: block;
}

.post .photo .images {
    position: absolute;
    width: 100%;
}

.post .image .container {

}

.post .image-wrapper,
.post .clip-wrapper {
    background-color: #f0eef3;
    position: relative;
    overflow: hidden;
}

.post .image-wrapper .image-counter,
.post .clip-wrapper .clip-counter {
    position: absolute;
    padding: 4px 8px;
    background-color: #00000057;
    border-radius: 15px;
    right: 12px;
    top: 12px;
    z-index: 10;
    font-size: 13px;
    color: white;
    font-weight: 900;
}

.post .image-el, .post .clip-el {
    width: 100%;
    display: none;
}

.post .image-el-active, .post .clip-el-active {
    display: block;
}

.post .image .loading-img,
.post .video .loading-img,
.post .review-clip .loading-img {
    position: absolute;
    width: 100%;
    text-align: center;
}

.flickity-viewport {
    transition: height 0.2s;
}

.post .flickity-page-dots {
    bottom: 15px;
}

.post .video .flickity-page-dots {
    bottom: 45px;
}

.post .flickity-page-dots .dot {
    width: 5px;
    height: 5px;
    margin: 0 4px;
    background: transparent;
    opacity: 1;
    border: 1px solid #ffffff;
}

.post .flickity-page-dots .dot.is-selected {
    background: #e6eaeb !important;
}

.post .flickity-button {
  background: #ffffffb0;
}
/* big previous & next buttons */
.post .flickity-prev-next-button {
  width: 35px;
  height: 35px;
}
/* icon color */
.post .flickity-button-icon {
  fill: #00000026;
}
/* hide disabled button */
.post .flickity-button:disabled {
  display: none;
}

.post .photo .images img, .post .text-image .images img {
    width: 100%;
    margin-bottom: -4px;
}

.edit-photos,
.edit-videos {
    margin-bottom: 20px;
    border-radius: 10px;
    overflow: hidden;
}

.post .processing,
.edit-photos .processing,
.edit-videos .processing {
    background-color: #b0a7b5;
    text-align: center;
    margin-bottom: -1px;
    padding: 0 20px 80px 20px;
}

.post .processing > i,
.edit-photos .processing > i,
.edit-videos .processing > i {
    color: white;
    font-size: 102px;
    padding-top: 70px;
    display: block;
    padding-bottom: 20px;
}

.post .processing .title,
.edit-photos .processing .title,
.edit-videos .processing .title {
    color: white;
    display: block;
    margin-top: 15px;
    font-size: 20px;
    font-weight: 900;
}

.post .processing .lds-ellipsis-wh,
.edit-photos .processing .lds-ellipsis-wh,
.edit-videos .processing .lds-ellipsis-wh {
    height: 30px;
}

.post .processing .lds-ellipsis-wh div,
.edit-photos .processing .lds-ellipsis-wh div,
.edit-videos .processing .lds-ellipsis-wh div {
    top: 11px;
}

.post .processing .subtitle,
.edit-photos .processing .subtitle,
.edit-videos .processing .subtitle {
    color: white;
    display: block;
    font-size: 16px;
    margin-bottom: 20px;
}

.post .processing .refresh,
.edit-photos .processing .refresh,
.edit-videos .processing .refresh {
    color: white;
    display: block;
    font-size: 16px;
    text-decoration: underline;
}

.post .image .tag-box,
.text-image .full-image .tag-box {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
}

.new-content-section .tag-brand {
    margin-bottom: 15px;
    margin-top: -3px;
}

.new-content-section .tag-brand i {
    font-size: 14px;
    color: gray;
    float: left;
    margin-top: 2px;
}

.new-content-section .tag-brand span {
    font-size: 14px;
    color: gray;
    display: block;
    line-height: 18px;
    padding-left: 20px;
}

.post .tag-brand-error, .tag-brand-error i {
    color: red;
}

.post .image .left-btn,
.post .video .left-btn,
.post .review-clip .left-btn {
    width: 45px;
    height: 45px;
    background-color: #eff2f5eb;
    border-radius: 50%;
    text-align: center;
    position: absolute;

    left: 15px;
    z-index: 10;
    border: 4px solid white;
    box-shadow: 2px 2px 4px #00000038;
    cursor: pointer;
    /*display: none;*/
}

.post .image .left-btn i,
.post .video .left-btn i,
.post .review-clip .left-btn i {
    font-size: 26px;
    color: #0000004d;
    margin-top: 10px;
    margin-left: -2px;
}

.post .image .right-btn,
.post .video .right-btn,
.post .review-clip .right-btn {
    width: 45px;
    height: 45px;
    background-color: #eff2f5eb;
    border-radius: 50%;
    text-align: center;
    position: absolute;

    right: 15px;
    z-index: 10;
    border: 4px solid white;
    box-shadow: 2px 2px 4px #00000038;
    cursor: pointer;
    /*display: none;*/
}

.post .image .right-btn i,
.post .video .right-btn i,
.post .review-clip .right-btn i {
    font-size: 26px;
    color: #0000004d;
    margin-top: 10px;
    margin-left: 2px;
}

/* Video */

.post .video {

}

.post .video > .title {
    padding: 0 15px;
}

.post .video .title span, .video .title a {
    font-size: 20px;
    font-weight: 500;
    line-height: 22px;
    margin-bottom: 10px;
    display: block;
}

.post .video-container {
    background-color: black;
    width: 100%;
}

.post .video-clip-preview {
    display: none;
}

.edit-video {
    margin-bottom: 20px;
    border-radius: 10px;
    overflow: hidden;
}

.post .video-js {
  /* The base font size controls the size of everything, not just text.
     All dimensions use em-based sizes so that the scale along with the font size.
     Try increasing it to 15px and see what happens. */
  font-size: 10px;
  /* The main font color changes the ICON COLORS as well as the text */
  color: #fff;
  outline: none;
  width: 100%;
}

/* The default color of control backgrounds is mostly black but with a little
   bit of blue so it can still be seen on all-black video frames, which are common. */
.video-js .vjs-control-bar,
.video-js .vjs-big-play-button,
.video-js .vjs-menu-button .vjs-menu-content {
  /* IE8 - has no alpha support */
  background-color: #2b333f;
  /* Opacity: 1.0 = 100%, 0.0 = 0% */
  background-color: rgba(43, 51, 63, 0.7);
  background-color: transparent;
}

/* Slider - used for Volume bar and Progress bar */
.video-js .vjs-slider {
  background-color: #73859f;
  background-color: rgba(115, 133, 159, 0.5);
  background-color: rgba(255, 255, 255, 0.3);
  border-radius: 2px;
  height: 6.5px;
}

/* The slider bar color is used for the progress bar and the volume bar
   (the first two can be removed after a fix that's coming) */
.video-js .vjs-volume-level,
.video-js .vjs-play-progress,
.video-js .vjs-slider-bar {
  background: #fff;
}

/* Enlarged Slider to enable easier tracking. Adjust all the height:6.5px to preferred height for the slider if necessary. */
.video-js .vjs-progress-holder .vjs-load-progress,
.video-js .vjs-progress-holder .vjs-load-progress div,
.video-js .vjs-progress-holder .vjs-play-progress,
.video-js .vjs-progress-holder .vjs-tooltip-progress-bar {
  height: 6.5px;
}

/* The main progress bar also has a bar that shows how much has been loaded. */
.video-js .vjs-load-progress {
  /* For IE8 we'll lighten the color */
  background: ligthen(#73859f, 25%);
  /* Otherwise we'll rely on stacked opacities */
  background: rgba(115, 133, 159, 0.5);
}

/* The load progress bar also has internal divs that represent
   smaller disconnected loaded time ranges */
.video-js .vjs-load-progress div {
  /* For IE8 we'll lighten the color */
  background: ligthen(#73859f, 50%);
  /* Otherwise we'll rely on stacked opacities */
  background: rgba(115, 133, 159, 0.75);
}

.vjs-sublime-skin .vjs-poster {
  outline: none;
  /* Remove Blue Outline on Click*/
  outline: 0;
}

.vjs-controls-disabled .vjs-big-play-button {
    display: block;
}

.vjs-sublime-skin:hover .vjs-big-play-button {
  background-color: transparent;
}

.vjs-sublime-skin .vjs-fullscreen-control:before,
.vjs-sublime-skin.vjs-fullscreen .vjs-fullscreen-control:before {
  content: "";
  /* Remove Fullscreen Exit Icon */
}

.vjs-sublime-skin.vjs-fullscreen .vjs-fullscreen-control {
  background: #fff;
}

.vjs-sublime-skin .vjs-fullscreen-control {
  border: 3px solid #fff;
  box-sizing: border-box;
  cursor: pointer;
  margin-top: -7px;
  top: 50%;
  height: 14px;
  width: 22px;
  margin-right: 10px;
}

.vjs-sublime-skin.vjs-fullscreen .vjs-fullscreen-control:after {
  background: #000;
  content: "";
  display: block;
  position: absolute;
  bottom: 0;
  left: 0;
  height: 5px;
  width: 5px;
}

.vjs-sublime-skin .vjs-progress-holder {
  margin: 0;
}

.vjs-sublime-skin .vjs-progress-control .vjs-progress-holder:after {
  border-radius: 2px;
  display: block;
  height: 6.5px;
}

.vjs-sublime-skin .vjs-progress-control .vjs-load-progres,
.vjs-sublime-skin .vjs-progress-control .vjs-play-progress {
  border-radius: 2px;
  height: 6.5px;
}

.vjs-sublime-skin .vjs-playback-rate {
  display: none;
  /* Remove Playback Rate */
}

.vjs-sublime-skin .vjs-progress-control {
  margin-right: 50px;
}

.vjs-sublime-skin .vjs-time-control {
  right: 55px;
}

.vjs-sublime-skin .vjs-volume-menu-button:before {
  width: 1.2em;
  z-index: 1;
}

.vjs-sublime-skin .vjs-volume-menu-button .vjs-menu,
.vjs-sublime-skin .vjs-volume-menu-button:focus .vjs-menu,
.vjs-sublime-skin .vjs-volume-menu-button.vjs-slider-active .vjs-menu {
  display: block;
  opacity: 1;
}

.vjs-sublime-skin .vjs-volume-menu-button,
.vjs-sublime-skin .vjs-volume-panel {
  width: 6em;
  position: absolute;
  right: 0;
  margin-right: 57px;
}

.vjs-sublime-skin .vjs-volume-menu-button .vjs-menu-content,
.vjs-sublime-skin .vjs-volume-menu-button:hover,
.vjs-sublime-skin .vjs-volume-menu-button:focus,
.vjs-sublime-skin .vjs-volume-menu-button.vjs-slider-active,
.vjs-sublime-skin .vjs-volume-panel .vjs-volume-control,
.vjs-sublime-skin .vjs-volume-panel:hover,
.vjs-sublime-skin .vjs-volume-panel:focus,
.vjs-sublime-skin .vjs-volume-panel.vjs-slider-active {
  width: 6em;
}

.vjs-sublime-skin .vjs-volume-menu-button .vjs-menu {
  left: 23px;
}

.vjs-sublime-skin .vjs-mouse-display:before,
.vjs-sublime-skin .vjs-play-progress:before,
.vjs-sublime-skin .vjs-volume-level:before {
  content: "";
  /* Remove Circle From Progress Bar */
}

.vjs-sublime-skin .vjs-mouse-display:after,
.vjs-sublime-skin .vjs-play-progress:after,
.vjs-sublime-skin .vjs-time-tooltip {
  width: 5.5em;
}

.vjs-sublime-skin .vjs-audio-button {
  display: none;
}

.vjs-sublime-skin .vjs-volume-bar {
  background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACwAAAAcCAQAAACw95UnAAAAMElEQVRIx2NgoBL4n4YKGUYNHkEG4zJg1OCRYDCpBowaPJwMppbLRg0eNXjUYBLEAXWNUA6QNm1lAAAAAElFTkSuQmCC);
  background-size: 22px 14px;
  background-repeat: no-repeat;
  height: 100%;
  width: 100%;
  max-width: 22px;
  max-height: 14px;
  margin: 7px 4px;
  border-radius: 0;
}

.vjs-sublime-skin .vjs-volume-level {
  background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACwAAAAcAQAAAAAyhWABAAAAAnRSTlMAAHaTzTgAAAAZSURBVHgBYwAB/g9EUv+JokCqiaT+U4MCAPKPS7WUUOc1AAAAAElFTkSuQmCC);
  background-size: 22px 14px;
  background-repeat: no-repeat;
  max-width: 22px;
  max-height: 14px;
  height: 100%;
}

/* New for VideoJS v6 */
.vjs-sublime-skin
.vjs-volume-panel.vjs-volume-panel-horizontal.vjs-slider-active,
.vjs-sublime-skin .vjs-volume-panel.vjs-volume-panel-horizontal:active,
.vjs-sublime-skin .vjs-volume-panel.vjs-volume-panel-horizontal:focus,
.vjs-sublime-skin .vjs-volume-panel.vjs-volume-panel-horizontal:hover {
  width: 6em;
  transition-property: none;
}

.vjs-sublime-skin
.vjs-volume-panel
.vjs-mute-control:hover
~ .vjs-volume-control.vjs-volume-horizontal {
  width: 3em;
  height: auto;
}

.vjs-sublime-skin
.vjs-volume-panel
.vjs-mute-control:hover
~ .vjs-volume-control {
  transition-property: none;
}

.vjs-sublime-skin .vjs-fullscreen-control .vjs-icon-placeholder {
  display: none;
  /* Remove Duplicate Fullscreen Icon */
}

.vjs-sublime-skin .vjs-volume-panel .vjs-mute-control {
  width: 2em;
  z-index: 1;
  padding: 0;
}

.vjs-sublime-skin .vjs-volume-panel .vjs-volume-control {
  display: inline-block;
  position: relative;
  left: 5px;
  opacity: 1;
  width: 3em;
  height: auto;
}

.video-js .vjs-picture-in-picture-control {
    display: none;
}

.vjs-sublime-skin .vjs-volume-panel {
    width: 20px;
}

.video-js .vjs-play-control {
    width: 55px;
    margin-top: -5px;
}

.vjs-big-play-button {
    width: 50px !important;
    height: 50px !important;
    border-radius: 50% !important;
    background-color: #6275aed6 !important;
    position: absolute !important;
    margin-left: auto;
    margin-right: auto;
    margin-top: auto;
    margin-bottom: auto;
    left: 0 !important;
    right: 0 !important;
    top: 0 !important;
    bottom: 0 !important;
    text-align: center;
    border: 3px solid white !important;
}

.vjs-icon-play:before, .video-js .vjs-play-control .vjs-icon-placeholder:before, .video-js .vjs-big-play-button .vjs-icon-placeholder:before {
    content: "\f101";
    color: white;
    font-size: 35px;
}

.video-js {
    /*position: relative !important;
    width: 100% !important;*/
}

.vjs-poster {
    /*position: absolute !important;*/
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
}

.video-js .vjs-tech {
    height: 100% !important;
    width: auto;
    left: 0;
    right: 0;
    margin: auto;
}

.video-js .vjs-tech:focus {
    outline: 0;
    outline-color: transparent;
    outline-style: none;
}

.vjs-remaining-time {
    display: none;
}

.vjs-volume-control {
    display: none !important;
}

.vjs-disposed {
    position: absolute;
    height: 100%;
    width: 100%;
}

.vjs-disposed-poster {
    height: 100%;
    margin: auto;
    display: block;
}

.vjs-disposed-poster-post {
    width: 100%;
    margin: auto;
    display: block;
    position: relative;
}

.vjs-disposed-play-btn {
    width: 44px !important;
    height: 44px !important;
    border-radius: 50% !important;
    background-color: #6275aed6 !important;
    position: absolute !important;
    margin-left: auto;
    margin-right: auto;
    margin-top: auto;
    margin-bottom: auto;
    left: 0 !important;
    right: 0 !important;
    top: 0 !important;
    bottom: 0 !important;
    text-align: center;
    border: 3px solid white !important;
}

.vjs-disposed-play-btn span {
    color: white;
    font-size: 24px;
    display: block;
    margin-top: 5px;
    margin-left: 0;
}

.vjs-disposed-play-btn span:before {
    content: "\f101";
    color: white;
    font-size: 35px;
    font-family: VideoJS;
    font-weight: normal;
    font-style: normal;
}

.vjs-disposed .disabled {
    pointer-events: none;
    opacity: 0;
}


/* select product */

.select-product {
    margin-top: 8px;
}

.select-product-edit {
    margin-bottom: 20px;
}

.select-product .list {
    display: none;
}

.select-product .list-edit {
    display: initial;
    margin-bottom: 20px;
}

.select-product .list .product {
    background-color: #eff2f7;
    padding: 5px 0;
    border-radius: 10px;
    margin-bottom: 7px;
    display: table;
    width: 100%;
}

.select-product .list .product .remove-product {
    float: left;
    width: 25px;
    height: 24px;
    margin: 2px 0 0 5px;
    text-align: center;
    padding-top: 6px;
}

.select-product .list .product .remove-product i {
    font-size: 16px;
    color: #6275ae8a;
}

.select-product .list .product img {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    float: left;
    border: 1px solid #E2E2E2;
}

.select-product .list .product .info {
    padding-left: 68px;
}

.select-product .list .product .info .brand {
    font-family: "Space Mono", sans-serif;
    font-size: 12px;
    font-weight: 900;
    display: block;
    color: #6375AE;
    text-transform: uppercase;
    margin-bottom: -1px;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden
}

.select-product .list .product .info .name {
    font-size: 12px;
    color: #6375AE;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden
}

.select-product .list > div > .brand, .select-product .list > div > .store {
    background-color: #eff2f7;
    padding: 5px 0;
    border-radius: 10px;
    margin-bottom: 7px;
    display: table;
    width: 100%;
}


.select-product .list > div > .brand .remove-brand, .select-product .list > div > .store .remove-store {
    float: left;
    width: 25px;
    height: 24px;
    margin: 2px 0 0 5px;
    text-align: center;
    padding-top: 6px;
}

.select-product .list > div > .brand .remove-brand i, .select-product .list > div > .store .remove-store i {
    font-size: 16px;
    color: #6275ae8a;
}

.select-product .list > div > .brand img, .select-product .list > div > .store img {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    float: left;
    border: 1px solid #E2E2E2;
}

.select-product .list > div > .brand .name, .select-product .list > div > .store .name {
    font-family: "Space Mono", sans-serif;
    font-size: 12px;
    font-weight: 900;
    color: #6375AE;
    text-transform: uppercase;
    margin-bottom: 0;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    margin-top: 8px;
    margin-left: 5px;
    float: left;
}

.select-product .open {
    font-size: 14px;
    color: #0c007f;
    margin-top: 10px;
    display: inline-block;
}

.select-product .open i {
    font-size: 12px;
    color: #0c007f;
    float: left;
    margin-top: 3px;
    margin-right: 8px;
}

.open-edit-box {
    margin-top: 15px;
}

.select-product-modal {
    height: 100%;
    width: 100%;
    position: fixed;
    bottom: 0;
    overflow-y: scroll;
    overflow-x: hidden;
    z-index: 62;
    animation-duration: 800ms;
    display: none;
}

.select-product-modal .container-modal {
    padding: 15px;
}

.select-product-modal .container-modal .bg {
    padding: 15px 15px 15px 15px;
    border-radius: 15px;
    background-color: white;
    position: relative;
}

.select-product-modal .container-modal .bg .close {
    position: absolute;
    right: 15px;
    top: 13px;
    color: white;
}

.select-product-modal .container-modal .bg .close i {
    font-size: 26px;
    color: #ff9f9f;
}

.select-product-modal .container-modal .bg .header {
    font-size: 18px;
    color: #ff9f9f;
    font-weight: 900;
}

.select-product-modal .container-modal .bg .wrapper {
    position: relative;
    border: 1px solid #bebebe;
    border-radius: 5px;
    padding-right: 10px;
    margin-top: 15px;
}

.select-product-modal .container-modal .bg .wrapper .title {
    display: block;
    position: absolute;
    top: 4px;
    left: 10px;
}

.select-product-modal .container-modal .bg .wrapper .title .field {
    font-weight: 500;
    font-size: 14px;
    color: #8d8d8d;
}

.select-product-modal .container-modal .bg .wrapper #searchbox, .select-product-modal .container-modal .bg .wrapper #searchbox-brand {
    height: 52px;
}

.select-product-modal .ais-SearchBox {
    position: relative;
}

.select-product-modal .ais-SearchBox-input {
    background-color: transparent;
    border: none;
    width: 100%;
    padding-left: 10px;
    padding-top: 26px;
    padding-bottom: 5px;
    border: 0;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
    height: 50px;
    font-size: 18px;
}

.select-product-modal .ais-SearchBox-input::-ms-clear {
    width : 0;
    height: 0;
}

.select-product-modal .ais-SearchBox-submit {
    display: none;
}

.select-product-modal .ais-SearchBox-reset {
    position: absolute;
    right: -3px;
    top: 9px;
    padding: 10px;
    background-color: #ffffff;
}

.select-product-modal .ais-SearchBox-resetIcon {
    object-fit: scale-down;
    width: 12px;
    height: 12px;
    background-color: transparent;
}

.select-product-modal .ais-SearchBox-resetIcon path {
    fill: lightgray;
}

.ais-Hits--empty {
    font-size: 14px;
    margin-top: 10px;
}

.select-product-modal .suggest-product, .select-product-modal .suggest-brand {
    display: block;
}

.select-product-modal .suggest-product .btn-md, .select-product-modal .suggest-brand .btn-md {
    color: #6275ae;
    margin-top: 10px;
}

.p-list-sm, .b-list {
    padding: 10px 0 0 0;
    overflow: hidden;
    overflow-y: scroll;
    margin: 0;
    display: none;
}

.b-list-container {
    padding-bottom: 10px;
}

.b-list-container > .title {
    color: #a4a4a4;
    font-size: 14px;
    font-weight: 900;
}

#product-tag-hits {
    display: block;
}

#suggest-product-panel, #suggest-brand-panel {
    display: none;
}

#suggested-product-brand, #suggested-brand-name {
    margin-top: 15px;
}

.send-btn .send-product-suggestion, .send-btn .send-brand-suggestion {
    background: linear-gradient(111deg, #2d1974 0%, #cd8aed 100%);
    color: white;
    border-radius: 10px;
    display: block;
    text-align: center;
    padding: 12px 0;
    font-weight: 900;
    border: none;
    width: 100%;
    font-size: 17px;
}

.send-btn .error-product-suggestion span, .send-btn .error-brand-suggestion span {
    font-size: 12px;
    color: red;
    display: block;
    margin-top: 3px;
    text-align: center;
}


/* tagged products */

.tagged-products {
    overflow: auto;
    white-space: nowrap;
    -webkit-overflow-scrolling: touch;
    overflow-y: hidden;
    height: 45px;
    padding: 0 0 12px 15px;
}

.tagged-products-text {
    padding: 0 0 0 15px;
    margin-bottom: 5px;
}

.tagged-products > .product, .tagged-products > .brand, .tagged-products > .store {
    background-color: #eff2f7;
    padding: 5px 10px 5px 7px;
    border-radius: 10px;
    display: inline-flex;
    margin-right: 2px;
    max-width: 170px;
    height: 35px;
}

.tagged-products .product > img, .tagged-products .brand > img, .tagged-products .store > img {
    height: 30px;
    width: 30px;
    border-radius: 50%;
    float: left;
    border: 1px solid white;
    margin-top: 1px;
}

.tagged-products .product .info, .tagged-products .brand .info, .tagged-products .store .info {
    padding-left: 5px;
    max-width: 130px;
}

.tagged-products .product .info .brand, .tagged-products .product .info .store {
    font-family: "Space Mono", sans-serif;
    font-size: 13px;
    font-weight: 900;
    display: block;
    color: #6375AE;
    text-transform: uppercase;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    margin-bottom: -3px;
}

.tagged-products .product .info .name {
    font-size: 13px;
    color: #6375AE;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.tagged-products .brand .info .name, .tagged-products .store .info .name {
    font-family: "Space Mono", sans-serif;
    font-weight: 900;
    text-transform: uppercase;
    font-size: 13px;
    color: #6375AE;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    margin-top: 7px;
}

.tagged-products .own-product .info .brand, .tagged-products .own-product .info .name {
    color: white;
}

.tagged-products .product .info .own-brand, .tagged-products .product-feed .info .own-brand {
    color: #a3a3a3;
}

.tagged-products .product .info .own-name, .tagged-products .brand .info .own-name, .tagged-products .product-feed .info .own-name {
    color: #a3a3a3;
}

.tagged-products .selected-product {
    background-color: #7794bc;
    transition: all 0.3s ease-out 0s;
}

.tagged-products .own-product {
    background-color: #cbcbcb;
}

.tagged-products .selected-product img {
    border: 1px solid #7794bc;
}

.tagged-products .own-product img {
    border: 1px solid #cbcbcb;
}

.tagged-products .selected-product .info .brand, .tagged-products .selected-product .info .name {
    color: white;
}

.tag-box .tag-circle {
    width: 35px;
    height: 35px;
    background-color: transparent;
    border-radius: 50%;
    position: absolute;
    border: 3px solid transparent;
}

.tag-box .tag-circle-visible {
    background-color: #ffffffad;
    border: 3px solid #ffffff;
}

.tag-box .tag-circle-flashed {
    background-color: #ffffff5c;
    border: 3px solid #ffffff5c;
    transition: all 0.3s ease-out 0s;
}

.tag-box .selected-tag-circle {
    background-color: #ffffff17;
    border: 3px solid #ffffff;
}

.product-row-end {
    height: 30px;
    width: 10px;
    display: inline-block;
}

.tagged-product, .tagged-brand, .tagged-store {
    position: absolute;
    z-index: 4;
}

.tagged-product .product, .tagged-brand .brand, .tagged-store .store {
    background-color: #eff2f7cc;
    padding: 5px 10px 5px 7px;
    border-radius: 10px;
    display: inline-block;
    margin-right: 2px;
    cursor: pointer;
}

.tagged-product .product:after, .tagged-brand .brand:after, .tagged-store .store:after {
    content: " ";
    position: absolute;
    left: 12px;
    top: -8px;
    border-top: none;
    border-right: 8px solid transparent;
    border-left: 8px solid transparent;
    border-bottom: 8px solid #eff2f7cc;
}

.tagged-product .product img, .tagged-brand .brand img, .tagged-store .store img {
    width: 25px;
    height: 25px;
    border-radius: 50%;
    float: left;
    border: 1px solid #E2E2E2;
    margin-top: 1px;
}

.tagged-product .product .info {
    padding-left: 33px;
}

.tagged-product .product .info .brand {
    font-family: "Space Mono", sans-serif;
    font-size: 12px;
    font-weight: 900;
    display: block;
    color: #6375AE;
    text-transform: uppercase;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    margin-bottom: -3px;
}

.tagged-product .product .info .name {
    font-size: 12px;
    color: #6375AE;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.tagged-brand .brand .name, .tagged-store .store .name {
    font-family: "Space Mono", sans-serif;
    font-size: 12px;
    font-weight: 900;
    color: #6375AE;
    text-transform: uppercase;
    margin-bottom: 0;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    margin-top: 6px;
    margin-left: 4px;
    float: left;
}

.tagged-product .product .info .own-product, .select-product .product .info .own-product, .select-product .list > div > .brand .own-brand {
    color: #a3a3a3 !important;
}

.tagged-product .product .remove-product, .tagged-brand .brand .remove-brand, .tagged-store .store .remove-store {
    float: left;
    width: 25px;
    height: 20px;
    margin: 2px 0 0 5px;
    text-align: center;
    padding-top: 4px;
    margin-left: 0px;
    display: none;
    cursor: pointer;
}

.tagged-product .product .remove-product i, .tagged-brand .brand .remove-brand i, .tagged-store .store .remove-store i {
    font-size: 16px;
    color: #6275ae8a;
}

/* Photo */

.canvas-box,
.video-clip-preview {
    position: relative;
}

.canvas-box-promo {
    display: none;
}

.canvas-box .left-btn,
.video-clip-preview .left-btn {
    position: absolute;
    background-color: #6275aeb3;
    left: 12px;
    font-size: 16px;
    top: 15px;
    padding: 10px 16px;
    border-radius: 20px;
    color: #ffffff;
    border: 2px solid #ffffff;
    display: none;
    font-weight: 900;
    z-index: 4;
    cursor: pointer;
}

.canvas-box .left-btn i,
.video-clip-preview .left-btn i{
    font-size: 12px;
    color: #ffffff;
}

.canvas-box .classify-product,
.video-clip-preview .classify-product {
    top: 65px;
}

.canvas-box .product-version,
.video-clip-preview .product-version {
    top: 90px;
}

.review-media-1-btn, .photo-media-1-btn, .video-media-1-btn {
    top: 15px !important;
}

.canvas-box .sort-up,
.video-clip-preview .sort-up {
    position: absolute;
    background-color: #6275ae8c;
    right: 12px;
    font-size: 14px;
    top: 15px;
    border-radius: 20px;
    color: #ffffff;
    border: 2px solid #ffffff;
    display: none;
    font-weight: 900;
    width: 35px;
    height: 35px;
    text-align: center;
    z-index: 4;
    cursor: pointer;
}

.canvas-box .sort-up i,
.video-clip-preview, .sort-up i {
    font-size: 23px;
    color: white;
    margin-top: 10px;
}

.canvas-box .sort-down,
.video-clip-preview .sort-down {
    position: absolute;
    background-color: #6275ae8c;
    right: 12px;
    font-size: 14px;
    top: 60px;
    border-radius: 20px;
    color: #ffffff;
    border: 2px solid #ffffff;
    display: none;
    font-weight: 900;
    width: 35px;
    height: 35px;
    text-align: center;
    z-index: 4;
    cursor: pointer;
}

.canvas-box .sort-down i,
.video-clip-preview .sort-down i {
    font-size: 23px;
    color: white;
    margin-top: 2px;
}

.canvas-box .tag-product-dialog,
.video-clip-preview .tag-product-dialog {
    position: absolute;
    background-color: #6275ae8c;
    top: 0;
    bottom: 15px;
    left: 0;
    right: -1px;
    text-align: center;
    font-size: 16px;
    font-weight: 500;
    display: none;
    border-radius: 10px;
    z-index: 1;
    overflow: hidden;
    cursor: pointer;
}

.video-clip-preview .tag-product-dialog {
    bottom: 0;
}

.canvas-box .tag-product-dialog span,
.video-clip-preview .tag-product-dialog span {
    font-size: 18px;
    color: #ffffff;
    position: absolute;
    top: 0;
    bottom: 0;
    margin-top: auto;
    margin-bottom: auto;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0 40px;
}

.canvas-box .media-overlay-menu,
.video-clip-preview .media-overlay-menu {
    position: absolute;
    background-color: #6275aead;
    top: 0;
    bottom: 0;
    left: 0;
    right: -1px;
    text-align: center;
    font-size: 16px;
    font-weight: 500;
    display: none;
    border-radius: 10px;
    z-index: 5;
    min-height: 400px;
}


.canvas-box .media-overlay-menu .question,
.video-clip-preview .media-overlay-menu .question {
    position: absolute;
    top: 0;
    bottom: 0;
    margin-top: auto;
    margin-bottom: auto;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0 40px;
}

.canvas-box .media-overlay-menu,
.video-clip-preview .media-overlay-menu {
    background-color: #6275aead;
}

.canvas-box .media-overlay-menu .question .bg,
.video-clip-preview .media-overlay-menu .question .bg {
    display: block;
}

.canvas-box .media-overlay-menu .question .bg > .title,
.video-clip-preview .media-overlay-menu .question .bg > .title {
    margin-bottom: 20px;
}

.canvas-box .media-overlay-menu .question .title .text,
.video-clip-preview .media-overlay-menu .question .title .text {
    font-size: 22px;
    color: #ffffff;
    font-weight: 900;
}

.canvas-box .media-overlay-menu .question .subtitle .text,
.video-clip-preview .media-overlay-menu .question .subtitle .text {
    font-size: 16px;
    color: #ffffff;
    font-weight: 500;
    margin-bottom: 20px;
    display: block;
    margin-top: -10px;
}

.canvas-box .media-overlay-menu .question .options .option,
.video-clip-preview .media-overlay-menu .question .options .option {
    margin-bottom: 10px;
    padding: 8px 15px;
    border-radius: 15px;
    background-color: #fff1ec;
    border: 2px solid #FFA3A3;
    display: inline-block;
    margin-right: 7px;
}

.canvas-box .media-overlay-menu .question .options .selected,
.video-clip-preview .media-overlay-menu .question .options .selected {
    background-color: #ffa3a3;
    border: 1px solid #ffa3a3;
}

.canvas-box .media-overlay-menu .question .options .option .title,
.video-clip-preview .media-overlay-menu .question .options .option .title {
    color: #FFA3A3;
    font-size: 16px;
    display: block;
    font-weight: 900;
}

.canvas-box .media-overlay-menu .question .options .option .title i,
.video-clip-preview .media-overlay-menu .question .options .option .title i {
    color: #FFA3A3
}

.canvas-box .media-overlay-menu .question .options .option .description,
.video-clip-preview .media-overlay-menu .question .options .option .description {
    color: #9c8a8a;
    font-size: 14px;
    line-height: 16px;
    display: block;
}

.canvas-box .media-overlay-menu .question .options .selected .title,
.canvas-box .media-overlay-menu .question .options .selected .title i,
.canvas-box .media-overlay-menu .question .options .selected .description,
.video-clip-preview .media-overlay-menu .question .options .selected .title,
.video-clip-preview .media-overlay-menu .question .options .selected .title i,
.video-clip-preview .media-overlay-menu .question .options .selected .description {
    color: white;
}

.canvas-box .media-overlay-menu .question .options .close,
.video-clip-preview .media-overlay-menu .question .options .close,
.canvas-box .media-overlay-menu .question .groups .close,
.video-clip-preview .media-overlay-menu .question .groups .close {
    color: white;
    margin-top: 25px;
    cursor: pointer;
}

.canvas-box .media-overlay-menu .question .options input,
.video-clip-preview .media-overlay-menu .question .options input {
    background-color: white;
    border: none;
    width: 100%;
    padding-left: 10px;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 5px;
    height: 40px;
    margin-bottom: 15px;
}

.canvas-box .media-overlay-menu .question .groups,
.video-clip-preview .media-overlay-menu .question .groups {

}

.canvas-box .media-overlay-menu .question .groups .group,
.video-clip-preview .media-overlay-menu .question .groups .group {
    border: 1px solid #6E6E6E;
    color: #6E6E6E;
    margin-bottom: 8px;
    margin-right: 4px;
    background-color: white;
    border-radius: 15px;
    padding: 12px;
    cursor: pointer;
}

.canvas-box .media-overlay-menu .question .groups .group .title,
.video-clip-preview .media-overlay-menu .question .groups .group .title {
    color: #ff9e9e;
    font-size: 18px;
    font-weight: 900;
}

.canvas-box .media-overlay-menu .question .groups .group .title i,
.video-clip-preview .media-overlay-menu .question .groups .group .title i {
    color: #ff9e9e;
    font-size: 20px;
}

.canvas-box .media-overlay-menu .question .groups .group .description,
.video-clip-preview .media-overlay-menu .question .groups .group .description {
    color: #6E6E6E;
    font-size: 14px;
    display: block;
    line-height: 14px;
    margin-top: 5px;
}

.canvas-box .media-overlay-menu .question .groups .selected,
.video-clip-preview .media-overlay-menu .question .groups .selected {
    background-color: #ff9d9d;
    border: 1px solid #ff9d9d;
}

.canvas-box .media-overlay-menu .question .groups .selected .title,
.video-clip-preview .media-overlay-menu .question .groups .selected .title,
.canvas-box .media-overlay-menu .question .groups .selected .title i,
.video-clip-preview .media-overlay-menu .question .groups .selected .title i,
.canvas-box .media-overlay-menu .question .groups .selected .description,
.video-clip-preview .media-overlay-menu .question .groups .selected .description {
    color: white;
}

.video-clip-preview .video-js {
    border-radius: 10px;
}

.hidden-list {
    display: none;
}

.tags-present {
    height: 35px;
    width: 35px;
    background-color: #00000057;
    border-radius: 50%;
    position: absolute;
    right: 12px;
    top: 12px;
    text-align: center;
    z-index: 10;
    display: none;

}

.tags-present i {
    color: #eff2f7;
    margin-top: 11px;
    font-size: 14px;
}

.tags-present-multiple-images {
    top: 45px;
}

.no-content-feed {
    padding: 40px 25px 25px 25px;
    text-align: center;
}

.no-content-feed .icon {
    display: block;
    margin-bottom: 5px;
}

.no-content-feed .icon i {
    font-size: 25px;
    color: #707e85;
}

.no-content-feed .title {
    font-weight: 900;
    font-size: 25px;
    display: block;
    margin-bottom: 10px;
    color: #988b9e;
}

.no-content-feed .subtitle {
    display: block;
    margin-bottom: 15px;
    line-height: 20px;
    color: #988b9e;
}

.no-content-feed .subtitle a {
    color: #988b9e;
}

.no-content-feed .transparent-btn {
    background-color: transparent;
    color: #6277ae;
}

.add-photo, .add-video {
    display: none;
}

.orders-feed {
    background-color: white;
    padding-top: 15px;
}

.feed .text .title-sm span,
.feed .text .title span,
.feed .text-body,
.feed .text .container .code,
.feed .text .image,
.feed .link .title,
.feed .photo .title span,
.feed .photo .title a,
.feed .video .title,
.feed .question .image,
.feed .review .image,
.feed .question-group,
.feed .general-rating,
.feed .product-version-row
 {
    cursor: pointer;
}

.tags-present,
.tag-circle {
    cursor: pointer;
}

@media (min-width: 320px) {

    .no-content-feed { min-height: 400px; }

}

@media (min-width: 360px) {

    .no-content-feed { min-height: 460px; }

}

@media (min-width: 375px) {

    .no-content-feed { min-height: 470px; }

}

@media (min-width: 412px) {

    .no-content-feed {
        min-height: 650px;
        max-width: 360px;
        margin: auto;
    }

}

@media (min-width: 680px) {

    .post .image .right-btn, .post .video .right-btn, .post .review-clip .right-btn {
        width: 50px;
        height: 50px;
    }

    .post .image .right-btn i, .post .video .right-btn i, .post .review-clip .right-btn i {
        margin-top: 12px;
    }

    .tagged-products > a:hover {
        background-color: #e4eaf2;
    }

    .text .question-show-headline .question-group .bg:hover {
        background-color: #f7f7f7;
    }

    .tagged-products .selected-product:hover {
        background-color: #6d8cb6;
        transition: initial;
    }

    .text .product-version-row .text-version-container .bg:hover,
    .photo .product-version-row .text-version-container .bg:hover,
    .video .product-version-row .text-version-container .bg:hover {
        background-color: white;
    }

    .back-ribbon-post {
        max-width: 600px;
    }

    .back-ribbon-placeholder {
        max-width: 600px;
    }

    .back-ribbon-post {
       max-width: 600px;
    }

    .post-show .interactions-wrapper {
        max-width: 600px;
    }

    .post-show .interactions {
        max-width: 600px;
    }

    .post-show .review-specs-ratings .specs .col {
        width: 25%;
    }

    .root-modal {
        background-color: #f0eef3;
        height: 100vh;
    }

    .root-modal > .container {
        max-width: 600px;
        margin: auto;
    }

    .root-modal > .container > .header {
        padding: 25px 0;
    }

    .root-modal .container .header .biutest-lg {
        height: 30px;
        width: 135px;
        display: block;
        margin: auto;
    }

    .root-modal .container .header .biutest-lg .biutest-logo {
        width: 135px;
    }

    .root-modal .container .primary-column {
        overflow: hidden;
        overflow-y: scroll;
        border-radius: 15px;
        background-color: #f0eef3;
    }

    .canvas-box .media-overlay-menu .question .groups .group,
    .video-clip-preview .media-overlay-menu .question .groups .group {
        max-width: 280px;
    }

    .canvas-box .media-overlay-menu .question .groups .group .title,
    .video-clip-preview .media-overlay-menu .question .groups .group .title {
        font-size: 20px;
        display: block;
        margin-bottom: 10px;
    }

    .canvas-box .media-overlay-menu .question .groups .group .description,
    .video-clip-preview .media-overlay-menu .question .groups .group .description {
        font-size: 16px;
        line-height: 16px;
        margin-bottom: 8px;
    }

    .select-product-modal {
        width: 600px;
    }

}

@media (min-width: 960px) {

    .post .header, .post-promo-exclusive .header {
        padding: 15px 15px 5px 15px;
    }

    .post .text .container {
        padding: 0 20px;
    }

    .interactions > .container {
        padding: 0 15px;
    }

    .interactions > .container > .row > .container > .vote > span {
        width: 40px;
        padding-left: 5px;
        padding-right: 5px;
        text-align: center;
    }

    .text .footer .footer-container .button {
        padding: 6px 15px;
        font-size: 15px;
    }

    .text .footer .footer-container .text {
        padding-top: 5px;
    }

    .text .footer .footer-container .text span {
        font-size: 14px;
    }


}
/* article cards */

.article-cards {
	padding: 0 15px;
	max-width: 383px;
	background-color: white;
	padding-bottom: 1px;
}

.article-cards .card {
	border-radius: 15px;
	overflow: hidden;
	position: relative;
	margin-bottom: 30px;
}

.article-cards .card > .img-container {
	height: 360px;
    width: 100%;
    position: relative;
    text-align: left;
    display: flex;
    overflow: hidden;
    justify-content: center;
    background-color: #e9baa4;
}

.article-cards .card > .img-container > img {
	height: 100%;
}

.article-cards .card > .img-container > .info-txt {
	position: absolute;
    padding: 15px;
    left: 0;
}

.article-cards .card > .img-container > .info-txt > .subtitle {
	text-transform: uppercase;
    display: block;
    color: white;
    margin-bottom: 5px;
}

.article-cards .card > .img-container > .info-txt > .title {
	font-weight: 900;
    font-size: 22px;
    line-height: 24px;
    color: white;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}

.article-cards .card > .img-container > .info-txt-bottom {
	position: absolute;
	left: 0;
    bottom: 15px;
    padding: 0 15px;
}

.article-cards .card > .img-container > .info-txt-bottom > .extract {
    color: white;
    font-size: 14px;
}

/* interests */


.follow-interests {
    background-color: white;
    padding: 0 15px 15px 15px;
    margin-bottom: 7px;
    display: table;
    width: 100%;
}

.follow-interests .title {
    font-size: 20px;
    font-weight: 900;
    color: #b9b9b9;
    display: block;
}

.follow-interests .buttons {
    padding: 10px 0;
}

.follow-interests .button-container {
    
}

.follow-interests .buttons span {
    font-size: 16px;
    padding: 10px 12px;
    border: 1px solid #6E6E6E;
    color: #6E6E6E;
    border-radius: 20px;
    margin-bottom: 8px;
    margin-right: 4px;
    font-weight: 500;
    float: left;
}

.follow-interests .interest-cat {
    
}

.follow-interests .interest-subcat {
    background-color: #FFFDE7;
}

.follow-interests .interest-subsubcat {
    background-color: #E8F5E9;
}

.follow-interests .buttons .active {
    background-color: #ff9f9f;
    color: white;
    border: 1px solid #ff9f9f;
}

/* list of brands */

.title-panel-column-letters {
    padding-right: 50px;
}

.horizontal-menu-column-letters {
    padding: 0 15px 15px 15px;
}

.letters {
  margin-top: -20px;
  margin-bottom: 30px;
  padding-right: 15px;
}

.letter > .title {
    text-align: left;
    border-bottom: 1px solid #232323;
    margin-left: 15px;
    clear: left;
    height: 35px;
    padding-top: 20px;
}

.letter > .title > span {
    display: inline-block;
    font-size: 24px;
    font-weight: 700;
    color: #656565;
}

.letter > .title > .anchor {
    display: block;
    position: relative;
    top: -40px;
    visibility: hidden;
}

.letter .brand-cards {
    margin: 15px -15px 0px 0px;
}

.abc-col-bg {
    position: fixed;
    background-color: #ffefec;
    right: 0;
    width: 50px;
    height: 100%;
    z-index: 1;
}

.abc-col-box {
    position: fixed;
    background-color: #ffefec;
    right: 0;
    width: 50px;
    height: auto;
    text-align: center;
    top: 0;
    padding-top: 60px;
    z-index: 2;
}

.abc-col-box a {
    font-weight: 700;
    color: #656565;
    display: block;
    height: 16px;
}


/* brand profile header */

.top-profile {
    position: relative;
    text-align: left;
    z-index: 12;
}

.brand-profile-bottom {
    margin-bottom: 7px;
}

.top-profile > .container {
    background-color: white;
    width: 100%;
    z-index: 29;
}

.top-profile > .container > .header {
    height: 150px;
    width: 100%;
    position: relative;
    text-align: center;
    justify-content: center;
    overflow: hidden;
    background-color: #e6e6e6;
}

.top-profile > .container > .header > .about {
    width: 100%;
    margin-top: -50px;
}

.top-profile > .container > .header > .about-placeholder {
    width: 100%;
    height: 120px;
    background-color: #eee6f1;
}

.top-profile > .container .profile {
    height: 80px;
    width: 80px;
    border-radius: 50%;
    border: 3px solid white;
    position: absolute;
    top: 80px;
    left: 15px;
    background-color: white;
}

.top-profile > .container > .profile-placeholder {
    height: 80px;
    width: 80px;
    border-radius: 50%;
    border: 3px solid white;
    position: absolute;
    top: 50px;
    left: 15px;
    background-color: #eeeeee;
}

.top-profile > .container > .info {
    padding: 15px 15px 5px 15px;
}

.top-profile > .container > .info > .top {
    width: 100%;
    display: table;
    margin-bottom: 3px;
}

.top-profile > .container > .info > .top > .brand {
    font-family: "Space Mono", sans-serif;
    font-size: 20px;
    float: left;
    text-transform: uppercase;
}

.top-profile > .container > .info > .top > .not-brand {
    font-size: 20px;
    font-weight: 900;
    float: left;
}

.top-profile > .container > .info > .top > .not-brand i {
    font-size: 14px;
    float: right;
    margin-top: 5px;
    margin-left: 4px;
    color: #cdcdcd;
}

.top-profile > .container > .info > .top > .follow > .follow-btn {
    padding: 5px 12px;
    border-radius: 15px;
    float: right;
    margin-top: -2px;
    font-size: 14px;
    cursor: pointer;
    background: linear-gradient(111deg, #2d1974 0%, #cd8aed 100%);
    color: white;
}

.top-profile-path > .container > .info > .top > .follow > .follow-btn {
    margin-top: -5px;
}

.top-profile > .container > .info > .top > .follow > .follow-btn i {
    font-size: 12px;
    color: white;
}

.top-profile > .container > .info > .description {
    height: 31px;
    position: relative;
    overflow: hidden;
}

.top-profile > .container > .info > .active {
    height: auto;
}

.top-profile > .container > .info > .category-path {
    height: 20px;
    display: block;
}

.top-profile > .container > .info > .category-path a {
    font-size: 12px;
    color: #8d7398;
}

.top-profile > .container > .info > .category-path span {
    font-size: 12px;
    color: gray;
}

.top-profile > .container > .info > .description > span {
    font-size: 12px;
    color: #808080;
    overflow: hidden;
    text-overflow: ellipsis;
    display: inline-block;
    line-height: 16px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;    
}

.top-profile > .container > .info > .description > .see-more {
    font-size: 12px;
    color: #8d7398;
    position: absolute;
    bottom: 0;
    right: 0;
    background-color: white;
    padding-left: 10px;
    cursor: pointer;
}

.community-mod-panel {
    background-color: white;
    padding: 8px 0 4px 0;
    position: relative;
}

.top-profile > .container .community-mod-panel .mod-panel, 
.home-mod-panel .mod-panel {
    background-color: #F9EFEC;
    height: 48px;
}

.home-mod-panel .alert-panel {
    background-color: #ffc107;
    height: 45px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.home-mod-panel .green-panel {
    background-color: #4caf50;
    height: 45px;
}

.top-profile > .container .community-mod-panel .mod-panel .text,
.home-mod-panel .mod-panel .text {
    font-size: 16px;
    color: #B49A92;
    font-weight: 900;
    margin-top: 15px;
    display: inline-block;
    margin-left: 15px;
}

.home-mod-panel .alert-panel .text,
.home-mod-panel .green-panel .text {
    font-size: 16px;
    color: white;
    font-weight: 900;
    margin-left: 15px;
}

.home-mod-panel .text-right {
    color: white;
    font-weight: 900;
    margin-right: 10px;
    padding: 6px 12px;
    border: 1px solid white;
    border-radius: 15px;
    font-size: 13px;
}

.home-mod-panel .alert-panel .text i,
.home-mod-panel .green-panel .text i {
    color: white;
    margin-right: 3px;
}

.top-profile > .container .community-mod-panel .mod-panel .icons,
.home-mod-panel .mod-panel .icons {
    float: right;
}

.top-profile > .container .community-mod-panel .mod-panel .icons .icon,
.home-mod-panel .mod-panel .icons .icon {
    width: 40px;
    display: inline-block;
    position: relative;
    height: 45px;
}

.top-profile > .container .community-mod-panel .mod-panel .icons .icon i,
.home-mod-panel .mod-panel .icons .icon i {
    color: #B49A92;
    font-size: 22px;
    float: left;
    margin-top: 11px;
}

.top-profile > .container .community-mod-panel .mod-panel .icons .icon div,
.home-mod-panel .mod-panel .icons .icon div {
    background-color: #FF5072;
    border-radius: 50%;
    height: 15px;
    width: 15px;
    text-align: center;
    position: relative;
    top: 20px;
    right: -12px;
}

.top-profile > .container .community-mod-panel .mod-panel .icons .icon div span,
.home-mod-panel .mod-panel .icons .icon div span {
    font-size: 10px;
    color: white;
    font-weight: 900;
    margin-top: 2px;
    position: absolute;
    top: 0px;
    right: 0;
    letter-spacing: -1px;
    left: -1px;
}

.marketplace-panel {
    background-color: #fbf1ee;
    padding: 10px 15px;
    margin-top: 10px;
    display: flex;
    align-items: center;
}

.marketplace-panel .left-col {
    width: 45px;
}

.marketplace-panel .left-col .icon {
    width: 35px;
    height: 35px;
    background: linear-gradient(111deg, #8bc34a 0%, #4caf50 100%);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.marketplace-panel .left-col .icon-gray {
    background: linear-gradient(111deg, gray 0%, #c6c6c6 100%);
}

.marketplace-panel .left-col .icon .fa-shopping-cart {
    font-size: 17px;
    color: white;
    margin-left: -2px;
}

.marketplace-panel .left-col .icon .fa-times {
    font-size: 18px;
    color: white;
}

.marketplace-panel .right-col {
    padding-left: 10px;
}

.marketplace-panel .right-col .text {
    color: #8D8380;
    font-size: 15px;
    font-weight: 500;
}

.marketplace-panel .right-col .see-more {
    font-size: 13px;
    color: #8D8380;
}

.marketplace-panel-space {
    width: 100%;
    height: 10px;
    background-color: white;
}

.top-profile > .container > .giveaway {
    padding: 0 15px;
    margin-top: 8px;
    height: 90px;
}

.product-profile .giveaway {
    padding: 15px 15px 20px 15px;
    margin-top: 0;
    height: 90px;   
}

.top-profile > .container > .giveaway > a > .container, .product-profile .giveaway > a > .container {
    position: relative;
    border-radius: 15px;
    background-color: #ffe7e7;
}

.top-profile > .container > .giveaway > a > .container > img, .product-profile .giveaway > a > .container > img {
    width: 90px;
    height: 90px;
    border-top-left-radius: 15px;
    border-bottom-left-radius: 15px;
    position: absolute;
    top: 0;
    left: 0;
}

.top-profile > .container > .giveaway > a > .container > .info, .product-profile .giveaway > a > .container > .info {
    background-color: #FCF2EF;
    padding: 10px;
    margin-left: 90px;
    height: 70px;
    border-top-right-radius: 15px;
    border-bottom-right-radius: 15px;
}

.top-profile > .container > .giveaway > a > .container > .info > .title, .product-profile .giveaway > a > .container > .info > .title {
    display: block;
    font-weight: 900;
    margin-bottom: 2px;
    font-size: 14px;
}

.top-profile > .container > .giveaway > a > .container > .info > .name, .product-profile .giveaway > a > .container > .info > .name {
    font-weight: 900;
    font-size: 18px;
    margin-bottom: 5px;
    display: block;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.top-profile > .container > .giveaway > a > .container > .info > div, .product-profile .giveaway > a > .container > .info > div {
    background-color: #ffa3a3;
    border-radius: 15px;
    padding: 4px 12px;
    display: inline-block;
    color: #ffffff;
    font-size: 12px;
    font-weight: 500;
}

.promo-carousel {
    display: flex;
    flex-wrap: nowrap;
    overflow: auto;
    padding: 0 15px;
    -webkit-overflow-scrolling: touch;
    overflow-y: hidden;
    margin-bottom: 30px;
}

.promo-card {
    border-radius: 10px;
    border: 1px solid #E6E6E6;
    padding: 15px;
    margin-right: 15px;
}


.promo-card .header {
    display: flex;
    margin-bottom: 10px;
    align-items: center;
}

.promo-card .header img {
    width: 15px;
    height: 15px;
    border-radius: 50%;
    margin-right: 5px;
}

.promo-card .header .store {
    font-size: 14px;
    color: #777777;
}

.promo-card .info {
    width: 198px;
    display: flex;
    flex-direction: column;
}

.promo-card .info .title {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    margin-bottom: 8px;
    font-size: 20px;
    font-weight: 500;
    line-height: 22px;
}

.promo-card .info .body {
    font-size: 14px;
    color: #777777;
    line-height: 18px;
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow: hidden;
    margin-bottom: 10px;
}

.promo-card .info .minimum {
    margin-bottom: 15px;
}

.promo-card .info .minimum span {
    background-color: #EFEDF2;
    border-radius: 5px;
    padding: 5px 10px;
    color: #777777;
    font-size: 13px;
}

.promo-card .info .code {
    display: block;
    margin-bottom: 15px;
}

.promo-card .info .code span {
    background: linear-gradient(111deg, #ff5171 0%, #ea2549 100%);
    padding: 8px 12px;
    display: inline-block;
    border-radius: 4px;
    font-weight: 900;
    color: white;
    font-size: 14px;
}

.promo-card .btn-md {
    margin-left: 0;
}

.seller-shippings {
    padding: 5px 15px 0 15px;
}

.seller-shippings .seller-shipping {
    border: 1px solid #D5D9D9;
    background-color: #F8F8F8;
    padding: 15px;
    border-radius: 10px;
    display: flex;
    margin-bottom: 15px;
}

.seller-shippings .seller-shipping .left-col {
    width: 40px;
    display: flex;
    align-items: center;
}

.seller-shippings .seller-shipping .left-col i {
    font-size: 18px;
    color: #A291AC;
}

.seller-shippings .seller-shipping .right-col {
    
}

.seller-shippings .seller-shipping .right-col .text {
    color: #575959;
    font-weight: 500;
}

.seller-shippings .seller-shipping .right-col .text .purple {
    color: #422E83;
    font-weight: 900;
}

.seller-shippings .seller-shipping .right-col .text .red {
    color: #E44160;
    font-weight: 900;
}


/* brand card */

.brand-card {
    width: 50%;
    float: left;
    margin-bottom: 15px;
}

.categories-card {
    width: 100%;
    margin-bottom: 15px;
}

.brand-card:nth-child(2n+1) .container {
    padding-right: 7px;
}

.brand-card:nth-child(2n+2) .container {
    padding-left: 7px;
}

.brand-card .container .card-container, .categories-card .container {
    position: relative;
}

.brand-card .header, .categories-card .header {
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;
    overflow: hidden;
    height: 100px;
    background-color: #e6e6e6;
}

.brand-card .header img, .categories-card .header img {
    width: 100%;
    position: relative;
    text-align: center;
    justify-content: center;
    overflow: hidden;
    background-color: #fce8e1;
}

.categories-card .header img {
    margin-top: -72px;
}

.brand-card .profile-photo, .categories-card .profile-photo {
    width: 65px;
    height: 65px;
    border-radius: 50%;
    position: absolute;
    top: 45px;
    left: 8px;
    background-color: white;
    border: 2px solid white;
    overflow: hidden;
}

.brand-card .profile-photo img, .categories-card .profile-photo img {
    width: 100%;
}

.brand-card:nth-child(2n+2) .profile-photo {
    left: 8px;
}

.brand-card .info, .categories-card .info {
    background-color: #f2f2f2;
    padding: 15px 15px 18px 15px;
    border-bottom-left-radius: 15px;
    border-bottom-right-radius: 15px;
    height: 61px;
}

.brand-card .info .brand-card-name {
    font-family: "Space Mono", sans-serif;
    font-weight: 900;
    text-transform: uppercase;
    color: #656565;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    line-height: 19px;
    position: relative;    
}

.brand-card .info .not-brand-card-name {
    font-weight: 900;
    color: #656565;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    line-height: 19px;
    position: relative;        
}

.brand-card .footer {
    background-color: #f2f2f2;
    width: 100%;
    height: 15px;
    margin-top: -15px;
    border-bottom-left-radius: 15px;
    border-bottom-right-radius: 15px;
    position: absolute;
}

.categories-card .info .category-card-name {
    font-weight: 900;
    color: #656565;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    height: 25px;
    position: relative;
    font-size: 18px;
}

.categories-card .info .category-card-name i {
    font-size: 12px;
    margin-right: 1px;
    color: #adadad;
}

.brand-card .info .brand-card-about, .categories-card .info .brand-card-about {
    font-size: 12px;
    color: #868686;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    height: 42px;
    position: relative;
}


/* Article Row */

.article-card-h {
    margin-bottom: 15px;
    display: table;
    width: 100%;
}

.article-card-h .image {
    width: 50%;
    background-color: gray;
    border-top-left-radius: 15px;
    border-bottom-left-radius: 15px;
    float: left;
    overflow: hidden;
}

.article-card-h .image img {
    width: 100%;
    margin-bottom: -5px;
}

.article-card-h .info {
    width: 50%;
    height: 125px;
    float: left;
    background-color: #fcf2ee;
    border-top-right-radius: 15px;
    border-bottom-right-radius: 15px;
}

.article-card-h .info .container {
    padding: 15px;
}

.article-card-h .info .container .title {
    font-weight: 900;
    display: block;
    line-height: 16px;
    display: -webkit-box;
    -webkit-line-clamp: 5;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.article-card-h .info .container .date {
    font-size: 12px;
    color: gray;
    margin-top: 10px;
}


/* Categories Index*/

.categories, .index-specs {
    padding: 15px 15px 30px 15px;
    background-color: white;
}

.categories .container, .index-specs .container {
    margin-bottom: 40px;
    display: table;
    width: 100%;
}

.category-row {
    height: 52px;
    display: block;
}

.category-row  img {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    border: 1px solid lightgrey;
    float: left;
}

.category-row  .info {
    padding-left: 65px;
}

.category-row  .info > .name {
    display: block;
    font-weight: 900;
    margin-bottom: 2px;
    font-size: 18px;
}

.category-row  .info > .description {
    font-size: 12px;
    line-height: 14px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.selected-category-row {
    background-color: #ffeded;
    padding: 10px 5px;
    border-radius: 15px;
}

.categories .category-open {
    display: table;
    width: 100%;
}

.categories .category-open > .col {
    width: 60px;
    height: 50px;
    float: left;
}

.categories .category-open > .col .left {
    width: 25px;
    float: left;
    height: 35px;
}

.categories .category-open > .col .right {
    width: 33px;
    float: left;
    height: 35px;
}

.categories .category-open > .col .right .top {
    width: 34px;
    height: 30px;
    float: left;
    border-left: 1px solid #d5d5d5;
    border-bottom: 1px solid #d5d5d5;
}

.categories .category-open > .col .right .bottom {
    width: 37px;    
    height: 21px;
    float: left;
}

.categories .category-open > .open {
    margin-top: 10px;
    margin-left: 6px;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;      
}

.categories .category-open .open-container {
    /*margin-left: 6px;*/
}

/*.categories .category-open > .open span {
    font-size: 14px;
    color: #b2b2b2;
    font-weight: 500;
    line-height: 14px;  
}*/

.categories .category-collapse {
    display: none;   
}

.categories .subcategory-container {
    
}

.categories .subcategory-left {
    width: 36px;
    float: left;
}

.categories .subcategory-left .left {
    width: 25px;
    float: left;
    height: 82px;
}

.categories .subcategory-left .right {
    width: 10px;
    float: left;
    height: 82px;
}

.categories .subcategory-left .right .top {
    border-left: 1px solid #d5d5d5;
    border-bottom: 1px solid #d5d5d5;
    width: 100%;
    height: 58px;
}

.categories .subcategory-left .right .bottom {
    border-left: 1px solid #d5d5d5;
    height: 23px;
}

.categories .subcategory-right {
    padding-top: 30px;
}

.categories .subcategory-row {
    height: 52px;
    display: block;
}

.categories .subcategory-row  img {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    border: 1px solid lightgrey;
    float: left;
}

.categories .subcategory-row  .info {
    padding-left: 101px;
}

.categories .subcategory-row  .info > .name {
    display: block;
    font-weight: 900;
    margin-bottom: 2px;
    font-size: 18px;
}

.categories .subcategory-row  .info > .description {
    font-size: 12px;
    line-height: 14px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.categories .subcategory-open {
    display: table;
    width: 100%;
}

.categories .subcategory-open .col-cat {
    width: 50px;
    height: 49px;
    float: left;
}

.categories .subcategory-open .col-cat .left {
    width: 25px;
    float: left;
    height: 49px;
}

.categories .subcategory-open .col-cat .right {
    width: 24px;
    float: left;
    height: 49px;
    border-left: 1px solid #d5d5d5;
}

.categories .subcategory-open .col-subcat {
    width: 42px;
    height: 49px;
    float: left;
}

.categories .subcategory-open .col-subcat .left {
    width: 12px;
    float: left;
    height: 49px;
}

.categories .subcategory-open .col-subcat .right {
    width: 30px;
    float: left;
    height: 49px;
}

.categories .subcategory-open .col-subcat .right .top {
    width: 28px;
    height: 28px;
    float: left;
    border-left: 1px solid #d5d5d5;
    border-bottom: 1px solid #d5d5d5;
}

.categories .subcategory-open .col-subcat .right .bottom {
    width: 28px;
    height: 21px;
    float: left;
}

.categories .subcategory-open .open {
    margin-top: 8px;
}

.categories .subcategory-open .open .open-container {
    
}

/*.categories .subcategory-open .open span {
    font-size: 14px;
    color: #b2b2b2;
    font-weight: 500;
    line-height: 15px;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;    
}*/

.categories .subcategory-collapse {
    display: none;
}

.categories .subcategory-collapse .subsubcategory-left {
    width: 76px;
    height: 52px;
    float: left;
}

.categories .subcategory-collapse .subsubcategory-left .subsubcategory-inner-left {
    width: 50px;
    height: 52px;
    float: left;
}

.categories .subcategory-collapse .subsubcategory-left .subsubcategory-inner-left .left {
    width: 25px;
    float: left;
    height: 52px;
}

.categories .subcategory-collapse .subsubcategory-left .subsubcategory-inner-left .right {
    width: 24px;
    float: left;
    height: 52px;
    border-left: 1px solid #d5d5d5;
}

.categories .subcategory-collapse .subsubcategory-left .subsubcategory-inner-right  {
    width: 25px;
    height: 52px;
    float: left;
}

.categories .subcategory-collapse .subsubcategory-left .subsubcategory-inner-right .left {
    width: 12px;
    float: left;
    height: 52px;
}

.categories .subcategory-collapse .subsubcategory-left .subsubcategory-inner-right .right {
    width: 13px;
    float: left;
    height: 52px;
}

.categories .subcategory-collapse .subsubcategory-left .subsubcategory-inner-right .right .top {
    width: 13px;
    height: 27px;
    float: left;
    border-left: 1px solid #d5d5d5;
    border-bottom: 1px solid #d5d5d5;
}

.categories .subcategory-collapse .subsubcategory-left .subsubcategory-inner-right .right .bottom {
    width: 12px;
    height: 24px;
    float: left;
    border-left: 1px solid #d5d5d5;
}

.categories .subcategory-collapse .subsubcategory-right {
    
}

.categories .subsubcategory-top-blank-row {
    height: 25px;
    width: 100%;
}

.categories .subsubcategory-row {
    height: 52px;
    display: block;
}

.categories .subsubcategory-row img {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    border: 1px solid lightgrey;
    float: left;
}

.categories .subsubcategory-row .info {
    padding-left: 141px;
}

.categories .subsubcategory-row .info .name {
    display: block;
    font-weight: 900;
    margin-bottom: 2px;
}

.categories .subsubcategory-row .info .description {
    font-size: 11px;
    line-height: 14px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.categories .subsubcategory-bottom-row {
    display: table;
    width: 100%;
}

.categories .subsubcategory-bottom-row .col-1 {
    width: 50px;
    height: 20px;
    float: left;
}

.categories .subsubcategory-bottom-row .col-1 .left {
    width: 25px;
    float: left;
    height: 20px;
}

.categories .subsubcategory-bottom-row .col-1 .right {
    width: 24px;
    float: left;
    height: 20px;
    border-left: 1px solid #d5d5d5;
}

.categories .subsubcategory-bottom-row .col-2 .left {
    width: 12px;
    float: left;
    height: 20px;
}

.categories .subsubcategory-bottom-row .col-2 .right {
    width: 13px;
    float: left;
    height: 20px;
    border-left: 1px solid #d5d5d5;
}

.categories .subsubcategory-top-row {
    display: table;
    width: 100%;
}

.categories .subsubcategory-top-row .col-1 {
    width: 50px;
    height: 20px;
    float: left;
}

.categories .subsubcategory-top-row .col-1 .left {
    width: 25px;
    float: left;
    height: 20px;
}

.categories .subsubcategory-top-row .col-1 .right {
    width: 24px;
    float: left;
    height: 20px;
    border-left: 1px solid #d5d5d5;
}

.categories .subsubcategory-top-row .col-2 .left {
    width: 12px;
    float: left;
    height: 20px;
}

.categories .subsubcategory-top-row .col-2 .right {
    width: 13px;
    float: left;
    height: 20px;
    border-left: 1px solid #d5d5d5;
}


.spec-row {
    height: 52px;
    display: block;
    margin-bottom: 15px;
}

.spec-row  img {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    border: 1px solid lightgrey;
    float: left;
}

.spec-row .info {
    padding-left: 65px;
}

.spec-row .info > .name {
    display: block;
    font-weight: 900;
    margin-bottom: 2px;
    font-size: 18px;
}

.spec-row .info > .description {
    font-size: 11px;
    line-height: 14px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}



/* brand-section */

#brand-section {
    height: 60vh;
}

.brand-article {
    margin-bottom: -20px;
}

.brand-article .body {
    line-height: 28px;
    color: #5D5D5D;
}

.brand-article .body #capital-letter {
    font-family: "Roboto", sans-serif;
    font-size: 150px;
    font-weight: 700;
    float: left;
    margin-top: 10px;
    margin-left: -5px;
    margin-right: 5px;
    color: #ffcfc1;
    line-height: 90px;
}

.brand-article .body  p  {
    font-size: 18px;
    line-height: 26px;
}

.brand-article .body p strong {
    font-size: 18px;
    line-height: 26px;
}

.brand-article .body p > .body-title {
    font-size: 26px;
    line-height: 30px;
    font-weight: 800;
    margin-bottom: 15px;
    display: block;
}

.brand-article .art-title span {
    font-size: 22px;
    font-weight: 900;
    margin-bottom: 10px;
    display: block;
    color: #ff9e9e;
}

.brand-article em span {
    font-family: "Roboto";
    color: gray;
    font-weight: 900;
}

.brand-article em strong {
    font-family: "Roboto";
    color: gray;
    font-weight: 900;
}

/* back brand profile */

.back-ribbon-brand {
    background-color: white;
    margin-bottom: 7px;
}

.back-ribbon-brand > .btn {
    width: 50px;
    float: left;
    height: 39px;
    text-align: center;
    padding-top: 16px;
}

.back-ribbon-brand > .btn > i {
    color: #B7B7B7;
    font-size: 24px;
}

.back-ribbon-brand > .brand {
    display: table;
    padding: 10px 0 10px 0;
}

.back-ribbon-brand > .brand > a > img {
    height: 35px;
    border-radius: 50%;
    float: left;
    margin-right: 10px;
}

.back-ribbon-brand > .brand > span {
    font-family: "Space Mono", monospace;
    font-size: 16px;
    color: #313131;
    -webkit-font-smoothing: antialiased;
    text-align: left;
    text-transform: uppercase;
    line-height: 34px;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
}

.brand-official-link {
    display: block;
    margin-top: -10px;
}

.brand-official-link a {
    color: #888888;
    font-size: 14px;
}

.brand-official-link i {
    font-size: 12px;
    color: #888888;
}


/* manage notifications*/

.notifications-container {
    padding-bottom: 20px;
}

.notifications-col {
    float: right;
    width: 60px;
    height: 65px;
    text-align: right;
    padding-top: 20px;
}

.notifications-col .left {
    
}

.notifications-col .left i {
    font-size: 20px;
    margin-right: 10px;
}

.notifications-col .right {
    
}

.notifications-col .right i {
    font-size: 20px;
}

.notifications-col .off i {
    color: #c7c7c7;
}

.notifications-col .on i {
    color: #ff9f9f;    
}



/* community */

.container-no-communities-list {
    padding: 15px;
} 


/* empty content type */



.empty-activity {
    padding: 13px 20px 5px 17px;
}

.empty-activity-preview {
    padding-top: 40px;
    text-align: center;
}

.empty-activity > i {
    color: #988b9e;
    margin-bottom: 10px;
    font-size: 14px;
    margin-right: 1px;
}

.empty-activity-preview i {
    font-size: 36px;
    display: block;
}

.empty-activity > span {
    color: #988b9e;
    font-size: 15px;
    font-weight: 900;
}

.empty-activity-preview span {
    font-size: 18px;
}

.empty-activity .btn-md-inline {
    padding: 5px 12px;
    border-radius: 15px;
    float: right;
    margin-top: -4px;
    font-size: 14px;
    cursor: pointer;
    background-color: white !important;
    color: #8d7398 !important;
    border: 1px solid #8d7398 !important;
}


/* mod_panel */

.mod-panel .headline {
    height: 35px;
    position: fixed;
    width: 100%;
    top: 0;
    z-index: 5;
    background-color: #F9EFEC;
}

.mod-panel .headline .container {
    display: table;
    margin: auto;
}

.mod-panel .headline span {
    font-weight: 900;
    font-size: 13px;
    float: left;
    margin: 10px 0px 0 7px;
    color: #B49A92;
}

.mod-panel .headline i {
    position: absolute;
    right: 12px;
    top: 8px;
    font-size: 19px;
    color: #B49A92;
}

.mod-panel-sections {
    padding-top: 42px;
}


/* Post Mod Menu */

.mod-menu {
    background-color: #F9EFEC;
    padding: 15px 0;
}

.mod-menu .buttons {
    height: 30px;
    overflow: auto;
    white-space: nowrap;
    -webkit-overflow-scrolling: touch;
    overflow-y: hidden;
    position: relative;
    padding-right: 10px;
    padding-left: 15px;
}

.mod-menu .buttons a {
    padding: 7px 12px;
    display: inline-block;
    margin-right: 5px;
    border-radius: 15px;
    font-size: 14px;
    color: white;
    font-weight: 900;
}

.mod-menu .buttons .remove {
    background-color: #F44336;
}

.mod-menu .buttons .ignore {
    background-color: #9E9E9E;
}

.mod-menu .buttons .disable {
    background-color: #FFC107;
}

.mod-menu .buttons .approve {
    background-color: #4CAF50;
}

.mod-menu .reports {
    padding: 0 15px;
}

.mod-menu .hr {
    padding: 0 15px;
    margin-bottom: 15px;
}

.mod-menu .hr div {
    border-bottom: 1px solid #d6c1ba;
}

.mod-menu .reports .report {
    margin-bottom: 25px;
}

.mod-menu .reports .report .rule {
    margin-bottom: 10px;
    background-color: white;
    padding: 12px 15px;
    border-radius: 15px;
    box-shadow: -2px 4px 5px #837b772b;
}

.mod-menu .reports .report .rule span {
    color: #B49A92;
    font-weight: 900;
}

.mod-menu .reports .report .rule span i {
    color: #B49A92;
    font-size: 13px;
    margin-right: 4px;
}

.mod-menu .reports .report .user {
    padding: 0 10px;
    margin-bottom: 10px;
}

.mod-menu .reports .report .user img {
    height: 30px;
    width: 30px;
    border-radius: 50%;
    float: left;
}

.mod-menu .reports .report .user .info {
    padding-left: 40px;
}

.mod-menu .reports .report .user .info .user-name {
    font-size: 14px;
    font-weight: 900;
    display: block;
}

.mod-menu .reports .report .user .info .user-name-brand {
    font-family: "Space Mono", monospace;
    text-transform: uppercase;
    font-size: 14px;
    font-weight: 900;
    display: block;
}

.mod-menu .reports .report .user .info .user-name-brand i {
    font-size: 11px;
    margin-left: -5px;
}

.mod-menu .reports .report .user .info .user-stats {
    font-size: 12px;
    display: block;
    margin-top: 0px;
}

.mod-menu .reports .previously-reported {
    font-size: 14px;
    color: #FF5722;
    margin-bottom: 10px;
    display: block;
    font-weight: 900;
}

#users-container .users {

}

#users-container .users .user-mod-row {
    background-color: white;
    margin-bottom: 7px;
    padding: 15px;
}

#users-container .users .user-mod-row .user {
    display: inline-block;
}

#users-container .users .user-mod-row .user img {
    height: 30px;
    width: 30px;
    border-radius: 50%;
    float: left;
}

#users-container .users .user-mod-row .user .info {
    padding-left: 40px;
}

#users-container .users .user-mod-row .user .info .user-name {
    font-size: 14px;
    font-weight: 900;
    display: block;
}

#users-container .users .user-mod-row .user .info .user-stats {
    font-size: 12px;
    display: block;
    margin-top: 0px;
}

#users-container .users .user-mod-row .user .info .user-stats p {
    font-size: 12px;
    display: block;
    margin-top: 0px;
    color: gray;
}

#users-container .users a {
    padding: 7px 12px;
    display: inline-block;
    border-radius: 15px;
    font-size: 14px;
    color: white;
    font-weight: 900;
    background-color: #9E9E9E;
    position: absolute;
    right: 20px;
}

#preferences-container .level {
    padding: 0 5px 15px 5px;
}

#preferences-container .level .text-col {
    
}

#preferences-container .level .text-col .title {
    font-size: 18px;
    font-weight: 900;
    color: #5D5D5D;
    display: block;
}

#preferences-container .level .text-col .subtitle {
    font-size: 14px;
    color: #8D8D8D;
    display: block;
}

#preferences-container .level .edit {
    padding: 7px 12px;
    display: inline-block;
    margin-right: 5px;
    border-radius: 15px;
    font-size: 14px;
    color: white;
    font-weight: 900;
    background-color: #9E9E9E;
    float: right;
    margin-right: 0;
    margin-top: 5px;
}

#preferences-container .level .option {
    margin-bottom: 25px;
    margin-left: -5px;
}

#preferences-container .level .option-col-1 {
    float: left;
    width: 35px;
    height: 35px;
}

#preferences-container .level .option-col-1 .selection {
    width: 22px;
    height: 22px;
    border: 2px solid #898B90;
    border-radius: 50%;
    margin: auto;
    margin-top: 6px;
}

#preferences-container .level .option-col-1 .active {
    background-color: white;
    border: 2px solid #FF9F9F;
}

#preferences-container .level .option-col-1 .selection .active-inner {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    margin: 5px;
    background-color: #FF9F9F;
}

#preferences-container .level .option-col-2 {
    padding-left: 45px;
}

#logs-container .logs {

}

#logs-container .logs .log {
    margin-bottom: 7px;
}

#logs-container .logs .log .log-row {
    padding: 15px;
    background-color: white;
}

#logs-container .logs .log .log-row .txt {
    font-size: 14px;
}

#logs-container .logs .log .log-row .txt strong {
    font-size: 14px;
}

#logs-container .logs .log .log-row .date {
    font-size: 14px;
}

#logs-container .logs .log .log-row .preview i {
    font-size: 12px;
    color: gray;
}

#logs-container .logs .preview-box {
    display: none;
}

.blocked-user {
    margin-bottom: 15px;
    margin-top: -5px;
}

.blocked-container {
    display: table;
    width: 100%;
}

.blocked-container .community {
    float: left;
    padding-right: 7px;
    border-right: 1px solid #818181;
    margin-right: 8px;
}

.blocked-container .community img {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    border: 1px solid #e1e1e1;
    margin-top: -1px;
    float: left;
}

.blocked-user {
    float: left;
}

.blocked-user img {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    border: 1px solid #e1e1e1;
    margin-top: 3px;
    float: left;
}

.blocked-user .info {
    margin-top: 2px;
    float: left;
    margin-left: 7px;
}

.blocked-user .info .user-name {
    font-weight: 900;
    font-size: 14px;
    display: block;
}

.blocked-user .info .user-stats {
    font-size: 14px;
    color: gray;
}

.pnl .rules {
    /*padding: 0 8px;*/
}

.pnl .rules .rule {
    margin-bottom: 35px;
}

.pnl .rules .rule .icon-col {
    float: left;
    width: 20px;
}

.pnl .rules .rule .icon-col i {
    margin-top: 3px;
    color: #5c5c5c;
}

.pnl .rules .rule .text-col {
    padding-left: 20px;
}

.pnl .rules .rule .text-col a {
    font-size: 14px;
    margin-top: 10px;
    display: inline-block;
}

.pnl .rules .rule .text-col .title {
    font-size: 18px;
    font-weight: 900;
    color: #5D5D5D;
    display: block;
    margin-bottom: 5px;
}

.pnl .rules .rule .text-col .subtitle p {
    font-size: 14px;
    color: #8D8D8D;
    display: block;
}

.pnl .rules .rule .text-col .subtitle {
    font-size: 14px;
    color: #8D8D8D;
    display: block;
}

.pnl .rules .rule .text-col .btn {
    font-size: 14px;
    color: #b49a91;
    display: inline-block;
    margin-top: 10px;
    background-color: #f8efeb;
    padding: 7px 12px;
    border-radius: 15px;
    font-weight: 900;
}

.pnl .rules .rule .text-col .btn i {
    font-size: 12px;
    color: #b49a91;
}

.filter-menu-2-container {
    margin-top: 7px;
}

.fixed-filter-menu-2 {
    top: 76px;
}


.post-user {
    background-color: #f0eef3;
    position: relative;
    padding-bottom: 7px;
    padding-top: 0px;
}

.post-user-no-padding-top {
    padding-top: 0;
}

.post-user > .container {
    background-color: white;
}

.post-user .top {
    padding: 15px 15px 0 12px;
}

.post-user .top .user-profile {
    width: 35px;
    height: 35px;
    border-radius: 50%;
    float: left;
    margin-top: 3px;
    background-color: #e6eaeb;
    object-fit: cover;
}

.post-user .top .user-role {
    position: relative;
}

.post-user .top .user-role .badge {
    position: absolute;
    left: 21px;
    top: 23px;
    background-color: #676767;
    border-radius: 50%;
    width: 15px;
    height: 15px;
    border: 2px solid white;
    text-align: center;
    display: flex;
}

.post-user .top .user-role .admin {
    background-color: #ff9e9e;
}

.post-user .top .user-role .ambassador {
    background-color: #ff9800;
}

.post-user .top .user-role .biuteam {
    background-color: #676767;
}

.post-user .top .user-role .brand {
    background-color: #676767;
}

.post-user .top .user-role .badge .fa-check {
    color: white;
    font-size: 9px;
    margin-top: 3px;
    margin-left: 3px;
}

.post-user .top .user-role .badge .fa-star {
    color: white;
    font-size: 8px;
    margin-top: 3px;
    margin-left: 3px;
}

.post-user .top .user-role .badge .fa-crown {
    color: white;
    font-size: 7px;
    margin-top: 4px;
    margin-left: 3px;
}

.post-user .top .user-profile-sign-in {
    border: 2px solid white;
    width: 33px;
    height: 33px;
    border-radius: 50%;
    margin: auto;
    margin-top: 0px;
    float: left;
    text-align: center;
    background: linear-gradient(111deg, #0c007f 0%, #7768ff 100%);
    box-shadow: 2px 2px 4px #00000038;
    object-fit: cover;
}

.post-user .top .user-profile-sign-in i {
    font-size: 18px;
    margin: auto;
    margin-top: 7px;
    color: white;
}

.post-user .top .post-btn-col {
    padding-left: 45px;
}

.post-user .top .post-btn {
    background-color: #f0eef3;
    color: #8d7399;
    padding: 12px 15px 11px 15px;
    border-radius: 10px;
    font-size: 15px;
    display: block;
    cursor: pointer;
}

.post-user .top .post-btn-not-confirmed {

}

.post-user .top .post-btn i {
    color: #8d7399;
    float: left;
    margin: 1px 6px 0 0;
    font-size: 15px;
}

.post-user .bottom {
    padding: 0 5px;
    height: 45px;
    overflow: hidden;
}

.post-user .bottom .post-a {
    display: inline-block;
    font-size: 15px;
    padding: 15px 9px 14px 9px;
    color: #7B7B7B;
    font-weight: 500;
    border-radius: 10px;
}

.post-user .bottom .post-a i {

}

#post-user-review {

}

#post-user-review i {
    font-size: 15px;
    margin: 1px 6px 0 0;
    color: #E7A33E;
    float: left;
}

#post-user-question {

}

#post-user-question i {
    font-size: 15px;
    margin-right: 2px;
    color: #FF9F9F;
}

#post-user-photo {
    margin-bottom: -5px;
}

#post-user-photo i {
    font-size: 20px;
    margin: -1px 8px 0 0;
    color: #70B5F9;
    float: left;
}

#post-user-video {
    margin-bottom: -5px;
    display: none;
}

#post-user-video-brand {
    margin-bottom: -5px;
    display: inline-block;
}

#post-user-video i,
#post-user-video-brand i {
    font-size: 20px;
    margin: -1px 8px 0 0;
    color: #7FC05E;
    float: left;
}

#post-user-more {
    margin-bottom: -5px;
}

#post-user-more i {
    font-size: 21px;
    margin: -1px 8px 0 0;
    color: #6D5DF2;
    float: left;
}

#post-user-link {
    margin-bottom: -5px;
}

#post-user-link i {
    font-size: 20px;
    margin: -1px 8px 0 0;
    color: #6D5DF2;
    float: left;
}

#post-user-text {
    margin-bottom: -5px;
}

#post-user-text i {
    font-size: 20px;
    margin: -1px 8px 0 0;
    color: #ef5350;
    float: left;
}

.select-community-to-post {
    width: 100%;
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    overflow-y: scroll;
    overflow-x: hidden;
    z-index: 101;
    animation-duration: 600ms;
    display: none;
}

.select-community-to-post > .container {
    padding: 5px;
    top: 0;
    left: 0;
    right: 0;
}

.select-community-to-post .container .relative {
    position: relative;
    border-radius: 15px;
    overflow: hidden;
}

.select-community-to-post .container .relative .bg {
    background-color: white;
    border-radius: 15px;
    overflow-y: scroll;
}

.select-community-to-post .container .relative .bg > .header {
    background-color: white;
    position: absolute;
    text-align: left;
    padding: 15px 35px 15px 20px;
    z-index: 100;
}

.select-community-to-post .container .relative .bg .header .close-select-community {
    border-radius: 50%;
    right: 12px;
    top: 15px;
    position: absolute;
    z-index: 40;
    width: 40px;
    height: 40px;
    cursor: pointer;
}

.select-community-to-post .container .relative .bg .header .close-select-community i {
    font-size: 28px;
    color: #dddddd;
}

.select-community-to-post .container .relative .bg .header .select-community-to-post-title {
    font-size: 22px;
    font-weight: 900;
}

.select-community-to-post .container .relative .bg > .container {
    padding: 85px 0 15px 0;
}

.select-community-to-post .p-list-sm > .title {
    color: #a4a4a4;
    font-size: 14px;
    font-weight: 900;
}

.select-community-to-post .p-list-sm > .title i {
    color: #a4a4a4;
    font-size: 14px;
}

.select-community-to-post .select-communities-container {
    padding: 0 0 30px 0;
}

.title-panel > .title-box-padding {
    margin-bottom: 0;
    padding-bottom: 15px;
}

.container-communities-ph {
    padding: 85px 15px 0 15px;
}

.container-communities-ph .search-box {
    animation-duration: 1s;
    animation-fill-mode: forwards;
    animation-iteration-count: infinite;
    animation-name: placeHolderShimmer;
    animation-timing-function: linear;
    background: #f6f7f8;
    background: linear-gradient(to right, #eeeeee 8%, #dddddd 18%, #eeeeee 33%);
    background-size: 800px 104px;
    height: 57px;
    position: relative;
}

.container-communities-ph .communities-ph {
    padding-top: 20px;
}

.container-communities-ph .communities-ph span {
    color: #a4a4a4;
    font-size: 14px;
    font-weight: 900;
}

.container-communities-ph .communities-ph .row {
    display: flex;
    flex-direction: row;
    padding: 10px 0;
}

.container-communities-ph .communities-ph .row .profile {
    width: 60px;
    height: 60px;
    border: 1px solid #d7d7d7;
    border-radius: 50%;
}

.container-communities-ph .communities-ph .row .info {
    width: 70%;
    padding-left: 15px;
}

.container-communities-ph .communities-ph .row .info .ph-bg {
    animation-duration: 1s;
    animation-fill-mode: forwards;
    animation-iteration-count: infinite;
    animation-name: placeHolderShimmer;
    animation-timing-function: linear;
    background: #f6f7f8;
    background: linear-gradient(to right, #eeeeee 8%, #dddddd 18%, #eeeeee 33%);
    background-size: 800px 104px;
    height: 66px;
    position: relative;
}

.container-communities-ph .communities-ph .row .info .ph-bg div {
    background: #fff;
    position: absolute;
}

.container-communities-ph .communities-ph .row .info .ph-bg .ph-bar-1 {
    top: 0;
    left: 100px;
    right: 0;
    height: 17px;
}

.container-communities-ph .communities-ph .row .info .ph-bg .ph-bar-2 {
    top: 17px;
    left: 0;
    right: 0;
    height: 7px;
}

.container-communities-ph .communities-ph .row .info .ph-bg .ph-bar-3 {
    top: 37px;
    left: 150px;
    right: 0;
    height: 10px;
}

.container-communities-ph .communities-ph .row .info .ph-bg .ph-bar-4 {
    top: 47px;
    left: 120px;
    right: 0;
    height: 10px;
}

.container-communities-ph .communities-ph .row .info .ph-bg .ph-bar-5 {
    top: 57px;
    left: 70px;
    right: 0;
    height: 9px;
}


@media (min-width: 321px) {

	.article-cards .card > .img-container > img { height: 115%; }	
}

@media (min-width: 360px) {

	.article-cards .card > .img-container { height: 410px; }

    .top-profile > .container > .header > .about { margin-top: -55px; }

	.article-cards .card > .img-container > img { height: 100%; }	

	.article-cards .card > .img-container > .info-txt > .title { font-size: 28px; line-height: 28px; }

    .article-card-h .info { height: 142px; }

    .article-card-h .info .title { -webkit-line-clamp: 6 !important; }

    #brand-section { height: 60vh; }

}

@media (min-width: 361px) {

	.article-cards .card > .img-container > img { height: 110%; }	
}

@media (min-width: 375px) {

    .top-profile > .container > .header > .about { margin-top: -60px; }

	.article-cards .card > .img-container { height: 430px; }

	.article-cards .card > .img-container > img { height: 100%; }

    .article-card-h .info { height: 149px; }

    #brand-section { height: 65vh; }

    .post-user .top { height: 45px; }

    .post-user .top .user-profile {
        margin-top: 0px;
        width: 40px;
        height: 40px;
        object-fit: cover;
    }

    #post-user-review { margin-right: 3px; }
    #post-user-question { margin-right: 3px; }
    #post-user-photo { margin-right: 3px; }

    .post-user .top .user-profile { margin-top: 4px; }

}

@media (min-width: 376px) {

	.article-cards .card > .img-container > img { height: 110%; }	

}

@media (min-width: 412px) {

    .top-profile > .container > .header > .about { margin-top: -75px; }

	.article-cards .card > .img-container { height: 475px; }

	.article-cards .card > .img-container > img { height: 100%; }

    .article-card-h .info { height: 166px; }

    .article-card-h .info .title { -webkit-line-clamp: 7 !important; }

    #brand-section { height: 70vh; }

    .post-user .top .user-profile-sign-in {
        width: 36px;
        height: 36px;
        margin-top: 4px;
    }

    .post-user .top .user-profile-sign-in i {
        font-size: 20px;
        margin-top: 9px;
    }

    .post-user .top .post-btn:hover {
        background-color: #f3f6f7;
    }

    .post-user .top .post-btn-col {
        padding-left: 50px;
    }

    .post-user .top .post-btn { font-size: 15px; padding: 14px 15px 12px 15px; }
    .post-user .bottom .post-a { font-size: 15px; }
    #post-user-review { margin-right: 12px; margin-left: 5px; }
    #post-user-question { margin-right: 12px; }
    #post-user-photo { margin-right: 12px; }

}


@media (min-width: 680px) {

    .home-mod-panel .alert-panel .text, .home-mod-panel .green-panel .text {
        font-size: 14px;
    }

    .home-mod-panel .alert-panel .text-right, .home-mod-panel .green-panel .text-right {
        font-size: 14px;
        cursor: pointer;
    }

    .home-mod-panel {
        margin-bottom: 15px;
    }

    .home-mod-panel .green-panel {
        border-radius: 10px;
    }

    .brand-card:hover .info,
    .brand-card:hover .footer {
        background-color: #faf5f3;
    }


    .top-profile > .container > .header {
        height: 238px;
    }

    .top-profile > .container > .header > .about {
        margin-top: 0;
    }

    .top-profile > .container .profile {
        height: 130px;
        width: 130px;
        top: 115px;
    }

    .top-profile > .container > .info > .top > .brand {
        font-size: 22px;
    }

    .top-profile > .container > .info > .top > .follow > .follow-btn {
        padding: 6px 12px;
        font-size: 16px;
        font-weight: 500;
    }

    .top-profile > .container > .info > .description {
        height: 38px;
    }

    .top-profile > .container > .info > .description > span {
        font-size: 14px;
        line-height: 18px;
    }

    .top-profile > .container > .info > .description > .see-more {
        font-size: 13px;
        line-height: 19px;
    }    

    .section-menu-container {
        height: 44px;
    }

    .top-profile > .container > .info > .top > .not-brand {
        font-size: 26px;
    }          

    .mod-panel .headline span {
        font-size: 16px;
    }

    .post-user {
        padding-top: 0;
        /*padding-bottom: 1px;*/
    }

    .post-user .top {
        padding: 15px 15px 5px 12px;
    }

    .post-user .top .user-profile-sign-in {
        width: 36px;
        height: 36px;
        margin-top: 4px;
    }

    .post-user .top .user-profile-sign-in i {
        font-size: 20px;
        margin-top: 9px;
    }

    .post-user .top .user-role .badge {
        left: 26px;
        top: 28px;
    }

    .post-user .top .post-btn {
        font-size: 16px;
        padding: 14px 15px 13px 15px;
        color: #7d7d7d;
    }

    .post-user .top a:hover .post-btn {
        background-color: #E4E6E9;
    }

    .post-user .top .post-btn i {
        color: #7d7d7d;
        float: left;
        margin: 1px 6px 0 0;
        font-size: 17px;
    }

    .post-user .bottom {
        height: 50px;
        padding-top: 4px;
    }

    .post-user .bottom .post-a {
        font-size: 16px;
        cursor: pointer;
        padding: 12px 15px;
    }

    .post-user .bottom .post-a:hover {
        background-color: white;
        color: #ff9f9f;
    }

    #post-user-review {
        margin-right: 3px;
        margin-left: 5px;
    }

    #post-user-question {
        margin-right: 7px;
    }

    #post-user-photo {
        margin-right: 3px;
        display: none;
    }

    #post-user-more {
        margin-right: 0;
    }

    #post-user-review i {
        font-size: 18px;
        margin-right: 8px;
    }

    #post-user-question i {
        font-size: 16px;
        margin-right: 4px;
    }

    #post-user-photo i {
        font-size: 21px;
        margin-right: 8px;
    }

    #post-user-video i {
        font-size: 19px;
        margin-right: 6px;
    }

    #post-user-more i {
        font-size: 22px;
        margin-right: 6px;
    }

    .post-user > .container {
        background-color: #f8f7f8;
    }

    .post-user .top .post-btn {
        background-color: white;
        border: 1px solid #e5e5e5;
    }

    .select-community-to-post > .container {
        width: 600px;
        margin: auto;
    }

    .select-community-to-post .container .relative .bg > .header {
        width: 600px;
        padding: 25px 0 0 0;
    }

    .select-community-to-post .p-list-sm .title {
        margin-bottom: 10px;
        display: block;
    }

    .container-communities-ph .communities-ph span {
        display: block;
        margin-bottom: 10px;
    }

    .container-communities-ph .communities-ph .row {
        padding: 10px;
    }

    #promo-carousel .btns-nav-scroll {
        margin-top: 120px;
    }

    .marketplace-panel {
        padding: 10px 15px;
    }

    .marketplace-panel .left-col {
        width: 35px;
    }

    .marketplace-panel .left-col .icon {
        width: 30px;
        height: 30px;
    }

    .marketplace-panel .left-col .icon .fa-shopping-cart {
        font-size: 16px;
        margin-left: -1px;
    }

    .marketplace-panel .right-col {
        padding-left: 5px;
    }

    .marketplace-panel .right-col .see-more {
        cursor: pointer;
    }

}

@media (min-width: 725px) {
    .mod-panel .headline {
        width: 360px;
    } 
}

@media (min-width: 768px) {
    .mod-panel .headline {
        width: 400px;
    } 

    #post-user-review {
        margin-right: 0px;
        margin-left: 0px;
    }

    #post-user-question {
        margin-right: 0px;
    }

    #post-user-photo {
        margin-right: 0px;
        display: inline-block;
    }
}

@media (min-width: 780px) {
    .mod-panel .headline {
        width: 420px;
    } 

    .post-user .bottom .post-a {
        padding: 12px 14px;
    }

    #post-user-review {
        margin-right: 0px;
        margin-left: 0px;
    }

    #post-user-question {
        margin-right: 0px;
    }

    #post-user-photo {
        margin-right: 0px;
    }
}


@media (min-width: 832px) {
    .mod-panel .headline {
        width: 470px;
    } 

    .post-user .bottom .post-a {
        padding: 12px 9px;
    }

    .post-user .brand-bottom .post-a {
        padding: 12px 22px;
    }

    #post-user-review {
        margin-right: 0px;
        margin-left: 0px;
    }

    #post-user-question {
        margin-right: 0px;
    }

    #post-user-photo {
        margin-right: 0px;
    }

    #post-user-video {
        margin-right: 0px;
        display: inline-block;
    }

    #post-user-more {
        margin-right: 0;
    }
}


@media (min-width: 960px) {

    .brand-card {
        width: 33%;
        float: left;
    }

    .brand-card .container {
        position: relative;
        overflow: hidden;
    }

    .brand-card:nth-child(2n+1) .container {
        padding-right: 0px;
    }

    .brand-card:nth-child(2n+2) .container {
        padding-left: 0px;
    }    

    .brand-card:nth-child(3n+1) .container {
        padding-right: 7px;
    }

    .brand-card:nth-child(3n+2) .container {
        padding-left: 7px;
        padding-right: 7px;
    }    

    .brand-card:nth-child(3n+3) .container {
        padding-left: 7px;
    }      

    .mod-panel .headline {
        width: 540px;
    }    

    .post-user .bottom .post-a {
        padding: 12px 15px;
    }

    .post-user .brand-bottom .post-a {
        padding: 12px 30px;
    }

    #post-user-review {
        margin-right: 0px;
        margin-left: 5px;
    }

    #post-user-question {
        margin-right: 0px;
    }

    #post-user-photo {
        margin-right: 0px;
    }

    #post-user-video {
        margin-right: 0px;
        display: inline-block;
    }

    #post-user-more {
        margin-right: 0;
    }


}

.product-profile {
	position: relative;
    z-index: 13;
    background-color: white;
}

.product-profile .photo-profile {
	
}

.product-profile .photos, .product-profile .carousel-img, .product-profile .photos img,
.product-profile .carousel-img .video-js { height: 300px; }

.product-profile .photos {
    background-color: #e6eaeb;    
	height: 300px;
}

.product-profile .photos-empty {
    background-color: white;
    text-align: center;
}

.product-profile .carousel-img {
    height: 300px;
    overflow: auto;
    white-space: nowrap;
    -webkit-overflow-scrolling: touch;
    overflow-y: hidden;
    overflow-x: scroll;
    border-bottom: 1px solid #80808021;
    display: none;
}

.product-profile .photos > .active {
    display: block;
}

.product-profile .carousel-img .profile-photo, .product-profile .photos .carousel-img .media {
    display: inline-block;
    position: relative;
}

.product-profile .carousel-img .profile-photo, .product-profile .photos .carousel-img .media > img {
    margin-right: -4px;
}

.product-profile .photos .carousel-img .media video-js {
    width: 100%;
}

.product-profile .icons {
	position: absolute;
    top: 252px;
    left: 15px;
    z-index: 2;
}

.product-profile .active {
    display: block;
    cursor: pointer;
}

.product-profile .icons .bg {
	background-color: #fff1ec;
    padding: 7px 12px 8px 14px;
    border-radius: 10px;
    border: 1px solid #ffe1de;
}

.product-profile .icons .container-photo {
	display: inline-block;
}

.product-profile .icons .container-video {
	display: inline-block;
	margin-left: 6px;
}

.product-profile .icons .bg i {
	color: #FFA3A3;
    font-size: 15px;
}

.product-profile .icons .bg span {
	color: #FFA3A3;
    font-size: 14px;	
}

.product-profile > .info {
	padding: 0;
    position: relative;
}

.product-profile > .info-marketplace {
    padding: 0;
    position: relative;
}

.product-profile > .info > .container {
    padding: 15px 15px 0 15px;
    background-color: white;
}

.product-profile > .info-marketplace > .container {
    padding: 15px 0 0 0;
    background-color: white;
}

.product-profile > .info .actions {
	position: absolute;
    right: 5px;
    top: 5px;
}

.product-profile > .info .actions .action {
	width: 40px;
    height: 35px;
    float: left;
    text-align: center;
}

.product-profile > .info .actions .action .container {
	margin-top: 8px;
}

.product-profile > .info .actions .action .container i {
	color: #e3e0e4;
    font-size: 24px;
}

.product-profile > .info .actions .active .container i {
	color: #ffa3a3;
}

.product-profile > .info-marketplace .names {
	padding: 0 15px;
}

.product-profile > .info .names .brand {
	font-family: "Space Mono", sans-serif;
    font-size: 20px;
    line-height: 22px;
    display: inline-block;
    text-transform: uppercase;
    margin-bottom: 3px;
    background-position: 0 12px;
    background-repeat: no-repeat;
    background-image: linear-gradient(to bottom, transparent 0, #ffeaea 0);
}

.product-profile > .info .names .name {
	font-weight: 200;
    font-size: 22px;
    display: block;
    line-height: 24px;
    margin-bottom: 3px;
    margin-top: 3px;
}

.product-profile > .info .names .edit {
    font-size: 12px;
    background-color: #f8eeeb;
    padding: 0 10px;
    border-radius: 16px;
    color: #b49a91;
    font-weight: 500;
    display: inline-block;
}

.product-profile > .info .names .edit i {
    font-size: 12px;
    color: white;
}

.product-profile > .info .discontinued {
    display: block;
    margin: 7px 0 10px 0;
}

.product-profile > .info .discontinued .bg {
    background-color: #454545;
    display: inline-block;
    padding: 3px 12px;
    border-radius: 10px;
    font-size: 13px;
    color: white;
}

.product-profile > .info .names .selected-version {
    margin-top: -3px;
    display: block;
    color: #5d5d5d;
    font-weight: 200;
}

.product-profile > .info .review-summary {
	display: table;
    width: 100%;
    margin-bottom: 9px;
    margin-top: 11px;
}

.product-profile > .info-marketplace .review-summary {
    display: flex;
    width: auto;
    margin-bottom: 9px;
    margin-top: 20px;
}

.product-profile > .info-marketplace .review-summary {
    padding: 0 15px;
}

.product-profile > .info .review-summary .product-star {
	padding: 0;
    float: left;
    z-index: 0;
}

.product-profile > .info .review-summary .score {
    font-weight: 900;
    float: left;
    margin-left: 3px;
    margin-top: -6px;
    font-size: 33px;
    letter-spacing: -1px;
}

.product-profile > .info .review-summary .score-base {
    color: #898989;
    font-weight: 500;
    float: left;
    margin-left: 4px;
    margin-top: 13px;
    font-size: 13px;
}

.product-profile > .info .review-summary .review-question-count {
    float: left;
    margin-top: -3px;
    margin-left: 15px;
}

.product-profile > .info .review-summary .review-question-count .review-count {
    display: block;
    color: #898989;
    font-size: 13px;
    text-decoration: underline;
    margin-bottom: -2px;
    cursor: pointer;
}

.product-profile > .info .review-summary .review-question-count .question-count {
    display: inline-block;
    color: #898989;
    font-size: 13px;
    text-decoration: underline;
    cursor: pointer;
}

.product-profile > .info .review-summary .empty-score {
    float: left;
    margin-left: 6px;
    margin-bottom: 0px;
    margin-top: -1px;
}

.product-profile > .info .review-summary .empty-score .top {
    color: #ff9e9e ;
    font-size: 13px;
    display: block;
    margin-bottom: -1px;
}

.product-profile > .info .review-summary .empty-score .bottom {
    color: #ff9e9e;
    font-size: 13px;
    display: block;
}

.product-profile > .info .versions {
	margin-top: 8px;
    margin-bottom: 4px;
}

.product-profile > .info .versions .container {
    overflow: hidden;
    margin-bottom: -8px;
}

.product-profile > .info .versions-img {
    margin-top: 5px;
    margin-bottom: 12px;
    position: relative;
}

.product-profile > .info .versions-img .container {
    height: 55px;
    overflow: hidden;
    margin-bottom: 0px;
}

.product-profile > .info .versions .version-container {
	display: inline-block;
    margin-bottom: 8px;
}

.product-profile > .info .versions .version-container-img {
	float: left;
    width: 54px;
}

.product-profile > .info .versions-text .version {
    margin-right: 5px;
    display: inline-block;
    cursor: pointer;
}

.product-profile > .info .versions .version .bg {
	background-color: #F0F0F0;
    border: 1px solid #F0F0F0;
    padding: 1px 11px;
    border-radius: 10px;
}

.product-profile > .info .versions .version .bg span {
	color: #AFAFAF;
    font-size: 13px;
    margin: 3px 0 2px 0;
    display: block;
}

.product-profile > .info .versions .version .active {
	background-color: #fff1ec;
    border: 1px solid #ffd1d1;
}

.product-profile > .info .versions .version .active span {
	color: #FFA3A3;
}

.product-profile > .info .versions .version-img {
    border-radius: 5px;
    overflow: hidden;
    width: 48px;
    height: 48px;
    position: relative;
}

.product-profile > .info .versions .version-img .selection {
    position: absolute;
    height: 38px;
    width: 38px;
    border: 5px solid #00000063;
    display: none;
}

.product-profile > .info .versions .version-img .img-active {
    display: block;
}

.product-profile > .info .versions .version-img > img {
    width: 100%;
}

.product-profile > .info .versions .see-more-versions {
    font-size: 13px;
    color: #898989;
    text-decoration: underline;
    margin: 10px 0;
    display: none;
}

.product-profile > .info .versions-text .see-more-versions {

}

.product-profile > .info .versions-img .see-more-versions {

}

.product-profile > .info .description-preview {
	margin-top: 5px;
	position: relative;
}

.product-profile > .info .description-preview .description {
	font-size: 14px;
	color: #727272;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;	
}

.product-profile > .info .description-preview .description p {
	font-size: 14px;
	color: #A5A5A5;	
}

.product-profile > .info .description-preview .see-more {
	font-size: 13px;
    color: #898989;
    position: absolute;
    bottom: 0;
    right: 0;
    background-color: white;
    padding-left: 7px;
    text-decoration: underline;
}

.product-profile .giveaway {
    padding: 15px 15px 0 15px;
    background-color: white;
}

.product-profile .marketplace-panel {
    margin-top: 20px;
    margin-bottom: 5px;
}

.sellers .info-sellers .product-versions-carousel {

}

.sellers .info-sellers .product-versions-carousel .btns-scroll {
    display: none;
}

.sellers .info-sellers .product-versions-carousel .container {
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    overflow-y: hidden;
    position: relative;
    padding: 15px 5px 15px 15px;
    display: flex;
    flex-direction: row;
}

.sellers .info-sellers .product-versions-carousel .product-version-card {
    width: 102px;
    background-color: white;
    border-radius: 10px;
    margin-right: 5px;
    vertical-align: top;
    border: 1px solid #B9B9B9;
    cursor: pointer;
    display: flex;
    flex-direction: column;
}

.sellers .info-sellers .product-versions-carousel > .active {
    border: 1px solid #FFA3A3;
}

.sellers .info-sellers .product-versions-carousel .product-version-card .top {
    background-color: #F0EDF2;
    padding: 8px 10px;
}

.sellers .info-sellers .product-versions-carousel .product-version-card .version-name {
    background-color: #F0EDF2;
    padding: 8px 10px;
}

.sellers .info-sellers .product-versions-carousel .product-version-card .top-img {
    background-color: transparent;
    padding: 0;
    overflow: hidden;
    height: 102px;
    width: 102px;
    border-radius: 10px;
}

.sellers .info-sellers .product-versions-carousel .active .top, 
.sellers .info-sellers .product-versions-carousel .active .version-name {
    background-color: #FFF1EC;
}

.sellers .info-sellers .product-versions-carousel .active .top-img {
    background-color: transparent;
}

.sellers .info-sellers .product-versions-carousel .product-version-card .top span,
.sellers .info-sellers .product-versions-carousel .product-version-card .version-name span {
    color: #939393;
    font-weight: 900;
}

.sellers .info-sellers .product-versions-carousel .active .top span {
    color: #FFA3A3;
}

.sellers .info-sellers .product-versions-carousel .active .version-name span {
    color: #FFA3A3;
}

.sellers .info-sellers .product-versions-carousel .product-version-card .top .version-img {
    width: 102px;
    height: 102px;
    background-color: #f8f8f8;
}

.sellers .info-sellers .product-versions-carousel .product-version-card .top .version-img .selection {
    position: absolute;
    height: 38px;
    width: 38px;
    border: 5px solid #00000063;
    display: none;
}

.sellers .info-sellers .product-versions-carousel .product-version-card .top .version-img img {
    width: 100%;
    object-fit: cover;
}

.sellers .info-sellers .product-versions-carousel .product-version-card .bottom {
    padding: 7px 12px;
    width: 85px;
}

.sellers .info-sellers .product-versions-carousel .product-version-card .bottom .version-name {
    margin-bottom: 5px;
}

.sellers .info-sellers .product-versions-carousel .product-version-card .bottom .version-name .name {
    border-radius: 8px;
    padding: 4px 8px;
    background-color: #F0EDF2;
    border: 1px solid #F0EDF2;
    display: inline-block;    
}

.sellers .info-sellers .product-versions-carousel .product-version-card .bottom .version-name .name span {
    font-weight: 500;
    color: #939393;
    font-size: 13px;
    line-height: 14px;
    white-space: initial;    
    display: inline-block;
}

.sellers .info-sellers .product-versions-carousel .active .bottom .version-name .name {
    background-color: #FFF1EC;
    border: 1px solid #ffd1d1;
}

.sellers .info-sellers .product-versions-carousel .active .bottom .version-name .name span {
    color: #FFA3A3;    
}

.sellers .info-sellers .product-versions-carousel .product-version-card .bottom .price {
    display: flex;
    min-height: 24px;
}

.sellers .info-sellers .product-versions-carousel .product-version-card .bottom .price .currency {
    font-size: 12px;
    margin-top: 3px;
    margin-right: 3px;
}

.sellers .info-sellers .product-versions-carousel .product-version-card .bottom .price .amount {
    font-size: 20px;
    font-weight: 500;
}

.sellers .info-sellers .product-versions-carousel .product-version-card .bottom .price .cents {
    font-size: 12px;
    margin-top: 3px;
    margin-left: 2px;
}

.sellers .info-sellers .product-versions-carousel .product-version-card .bottom .price .no-price {
    font-size: 20px;
    color: #939393;
    font-weight: 500;
}

.sellers .info-sellers .product-versions-carousel .product-version-card .bottom .availability {
    display: block;
}

.sellers .info-sellers .product-versions-carousel .product-version-card .bottom .availability .available {
    color: #007000;
    font-size: 13px;
}

.sellers .info-sellers .product-versions-carousel .product-version-card .bottom .availability .unavailable {
    color: #939393;
    font-size: 13px;
}

.sellers .info-sellers .product-versions-empty {
    margin-top: 0px;
}

.sellers .info-sellers .product-version-price {
    display: none;
}

.sellers .info-sellers .product-version-price-active {
    display: block;
}

.profile-preview {
    background-color: white;
    width: 100%;
    z-index: 29;
    margin-bottom: 15px;
    position: relative;
}

.profile-preview .header {
    height: 195px;
    position: relative;
    text-align: center;
    justify-content: center;
    overflow: hidden;
    background-color: #e6e6e6;
    border-radius: 0;
    margin: -15px -15px 0 -15px;
}

.profile-preview .header .about {
    width: 100%;
}

.profile-preview .profile {
    height: 80px;
    width: 80px;
    border-radius: 50%;
    border: 3px solid white;
    position: absolute;
    top: 120px;
    left: 0px;
    background-color: white;
}

.profile-preview .info {
    padding: 15px 0 10px 0;
}

.profile-preview .info .top {
    width: 100%;
    display: table;
}

.profile-preview .info .top .brand {
    font-family: "Space Mono", sans-serif;
    font-size: 20px;
    float: left;
    text-transform: uppercase;
    background-position: 0 20px;
    background-repeat: no-repeat;
    background-image: linear-gradient(to bottom, transparent 0, #ffeaea 0);
}

.profile-preview .info .description {
    height: 48px;
    position: relative;
    overflow: hidden;
    margin-top: 5px;
}

.profile-preview .info .description .inactive {
    font-size: 12px;
    color: #808080;
    overflow: hidden;
    text-overflow: ellipsis;
    display: inline-block;
    line-height: 16px;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}

.bottom-menu-modal > .container .info-container {
    padding: 0 0 5px 0;
}

.bottom-menu-modal > .container .info-container .codes {
    display: flex;
    flex-direction: column;
}

.bottom-menu-modal > .container .info-container .codes .title {
    line-height: 22px;
    color: #ff5171;
    margin: 5px 0 0 0;
    display: block;
    font-weight: 900;
    margin-bottom: 10px;
    text-align: center;
    font-size: 22px;
}

.bottom-menu-modal > .container .info-container .codes .subtitle {
    line-height: 20px;
    color: #4a4a4a;
    margin: 5px 0 0 0;
    display: block;
    font-weight: 400;
    margin-bottom: 30px;
    text-align: center;
}

.bottom-menu-modal > .container .info-container .codes .container {
    margin-bottom: 20px;
}

.bottom-menu-modal > .container .info-container .codes .border-bottom {
    border-bottom: 1px solid lightgray;
    padding-bottom: 15px;
}

.bottom-menu-modal > .container .info-container .codes .container .code {
    font-size: 17px;
    padding: 2px 7px;
    background-color: #FF5072;
    font-weight: 900;
    color: white;
    border-radius: 3px;
}

.bottom-menu-modal > .container .info-container .codes .container .description {
    line-height: 20px;
    color: #4a4a4a;
    margin: 5px 0 0 0;
    display: block;

}

.bottom-menu-modal > .container .info {
    
}


.bottom-menu-modal > .container .info .table {
    margin-bottom: 15px;
    padding: 0 5px;
    margin-top: 15px;
}

.bottom-menu-modal > .container .info .table .header {
    display: flex;
    align-items: center;
    padding: 5px 10px 5px 10px;
    background-color: #acacac;
    border-top-left-radius: 7px;
    border-top-right-radius: 7px;
}

.bottom-menu-modal > .container .info .table .header .col {
    width: 50%;
}

.bottom-menu-modal > .container .info .table .header .col .text {
    display: block;
    font-size: 15px;
    color: #ffffff;
    font-weight: 500;
}

.bottom-menu-modal > .container .info .table .row {
    display: flex;
    border-bottom: 1px solid #d0d0d0;
    align-items: center;
    padding: 5px 10px 5px 10px;
}

.bottom-menu-modal > .container .info .table .active {
    background-color: #dcedc8;
}

.bottom-menu-modal > .container .info .table .active i {
    font-size: 12px;
    color: #8bc34a;
}

.bottom-menu-modal > .container .info .table .row .col {
    width: 50%;
    display: flex;
}

.bottom-menu-modal > .container .info .table .row .col .text {
    display: block;
    font-size: 15px;
    color: gray;
}

.bottom-menu-modal > .container .info .table .row .col .strong {
    font-weight: 500;
}

.bottom-menu-modal > .container .info .table .row .col .current {
    background-color: green;
    color: white;
    padding: 0 10px;
    border-radius: 15px;
    font-size: 13px;
    margin-left: 10px;
    display: flex;
    align-items: center;
}

.bottom-menu-modal > .container .info .table .row .col .current i {
    color: white;
    font-size: 11px;
    margin-right: 2px;
}

.bottom-menu-modal > .container .info .table .footer {
    display: block;
    font-size: 15px;
    color: gray;
    margin-top: 15px;
}

.bottom-menu-modal > .container .info .info-warning {
    background-color: #fef1c4;
    padding: 5px 10px;
    border-radius: 10px;
    border: 1px solid #d9b035;
    display: flex;
    align-items: center;
    margin-bottom: 15px;
}

.bottom-menu-modal > .container .info .info-warning .icon-col {
    width: 35px;
}

.bottom-menu-modal > .container .info .info-warning .icon-col .circle {
    width: 25px;
    height: 25px;
    border-radius: 50%;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 10px;
    margin-left: 2px;
    background-color: #ff9800;
}

.bottom-menu-modal > .container .info .info-warning .icon-col .circle i {
    color: white;
    font-size: 14px;
}

.bottom-menu-modal > .container .info .info-warning .text {
    font-size: 15px;
    line-height: 20px;
    color: #7c6010;
}

.bottom-menu-modal > .container .info .info-warning .text strong {
    font-weight: 900;
    font-size: 15px;
    color: #7c6010;
}

.bottom-menu-modal > .container > .bg .vertical-menu {
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    max-height: 480px;
    overflow: hidden;
    overflow-y: scroll;
}

.bottom-menu-modal > .container > .bg .vertical-menu .card {
    padding: 10px;
    border: 1px solid #B9B9B9;
    border-radius: 10px;
    cursor: pointer;
    background-color: white;
    margin-bottom: 10px;
}

.bottom-menu-modal > .container > .bg .vertical-menu .card .name {
    font-weight: 900;
    line-height: 16px;
    margin-bottom: 5px;
    color: #939393;
    display: block;
    overflow: hidden;
}

.bottom-menu-modal > .container > .bg .vertical-menu .active {
    border: 1px solid #FFA3A3;
    background-color: #FFF1EC;
}

.bottom-menu-modal > .container > .bg .vertical-menu .card .title {
    color: #939393;
    margin-bottom: 0;
}

.bottom-menu-modal > .container > .bg .vertical-menu .active .title {
    color: #4e4b4b;
    margin-bottom: 0;
}

.bottom-menu-modal > .container > .bg .vertical-menu .card .subtitle {
    
}

.bottom-menu-modal > .container > .bg .vertical-menu .card .subtitle span {
    display: block;
    font-size: 14px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    white-space: initial;
}

.bottom-menu-modal > .container > .bg .vertical-menu .btn-md {
    margin-bottom: 25px;
    border: 1px solid #b9b9b9;
}

.bottom-menu-modal > .container > .bg .vertical-menu .btn-md:hover {
    background-color: white;
}

.bottom-menu-modal > .container > .bg .vertical-menu .btn-md .add {
    color: #939393;
}

.bottom-menu-modal > .container > .bg .vertical-menu .btn-md .fa-plus {
    font-size: 12px;
    color: #939393;
    margin-top: 4px;
}

.product-profile .actions-carousel {
    overflow: auto;
    white-space: nowrap;
    -webkit-overflow-scrolling: touch;
    overflow-y: hidden;
    position: relative;
    padding: 15px 5px 10px 15px;
    background-color: white;
    margin-top: 0;
}

.product-profile .actions-carousel > .container {
    display: none;
}

.product-profile .actions-carousel .active {
    display: block;
}

.product-profile .actions-carousel .action {
    display: inline-block;
    margin: auto;
    padding: 10px 15px;
    border: 1px solid #8d7398;
    color: #896b97;
    border-radius: 20px;
    font-weight: 500;
    cursor: pointer;
    background-color: white;
}

.product-profile .actions-carousel .action .container {
    color: #896b97;
}

.product-profile .actions-carousel .action i {
    color: #896b97;
}

.product-profile .actions-carousel .active-green {
    background-color: #2ab529;
    border: 1px solid #2bb429;
}

.product-profile .actions-carousel .active-red {
    background-color: #f44336;
    border: 1px solid #f44336;
}

.product-profile .actions-carousel .active-purple {
    background-color: #896b97;
    border: 1px solid #896b97;
}

.product-profile .actions-carousel .active-green .container,
.product-profile .actions-carousel .active-green .container i,
.product-profile .actions-carousel .active-red .container,
.product-profile .actions-carousel .active-red .container i,
.product-profile .actions-carousel .active-purple .container,
.product-profile .actions-carousel .active-purple .container i {
    color: white;
}

.buy-ribbon-margin-top {
    background-color: white;
    width: 100%;
    height: 15px;
}

.buy-ribbon-loader {
    background: linear-gradient(111deg, #3c237f 0%, #c786e9 100%);
    height: 65px;
    text-align: center;
    display: none;
}

.buy-ribbon-loader .lds-ellipsis-color div {
    top: 10px;
}

.buy {
	z-index: 0;
    position: relative;
}

.buy .bg {
	background: linear-gradient(111deg, #3c237f 0%, #c786e9 100%);
    padding: 12px 15px 12px 15px;
}

.buy .bg .top {
    height: 35px;
    margin-bottom: 10px;
}

.buy .bg .fa-shopping-cart {
	float: left;
    font-size: 18px;
    color: #ffa3a3;
    margin-top: 8px;
}

.buy .bg .info {
	float: left;
    margin-left: 10px;
}

.buy .bg .info .title {
	display: block;
    color: #ffa3a3;
    font-weight: 500;
    font-size: 18px;
    margin-top: -1px;
}

.buy .bg .info .title i {
    color: #ffa3a3;
    font-size: 13px;
}

.buy .bg .info .subtitle {
	display: block;
    font-size: 12px;
    color: white;
}

.buy .bg .promo {
	float: right;
    background-color: #FFC107;
    padding: 0px 10px;
    border-radius: 15px;
    margin-top: 5px;
}

.buy .bg .promo .text {
	font-size: 12px;
    display: block;
    margin: 5px 0 3px;
    color: #593895;
}

.buy .bg .exclusive {
	background-color: #ffc107;
}

.buy .bg .exclusive .text {
    color: #2317a0;
    font-weight: 500;
}

.buy .bg .exclusive i {
    color: white;
    font-size: 9px;
    float: right;
    margin: 1px 0 0 2px;
}

.buy .bg .price {
	float: right;
	margin-left: 10px;
    text-align: right;
    margin-top: 5px;
}

.buy .bg .price .container {
	height: 24px;
}

.buy .bg .price .container .money {
	font-size: 13px;
    float: right;
    color: white;
    margin-top: 7px;
    font-weight: 500;
    margin-right: 3px;
}

.buy .bg .price .container .amount {
	float: right;
    font-size: 24px;
    font-weight: 900;
    color: white;
}

.buy .bg .btn-slim {
	font-size: 13px;
    display: block;
    color: white;
    padding: 6px 28px;
    border-radius: 20px;
    border: 1px solid white;
    text-align: center;
}

.buy .bg .btn-slim i {
    font-size: 10px;
    color: white;
}

.load-stores {
	height: 95px;
    background-color: #f8f8f8;
    text-align: center;
    padding-top: 20px;
    display: none;
}

.load-stores .lds-ellipsis-color div {
    top: 15px;
}

.loaded-stores {
	height: auto;
	padding: 0;
}

.price-comparison {
	padding: 0;
	background-color: white;
}

.price-comparison .versions {
	background-color: white;
    width: 100%;
    display: table;
}

.price-comparison .versions .container {
	padding: 12px 10px 8px 10px;
	float: left;
    text-align: left;
}

.price-comparison .versions .container .version-container {
	display: inline-block;
}

.price-comparison .versions .container .version {
	float: left;
    margin-right: 5px;
}

.price-comparison .versions .container .version .bg {
	background-color: white;
    padding: 1px 11px;
    border-radius: 10px;
    border: 1px solid #8d8d8d;
}

.price-comparison .versions .container .version .bg span {
	color: #8d8d8d;
    font-size: 12px;
    margin: 3px 0 2px 0;
    display: block;
}

.price-comparison .versions .container .version .active {
	background-color: #FFA3A3;
    border: 1px solid #ffa3a3;
}

.price-comparison .versions .container .version .active span {
	color: white;
    font-weight: 500;
}

.price-comparison .store-row {
	display: table;
    width: 100%;
    height: 50px;
    border-bottom: 1px solid lightgray;
}

.price-comparison .store-row:last-of-type {
    border-bottom: none;
}

.price-comparison .active {
	border-bottom: 1px solid transparent;
}

.price-comparison .stores-row {
	padding: 0 15px;
	background-color: #f6f6f6;
	min-height: 51px;
}

.price-comparison .store-row .logo {
	width: 85px;
    float: left;
    margin-top: 11px;
}

.price-comparison .store-row .chevron-toggle {

}

.price-comparison .store-row .chevron-toggle i {
	float: left;
    font-size: 12px;
    margin-top: 21px;
    color: #aeaeae;
}

.price-comparison .store-row .price {
	float: right;
    cursor: pointer;
}

.price-comparison .store-row .price .product-price-a {
	background: linear-gradient(111deg, #3c237f 0%, #c786e9 100%);
    padding: 9px 10px;
    margin-top: 6px;
    display: inline-block;
    border-radius: 10px;
    min-width: 60px;
    text-align: right;
    cursor: pointer;
}

.price-comparison .store-row .price .product-price-a .country {
	font-size: 10px;
    color: white;
}

.price-comparison .store-row .price .product-price-a .sign {
	font-size: 12px;
    color: white;
}

.price-comparison .store-row .price .product-price-a .amount {
	color: white;
    font-weight: 900;
    margin-left: 1px;
}

.price-comparison .store-row > .promo {
	float: right;
}

.price-comparison .store-row > .promo .btn {
	float: right;
    background-color: white;
    padding: 0px 10px;
    border-radius: 15px;
    margin-right: 10px;
    border: 1px solid #ffa3a3;
    margin-top: 13px;
    cursor: pointer;
}

.price-comparison .store-row > .promo .btn-product-store {
    margin-top: 6px;
    margin-bottom: 2px;
}

.price-comparison .store-row > .promo .btn span {
	font-size: 12px;
    display: block;
    margin: 5px 0 3px;
    color: #ff7d7d;
}

.price-comparison .store-row > .promo .original-price {
	float: right;
    margin-top: 9px;
    margin-right: 10px;
    text-align: right;
}

.price-comparison .store-row > .promo .original-price .amount {
	font-size: 12px;
    color: #818181;
    text-decoration: line-through;
    font-weight: 500;
}

.price-comparison .store-row > .promo .original-price .amount .currency {
	font-size: 8px;
    color: #818181;
    display: inline-block;
}

.price-comparison .store-row > .promo .original-price .discount {
	font-size: 14px;
	font-weight: 900;
	color: #818181;	
	display: block;
}

.price-comparison .store-row .visit {
    float: right;
    padding: 13px 60px 0 0;
}

.price-comparison .store-row .visit-product-store {
    float: right;
    padding: 8px 60px 0 0;
}

.price-comparison .store-row .visit .link-a {
    font-size: 12px;
    color: #818181;
    background-color: white;
    padding: 5px 8px 4px 8px;
    border-radius: 15px;
    border: 1px solid #b1b1b1;
}

.price-comparison .store-row .product-store {
    font-size: 11px;
    color: #818181;
    display: block;
    margin-top: 6px;
}

.price-comparison .store-row .product-store i {
    font-size: 9px;
    color: #a1a1a1;
}

.price-comparison .stores-row-loader {
    display: none;
}

.price-comparison .stores-row-loader .lds-ellipsis-color div {
    top: 4px;
}

.promo-product-post {
    position: relative;
    padding-bottom: 7px;
    text-align: left;
    display: none;
}

.promo-product-post .promo {
	margin-bottom: 15px;
	position: relative;
}

.promo-product-post .promo-exclusive .profile {
	left: 15px;
}

.footer-btn {
    text-align: left;
    padding: 5px 15px 160px 15px;
}

.footer-btn .disclaimer {
    font-size: 14px;
    color: #b6aeb9;
    display: block;
    line-height: 20px;
}

.insight-row {
    margin-bottom: 35px;
}

.insight-row .icon-col {
    float: left;
    width: 40px;
    text-align: center;
}

.insight-row .icon-col i {
    font-size: 18px;
    color: #6d6d6d;
}

.insight-row .text-col {
    padding-left: 40px;
    margin-bottom: 5px;
}

.insight-row .text-col .title {
    font-weight: 500;
    display: block;
    color: #6d6d6d;
    margin-bottom: 4px;
}

.insight-row .text-col .subtitle {
    font-size: 15px;
    color: #8d8d8d;
    display: block;
    line-height: 18px;
}

.spec-container {
    display: table;
    width: 100%;
    margin-bottom: 10px;
}

.spec-col {
    width: 50%;
    float: left;
    margin-bottom: 7px;
}

.spec-col .icon-col {
    width: 30px;
    text-align: center;
    float: left;
    padding-top: 2px;
}

.spec-col .icon-col img {
    width: 20px;
}

.spec-col .text-col {
    padding-left: 30px;
    padding-top: 2px;
}

.spec-col .text-col .name {
    font-size: 14px;
    color: #727272;
}

.info-title {
    font-size: 16px;    
    font-weight: 900;
    display: block;
    color: #887e8d;
    margin-bottom: 4px;
}

.info-title small {
    font-size: 14px;
    color: #6d6d6d;
}

.info-text-container {
    margin-bottom: 25px;
}

.info-text-container > a {
    display: none;
}

.info-text-container .active {
    display: block;
}

.info-text {
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
}

.info-text .article > div {
    display: none;
}

.info-text .article .active {
    display: block;
}

.info-text-full {
    -webkit-line-clamp: initial;
}

.info-text-wrapper {

}

.see-more-info-text {
    font-size: 13px;
    color: #727272;
    display: none;
    text-decoration: underline;
}

.info-a {
    text-decoration: underline;
}

.info-category-path {
	margin-top: 5px;
	padding-bottom: 15px;
}

.info-category-path .category {
	font-size: 14px;
    color: #727272;
    display: inline-block;
}

.info-category-path .category-divider {
	font-size: 14px;
    color: #727272;
    display: inline-block;
}

.ingredients-container {

}

.ingredient-row {
    width: 100%;
    margin-bottom: 5px;
}

.ingredient-row .num-col {
    float: left;
    width: 30px;
    text-align: center;
}

.ingredient-row .num-col span {
    font-size: 12px;
    color: #A3A3A3;
}

.ingredient-row .text-col {
    padding-left: 30px;
}

.ingredient-row .text-col span {
    font-size: 14px;
    color: #727272;
    display: block;
    line-height: 20px;
}

.ingredients-note {
    font-size: 12px;
    color: #A3A3A3;
    display: block;
    line-height: 18px;
    margin-top: 20px;
    margin-bottom: 15px;
}

.reviews-summary {
    display: table;
    background-color: #FCF2EE;
    width: 100%;
    margin-top: 10px;
}

.reviews-summary > .container {
    padding: 10px 15px 15px 15px;
}

.reviews-summary .top-row {
}

.reviews-summary .top-row .overall-rating {
    margin-bottom: 12px;
    float: left;
}

.reviews-summary .top-row .overall-rating .star,
.review-feed-summary .top .star {
    float: left;
    padding-left: 0;
    margin-top: 11px;
    margin-left: 0;
    z-index: 0;
}

.reviews-summary .top-row .overall-rating .number,
.review-feed-summary .top .number {
    font-size: 46px;
    font-weight: 900;
    float: left;
    margin-top: 3px;
    letter-spacing: -1px;
}

.reviews-summary .top-row .overall-rating .base,
.review-feed-summary .top .base {
    font-size: 14px;
    color: #897a7a;
    float: left;
    margin: 31px 0 0 3px;
}

.reviews-summary .top-row .overall-rating-text,
.review-feed-summary .top .right-col {
    padding-left: 150px;
    padding-top: 10px;
}

.reviews-summary .top-row .overall-rating-text .title,
.review-feed-summary .top .title {
    color: #897a7a;
    font-weight: 500;
    display: block;
    margin-bottom: 12px;
}

.reviews-summary .top-row .overall-rating-text .title small,
.review-feed-summary .top .title small {
    color: #897a7a;
    font-size: 12px;
}

.reviews-summary .product-star {
    float: left;
    margin-right: 5px;
}



.brand-cards-no-padding {
    margin-bottom: 0;
    margin-top: 10px;
}

.brand-cards .card {
    margin-bottom: 0;
}

.pnl-padding-0 {
    padding: 20px 0;
}

.review-feed-summary {
    background-color: #FCF2EE;
    padding: 20px 15px 5px 15px;
}

.review-feed-summary .top {
    margin-bottom: 20px;
    display: table;
    width: 100%;
}

.review-feed-summary .top .left-col {
    width: 160px;
    float: left;
}

.review-feed-summary .spec-row-lg {
    margin-bottom: 35px;
    min-height: 55px;
}

.review-feed-summary .spec-row-lg .circle {
    float: left;
    width: 55px;
    height: 55px;
    background-color: white;
    border-radius: 50%;
    text-align: center;
    margin: 0 15px 0 10px;
}

.review-feed-summary .spec-row-lg .circle span {
    color: white;
    font-size: 23px;
    font-weight: 900;
    margin-top: 15px;
    display: block;
}

.review-feed-summary .spec-row-lg .text {
    padding-left: 80px;
}

.review-feed-summary .spec-row-lg .text .name {
    font-weight: 500;
    display: block;
    color: #897a7a;
    margin-bottom: 4px;
}

.review-feed-summary .spec-row-lg .text .description {
    font-size: 15px;
    color: #A7A08A;
    display: block;
    line-height: 18px;
}


/* Review */

.btn-md-new-content {
    margin-bottom: 8px;
    margin-right: 4px;
    background-color: white;
}

.btn-md-question-group {
    border: 1px solid #c3c3c3;
    color: #a4a4a4;
    margin-bottom: 8px;
}

.btn-md-question-group i {
    color: #a4a4a4;
}

.new-content-section {
    padding: 25px 15px 25px 15px;
    background-color: white;
    margin-bottom: 7px;
}

.hidden-content-section {
    display: none;
}

.incomplete-bg {
    background-color: #fff6f7;
}

.new-content-section .incomplete {
    display: none;
}

.new-content-section .incomplete .text {
    color: red;
    display: block;
    margin-top: 5px;
    margin-bottom: 7px;
}

.new-content-section .incomplete .text i {
    color: red;
    font-size: 14px;
}

.new-content-section .select-version {
    
}

.new-content-section .new-content-section-title,
.new-content-section .new-content-section-title .title {
    font-size: 21px;
    font-weight: 900;
    color: #ff9f9f;
}

.new-content-section .new-content-section-title small {
    font-size: 14px;
    font-weight: 900;
    color: #ff9f9f;
}

.new-content-section .new-content-section-title .secondary-color {
    font-size: 21px;
    font-weight: 900;
    color: #6F5DFD;
}

.new-content-section .incomplete-txt,
.new-content-section .incomplete-txt .title,
.new-content-section .incomplete-txt small {
    color: red;
}

.new-content-section .select-version .versions {
    display: flex;
    width: 100%;
    text-align: center;
    margin-top: -5px;
    flex-direction: row;
    flex-wrap: wrap;
}

.new-content-section .select-version .versions .col {
    float: left;
    width: 50%;
    margin-bottom: 30px;
}

.new-content-section .select-version .versions .col:nth-child(2n+1) {
    clear: left;
}

.new-content-section .select-version .versions .col:nth-child(2n+1) .container {
    padding-right: 7px;
}

.new-content-section .select-version .versions .col:nth-child(2n+2) .container {
    padding-left: 7px;
}

.new-content-section .select-version .versions .col .container .image-box {
    border: 1px solid #E5E5E5;
    border-radius: 10px;
    overflow: hidden;
    text-align: center;
    background-image: url("<%= asset_path 'icons/product-placeholder.png' %>");
    background-size: cover;    
    background-color: #f3f3f3;
}

.new-content-section .select-version .versions .col .container > .image-box-selected {
    border: 1px solid #ffa3a3;
}

.new-content-section .select-version .versions .col .container .other-version {
    background-image: url("<%= asset_path 'icons/product-placeholder-2.png' %>");
}

.new-content-section .select-version .versions .col .container .image-box img {
    width: 100%;
}

.new-content-section .select-version .versions .col .container .image-box { height: 138px; }
.new-content-section .select-version .versions .col .container .image-box img { height: 138px; }


.new-content-section .select-version .versions .col .container .brand {
    font-weight: 900;
    font-family: "Space Mono", monospace;
    font-size: 13px;
    text-transform: uppercase;
    display: block;
    margin-bottom: -2px;
    margin-top: 5px;
}

.new-content-section .select-version .versions .col .container .name {
    font-size: 15px;
    color: #6a6a6a;
}

.new-content-section .select-version .versions .col .container .version-btn .version {
    display: inline-block;
    margin-top: 10px;
}

.new-content-section .select-version .versions .col .other-version-btn {
    display: inline-block;
    margin-top: 10px;
}

.new-content-section .select-version .versions .col .other-version-btn .bg {
    background-color: #fff1ec;
    border: 1px solid #ffd1d1;
    padding: 1px 11px;
    border-radius: 10px;
}

.new-content-section .select-version .versions .col .other-version-btn .bg .txt {
    color: #FFA3A3;
    font-size: 15px;
    margin: 3px 0 2px 0;
    display: block;
}

.new-content-section .select-version .versions .col .other-version-btn .bg .txt i {
    color: #FFA3A3;
    font-size: 12px;
}

.new-content-section .select-version .versions .col .container .version-btn .version .bg {
    background-color: #fff1ec;
    border: 1px solid #ffd1d1;
    padding: 1px 11px;
    border-radius: 15px;
}

.new-content-section .select-version .versions .col .container .version-btn .version .bg .txt {
    color: #FFA3A3;
    margin: 3px 0 2px 0;
    display: block;
    font-size: 15px;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;    
}

.new-content-section .select-version .versions .col .container .version-btn .version-img {
    margin-top: 10px;
}

.new-content-section .select-version .versions .col .container .version-btn .version-img .bg {
    background-color: #fff1ec;
    border: 1px solid #ffd1d1;
    padding: 5px 10px 5px 6px;
    border-radius: 8px;
    display: table;
    margin: auto;
}

.new-content-section .select-version .versions .col .container .version-btn .version-img .bg img {
    width: 20px;
    height: 20px;
    float: left;
    border-radius: 5px;
    border: 1px solid #ffffff8f;
    background-color: white;
}

.new-content-section .select-version .versions .col .container .version-btn .version-img .bg .txt {
    color: #8d8d8d;
    font-size: 13px;
    margin: 4px 0 2px 25px;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.new-content-section .select-version .versions .col .container .selected .version .bg {
    background-color: #ffa3a3;
    border: 1px solid #ffa3a3;
}

.new-content-section .select-version .versions .col .container .selected .version .bg .txt,
.new-content-section .select-version .versions .col .container .selected .version .bg .txt i {
    color: white;
}

#another-version-back i,
#custom-version-back i {
    float: left;
    margin-left: 0;
    margin-right: 5px;
}

.new-content-section .select-version .other-versions {
    border-top: 1px solid #d6d6d6;
    padding-top: 20px;
    margin-top: -10px;
    padding-bottom: 10px;
}

.new-content-section .option-row {
    padding: 15px 0 20px 0;
}

.new-content-section .option-row .title {
    display: block;
    margin-bottom: 15px;
    font-weight: 900;
    font-size: 14px;
    color: #a4a4a4;
}

.new-content-section .option-row .content-subject {
    border: 1px solid #bababa;
    padding: 15px;
    border-radius: 10px;
    width: initial;
    margin-top: 10px;
    cursor: pointer;
}

.new-content-section .option-row .content-subject {

}

.new-content-section .brand-products {
    display: none;
}

.new-content-section .option-row .active {
    border: 1px solid #FFA3A3;
    background-color: #fff7f7;
}

.another-version, .write-custom-version {
    display: none;
}

.another-version-box {
    padding-bottom: 15px;
}

.write-custom-version {
    padding-bottom: 15px;
}

.btn-md-active i {
    color: white;
    font-size: 14px;
}

#review-panel, #photo-panel, #video-panel, #question-panel, #select-question-type {
    display: none;
}

.product-general-rating {
    margin-top: 20px;
}

.product-general-rating .product-version {
    display: none;
    width: 100%;
    text-align: center;
    margin-top: -5px;
}

.product-general-rating .product-version-selected {
    display: table;
}

.product-general-rating .product-version .product-col {
    float: left;
    width: 50%;
}

.product-general-rating .product-version .product-col .image-box {
    border: 1px solid #E5E5E5;
    border-radius: 10px;
    overflow: hidden;
    text-align: center;
    background-image: url("<%= asset_path 'icons/product-placeholder.png' %>");
    background-size: cover;    
    background-color: #f3f3f3;
    position: relative;
}

.product-general-rating .product-version .product-col .image-box .general-rating {
    background-color: #ffffffde;
    position: absolute;
    width: 100%;
    display: none;
    align-items: center;
    justify-content: center;
}

.product-general-rating .product-version .product-col .image-box .general-rating-selected {
    display: flex;
}

.product-general-rating .product-version .product-col .image-box .general-rating .container {
      
}

.product-general-rating .product-version .product-col .image-box .general-rating .general-rating-star {
    display: inline-block;
    z-index: 0;
    padding: 0;
}

.product-general-rating .product-version .product-col .image-box .general-rating .number {
    font-size: 54px;
    color: #ffc007;
}

.product-general-rating .product-version .product-col .image-box .img {
    width: 100%;
}

.product-general-rating .product-version .info-col {
    text-align: left;
    float: left;
    width: 50%;
}

.product-general-rating .product-version .info-col .container {
    padding-left: 15px;
}

.product-general-rating .product-version .info-col .brand {
    font-family: "Space Mono", sans-serif;
    font-size: 15px;
    text-transform: uppercase;
    display: block;
    margin-bottom: -3px;
    margin-top: -4px;
}

.product-general-rating .product-version .info-col .name {
    font-family: "Roboto", sans-serif;
    margin-top: 9px;
    color: #6a6a6a;
}

.product-general-rating .product-version .info-col .version-btn {

}

.product-general-rating .product-version .info-col .version-btn .version {
    display: inline-block;
    margin-top: 7px;
    margin-bottom: 7px;
}

.product-general-rating .product-version .info-col .version-btn .version .bg {
    background-color: #ffa3a3;
    border: 1px solid #ffa3a3;
    padding: 1px 11px;
    border-radius: 10px;
}

.product-general-rating .product-version .info-col .version-btn .version .bg .txt {
    color: white;
    font-size: 13px;
    margin: 3px 0 2px 0;
    display: block;
}

.product-general-rating .product-version .info-col .version-btn .version-img {

}

.product-general-rating .product-version .info-col .version-btn .version-img .bg {
    background-color: #fff1ec;
    border: 1px solid #ffd1d1;
    padding: 5px 8px 5px 5px;
    border-radius: 10px;
    display: table;
    margin-top: 7px;
    margin-bottom: 3px;
}

.product-general-rating .product-version .info-col .version-btn .version-img .bg .img {
    width: 20px;
    height: 20px;
    background-color: white;
    float: left;
    border-radius: 5px;
    border: 1px solid #ffffff8f;
}

.product-general-rating .product-version .info-col .version-btn .version-img .bg .txt {
    color: #8d8d8d;
    font-size: 13px;
    margin: 4px 0 2px 5px;
    float: left;
}

.product-general-rating .product-version .change-version {
    font-size: 13px;
    color: #B5B5B5;
    display: inline-block;
    margin-top: 5px;
    cursor: pointer;
}

.new-content-section .rating-stars {
    padding: 12px 0 10px 0;
}

.new-content-section .rating-stars > div {
    padding: 0;
    margin: 0;
    z-index: 0;
}

.new-content-section .rating-stars .star-number {
    display: flex;
    text-align: center;
    width: 300px;
    margin-left: 0;
    margin-top: 5px;
}

.new-content-section .rating-stars .star-number span {
    font-weight: 500;
    color: #d7d7d7;
    width: 10%;
}

.new-content-section .spec-title {

}

.new-content-section .spec-title .new-content-section-title {
    
}

.new-content-section .spec-title .spec-rating {
    display: none;
}

.new-content-section .spec-title .spec-rating-active {
    display: inline-block;
}

.new-content-section .spec-title .spec-rating .star {
    margin: 0;
    padding: 0;
    float: left;
    margin-top: 3px;
    margin-right: 2px;
    z-index: 0;
}

.new-content-section .spec-title .spec-rating .number {
    font-size: 21px;
    font-weight: 900;
    color: #ffc007;
}

.new-content-section .new-content-section-subtitle {
    font-size: 14px;
    color: #AFAFAF;
    display: block;
    margin-top: 5px;
}

.new-content-section .selection-btns {
    margin-top: 10px;
}

.sub-group-day, .sub-group-week, .sub-group-month, .sub-group-year,
.sub-group-day-finish, .sub-group-week-finish, .sub-group-month-finish, .sub-group-year-finish {
    background-color: #FFFDE7
}

.new-content-section .add-media {
    margin-top: 10px;
}

.new-content-section .tag-brand {
    margin-top: -3px;
}

.new-content-section .tag-brand i {
    font-size: 14px;
    color: gray;
    float: left;
    margin-top: 2px;
}

.new-content-section .tag-brand span {
    font-size: 14px;
    color: gray;
    display: block;
    line-height: 18px;
    padding-left: 20px;
}

.new-content-section .input {
    margin-top: 10px;
}

.btn-md-active {
    color: white;
    background-color: #ffa3a3;
    border: 1px solid #ffa3a3;
}

#smell-2, #reaction-2, #reaction-3, #reasons-to-stop-using {
    display: none;
}

.media-group-hidden {
    display: none;
}

.section-title-margin {
    margin: 0 15px;
    margin-bottom: 20px;
}

.count-container {
    display: inline-block;
}

.count-container .count {
    display: none;
}

.count-container .active {
    display: block;
}

.product-versions-media-select {
    padding: 10px 0 10px 15px;
    overflow: auto;
    white-space: nowrap;
    -webkit-overflow-scrolling: touch;
    overflow-y: hidden;
    position: relative;
}

.product-versions-media-select .product-version {
    margin-right: 5px;
    display: inline-block;
    cursor: pointer;
}

.product-versions-media-select .product-version-img {
    margin-bottom: -3px;
}

.product-versions-media-select .product-version .bg {
    background-color: white;
    border: 1px solid #F0F0F0;
    padding: 1px 11px;
    border-radius: 10px;
}

.product-versions-media-select .product-version-img .bg {
    background-color: white;
    border: 1px solid #F0F0F0;
    padding: 5px 8px 5px 5px;
    border-radius: 10px;
    display: table;
}

.product-versions-media-select .product-version .active {
    background-color: #ffa3a3;
    border: 1px solid #ffa3a3;
}

.product-versions-media-select .product-version .bg .text {
    color: #8d8d8d;
    font-size: 13px;
    margin: 3px 0 2px 0;
    display: block;
}

.product-versions-media-select .product-version-img .bg .text {
    color: #8d8d8d;
    font-size: 13px;
    margin: 4px 0 2px 5px;
    float: left;
}

.product-versions-media-select .product-version-img .bg img {
    width: 20px;
    float: left;
    border-radius: 5px;
    border: 1px solid #ffffff8f;
}

.product-versions-media-select .product-version .active .text {
    color: white;
}

.edit-featured-order {
    font-size: 14px;
    text-decoration: underline;
    display: block;
    margin-top: 10px;
    width: 100%;
    float: left;
    cursor: pointer;
}

.question-classifications {
    max-height: 440px;
    overflow: hidden;
    overflow-y: scroll;
}

.question-classifications .question-types .question-type .group .col-info .title {
    font-size:  18px;
}

.question-classifications .question-types .question-type .group {
    min-height: 44px;
}

.question-classifications .question-types .question-type .group .col-icon .bg {
    width: 40px;
    height: 40px;
}

.question-classifications .question-types .question-type .group .col-info {
    padding-top: 6px;
    height: 36px;
}

.question-types {

}

.question-types .question-type {
    margin-bottom: 15px;
}

.question-types .question-type .group {
    border: 1px solid #C3C3C3;
    padding: 20px 15px;
    border-radius: 15px;
    min-height: 50px;
    cursor: pointer;
}

.question-types .question-type .active {
    border: 1px solid #FFA3A3;
}

.question-types .question-type .group .col-icon {
    float: left;
}

.question-types .question-type .group .col-icon .bg {
    width: 50px;
    height: 50px;
    background-color: #FFF1EC;
    border-radius: 50%;
    overflow: hidden;
}

.question-types .question-type .group .col-icon .bg img {
    width: 100%;
}

.question-types .question-type .group .col-info {
    padding-left: 15px;
    padding-top: 2px;
    height: 45px;
    display: flex;
    align-items: center;
}

.question-types .question-type .group .col-info-no-classification {
    padding-left: 0;
}

.question-types .question-type .group .col-info .title {
    font-size: 18px;
    color: #FFA3A3;
    font-weight: 900;
    display: block;
}

.question-types .question-type .group .col-info .subtitle {
    font-size: 14px;
    color: #818181;
}

.question-types .question-type .subgroup-collapse {
    padding-bottom: 50px;
    display: none;
}

.question-types .question-type .subgroup-collapse .subgroup-close {
    display: table;
    width: 100%;
}

.question-types .question-type .subgroup-collapse .subgroup-close .col {
    width: 40px;
    height: 15px;
    float: left;
}

.question-types .question-type .subgroup-collapse .subgroup-close .col .left {
    width: 20px;
    float: left;
    height: 15px;
}

.question-types .question-type .subgroup-collapse .subgroup-close .col .right {
    width: 19px;
    float: left;
    height: 15px;
    border-left: 1px solid #d5d5d5;
}

.question-types .question-type .subgroup-collapse .subgroup-close .close {
    margin-top: 15px;
    margin-left: 0px;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.question-types .question-type .subgroup-collapse .subgroup-close .close .container {
    margin-left: 6px;
}

.question-types .question-type .subgroup-collapse .subgroup-close .close .container span {
    font-size: 14px;
    color: #b2b2b2;
    font-weight: 500;
    line-height: 14px;
}

.question-types .question-type .subgroup-collapse .subgroup-container {
    display: table;
    width: 100%;
}

.question-types .question-type .subgroup-collapse .subgroup-container .subgroup-left {
    width: 46px;
    float: left;
}

.question-types .question-type .subgroup-collapse .subgroup-container .subgroup-left .left {
    width: 20px;
    float: left;
    height: 56px;
}

.question-types .question-type .subgroup-collapse .subgroup-container .subgroup-left .right {
    width: 25px;
    float: left;
    height: 56px;
}

.question-types .question-type .subgroup-collapse .subgroup-container .subgroup-left .right .top {
    border-left: 1px solid #d5d5d5;
    border-bottom: 1px solid #d5d5d5;
    width: 100%;
    height: 35px;
}

.question-types .question-type .subgroup-collapse .subgroup-container .subgroup-left .right .bottom {
    border-left: 1px solid #d5d5d5;
    height: 20px;
}

.question-types .question-type .subgroup-collapse .subgroup-container .subgroup-left .right .bottom-last {
    border-left: none;
}

.question-types .question-type .subgroup-collapse .subgroup-container .subgroup-right {
    padding-top: 15px;
}

.question-types .question-type .subgroup-collapse .subgroup-container .subgroup-right .option {
    display: inline-block;
    margin: auto;
    padding: 10px 15px;
    border-radius: 20px;
    font-weight: 500;
    cursor: pointer;
    border: 1px solid #6E6E6E;
    color: #6E6E6E;
    background-color: white;
}

.question-types .question-type .subgroup-collapse .subgroup-container .subgroup-right .option i {
    font-size: 14px;
    color: lightgray;
}

.question-types .question-type .subgroup-collapse .subgroup-container .subgroup-right > .active-selectable {
    border: 1px solid #FFA3A3;
    background-color: #FFA3A3;
    color: white;
}

.question-types .question-type .subgroup-collapse .subsubgroup-collapse {
    display: none;
}

.question-types .question-type .subgroup-collapse .subsubgroup-collapse-last {

}

.question-types .question-type .subgroup-collapse .subsubgroup-collapse .subsubgroup-close {
    display: table;
    width: 100%;
}

.question-types .question-type .subgroup-collapse .subsubgroup-collapse .subsubgroup-close .col-group {
    width: 51px;
    height: 15px;
    float: left;
}

.question-types .question-type .subgroup-collapse .subsubgroup-collapse .subsubgroup-close .col-group .left {
    width: 20px;
    float: left;
    height: 15px;
}

.question-types .question-type .subgroup-collapse .subsubgroup-collapse .subsubgroup-close .col-group .right {
    width: 30px;
    float: left;
    height: 15px;
    border-left: 1px solid #d5d5d5;
}

.question-types .question-type .subgroup-collapse .subsubgroup-collapse-last .subsubgroup-close .col-group .right {
    border-left: none;
}

.question-types .question-type .subgroup-collapse .subsubgroup-collapse .subsubgroup-close .col-subgroup {
    width: 35px;
    height: 15px;
    float: left;
}

.question-types .question-type .subgroup-collapse .subsubgroup-collapse .subsubgroup-close .col-subgroup .left {
    width: 12px;
    float: left;
    height: 15px;
}

.question-types .question-type .subgroup-collapse .subsubgroup-collapse .subsubgroup-close .col-subgroup .right {
    width: 21px;
    float: left;
    height: 15px;
    border-left: 1px solid #d5d5d5;
}

.question-types .question-type .subgroup-collapse .subsubgroup-collapse .subsubgroup-close .col-close {
    margin-top: 18px;
}

.question-types .question-type .subgroup-collapse .subsubgroup-collapse .subsubgroup-close .col-close .container {
    
}

.question-types .question-type .subgroup-collapse .subsubgroup-collapse .subsubgroup-close .col-close .container span {
    font-size: 14px;
    color: #b2b2b2;
    font-weight: 500;
    line-height: 15px;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.question-types .question-type .subgroup-collapse .subsubgroup-collapse .subsubgroup-container {
    min-height: 56px;
}

.question-types .question-type .subgroup-collapse .subsubgroup-collapse .subsubgroup-container .subsubgroup-left {
    width: 90px;
    height: 56px;
    float: left;
}

.question-types .question-type .subgroup-collapse .subsubgroup-collapse .subsubgroup-container .subsubgroup-left .subsubgroup-inner-left {
    width: 51px;
    height: 56px;
    float: left;
}

.question-types .question-type .subgroup-collapse .subsubgroup-collapse .subsubgroup-container .subsubgroup-left .subsubgroup-inner-left .left {
    width: 20px;
    float: left;
    height: 56px;
}

.question-types .question-type .subgroup-collapse .subsubgroup-collapse .subsubgroup-container .subsubgroup-left .subsubgroup-inner-left .right {
    width: 30px;
    float: left;
    height: 56px;
    border-left: 1px solid #d5d5d5;
}

.question-types .question-type .subgroup-collapse .subsubgroup-collapse-last .subsubgroup-container .subsubgroup-left .subsubgroup-inner-left .right {
    border-left: none;
}

.question-types .question-type .subgroup-collapse .subsubgroup-collapse .subsubgroup-container .subsubgroup-left .subsubgroup-inner-right {
    width: 25px;
    height: 56px;
    float: left;
}

.question-types .question-type .subgroup-collapse .subsubgroup-collapse .subsubgroup-container .subsubgroup-left .subsubgroup-inner-right .left {
    width: 12px;
    float: left;
    height: 56px;
}

.question-types .question-type .subgroup-collapse .subsubgroup-collapse .subsubgroup-container .subsubgroup-left .subsubgroup-inner-right .right {
    width: 13px;
    float: left;
    height: 56px;
}

.question-types .question-type .subgroup-collapse .subsubgroup-collapse .subsubgroup-container .subsubgroup-left .subsubgroup-inner-right .right .top {
    width: 26px;
    height: 35px;
    float: left;
    border-left: 1px solid #d5d5d5;
    border-bottom: 1px solid #d5d5d5;
}

.question-types .question-type .subgroup-collapse .subsubgroup-collapse .subsubgroup-container .subsubgroup-left .subsubgroup-inner-right .right .bottom {
    width: 25px;
    height: 20px;
    float: left;
    border-left: 1px solid #d5d5d5;
}

.question-types .question-type .subgroup-collapse .subsubgroup-collapse .subsubgroup-container .subsubgroup-left .subsubgroup-inner-right .right .bottom-last {
    border-left: none;
}

.question-types .question-type .subgroup-collapse .subsubgroup-collapse .subsubgroup-container .subsubgroup-right {
    padding-top: 15px;
}

.question-types .question-type .subgroup-collapse .subsubgroup-collapse .subsubgroup-container .subsubgroup-right .option {
    display: inline-block;
    margin: auto;
    padding: 10px 15px;
    border-radius: 20px;
    font-weight: 500;
    cursor: pointer;
    border: 1px solid #6E6E6E;
    color: #6E6E6E;
    background-color: white; 
}

.question-types .question-type .subgroup-collapse .subsubgroup-collapse .subsubgroup-container .subsubgroup-right .active-selectable {
    border: 1px solid #FFA3A3;
    background-color: #FFA3A3;
    color: white;
}

.question-types .question-type .subgroup-collapse .subsubgroup-collapse-row {
    min-height: 40px;
}

.question-types .question-type .subgroup-collapse .subsubgroup-collapse-row .col-group {
    width: 51px;
    height: 40px;
    float: left;
}

.question-types .question-type .subgroup-collapse .subsubgroup-collapse-row .col-group .left {
    width: 20px;
    float: left;
    height: 40px;
}

.question-types .question-type .subgroup-collapse .subsubgroup-collapse .subsubgroup-collapse-row .col-group .right {
    width: 30px;
    float: left;
    height: 40px;
    border-left: 1px solid #d5d5d5;
}

.question-types .question-type .subgroup-collapse .subsubgroup-collapse-last .subsubgroup-collapse-row .col-group .right {
    border-left: none;
}

.selected-option {
    margin: 12px 0 15px 0;
}

.selected-option .bg {
    background-color: white; /*#fff1ec*/
    border: 1px solid #7c7c7c; /*#ffd1d1*/
    padding: 1px 11px;
    border-radius: 15px;
    display: inline-block;
    margin-right: 5px;
}

.selected-option .bg .txt {
    color: #737373; /*#FFA3A3*/
    margin: 3px 0 2px 0;
    display: block;
    font-size: 15px;
}

.selected-option .change-question-group {
    font-size: 13px;
    color: #B5B5B5;
    display: inline-block;
    margin-top: 5px;
    cursor: pointer;
}

.assign-option {
    margin: 12px 0 15px 0;
    display: none;
}

.assign-option .bg {
    background-color: #f8f8f8;
    border: 1px solid #d1d1d1;
    padding: 1px 11px;
    border-radius: 15px;
    display: inline-block;
    margin-right: 5px;
}

.assign-option .bg .txt {
    color: #9c9c9c;
    margin: 3px 0 2px 0;
    display: block;
    font-size: 15px;
}

.assign-option .change-question-group {
    font-size: 13px;
    color: #B5B5B5;
    display: inline-block;
    margin-top: 5px;
}

.media-lightbox {
    position: fixed;
    top: 0;
    bottom: 0;    
    left: 0;
    right: 0;
    background-color: #07001f;
    width: 100%;
    height: 100%;
    z-index: 63;
    display: none;
}

.media-lightbox .container {

}

.media-lightbox .fa-times {
    position: absolute;
    top: 15px;
    right: 20px;
    font-size: 26px;
    color: white;
    z-index: 100;
}

.media-lightbox .product {
    height: 36px;
    padding: 15px 15px 0 15px;
    z-index: 2;
    background: #07001f;
    background: linear-gradient(180deg, #07001f 0%, #07001f3b 60%);
    position: relative;    
}

.media-lightbox .product img {
    border-radius: 50%;
    width: 35px;
    height: 35px;
    float: left;
}

.media-lightbox .product .info {
    padding-left: 40px;
}

.media-lightbox .product .info .brand {
    display: block;
}

.media-lightbox .product .info .brand a {
    color: white;
    text-transform: uppercase;    
    font-family: "Space Mono", monospace;
    font-size: 14px;
    font-weight: 900;    
}

.media-lightbox .product .info .name {
    font-size: 14px;
    color: white;
    display: block;
    margin-top: -3px;
}

.media-lightbox .lightbox-posts {
    
}

.media-lightbox .lightbox-posts .lightbox-post,
.media-lightbox .lightbox-posts .lightbox-profile {
    display: none;
}

.media-lightbox .lightbox-posts .lightbox-profile {
    width: 100%;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    max-width: 100%;
    max-height: 100%;
    overflow: auto;
}

.media-lightbox .lightbox-posts .visible {
    display: block;
}

.media-lightbox .lightbox-posts .lightbox-post .post-text {
    padding: 15px;
    z-index: 2;
    background: rgb(0,0,0);
    background: linear-gradient(180deg, #00000038 60%, #00000000 100%);
    position: relative;
}

.media-lightbox .lightbox-posts .lightbox-post .question-show-headline {
    display: table;
    width: 100%;
}

.media-lightbox .lightbox-posts .lightbox-post .post-text .question-group {
    float: left;
    margin: 2px 0 5px 0px;
}

.media-lightbox .lightbox-posts .lightbox-post .post-text .question-group .bg {
    background-color: #ffffff52 !important;
    border: none;
    padding: 1px 11px;
    border-radius: 15px;
}

.media-lightbox .lightbox-posts .lightbox-post .post-text .question-group .bg .text {
    color: #ffffff;
    font-size: 13px;
    margin: 2px 0 2px 0;
    display: block;
    font-weight: 500;
}

.media-lightbox .lightbox-posts .lightbox-post .post-text .title {
    font-size: 17px;
    line-height: 19px;
    margin-bottom: 5px;
    color: white;
    display: block;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;    
    overflow: hidden;
    font-weight: 500;
    cursor: pointer;
}

.media-lightbox .lightbox-posts .lightbox-post .post-text .body {
    font-size: 12px;
    line-height: 14px;
    display: block;
    margin-bottom: 5px;
    color: white;
    height: 16px;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical; 
    overflow: hidden;
}

.media-lightbox .lightbox-posts .lightbox-post .post-text .actions {
    margin-top: 8px;
}

.media-lightbox .lightbox-posts .lightbox-post .post-text .actions .tags {
    font-size: 13px;
    color: white;
    display: inline-block;
    margin-right: 15px;
}

.media-lightbox .lightbox-posts .lightbox-post .post-text .actions .tags i {
    font-size: 12px;
    color: white;
}

.media-lightbox .lightbox-posts .lightbox-post .post-text .actions .lightbox-report-post {
    font-size: 13px;
    color: white;
    display: inline-block;
}

.media-lightbox .lightbox-posts .lightbox-post .post-text .actions .lightbox-report-post i {
    font-size: 12px;
    color: white;
}

.media-lightbox .lightbox-posts .lightbox-post .post-text .actions .feature,
.media-lightbox .lightbox-posts .lightbox-post .post-text .actions .classify {
    display: inline-block;
    margin-left: 13px;
}


.media-lightbox .lightbox-posts .lightbox-post .post-text .actions .feature a,
.media-lightbox .lightbox-posts .lightbox-post .post-text .actions .classify a {
    font-size: 13px;
    color: white;
}

.post .image-el .media-group i {
    color: white;
    font-size: 11px;
    float: left;
    margin: 1px 5px 0 0;
}

.post .image-el .media-group span {
    font-size: 13px;
    color: white;
    font-weight: 900;
    float: left;  
}

.media-lightbox .lightbox-posts .lightbox-post .post-text .actions .feature i,
.media-lightbox .lightbox-posts .lightbox-post .post-text .actions .classify i {
    font-size: 12px;
    color: white;
}

.media-lightbox .lightbox-posts .lightbox-post .post-text .actions .active a {
    color: #FFC107;
}

.media-lightbox .lightbox-posts .lightbox-post .post-text .actions .active i {
    color: #FFC107;
}

.media-lightbox .lightbox-posts .lightbox-post .post-text .versions {
    margin-bottom: 7px;
}

.media-lightbox .lightbox-posts .lightbox-post .post-text .versions .product-version-img .bg {
    background-color: #ffffff52;
    padding: 5px 8px 5px 5px;
    border-radius: 10px;
    display: table;
}

.media-lightbox .lightbox-posts .lightbox-post .post-text .versions .product-version-img .bg .text {
    color: #ffffff;
    font-size: 13px;
    margin: 4px 0 2px 5px;
    float: left;
}

.media-lightbox .lightbox-posts .lightbox-post .post-text .versions .product-version-img .bg .img {
    width: 20px;
    float: left;
    border-radius: 5px;
}

.media-lightbox .lightbox-posts .lightbox-post .post-text .versions .text-version-container {

}

.media-lightbox .lightbox-posts .lightbox-post .post-text .versions .text-version-container .bg {
    background-color: #ffffff52;
    padding: 1px 11px;
    border-radius: 10px;
    display: inline-block;
}

.media-lightbox .lightbox-posts .lightbox-post .post-text .versions .text-version-container .bg .text {
    color: #ffffff;
    font-size: 13px;
    margin: 3px 0 2px 0;
    display: block;
}

.media-lightbox .lightbox-posts .lightbox-post .media {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    max-width: 100%;
    max-height: 100%;
    overflow: auto;
}

.media-lightbox .lightbox-posts .lightbox-post .media .container {
    width: 100%;
}

.media-lightbox .lightbox-posts .lightbox-post .media .container video-js {
    width: 100%;
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto;
}

.media-lightbox .loading-img {
    position: absolute;
    width: 100%;
    text-align: center;
}

.media-lightbox .lightbox-posts .lightbox-post .media img {
    width: 100%;
    height: auto !important;
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto;
}

.media-lightbox .left-btn {
    width: 45px;
    height: 45px;
    background-color: #e4e4e47a;
    border-radius: 50%;
    text-align: center;
    position: absolute;
    top: 50%;
    left: 15px;
    z-index: 10;
    display: none;
    cursor: pointer;
}

.media-lightbox .left-btn i {
    font-size: 26px;
    color: #0000004d;
    margin-top: 10px;
    margin-left: -2px;
}

.media-lightbox .right-btn {
    width: 45px;
    height: 45px;
    background-color: #e4e4e47a;
    border-radius: 50%;
    text-align: center;
    position: absolute;
    top: 50%;
    right: 15px;
    z-index: 10;
    display: none;
    cursor: pointer;
}

.media-lightbox .right-btn i {
    font-size: 26px;
    color: #0000004d;
    margin-top: 10px;
    margin-left: 2px;
}

.media-lightbox .lightbox-posts .lightbox-post .interactions {
    position: fixed;
    bottom: 15px;
    background-color: transparent;
}

.media-lightbox .lightbox-posts .lightbox-post .interactions > .container > .row {
    border-top: none;
}

.media-lightbox .lightbox-posts .lightbox-post .interactions .thumbs-box-left,
.media-lightbox .lightbox-posts .lightbox-post .interactions .thumbs-box-right,
.media-lightbox .lightbox-posts .lightbox-post .interactions .thumbs-box-left i,
.media-lightbox .lightbox-posts .lightbox-post .interactions .thumbs-box-right i,
.media-lightbox .lightbox-posts .lightbox-post .interactions .vote,
.media-lightbox .lightbox-posts .lightbox-post .interactions .post-comment-btn i, 
.media-lightbox .lightbox-posts .lightbox-post .interactions .post-comment-btn span, 
.media-lightbox .lightbox-posts .lightbox-post .interactions .share-btn i, 
.media-lightbox .lightbox-posts .lightbox-post .interactions .share-btn span {
    color: white !important;
}

.media-group-index {
    position: fixed;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    z-index: 61;
    display: none;
    overflow: scroll;
}

.media-group-index > .container {
    background-color: white;
    height: 100vh;
}

.media-group-index .media-group-title {
    background-color: white;
    margin-top: 35px;
    position: fixed;
    width: 100%;
    z-index: 30;
    top: 0;
    text-align: left;
}

.media-group-index .media-group-title .icon-box {
    float: left;
    height: 60px;
    width: 40px;
    margin-left: 5px;
    text-align: center;
    cursor: pointer;
}

.media-group-index .media-group-title .icon-box i {
    color: #ff9f9f;
    font-size: 21px;
    margin-top: 23px;
    cursor: pointer;
}

.media-group-index .media-group-title .title {
    font-size: 20px;
    color: #ff9f9f;
    font-weight: 500;
    letter-spacing: -0.5px;
    float: left;
    margin-top: 7px;
}

.media-group-index .media-group-title .title .count {
    font-size: 15px;
    margin-left: 3px;
    font-weight: 900;
    color: #ff9f9f;
}

.media-group-index .media-group-title .title .product-version {
    padding: 4px 0 9px 0;
    display: block;
}

.media-group-index .media-group-title .title .product-version-img {
    padding: 4px 0 3px 0;
}

.media-group-index .media-group-title .title .product-version .version {
    display: inline-block;
}

.media-group-index .media-group-title .title .product-version .bg {
    background-color: #ffa3a3;
    border: 1px solid #ffa3a3;
    padding: 1px 11px;
    border-radius: 10px;
}

.media-group-index .media-group-title .title .product-version-img .bg {
    background-color: #ffa3a3;
    border: 1px solid #ffa3a3;
    padding: 5px 8px 5px 5px;
    border-radius: 10px;
    display: table;
}

.media-group-index .media-group-title .title .product-version .bg .text {
    color: white;
    font-size: 13px;
    margin: 3px 0 2px 0;
    display: block;
}

.media-group-index .media-group-title .title .product-version-img .bg .text {
    font-size: 13px;
    margin: 4px 0 2px 5px;
    float: left;
}

.media-group-index .media-group-title .title .product-version-img .bg img {
    width: 20px;
    float: left;
    border-radius: 5px;
    border: 1px solid #ffffff8f;
}

.media-group-index > .container > .container {
    background-color: #f0eef3;
    height: 100%;
    text-align: center;
}

.media-group-index .lds-ellipsis-wh {
    margin-top: 95px;
}

.media-group-index .filter-menu-media-group-index {
    margin-top: 103px;
}

.media-group-index .version-thumbnail {
    margin-top: 111px;
}

.media-group-index .filter-menu {
    background-color: #f0eef3;
}

.media-group-index .group-photos {
    padding: 20px 0 10px 0;
    text-align: center;
    background-color: white;
}

.media-group-index .pagination {
    display: none;
}

.media-group-index .loader-pagination {
    margin-bottom: 100px;
    background-color: white;
}

.accept-wide-btn i {
    color: white;
    margin-left: 5px;
}

.question-menu-modal {
    margin-bottom: 30px;
    margin-top: 10px;
    font-size: 18px;
    color: #57595a;
    font-weight: 500;
    text-align: center;
}

.question-menu-modal .title {
    font-size: 19px;
    color: #57595a;
    font-weight: 900;
    display: block;
    margin-bottom: 10px;
}

.question-menu-modal .subtitle {
    font-size: 14px;
    color: #AFAFAF;
    display: block;
    margin-top: 5px;
    margin-bottom: -10px;
}

.question-menu-modal .product {
    position: relative;
    width: 90px;
    margin: auto;
    margin-bottom: 15px;
}

.question-menu-modal .product .img-box {
    width: 85px;
    height: 85px;
    margin: auto;
    border-radius: 50%;
    border: 1px solid lightgray;
    overflow: hidden;
    cursor: pointer;
}

.question-menu-modal .product .img-box img {
    width: 100%;
    display: none;
}

.question-menu-modal .product .icons {
    position: absolute;
    background-color: #ffa3a3;
    width: 35px;
    height: 35px;
    border-radius: 50%;
    right: 0px;
    bottom: 0;
}

.question-menu-modal .product .icons .fa-camera {
    color: white;
    margin-top: 10px;
    font-size: 15px;
}

.question-menu-modal .product .icons .fa-pencil-alt {
    color: white;
    margin-top: 10px;
    font-size: 15px;
}


.media-suggestions {
    display: table;
    margin-bottom: 15px;
    margin-top: 25px;
}

.media-suggestions .row {
    border-bottom: 1px solid #dbdbdb;
    display: table;
    width: 100%;
    padding-bottom: 25px;
}

.media-suggestions .row .col {
    width: 33.33%;
    float: left;
    text-align: center;
}

.media-suggestions .row .col .container {
    
}

.media-suggestions .row .col .container .circle {
    background-color: #d5d1dc;
    border-radius: 50%;
    width: 60px;
    height: 60px;
    margin: auto; 
}

.media-suggestions .row .col .container .circle i {
    color: white;
    font-size: 30px;
    margin-top: 14px;
}

.media-suggestions .row .col .container .name {
    color: #b0abb3;
    display: block;
    font-weight: 900;
    margin-top: 5px;
    margin-bottom: 3px;
}

.media-suggestions .row .col .container .description {
    font-size: 12px;
    display: block;
    color: gray;
    padding: 0 3px;
}

.media-suggestions .info {
    padding: 15px 0 5px 0;
    margin-bottom: -10px;
}

.media-suggestions .info .text {
    font-size: 14px;
    display: list-item;
    margin-bottom: 10px;
    color: gray;
    margin-left: 20px;
}

.media-suggestions-no-product {
    margin-top: 0;
}

.media-suggestions-no-product .info {
    padding-top: 0;
}

#uploading-media-text {
    display: none;
}

#uploading-media-text .text {
    font-size: 14px;
    color: #AFAFAF;
    display: block;
    margin-top: 5px;
    line-height: 20px;
    margin-bottom: 20px;
}


.comparison-promo {
    background-color: white;
    padding: 15px 15px 0px 15px;
    margin-left: -15px;
    margin-right: -15px;
    border: none;
    margin-top: -12px;
    margin-bottom: 12px;
}

.comparison-promo .container {
    border-bottom: 1px solid #dbdbdb;
    padding-bottom: 20px;
}

.comparison-promo .store-title {
    display: table;
    width: 100%;
    margin-bottom: 8px;
}

.comparison-promo .store-title img {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    border: 1px solid #e1e1e1;
    margin-top: 3px;
    float: left;
}

.comparison-promo .store-title .info {
    margin-top: 1px;
    float: left;
    margin-left: 7px;
}

.comparison-promo .store-title .info .top {
    height: 16px;
}

.comparison-promo .store-title .info .top .promo-post {
    height: 18px;
}

.comparison-promo .store-title .info .top .promo-post span {
    text-transform: uppercase;
    color: #332FAC;
    font-weight: 900;
    font-size: 14px;
    float: left;
    margin-right: 5px;
}

.comparison-promo .store-title .info .top .promo-post .standard {
    color: #332FAC;
}

.comparison-promo .store-title .info .top .promo-post .fa-tags {
    font-size: 10px;
    color: #332FAC;
    float: left;
    margin-top: 3px;
}

.comparison-promo .store-title .info .top .promo-post .exclusive {
    color: #ffc107;
}

.comparison-promo .store-title .info .top .promo-post .fa-star {
    font-size: 11px;
    color: #ffc107;
    float: left;
    margin-top: 2px;
}

.comparison-promo .store-title .info .user-promo {
    margin-top: -3px;
    display: block;
    float: left;
}

.comparison-promo .store-title .info .user-promo .store-user {
    font-size: 13px;
    color: gray;
    display: inline-block;
    font-family: "Space Mono", monospace;
    text-transform: uppercase;
}

.comparison-promo .promo {
    margin-bottom: 0;
    overflow: hidden;
}

.comparison-promo .promo-exclusive .image {
    width: 100%;
    border-top-right-radius: 15px;
    border-top-left-radius: 15px;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
    margin-bottom: 0;
    margin-bottom: -4px;
    background-color: #e3e3e3;
    overflow: hidden;
    position: relative;
    height: 180px;
    float: initial;
    margin-left: 0;
    border: none;
    text-align: initial;
}

.comparison-promo .promo-exclusive .img {
    width: 110% !important;
    margin-bottom: -4px;
    margin-left: -10px;
    -webkit-filter: blur(10px);
}

.comparison-promo .promo-exclusive .profile {
    height: 80px;
    width: 80px;
    border-radius: 50%;
    border: 3px solid white;
    position: absolute;
    top: 110px;
    left: 15px;
    background-color: white;
}


.comparison-promo .promo-exclusive .footer {
    background: initial;
    padding: 0;
}

.comparison-promo .img-rounded {
    border-radius: 10px;
}

@media (min-width: 360px) {

    .product-profile .photos, .product-profile .carousel-img, .product-profile .photos img,
    .product-profile .carousel-img .video-js { height: 305px; }
    .product-profile .icons { top: 257px; }

    .new-content-section .select-version .versions .col .container .image-box,
    .product-general-rating .product-version .product-col .image-box,
    .product-general-rating .product-version .product-col .image-box .general-rating,
    .new-content-section .select-version .versions .col .container .image-box img,
    .product-general-rating .product-version .product-col .image-box img { height: 158px; }
    .new-content-section .rating-stars .star-number { width: 330px; margin-left: -1px; }

}

@media (min-width: 375px) {

    .product-profile .photos, .product-profile .carousel-img, .product-profile .photos img,
    .product-profile .carousel-img .video-js { height: 320px; }
    .product-profile .icons { top: 272px; }
    .photos-grid .photo { height: 117px; }
    .photos-grid .photo .container .bg { height: 115px; }

    .new-content-section .select-version .versions .col .container .image-box,
    .product-general-rating .product-version .product-col .image-box,
    .product-general-rating .product-version .product-col .image-box .general-rating,
    .new-content-section .select-version .versions .col .container .image-box img,
    .product-general-rating .product-version .product-col .image-box img { height: 166px; }
    .new-content-section .rating-stars .star-number { width: 350px; margin-left: -3px; }


}

@media (min-width: 411px) {

    .product-profile .photos, .product-profile .carousel-img, .product-profile .photos img,
    .product-profile .carousel-img .video-js { height: 355px; }
    .product-profile .icons { top: 308px; }
    .photos-grid .photo { height: 130px; }
    .photos-grid .photo .container .bg { height: 132px; }

    .new-content-section .select-version .versions .col .container .image-box,
    .product-general-rating .product-version .product-col .image-box,
    .product-general-rating .product-version .product-col .image-box .general-rating,
    .new-content-section .select-version .versions .col .container .image-box img,
    .product-general-rating .product-version .product-col .image-box img { height: 184px; width: 184px; }
    .new-content-section .rating-stars .star-number { width: 390px; margin-left: -5px; }

}

@media (min-width: 430px) {
    .new-content-section .rating-stars .star-number { width: 400px; margin-left: -3px; }
}

@media (min-width: 540px) {
    .new-content-section .rating-stars .star-number { width: 520px; margin-left: -7px; }
}

@media (min-width: 680px) {

    .new-content-section .new-content-section-title,
    .new-content-section .new-content-section-title .title,
    .new-content-section .new-content-section-title .secondary-color {
        font-size: 24px;
    }    

    .new-content-section .select-version .versions .col {
        width: 33%;
    }    

    .new-content-section .select-version .versions .col .container .image-box,
    .product-general-rating .product-version .product-col .image-box,
    .product-general-rating .product-version .product-col .image-box .general-rating,
    .new-content-section .select-version .versions .col .container .image-box img,
    .product-general-rating .product-version .product-col .image-box img { 
        height: 172px; 
        width: 172px; 
    }

    .new-content-section .select-version .versions .col:nth-child(2n+1) {
        clear: initial;
    }

    .new-content-section .select-version .versions .col:nth-child(2n+2) {
        clear: initial;
    }    

    .new-content-section .select-version .versions .col:nth-child(3n+1) {
        clear: initial;
    }

    .new-content-section .select-version .versions .col:nth-child(2n+1) .container {
        padding-right: 0;
    }    

    .new-content-section .select-version .versions .col:nth-child(2n+2) .container {
        padding-right: 0;
    }        

    .new-content-section .select-version .versions .col:nth-child(3n+1) .container {
        padding-left: 7px;
        padding-right: 7px;
    }   

    .new-content-section .select-version .versions .col:nth-child(3n+2) .container {
        padding-left: 7px;
        padding-right: 7px;
    }       

    .new-content-section .select-version .versions .col:nth-child(3n+3) .container {
        padding-left: 7px;
        padding-right: 7px;
    }        

    .new-content-section .select-version .versions .col {
        cursor: pointer;
    }

    .new-content-section .select-version .versions .col:hover .container .image-box {
        border: 1px solid #ff9e9f;
    }

    .new-content-section .select-version .versions .col:hover .container .version-btn .version-img .bg,
    .new-content-section .select-version .versions .col:hover .container .version-btn .version .bg {
        background-color: #ffa3a3;
        border: 1px solid #ffa3a3;
    }

    .new-content-section .select-version .versions .col:hover .container .version-btn .version-img .bg .txt,
    .new-content-section .select-version .versions .col:hover .container .version-btn .version .bg .txt,
    .new-content-section .select-version .versions .col:hover .container .version-btn .version .bg i {
        color: white;
    }    

    .user-content .product-headline {
        width: 600px;
        top: 79px;
        border-top-right-radius: 15px;
        border-top-left-radius: 15px;
    }    

    .product-general-rating .product-version .product-col {
        width: initial;
        margin-right: 15px;
    }    

    .question-types .question-type .group .col-info .title {
        font-size: 22px;
    }    

    .product-general-rating .product-version .info-col .brand {
        margin-bottom: 0;
        font-size: 18px;
    }    

    .product-general-rating .product-version .info-col .container {
         padding-left: 0; 
    }

    .product-general-rating .product-version .info-col .name {
        font-size: 18px;
    }

    .product-general-rating .product-version .info-col .version-btn .version .bg .txt {
        font-size: 14px;
    }

    .product-general-rating .product-version .change-version {
        font-size: 14px;
    }

    .new-content-section .rating-stars {
        padding: 20px 5px 10px 5px;
    }

    .question-menu-modal {
        max-width: 380px;
        margin: auto;
        margin-bottom: 40px;
    }

    #complete-review .wide-btn {
        max-width: 380px;
        margin: auto;
    }

    .new-content-section .option-row .content-subject:hover {
        background-color: #f2f2f2;
    }

    .buy .bg .btn-slim {
        display: inline-block;
        cursor: pointer;
    }    

    .product-profile .btns-nav-scroll .right-btn, .product-profile .btns-nav-scroll .left-btn {
        margin-top: 150px;
    }

    .review-cards-container .btns-nav-scroll .right-btn, 
    .review-cards-container .btns-nav-scroll .left-btn,
    .question-cards-container .btns-nav-scroll .right-btn, 
    .question-cards-container .btns-nav-scroll .left-btn{
        margin-top: 90px;
    }

    .biutienda-gradient-bg .btns-nav-scroll .left-btn, .biutienda-gradient-bg .btns-nav-scroll .right-btn {
        top: 450px;
    }    

    .media-lightbox .container {
        width: 600px;
        margin: auto;
        position: relative;
        height: 100vh;
    }

    .media-lightbox .fa-times {
        top: 20px;
        right: 20px;
        cursor: pointer;
    }

    .media-lightbox .lightbox-posts .lightbox-post .interactions {
        width: 600px;
    }

    .media-lightbox .interactions > .container > .row > .container > .post-comment-feed:hover .post-comment-feed-btn, .media-lightbox .interactions > .container > .row > .container > .post-comment:hover .post-comment-btn,
    .media-lightbox .interactions > .container > .row > .container > .vote .thumbs-box-right:hover, .media-lightbox .interactions > .container > .row > .container > .vote .thumbs-box-left:hover,
    .media-lightbox .interactions > .container > .row > .container > .share:hover .share-btn {
        background-color: #9c9c9c45;
    } 

    .media-group-index > .container {
        width: 600px;
        margin: auto;        
    }

    .media-group-index .section-headline {
        width: 600px;
    }

    .media-group-index .media-group-title {
        width: 600px;
        z-index: 100;
    }

    .photos-videos-pnl .section-title .title, .section-title .title, 
    .photos-videos-pnl .section-title .title, .section-title .title .count {
        cursor: pointer;
    }

    .sellers .info-sellers .seller-price {
        margin: 0 0 25px 0;
    }

    .sellers .info-sellers .product-versions-carousel {
        padding: 0px 0 15px 0px;
    }

    .sellers .info-sellers .updating .container {
        height: 100%;
    }

    .sellers .info-sellers .product-versions-carousel .btns-scroll {
        display: block;
    }

    .sellers .info-sellers .btns-scroll .left-btn {
        width: 30px;
        height: 30px;
        background-color: #eff2f5eb;
        border-radius: 50%;
        text-align: center;
        position: absolute;
        left: 15px;
        z-index: 10;
        border: 4px solid white;
        box-shadow: 2px 2px 4px #00000038;
        cursor: pointer;
        margin-top: 23px;
        display: none;
    }

    .sellers .info-sellers .btns-scroll .left-btn i {
        font-size: 19px;
        color: #0000004d;
        margin-top: 6px;
        margin-left: -2px;
    }

    .sellers .info-sellers .btns-scroll .right-btn {
        width: 30px;
        height: 30px;
        background-color: #eff2f5eb;
        border-radius: 50%;
        text-align: center;
        position: absolute;
        right: 4px;
        z-index: 10;
        border: 4px solid white;
        box-shadow: 2px 2px 4px #00000038;
        cursor: pointer;
        margin-top: 23px;
    }

    .sellers .info-sellers .btns-scroll .right-btn i {
        font-size: 19px;
        color: #0000004d;
        margin-top: 6px;
        margin-left: 2px;
    }

    .sellers .info-sellers .btns-scroll .right-btn-bg {
        background: linear-gradient(90deg, #ffffff00 0%, #ffffffe0 25%, #ffffff 100%);
        height: 197px;
        width: 60px;
        position: absolute;
        right: 0;
        z-index: 9;
    }

    .sellers .info-sellers .btns-scroll .left-btn-bg {
        background: linear-gradient(90deg, #ffffff 0%, #ffffffe0 75%, #ffffff00 100%);
        height: 197px;
        width: 60px;
        position: absolute;
        left: 15px;
        z-index: 9;
        display: none;
    }

    .sellers .info-sellers .product-versions-carousel .container {
        padding: 0;
    }

    .sellers .info-sellers .product-versions-carousel .product-version-card {
        width: 103px;
    }

    .sellers .info-sellers .product-versions-carousel .scroll-spacer {
        margin-right: 70px;
    }

    .sellers .info-sellers .product-versions-empty {
        margin-top: 0;
    }

    .product-profile > .info .names .name {
        font-size: 22px;
        margin-top: 5px;
    }

    .product-profile .actions-carousel {
        padding: 15px 7px 10px 15px;
    }

    .product-profile .actions-carousel .container {
        
    }

    .product-profile .actions-carousel > .container {
        display: none;
    }

    .product-profile .actions-carousel .active {
        display: flex;
        flex-direction: row;
        justify-content: center;
        align-items: center;
    }

    .product-profile .actions-carousel .container .action {
        margin-right: 8px;
        width: 33%;
        text-align: center;
        border-radius: 10px;
    }

    .product-profile .actions-carousel .container .action:hover .container {
        color: white;
    }

    .product-profile .actions-carousel .container .want-action:hover {
        background-color: #f44336;
        border: 1px solid #f44336;
    }

    .product-profile .actions-carousel .container .have-action:hover {
        background-color: #2ab529;
        border: 1px solid #2bb429;
    }

    .product-profile .actions-carousel .container .collection-action:hover {
        background-color: #896b97;
        border: 1px solid #896b97;
    }

    .product-profile .actions-carousel .container .action:hover i {
        color: white;
    }

    .product-profile .actions-carousel .action i {
        margin-right: 7px;
    }

    .new-content-section .rating-stars .star-number { width: 570px; margin-left: -10px; }

}




















article {
	margin-bottom: 7px;
	background-color: white;
}

/* header */

article .hero-photo {
	height: 360px;
    width: 100%;
    position: relative;
    text-align: center;
    display: flex;
    justify-content: center;
    overflow: hidden;
    background-color: #fcf5f3;
}

article .hero-photo > img {
	height: 100%;
}

article .hero-photo > .back-a {
	position: absolute;
    left: 15px;
    top: 15px;
} 

article .hero-photo > .back-a > div {
	width: 50px;
    height: 50px;
    background-color: white;
    border-radius: 50%;
    text-align: center;
    box-shadow: -4px 2px 2px 0px #00000029;
}

article .hero-photo > .back-a > div > i {
	font-size: 28px;
    margin-top: 11px;
}

article .header {
	padding: 15px;
}

article .header > h1 {
	font-size: 32px;
	line-height: 34px;
	display: block;
	margin-bottom: 15px;
}

article .header > span {
	font-size: 18px;
	line-height: 24px;
	font-style: italic;
	margin-bottom: 25px;
	display: block;
}

article .header > .section {
    font-size: 16px;
    font-weight: 900;
    margin-bottom: 5px;
    display: block;
    color: #FF5072;
    font-style: initial;
}

article .header > hr {
	width: 100px;
	color: #707070;
	margin-bottom: 25px;
}

article .header > .details {
	display: table;
	width: 100%;

}

article .header > .details > .author-date {
	display: block;	
	width: 180px;
	float: left;
}

article .header > .details > .author-date span {
	display: block;
	font-size: 12px;
	margin-bottom: 2px;
	color: #4B4B4B;
}

article .header > .details > .comments {
	float: right;
    cursor: pointer;
}

article .header > .details > .comments > div {
    padding: 10px 15px;
    border-radius: 20px;
    background-color: #fffafa;
    border: 1px solid #ff9f9f;
}

article .header > .details > .comments > div > i {
	color: #ff9f9f;
    font-size: 14px;
}

article .header > .details > .comments > div > span {
	color: #ff9f9f;
    font-weight: 500;
}

/* body */

article .body {
	padding: 0 15px;
}

/* show more */

.show-more-box {
    background: #ffffff;
    background: linear-gradient(180deg, #ffffff00 0%, #ffffff 60%);
    position: absolute;
    margin-top: 425px;
    width: 100%;
    height: 300px;
    padding-top: 190px;
    margin-left: -10px;
    z-index: 10;
}

.show-more-box-quiz {
    background: #ffffff;
    background: linear-gradient(180deg, #ffffff00 0%, #ffffff 60%);
    position: absolute;
    margin-top: 725px;
    width: 100%;
    height: 300px;
    padding-top: 190px;
    margin-left: -10px;
    z-index: 10;
}

.show-more-btn {
    display: block;
    font-family: "Space Mono", monospace;
    font-size: 16px;
    color: #ec5f76;
    border: 1px solid #ec5f76;
    background-color: white;
    padding: 15px 70px;
    text-align: center;
    text-transform: uppercase;
    border-radius: 5px;
    border: 1px solid #545454;
    color: #545454;
    background-color: #ffefec;
    font-weight: 700;
    margin: auto;
}

/* collection */

article .collection {
	padding: 0 15px;
}

article .collection .products {
	display: table;
	width: 100%;
}

article .collection .products > .product {
	height: 220px;
    margin-bottom: 50px;
}

article .collection .product .img {
	max-width: 180px;
    float: left;
}

article .collection .product .img img {
	width: 100%;
    border-radius: 10px;
}

article .collection .product .col {
	padding-left: 190px;
}

article .collection .product .col .brand {
    display: block;
    margin-bottom: 2px;
}

article .collection .product .col .brand a {
    font-family: "Space Mono", sans-serif;
    font-size: 16px;
    line-height: 16px;
    color: #5C5C5C;
    text-transform: uppercase;
}

article .collection .product .col .product {
	font-weight: 200;
    font-size: 17px;
    line-height: 18px;
    margin-bottom: 8px;
    display: block;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

article .collection .product .col .category {
	font-size: 13px;
    color: #848484;
    display: block;
    line-height: 11px;
    margin: 3px 0 6px 0;
    font-weight: 500;
}


article .collection .product .col button {
	border-radius: 10px;
    padding: 4px 15px;
    border: 1px solid lightgray;
    font-size: 11px;
    display: block;
    margin: 3px 0;
}

article .collection .product .col .description {
	font-size: 13px;
    color: #8a8a8a;
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow: hidden;
    line-height: 18px;
}

article .collection .product .col .version-container {
    display: block;
    margin-bottom: 5px;
}

article .collection .product .col .version-container .version .bg {
    background-color: #ffffff;
    border: 1px solid #8d8d8d;
    padding: 1px 11px;
    border-radius: 10px;
    display: inline-block;
}

article .collection .product .col .version-container .version .bg .txt {
    color: #8d8d8d;
    font-size: 13px;
    margin: 3px 0 2px 0;
    display: block;
}

article .collection .product .col .version-container .version .version-img .bg {
    background-color: #ffffff;
    border: 1px solid #c3c3c3;
    padding: 5px 8px 5px 5px;
    border-radius: 10px;
    display: table;
}

article .collection .product .col .version-container .version .version-img .bg img {
    width: 20px;
    float: left;
    border-radius: 5px;
    border: 1px solid #ffffff8f;
}

article .collection .product .col .version-container .version .version-img .bg .text {
    color: #8d8d8d;
    font-size: 13px;
    margin: 4px 0 2px 5px;
    float: left;
}

article .collection .product .col .info-version {
    max-width: 200px;
}

article .collection .product .col .info-version .not-available {
    font-size: 12px;
    font-weight: 500;
    color: #b4afbd;
    background-color: #f0eef3;
    padding: 3px 7px;
    border-radius: 10px;
    display: inline-block;
    margin-top: 8px;
}

article .collection .product .col .info-version .add-to-cart {
    background: linear-gradient(111deg, #2d1974 0%, #cd8aed 100%);
    display: flex;
    justify-content: space-between;
    padding: 0 15px;
    border-radius: 10px;
    border: 1px solid white;
    margin-top: 10px;
    align-items: center;
    min-height: 40px;
    margin-bottom: 15px;
    cursor: pointer;
}

article .collection .product .col .info-version .add-to-cart {
    padding: 0 10px;
}

article .collection .product .col .info-version .add-to-cart:hover {
    background: linear-gradient(111deg, #2d1974 0%, #a459c8 100%);
}

article .collection .product .col .info-version .add-to-cart .left {

}

article .collection .product .col .info-version .add-to-cart .left .mobile {
    font-size: 14px;
    color: white;
    font-weight: 500;    
}

article .collection .product .col .info-version .add-to-cart .left .mobile {
    margin-left: -1px;
}

article .collection .product .col .info-version .add-to-cart .left i {
    font-size: 12px;
    color: white;
}

article .collection .product .col .info-version .add-to-cart .left .desktop {
    display: none;
}

article .collection .product .col .info-version .add-to-cart .right {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
}

article .collection .product .col .info-version .add-to-cart .right .final {
    font-size: 13px;
    font-weight: 900;
    display: block;
    color: white;
}

article .collection .product .col .info-version .add-to-cart .right .discount {
    text-decoration: line-through;
    font-size: 12px;
    font-weight: 500;
    display: block;
    color: #e9ccfc;
}

article .collection .product .col .info-version .out-of-stock {
    border: 1px solid #e1dfe5;
    background: #fcfbfd;
    cursor: initial;
}

article .collection .product .col .info-version .out-of-stock:hover {
    background: #fcfbfd;
}

article .collection .product .col .info-version .out-of-stock .left {
    font-size: 14px;
}

article .collection .product .col .info-version .out-of-stock .left,
article .collection .product .col .info-version .out-of-stock .left i,
article .collection .product .col .info-version .out-of-stock .right .final {
    color: #c2bbcd;
}

article .collection .product .col .info-version .out-of-stock .right .discount {
    color: #c6c6c6;
}

article .collection .product .col .price {
    margin-top: 15px;
    max-width: 160px;
}

article .collection .product .col .price .prices-loader {
    padding: 9px 12px;
    border-radius: 10px;
    height: 18px;
    background: linear-gradient(111deg, #0c007f 0%, #6554fe 100%);
    text-align: center;
}

article .collection .product .col .price .lds-ellipsis-wh div {
    top: 3px;
    height: 12px;
    width: 12px;
}

article .collection .product .col .price-1 {
    font-size: 14px;
    font-weight: 900;
    display: block;
    margin-top: 7px;
}

article .collection .product .col .price-1 span {
    font-size: 10px;
    color: #4A4A4A;
}

article .kit {
    width: 100%;
    overflow: hidden;
}

article .kit .container {
    border: 1px solid #e3e6e8;
    border-radius: 15px;
    overflow: hidden;
}

article .kit .container .images-container {
    width: 100%;
    height: 290px;
    background-size: cover;
    overflow: hidden;
    background-color: #f7f7f7;
    position: relative;
}

article .kit .container .images-container .biustore-image {
    display: none;
    width: 100%;
    height: 290px;
    margin: auto;
}

article .kit .container .images-container .active {
    display: block;
}

article .kit .container .biustore-image .profile {
    width: 220px;
    margin: auto;
    display: block;
    position: relative;
    z-index: 4;
}

article .kit .container .kit-image .profile {
    width: 293px;
}

article .kit .container .images-container .image-floor {
    position: absolute;
    height: 27px;
    width: 100%;
    bottom: 0;
    background-color: #f7f7f7;
}

article .kit .container .info {
    background-color: #f7f7f7;
    padding: 0px 10px 10px 10px;
    /* min-height: 152px; */
    position: relative;
}

article .kit .container .info .top .general .brand {
    display: block;
    margin-bottom: 4px;
}

article .kit .container .info .top .general .brand .text {
    font-family: "Space Mono", sans-serif;
    font-size: 16px;
    line-height: 18px;
    color: #5C5C5C;
    text-transform: uppercase;
    display: inline-block;
}

article .kit .container .info .top .general .name {
    display: block;
    margin-bottom: 5px;
}

article .kit .container .info .top .general .name .text {
    font-weight: 200;
    font-size: 18px;
    line-height: 20px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

article .kit .container .info .top .general .products-count, .brand-related-card .bg .products-count {
    font-size: 13px;
    color: #5c5c5c;
    display: inline-block;
    margin-bottom: 5px;
    background-color: #ffffff;
    padding: 5px 10px;
    border-radius: 15px;
    margin-top: 1px;
    border: 1px solid #8d8d8d;
}

article .kit .container .info .top .general .description {
    font-size: 14px;
    color: #b2b2b2;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    line-height: 20px;
    margin-bottom: 8px;
}

article .kit .container .info .price {
    margin-top: 20px;
    max-width: 180px;
}

article .kit .container .info .price .prices-loader {
    padding: 9px 12px;
    border-radius: 10px;
    height: 18px;
    background: linear-gradient(111deg, #0c007f 0%, #6554fe 100%);
    text-align: center;
}

article .kit .container .info .price .prices-loader .lds-ellipsis-wh div {
    top: 3px;
    height: 12px;
    width: 12px;
}

article .brand-cards-no-padding {
    padding: 0;
    padding-bottom: 0;
}


/* show more */

article .show-more {
    background: #ffffff;
    background: linear-gradient(180deg, #ffffff00 0%, #ffffff 40%);
    position: absolute;
    margin-top: 460px;
    width: 100%;
    height: 90px;
    padding-top: 150px;
    z-index: 10;
}

article .show-more div {
    padding: 0 20px;
}

article .show-more .more-article-btn {
    background-color: snow;
    color: #ff9e9e;
    border: 1px solid #ff9f9f;
    font-weight: 500;
}

article .video-js .vjs-tech {
    width: initial;
}

.body-article {
    overflow: hidden;
}

/* quiz */

.quiz {
	padding: 0 15px;
}

.quiz .question {
	margin-bottom: 40px;
}

.quiz .question > .text {
	margin-bottom: 10px;
    background-color: #ffcfc1;
    padding: 20px 15px;
    border-radius: 10px;
}

.quiz .question > .text > span {
    font-size: 28px;
    display: block;
    line-height: 30px;
    font-weight: 700;
    text-align: center;
}

.quiz .question .image {
    width: 100%;
    display: block;
    border-radius: 10px;
}

/* quiz options */

.quiz .question .options {
    margin-top: 10px;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}


.quiz .question .options .col-2 {
    width: 50%;
    float: left;
    margin-bottom: 10px;
    position: relative;
}

.quiz .question .options .col-2 a {
    display: block;
}

.quiz .question .options .col-2:nth-child(2n+1) a {
    padding-right: 5px;
    clear: left;
}

.quiz .question .options .col-2:nth-child(2n+2) a {
    padding-left: 5px;
}

.quiz .question .options .col-3 {
    width: 32%;
    float: left;
    margin-bottom: 10px;
    position: relative;
}

.quiz .question .options .col-3:nth-child(3n+1) {
    padding-right: 5px;
    clear: left;
}

.quiz .question .options .col-3:nth-child(3n+2) {
    padding-left: 5px;
    padding-right: 5px;
}

.quiz .question .options .col-3:nth-child(3n+3) {
    padding-left: 5px;
}

.quiz .question .options .option {
    border-radius: 5px;
    border: 1px solid #e9e9e9;
    padding: 5px;
}

.quiz .question .options .option .image {
    overflow: hidden;
    position: relative;
}

.quiz .question .options .option .image img {
    width: 100%;
    margin-bottom: -3px;
}

.quiz .question .options .option .text {
    padding: 10px 3px 0px 3px;
}

.quiz .question .options .option .text .title {
    font-size: 18px;
    line-height: 20px;
    display: block;
    margin-bottom: 5px;
}

/* poll results */

.poll-results {
    display: none;
    margin-top: 10px;
}

.poll-results .poll-result {
    margin-bottom: 5px;
    padding: 10px;
    border-radius: 10px;
    height: 80px;
}

.poll-results .selected {
    background-color: #ffe7e0;
}

.poll-results .poll-result img {
    width: 80px;
    float: left;
    border-radius: 10px;
}

.poll-results .poll-result .col {
    padding-left: 90px;
}

.poll-results .poll-result .col .num {
    font-size: 30px;
    font-weight: 700;
    color: #5e78ad;
}

.poll-results .poll-result .col .chart {
  position: relative;
}

.poll-results .poll-result .col .chart .horizontal .track {
  background-color: white;
  height: 15px;
  width: auto;
}

.poll-results .poll-result .col .chart .horizontal .progress {
  display: inline-block;
  position: absolute;
  height: 15px;
  background-color: #ff5272;
  width: 0%;
  -moz-animation: progressScale-horizontal 1600ms 1 forwards;
  -webkit-animation: progressScale-horizontal 1600ms 1 forwards;
  animation: progressScale-horizontal 1600ms 1 forwards;
}


/* correct answer */

.correct-answer {
    text-align: left;
    margin: 10px 0 50px 0;
    display: none;
    border-bottom: 1px solid gray;
    padding-bottom: 20px;
}

.correct-answer .response {
    float: left;
    margin-right: 10px;
}

.correct-answer .response .icon {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    text-align: center;
}

.correct-answer .response .icon i {
    color: white;
    font-size: 32px;
    margin-top: 9px;
}

.correct-answer .response .correct-answer-icon {
    background-color: #8BC34A;
}

.correct-answer .response .incorrect-answer-icon {
    background-color: red;
}


.correct-answer .text {
    padding-left: 60px;
    margin-bottom: 10px;
}

.correct-answer .text .response-text {
    font-family: "Space Mono", monospace;
    font-size: 24px;
    font-weight: 700;
    text-transform: uppercase;
    line-height: 22px;
    display: block;
    margin-bottom: 10px;
}

.correct-answer .text .answer-text {
    font-size: 18px;
    display: block;
    margin-bottom: 5px;
}

.correct-answer .text .answer-a {
    font-style: italic;
}

.correct-answer img {
    width: 100%;
    border-radius: 5px;
}

.correct-answer img .credit {
    font-weight: 700;
    color: lightgray;
    display: block;
    font-size: 10px;
    text-transform: uppercase;
    margin-top: 10px;
}

.option-opacity {
    opacity: 0.3;
}

.quiz-option-correct {
    background-color: #8BC34A;
    border-radius: 50%;
    height: 45px;
    width: 45px;
    position: absolute;
    z-index: 2;
    right: 0;
    margin: 9px 8px 0 0;
    text-align: center;
    display: none;
}

.quiz-option-correct i {
    color: white;
    font-size: 30px;
    margin-top: 8px;
}

.quiz-option-incorrect {
    background-color: #f44336;
    border-radius: 50%;
    height: 45px;
    width: 45px;
    position: absolute;
    z-index: 2;
    right: 0;
    margin: 9px 8px 0 0;
    text-align: center;    
    display: none;
}

.quiz-option-incorrect i {
    color: white;
    font-size: 30px;
    margin-top: 8px;
}


/* result box */

.quiz .results {
    display: none;
}

.quiz .results {
    padding: 10px;
    border-radius: 5px;
    background: #ffa878;
    background: linear-gradient(90deg, #ffa878 0%, #ff7288 77%);
    margin-top: 10px;
    display: none;
    margin-bottom: 15px;
}

.quiz .results .result {
    text-align: center;
    display: none;
}

.quiz .results .result .container {
    text-align: center;
}

.quiz .result .container > .title {
    color: white;
    font-weight: 700;
    font-size: 14px;
    display: block;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.quiz .result .container .box { 
    background-color: white;
    border-radius: 5px;
    margin-top: 10px;
    padding: 15px 0 0 0; 
    text-align: left;
    position: relative;
}

.quiz .result .container .box .white-foreground {
    background-color: white;
    position: absolute;
    height: 100%;
    width: 100%;
    z-index: 1;
    margin-top: -15px;
    border-radius: 5px;
}

.quiz .result .container .box .count-correct {
    color: #ff5f79;
    font-weight: 700;
    display: block;
    margin-bottom: 10px;
    text-align: center;
    padding: 0 10px;
}

.quiz .result .container .box > .title {
    font-weight: 700;
    font-size: 32px;
    line-height: 32px;
    display: block;
    margin: 5px 10px 20px 10px;
    text-align: center;
    padding: 0 10px;
}

.quiz .result .container .box .subtitle {
    display: block;
    font-size: 14px;
    line-height: 18px;
    margin-bottom: 15px;
    text-align: center;
    padding: 0 10px;
}

.quiz .result .container .box .link {
    display: block;
    text-align: center;
    margin-bottom: 15px;
    padding: 0 10px;
}

.quiz .result .container .box .link a {
    text-align: center;
    font-size: 14px;
}

.quiz .result .container .box .figure {
	padding: 0 10px 10px 10px;
}

.quiz .result .container .box .figure img {
    width: 100%;
    border-radius: 10px;
}

.quiz .quiz-result-social {
    margin-top: 10px;
    text-align: center;
    padding: 0 10px;
}

.quiz .redo-quiz {
    color: white;
    font-weight: 700;
    font-size: 14px;
}

.quiz .redo-quiz-mobile {
    margin-top: 10px;
    display: block;
}

.quiz .redo-quiz i {
	color: white;
	font-size: 12px;
}

/* brand profiles */

.brand-profiles {
    padding: 0 15px 30px 15px;
}


/* more articles*/

#panel-related-section {
	display: none;
}

.featured-comment .section-title {
    margin-bottom: 10px;
}


/* marketplace notice */

.marketplace-notice {
    display: flex;
    background-color: #fbfbfb;
    border-radius: 10px;
    border: 1px solid #D5D9D9;
    overflow: hidden;
    margin-bottom: 20px;
}

.marketplace-notice img {
    width: 50%;
    object-fit: cover;
}

.marketplace-notice .info {
    padding: 15px;
}

.marketplace-notice .info .title {
/*    font-weight: 900;
    display: block;
    color: #432985;
    margin-bottom: 0px;
    font-size: 14px;*/

    font-weight: 900;
    font-size: 18px;
    margin-bottom: 5px;
    display: block;
}

.marketplace-notice .info .subtitle {
    font-size: 14px;
    display: block;
    margin-bottom: 10px;
}

.marketplace-notice .info .subtitle strong {
    font-size: 14px;
    color: #FF5072;
}

.marketplace-notice .info .btn-sm {
    display: inline-block;
    padding: 6px 10px;
    border: 1px solid #8d7399;
    color: #896b97;
    border-radius: 20px;
    font-weight: 500;
    cursor: pointer;
    background-color: white;
    font-size: 14px;
}

.article-fixed-ad {
    position: fixed;
    bottom: 0px;
    width: 100%;
    background-color: white;
}

.ad-panel-top-bottom {
    margin: 7px 0;
    background-color: white;
}

@media (min-width: 680px) {
    article .hero-photo {
        height: 320px;
    }

    .marketplace-notice img {
        width: 33%;
        object-fit: cover;
    }

    .article-fixed-ad {
        width: 540px;
    }
}


@media (min-width: 725px) {

}


@media (min-width: 768px) {
    article .hero-photo {
        height: 350px;
    }
}


@media (min-width: 780px) { 
    article .hero-photo {
        height: 370px;
    }
}


@media (min-width: 832px) /*ipad pro*/ {
    article .hero-photo {
        height: 410px;
    }
}


@media (min-width: 960px) {
    article .hero-photo {
        height: 470px;
    }
}




/*






 */