.skeleton, img[data-src] {
    background-color: #e2e5e7;
    background-image: linear-gradient(90deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, .5), rgba(255, 255, 255, 0));
    background-size: 40px 100%;
    background-repeat: no-repeat;
    background-position: left -40px top 0
}

.font-20{font-size: 20px !important;}


.icon-tool-image > a, .list-other-seller > li:nth-child(odd), body {
    background-color: #fff
}

.card-color-specifications > div:first-child, .row {
    margin-right: 0 !important
}

.one-line, .read-more.collapsed .read-more__content > .read-more__content__container {
    text-overflow: ellipsis
}

@font-face {
    font-family: IRANSans;
    src: url('../../../css/font/IRANSansWeb(FaNum).woff2') format('woff2'), url('../../../css/font/IRANSansWeb(FaNum).woff') format('woff'), url('../../../css/font/IRANSansWeb(FaNum).ttf') format('truetype')
}

:root {
    --main-color-orange: #F48C09;
    --main-color-blue: #028e9b;
    --gray_4B: #4B4B4B;
    --gray_F5: #F5F5F5;
    --gray-31: #313131;
    --gray-46: #464646;
    --orange-sazman: #F48C09FF;
    --gray_D9: #D9D9D9;
    --gray-90: #909090;
    --color-link: #19BFD3;
    --gray_9B: #9B9B9B;
    --gary-DB: #BDBDBD;
    --gray-2D: #2D2103;
    --gray-D9: #D9D9D9;
    --gray-5B: #5B5B5B;
    --gray-FA: #FAFAFA;
    --gray-38: #383838;
    --gray-DD: #DDDDDD;
    --gray-F3: #F3F3F3;
    --color-orange: #FF9600;
    --gray-A1: #A1A3A8;
    --gray-E2: #E2E2E2;
    --gray-3D: #3D3D3D;
    --color-discount: #D00000;
    --gray-BE: #BEBEBE;
    --gray-E7: #E7E7E7;
    --gray-18: #181818;
    --gray-45: #454545;
    --blue-progress: #3CA6F2;
    --gray-69: #696969;
    --gray-56: #565656;
    --gray-B8: #B8B8B8;
    --gray-37: #373737;
    --gray-9E: #9E9E9E;
    --green-lable: #2E9618;
    --gray-E: #EEEEEE;
    --gray-E6: #E6E6E6;
    --gray-62: #626262;
    --gray-9C: #9C9C9C;
    --gray-E5: #E5E5E5;
    --orange-lable: #FFA011;
    --gray-86: #868686;
    --gray-87: #878787;
    --gray-B9: #B9B9B9;
    --blue-E: #EEEEEE;
    --light-orange: #FFECD0;
    --blue-FB: #FBFBFB;
    --gary-hover: #A6A6A6;
    --color-green: #46A759;
    --gray-80: #808080;
    --unhappy: #F9A825;
    --satisfaction: #00A049;
    --gray-75: #757575;
    --gray-4E: #4E4E4E;
    --color-blue: #009DCE;
    --green-sazman: #1B9C90;
    --gray-A6: #A6A6A6;
    --gray-17: #171717;
    --gray-EA: #EAEAEA;
    --gray-AC: #ACACAC;
    --gray-73: #737373;
    --gray-e9: #e0e0e6;
    --gray-DC: #DCDCDC;
    --active-like: #00A141;
    --gray-7D: #7D7D7D;
    --gray_icons_search: #393939;
    --border-gray: 1px solid #fafafa;
    --height_baner_header: 3rem;
    --border_header_gray: #ececec57;
    --AD: #FF11CB;
    --gray-f1: #f1f1f1;
    --gray-d5: #d5d5d5;
    --very-bright-orange: #FF6600;
    --gray-82: #828282;
    --orange-F1: #F19411;
    --gray-share: #62666D;
    --gray-E0: #E0E0E2;
    --font-family: IRANSans
}

body, html {
    direction: rtl;
    height: 100%;
    width: 100%
}

*, body {
    font-family: var(--font-family)
}

::-webkit-scrollbar {
    width: 5px
}

.card-characteristics img, .card_main_swiper, .full-width, .one-line {
    width: 100%
}

::-webkit-scrollbar-track {
    background: #f1f1f1
}

::-webkit-scrollbar-thumb {
    background: #c0c2c5;
    position: relative;
    right: -3px;
    border-radius: 4px
}

::-webkit-scrollbar-thumb:hover {
    background: #a1a3a8
}

.row {
    margin-left: 0 !important
}

li {
    list-style: none
}

.opacity-0 {
    opacity: 0
}

.error {
    font-size: 12px;
    color: red
}

.font-9 {
    font-size: 9px
}

.font-10 {
    font-size: 10px
}

.font-11 {
    font-size: 11px
}

.font-12 {
    font-size: 12px
}

.font-13 {
    font-size: 13px
}

.font-14 {
    font-size: 14px
}

.font-15 {
    font-size: 15px
}

.font-16 {
    font-size: 16px
}

.card-left-specifications-information > span, .line-height-25 {
    line-height: 25px
}

.line-height-30 {
    line-height: 30px
}

.line-height-31 {
    line-height: 31px
}

.line-height-32 {
    line-height: 32px
}

.border-radius-100 {
    border-radius: 100%
}

.grow-1 {
    flex-grow: 1
}

.text-align-left, .viewing-panel-talking-exhibitor {
    text-align: left
}

.text-align-right {
    text-align: right
}

.table-delivery-time, .text-align-center {
    text-align: center
}

.one-line {
    display: inline-block;
    white-space: nowrap;
    overflow: hidden
}

.two-line {
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical
}

.desktop {
    max-width: 1304px !important;
    margin: auto;
    padding: 0 20px
}

.skeleton {
    -webkit-animation: 1s infinite shine;
    animation: 1s infinite shine
}

@-webkit-keyframes shine {
    to {
        background-position: right -40px top 0
    }
}

@keyframes shine {
    to {
        background-position: right -40px top 0
    }
}

.card-btn-more-attr > button::after, .d-none-desktop {
    display: none
}

.border-right-title {
    border-right: 2px solid var(--orange-sazman);
    padding-right: 11px;
    font-weight: 700;
    margin-bottom: 1.5%
}

.font-weight-none, .table-delivery-time > thead > tr > th {
    font-weight: unset !important
}

.card_main_swiper > .swiper {
    max-width: 95%;
    margin: auto
}

.arrow-left, .arrow-right {
    display: block !important;
    position: absolute;
    z-index: 1;
    top: 50%;
    transform: translate(0, -50%)
}

.arrow-left > svg, .arrow-right > svg {
    width: 13px;
    height: 13px
}

.arrow-right {
    right: 0
}

.arrow-left {
    left: 0
}

.card-left-specifications > div, .card-left-specifications > p, .list-all-comments > li, .list-question li, .padding_card {
    padding: 2% 0
}

img[data-src] {
    height: 150px;
    -webkit-animation: 1s infinite shine;
    animation: 1s infinite shine
}

.card-category > a {
    padding: 0 2px;
    color: #000
}

.card-category > a:first-child, .card-name-product-specifications > span:first-child, .card-score-specifications-right:first-child, .content-characteristics > div:first-child {
    padding-right: 0 !important
}

.card-category > a:last-child, .card-name-product-specifications > span:last-child, .content-characteristics > div:last-child, .list-other-seller > li > div:last-child {
    padding-left: 0 !important
}

.card-category {
    padding: 1%;
    background: #f6f6f6;
    margin-top: 20px
}

.dropdown-menu-attr .dropdown-item.active, .dropdown-menu-attr .dropdown-item:active {
    background-color: #e9ecef !important;
    color: #000 !important
}

.card-btn-more-attr > button, .card-btn-more-attr > button:focus, .card-btn-more-attr > button:hover {
    border: 1px solid var(--gray-D9) !important
}

.card-btn-more-attr > button {
    border-radius: 2px;
    padding: 5px;
    cursor: pointer;
    margin: 5px;
    background-color: #fff
}

.card-btn-more-attr > button > svg {
    width: 11px;
    height: 11px;
    margin-right: 3px
}

.card-gallery-image, .card-section-top > div {
    height: fit-content
}

.play-video {
    width: 16px;
    height: 16px;
    position: absolute;
    z-index: 2;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    fill: white
}

.item-image-product > video, .width-video {
    object-fit: fill
}

.item-image-product > div, .more_image, .ul-sort > li {
    cursor: pointer
}

.card-number-counter {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.card-number-counter > svg {
    width: 19px;
    height: 19px;
    fill: black
}

.custom-number-input > div {
    display: flex;
    align-items: center;
    border: 1px solid var(--orange-F1);
    border-radius: 2px;
    padding: 8px 11px;
    direction: ltr
}

.input-number {
    width: 100%;
    padding: 0 12px;
    vertical-align: top;
    text-align: center;
    outline: 0;
    border: unset;
    background-color: #fff
}

.input-number-decrement, .input-number-increment {
    display: inline-block;
    text-align: center;
    cursor: pointer
}

.loader-icon {
    stroke: var(--gray-d5)
}

.card-counter {
    justify-content: space-between;
    padding: 5% 0
}

.card-counter > div > div {
    max-width: 50%
}

.show-counter {
    display: flex !important
}

.view-shopping-cart {
    display: flex;
    align-items: center;
    justify-content: flex-end
}

.highlight-view-shopping-cart {
    color: var(--color-blue);
    margin-right: 5px
}

.highlight-view-shopping-cart:hover {
    color: var(--color-blue)
}

.icon-tool-image > a:hover .hover-tool-image {
    display: block !important
}

.hover-tool-image {
    display: none;
    background-color: var(--gray-E);
    color: #000;
    position: absolute;
    width: max-content;
    padding: 3px 7px;
    border-radius: 3px;
    top: 50%;
    right: 30px;
    transform: translate(0, -50%)
}

.line-name-product {
    height: 1px;
    background-color: var(--gray_D9)
}

.card-name-product-specifications > span {
    max-width: 50%;
    padding: 0 7px
}

.name-product-english {
    color: var(--gray-90)
}

.card-name-product-specifications {
    justify-content: start;
    margin-right: auto;
    width: 100%;
    align-items: center;
    margin-bottom: 5px
}

#heart:active > path, .icon-likes {
    fill: red !important;
    stroke: red !important
}

.more_image > img {
    filter: blur(2px)
}

.icon-more-dot {
    fill: var(--gray_4B);
    stroke: var(--gray_4B);
    position: absolute;
    width: 35%;
    height: 35%;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%)
}

.item-image-product {
    display: flex;
    flex-direction: column;
    gap: 5px
}

.border-item-image-product {
    border: 1px solid var(--gray_F5);
    border-radius: 3px;
    height: calc(100vh - 32.5rem) !important;
    max-height: 72px;
    width: calc(100vh - 32.5rem) !important;
    max-width: 72px;
    padding: 5px
}

.card-price-description > div > span:first-child, .discount-percent-price {
    color: var(--gray-82)
}

.report-incorrect-specifications {
    background-color: var(--gray-E0);
    padding: 5px 20px
}

.report-incorrect-specifications, .report-incorrect-specifications:hover {
    color: var(--gray-share)
}

.report-incorrect-specifications svg {
    width: 16px;
    height: 16px;
    display: inline-block;
    fill: var(--gray-share);
    stroke: var(--gray-share);
    margin-left: 2px
}

.icon-tool-image > a > svg, .icon-tool-image > svg {
    width: 20px;
    height: 20px;
    margin: 0;
    cursor: pointer;
    fill: var(--gray-E7);
    stroke: var(--gray-E7)
}

.icon-tool-image > a {
    position: relative;
    border-radius: 100%;
    border: 1px solid var(--gray-E7);
    width: 30px;
    height: 30px;
    justify-content: center;
    display: flex;
    align-items: center
}

.icon-tool-image {
    display: flex;
    flex-direction: column;
    width: max-content;
    justify-content: flex-start;
    position: absolute;
    left: 30px;
    top: 5px
}

.card-image-big {
    padding: 0 3%;
    max-width: 380px;
    max-height: 380px;
    min-height: 100px;
    min-width: 100px
}

.card-price-description {
    gap: 15px;
    grid-template-columns:repeat(2, 1fr)
}

.card-section-top {
    grid-template-columns:38% 27% 33%;
    gap: 1%
}

.card-available-top {
    padding: 13px
}

.card-color-specifications > div > div, .image_full {
    width: 100%;
    height: 100%
}

.icon-star {
    width: 14px;
    height: 14px
}

.sum-score {
    cursor: pointer;
    display: none
}

.card-score-specifications {
    display: flex;
    align-items: center;
    padding-bottom: .5%
}

.card-score-specifications > a, .info-register-question > span {
    color: var(--color-link)
}

.number-score-specifications {
    color: var(--gray_9B)
}

.card-score-specifications > a, .card-score-specifications > div {
    padding: 0 5px
}

.card-score-specifications > hr {
    color: var(--gary-DB);
    width: 15px;
    transform: rotate(90deg);
    opacity: 1
}

.card-score-specifications-right > span, .toman-modal {
    margin-right: 1px
}

.card-property > li {
    list-style: none;
    display: block;
    margin-top: 3.5%
}

.c-red {
    background-color: red
}

.c-blue {
    background-color: #2cffd9
}

.c-black {
    background-color: #000
}

.active-color {
    border: 1px solid var(--gray-45) !important
}

.card-color-specifications > div {
    width: auto;
    height: fit-content;
    text-align: center;
    border-radius: 2px;
    min-width: 40px;
    padding: 5px;
    cursor: pointer;
    border: 1px solid var(--gray-D9);
    margin: 5px;
    background-color: #fff;
    position: relative
}

.card-property {
    max-height: 200000px
}

.card-attributes > li, .card-color-specifications {
    display: inline-block;
    width: 100%
}

.card-attributes, .card-color-specifications {
    margin-top: 2.5%
}

.card-attributes > li > div {
    min-width: 50%;
    max-width: 50%;
    float: right
}

.card-main-specifications > div {
    padding: 0 1.5%
}

#main-specifications {
    scroll-margin-top: 16rem
}

.card-main-color-specifications > span {
    padding-left: 2px
}

.btn-other-specifications:focus, .btn-other-specifications:focus + .btn-other-specifications {
    box-shadow: none !important;
    outline: unset !important
}

.btn-other-specifications {
    color: var(--color-link) !important;
    padding-right: 0 !important;
    margin: 2px 0;
    border: unset !important
}

.btn-other-specifications > svg {
    fill: var(--color-link);
    width: 9px;
    height: 9px;
    margin-right: 5px
}

button:focus {
    outline: 0 !important;
    box-shadow: unset !important
}

.logo-specifications {
    max-width: 25%
}

.card-left-specifications-information > img, .card-left-specifications-information > span {
    margin-left: 7px
}

.performance > span {
    color: green;
    padding: 0 4px
}

.performance {
    color: var(--gray-5B);
    width: fit-content;
    cursor: pointer
}

.card-left-specifications-information .info-center {
    margin-right: 10px
}

.card-left-specifications-information, .card-price {
    display: flex;
    align-items: flex-start
}

.viewing-panel-talking-exhibitor > a {
    color: var(--gray-31);
    position: relative;
    padding: 0 5px
}

.viewing-panel-talking-exhibitor > a:first-child {
    border-right: unset !important
}

.viewing-panel-talking-exhibitor > a:first-child:after {
    position: absolute;
    left: -2px;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    background-color: var(--gray-90);
    width: 1px;
    content: " ";
    height: calc(100% - 5px)
}

.card-left {
    border: 1px solid var(--gray-f1);
    border-radius: 5px;
    padding-top: 1%;
    padding-bottom: 1%
}

.color-section-order {
    color: var(--gray-38)
}

.card-information-order {
    width: 100%;
    display: grid;
    grid-template-columns:repeat(2, 1fr);
    text-align: center;
    align-items: center
}

.card-information-order > span {
    padding: 0 10px;
    cursor: pointer
}

.card-information-order > span:first-child {
    border-left: 1px solid var(--gray-DD)
}

.card-information-order > span:last-child {
    border-left: 0 !important
}

.line-vertical {
    width: 19px;
    transform: rotate(90deg);
    opacity: 1;
    color: var(--gray-DD)
}

.btn-add-basket-other-seller:hover, .ticks .tick.passed.active {
    color: var(--color-orange)
}

.btn-add-basket:hover, .btn-add-basket:hover > a, .number-points-comments {
    color: #fff
}

.card-price {
    justify-content: space-between;
    margin: 0 0 4%
}

.available > div, .available > p {
    border-bottom: 1px solid var(--gray-d5);
    padding: 5% 0
}

.btn-add-basket {
    background-color: var(--color-orange);
    width: 100%;
    color: #fff;
    padding: 8px;
    margin: 2.5% 0;
    border-radius: 2px;
    border: none
}

input::-webkit-inner-spin-button, input::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0
}

input[type=number] {
    -moz-appearance: textfield
}

.card-left-specifications :first-child {
    padding-top: 0 !important
}

.card-left-specifications {
    background: #f6f6f6;
    padding: 16px !important;
    border-radius: 4px
}

.card-left-specifications :last-child {
    padding-bottom: 0 !important
}

.card-left > div:last-child, .table-delivery-time > tbody > tr > td:last-child, .table-delivery-time > thead > tr > th:last-child {
    border-bottom: unset !important
}

.icon-bell {
    width: 16px;
    height: 16px;
    margin: 0 5px;
    stroke: white
}

.unavailable > button, .unavailable > h6 {
    margin: 3% 0
}

.unavailable > p {
    margin: 7% 0 13%
}

.discount_price, .read-more {
    position: relative
}

.read-more > .read-more__content {
    z-index: 0;
    overflow: hidden
}

.read-more > .read-more__content > .read-more__content__container {
    position: relative;
    -webkit-transition: .8s;
    -moz-transition: .8s;
    -ms-transition: .8s;
    transition: .8s;
    max-height: unset
}

.read-more > .read-more__content > .read-more__content__container:before {
    z-index: 5;
    display: block;
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    top: auto;
    height: 5rem;
    background: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0)), to(white));
    background: -webkit-linear-gradient(rgba(255, 255, 255, 0), #fff);
    background: linear-gradient(rgba(255, 255, 255, 0), #fff);
    opacity: 0;
    -webkit-transition: opacity .8s;
    -moz-transition: opacity .8s;
    -ms-transition: opacity .8s;
    transition: opacity .8s
}

.read-more.collapsed .read-more__content > .readMore-height-other-suppliers {
    max-height: 333px
}

.read-more.collapsed .read-more__content > .read-more__content__container:before {
    opacity: 1
}

.read-more > .read-more__expand {
    z-index: 10;
    padding: 0;
    color: #000 !important;
    font-size: 14px;
    background: 0 0;
    border: none
}

.img-icon-more-read {
    width: 12px
}

.reason-purchase span {
    color: var(--gray-A1)
}

.reason-purchase {
    display: grid;
    grid-template-columns:repeat(4, 1fr);
    gap: 10px
}

.reason-purchase > div {
    display: flex;
    justify-content: center;
    align-items: center
}

.reason-purchase img {
    margin-left: 3%;
    width: 100%;
    height: 100%;
    max-width: 40px;
    max-height: 40px
}

.height-auto, .similar-goods .swiper-slide {
    height: auto !important
}

.item-similar-goods {
    border-left: 1px solid var(--gray-E2);
    display: flex;
    flex-direction: column;
    padding: 7% 7% 0;
    height: 100%;
    justify-content: space-around
}

.btn-conversation-exhibitor:hover, .card-name-other-supplier > a, .card-name-other-supplier > a:hover, .color-black, .item-details-comments-questions:hover, .nav-tabs-image .nav-link {
    color: #000
}

.name-supplier-similar-goods {
    color: var(--gray-3D)
}

.discount-similar-goods {
    color: var(--gray-90);
    position: relative;
    width: max-content
}

.item-similar-goods > div, .item-similar-goods > img, .item-similar-goods > p {
    margin: 2% 0
}

.card-price-similar-goods, .card-price-similar-goods > div {
    display: flex;
    flex-direction: column
}

.description-text {
    line-height: 3
}

.description-text > img {
    width: 100% !important
}

.card-price-similar-goods {
    align-items: flex-end;
    margin-top: 5% !important
}

.card-price-similar-goods > div {
    align-items: flex-start;
    width: max-content
}

.discount-similar-goods:before {
    content: "";
    display: block;
    width: 100%;
    height: 1px;
    position: absolute;
    background-color: var(--gray-90);
    left: 50%;
    transform: rotate(-14deg) translate(-50%, -50%);
    bottom: 80%
}

.item-similar-goods > img {
    max-width: 80%;
    max-height: 80%;
    margin-right: auto;
    margin-left: auto
}

.card-discount-percent {
    z-index: 1;
    background-color: var(--color-orange);
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    left: 6%;
    top: 2%;
    padding: 5px
}

.card-discount-percent > span {
    color: #fff;
    line-height: 20px
}

.report-incorrect-specifications-responsive {
    position: absolute;
    left: 0;
    top: 50%;
    transform: translate(0, -50%);
    padding-right: 3%
}

.header-details-comments-questions, .list-details-comments-questions {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-direction: row
}

.card-txt-item-characteristics, .list-details-comments-questions {
    padding: 0
}

.list-details-comments-questions > li {
    padding: 0 6px 0 10px
}

.item-details-comments-questions {
    color: #000;
    padding: 10px 4px;
    display: inline-block
}

.active-tab-style, .active-tab-style:hover {
    color: var(--color-orange) !important
}

.card-details-comments-questions {
    border: 1px solid var(--gray-F3)
}

.header-details-comments-questions {
    border-bottom: 1px solid var(--gray-BE)
}

.active-tab-style {
    border-bottom: 2px solid var(--color-orange);
    font-weight: 700
}

.section-details-comments-questions {
    padding: 10px
}

.section-details-comments-questions > div {
    scroll-margin-top: 5rem
}

.title-card-characteristics {
    border-bottom: 1px dashed var(--gray-E7)
}

.padding-title-details-comments-questions {
    padding: 8px 0
}

.card-txt-item-characteristics > .txt-item-characteristics:last-child .text-properties {
    color: var(--gray-45)
}

.card-txt-item-characteristics > .txt-item-characteristics:first-child > span {
    color: var(--gray-18)
}

.padding-card-details-comments-questions {
    padding: 1.5% 0;
    display: inline-block
}

.txt-item-characteristics {
    padding: 5px 10px
}

.item-characteristics {
    padding: 0 1%
}

.sticky-item {
    position: sticky;
    top: 0
}

.slider-advertising .item-similar-goods {
    border: unset !important
}

.submit-comment-product {
    position: relative;
    display: inline-block;
    text-align: center;
    border: 1px solid var(--gray-FA);
    padding: 15px
}

.card-advertising {
    border: 1px solid var(--gray-FA);
    box-shadow: 0 3px 7px 0 #fafafa;
    margin-top: 18px;
    padding-bottom: 5px;
    height: fit-content
}

textarea {
    resize: none
}

.body-report-incorrect-specifications > h6, .body-report-incorrect-specifications > p, .card-left-empty-comment > h6, .card-left-empty-comment > p, .list-report-incorrect-specifications > li {
    margin-bottom: 2.5%
}

.card-left-empty-comment > h6, .empty-comment-right > .card-icon-star-score-comments {
    padding-right: 17px
}

.empty-comment-right > div, .empty-comment-right > p {
    margin-bottom: 6%
}

.card-comments {
    display: grid;
    grid-template-columns:25% 75%
}

.card-comments > div, .section-main-question > div {
    padding: 0 18px
}

.card-score-comments {
    width: 100%;
    border: 1px solid var(--gray-D9);
    border-radius: 3px;
    padding: 4%;
    margin-bottom: 5%
}

.result-score-comment, .section-score-comments {
    display: flex;
    align-items: center;
    justify-content: flex-start
}

.result-score-comment > span {
    margin-left: 5px
}

.card-icon-star-score-comments > svg, .card-like-dislike svg, .icon-dot, .icon-info {
    width: 15px;
    height: 15px
}

.section-score-comments > div, .section-score-comments > span {
    margin-left: 2.5%;
    padding-right: 2px
}

.animated-progress {
    width: 100%;
    height: 13px;
    border-radius: 20px;
    border: 1px solid var(--gray-D9);
    overflow: hidden;
    position: relative;
    margin-left: 3%
}

.card-recommended-products, .list-all-comments > li {
    border-bottom: 1px solid var(--gray-B8)
}

.animated-progress span {
    border-radius: 20px;
    background-color: var(--blue-progress);
    height: 100%;
    display: block;
    width: 0;
    position: absolute;
    text-align: end;
    padding-right: 5px
}

.txt-progress {
    color: var(--gray-69);
    margin: 0 3%
}

.btn-other-specifications, .card-like-dislike, .card-like-dislike > div, .card-name-other-supplier, .card-sort, .card-usefulness-view, .image-gallery-slider-tyle .image-gallery, .progress-bar-item {
    display: flex;
    align-items: center
}

.discount_price:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 1px;
    background: red;
    transform: rotate(11deg);
    top: 8px;
    opacity: .5
}

.card-item-progress > p, .description-report > p {
    margin-bottom: 1.5%
}

.animated-progress-good-performance, .card-item-progress {
    margin: 4% 0
}

.btn-register-comment {
    max-width: 60%;
    border-radius: 2px;
    cursor: pointer
}

.card-btn-register-comment, .item-range {
    display: flex;
    justify-content: center
}

.txt-register-comment {
    margin-bottom: 8%
}

.icon-info {
    margin-left: 3px;
    stroke: var(--gray-56)
}

.card-suggestion > span {
    color: var(--gray-56)
}

.card-image-user-share {
    display: grid;
    grid-template-columns:repeat(9, 1fr);
    gap: 15px;
    margin: 1.5% 0 1%
}

.card-image-user-share > div {
    box-shadow: 0 2px 4px 1px #eeee;
    display: inline-block;
    cursor: pointer;
    border-radius: 2px
}

.card-image-user-share > div > img {
    object-fit: cover;
    border-radius: 2px
}

.card-sort > span, .card-sort > ul > li {
    float: right;
    padding: 0 7px
}

.card-sort li, .card-sort > span {
    color: var(--gray-37)
}

.card-filter-comments > span {
    color: var(--gray-9E);
    padding-right: 2%
}

.card-filter-comments {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1.5% 0
}

.lable-green {
    background-color: var(--green-lable)
}

.lable-orange {
    background-color: var(--orange-lable)
}

.padding-lable {
    padding: 2.5px 8px;
    border-radius: 2px
}

.buyer {
    background-color: var(--gray-E)
}

.card-information-comment {
    display: flex;
    align-items: center;
    margin-bottom: 1.5%
}

.card-information-comment > div, .card-information-comment > span {
    margin-left: 8px
}

.icon-dot {
    fill: var(--gray-D9)
}

.card-supplier-comment > a, .card-supplier-comment > a:hover {
    color: var(--gray-62)
}

.border_top {
    border-top: 1px solid var(--gray-E6)
}

.card-supplier-like-comment {
    display: flex;
    justify-content: space-between;
    margin-top: 1%;
    padding: 1.5% 0
}

.card-like-dislike span, .card-usefulness-view > span {
    color: var(--gray-9C)
}

.bold-text {
    font-weight: 700
}

.card-main-bottom-comment {
    padding: 0 2.4%
}

.card-supplier-comment svg {
    width: 17px;
    height: 17px;
    fill: var(--gray-62)
}

.card-supplier-comment {
    display: flex;
    max-width: 70%;
    width: 100%;
    align-items: center
}

.card-usefulness-view {
    max-width: 30%;
    width: auto;
    justify-content: space-between
}

.card-size-comment > svg, .card-supplier-comment > a, .card-supplier-comment > svg {
    margin-left: 6px
}

.name-seller-comment {
    max-width: 60%;
    width: auto;
    padding-left: 15px
}

.card-size-comment {
    max-width: 40%;
    width: 100%;
    display: flex;
    align-items: center
}

.card-like-dislike > div span, .card-like-dislike > div svg {
    margin-right: 5px
}

.card-like-dislike > div svg {
    cursor: pointer;
    fill: white;
    stroke: var(--gray-9C)
}

.active-like {
    stroke: var(--active-like) !important
}

.card-like-dislike > div {
    margin-right: 8px
}

.card-like-dislike {
    padding-right: 25px
}

.card-recommended-products {
    margin-bottom: .5%
}

.card-image-share-user {
    display: grid;
    grid-template-columns:repeat(8, 1fr);
    max-width: 60%;
    column-gap: 9px;
    margin: 1.5% 0
}

.card-image-share-user > img {
    border: 1px solid var(--gray-E5)
}

.txt-comment {
    margin-bottom: 12px
}

.max-height-text {
    max-height: 240px;
    overflow-y: hidden
}

.margin-btn-continuation {
    margin-top: -10px
}

.card-main-recommended-products, .information-seller-good-performance > a, .information-seller-good-performance > span {
    padding: 0 10px
}

.card-suggestion {
    margin-right: -33px
}

.btn-other-comment {
    border: unset;
    background-color: unset;
    color: var(--blue-progress);
    margin: 1% 0
}

.arrow-btn-more-seller, .btn-other-comment > svg {
    width: 11px;
    height: 11px;
    margin-right: 5px
}

.arrow-btn-more-seller {
    fill: black
}

.list-all-comments, .list-question {
    padding-bottom: .7%
}

.card-left-empty-question > textarea:focus, .input-weaknesses-strengths:focus, .slider:focus, .textarea-report-incorrect-specifications:focus, textarea:focus {
    outline: 0
}

.card-left-empty-question > textarea {
    border: 1px solid var(--gray-B9);
    border-radius: 3px;
    padding: 10px;
    height: 160px
}

.btn-submit-question-empty {
    border: 1px solid var(--gray-B9);
    color: var(--gray-B9);
    background-color: #fff;
    padding: 6px 19px;
    border-radius: 3px;
    float: left;
    margin: .5% 0
}

.section-main-question {
    display: grid;
    grid-template-columns:21% 79%
}

.card-question-line:after {
    content: "";
    display: block;
    width: 100%;
    height: 1px;
    background-color: var(--gray-E6);
    margin: auto;
    max-width: 96%
}

.card-question > span {
    padding-right: 8px
}

.btn-record-answer {
    background-color: unset;
    border: unset;
    color: var(--blue-progress);
    margin: 2% 0 0
}

.icon-help, .lable-response {
    margin-left: 3px
}

.information-seller-good-performance > a, .information-seller-good-performance > a:hover, .lable-response {
    color: var(--gray-87)
}

.btn-record-answer > svg {
    width: 9px;
    height: 9px;
    fill: var(--blue-progress);
    margin-right: 6px
}

.list-question li {
    border-bottom: 1px solid var(--gray-86)
}

.card-question, .card-response {
    padding-bottom: 1%
}

.icon-help {
    width: 17px;
    height: 17px;
    cursor: pointer
}

.card-information-question {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1.2%
}

.name-user-asked {
    color: var(--gray-B9)
}

.height-list {
    max-height: 710px;
    overflow-y: hidden
}

.height-list-question {
    height: 470px;
    overflow-y: hidden
}

.pr-question {
    padding-right: 2%;
    padding-left: 2%
}

.list-other-seller > li:nth-child(2n) {
    background-color: var(--blue-FB);
    border-top: 1px solid var(--blue-E);
    border-bottom: 1px solid var(--blue-E)
}

.card-main-list-other-seller {
    border: 1px solid var(--blue-E) !important;
    border-radius: 5px
}

.list-other-seller > li {
    display: grid;
    grid-template-columns:30% 20% 20% 30%;
    align-items: center;
    padding: 1.5%
}

.btn-add-basket-other-seller {
    color: var(--color-orange);
    background-color: #fff;
    border: unset;
    border-radius: 4px;
    padding: 7px 20px;
    max-width: 40%;
    border: 1px solid var(--color-orange)
}

.lable-percent-other-seller {
    color: var(--color-orange);
    background-color: var(--light-orange);
    padding: 3px 5px !important;
    border-radius: 3px
}

.card-center-other-seller svg {
    width: 17px;
    height: 17px;
    margin-left: 5px;
    stroke: black
}

.card-add-basket-other-seller {
    display: flex;
    align-items: center;
    justify-content: space-between
}

.card-price-other-seller > span {
    padding: 0 3px;
    position: relative;
    top: 16px
}

.card-price-other-seller {
    padding-left: 3%;
    max-width: 100%
}

.list-other-seller > li > div {
    padding-left: 5%
}

.list-other-seller > li:first-child {
    border-top-left-radius: 5px;
    border-top-right-radius: 5px
}

.list-other-seller > li:last-child {
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    border-bottom: unset !important
}

.card-name-other-supplier > a {
    width: auto !important;
    max-width: 100%
}

.card-name-other-supplier > img {
    max-width: 100px
}

.card-main-btn-more-seller {
    display: flex;
    justify-content: center;
    margin: 1% auto;
    align-items: center
}

.max-height-img-list {
    max-height: 445px;
    overflow-y: scroll
}

.gallery-thumbs > .swiper-wrapper {
    flex-wrap: wrap
}

.swiper-container {
    width: 100%;
    height: 300px;
    margin-left: auto;
    margin-right: auto
}

.image-gallery-slider {
    width: 100%;
    overflow-x: hidden;
    position: relative
}

.gallery-thumbs {
    height: 100%;
    box-sizing: border-box;
    overflow-x: hidden
}

.gallery-thumbs .swiper-slide {
    margin-bottom: 10px
}

.card-body-image-official-space {
    padding: 3% 1.7%
}

.list-image-modal-new {
    max-width: 97%
}

.card-body-image-official {
    display: grid;
    grid-template-columns:40% 58%;
    gap: 15px
}

.image-gallery img {
    width: 100%;
    height: auto;
    display: block
}

.gallery-thumbs-item-style {
    border: 1px solid var(--gray-D9);
    cursor: pointer
}

.image-gallery-slider-tyle, .list-image-modal > li > a {
    height: 100%;
    border: 1px solid var(--gray-D9)
}

.modal-dialog-width-lg {
    max-width: 60% !important
}

.btn-close, .swal2-title {
    font-size: 14px !important
}

.btn-close-modal {
    position: absolute;
    left: 11px;
    top: 11px;
    z-index: 3
}

.nav-tabs-image .nav-item.show .nav-link, .nav-tabs-image .nav-link.active {
    color: var(--color-orange) !important;
    background-color: #fff !important;
    border-bottom: 1px solid var(--color-orange) !important;
    font-weight: 700
}

.gallery-thumbs-item-style, .gallery-thumbs-item-style > img {
    width: 100%;
    height: auto;
    display: inline-block
}

.list-image-modal > li > a, .list-image-modal > li > a > img {
    width: 100%;
    height: 100%;
    display: inline-block;
    object-fit: cover
}

.list-image-modal {
    display: grid;
    grid-template-columns:repeat(5, 1fr);
    gap: 10px
}

.image-gallery {
    padding: 10%
}

.table-delivery-time, .table-delivery-time tbody, .table-delivery-time tbody td, .table-delivery-time tbody th, .table-delivery-time tbody tr td, .table-delivery-time tbody tr th, .table-delivery-time td, .table-delivery-time th, .table-delivery-time thead, .table-delivery-time thead td, .table-delivery-time thead th, .table-delivery-time thead tr, .table-delivery-time thead tr td, .table-delivery-time thead tr th, .table-delivery-time tr td, .table-delivery-time tr th, table tbody tr, table tr {
    display: flow-root
}

.table-delivery-time > thead {
    float: right
}

.table-delivery-time > tbody > tr {
    display: table-cell
}

.table-delivery-time > tbody > tr > td, .table-delivery-time > tbody > tr > th, .table-delivery-time > thead > tr > td, .table-delivery-time > thead > tr > th {
    border-bottom: 1px solid var(--color-orange);
    border-left: 1px solid var(--color-orange);
    line-height: 20px;
    padding: 13px;
    vertical-align: top
}

.table-delivery-time > tbody > tr:last-child > td {
    border-left: unset !important
}

.table-delivery-time > thead > tr {
    text-align: right !important
}

.card-main-table-delivery-time {
    justify-content: center;
    display: flex;
    margin: 6% auto
}

.btn-conversation-exhibitor {
    border-bottom: 1px solid var(--color-orange);
    color: #000;
    width: fit-content;
    padding-bottom: 5px
}

.card-btn-conversation-exhibitor {
    display: flex;
    justify-content: center;
    width: 100%
}

.title-modal {
    padding-left: 7%
}

.information-seller-good-performance {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    margin-top: 1%
}

.information-seller-good-performance > span {
    width: auto !important;
    max-width: 70%;
    position: relative
}

.information-seller-good-performance > img {
    max-width: 28%;
    max-height: 28%
}

.information-seller-good-performance > span:after {
    content: "";
    display: block;
    width: 1px;
    height: 12px;
    background-color: var(--gray-87);
    position: absolute;
    left: 0;
    z-index: 5;
    top: 50%;
    transform: translate(0, -50%)
}

.satisfaction-percentage-modal {
    display: flex;
    flex-direction: column;
    justify-content: center;
    border-bottom: 1px solid var(--gray-B9);
    padding: 8% 0
}

.txt-satisfaction-percentage {
    color: var(--color-green)
}

.those-who-gave-points {
    color: var(--gray-80)
}

.animated-progress-good-performance {
    height: 22px !important;
    border: unset !important;
    border-radius: 4px !important;
    background-color: var(--unhappy);
    margin-left: 0 !important
}

.animated-progress-good-performance span {
    border-radius: 0 !important;
    background-color: var(--satisfaction) !important
}

.item-guide-progress span {
    color: var(--gray-75)
}

.progress-bar-item-modal {
    flex-direction: column
}

.card-unhappy > div {
    background-color: var(--unhappy)
}

.card-satisfaction > div {
    background-color: var(--satisfaction)
}

.card-satisfaction > div, .card-unhappy > div {
    width: 12px;
    height: 9px;
    border-radius: 1px;
    margin-left: 7px
}

.guide-progress {
    display: flex;
    margin: .5% 0
}

.txt-information-bottom-good-performance {
    color: var(--gray-4E)
}

.information-bottom-good-performance {
    display: flex;
    justify-content: center;
    padding: 10% 0 5%
}

.item-guide-progress {
    display: flex;
    align-items: center;
    margin-left: 10%
}

.satisfaction-percentage-modal > p {
    margin-bottom: 2%
}

.card-textarea-register-comment-modal, .item-information-bottom-good-performance {
    padding: 0 5%
}

.checkbox-lable-city {
    position: relative;
    display: flex;
    align-items: center
}

.checkbox-lable-city input {
    opacity: 0;
    cursor: pointer;
    height: 0;
    width: 0
}

.checkmark-city {
    cursor: pointer;
    margin-left: 5px;
    position: relative;
    float: right;
    right: 0;
    width: 16px;
    height: 16px;
    border-radius: 2px;
    border: 1px solid var(--gray-B8);
    background-color: #fff
}

.checkbox-lable-city input:checked ~ .checkmark-city {
    background-color: var(--green-sazman);
    border-color: var(--green-sazman)
}

.checkmark-city:after {
    content: "";
    position: absolute;
    display: none
}

.checkbox-lable-city input:checked ~ .checkmark-city:after, .hover-show {
    display: block
}

.checkbox-lable-city .checkmark-city:after {
    right: 50%;
    top: 50%;
    width: 4px;
    height: 9px;
    border: 0 solid #fff;
    border-width: 0 2px 2px 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg) translate(-50%, -50%)
}

.arrow-modal > svg, .icon-upload {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%)
}

.line-modal-report-incorrect-specifications {
    width: 100%;
    max-width: 95%;
    margin: 0 auto;
    background-color: var(--gray-E2);
    opacity: 1
}

.list-report-incorrect-specifications {
    padding: 3.5% 0 2%
}

.textarea-report-incorrect-specifications {
    border: 1px solid var(--gray-B8);
    border-radius: 2px;
    padding: 2%;
    height: 100px;
    margin-bottom: 10px
}

.btn-send-report {
    color: #fff;
    border: unset;
    border-radius: 2px;
    padding: 7px;
    text-align: center
}

.btn-send-report-active {
    background-color: var(--green-sazman)
}

.btn-send-report-disable {
    background-color: var(--gray-A6)
}

.textarea-register-question {
    border-color: var(--gray-B8);
    border-radius: 3px;
    height: 155px;
    padding: 10px;
    margin-top: 1%
}

.card-main-submit-register-question {
    padding: 2%
}

.card-submit-register-question {
    border-top: 1px solid var(--gray-E2);
    padding-top: 3%
}

.info-register-question {
    color: var(--gray-17);
    margin-bottom: 5%
}

.info-register-question:hover {
    color: var(--gray-17)
}

.question-registration-answer > p {
    margin-right: 3px
}

.question-registration-answer {
    display: flex;
    align-items: center;
    margin-bottom: 3%
}

.body-register-comment-modal > h6, .body-register-comment-modal > p, .title-textarea-register-question {
    margin-bottom: 1%
}

.card-supplier-comment-modal, .card-supplier-comment-modal .name-seller-comment, .card-usefulness-view-modal {
    max-width: 100% !important;
    width: 100% !important
}

.card-supplier-like-comment-modal {
    flex-direction: column;
    padding-top: 4%
}

.card-supplier-comment-modal {
    margin-bottom: 5%
}

.card-usefulness-view-modal {
    justify-content: flex-end
}

.arrow-modal > svg {
    width: 10px !important;
    height: 10px !important
}

.arrow-modal {
    border: 1px solid var(--gray-BE);
    border-radius: 100%;
    width: 20px;
    height: 20px
}

.color-green {
    fill: green
}

.color-red, .negative-weaknesses-strengths {
    fill: red
}

.icon-plus-negative {
    width: 17px;
    height: 17px;
    margin-left: 5px
}

.max-width-100 {
    max-width: 100% !important
}

.textarea-register-comment-modal {
    border-radius: 2px;
    height: 130px;
    border: 1px solid var(--gray-EA);
    padding: 10px
}

.choose-file {
    height: .1px;
    opacity: 0;
    overflow: hidden;
    position: absolute;
    width: .1px;
    z-index: -1
}

.choose-file + .upload-file {
    float: right;
    position: relative;
    background-color: #fff;
    border: 1px dashed var(--color-link);
    box-sizing: border-box;
    color: #fff;
    display: block;
    font-size: 1.5rem;
    font-weight: 300;
    padding: 5px 0;
    text-align: center;
    text-transform: uppercase;
    border-radius: 6px;
    cursor: pointer
}

label.upload-file::before {
    content: "";
    position: relative;
    bottom: 2px;
    left: 9px
}

.choose-file:valid + .upload-file::before {
    content: "";
    position: relative
}

.icon-upload {
    width: 40px;
    height: 40px;
    stroke: #19BFD3
}

.form-group {
    float: left;
    position: relative
}

.form-group-upload {
    width: fit-content;
    height: 100%
}

.slider, .ticks .tick {
    height: 5px;
    font-size: 12px;
    box-sizing: border-box;
    cursor: pointer
}

.section {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    max-width: 87%;
    margin: 40px auto auto
}

.slider, .ticks {
    position: relative;
    width: 100%;
    margin: 0;
    padding: 0
}

.rangeContainer {
    position: relative;
    width: 100%
}

.slider {
    top: 0;
    right: 0;
    transition: .3s ease-out;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    background-image: linear-gradient(to left, var(--gray-AC) 0, var(--gray-AC) 10%);
    border: none;
    border-radius: 4px;
    z-index: 1
}

.ticks {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    top: 10px;
    left: 0;
    height: 24px
}

.ticks .tick {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 5px;
    background-color: var(--gray-AC);
    font-weight: 700;
    z-index: 2;
    border-radius: 100%;
    transition: .4s ease-out;
    pointer-events: none;
    line-height: 1
}

.ticks .tick.passed {
    color: var(--gray-AC)
}

.slider::-webkit-slider-thumb {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    border: none;
    width: 15px;
    height: 15px;
    background: var(--color-orange);
    border-radius: 100%;
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    box-shadow: inset 0 0 0 2px var(--color-orange);
    -webkit-box-shadow: inset 0 0 0 2px var(--color-orange)
}

.slider::-moz-range-thumb {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    border: none;
    width: 15px;
    height: 15px;
    background: var(--color-orange);
    border-radius: 100%;
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    box-shadow: inset 0 0 0 2px var(--color-orange);
    -webkit-box-shadow: inset 0 0 0 2px var(--color-orange)
}

.slider::-ms-thumb {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    border: none;
    width: 15px;
    height: 15px;
    background: var(--color-orange);
    border-radius: 100%;
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    box-shadow: inset 0 0 0 2px var(--color-orange);
    -webkit-box-shadow: inset 0 0 0 2px var(--color-orange)
}

.slider::-ms-tooltip {
    display: none
}

.slider::-ms-track {
    background: 0 0;
    color: transparent;
    border: none
}

.slider::-ms-fill-upper {
    background-color: transparent
}

.slider::-ms-fill-lower {
    background-color: transparent
}

.item-card-register-comment > div {
    margin: 6% 0
}

.item-card-register-comment > div:first-child {
    margin-top: 4% !important
}

.body-register-comment-modal .border-right-title, .title-weaknesses-strengths {
    margin-bottom: 15px !important
}

.info-upload-img-video {
    color: var(--gray-73);
    margin-bottom: 2%
}

.info-register-question-modal {
    margin-top: 1rem;
    display: inline-block
}

.card-file-uploaded {
    height: 100%;
    display: flex;
    flex-wrap: wrap
}

.card-thImage, .choose-file + .upload-file {
    width: 110px;
    height: 110px
}

.card-thImage > img {
    border-radius: 3px
}

.card-thImage, .upload-file {
    margin: 3px
}

.icon-delete-image {
    width: 20px;
    height: 20px;
    position: absolute;
    left: 5px;
    bottom: 7px;
    fill: white;
    cursor: pointer;
    z-index: 2
}

.weaknesses-strengths {
    display: grid;
    grid-template-columns:repeat(2, 1fr);
    gap: 7px
}

.title-weaknesses-strengths:before {
    content: "";
    display: block;
    width: 5px;
    height: 5px;
    background-color: var(--color-orange);
    border-radius: 100%;
    position: absolute;
    bottom: 6px;
    right: 0
}

.title-weaknesses-strengths {
    padding-right: 9px
}

.input-weaknesses-strengths {
    border-radius: 4px;
    border: 1px solid var(--gray-EA);
    padding: 10px 10px 10px 40px;
    height: 40px
}

.icon-weaknesses-strengths {
    fill: var(--gray-B8);
    width: 20px;
    height: 20px;
    cursor: pointer;
    position: absolute;
    left: 10px;
    top: 50%;
    transform: translate(0, -50%)
}

.item-weaknesses-strengths svg {
    width: 18px;
    height: 18px;
    cursor: pointer
}

.icon-delete-weaknesses-strengths {
    fill: var(--gray-e9)
}

.item-weaknesses-strengths {
    display: flex;
    align-items: center;
    margin: 5% 0;
    display: grid;
    grid-template-columns:85% 10%;
    gap: 5%;
    align-items: flex-start
}

.positive-weaknesses-strengths {
    fill: green !important
}

.txt-range {
    display: block;
    position: absolute;
    top: -43px
}

.toast:not(.showing):not(.show) {
    opacity: 1 !important
}

.toast-add-basket {
    position: fixed;
    z-index: 2;
    bottom: 10px;
    background-color: #fff;
    border: 1px solid var(--gray-DC);
    right: 10px
}

.toast-add-basket .toast-body h6 {
    color: var(--green-lable);
    border-right: 1px solid var(--green-lable);
    padding: 14px 10px
}

.btn-close-toast {
    color: var(--gray-DC);
    font-size: 10px;
    position: absolute;
    left: -2px;
    top: 6px;
    z-index: 2
}

.toast-add-basket .toast-body {
    padding: 1%
}

.animate__fadeOut {
    animation: 5s fadeOut;
    display: none
}

.animate__fadeIn {
    animation: 5s fadeIn;
    display: block !important
}

.btn-other-specifications-responsive {
    display: none
}

.arrow-right-gallery-img {
    right: 6px !important
}

.arrow-left-gallery-img {
    left: 6px !important
}

.arrow-back-modal {
    width: 20px;
    height: 20px;
    margin-left: 5px;
    cursor: pointer
}

.text-AD {
    color: var(--AD);
    position: absolute;
    right: 4%;
    top: 3%
}

.icon-share-modal {
    background-color: #fff;
    border: 1px solid #d3d3d3;
    margin: 10px 12px;
    height: 55px;
    width: 55px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer
}

.icon-share-modal svg {
    width: 26px;
    height: 26px;
    cursor: pointer;
    stroke: black
}

.icon-share-modal i {
    font-size: 28px;
    cursor: pointer
}

.group-icon-share {
    justify-content: center;
    display: flex
}

.enter-email, .tick-copy {
    display: none;
    position: relative
}

.icon-share-modal > a {
    display: flex;
    align-items: center;
    justify-content: center
}

.input-email :focus, .tick-copy {
    border: 1px solid #1b9c90
}

.tick-copy .fa-check {
    position: absolute;
    transform: translate(50%, 50%);
    right: 50%;
    bottom: 50%;
    color: #1b9c90
}

.enter-email {
    margin: 4% auto
}

.input-email {
    height: 37px;
    background-color: #fff;
    border-radius: 33px;
    border: 1px solid #1b9c90;
    font-size: 13px;
    padding: 2.5% 3% 2% 50px;
    position: relative;
    width: 100%
}

.arrow-email img {
    width: 59%;
    height: 57%;
    position: absolute;
    z-index: 10;
    left: 19%;
    top: 21%
}

.arrow-email {
    background-color: #1b9c90;
    width: 37px;
    height: 37px;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 5;
    display: flex;
    align-items: center;
    justify-content: center
}

.arrow-email > svg {
    fill: white;
    width: 16px;
    height: 16px
}

.warning-modal {
    font-size: 9px;
    margin-right: 4%;
    margin-top: 1.2%
}

.card-left-specifications-logo {
    max-width: 80px;
    max-height: 100px
}

.read-more.collapsed .read-more__content > .readMore-height {
    max-height: 120px
}

.read-more {
    border: unset;
    outline: unset
}

.style-toman {
    width: 24px;
    height: 24px;
    fill: black
}

.style-toman-middle {
    width: 19px;
    height: 19px
}

.btn-add-basket-price {
    min-width: 115px
}

.dot-before::before {
    content: "";
    display: block;
    border-radius: 100%;
    background-color: var(--gray-D9);
    width: 4px;
    height: 4px;
    margin-left: 4px
}

.discount-product-title {
    color: var(--very-bright-orange)
}

.discount-percent-price::before {
    content: "";
    display: block;
    width: 100%;
    height: 1px;
    position: absolute;
    left: 50%;
    bottom: 70%;
    background-color: var(--gray-82);
    transform: rotate(-8deg) translate(-50%)
}

.purchase-profit p, .purchase-profit span {
    color: var(--orange-F1)
}

@media (min-width: 1440px) {
    .section-details-comments-questions > div {
        scroll-margin-top: 6rem
    }
}

@media (max-width: 1200px) {
    .btn-add-basket-price {
        min-width: 100px
    }

    .card-image-big {
        padding: 0 8%
    }

    .reason-purchase img {
        max-width: 37px;
        max-height: 37px
    }

    .icon-tool-image {
        left: 15%;
        top: 6px
    }

    .icon-tool-image > a > svg, .icon-tool-image > svg {
        width: 18px;
        height: 18px
    }

    .icon-tool-image > a {
        width: 28px;
        height: 28px
    }

    .font-9 {
        font-size: 8px
    }

    .font-10 {
        font-size: 9px
    }

    .font-11 {
        font-size: 10px
    }

    .font-12 {
        font-size: 11px
    }

    .font-13 {
        font-size: 12px
    }

    .font-14 {
        font-size: 13px
    }

    .font-15 {
        font-size: 14px
    }

    .line-height-25 {
        line-height: 23px
    }

    .line-height-30 {
        line-height: 28px
    }

    .line-height-31 {
        line-height: 29px
    }

    .line-height-32 {
        line-height: 30px
    }

    .list-other-seller > li {
        grid-template-columns:35% 15% 15% 35%
    }

    .btn-add-basket-other-seller {
        padding: 7px 10px
    }

    .padding_card {
        padding: 2.5% 0
    }

    .card-category {
        margin-bottom: -1%
    }

    .card-name-product-specifications {
        margin-bottom: 8px
    }

    .border-right-title {
        margin-bottom: 2%;
        font-size: 15px
    }

    .animated-progress {
        height: 10px
    }

    .card-icon-star-score-comments > svg {
        width: 12px;
        height: 12px
    }

    .height-list {
        max-height: 685px
    }

    .card-usefulness-view {
        max-width: 40%
    }

    .card-supplier-comment {
        max-width: 60%
    }

    .card-size-comment {
        max-width: 35%
    }

    .name-seller-comment {
        max-width: 65%
    }

    .card-discount-percent {
        width: 30px;
        height: 30px
    }

    .card-number-counter > svg {
        width: 17px;
        height: 17px
    }

    .custom-number-input {
        padding-left: 2%
    }

    .custom-number-input > div {
        padding: 7px 11px
    }

    .checkmark-city {
        width: 15px;
        height: 15px
    }

    .checkbox-lable-city .checkmark-city:after {
        right: 6px;
        top: 6px
    }

    .max-height-img-list {
        max-height: 390px
    }
}

@media (max-width: 1024px) {
    .max-height-img-list {
        max-height: 330px
    }
}

@media (max-width: 991px) {
    body {
        padding-top: 30px !important
    }

    .font-16 {
        font-size: 15px
    }

    .card-countr-basket-res > div:first-child {
        flex: 1
    }

    .card-countr-basket-res > div:nth-child(2) {
        flex: .3
    }

    .card-counter > div > div, .card-name-product-specifications {
        max-width: 100%
    }

    .custom-number-input {
        padding-left: .5rem
    }

    .btn-add-basket-counter {
        min-width: 2.4rem;
        height: 2.4rem
    }

    .btn-add-basket-counter svg {
        width: 15px;
        height: 15px;
        fill: white
    }

    .btns-share-scroll {
        bottom: 125px !important
    }

    #goftino_w {
        bottom: 7.2rem !important
    }

    .padding_card {
        padding: 3.5% 0
    }

    .card-section-top > div:first-child {
        max-width: 60%
    }

    .card-section-top > div:nth-child(2) {
        max-width: 40%
    }

    .modal-dialog-width-lg {
        max-width: 98% !important
    }

    .d-none-desktop, .title-card-characteristics {
        display: block
    }

    .d-none-responsive {
        display: none
    }

    .border-right-title {
        margin-bottom: 2.5%
    }

    .card_main_swiper > .swiper {
        max-width: 93%
    }

    .card-counter {
        justify-content: flex-start;
        padding-top: 0;
        margin: 2% 0;
        max-width: unset !important
    }

    .card-discount-percent-responsive {
        display: flex;
        justify-content: flex-start;
        height: 100%
    }

    .card-discount-percent-responsive > .card-discount-percent {
        position: relative !important;
        left: 0;
        top: 50%
    }

    .card-price-fix {
        margin-left: 2%
    }

    .btn-add-basket {
        border-radius: 4px;
        padding: 10px 20px;
        margin: 0 0 0 auto;
        display: flex
    }

    .card-price-res {
        margin-top: 10px
    }

    .card-discount-percent-responsive, .card-price-fix {
        width: fit-content
    }

    .card-main-price-none, .footer, .icon-tool-image > a:hover .hover-tool-image {
        display: none !important
    }

    .card-main-price > button, .card-main-price > div {
        max-width: 50%;
        width: 100%
    }

    .card-main-price {
        align-items: center;
        display: flex;
        justify-content: space-between;
        flex-direction: column;
        position: fixed;
        bottom: 0;
        width: 100%;
        background-color: #fff;
        border-top: 1px solid var(--gray-FA);
        right: 0;
        padding: .5% 2% !important;
        z-index: 2;
        box-shadow: 0 -2px 10px 0 var(--gray-FA)
    }

    .card-main-specifications > div {
        padding: 0 .5%;
        gap: 0
    }

    .card-category {
        padding: 1% 1.5% 0 0
    }

    .card-gallery-image {
        padding-left: 2% !important
    }

    .toast-add-basket {
        bottom: 18%
    }

    .icon-tool-image {
        left: 14%
    }

    .icon-tool-image > a > svg, .icon-tool-image > svg {
        width: 17px;
        height: 17px
    }

    .card-property > li {
        margin-top: 3%
    }

    .card-left {
        border: unset;
        margin: 2.5% auto 0
    }

    .card-left-specifications > div, .card-left-specifications > p {
        padding: 1% 0
    }

    .available > div, .available > p {
        padding: 20px 0
    }

    .card-information-order {
        padding: .5% 0 !important;
        border-bottom: unset !important
    }

    .card-information-order > span {
        padding: 20px 10px 0
    }

    .card-price {
        margin: 2% 0
    }

    .custom-number-input > div {
        width: 100%;
        min-height: 2.4rem
    }

    .reason-purchase {
        gap: 3px
    }

    .reason-purchase img {
        max-width: 35px;
        max-height: 35px;
        margin-left: 2%
    }

    .list-other-seller > li > div {
        padding-left: 10%
    }

    .btn-add-basket-other-seller, .card-price-other-seller {
        max-width: 50%
    }

    .read-more.collapsed .read-more__content > .readMore-height-other-suppliers {
        max-height: 270px
    }

    .card-main-btn-more-seller {
        margin: 1.5% auto
    }

    .card-details-comments-questions {
        border: unset
    }

    .report-incorrect-specifications-responsive {
        position: absolute;
        left: 0;
        top: 50%;
        transform: translate(0, -50%);
        padding-right: 3%
    }

    .icon-plus-negative {
        width: 15px;
        height: 15px;
        margin-left: 6px
    }

    .card-comments > div, .card-main-recommended-products, .section-main-question > div {
        padding: 0
    }

    .height-list {
        max-height: 645px
    }

    .card-suggestion {
        margin-right: 0
    }

    .register-comment-responsive {
        display: flex;
        align-items: center;
        justify-content: space-between;
        border-bottom: 1px solid var(--gray-B8);
        padding: 1.2% 0
    }

    .btn-viewpoint {
        margin: 0 10px 0 0 !important;
        align-items: center;
        padding: 6px 10px;
        border-radius: 2px
    }

    .btn-viewpoint > svg {
        fill: var(--color-orange);
        width: 13px;
        height: 13px;
        margin-left: 3px
    }

    .card-comments, .section-main-question {
        grid-template-columns:100%
    }

    .sum-score {
        color: var(--color-link);
        display: block
    }

    .height-list-question {
        height: 410px
    }

    .textarea-report-incorrect-specifications {
        height: 120px
    }

    .max-height-img-list {
        max-height: 350px
    }

    .list-image-modal {
        grid-template-columns:repeat(6, 1fr)
    }

    .card-unavailable-res > a, .card-unavailable-res > div {
        max-width: unset !important;
        width: auto !important
    }

    .card-unavailable-res {
        display: flex !important
    }

    .card-unavailable-res > a {
        white-space: nowrap
    }

    .card-main-header {
        padding: 0 !important
    }

    .card-counter-res .card-counter {
        display: flex;
        align-items: center;
        padding-bottom: 0
    }

    .card-counter-res > div {
        max-width: unset !important
    }

    .card-counter-res {
        padding-top: 15px !important;
        padding-bottom: 8px !important
    }

    .card-counter-res .card-counter .custom-number-input {
        max-width: 100% !important
    }

    .btn-add-basket-price {
        justify-content: center
    }

    .btn-nav-res > svg {
        width: 18px;
        height: 18px;
        fill: var(--color-orange)
    }

    .btn-nav-res {
        width: 2.4rem;
        height: 2.4rem;
        border: 1px solid var(--color-orange);
        border-radius: .25rem;
        min-width: 2.4rem;
        min-height: 2.4rem
    }
}

@media (max-width: 768px) {
    .btn-add-basket-counter, .btn-nav-res {
        height: 2.3rem;
        min-width: 2.3rem
    }

    .btn-nav-res, .custom-number-input > div {
        min-height: 2.3rem
    }

    .btn-nav-res {
        width: 2.3rem
    }

    .gallery-thumbs {
        margin-right: 1rem !important
    }

    .card_main_swiper > .swiper {
        max-width: 90%
    }

    .parent-slider-omde-height {
        padding: 0 2.1% 0 1.5%
    }

    .padding_item_suppliers {
        padding: 2% 15% !important
    }

    .background-behind-video-Supplier-khord {
        margin-bottom: -19%;
        margin-top: 21%
    }

    .div-video-modal {
        padding: 0 11%
    }

    .img-about-tamin-card .circle {
        width: 15.5px;
        height: 15.5px;
        right: 20%;
        top: 7%
    }

    .font-10 {
        font-size: 8px
    }

    .font-11 {
        font-size: 9px
    }

    .font-12 {
        font-size: 10px
    }

    .font-13 {
        font-size: 11px
    }

    .font-14 {
        font-size: 12px
    }

    .font-15 {
        font-size: 13px
    }

    .border-right-title {
        font-size: 14px
    }

    .line-height-30 {
        line-height: 24px
    }

    .arrow-left > svg, .arrow-right > svg, .btn-viewpoint > svg, .icon-star {
        width: 12px;
        height: 12px
    }

    .arrow-left {
        left: -2px
    }

    .arrow-right {
        right: -2px
    }

    .btn-other-specifications > svg {
        width: 7px;
        height: 7px;
        margin-right: 6px
    }

    .card-left-specifications-information > img, .card-left-specifications-information > span {
        margin-left: 1px
    }

    .card-name-product-specifications {
        margin-bottom: 9px
    }

    .card-category {
        padding: 1.5% 1.5% 0 0;
        margin-bottom: 0
    }

    .arrow-email > svg, .icon-help, .icon-tool-image > a > svg, .icon-tool-image > svg {
        width: 15px;
        height: 15px
    }

    .card-discount-percent, .icon-tool-image > a {
        width: 27px;
        height: 27px
    }

    .btn-other-specifications-responsive {
        justify-content: flex-end;
        padding: 1.2% 0 0;
        display: flex;
        border-bottom: unset !important
    }

    .btn-other-specifications-responsive > a {
        width: fit-content
    }

    .padding_card {
        padding: 4% 0
    }

    .reason-purchase img {
        max-width: 33px;
        max-height: 33px;
        margin-left: 3%
    }

    .reason-purchase {
        gap: 10px
    }

    .d-none-other-suppliers {
        display: none
    }

    .list-other-seller > li {
        grid-template-columns:78% 22%;
        padding: 2%
    }

    .btn-add-basket-other-seller {
        text-align: center
    }

    .list-other-seller > li > div {
        padding-left: 5%
    }

    .list-other-seller > li > div > div {
        margin-bottom: 10px
    }

    .btn-add-basket-other-seller, .card-price-other-seller {
        max-width: 100%
    }

    .card-score-comments-responsive {
        padding: 3%
    }

    .card-usefulness-view {
        max-width: 45%
    }

    .register-comment-responsive {
        padding: 1.5% 0
    }

    .icon-info {
        width: 12px;
        height: 12px;
        margin-left: 2px
    }

    .card-image-user-share {
        margin: 2% 0 1.5%
    }

    .card-supplier-comment {
        padding-left: 10px
    }

    .card-like-dislike > div span, .card-like-dislike > div svg {
        margin-right: 4px
    }

    .card-like-dislike svg, .checkmark-city {
        width: 13px;
        height: 13px
    }

    .card-like-dislike {
        padding-right: 22px
    }

    .card-supplier-like-comment {
        padding: 2% 0
    }

    .card-image-share-user {
        margin: 2% 0
    }

    .height-list {
        max-height: 630px
    }

    .card-question > span {
        padding-right: 5px
    }

    .height-list-question {
        height: 360px
    }

    .pr-question {
        padding-right: 0
    }

    .checkbox-lable-city .checkmark-city:after {
        width: 4px;
        height: 8px;
        right: 5px;
        top: 5px
    }

    .icon-weaknesses-strengths {
        width: 18px;
        height: 18px
    }

    .slider {
        height: 4px
    }

    .slider::-webkit-slider-thumb {
        width: 12px;
        height: 12px
    }

    .animated-progress {
        height: 9px
    }

    .animated-progress-good-performance {
        height: 18px !important;
        margin: 3% 0
    }

    .card-satisfaction > div, .card-unhappy > div {
        width: 9px;
        height: 7px
    }

    .arrow-left-gallery-img {
        left: 5px !important
    }

    .arrow-right-gallery-img {
        right: 5px !important
    }

    .card-discount-percent-responsive {
        max-width: 100% !important;
        height: auto !important
    }

    .custom-number-input {
        max-width: 70% !important
    }

    .btn-add-basket-show-cunter {
        max-width: unset !important
    }
}

@media (max-width: 767px) {
    .desktop {
        margin-bottom: 100px !important
    }

    .img-dstods-res-index > img {
        display: none
    }

    .btn-back-page-header {
        width: 25px;
        height: 25px;
        padding: 5px
    }
}

@media (max-width: 575px) {
    .font-16 {
        font-size: 14px
    }

    .card-available-top {
        padding: 0
    }

    .card-section-top > div:first-child, .card-section-top > div:nth-child(2), .card-supplier-comment, .card-usefulness-view {
        max-width: 100%
    }

    .card-section-top > div:first-child {
        padding-left: 0 !important;
        width: 100%
    }

    .border-item-image-product {
        max-height: 65px;
        max-width: 65px
    }

    .btn-back-page-header {
        width: 23px;
        height: 23px
    }

    .line-height-30 {
        line-height: 26px
    }

    .card-category {
        padding: 2% 1.5% 0 0;
        margin-bottom: -1%
    }

    .card_main_swiper > .swiper {
        max-width: 85%
    }

    .card-body-image-official {
        grid-template-columns:45% 52%
    }

    .card-price-fix {
        margin-left: 3%
    }

    .logo-specifications {
        max-width: 40%
    }

    .card-property > li {
        margin-top: 1.5%
    }

    .icon-tool-image {
        left: 12%;
        top: 2%
    }

    .icon-tool-image > a > svg, .icon-tool-image > svg {
        width: 18px;
        height: 18px
    }

    .icon-tool-image > a {
        width: 29px;
        height: 29px
    }

    .name-product {
        margin-bottom: 7px
    }


    .card-name-product-specifications {
        justify-content: flex-start;
        flex-direction: column;
        align-items: flex-start
    }

    .card-name-product-specifications > span {
        max-width: 100%;
        width: 100%
    }

    .reason-purchase {
        gap: 20px;
        grid-template-columns:repeat(2, 1fr)
    }

    .icon-plus-negative {
        width: 13px;
        height: 13px
    }

    .card-usefulness-view {
        justify-content: flex-end
    }

    .name-seller-comment {
        max-width: 70%
    }

    .card-size-comment {
        max-width: 30%;
        justify-content: flex-end
    }

    .card-image-share-user {
        margin: 2.5% 0;
        max-width: 100%
    }

    .list-all-comments > li, .list-question li {
        padding: 2.3% 0
    }

    .card-filter-comments, .register-comment-responsive {
        padding: 2.5% 0
    }

    .card-image-user-share {
        gap: 8px;
        margin: 3% 0 2.5%
    }

    .card-supplier-like-comment {
        flex-direction: column;
        padding: 2.5% 0
    }

    .card-information-comment {
        margin-bottom: 2%
    }

    .height-list {
        max-height: 675px
    }

    .card-sort > span, .card-sort > ul > li {
        padding: 0 5px
    }

    .card-supplier-comment {
        margin-bottom: 15px
    }

    .card-information-question {
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin-bottom: 2%;
        margin-top: 1%
    }

    .card-item-progress {
        margin: 3% 0
    }

    .icon-weaknesses-strengths, .item-weaknesses-strengths svg {
        width: 16px;
        height: 16px
    }

    .input-weaknesses-strengths {
        height: 37px
    }

    .card-thImage, .choose-file + .upload-file {
        width: 95px;
        height: 95px
    }

    .item-guide-progress {
        margin-left: 7%
    }

    .information-bottom-good-performance {
        padding: 8% 0 3%
    }

    .information-seller-good-performance {
        padding-left: 10%
    }

    .list-other-seller > li > div {
        padding-left: 0
    }

    .btn-add-basket-other-seller {
        margin-top: 4%;
        margin-right: auto
    }

    .card-main-list-other-seller {
        margin-top: 4%
    }

    .list-other-seller > li {
        grid-template-columns:100%;
        padding: 3%
    }

    .card-center-other-seller svg {
        width: 15px;
        height: 15px
    }

    .list-other-seller > li > div > div {
        margin-bottom: 8px
    }

    .icon-share-modal svg {
        width: 24px;
        height: 24px
    }

    .card-main-Related-posts {
        margin-top: 10%
    }

    .icon-share-modal {
        margin: 10px 9px;
        height: 51px;
        width: 51px
    }

    .icon-share-modal i {
        font-size: 25px
    }

    .input-email {
        padding: 8px 8px 8px 50px
    }

    .arrow-email > svg {
        width: 14px;
        height: 14px
    }

    .arrow-email {
        width: 36px;
        height: 36px
    }

    .text-unavailable-res {
        display: none
    }
}

@media (max-width: 390px) {
    .border-item-image-product {
        max-height: 55px;
        max-width: 55px
    }

    .card-price-description {
        grid-template-columns:repeat(1, 1fr)
    }

    .card-category {
        margin-bottom: 0
    }

    .height-list {
        max-height: 830px
    }

    .height-list-question {
        height: 380px
    }

    .icon-tool-image > a > svg, .icon-tool-image > svg {
        width: 17px;
        height: 17px;
        margin: 6px 0
    }

    .icon-share-modal i {
        font-size: 21px
    }

    .icon-share-modal {
        margin: 9px;
        height: 48px;
        width: 48px
    }
}

.highlight {
    outline: yellow solid 2px
}

@supports (-webkit-touch-callout:none) {
    .card-image-big > img {
        max-height: 300px
    }

    .border-item-image-product, .item-image-product img {
        max-height: 70px
    }

    .border-item-image-product, .card-image-big > img, .item-image-product img {
        object-fit: cover
    }
}

@media only screen and (device-aspect-ratio: 40/71) {
    .card-image-big > img {
        max-height: 300px
    }

    .border-item-image-product, .item-image-product img {
        max-height: 70px
    }

    .border-item-image-product, .card-image-big > img, .item-image-product img {
        object-fit: cover
    }
}
