@import url("../fonts/FontAwesome.Pro.6.4.0/css/all.css"); /* Using a url */

:root {
    --blue1: #00417A;
    --blue2: #005CA3;
    --blue3: #639CC9;
    --blue3: #C8D9E5;
    --CreamYellow1: #BF963A;
    --CreamYellow2: #E4A710;
    --CreamYellow3: #E6BE70;
    --Gray1: #313031;
    --Gray2: #57585A;
    --Gray3: #808184;
    --Gray4: #d3d3d3;
    --Gray5: #F4F4F4;
    --white: #fff;
    --TransparentBlack40: rgb(0 0 0 / 40%);
    --TransparentBlack30: rgb(0 0 0 / 30%);
    --TransparentBlack20: rgb(0 0 0 / 20%);
    --TransparentWhite40: rgba(255, 255, 255, 40%);
    --mdb-modal-zindex: 20000;
    --ds-third-level-nav-max-height: calc(100vh - var(--ds-header-height) - var(--header-info-height) - var(--ds-second-level-nav-height) - var(--ds-third-level-nav-bottom-safe-space));
}

.modal {
}

.fs-7 {
    font-size: 0.8rem !important
}

.fs-8 {
    font-size: 0.6rem !important
}

.serie-banner {
    overflow: hidden;
    position: relative;
    height: 45vh;
}

.serie-banner.user-account {
    overflow: hidden;
    position: relative;
    height: 38vh;
}

.details-artist-baner .serie-banner {
    height: auto;
}

@media ( min-width: 992px) {
    .details-artist-baner .serie-banner {
        height: 64vh;
    }

    .details-user-baner .serie-banner {
        height: 59vh;
    }
}

.serie-banner .content {
    position: absolute;
    left: 50%;
    top: 50%;
    -webkit-transform: translateY(-50%) translateX(-50%);
    -ms-transform: translateY(-50%) translateX(-50%);
    transform: translateY(-50%) translateX(-50%);
    z-index: 2;
}

.serie-banner .content h1 {
    color: var(--Gray5);
}

.serie-banner .background {
    object-fit: cover;
    width: 100%;
    height: 100%;
    display: block;
    position: absolute;
    z-index: 0;
    left: 0;
    top: 0;

}

.details-artist-baner .serie-banner .background, .details-user-baner .serie-banner .background {
    filter: grayscale(100%);
}

.details-artist-baner .serie-banner::before, .details-user-baner .serie-banner::before {
    background-color: var(--blue1);
}

.serie-banner::before {
    content: "";
    background-color: black;
    opacity: 0.5;
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 1;
}

.bg-primary {
    --mdb-bg-opacity: 1;
    background-color: var(--blue1) !important;
}

.bg-light {
    --mdb-bg-opacity: 1;
    background-color: var(--Gray5) !important;
}

.btn-outline-secondary {
    border-color: var(--Gray4);
    --mdb-btn-color: var(--Gray3);
    --mdb-btn-hover-bg: transparent;
    --mdb-btn-hover-color: var(--Gray2);
    --mdb-btn-focus-bg: transparent;
    --mdb-btn-focus-color: var(--Gray2);
    --mdb-btn-active-bg: transparent;
    --mdb-btn-active-color: var(--Gray2);
}

.btn-info {
    --mdb-btn-bg: var(--blue2);
    --mdb-btn-color: #fff;
    --mdb-btn-box-shadow: 0 4px 9px -4px var(--blue2);
    --mdb-btn-hover-bg: var(--blue2);
    --mdb-btn-hover-color: #fff;
    --mdb-btn-focus-bg: var(--blue2);
    --mdb-btn-focus-color: #fff;
    --mdb-btn-active-bg: var(--blue2);
    --mdb-btn-active-color: #fff;
}

.btn-check:focus + .btn-outline-secondary, .btn-check:focus-visible + .btn-outline-secondary, .btn-outline-secondary:first-child:hover, .btn-outline-secondary:focus, .btn-outline-secondary:focus-visible, .btn-outline-secondary:hover, :not(.btn-check) + .btn-outline-secondary:hover {
    border-color: var(--Gray2)
}

.svg_CreamYellow1 {
    fill: var(--CreamYellow1);
}

.svg_CreamYellow2 {
    fill: var(--CreamYellow2);
}

.svg_CreamYellow3 {
    fill: var(--CreamYellow3);
}

.svg_blue1 {
    fill: var(--blue1)
}

.svg_blue2 {
    fill: var(--blue2)
}

.svg_blue3 {
    fill: var(--blue3)
}

ont-face {
    font-family: Arial;
    size-adjust: 103%;
    src: local(Arial)
}

.btn-primary {
    --mdb-btn-bg: var(--CreamYellow1);
    --mdb-btn-color: var(--blue1);
    --mdb-btn-box-shadow: 0 4px 9px -4px var(--CreamYellow1);
    --mdb-btn-hover-bg: var(--CreamYellow2);
    --mdb-btn-hover-color: var(--blue2);
    --mdb-btn-focus-bg: var(--CreamYellow1);
    --mdb-btn-focus-color: var(--blue1);
    --mdb-btn-active-bg: var(--CreamYellow1);
    --mdb-btn-active-color: var(--blue1);
    font-weight: 600;
}

.btn-check:active + .btn-primary:hover, .btn-check:checked + .btn-primary:hover, .btn-primary.active:hover, .btn-primary.show:hover, .btn-primary:active:hover {
    background-color: var(--CreamYellow1);
}

.btn-primary:first-child:hover, .btn-primary:focus-visible, .btn-primary:hover, :not(.btn-check) + .btn-primary:hover {
    box-shadow: 0 8px 9px -4px rgba(255, 184, 51, 0.3), 0 4px 18px 0 rgba(255, 184, 51, 0.171)
}

@font-face {
    font-family: Montserrat-fallback;
    size-adjust: 113.4%;
    src: local("Arial")
}

@font-face {
    font-display: fallback;
    font-family: Montserrat;
    font-style: normal;
    font-weight: 400;
    src: url(../fonts/Montserrat-Regular.d73e9adb.woff2) format("woff2");
    unicode-range: u+00 ? ?, u+0131, u+0152 -0153, u+02 bb-02bc, u+02 c6, u+02 da, u+02 dc, u+2000 -206 f, u+2074, u+20 ac, u+2122, u+2191, u+2193, u+2212, u+2215, u+feff, u+fffd
}

@font-face {
    font-display: fallback;
    font-family: Montserrat;
    font-style: normal;
    font-weight: 600;
    src: url(../fonts/Montserrat-SemiBold.366d87b2.woff2) format("woff2");
    unicode-range: u+00 ? ?, u+0131, u+0152 -0153, u+02 bb-02bc, u+02 c6, u+02 da, u+02 dc, u+2000 -206 f, u+2074, u+20 ac, u+2122, u+2191, u+2193, u+2212, u+2215, u+feff, u+fffd
}

@font-face {
    font-display: fallback;
    font-family: Montserrat;
    font-style: normal;
    font-weight: 700;
    src: url(../fonts/Montserrat-Bold.c91913d8.woff2) format("woff2");
    unicode-range: u+00 ? ?, u+0131, u+0152 -0153, u+02 bb-02bc, u+02 c6, u+02 da, u+02 dc, u+2000 -206 f, u+2074, u+20 ac, u+2122, u+2191, u+2193, u+2212, u+2215, u+feff, u+fffd
}

body, html {

    font-family: Montserrat, Montserrat-fallback, Arial, sans-serif;

}

header .navbar {
    box-shadow: none;
}

header[dark-mode="true"] .navbar.hamburger_menu svg rect, header[dark-mode="true"] .close svg path {
    fill: var(--white);
}

header[dark-mode="false"] .navbar.hamburger_menu svg rect, header[dark-mode="false"] .close svg path {
    fill: var(--Gray1);
}

header[dark-mode="false"][floating-menu="true"] .navbar.hamburger_menu svg rect, header[dark-mode="false"][floating-menu="true"] .close svg path {

    fill: var(--white);
}

header[dark-mode="false"][floating-menu="true"][showmenu="true"] .navbar.hamburger_menu svg rect, header[dark-mode="false"][floating-menu="true"] .close svg path {

    fill: var(--Gray1);
}

header .navbar-dark .navbar-toggler-icon, header .navbar-light .navbar-toggler-icon {
    background-image: var(--mdb-navbar-toggler-icon-bg);
}

header .navbar .megamenu {
    padding: 0 1rem 1rem 1rem;
    position: fixed;
    left: 0;
    top: 182px;
    right: 0;
    bottom: 0;
}

header[dark-mode="false"] .logo .color1 {
    fill: var(--blue1);
}

header[dark-mode="false"] .logo .color2 {
    fill: var(--CreamYellow2);
}

header[dark-mode="true"] .logo .color1 {
    fill: var(--white);
}

header[dark-mode="true"] .logo .color2 {
    fill: var(--CreamYellow2);
}

header[dark-mode="true"] {
    background-color: var(--blue1);
}

header[Floating-Menu="false"][showmenu="true"] {
    z-index: 2000;
    position: relative;
}

header[dark-mode="true"][Floating-Menu="true"] {
    background-color: var(--TransparentBlack40);
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    backdrop-filter: blur(13px);
}

header[floating-menu="true"] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 100;

}

header[dark-mode=false][Floating-Menu=true] {
    background-color: #0000006b;
    color: #fff;
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(10px);
}

header[dark-mode=false][Floating-Menu=true] .logo .color1 {
    fill: var(--white);
}

header[dark-mode=false][Floating-Menu=true][showmenu=true] .logo .color1 {
    fill: var(--blue1);
}

header[dark-mode=false][Floating-Menu=true][showmenu=true] {
    background-color: #ffffff;
    /* z-index: 10000000; */
}

header[dark-mode=false][Floating-Menu=true][showmenu=true] .clickHint {
    top: 73px;
}

header[dark-mode=false][Floating-Menu=true][showmenu=true] a {
    color: var(--blue1);
}

header[dark-mode=false][Floating-Menu=true] a {
    color: #fff;
}

header[dark-mode="false"] {
    background-color: var(--white);
}

header[dark-mode="true"] .nav-link {

    font-weight: 400;
    color: var(--blue1);

}

header[dark-mode="false"] .nav-link {
    font-weight: 400;
    color: var(--blue2);
}

header[dark-mode="false"] .nav-link.dropdown-toggle.show {
    color: var(--CreamYellow1);
    font-weight: 600;

}

header .col-megamenu .list-inline a, header .col-megamenu .list-unstyled a {
    color: var(--Gray3);
}


header .nav-pills .nav-link.active, .nav-pills .show > .nav-link {
    --mdb-nav-pills-link-active-bg: var(
        --Gray4);
    --mdb-nav-pills-link-active-color: var(
        --blue1);
    font-weight: 600;
    border-radius: 30px;
}

header .nav-pills .nav-link {
    --mdb-nav-pills-link-hover-bg: #ffffff;
    font-weight: 600;
    padding: 0px 0px 0 19px;
}

header .logo .logo-mobile {
    width: 50px;
    height: 50px;
}

header .logo .logo-mobile {
    display: block;
}

header .logo .logo-pc {
    display: none;
}

header #main_nav:not(.show) {
    position: fixed;
    top: 77px;
    left: -100vh;
    margin: 0;
    padding: 0 15px;
    background: var(--blue1);
    opacity: 0;
    transition: all -100ms;
}

header #main_nav {
    position: fixed;
    height: 100vh;
    width: 100%;
    top: 77px;
    left: 0;
    right: 0;
    background: var(--blue1);
    margin: auto;
    padding: 0 0;
    opacity: 1;
    transition: all -100ms;
    display: flex;
    flex-direction: column;
}

header .navbar-nav.main-menu {
    display: inherit;
    flex-direction: inherit;
    width: 100%;
    margin: 0 0 0 0;
    padding: 15px 15px;
    overflow-x: auto;
}

header .navbar-nav.main-menu li {
    margin: 0 4px
}

header .navbar-nav.main-menu li a.nav-link {
    padding: 5.22px 12px;
    background-color: var(--blue3);
    border-radius: 18px;
}

header .nav-pills {
    overflow-y: auto;
    width: 100%;
}

header .level-3 {

    padding-top: 0;
}

header .level-2 {
    position: sticky;
    top: 0;
    right: -20px;
    left: -28px;
    z-index: 2;
    background-color: var(--white);
    box-shadow: #4c4c4c 1px 4px 6px -5px;
    margin-left: auto;
    margin-right: 1rem;
    margin-bottom: 1rem;
}

header .level-2.me-3 {
    margin-right: auto !important;
}

header .level-1 {

    -webkit-box-orient: vertical !important;

    -webkit-box-direction: normal !important;

    -ms-flex-direction: column !important;

    flex-direction: column !important;
}

.navbar-expand-lg .navbar-nav .dropdown-menu.megamenu {
    height: 73vh;
    min-height: 274px;
    overflow-y: auto;
}

header .navbar-nav {
    flex-direction: row;

}

header .col-megamenu .title {
    color: var(--CreamYellow2);
    background-color: var(--white);
    padding: 10px 0;
    font-weight: 600;
    top: 0;

}

header .more {
    background-color: var(--white);
    bottom: -16px;
}

.titel-bar {
    padding: 11px 0px 0px 0px;
    justify-content: center;
    align-items: center;
    gap: 12px;
    align-self: stretch;
}

.titel-bar > .des {
    font-size: 0.7rem;
    text-align: center;
}

.titel-bar .line hr {
    background-color: var(--CreamYellow1);
    border: none;
    height: 2px;
    opacity: 0.6;
}

;
.titel-bar .text {
}

.titel-bar .text h4 {
    color: var(--Gray2);
    text-align: center;
    font-family: Montserrat;
    font-style: normal;
    font-weight: 800;
    line-height: normal;
    text-transform: capitalize;
    font-size: 0.77rem;
    margin: 0;
}

.navbar-toggler:not(.collapsed) .close {
    display: block;
}

.navbar-toggler:not(.collapsed) .navbar {
    display: none;
}

.navbar-toggler .close {
    display: none;
}

.slider {

    position: relative;
    z-index: 1;
}

.slider .carousel-control-next, .slider .carousel-control-prev {
    z-index: 10;
}

.slider .form {
    position: absolute;
    top: 0;
    left: 0;


}

.from-content {
    position: relative;
    z-index: 2;
}

.form-slide-titel {
    color: var(--white, #FFF);
    font-size: 20px;
    font-family: Montserrat;
    font-style: normal;
    font-weight: 800;
    line-height: normal;
    position: relative;
    z-index: 2;
}

.form-slide-titel-2 {
    color: var(--white, #FFF);
    font-size: 12px;
    font-family: Montserrat;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    position: relative;
    z-index: 2;
}

.form-slider-parent {
    display: inline-flex;
    padding: 20px 0px;
    flex-direction: column;
    align-items: flex-start;
    gap: 37px;
    width: 100%;
}

.slider .items {
    list-style: none;
    padding: 0;
    height: 100%;
}

.slider .items .item .slide {
    height: 100%;
    position: relative;
}

.slider .items .item .slide::before {
    content: "";
    background-color: var(--TransparentBlack40);
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 10;
}

.slider .items .item {
    height: 100%;
}

.slider .items .item .slide img {
    width: 100%;
    height: 90vh;
    object-fit: cover;
    object-position: center center;

}

@media (min-width: 576px) {
    .slider .items .item .slide img {

        height: 85vh;


    }
}

/* =============== s;ider ================*/

.slider .artist {
    width: 236px;
    gap: 15.923px;
    border-radius: 6px;
    background: var(--black-40, rgba(0, 0, 0, 0.40));
    position: absolute;
    left: 50%;
    bottom: 3rem;
    z-index: 12;
    padding: 10px;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
}

.slider .artist .text1 {
    color: var(--white, #FFF);
    text-align: right;
    font-size: 11px;
    font-family: Montserrat;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
}

.slider .artist .price-titel {
    color: var(--white, #FFF);
    text-align: left;
    font-size: 10.615px;

    font-style: normal;
    font-weight: 400;
    line-height: normal;
}

.slider .artist .text2 {
    color: var(--white, #FFF);
    text-align: right;
    font-size: 10.615px;

    font-style: normal;
    font-weight: 400;
    line-height: normal;
}

.slider .artist .price {
    color: var(--white, #FFF);
    text-align: right;
    font-size: 11.942px;

    font-style: normal;
    font-weight: 700;
    line-height: normal;
}

.slider .artist .avatar {
    width: 58.385px;
    height: 58.385px;
}

.slider .artist .avatar img {
    width: 100%;
}

.slider-artist .artist {

    width: 200px;
}

.slider-artist .artist .img {
    width: 54px;
}

.slider-artist .score i {
    color: var(--CreamYellow1);
}

.slider-artist .carousel-control-prev {
    left: -138px;
    display: none;
}

.slider-artist .carousel-control-next {
    right: -138px;
    display: none;
}

.slider-artist .carousel-indicators {
    bottom: -62px;
}

.slider-artist
.baner {
    position: relative;
}

.baner .content-baner {
    position: relative;
    z-index: 2;
    height: 331px;
}

.baner .baner-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    bottom: 0;
    right: 0;
    height: 100%;
    object-fit: cover;
    z-index: 1;
}

.badg .text {
    color: var(--CreamYellow1);
    font-weight: 600;
}

.footer .titel, .footer .menu .phone {
    color: var(--CreamYellow1);
    font-weight: 600;
}

/* ============ desktop view ============ */
@media (min-width: 576px) {

    .slider .artist {
        width: 236px;
        gap: 15.923px;
        border-radius: 6px;
        background: var(--black-40, rgba(0, 0, 0, 0.40));
        position: absolute;
        left: 50%;
        right: initial;
        bottom: 3rem;
        z-index: 12;
        padding: 10px;
        -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        transform: translateX(-50%);
    }

    .form-slide-titel {
        color: var(--white, #FFF);
        font-size: 30px;
        font-family: Montserrat;
        font-style: normal;
        font-weight: 800;
        line-height: normal;
    }

    .form-slide-titel-2 {
        color: var(--white, #FFF);
        font-size: 17px;
        font-family: Montserrat;
        font-style: normal;
        font-weight: 600;
        line-height: normal;
    }
}

@media (min-width: 576px) and (orientation: landscape) {
    .slider {
        position: relative;
        z-index: 1;
    }
}

@media (min-width: 1200px) {
    .slider-artist .carousel-control-prev {
        left: -136px;
        display: block;
    }

    .slider-artist .carousel-control-next {
        right: -136px;
        display: block;
    }

    .titel-bar-parent {
        padding: 11px 0px 40px 0px;
    }

    .titel-bar > .des {
        font-size: 1rem;
        text-align: center;
    }

    .titel-bar {

        justify-content: center;
        align-items: center;
        gap: 20px;
        align-self: stretch;
    }

    .titel-bar .text h4 {
        font-size: 1.7rem;
        font-weight: 300;
    }

    .slider {
        sposition: relative;
        z-index: 1;
    }

    .slider .artist {
        width: 236px;
        gap: 15.923px;
        border-radius: 6px;
        background: var(--black-40, rgba(0, 0, 0, 0.40));
        position: absolute;
        right: 11rem;
        left: initial;
        bottom: 2rem;
        z-index: 12;
        padding: 10px;
        transform: initial;
        -ms-transform: initial;
        -webkit-transform: initial;
    }

}

@media (min-width: 992px) {
    .baner .content-baner {
        position: relative;
        z-index: 2;
        height: 442px;
    }

    .slider {
        position: relative;
        z-index: 1;
    }

    .form-slider-parent {
        display: inline-flex;
        padding: 20px 0px;
        flex-direction: column;
        align-items: flex-start;
        gap: 37px;
        width: 41%;
    }

    .form-slide-titel-2 {
        color: var(--white, #FFF);
        font-size: 32px;
        font-family: Montserrat;
        font-style: normal;
        font-weight: 600;
        line-height: normal;
    }

    .form-slide-titel {
        color: var(--white, #FFF);
        font-size: 40px;
        font-family: Montserrat;
        font-style: normal;
        font-weight: 800;
        line-height: normal;
    }

    header[showmenu="false"] .clickHint {
        display: none;
    }

    header[showmenu="true"] .clickHint {
        display: block;
        height: 100vh;
        min-height: 274px;
        overflow-y: auto;
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        z-index: -1;
        background: #00000026;
    }

    header[dark-mode="true"] .nav-link {

        font-weight: 400;
        color: var(--blue1);

    }

    header[dark-mode="true"][floating-menu="false"] .nav-link {

        font-weight: 400;
        color: var(--Gray5);

    }

    header.navbar.fixed-top .navbar-collapse, .navbar.sticky-top .navbar-collapse {
        overflow-y: auto;
        max-height: 90vh;
        margin-top: 10px;
    }

    .navbar-expand-lg .navbar-nav .dropdown-menu.megamenu {
        height: calc(100vh - 470px);
        min-height: 274px;
        overflow-y: auto;
    }

    header .nav-pills .nav-link {
        padding: 10px 15px;
    }

    header .nav-pills .nav-link.active, .nav-pills .show > .nav-link {
        border-radius: 0;
    }

    header .col-megamenu .title {
        color: var(--CreamYellow2);
        background-color: var(--white);
        padding: 10px 0;
        font-weight: 600;
        top: -1rem;

    }

    header .tabcontent {
        position: absolute;
        left: 0;
        right: 0;
        top: 0;
        bottom: 0; /* height: calc(100vh - 48vh); *//* min-height: 274px; */
    }

    header #main_nav {
        display: flex;
        flex-direction: row;
    }

    header .navbar-nav.main-menu li a.nav-link {
        padding: 0 12px;
        background-color: transparent;
        border-radius: 18px;
    }

    header .level-3 {
        padding-top: 0;
        padding-left: 15px;
        padding-right: 15px;
    }

    header .level-2 {
        position: initial;
        background-color: transparent;
        box-shadow: none;
        margin-bottom: 0;
        margin-left: auto;
    }

    header .navbar .megamenu {
        padding: 1rem;

    }

    header .level-1 {
        -ms-flex-wrap: wrap !important;
        flex-wrap: wrap !important;
        -webkit-box-orient: initial !important;
        -webkit-box-direction: initial !important;
        -ms-flex-direction: initial !important;
        flex-direction: initial !important;
    }

    header .nav-pills {
        overflow-y: initial;
        width: AUTO;
        border-right: solid 1px #c1c1c1;
    }

    header .navbar .megamenu {
        position: fixed !important;
        padding: 1rem;
        position: initial;
        left: 50%;
        right: 50%;
        top: 64px;
        bottom: initial;
        -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        transform: translateX(-50%);
    }

    header .navbar-nav.main-menu li {
        margin: 0 4px
    }

    header .navbar-nav.main-menu li a {
        padding: 6px 0;
        background-color: initial;
        border-radius: initial;
        display: block;
    }

    header .logo {
        width: 197px;
        height: 48px;
    }

    header .logo .logo-pc {
        display: block;
    }

    header .logo .logo-mobile {
        display: none;
    }

    header #main_nav:not(.show) {
        position: relative;
        top: initial;
        left: initial;
        margin: initial;
        padding: initial;
        background: initial;
        opacity: initial;
        transition: initial;
    }

    header #main_nav {
        position: relative;
        height: auto;
        width: inherit;
        top: initial;
        left: initial;
        right: initial;
        background: transparent;
        margin: 0;
        padding: 0 1rem;
        opacity: 1;
    }

    .navbar .has-megamenu {
        position: static !important;
    }

    .navbar .megamenu {
        left: 0;
        right: 0;
        width: 100%;
        margin-top: 0;
    }

    .navbar-expand-lg .navbar-nav .dropdown-menu {
    }
}


/* ============ card// ============ */
.adoruart_card.adoruart-artist.card {
    border: var(--Gray3) solid 1px;
}

.adoruart_card.adoruart-artist.card .artist-box {
    position: absolute;
    top: 50%;
    left: 0;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    z-index: 3;
}

.adoruart_card.adoruart-artist.card .artist-box .artist-data {

    padding: 1rem;
    background-color: #2424246b;
    color: #fff;
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(10px);
}

.adoruart_card.adoruart-artist.card .artist-box .artist-data .avatar {

}

.adoruart_card.adoruart-artist.card .artist-box .artist-data .avatar img {
    width: 90px;
}

.adoruart_card.adoruart-artist.card .artist-box .artist-data .text1 {

}

.adoruart_card.adoruart-artist.card .artist-box .artist-data .text2 {

}

.adoruart_card.adoruart-artist.card .artist-box .btn {

}

.adoruart_card.adoruart-artist.card .artist-box .btn-primary {
    background-color: var(--CreamYellow3);

}

.adoruart_card.adoruart-artist.card .artist-box .btn-primary:hover {
    background-color: var(--CreamYellow1);
}

.adoruart_card.adoruart-artist.card .artist-box .btn-primary.Followed {
    background-color: var(--white);
    box-shadow: none;
}

.adoruart_card.adoruart-artist.card .artist-box .btn-primary::after {
    content: "Followed";
}

.Follow {
    margin: auto;
    display: block;
}

.Follow:hover {
    margin: auto;
    background-color: var(--white);
    color: var(--blue1);
}

.Followed {
    background-color: var(--CreamYellow3);
    color: var(--blue1);
}

.Follow::after {
    content: "Followed";


}

.Followed.btn-outline-white {
    border: none;
}

.Followed::after {
    content: "follow";
}

.adoruart_card.adoruart-artist.card .artist-box .btn-primary.Followed::after {
    content: "followed";
}

.text-overflow {
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%;

}

.adoruart_card.card {
    position: relative;
    overflow: hidden;
    border-radius: 0;
}

.adoruart_card.card > a {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    display: block;
    z-index: 2;
}

.adoruart_card.card > .img {

}

.adoruart_card.card[type="c"] .img {

}

.adoruart_card.card > .wishlist {
    z-index: 3;
    right: 1rem;
    top: -3rem;
    width: 36px;
    height: 36px;
    border: none;
    border-radius: 50%;
    padding: 0;
    transition: all 0.3s;
    border: solid 1px rgb(0 0 0 / 24%);
}

.adoruart_card.card:hover > .wishlist {
    top: 1rem;
}

.adoruart_card.card > .wishlist > svg {
    width: 20px;
    height: 20px;

}

.adoruart_card.card > .wishlist > svg > path {

    stroke: black;
}

.adoruart_card.card > .wishlist[added="true"] > svg > .added {
    display: block;
}

.adoruart_card.card > .wishlist[added="false"] > svg > .added {
    display: none;
}

.adoruart_card.card {
    box-shadow: initial;
    width: auto;
}

.adoruart_card.card[type="b"] {
    display: flex;
    flex-direction: column;
}

.adoruart_card.card[type="c"] {
    display: flex;
    flex-direction: column;
    border: 2px solid var(--Gray2);
    padding: 0.8rem;
}

.adoruart_card.card[type="d"] {
    display: flex;
    flex-direction: inherit;
    flex-wrap: wrap !important;
    border: 2px solid var(--Gray2);
    padding: 0.8rem;
    gap: 1rem;
}

.adoruart_card.card[type="c"] > .img {
    overflow: hidden;
}

.adoruart_card.card[type="d"] > .img {
    overflow: hidden;
    flex: 0 0 auto;
    width: 50%;
}

.adoruart_card.card[type="b"]::before {
    content: '';
    display: block;
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.00) 30%, rgba(0, 0, 0, 0.8) 100%);
}

:root {
    --card-body: 100;
    --text1: 72
}

.adoruart_card.card[type="b"] > .card-body {
    flex: 0 0 auto;
    width: 100%;
    position: absolute;
    bottom: -64px;
    left: 0;
    right: 0;
    z-index: 2;
    padding: 0.8rem;

    transition: all 0.7s;

}

.adoruart_card.card[type="b"]:hover > .card-body {
    bottom: 0;
}

.adoruart_card.card[type="b"] > .card-body > .text1 {
    color: var(--white);

}

.adoruart_card.card[type="b"] > .card-body > .text2 {
    color: var(--white);

}

.adoruart_card.card[type="b"] > .card-body > .price > .product-card__price-original {
    color: var(--white);
}

.adoruart_card.card[type="b"]:hover > .card-body > .text2 {
    color: var(--white);
    display: block;
}

.adoruart_card.card[type="b"]:hover > .card-body > .price > .product-card__price-original {
    color: var(--white);
    display: block;
}


.adoruart_card.card[type="a"] {
    display: flex;
    flex-direction: column;
}

.adoruart_card.card[type="a"] > .img {
    flex: 0 0 auto;
    width: auto;
    width: auto;
    border: 0.3rem solid var(--Gray1);
    padding: 0.4rem;
    overflow: hidden;
    position: relative;
}

.adoruart_card.card[type="a"] > .image-group {

}

.adoruart_card.card[type="a"] > .image-group .img {

    height: 100%;
}

.adoruart_card.card[type="a"] > .image-group .img > img {

    width: 100%;

    object-fit: cover;

    height: 136px;
}

.adoruart_card.card[type="a"] > .img:before {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    border: 0.4rem solid #ffffff;
    position: absolute;
    z-index: 1;
    left: 0;
    top: 0;
}

.adoruart_card.card[type="a"] > .card-body {
    flex: 0 0 auto;
    width: 100%;
}

.adoruart_card.card[type="d"] > .card-body {
    padding: 0.4rem 0px;
    flex: 1 0 0%;
    flex-direction: column !important;
    display: flex !important;
}

.adoruart_card.card > .card-body {
    padding: 0.4rem 0px;
}

.adoruart_card.card[body="s"] > .card-body > .text1 {
    font-size: 0.9rem;
    font-weight: 600;
    line-height: 2rem;
    margin-bottom: -7px;
    transition: all 0.5s;
}

.adoruart_card.card[body="s"][type="c"] > .card-body > .text1 {
    max-width: inherit;
}

.adoruart_card.card:hover[body="s"] > .card-body > .text1 {
    color: var(--CreamYellow2);

}

.adoruart_card.card > .card-body > .text1 {
    font-weight: 600;
}

.adoruart_card.card > .card-body > .text2 {

}

.adoruart_card.card > .card-body > .text2 > i {
    font-style: normal;
}

.adoruart_card.card[body="s"] > .card-body > .text2 {
    font-size: 0.9rem;
    font-weight: normal;
    line-height: 2rem;
    margin-bottom: -2px;
    font-style: normal;
}

.adoruart_card.card > .card-body > .price {
    font-size: 0.9rem;
    margin-top: 6px;
    font-weight: 600;
}

.adoruart_card.card > .img > img {
    opacity: 1;
    overflow-clip-margin: content-box;
    overflow: clip;
    vertical-align: middle;
    margin-bottom: 0; /* background-color: #fafafa; */
    object-position: center center;
    transition: all 0.5s;
    object-fit: cover;
    scale: 1;
}

.adoruart_card.card:hover > .img > img {
    scale: 1.18;
}

.adoruart_card.card:hover > .img > img {
    object-fit: cover;
    object-position: center center;
}

.adoruart_card.card[fix-height="true"] > .img > img {
    height: auto;
    max-width: inherit;
    width: 100%;
}

@media (min-width: 480px) {

    .adoruart_card.card[body="s"] > .card-body > .text1 {
        max-width: 297px;
    }
}

.adoruart_card.card[fix-height="false"] > .img > img {

    height: auto;
    width: 100%;
}

/* ============ card .end// ============ */

/* ============ masonry-style ============ */
.grid {
    display: grid;
    grid-gap: 10px;
    grid-template-columns: repeat(auto-fill, minmax(350px, 1fr));
    grid-auto-rows: 20px;
}

/* ============ masonry-style .end// ============ */


/* ============ desktop view .end// ============ */
@media (min-width: 1400px) {
    .container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
        max-width: 100rem;
    }
}


/* ============ desktop view .end// ============ */
.adoruart_card.card.h-160[fix-height="true"] > .img > img {
    height: 160px;
    max-width: inherit;
}

.adoruart_card.card.h-170[fix-height="true"] > .img > img {
    height: 170px;
    max-width: inherit;
}

.adoruart_card.card.h-180[fix-height="true"] > .img > img {
    height: 180px;
    max-width: inherit;
}

.adoruart_card.card.h-190[fix-height="true"] > .img > img {
    height: 190px;
    max-width: inherit;
}

.adoruart_card.card.h-200[fix-height="true"] > .img > img {
    height: 200px;
    max-width: inherit;
}

.adoruart_card.card.h-210[fix-height="true"] > .img > img {
    height: 210px;
    max-width: inherit;
}

.adoruart_card.card.h-220[fix-height="true"] > .img > img {
    height: 220px;
    max-width: inherit;
}

.adoruart_card.card.h-230[fix-height="true"] > .img > img {
    height: 230px;
    max-width: inherit;
}

.adoruart_card.card.h-240[fix-height="true"] > .img > img {
    height: 240px;
    max-width: inherit;
}

.adoruart_card.card.h-250[fix-height="true"] > .img > img {
    height: 250px;
    max-width: inherit;
}

.adoruart_card.card.h-260[fix-height="true"] > .img > img {
    height: 260px;
    max-width: inherit;
}

.adoruart_card.card.h-270[fix-height="true"] > .img > img {
    height: 270px;
    max-width: inherit;
}

.adoruart_card.card.h-280[fix-height="true"] > .img > img {
    height: 280px;
    max-width: inherit;
}

.adoruart_card.card.h-290[fix-height="true"] > .img > img {
    height: 290px;
    max-width: inherit;
}

.adoruart_card.card.h-300[fix-height="true"] > .img > img {
    height: 300px;
    max-width: inherit;
}

.adoruart_card.card.h-310[fix-height="true"] > .img > img {
    height: 310px;
    max-width: inherit;
}

.adoruart_card.card.h-320[fix-height="true"] > .img > img {
    height: 320px;
    max-width: inherit;
}

.adoruart_card.card.h-330[fix-height="true"] > .img > img {
    height: 330px;
    max-width: inherit;
}

.adoruart_card.card.h-340[fix-height="true"] > .img > img {
    height: 340px;
    max-width: inherit;
}

.adoruart_card.card.h-350[fix-height="true"] > .img > img {
    height: 350px;
    max-width: inherit;
}

.adoruart_card.card.h-360[fix-height="true"] > .img > img {
    height: 360px;
    max-width: inherit;
}

.adoruart_card.card.h-370[fix-height="true"] > .img > img {
    height: 370px;
    max-width: inherit;
}

.adoruart_card.card.h-380[fix-height="true"] > .img > img {
    height: 380px;
    max-width: inherit;
}

.adoruart_card.card.h-390[fix-height="true"] > .img > img {
    height: 390px;
    max-width: inherit;
}

.adoruart_card.card.h-400[fix-height="true"] > .img > img {
    height: 400px;
    max-width: inherit;
}

.adoruart_card.card.h-410[fix-height="true"] > .img > img {
    height: 410px;
    max-width: inherit;
}

.adoruart_card.card.h-420[fix-height="true"] > .img > img {
    height: 420px;
    max-width: inherit;
}

.adoruart_card.card.h-440[fix-height="true"] > .img > img {
    height: 440px;
    max-width: inherit;
}

.adoruart_card.card.h-460[fix-height="true"] > .img > img {
    height: 460px;
    max-width: inherit;
}

.adoruart_card.card.h-480[fix-height="true"] > .img > img {
    height: 480px;
    max-width: inherit;
}

.adoruart_card.card.h-500[fix-height="true"] > .img > img {
    height: 500px;
    max-width: inherit;
}

.adoruart_card.card.h-520[fix-height="true"] > .img > img {
    height: 520px;
    max-width: inherit;
}

.adoruart_card.card.h-540[fix-height="true"] > .img > img {
    height: 540px;
    max-width: inherit;
}

.adoruart_card.card.h-560[fix-height="true"] > .img > img {
    height: 560px;
    max-width: inherit;
}

@media (min-width: 576px) {
    .adoruart_card.card.h-sm-160[fix-height="true"] > .img > img {
        height: 160px;
        max-width: inherit;
    }

    .adoruart_card.card.h-sm-170[fix-height="true"] > .img > img {
        height: 170px;
        max-width: inherit;
    }

    .adoruart_card.card.h-sm-180[fix-height="true"] > .img > img {
        height: 180px;
        max-width: inherit;
    }

    .adoruart_card.card.h-sm-190[fix-height="true"] > .img > img {
        height: 190px;
        max-width: inherit;
    }

    .adoruart_card.card.h-sm-200[fix-height="true"] > .img > img {
        height: 200px;
        max-width: inherit;
    }

    .adoruart_card.card.h-sm-210[fix-height="true"] > .img > img {
        height: 210px;
        max-width: inherit;
    }

    .adoruart_card.card.h-sm-220[fix-height="true"] > .img > img {
        height: 220px;
        max-width: inherit;
    }

    .adoruart_card.card.h-sm-230[fix-height="true"] > .img > img {
        height: 230px;
        max-width: inherit;
    }

    .adoruart_card.card.h-sm-240[fix-height="true"] > .img > img {
        height: 240px;
        max-width: inherit;
    }

    .adoruart_card.card.h-sm-250[fix-height="true"] > .img > img {
        height: 250px;
        max-width: inherit;
    }

    .adoruart_card.card.h-sm-260[fix-height="true"] > .img > img {
        height: 260px;
        max-width: inherit;
    }

    .adoruart_card.card.h-sm-270[fix-height="true"] > .img > img {
        height: 270px;
        max-width: inherit;
    }

    .adoruart_card.card.h-sm-280[fix-height="true"] > .img > img {
        height: 280px;
        max-width: inherit;
    }

    .adoruart_card.card.h-sm-290[fix-height="true"] > .img > img {
        height: 290px;
        max-width: inherit;
    }

    .adoruart_card.card.h-sm-300[fix-height="true"] > .img > img {
        height: 300px;
        max-width: inherit;
    }

    .adoruart_card.card.h-sm-310[fix-height="true"] > .img > img {
        height: 310px;
        max-width: inherit;
    }

    .adoruart_card.card.h-sm-320[fix-height="true"] > .img > img {
        height: 320px;
        max-width: inherit;
    }

    .adoruart_card.card.h-sm-330[fix-height="true"] > .img > img {
        height: 330px;
        max-width: inherit;
    }

    .adoruart_card.card.h-sm-340[fix-height="true"] > .img > img {
        height: 340px;
        max-width: inherit;
    }

    .adoruart_card.card.h-sm-350[fix-height="true"] > .img > img {
        height: 350px;
        max-width: inherit;
    }

    .adoruart_card.card.h-sm-360[fix-height="true"] > .img > img {
        height: 360px;
        max-width: inherit;
    }

    .adoruart_card.card.h-sm-370[fix-height="true"] > .img > img {
        height: 370px;
        max-width: inherit;
    }

    .adoruart_card.card.h-sm-380[fix-height="true"] > .img > img {
        height: 380px;
        max-width: inherit;
    }

    .adoruart_card.card.h-sm-390[fix-height="true"] > .img > img {
        height: 390px;
        max-width: inherit;
    }

    .adoruart_card.card.h-sm-400[fix-height="true"] > .img > img {
        height: 400px;
        max-width: inherit;
    }

    .adoruart_card.card.h-sm-410[fix-height="true"] > .img > img {
        height: 410px;
        max-width: inherit;
    }

    .adoruart_card.card.h-sm-420[fix-height="true"] > .img > img {
        height: 420px;
        max-width: inherit;
    }

    .adoruart_card.card.h-sm-440[fix-height="true"] > .img > img {
        height: 440px;
        max-width: inherit;
    }

    .adoruart_card.card.h-sm-460[fix-height="true"] > .img > img {
        height: 460px;
        max-width: inherit;
    }

    .adoruart_card.card.h-sm-480[fix-height="true"] > .img > img {
        height: 480px;
        max-width: inherit;
    }

    .adoruart_card.card.h-sm-500[fix-height="true"] > .img > img {
        height: 500px;
        max-width: inherit;
    }

    .adoruart_card.card.h-sm-520[fix-height="true"] > .img > img {
        height: 520px;
        max-width: inherit;
    }

    .adoruart_card.card.h-sm-540[fix-height="true"] > .img > img {
        height: 540px;
        max-width: inherit;
    }

    .adoruart_card.card.h-sm-560[fix-height="true"] > .img > img {
        height: 560px;
        max-width: inherit;
    }
}

@media (min-width: 768px) {

    .adoruart_card.card.h-md-160[fix-height="true"] > .img > img {
        height: 160px;
        max-width: inherit;
    }

    .adoruart_card.card.h-md-170[fix-height="true"] > .img > img {
        height: 170px;
        max-width: inherit;
    }

    .adoruart_card.card.h-md-180[fix-height="true"] > .img > img {
        height: 180px;
        max-width: inherit;
    }

    .adoruart_card.card.h-md-190[fix-height="true"] > .img > img {
        height: 190px;
        max-width: inherit;
    }

    .adoruart_card.card.h-md-200[fix-height="true"] > .img > img {
        height: 200px;
        max-width: inherit;
    }

    .adoruart_card.card.h-md-210[fix-height="true"] > .img > img {
        height: 210px;
        max-width: inherit;
    }

    .adoruart_card.card.h-md-220[fix-height="true"] > .img > img {
        height: 220px;
        max-width: inherit;
    }

    .adoruart_card.card.h-md-230[fix-height="true"] > .img > img {
        height: 230px;
        max-width: inherit;
    }

    .adoruart_card.card.h-md-240[fix-height="true"] > .img > img {
        height: 240px;
        max-width: inherit;
    }

    .adoruart_card.card.h-md-250[fix-height="true"] > .img > img {
        height: 250px;
        max-width: inherit;
    }

    .adoruart_card.card.h-md-260[fix-height="true"] > .img > img {
        height: 260px;
        max-width: inherit;
    }

    .adoruart_card.card.h-md-270[fix-height="true"] > .img > img {
        height: 270px;
        max-width: inherit;
    }

    .adoruart_card.card.h-md-280[fix-height="true"] > .img > img {
        height: 280px;
        max-width: inherit;
    }

    .adoruart_card.card.h-md-290[fix-height="true"] > .img > img {
        height: 290px;
        max-width: inherit;
    }

    .adoruart_card.card.h-md-300[fix-height="true"] > .img > img {
        height: 300px;
        max-width: inherit;
    }

    .adoruart_card.card.h-md-310[fix-height="true"] > .img > img {
        height: 310px;
        max-width: inherit;
    }

    .adoruart_card.card.h-md-320[fix-height="true"] > .img > img {
        height: 320px;
        max-width: inherit;
    }

    .adoruart_card.card.h-md-330[fix-height="true"] > .img > img {
        height: 330px;
        max-width: inherit;
    }

    .adoruart_card.card.h-md-340[fix-height="true"] > .img > img {
        height: 340px;
        max-width: inherit;
    }

    .adoruart_card.card.h-md-350[fix-height="true"] > .img > img {
        height: 350px;
        max-width: inherit;
    }

    .adoruart_card.card.h-md-360[fix-height="true"] > .img > img {
        height: 360px;
        max-width: inherit;
    }

    .adoruart_card.card.h-md-370[fix-height="true"] > .img > img {
        height: 370px;
        max-width: inherit;
    }

    .adoruart_card.card.h-md-380[fix-height="true"] > .img > img {
        height: 380px;
        max-width: inherit;
    }

    .adoruart_card.card.h-md-390[fix-height="true"] > .img > img {
        height: 390px;
        max-width: inherit;
    }

    .adoruart_card.card.h-md-400[fix-height="true"] > .img > img {
        height: 400px;
        max-width: inherit;
    }

    .adoruart_card.card.h-md-410[fix-height="true"] > .img > img {
        height: 410px;
        max-width: inherit;
    }

    .adoruart_card.card.h-md-420[fix-height="true"] > .img > img {
        height: 420px;
        max-width: inherit;
    }

    .adoruart_card.card.h-md-440[fix-height="true"] > .img > img {
        height: 440px;
        max-width: inherit;
    }

    .adoruart_card.card.h-md-460[fix-height="true"] > .img > img {
        height: 460px;
        max-width: inherit;
    }

    .adoruart_card.card.h-md-480[fix-height="true"] > .img > img {
        height: 480px;
        max-width: inherit;
    }

    .adoruart_card.card.h-md-500[fix-height="true"] > .img > img {
        height: 500px;
        max-width: inherit;
    }

    .adoruart_card.card.h-md-520[fix-height="true"] > .img > img {
        height: 520px;
        max-width: inherit;
    }

    .adoruart_card.card.h-md-540[fix-height="true"] > .img > img {
        height: 540px;
        max-width: inherit;
    }

    .adoruart_card.card.h-md-560[fix-height="true"] > .img > img {
        height: 560px;
        max-width: inherit;
    }
}

@media (min-width: 992px) {
    .adoruart_card.card.h-lg-160[fix-height="true"] > .img > img {
        height: 160px;
        max-width: inherit;
    }

    .adoruart_card.card.h-lg-170[fix-height="true"] > .img > img {
        height: 170px;
        max-width: inherit;
    }

    .adoruart_card.card.h-lg-180[fix-height="true"] > .img > img {
        height: 180px;
        max-width: inherit;
    }

    .adoruart_card.card.h-lg-190[fix-height="true"] > .img > img {
        height: 190px;
        max-width: inherit;
    }

    .adoruart_card.card.h-lg-200[fix-height="true"] > .img > img {
        height: 200px;
        max-width: inherit;
    }

    .adoruart_card.card.h-lg-210[fix-height="true"] > .img > img {
        height: 210px;
        max-width: inherit;
    }

    .adoruart_card.card.h-lg-220[fix-height="true"] > .img > img {
        height: 220px;
        max-width: inherit;
    }

    .adoruart_card.card.h-lg-230[fix-height="true"] > .img > img {
        height: 230px;
        max-width: inherit;
    }

    .adoruart_card.card.h-lg-240[fix-height="true"] > .img > img {
        height: 240px;
        max-width: inherit;
    }

    .adoruart_card.card.h-lg-250[fix-height="true"] > .img > img {
        height: 250px;
        max-width: inherit;
    }

    .adoruart_card.card.h-lg-260[fix-height="true"] > .img > img {
        height: 260px;
        max-width: inherit;
    }

    .adoruart_card.card.h-lg-270[fix-height="true"] > .img > img {
        height: 270px;
        max-width: inherit;
    }

    .adoruart_card.card.h-lg-280[fix-height="true"] > .img > img {
        height: 280px;
        max-width: inherit;
    }

    .adoruart_card.card.h-lg-290[fix-height="true"] > .img > img {
        height: 290px;
        max-width: inherit;
    }

    .adoruart_card.card.h-lg-300[fix-height="true"] > .img > img {
        height: 300px;
        max-width: inherit;
    }

    .adoruart_card.card.h-lg-310[fix-height="true"] > .img > img {
        height: 310px;
        max-width: inherit;
    }

    .adoruart_card.card.h-lg-320[fix-height="true"] > .img > img {
        height: 320px;
        max-width: inherit;
    }

    .adoruart_card.card.h-lg-330[fix-height="true"] > .img > img {
        height: 330px;
        max-width: inherit;
    }

    .adoruart_card.card.h-lg-340[fix-height="true"] > .img > img {
        height: 340px;
        max-width: inherit;
    }

    .adoruart_card.card.h-lg-350[fix-height="true"] > .img > img {
        height: 350px;
        max-width: inherit;
    }

    .adoruart_card.card.h-lg-360[fix-height="true"] > .img > img {
        height: 360px;
        max-width: inherit;
    }

    .adoruart_card.card.h-lg-370[fix-height="true"] > .img > img {
        height: 370px;
        max-width: inherit;
    }

    .adoruart_card.card.h-lg-380[fix-height="true"] > .img > img {
        height: 380px;
        max-width: inherit;
    }

    .adoruart_card.card.h-lg-390[fix-height="true"] > .img > img {
        height: 390px;
        max-width: inherit;
    }

    .adoruart_card.card.h-lg-400[fix-height="true"] > .img > img {
        height: 400px;
        max-width: inherit;
    }

    .adoruart_card.card.h-lg-410[fix-height="true"] > .img > img {
        height: 410px;
        max-width: inherit;
    }

    .adoruart_card.card.h-lg-420[fix-height="true"] > .img > img {
        height: 420px;
        max-width: inherit;
    }

    .adoruart_card.card.h-lg-440[fix-height="true"] > .img > img {
        height: 440px;
        max-width: inherit;
    }

    .adoruart_card.card.h-lg-460[fix-height="true"] > .img > img {
        height: 460px;
        max-width: inherit;
    }

    .adoruart_card.card.h-lg-480[fix-height="true"] > .img > img {
        height: 480px;
        max-width: inherit;
    }

    .adoruart_card.card.h-lg-500[fix-height="true"] > .img > img {
        height: 500px;
        max-width: inherit;
    }

    .adoruart_card.card.h-lg-520[fix-height="true"] > .img > img {
        height: 520px;
        max-width: inherit;
    }

    .adoruart_card.card.h-lg-540[fix-height="true"] > .img > img {
        height: 540px;
        max-width: inherit;
    }

    .adoruart_card.card.h-lg-560[fix-height="true"] > .img > img {
        height: 560px;
        max-width: inherit;
    }
}

@media (min-width: 1200px) {
    .adoruart_card.card.h-xl-160[fix-height="true"] > .img > img {
        height: 160px;
        max-width: inherit;
    }

    .adoruart_card.card.h-xl-170[fix-height="true"] > .img > img {
        height: 170px;
        max-width: inherit;
    }

    .adoruart_card.card.h-xl-180[fix-height="true"] > .img > img {
        height: 180px;
        max-width: inherit;
    }

    .adoruart_card.card.h-xl-190[fix-height="true"] > .img > img {
        height: 190px;
        max-width: inherit;
    }

    .adoruart_card.card.h-xl-200[fix-height="true"] > .img > img {
        height: 200px;
        max-width: inherit;
    }

    .adoruart_card.card.h-xl-210[fix-height="true"] > .img > img {
        height: 210px;
        max-width: inherit;
    }

    .adoruart_card.card.h-xl-220[fix-height="true"] > .img > img {
        height: 220px;
        max-width: inherit;
    }

    .adoruart_card.card.h-xl-230[fix-height="true"] > .img > img {
        height: 230px;
        max-width: inherit;
    }

    .adoruart_card.card.h-xl-240[fix-height="true"] > .img > img {
        height: 240px;
        max-width: inherit;
    }

    .adoruart_card.card.h-xl-250[fix-height="true"] > .img > img {
        height: 250px;
        max-width: inherit;
    }

    .adoruart_card.card.h-xl-260[fix-height="true"] > .img > img {
        height: 260px;
        max-width: inherit;
    }

    .adoruart_card.card.h-xl-270[fix-height="true"] > .img > img {
        height: 270px;
        max-width: inherit;
    }

    .adoruart_card.card.h-xl-280[fix-height="true"] > .img > img {
        height: 280px;
        max-width: inherit;
    }

    .adoruart_card.card.h-xl-290[fix-height="true"] > .img > img {
        height: 290px;
        max-width: inherit;
    }

    .adoruart_card.card.h-xl-300[fix-height="true"] > .img > img {
        height: 300px;
        max-width: inherit;
    }

    .adoruart_card.card.h-xl-310[fix-height="true"] > .img > img {
        height: 310px;
        max-width: inherit;
    }

    .adoruart_card.card.h-xl-320[fix-height="true"] > .img > img {
        height: 320px;
        max-width: inherit;
    }

    .adoruart_card.card.h-xl-330[fix-height="true"] > .img > img {
        height: 330px;
        max-width: inherit;
    }

    .adoruart_card.card.h-xl-340[fix-height="true"] > .img > img {
        height: 340px;
        max-width: inherit;
    }

    .adoruart_card.card.h-xl-350[fix-height="true"] > .img > img {
        height: 350px;
        max-width: inherit;
    }

    .adoruart_card.card.h-xl-360[fix-height="true"] > .img > img {
        height: 360px;
        max-width: inherit;
    }

    .adoruart_card.card.h-xl-370[fix-height="true"] > .img > img {
        height: 370px;
        max-width: inherit;
    }

    .adoruart_card.card.h-xl-380[fix-height="true"] > .img > img {
        height: 380px;
        max-width: inherit;
    }

    .adoruart_card.card.h-xl-390[fix-height="true"] > .img > img {
        height: 390px;
        max-width: inherit;
    }

    .adoruart_card.card.h-xl-400[fix-height="true"] > .img > img {
        height: 400px;
        max-width: inherit;
    }

    .adoruart_card.card.h-xl-410[fix-height="true"] > .img > img {
        height: 410px;
        max-width: inherit;
    }

    .adoruart_card.card.h-xl-420[fix-height="true"] > .img > img {
        height: 420px;
        max-width: inherit;
    }

    .adoruart_card.card.h-xl-440[fix-height="true"] > .img > img {
        height: 440px;
        max-width: inherit;
    }

    .adoruart_card.card.h-xl-460[fix-height="true"] > .img > img {
        height: 460px;
        max-width: inherit;
    }

    .adoruart_card.card.h-xl-480[fix-height="true"] > .img > img {
        height: 480px;
        max-width: inherit;
    }

    .adoruart_card.card.h-xl-500[fix-height="true"] > .img > img {
        height: 500px;
        max-width: inherit;
    }

    .adoruart_card.card.h-xl-520[fix-height="true"] > .img > img {
        height: 520px;
        max-width: inherit;
    }

    .adoruart_card.card.h-xl-540[fix-height="true"] > .img > img {
        height: 540px;
        max-width: inherit;
    }

    .adoruart_card.card.h-xl-560[fix-height="true"] > .img > img {
        height: 560px;
        max-width: inherit;
    }
}

/* ============ mobile view ============ */

/* ============ mobile view .end// ============ */

/*===================  details  =========================*/
.gallery-thumbs, .gallery-top {
    height: 70vh;
}

.gallery-thumbs .swiper-slide {
    box-sizing: border-box;
    cursor: pointer;
}

.gallery-thumbs .swiper-slide-active {
    border: 5px solid grey;
}

.gallery-thumbs .swiper-slide.swiper-slide-active img {
    opacity: 1 !important;
}

.gallery-thumbs .swiper-slide img {
    height: 100%;
    width: 100%;
    object-fit: cover;
    object-position: center center;
    display: block;
    margin: auto;
    opacity: 0.5;
}

.gallery-thumbs .swiper-slide:hover {
    border: 1px solid grey;
}

.gallery-top {


}

.gallery-top .swiper-slide {

    border: 1px solid grey;

}

.gallery-top .swiper-slide img {
    height: 100%;
    width: 100%;
    object-fit: cover;
    object-position: center center;
}

.swiper-slide {
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    width: 80px;
    height: 100%;
    position: relative;
    -webkit-transition-property: -webkit-transform;
    transition-property: -webkit-transform;
    -o-transition-property: transform;
    transition-property: transform;
    transition-property: transform, -webkit-transform;
}

@media ( min-width: 992px) {
    .gallery-top .swiper-slide img {
        height: 100%;
        width: 100%;
        object-fit: cover;
        object-position: center center;
        display: block;
        margin: auto;
    }

    .gallery-top .swiper-slide img swiper-slide-duplicate-active {

    }

    .swiper-slide {
        -webkit-flex-shrink: 0;
        -ms-flex-negative: 0;
        flex-shrink: 0;
        width: 100%;
        height: 100%;
        position: relative;
        -webkit-transition-property: -webkit-transform;
        transition-property: -webkit-transform;
        -o-transition-property: transform;
        transition-property: transform;
        transition-property: transform, -webkit-transform;
    }

}

.pswp--zoom-allowed .pswp__img {
    object-fit: cover;
    object-position: center;


}

/*
.pswp--zoom-allowed .pswp__img{
  object-fit: cover;
  object-position: center;
  width: 100% !important;
  height: 100% !important;

}
.pswp__container, .pswp__zoom-wrap{
  width: 70vh !important;
  height: 70vh !important;
  top: 50% !important;
  left: 50% !important;
  -webkit-transform: translateX(-50%) translateY(-50%)!important;
  -ms-transform: translateX(-50%) translateY(-50%)!important;
  transform: translateX(-50%) translateY(-50%)!important;
  right: unset !important;
  bottom: unset !important;

}
*/
.titel-details {
    color: var(--black, #3A3A3A);
    font-family: Montserrat;
    font-size: 36px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
}

.titel-artist {
    color: var(--blue, #005CA3);
    font-family: Montserrat;
    font-size: 0.8rem;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
}

.style {
    color: var(--gray, #7B7575);
    font-family: Montserrat;
    font-size: 0.8rem;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
}

.Dimensions span {
    color: var(--gray, #7B7575);
    font-family: Montserrat;
    font-size: 0.8rem;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
}

.icon {
    width: 32px;
    height: 32px;
    background-color: transparent;
    border: none;
    padding: 0;
    margin: 0;
}

.Estimated-value {
    color: var(--gray, #7B7575);
    font-family: Montserrat;
    font-size: 0.8rem;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
}

.Price {
    color: var(--black, #3A3A3A);
    font-family: Montserrat;
    font-size: 24px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
}

/*===================  End details  =========================*/
.chip {
    --mdb-chip-height: 32px;
    --mdb-chip-line-height: 2;
    --mdb-chip-padding-right: 12px;
    --mdb-chip-margin-y: 5px;
    --mdb-chip-margin-right: 1rem;
    --mdb-chip-font-size: 13px;
    --mdb-chip-font-weight: 400;
    --mdb-chip-font-color: #4f4f4f;
    --mdb-chip-bg: #eceff1;
    --mdb-chip-border-radius: 16px;
    --mdb-chip-transition-opacity: 0.3s linear;
    --mdb-chip-img-margin-right: 8px;
    --mdb-chip-img-margin-left: -12px;
    --mdb-chip-close-padding-left: 8px;
    --mdb-chip-close-font-size: 16px;
    --mdb-chip-close-opacity: 0.53;
    --mdb-chip-outline-border-width: 1px;
    --mdb-chip-md-height: 42px;
    --mdb-chip-md-br: 21px;
    --mdb-chip-lg-height: 52px;
    --mdb-chip-lg-br: 26px;
    --mdb-chip-contenteditable-border-width: 3px;
    --mdb-chip-contenteditable-border-color: #b2b3b4;
    --mdb-chip-icon-color: #afafaf;
    --mdb-chip-icon-transition: 0.2s ease-in-out;
    --mdb-chip-icon-hover-color: #8b8b8b;
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: var(--mdb-chip-height);
    line-height: var(--mdb-chip-line-height);
    padding: 0 var(--mdb-chip-padding-right);
    margin-top: var(--mdb-chip-margin-y);
    margin-bottom: var(--mdb-chip-margin-y);
    margin-right: var(--mdb-chip-margin-right);
    font-size: var(--mdb-chip-font-size);
    font-weight: var(--mdb-chip-font-weight);
    color: var(--mdb-chip-font-color);
    cursor: pointer;
    background-color: var(--mdb-chip-bg);
    border-radius: var(--mdb-chip-border-radius);
    transition: opacity var(--mdb-chip-transition-opacity);
    word-wrap: break-word;
    box-shadow: none;
    text-transform: none
}

.chip:hover {
    box-shadow: none !important
}

.chip:hover:not(.chip-outline) {
    background-color: var(--mdb-chip-bg);
    box-shadow: none !important
}

.chip.active, .chip:active {
    background-color: #cacfd1
}

.chip img {
    width: inherit;
    height: inherit;
    border-radius: 100%;
    margin: 0 var(--mdb-chip-img-margin-right) 0 var(--mdb-chip-img-margin-left)
}

.chip .close {
    float: right;
    padding-left: var(--mdb-chip-close-padding-left);
    font-size: var(--mdb-chip-close-font-size);
    opacity: var(--mdb-chip-close-opacity);
    cursor: pointer
}

.chip .close:hover {
    color: #332d2d
}

.chip .close-opacity {
    opacity: 0
}

.chip-outline {
    background: transparent;
    display: flex;
    justify-content: center;
    align-items: center;
    border-width: var(--mdb-chip-outline-border-width)
}

.chip.chip-md {
    height: var(--mdb-chip-md-height);
    border-radius: var(--mdb-chip-md-br)
}

.chip.chip-lg {
    height: var(--mdb-chip-lg-height);
    border-radius: var(--mdb-chip-lg-br)
}

.chip[contenteditable=true] {
    outline: none;
    border: var(--mdb-chip-contenteditable-border-width) solid var(--mdb-chip-contenteditable-border-color);
    background-color: #fff
}

.chip .far, .chip .fas {
    color: var(--mdb-chip-icon-color);
    transition: all var(--mdb-chip-icon-transition)
}

.chip .far:hover, .chip .fas:hover {
    color: var(--mdb-chip-icon-hover-color)
}

.chips {
    --mdb-chips-min-height: 45px;
    --mdb-chips-padding-bottom: 1rem;
    --mdb-chips-margin-bottom: 30px;
    --mdb-chips-transition: 0.3s ease;
    --mdb-chips-padding-padding: 5px;
    --mdb-chips-input-width: 150px;
    min-height: var(--mdb-chips-min-height);
    padding-bottom: var(--mdb-chips-padding-bottom);
    margin-bottom: var(--mdb-chips-margin-bottom);
    border: none;
    outline: none;
    box-shadow: none
}

.chips, .chips-transition {
    transition: all var(--mdb-chips-transition)
}

.chips-padding {
    padding: var(--mdb-chips-padding-padding)
}

.chips:hover {
    cursor: text
}

.chips .tag.selected {
    color: #fff
}

.chips-initial, .chips-placeholder {
    margin-bottom: 0;
    padding-bottom: 0
}

.chips-initial .chips-input-wrapper, .chips-placeholder .chips-input-wrapper {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    transition: all var(--mdb-chips-transition)
}

.chips-initial .chips-input-wrapper input, .chips-placeholder .chips-input-wrapper input {
    width: var(--mdb-chips-input-width) !important
}

.chip-opacity {
    opacity: 0
}

.form-control.chips-input.active {
    box-shadow: none
}

.FilterSide .accordion-item {
    border-right: none;
    border-left: none;
    position: sticky;
    top: 75px;
    background-color: white;
    z-index: 3;
}

.FilterSide .accordion-item:first-of-type {
    border-top: none;

}

.FilterSide .accordion-item:last-of-type {
    border-bottom: none;
}

.FilterSide .accordion-button, .FilterSide .accordion-body {
    padding-left: 0;
    padding-right: 0;
    color: var(--Gray1);

}

.accordion-header .accordion-button {
    color: var(--Gray1);
    font-weight: 800;
    font-size: 1rem;
}

.FilterSide .form-check {
    margin-bottom: 1rem;
}

/*++++++++++++++++++++++++++++++++++++++++++++*/
.range_container {
    display: flex;
    flex-direction: column;
    width: 100%;
    margin: 0 auto;
}

.sliders_control {
    position: relative;
    min-height: 50px;
}

.form_control {
    position: relative;
    display: flex;
    justify-content: space-between;
    font-size: 24px;
    color: #635a5a;
}

input[type=range]::-webkit-slider-thumb {
    -webkit-appearance: none;
    pointer-events: all;
    width: 24px;
    height: 24px;
    background-color: #fff;
    border-radius: 50%;
    box-shadow: 0 0 0 1px #C6C6C6;
    cursor: pointer;
}

input[type=range]::-moz-range-thumb {
    -webkit-appearance: none;
    pointer-events: all;
    width: 24px;
    height: 24px;
    background-color: #fff;
    border-radius: 50%;
    box-shadow: 0 0 0 1px #C6C6C6;
    cursor: pointer;
}

input[type=range]::-webkit-slider-thumb:hover {
    background: #f7f7f7;
}

input[type=range]::-webkit-slider-thumb:active {
    box-shadow: inset 0 0 3px #387bbe, 0 0 9px #387bbe;
    -webkit-box-shadow: inset 0 0 3px #387bbe, 0 0 9px #387bbe;
}

input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
    opacity: 1;
}

input[type="range"] {
    -webkit-appearance: none;
    appearance: none;
    height: 2px;
    width: 100%;
    position: absolute;
    background-color: #C6C6C6;
    pointer-events: none;
}

#fromSlider {
    height: 0;
    z-index: 1;
}


.slider {

}

.range-slider {

    text-align: center;
    position: relative;
    padding-bottom: 20px;
}

.range-slider .rangeValues {
    padding: 1rem 0;
    font-size: 14px;
    font-weight: 600;
    color: var(--Gray3);
}

.range-slider .rangeValues span {
    padding: 1rem 0;
    font-size: 0.9rem;
    font-weight: 800;
    color: var(--Gray1);
}

input[type=range] {
    -webkit-appearance: none;
    width: 100%;
    position: absolute;
    background-color: #00417A;
    left: 0;
}

input[type=range]::-webkit-slider-runnable-track {
    width: 100%;
    height: 5px;
    background: #ddd;
    border: none;
    border-radius: 3px;
}

input[type=range]:focus::-webkit-slider-thumb {

}

input[type="range"]:active::-webkit-slider-thumb {
    box-shadow: 0 0 20px -1px var(--CreamYellow1);
    background-color: var(--CreamYellow1);
    opacity: 1;
}

input[type=range]::-webkit-slider-thumb {
    -webkit-appearance: none;
    border: none;
    height: 18px;
    width: 18px;
    border-radius: 50%;
    background: var(--CreamYellow1);
    margin-top: -6px;
    cursor: pointer;
    position: relative;
    z-index: 1;
}

input[type=range]:focus {
    outline: none;
}

input[type=range]:focus::-webkit-slider-runnable-track {
    background: #ccc;
}


/*The following CSS code is not necessary for everyone*/

input[type=range]::-moz-range-track {
    width: 100%;
    height: 5px;
    background: #ddd;
    border: none;
    border-radius: 3px;
}

input[type=range]::-moz-range-thumb {
    border: none;
    height: 16px;
    width: 16px;
    border-radius: 50%;
    background: var(--CreamYellow1);
}

/*hide the outline behind the border*/
input[type=range]:-moz-focusring {
    outline: 1px solid white;
    outline-offset: -1px;
}

input[type=range]::-ms-track {
    width: 100%;
    height: 5px;
    /*remove bg colour from the track, we'll use ms-fill-lower and ms-fill-upper instead */
    background: transparent;
    /*leave room for the larger thumb to overflow with a transparent border */
    border-color: transparent;
    border-width: 6px 0;
    /*remove default tick marks*/
    color: transparent;
    z-index: -4;
}

input[type=range]::-ms-fill-lower {
    background: #777;
    border-radius: 10px;
}

input[type=range]::-ms-fill-upper {
    background: #ddd;
    border-radius: 10px;
}

input[type=range]::-ms-thumb {
    border: none;
    height: 16px;
    width: 16px;
    border-radius: 50%;
    background: var(--CreamYellow1);
}

input[type=range]:focus::-ms-fill-lower {
    background: #888;
}

input[type=range]:focus::-ms-fill-upper {
    background: #ccc;
}

.Height-Reng span, .Height-Reng span {
    font-weight: 600;
    font-size: 0.8rem;
}

.form-buttons-list__options {

}

.form-buttons-list__options .form-buttons-list__option {

}

.form-buttons-list__options .form-buttons-list__option > .form-buttons-list__input {
    display: none;
}

.form-buttons-list__options .form-buttons-list__option > .form-buttons-list__label {
    width: 50px;
    height: 50px;
    border-radius: 5px;
    border: var(--Gray4) solid 1px;
    position: relative;
}

.form-buttons-list__options .form-buttons-list__option > .form-buttons-list__label__colos {
    width: 25px;
    height: 25px;
    border-radius: 25px;
    border: var(--Gray4) solid 1px;
    position: relative;
}

.form-buttons-list__options .form-buttons-list__option > .form-buttons-list__input:checked + .form-buttons-list__label {
    background-color: var(--CreamYellow3);
    border-color: var(--CreamYellow1);

}

.form-buttons-list__options .form-buttons-list__option > .form-buttons-list__input:checked + .form-buttons-list__label__colos {
    background-color: var(--white);
    border-color: var(--Gray3);
    transition: all 0.5s;
}

.form-buttons-list__options .form-buttons-list__option > .form-buttons-list__label .form-buttons-list__button {

    margin-bottom: 0;
    margin-top: 0;

    position: absolute;
    left: 50%;
    top: 50%;
    transform: translateX(-50%) translateY(-50%);

}

.form-buttons-list__options .form-buttons-list__option > .form-buttons-list__label__colos .form-buttons-list__button {
    margin-bottom: 0;
    margin-top: 0;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translateX(-50%) translateY(-50%);
    width: 100%;
    height: 100%;
    display: block;
    border-radius: 100%;
    transition: all 0.5s;
}

.form-buttons-list__options .form-buttons-list__option > .form-buttons-list__label .form-buttons-list__button svg rect {
    fill: var(--Gray4);
    fill-opacity: 1;
}

.form-buttons-list__options .form-buttons-list__option > .form-buttons-list__input:checked + .form-buttons-list__label .form-buttons-list__button svg rect {
    fill: var(--white);
    fill-opacity: 1;
}

.form-buttons-list__options .form-buttons-list__option > .form-buttons-list__input:checked + .form-buttons-list__label__colos .form-buttons-list__button {
    width: 70%;
    height: 70%;
    display: block;
}

#filterlist {
    list-style: none;
    padding: 0;
    margin: 0;
}

#filterlist li {
    margin-bottom: 1rem;
    background-color: var(--Gray4);
    border: 6px;
    width: 100%;
    height: auto;
    padding: 0.6rem 1.2rem;
    text-align: left;
    transition: all 0.4s;
    border-radius: 0.3rem;
    border: var(--Gray4) solid 1px;
    cursor: pointer;
    position: relative;
}

#filterlist li:hover, #filterlist li:focus, #filterlist li:active {
    background-color: var(--Gray5);
    border: var(--Gray4) solid 1px;
}

#filterlist li::after {
    content: "";
    margin-left: 1rem;
    display: inline-block;
    background-image: url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%3E%3Cpath%20d%3D%22M13.4099%2012.0002L17.7099%207.71019C17.8982%207.52188%2018.004%207.26649%2018.004%207.00019C18.004%206.73388%2017.8982%206.47849%2017.7099%206.29019C17.5216%206.10188%2017.2662%205.99609%2016.9999%205.99609C16.7336%205.99609%2016.4782%206.10188%2016.2899%206.29019L11.9999%2010.5902L7.70994%206.29019C7.52164%206.10188%207.26624%205.99609%206.99994%205.99609C6.73364%205.99609%206.47824%206.10188%206.28994%206.29019C6.10164%206.47849%205.99585%206.73388%205.99585%207.00019C5.99585%207.26649%206.10164%207.52188%206.28994%207.71019L10.5899%2012.0002L6.28994%2016.2902C6.19621%2016.3831%206.12182%2016.4937%206.07105%2016.6156C6.02028%2016.7375%205.99414%2016.8682%205.99414%2017.0002C5.99414%2017.1322%206.02028%2017.2629%206.07105%2017.3848C6.12182%2017.5066%206.19621%2017.6172%206.28994%2017.7102C6.3829%2017.8039%206.4935%2017.8783%206.61536%2017.9291C6.73722%2017.9798%206.86793%2018.006%206.99994%2018.006C7.13195%2018.006%207.26266%2017.9798%207.38452%2017.9291C7.50638%2017.8783%207.61698%2017.8039%207.70994%2017.7102L11.9999%2013.4102L16.2899%2017.7102C16.3829%2017.8039%2016.4935%2017.8783%2016.6154%2017.9291C16.7372%2017.9798%2016.8679%2018.006%2016.9999%2018.006C17.132%2018.006%2017.2627%2017.9798%2017.3845%2017.9291C17.5064%2017.8783%2017.617%2017.8039%2017.7099%2017.7102C17.8037%2017.6172%2017.8781%2017.5066%2017.9288%2017.3848C17.9796%2017.2629%2018.0057%2017.1322%2018.0057%2017.0002C18.0057%2016.8682%2017.9796%2016.7375%2017.9288%2016.6156C17.8781%2016.4937%2017.8037%2016.3831%2017.7099%2016.2902L13.4099%2012.0002Z%22%20fill%3D%22%233A3A3A%22%2F%3E%3C%2Fsvg%3E);
    background-repeat: no-repeat no-repeat;
    background-position: center center;
    background-size: cover;
    width: 24px;
    height: 24px;
    vertical-align: middle;
    POSITION: ABSOLUTE;
    right: 1.2rem;
}

.abute-page {

}

.abute-page summary {
    font-size: 0.8rem;
    margin: 0;
}

.abute-page p {
    font-size: 0.7rem;
    text-align: left;
    font-weight: 100;
    margin-top: 1rem;
}

@media ( min-width: 992px) {
    .abute-page {

    }

    .abute-page summary {
        font-size: 1.1rem;
    }

    .abute-page p {
        font-size: 1rem;
        text-align: left;
        font-weight: 100;
    }

}

.show-cat {
    background-color: var(--Gray5);

}

.filter-artists .col {
    position: relative;
}

.filter-artists .form-control {
    padding-right: 3rem;
}

.filter-artists .form-control, .filter-artists .form-select {
    border-color: var(--blue2);
}

.filter-artists .form-select option:checked {
    color: var(--blue);
}

.filter-artists .form-select {
    color: var(--blue1);
}

.search-box button[type="submit"] {
    border: none;
    background-color: transparent;
    position: absolute;
    right: 0;
    bottom: 0.3rem;
}

@media (min-width: 992px) {
    .filter-artists button[type="submit"] {
        border: none;
        background-color: transparent;
        position: absolute;
        right: 0;
        bottom: 0.3rem;
    }
}

.carousel {
    height: 200px;
}

.carousel-cell.carousel-cell-artist {

    height: 100%;
    counter-increment: carousel-cell;
}

.carousel-cell.carousel-cell-artist.is-expanded {
}

/* cell number */

.carousel.is-fullscreen .carousel-cell.carousel-cell-artist {
    height: 100%;
}

.carousel-cell.carousel-cell-artist .adoruart_card.card.h-230[fix-height="true"] > .img > img {
    height: 100%;
}

.carousel-cell.carousel-cell-artist .adoruart_card.card[type="b"] > .card-body {
    flex: 0 0 auto;
    width: 100%;
    position: absolute;
    bottom: -38px;
    left: 0;
    right: 0;
    z-index: 2;
    padding: 0.8rem;
    transition: all 0.7s;
}

.carousel-cell.carousel-cell-artist .adoruart_card.card[body="s"] > .card-body > .text1 {
    font-size: 1rem;
    font-weight: 600;
    line-height: 2rem;
    margin-bottom: -7px;
    transition: all 0.5s;
}

.carousel-cell.carousel-cell-artist .adoruart_card.card[type="b"] {
    height: 100%;
}

@media (min-width: 992px) {
    .carousel-cell.carousel-cell-artist .adoruart_card.card[body="s"] > .card-body > .text1 {
        font-size: 2rem;
    }

    .carousel {
        height: 320px;
    }
}

.filter-bar {
    position: sticky;
    top: 72px;
    z-index: 6;
    background-color: rgba(255, 255, 255, 0.658);
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(10px);
}

@media (min-width: 992px) {
    .lg-collapse-show {
        display: block !important;
    }

    .filter-bar {
        position: sticky;
        top: 72px;
        z-index: 6;
        background-color: rgba(255, 255, 255, 0.658);
        backdrop-filter: blur(18px);
        -webkit-backdrop-filter: blur(10px);
    }
}

.details-artist-baner .serie-banner::before, .details-user-baner .serie-banner::before {
    background-color: #00417A !important;
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(10px);
    opacity: 1;
}

.details-artist-baner .avatar img, .details-user-baner .avatar img {
    width: 100%;
}

.details-artist-baner .avatar, .details-user-baner .avatar {
    width: 60px;
    height: 60px;
    margin: auto;
}

.details-artist-baner .artist-name, .details-user-baner .artist-name {
    font-size: 1.2rem;
    color: var(--white);
    font-weight: bolder;
}

.details-artist-baner .artist-job-position, .details-user-baner .artist-job-position {
    font-size: 0.9rem;
    color: var(--white);
}

.details-artist-baner .artist-location, .details-user-baner .artist-location {
    font-size: 0.8rem;
    color: var(--CreamYellow1);
}

.details-artist-baner .serie-banner .content, .details-user-baner .serie-banner .content {
    position: relative;
    top: inherit;
    left: 0;
    transform: initial;
    padding: 6rem 0;
}

.details-artist-baner .Follow, .details-user-baner .Follow {
    margin: 0;
    display: block;
}

.details-artist-baner .Follow:hover, .details-user-baner .Follow:hover {
    margin: auto;
    background-color: var(--white);
    color: var(--blue1);
}

.details-artist-baner .Followed, .details-user-baner .Followed {
    background-color: var(--CreamYellow3);
    color: var(--blue1);
    font-size: 0.7rem;
    font-weight: 800;
}

.details-artist-baner .statistics, .details-user-baner .statistics {
    width: 300px;
    margin: auto;
    color: var(--white);
}

.details-artist-baner .statistics .text1, .details-user-baner .statistics .text1 {
    font-size: 0.9rem;
}

.details-artist-baner .statistics .text2, .details-user-baner .statistics .text2 {
    font-size: 0.7rem;
}

@media (min-width: 992px) {
    .details-artist-baner .statistics .text1, .details-user-baner .statistics .text1 {
        font-size: 1.1rem;
        color: var(--CreamYellow1);
        text-shadow: var(--blue1) 0px 1px 3px;
    }

    .details-artist-baner .statistics .text2, .details-user-baner .statistics .text2 {
        font-size: 0.9rem;
    }

    .details-artist-baner .Follow, .details-user-baner .Follow {
        margin: auto;
        display: block;
    }

    .details-artist-baner .Follow:hover, .details-user-baner .Follow:hover {
        margin: auto;
        background-color: var(--white);
        color: var(--blue1);
    }

    .details-artist-baner .Followed, .details-user-baner .Followed {
        background-color: var(--CreamYellow3);
        color: var(--blue1);
    }

    .details-artist-baner .serie-banner .content, .details-user-baner .serie-banner .content {
        position: absolute;
        left: 50%;
        top: 50%;
        -webkit-transform: translateY(-50%) translateX(-50%);
        -ms-transform: translateY(-50%) translateX(-50%);
        transform: translateY(-50%) translateX(-50%);
        z-index: 2;
        padding: 0;
    }

    .details-artist-baner .artist-name, .details-user-baner .artist-name {
        font-size: 2.4rem;
        color: var(--white);
        font-weight: bolder;
    }

    .details-artist-baner .artist-job-position, .details-user-baner .artist-job-position {
        font-size: 1rem;
        color: var(--white);
    }

    .details-artist-baner .artist-location, .details-user-baner .artist-location {
        font-size: 1rem;
        color: var(--white);
    }

    .details-artist-baner .avatar, .details-user-baner .avatar {
        width: 130px;
        height: 130px;
        margin: auto;
    }
}

.menu-details-artist {
    overflow-y: auto;
}

.menu-details-artist ul {
    list-style: none;
}

.artist-menu-bar {
    margin-top: -4.8rem;
    position: relative;
    z-index: 5;
    background-color: var(--TransparentBlack40);
}

.artist-menu-bar .nav-tabs .nav-link {
    color: var(--white);
    border-radius: 50px;
    background-color: var(--TransparentBlack40);
    font-family: inherit;
    font-weight: 600;
    border: none;
}

.artist-menu-bar .nav-tabs .nav-link:hover {
    color: var(--blue1);
    background-color: var(--white)
}

.artist-menu-bar .nav-tabs .nav-link.active {
    color: var(--blue1);
    background-color: var(--white);
}

.body-about {
    width: 100%;
    margin: auto;
}

.Credentials-box {
    width: 100%;
}

#Credentials .accordion-button {
    font-size: 0.8rem;
}

#Credentials .accordion-body {
    font-size: 0.7rem;
}

@media (min-width: 992px) {
    #Credentials .accordion-button {
        font-size: 1rem;
    }

    #Credentials .accordion-body {
        font-size: 0.9rem;
    }

    .body-about {
        width: 75%;
    }

    .artist-menu-bar {
        margin-top: -4.9rem;
        position: relative;
        z-index: 5;
        background-color: var(--TransparentBlack40);
        overflow: hidden;
    }

    .Credentials-box {
        width: 70%;
    }
}

.artist-bio__quote {
    font-weight: 900;
}

.application-alert {
    background-color: var(--Gray5);
}

.application-alert__title {
    color: var(--CreamYellow1, #936E2F);
    text-align: center;
    font-family: Montserrat;
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
}

.alarm-icon {
    width: 64px;
    height: 64px;
    margin: auto;
}

.badg.application .text {
    color: var(--Gray2);
    font-weight: normal;
}

.baner-ads-1 {
    height: 592px;
    background: var(--blue4, #C8D9E5);
    background-image: url(../img/baners/baner-application.png);
    background-position: top left;
    background-repeat: no-repeat;
    position: relative;
    width: 100%;
    margin: auto;
}

.baner-ads-1 .text-baner {
    border-radius: 15px 0px 0px 15px;
    border-top: 1px solid var(--blue4, #C8D9E5);
    border-bottom: 1px solid var(--blue4, #C8D9E5);
    border-left: 1px solid var(--blue4, #C8D9E5);
    background: var(--white, #FFF);
    color: var(--blue2, #00417A);

    font-weight: 800;
    position: absolute;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
    width: 40%;
    padding: 3rem;
}

.wizard {
    position: relative;
}

@media (min-width: 992px) {
    .wizard::before {
        content: "";
        position: absolute;
        width: 100%;
        border-top: solid 1px var(--Gray4);
        top: 40px;
        z-index: -1;
    }
}


.nav-item.hide {
    position: absolute;
    top: -100px;
}


.nav[mpbile=true] {

}

.nav[mpbile=true] .nav-item {
    --mdb-nav-tabs-border-width: 1px;
    --mdb-nav-tabs-border-color: #e0e0e0;
    --mdb-nav-tabs-border-radius: 0.25rem;
    --mdb-nav-tabs-link-hover-border-color: #eee #eee #e0e0e0;
    --mdb-nav-tabs-link-active-color: #3b71ca;
    --mdb-nav-tabs-link-active-bg: #fff;
    --mdb-nav-tabs-link-active-border-color: #3b71ca;
    border-bottom: var(--mdb-nav-tabs-border-width) solid var(--mdb-nav-tabs-border-color);
}

.nav[mpbile=true] .nav-item .nav-link {
    width: 100%;
    text-align: left;
}

.nav[mpbile=true] .nav-link {
    border: none;
    background-color: transparent;
    padding: 0.8rem 0;
    color: var(--Gray1);
}

nav.navbar .nav-link {
    border: none;
    background-color: transparent;
}

.tab-pane[mobile="true"] {
    position: fixed;
    height: 100vh;
    width: 100%;
    top: 0;
    left: 0;
    z-index: 347;
    background-color: #ffffff;
}

.disable-scroll {
    overflow: hidden;
    height: 100vh;
}

.tab-pane-user > .row > .mobile-nav-body {
    position: sticky;
    top: 0;
    z-index: 100;
}

.tab-pane-user > .row {
    height: 100vh;
    overflow-y: auto;
}

@media (min-width: 992px) {
    .tab-pane-user > .row {
        height: auto;
        overflow-y: inherit;
    }

    .tab-pane[mobile="true"] {
        position: relative;
        height: auto;
        width: initial;
        top: initial;
        left: initial;
        z-index: initial;
        background-color: transparent;
    }
}

.user-nav {
    overflow-x: auto;
    overflow-y: hidden;
    position: sticky;
    top: 42px;
    z-index: 200;
    background-color: var(--mdb-body-bg);
}

@media (min-width: 992px) {
    .user-nav {
        overflow-x: auto;
        overflow-y: hidden;
        position: relative;
        top: auto;
        z-index: initial;

    }
}

.user-nav::before {
    content: "";
    display: block;
    border-bottom: solid 4px var(--Gray5);
    width: 100%;
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: -1;
}

.user-nav.nav-tabs .nav-link {
    font-weight: 800;
}

.user-nav.nav-tabs .nav-link.active {
    border-bottom-width: 5px;
    border-color: var(--blue1);
}

.more-shop {
    width: 100%;
    height: 150px;
    background-color: var(--blue3);
    position: relative;

}

@media (min-width: 992px) {
    .more-shop {
        width: 150px;
        height: 100%;
        background-color: var(--blue3);
        position: relative;

    }
}

.more-shop span {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translateX(-50%) translateY(-50%);
    font-size: 1.5rem;
    font-weight: 900;
}

.btn-outline-primary {
    --mdb-btn-bg: transparent;
    --mdb-btn-color: var(--blue1);
    --mdb-btn-hover-bg: transparent;
    --mdb-btn-hover-color: var(--blue2);
    --mdb-btn-focus-bg: transparent;
    --mdb-btn-focus-color: var(--blue2);
    --mdb-btn-active-bg: transparent;
    --mdb-btn-active-color: var(--blue1);
    --mdb-btn-border-color: var(--blue2);
    --mdb-btn-focus-border-color: var(--blue2);
    --mdb-btn-hover-border-color: var(--blue2);
    border-color: var(--mdb-btn-border-color)
}


#cartSideBar {
    position: fixed;
    height: 100%;
    width: 30%;
    left: 0;
    top: 0;
    bottom: 0;
    z-index: 2000;
    background-color: var(--white);
    transform: translateX(-100%);
    transition: transform 0.8s;
}

#cartSideBar.show {
    transform: translateX(0%);
}

.Shipping-cost {
    font-size: 0.9rem;
}

@media (min-width: 992px) {
    .Shipping-cost {
        font-size: 1.2rem;
    }

    .Price-details {
        position: sticky;
        top: 80px;

    }
}

.Wizard .active {
    color: var(--CreamYellow1);
}

.Wizard .item.active hr {
    border-top: 3px solid var(--CreamYellow1);
}

.Wizard .item hr {
    border-top: 3px solid var(--Gray2);
}

.addres-slect {
    padding: 0;
}

.addres-slect input[type="radio"] {
    display: none;
}

.addres-slect input[type="radio"] + label {
    border: solid 1px var(--blue2);
    opacity: 0.5;
    border-radius: 0.5rem;
}

.addres-slect input[type="radio"]:checked + label {
    background-color: var(--white);
    opacity: 1;
}

.tab-pane-user > div {
    overflow-y: auto;
    height: 100%;
}

.tab-pane-user > div > .mobile-nav-body {
    position: sticky;
    top: 0;
    z-index: 122;
    background: white;
}

.card .img-fluid {
    width: 100%;
    border-radius: 0.3rem !important;
}

.modal-dialog {
    position: relative;
    width: auto;
    margin: 0;
    pointer-events: none;
}

.modal-content {
    position: relative;
    display: flex;
    flex-direction: column;
    width: 100%;
    color: var(--mdb-modal-color);
    pointer-events: auto;
    background-color: var(--mdb-modal-bg);
    background-clip: padding-box;
    border: 0;
    border-radius: 0;
    outline: 0;
}

@media (min-width: 992px) {
    .modal-content {
        position: relative;
        display: flex;
        flex-direction: column;
        width: 100%;
        color: var(--mdb-modal-color);
        pointer-events: auto;
        background-color: var(--mdb-modal-bg);
        background-clip: padding-box;
        border: var(--mdb-modal-border-width) solid var(--mdb-modal-border-color);
        border-radius: var(--mdb-modal-border-radius);
        outline: 0;
    }

    .modal-dialog {
        position: relative;
        width: auto;
        margin: auto;
        pointer-events: none;
    }
}

.modal-header {
    position: sticky;
    width: 100%;
    top: 0;
    background-color: var(--white);
    z-index: 103;
}

.modal-body .spiner .spinner-border-body {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translateX(-50%) translateY(-50%);
}

.modal-body .spiner {
    height: calc(100vh - 124px);
    width: 100%;
    position: relative;
}


.filde-list {
}

.filde-list > .fild-item {
    border: 1px solid var(--Gray4);
    margin-bottom: 1rem;
    border-radius: 0.5rem;
}

@media ( min-width: 992px) {
    .filde-list > .fild-item {
        border: inherit;
        margin-bottom: 0;
        border-radius: initial;
    }

    .filde-list > .fild-item:nth-child(-n+6) {
        border-bottom: 1px solid var(--Gray4);
    }

    .filde-list > .fild-item:nth-child(-n+6):last-child {
        border-bottom: none;
    }

    .filde-list > .fild-item:nth-child(2n) {

    }

    .filde-list > .fild-item:nth-child(odd) {
        border-right: 1px solid var(--Gray4);


    }
}

.type-alert {
    width: 32px;
    height: 32px;
    position: relative;
    border-radius: 50%;
}

.type-alert.type-1 {
    background-color: var(--CreamYellow1);
    color: var(--white)
}

.type-alert.type-1 {
    background-color: var(--CreamYellow1);
    color: var(--white)
}

.type-alert.type-2 {
    background-color: #95060a;
    color: var(--white)
}

.type-alert > i {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translateX(-50%) translateY(-50%);
}

.artwork-list {
    overflow-x: auto;
}

.artwork-list .adoruart_card.card[fix-height="true"] > .img > img {
    height: 7.9rem;
    width: auto;
}

.artwork-list .adoruart_card.card[type="b"] > .card-body > .price > .product-card__price-original {
    font-size: 0.7rem;
}

@media ( min-width: 992px) {
    .artwork-list .adoruart_card.card[fix-height="true"] > .img > img {
        height: 180px;
        width: auto;
    }

    .artwork-list .adoruart_card.card[type="b"] > .card-body > .price > .product-card__price-original {
        font-size: 0.9rem;
    }
}

select.form-control {
    -webkit-appearance: listbox !important;
    -moz-appearance: listbox !important;
    appearance: listbox !important;
    padding-top: 4px;
    padding-bottom: 4px;
}

.main-timeline {
    position: relative;
}

/* The actual timeline (the vertical ruler) */
.main-timeline::after {
    content: '';
    position: absolute;
    width: 6px;
    background-color: #939597;
    top: 0;
    bottom: 0;
    left: 50%;
    margin-left: -3px;
}

/* Container around content */
.timeline {
    position: relative;
    background-color: inherit;
    width: 50%;
}

/* The circles on the timeline */
.timeline::after {
    content: '';
    position: absolute;
    width: 25px;
    height: 25px;
    right: -13px;
    background-color: #939597;
    border: 5px solid #F5DF4D;
    top: 15px;
    border-radius: 50%;
    z-index: 1;
}

/* Place the container to the left */
.left {
    padding: 0px 40px 20px 0px;
    left: 0;
}

/* Place the container to the right */
.right {
    padding: 0px 0px 20px 40px;
    left: 50%;
}

/* Add arrows to the left container (pointing right) */
.left::before {
    content: " ";
    position: absolute;
    top: 18px;
    z-index: 1;
    right: 30px;
    border: medium solid white;
    border-width: 10px 0 10px 10px;
    border-color: transparent transparent transparent white;
}

/* Add arrows to the right container (pointing left) */
.right::before {
    content: " ";
    position: absolute;
    top: 18px;
    z-index: 1;
    left: 30px;
    border: medium solid white;
    border-width: 10px 10px 10px 0;
    border-color: transparent white transparent transparent;
}

/* Fix the circle for containers on the right side */
.right::after {
    left: -12px;
}

/* Media queries - Responsive timeline on screens less than 600px wide */
@media screen and (max-width: 600px) {
    /* Place the timelime to the left */
    .main-timeline::after {
        left: 31px;
    }

    /* Full-width containers */
    .timeline {
        width: 100%;
        padding-left: 70px;
        padding-right: 25px;
    }

    /* Make sure that all arrows are pointing leftwards */
    .timeline::before {
        left: 60px;
        border: medium solid white;
        border-width: 10px 10px 10px 0;
        border-color: transparent white transparent transparent;
    }

    /* Make sure all circles are at the same spot */
    .left::after, .right::after {
        left: 18px;
    }

    .left::before {
        right: auto;
    }

    /* Make all right containers behave like the left ones */
    .right {
        left: 0%;
    }
}