@charset "UTF-8";

/* Theme v1.0.0 */
/* Sizes */
/* Colors */
/* Media Queries*/
@font-face {
    font-family: "SF Pro Display";
    src: url("../fonts/SFProDisplay-Bold.woff2") format("woff2"), url("../fonts/SFProDisplay-Bold.woff") format("woff"), url("../fonts/SFProDisplay-Bold.ttf") format("truetype");
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-family: "SF Pro Display";
    src: url("../fonts/SFProDisplay-Black.woff2") format("woff2"), url("../fonts/SFProDisplay-Black.woff") format("woff"), url("../fonts/SFProDisplay-Black.ttf") format("truetype");
    font-weight: 900;
    font-style: normal;
}

@font-face {
    font-family: "SF Pro Display";
    src: url("../fonts/SFProDisplay-Medium.woff2") format("woff2"), url("../fonts/SFProDisplay-Medium.woff") format("woff"), url("../fonts/SFProDisplay-Medium.ttf") format("truetype");
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: "SF Pro Display";
    src: url("../fonts/SFProDisplay-Ultralight.woff2") format("woff2"), url("../fonts/SFProDisplay-Ultralight.woff") format("woff"), url("../fonts/SFProDisplay-Ultralight.ttf") format("truetype");
    font-weight: 100;
    font-style: normal;
}

@font-face {
    font-family: "SF Pro Display";
    src: url("../fonts/SFProDisplay-Semibold.woff2") format("woff2"), url("../fonts/SFProDisplay-Semibold.woff") format("woff"), url("../fonts/SFProDisplay-Semibold.ttf") format("truetype");
    font-weight: 600;
    font-style: normal;
}

@font-face {
    font-family: "SF Pro Display";
    src: url("../fonts/SFProDisplay-Light.woff2") format("woff2"), url("../fonts/SFProDisplay-Light.woff") format("woff"), url("../fonts/SFProDisplay-Light.ttf") format("truetype");
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: "SF Pro Display";
    src: url("../fonts/SFProDisplay-HeavyItalic.woff2") format("woff2"), url("../fonts/SFProDisplay-HeavyItalic.woff") format("woff"), url("../fonts/SFProDisplay-HeavyItalic.ttf") format("truetype");
    font-weight: 900;
    font-style: italic;
}

@font-face {
    font-family: "SF Pro Display";
    src: url("../fonts/SFProDisplay-Thin.woff2") format("woff2"), url("../fonts/SFProDisplay-Thin.woff") format("woff"), url("../fonts/SFProDisplay-Thin.ttf") format("truetype");
    font-weight: 100;
    font-style: normal;
}

@font-face {
    font-family: "SF Pro Display";
    src: url("../fonts/SFProDisplay-Regular.woff2") format("woff2"), url("../fonts/SFProDisplay-Regular.woff") format("woff"), url("../fonts/SFProDisplay-Regular.ttf") format("truetype");
    font-weight: normal;
    font-style: normal;
}

body {
    font-family: "SF Pro Display", "Helvetica Neue", "Helvetica", "Arial", sans-serif;
    font-style: normal;
    font-weight: 500;
    font-size: 1rem;
}

a {
    color: #000;
}

a:hover {
    text-decoration: none;
    color: #ba2528;
}

.mdo {
    overflow-x: hidden;
    height: 100%;
}

.cursor {
    cursor: pointer;
}

.btn-success {
    background-color: #ba2528;
    border-color: #ba2528;
}

.btn-danger {
    font-size: 1rem;
    padding: 0.75rem 0.75rem;
}

.button,
.btn-success {
    font-size: 1rem;
    padding: 0.75rem 0.75rem;
}

.button:hover,
.btn-success:hover {
    color: #fff;
    background-color: #116c7f;
}

.btn-outline-success:not(:disabled):not(.disabled).active,
.btn-outline-success:not(:disabled):not(.disabled):active,
.show>.btn-outline-success.dropdown-toggle {
    color: #fff;
    background-color: #116c7f;
}

.btn-outline-success {
    background-color: #fff;
    border-color: #62a94d;
    font-size: 1rem;
    padding: 0.75rem 0.75rem;
}

.btn-outline-success:hover {
    color: #fff;
    background-color: #116c7f;
}

.form-control,
.custom-file-label {
    height: calc(1.5em + .75rem + 4px);
    background-color: #FBFAF8;
    border: 1px solid #EBEBEB;
}

.topbar {
    background-color: #000;
    height: 2.5rem;
}

.topbar .lang a,
.topbar .panel a {
    font-size: 0.875rem;
    font-weight: 400;
    color: #fff;
}

.topbar .panel .svg {
    margin-top: -0.125rem;
    margin-right: 0.3125rem;
}

.modal-title {
    font-size: 1.625rem;
    font-weight: 700;
}

.header {
    position: relative;
}

.nav-scroller {
    position: relative;
    z-index: 2;
    height: 2.75rem;
    overflow-y: hidden;
}

.nav-scroller .nav {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    padding-bottom: 1rem;
    margin-top: -1px;
    overflow-x: auto;
    color: rgba(255, 255, 255, 0.75);
    text-align: center;
    white-space: nowrap;
    -webkit-overflow-scrolling: touch;
}

.menu-overlay {
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 9999;
    position: absolute;
    height: 100%;
    width: 100%;
}

.m-close {
    position: relative;
}

.m-close::after {
    content: "";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    height: 2.5rem;
    width: 2.5rem;
    background-color: #fff;
    position: absolute;
    right: 0.8125rem;
    top: 0.75rem;
    z-index: 9999;
    border: 1px solid #DDDDDD;
    color: #000;
    text-align: center;
    border-radius: 0.25rem;
    line-height: 2.3rem;
}

.free-shipping {
    height: 2.5rem;
    background-color: #33322e;
    text-align: center;
}

.free-shipping a {
    font-size: 0.75rem;
    font-weight: 400;
    text-align: center;
    line-height: 2.5rem;
    color: #fff;
}

.free-shipping a:after {
    content: "";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    position: absolute;
    right: 20px;
}

.backtoup {
    border: 1px solid #ba2528;
    text-align: center;
    font-size: 0.875rem;
    font-weight: 400;
    color: #000;
    width: 100%;
}

.swiper-container {
    width: 100%;
    height: auto;
}

.swiper-container .swiper-slide {
    height: auto;
    text-align: center;
}

.swiper-container .swiper-slide img {
    margin: 0 auto;
}

#gallery-top .swiper-slide {
    height: 35.9375rem;
}

#gallery-top .swiper-slide img {
    height: 100%;
}

#gallery-thumbs .swiper-slide {
    width: 5.3125rem;
    height: 5.3125rem;
}

#gallery-thumbs .swiper-slide img {
    height: 100%;
}

.swiper-pagination-bullet-active {
    background: #ba2528;
}

.swiper-lazy-preloader-white:after {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%20120%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20xmlns%3Axlink%3D'http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink'%3E%3Cdefs%3E%3Cline%20id%3D'l'%20x1%3D'60'%20x2%3D'60'%20y1%3D'7'%20y2%3D'27'%20stroke%3D'%23000'%20stroke-width%3D'11'%20stroke-linecap%3D'round'%2F%3E%3C%2Fdefs%3E%3Cg%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(30%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(60%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(90%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(120%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(150%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.37'%20transform%3D'rotate(180%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.46'%20transform%3D'rotate(210%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.56'%20transform%3D'rotate(240%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.66'%20transform%3D'rotate(270%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.75'%20transform%3D'rotate(300%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.85'%20transform%3D'rotate(330%2060%2C60)'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
}

.swiper-button-prev.swiper-button-white,
.swiper-container-rtl .swiper-button-next.swiper-button-white {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%2393BC24'%2F%3E%3C%2Fsvg%3E");
}

.swiper-button-next.swiper-button-white,
.swiper-container-rtl .swiper-button-prev.swiper-button-white {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%2393BC24'%2F%3E%3C%2Fsvg%3E");
}

.feedback {
    width: 100%;
    height: auto;
}

.producs-tab h1 {
    font-size: 1.875rem;
    font-weight: 700;
}

.producs-tab p {
    padding: 0 20%;
}

.producs-tab .nav-pills {
    margin-top: 1.875rem;
}

.producs-tab .nav-item {
    margin-right: 2.5rem;
    position: relative;
}

.producs-tab .nav-item:last-child {
    margin-right: 0;
}

.producs-tab .nav-item:after {
    content: "";
    border-left: 1px solid #000;
    position: absolute;
    top: -4px;
    right: -1.25rem;
    height: 3.125rem;
}

.producs-tab .nav-item:last-child:after {
    display: none;
}

.producs-tab .t-fixed {
    position: fixed;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 888;
}

.producs-tab .nav-link {
    background-color: #fff;
    border: 1px solid #DDDDDD;
    padding: 0.5rem 1.875rem;
}

.producs-tab .nav-pills .nav-link.active,
.producs-tab .nav-pills .show>.nav-link {
    color: #000;
    background-color: #F9F9F9;
}

.producs-tab .btn {
    font-size: 0.875rem;
    background-color: #fff;
    box-shadow: 0px 8px 15px rgba(114, 124, 142, 0.36);
    border-radius: 3.125rem;
    position: relative;
    height: 2.5rem;
    line-height: 2.5rem;
    padding: 0 0.3125rem;
    min-width: 90%;
}

.producs-tab #special-product-load-more {
    background-color: #ba2528 !important;
    border-color: #ba2528 !important;
    font-size: 0.875rem !important;
    padding: 0.375rem 1.5625rem !important;
    border-radius: 0;
    line-height: 1rem;
}

.producs-tab #special-product-load-more:hover {
    color: white;
}

.producs-tab .btn:hover {
    color: #ba2528;
}

.producs-tab .btn:after {
    content: "";
    font-family: "Font Awesome 5 Free";
    line-height: 1.875rem;
    text-align: center;
    font-weight: 900;
    width: 1.875rem;
    height: 1.875rem;
    background-color: #ba2528;
    border-radius: 50%;
    color: #fff;
    display: none;
    float: right;
    margin-top: 0.25rem;
}

.bottom-box .card .card-img-overlay {
    background-color: rgba(0, 0, 0, 0.5);
}

.bottom-box .card h3 {
    font-size: 1rem;
    margin-bottom: 0;
}

.bottom-box .card .btn {
    background-color: #ba2528;
    border-color: #ba2528;
    font-size: 0.875rem;
    padding: 0.75rem 2rem;
    color: #fff;
}

.bottom-box .card .btn-container {
    display: none;
}

.bottom-box .card:hover .btn-container {
    display: block;
}

.bottom-box .card:hover h3 {
    margin-bottom: 0.625rem;
}

.feature-box {
    background: #f3f3f5;
}

.feature-box .media h4 {
    font-size: 1.125rem;
    font-weight: 700;
}

.feature-box .media img {
    height: 3rem;
}

.instagram-feed h3 {
    font-size: 1.625rem;
    font-weight: 700;
}

.instagram-feed p {
    font-size: 0.875rem;
    font-weight: 400;
}

.instagram-feed .insta-box {
    opacity: 0.6;
    width: 11.875rem;
    height: auto;
}

.instagram-feed .insta-box:hover {
    opacity: 1;
}

.seo-content {
    margin-bottom: 3.125rem;
    text-align: justify;
}

.seo-content h2,
.seo-content h3,
.seo-content p,
.read-button-show,
.read-button-hide {
    font-size: 0.875rem;
    line-height: 1.25rem;
    text-align: justify;
    display: inline;
    color: #BEBEBE;
}

.seo-content h3:after {
    content: ":";
}

.seo-content p:after {
    content: "";
    clear: both;
    display: table;
    margin-bottom: 0.625rem;
}

.read-half p:after {
    content: "" !important;
    clear: unset !important;
    display: initial !important;
}

.footer {
    background-color: #33322e;
    padding: 3.125rem 0;
}

.footer h4 {
    font-size: 0.875rem;
    color: #fff;
    margin-bottom: 1.25rem;
}

.footer .v-line:before {
    content: "";
    border-left: 1px solid #45443f;
    height: 100%;
    position: absolute;
    left: -15px;
}

.footer .email-sub .form-control {
    background-color: #000;
    border-color: #000;
    min-width: 20rem;
    height: 2.1875rem;
}

.footer .email-sub p,
.footer .email-sub a {
    font-size: 0.75rem;
    color: #929292;
    font-weight: 400;
}

.footer .email-sub .btn-primary {
    background-color: #ba2528;
    border-color: #ba2528;
    font-size: 0.875rem;
    padding: 0.375rem 1.5625rem;
}

.footer .email-sub .btn-primary:hover {
    color: #fff;
    background-color: #116c7f;
    border-color: #116c7f;
}

.footer .footer-navs {
    border-top: 1px solid #45443f;
    border-bottom: 1px solid #45443f;
    padding-top: 1.875rem;
    padding-bottom: 1.875rem;
    margin-top: 1.875rem;
    margin-bottom: 1.875rem;
}

.footer .nav li {
    display: block;
    width: 100%;
}

.footer .nav li a {
    color: #929292;
    font-size: 0.75rem;
}

.footer .nav li a:hover {
    color: #BEBEBE;
}

.footer .nav li a .s-icon {
    margin-right: 0.625rem;
}

.footer .nav-horizontal li {
    display: block;
    width: initial;
    margin-right: 2.1875rem;
}

.footer .copyright {
    color: #929292;
    font-size: 0.75rem;
    font-weight: 400;
}

.footer .s-icon {
    width: 1.25rem;
    height: 1.25rem;
    display: inline-block;
    background: no-repeat center/100% 100%;
    font-style: normal;
    vertical-align: bottom;
}

.footer .instagram {
    background-image: url("../images/svg/instagram.svg");
}

.footer .pinterest {
    background-image: url("../images/svg/pinterest.svg");
}

.footer .facebook {
    background-image: url("../images/svg/facebook.svg");
}

.footer .twitter {
    background-image: url("../images/svg/twitter.svg");
}

.footer .vimeo {
    background-image: url("../images/svg/vimeo.svg");
}

.footer .youtube {
    background-image: url("../images/svg/youtube.svg");
}

.filters {
    background-color: #F9F9F9;
    position: relative;
    border-bottom: 1px solid #DDDDDD;
}

.filters .dropbtn {
    font-size: 1rem;
    color: #929292 !important;
    padding: 0.75rem 0;
    display: block;
}

.filters .dropbtn i {
    vertical-align: text-top;
    margin-left: 0.625rem;
}

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

.filters .dropdown-content {
    display: none;
    position: absolute;
    background-color: #F9F9F9;
    min-width: 11.25rem;
    max-height: 22rem;
    padding: 0.625rem;
    z-index: 13;
    border: 1px solid #DDDDDD;
    overflow: auto;
}

.filters .dropdown-content a {
    padding: 0.5rem 0.625rem;
    text-decoration: none;
    display: block;
    font-size: 0.875rem;
    line-height: 0.875rem;
    color: #929292;
}

.filters .dropdown-content .current {
    color: #ba2528;
    font-weight: bold;
}

.filters .dropdown-content a:hover {
    color: #ba2528;
}

.filters .dropdown:hover .dropdown-content {
    display: block;
}

.filters .dropdown:hover .dropbtn {
    background-color: #F9F9F9;
}

.filters .option-check {
    display: inline-block;
    vertical-align: middle;
    line-height: 0.8125rem;
    margin-right: 0.3125rem;
}

.filters .option-check:before {
    content: "";
    font-family: "Font Awesome 5 Free";
    font-weight: 400;
}

.filters .current .option-check {
    color: #ba2528;
    font-weight: bold;
}

.filters .current .option-check:before {
    content: "";
    font-family: "Font Awesome 5 Free";
    font-weight: 400;
}

.filters .colors {
    min-width: 20rem;
}

.filters .colors a {
    float: left;
    width: 50%;
}

.filters .color {
    display: inline-block;
    vertical-align: middle;
    line-height: 0.8125rem;
    margin-right: 0.3125rem;
    height: 0.9375rem;
    width: 0.9375rem;
    box-shadow: inset 1px 1px 0px 0px rgba(0, 0, 0, 0.08);
    border: 1px solid #DDDDDD;
}

.filters .current .color {
    color: #ba2528;
    font-weight: bold;
}

.filters .link {
    font-size: 1rem;
    color: #929292 !important;
    padding: 0.75rem 0;
    display: inline-block;
    margin-right: 1.25rem;
}

.filters .link:last-child {
    margin-right: 0;
}

.filters .box3 {
    background-image: url("../images/svg/3box.svg");
    background-repeat: no-repeat;
    background-position: center center;
    width: 2.5rem;
    height: 1.25rem;
    display: inline-block;
    vertical-align: text-bottom;
}

.filters .box4 {
    background-image: url("../images/svg/4box.svg");
    background-repeat: no-repeat;
    background-position: center center;
    width: 3.125rem;
    height: 1.25rem;
    display: inline-block;
    vertical-align: text-bottom;
}

.products a:hover {
    color: #000;
}

.products h1,
.products h2 {
    font-size: 1.125rem;
    font-weight: 700;
    margin-bottom: 20px;
}

.products .title {
    font-size: 1.125rem;
    font-weight: 700;
    margin-top: 1.25rem;
    margin-bottom: 0.3125rem;
}

.products .price {
    color: #ba2528;
    margin-right: 0.3125rem;
}

.products .old-price {
    font-size: 0.875rem;
    text-decoration: line-through;
}

.product-content h1 {
    font-size: 1.625rem;
    font-weight: 700;
}

.product-content .p-short-content {
    font-size: 0.875rem;
    font-weight: 400;
}

.product-content .p-top-star {
    margin-bottom: 0.625rem;
}

.product-content .p-top-star .star {
    color: #FF6969;
}

.product-content .p-top-star span {
    color: #D4D7DD;
    font-size: 0.8125rem;
}

.product-content .p-top-star .star-text {
    margin-left: 0.625rem;
    display: inline-block;
}

.product-content .p-top-star .star-text a {
    color: #000;
    font-size: 0.75rem;
    font-weight: 400;
}

.variant-container {
    width: 18.125rem;
}

.variant-container .d-flex {
    margin-left: -0.9375rem;
    margin-right: -0.9375rem;
}

.variant-dropbtn {
    width: 100%;
    height: 2.5rem;
    text-align: center;
    font-size: 0.875rem;
    font-weight: 400;
    background-color: #fff;
    position: relative;
}

.dropbtn-icon:after {
    content: "";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    position: absolute;
    right: 1.5625rem;
}

.variant-dropdown {
    position: relative;
    display: block;
    width: 100%;
    margin-left: 0.9375rem;
    margin-right: 0.9375rem;
    margin-bottom: 0.625rem;
}

.variant-dropdown-content {
    position: absolute;
    background-color: #fff;
    width: 100%;
    z-index: 1;
    max-height: 22rem;
    overflow: auto;
}

/* width */
.variant-dropdown-content::-webkit-scrollbar {
    width: 0.3125rem;
}

/* Track */
.variant-dropdown-content::-webkit-scrollbar-track {
    background: #f1f1f1;
}

/* Handle */
.variant-dropdown-content::-webkit-scrollbar-thumb {
    background: #888;
}

/* Handle on hover */
.variant-dropdown-content::-webkit-scrollbar-thumb:hover {
    background: #555;
}

.variant-dropdown-content a {
    padding: 0.625rem 0.9375rem;
    text-decoration: none;
    display: block;
    font-size: 0.875rem;
    font-weight: 400;
}

.variant-dropdown .colors a {
    float: left;
    width: 100%;
    padding: 0.3125rem;
}

.variant-dropdown .colors .color {
    padding: 0.625rem 0.9375rem;
    width: 100%;
    display: block;
    border-radius: 0.25rem;
    border: 1px solid #fff;
}

.variant-dropdown .current .color {
    color: #ba2528;
    font-weight: bold;
    display: block;
}

.variant-dropdown .colors a:hover .color {
    background-color: transparent;
    border: 1px solid #000;
    color: #000;
}

.variant-dropdown .colors a:hover .color:after {
    content: "";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    position: absolute;
    right: 1.5625rem;
}

.variant-dropdown-content a:hover {
    background-color: #FBFAF8;
}

/*
.variant-dropdown:hover .variant-dropdown-content {
  display: block;
}*/
.variant-dropdown:hover .variant-dropbtn {
    background-color: #FBFAF8;
}

.price-container {
    margin-left: 1.25rem;
    margin-bottom: 0.3125rem;
}

.price-container .old-price {
    font-size: 1rem;
    font-weight: 400;
    color: #000;
    text-align: right;
    text-decoration: line-through;
}

.price-container .new-price {
    font-size: 1.375rem;
    font-weight: 700;
    color: #ba2528;
    text-align: right;
}

.wh-color {
    width: 1.875rem;
    height: 1.875rem;
    float: left;
    margin-right: 0.625rem;
    margin-bottom: 0.625rem;
    border-radius: 0.25rem;
    text-indent: -999999px;
}

.big-screen {
    width: 750px;
    margin-left: -335px;
    z-index: 99;
}

.nakis-preview p {
    margin-bottom: 0;
}

.roboto {
    font-family: "Roboto", sans-serif;
    font-size: 1.25rem;
}

.playfairdisplay {
    font-family: "Playfair Display", serif;
    font-size: 1.25rem;
}

.dancingscript {
    font-family: "Dancing Script", cursive;
    font-size: 1.25rem;
}

.custom-file-label::after {
    height: calc(1.5em + .75rem + 4px);
}

.no-transition {
    transition: none;
}

.accordion-title {
    display: block;
    width: 100%;
    background-color: #F9F9F9;
    border: 1px solid #DDDDDD;
    font-size: 0.75rem;
    color: #929292;
    padding: 1.25rem 1.5625rem;
}

.accordion-desc {
    position: absolute;
    background-color: #F9F9F9;
    border: 1px solid #DDDDDD;
    top: 0;
    min-height: 240px;
    width: 645px;
    left: -645px;
    z-index: 1001;
    padding: 0.9375rem;
}

.sactive {
    color: #ba2528;
}

.custom-control-input:checked~.custom-control-label::before {
    border-color: #ba2528;
    background-color: #ba2528;
}

.btn-bf {
    background-color: #ba2528;
    border-radius: 3.125rem;
    padding: 4px 0.5rem;
    color: #fff;
}

.customer-photo {
    background-color: #F9F9F9;
}

.customer-photo h3 {
    font-size: 1.125rem;
    font-weight: 700;
}

.customer-photo p {
    font-size: 0.875rem;
}

.customer-photo .photo {
    font-size: 0.875rem;
}

.customer-photo .swiper-button-next,
.customer-photo .swiper-button-prev {
    height: 1.5625rem;
    margin-top: -0.625rem;
}

.customer-photo .swiper-button-next {
    right: 0;
}

.customer-photo .swiper-button-prev {
    left: 0;
}

.similar-products h3 {
    font-size: 1.625rem;
    font-weight: 700;
}

.similar-products .swiper-button-next,
.similar-products .swiper-button-prev {
    height: 1.875rem;
    margin-top: -2.5rem;
}

.similar-products .swiper-button-next {
    right: -0.625rem;
}

.similar-products .swiper-button-prev {
    left: -0.625rem;
}

.no-comment .comment-bg {
    background-color: #F9F9F9;
}

.no-comment .green {
    color: #ba2528;
}

.list-comment .comment-bg {
    background-color: #F9F9F9;
}

.list-comment .green {
    color: #ba2528;
}

.list-comment .tile {
    color: #FF6969;
}

.list-comment .c-bp {
    font-size: 1.625rem;
    font-weight: 700;
}

.list-comment .c-op {
    font-size: 1rem;
}

.list-comment .c-dy {
    font-size: 0.75rem;
}

.list-comment .c-date {
    font-size: 0.75rem;
    font-size: 400;
}

.list-comment .progress {
    height: 0.3125rem;
    margin-top: 0.625rem;
}

.list-comment .progress-bar {
    background-color: #FF6969;
}

.list-comment .p-top-star .star {
    color: #FF6969;
}

.list-comment .p-top-star span {
    color: #D4D7DD;
    font-size: 0.8125rem;
}

.list-comment .p-top-star .star-text {
    margin-left: 0.625rem;
    display: inline-block;
}

.list-comment .p-top-star .star-text a {
    color: #000;
    font-size: 0.75rem;
    font-weight: 400;
}

.list-comment .user-al {
    width: 3.75rem;
    height: 3.75rem;
    background-color: #ba2528;
    border-radius: 3.75rem;
    line-height: 3.75rem;
    text-align: center;
    color: #fff;
    font-weight: 700;
    box-shadow: 1px 2px 9px 0px #ba2528;
}

.list-comment .user-comment h5 {
    font-size: 1rem;
}

.list-comment .user-comment p {
    font-size: 0.875rem;
}

.custom-range::-webkit-slider-thumb {
    background-color: #ba2528;
}

.bg-success {
    background-color: #ba2528 !important;
}

.swiper-zoom {
    font-size: 1.5625rem;
    position: absolute;
    top: 1.5625rem;
    left: 1.5625rem;
    z-index: 5;
    opacity: 0.2;
}

.blog .cover {
    min-height: 12.5rem;
    background-position: center center;
    background-size: cover;
    background-repeat: no-repeat;
}

.blog h3,
.blog .title {
    font-size: 1.375rem;
    font-weight: 700;
}

.title-18 {
    font-size: 1.125rem;
    font-weight: 700;
}

.bl-1 {
    border-right: 1px solid #dee2e6;
}

.twentytwenty {
    background-color: #f3f3f5;
}

.twentytwenty-horizontal .twentytwenty-handle:before,
.twentytwenty-horizontal .twentytwenty-handle:after,
.twentytwenty-vertical .twentytwenty-handle:before,
.twentytwenty-vertical .twentytwenty-handle:after {
    content: " ";
    display: block;
    background: white;
    position: absolute;
    z-index: 30;
    -webkit-box-shadow: 0px 0px 12px rgba(51, 51, 51, 0.5);
    -moz-box-shadow: 0px 0px 12px rgba(51, 51, 51, 0.5);
    box-shadow: 0px 0px 12px rgba(51, 51, 51, 0.5);
}

.twentytwenty-horizontal .twentytwenty-handle:before,
.twentytwenty-horizontal .twentytwenty-handle:after {
    width: 3px;
    height: 9999px;
    left: 50%;
    margin-left: -1.5px;
}

.twentytwenty-vertical .twentytwenty-handle:before,
.twentytwenty-vertical .twentytwenty-handle:after {
    width: 9999px;
    height: 3px;
    top: 50%;
    margin-top: -1.5px;
}

.twentytwenty-before-label,
.twentytwenty-after-label,
.twentytwenty-overlay {
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
}

.twentytwenty-before-label,
.twentytwenty-after-label,
.twentytwenty-overlay {
    -webkit-transition-duration: 0.5s;
    -moz-transition-duration: 0.5s;
    transition-duration: 0.5s;
}

.twentytwenty-before-label,
.twentytwenty-after-label {
    -webkit-transition-property: opacity;
    -moz-transition-property: opacity;
    transition-property: opacity;
}

.twentytwenty-before-label:before,
.twentytwenty-after-label:before {
    color: white;
    font-size: 13px;
    letter-spacing: 0.1em;
}

.twentytwenty-before-label:before,
.twentytwenty-after-label:before {
    position: absolute;
    background: rgba(255, 255, 255, 0.2);
    line-height: 38px;
    padding: 0 20px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
}

.twentytwenty-horizontal .twentytwenty-before-label:before,
.twentytwenty-horizontal .twentytwenty-after-label:before {
    top: 50%;
    margin-top: -19px;
}

.twentytwenty-vertical .twentytwenty-before-label:before,
.twentytwenty-vertical .twentytwenty-after-label:before {
    left: 50%;
    margin-left: -45px;
    text-align: center;
    width: 90px;
}

.twentytwenty-left-arrow,
.twentytwenty-right-arrow,
.twentytwenty-up-arrow,
.twentytwenty-down-arrow {
    width: 0;
    height: 0;
    border: 6px inset transparent;
    position: absolute;
}

.twentytwenty-left-arrow,
.twentytwenty-right-arrow {
    top: 50%;
    margin-top: -6px;
}

.twentytwenty-up-arrow,
.twentytwenty-down-arrow {
    left: 50%;
    margin-left: -6px;
}

.twentytwenty-container {
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box;
    z-index: 0;
    overflow: hidden;
    position: relative;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
}

.twentytwenty-container img {
    max-width: 100%;
    position: absolute;
    left: 0;
    right: 0;
    margin: 0 auto;
    top: 0;
    display: block;
}

.twentytwenty-container.active .twentytwenty-overlay,
.twentytwenty-container.active :hover.twentytwenty-overlay {
    background: rgba(0, 0, 0, 0);
}

.twentytwenty-container.active .twentytwenty-overlay .twentytwenty-before-label,
.twentytwenty-container.active .twentytwenty-overlay .twentytwenty-after-label,
.twentytwenty-container.active :hover.twentytwenty-overlay .twentytwenty-before-label,
.twentytwenty-container.active :hover.twentytwenty-overlay .twentytwenty-after-label {
    opacity: 0;
}

.twentytwenty-container * {
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box;
}

.twentytwenty-before-label {
    opacity: 0;
}

.twentytwenty-before-label:before {
    content: attr(data-content);
}

.twentytwenty-after-label {
    opacity: 0;
}

.twentytwenty-after-label:before {
    content: attr(data-content);
}

.twentytwenty-horizontal .twentytwenty-before-label:before {
    left: 10px;
}

.twentytwenty-horizontal .twentytwenty-after-label:before {
    right: 10px;
}

.twentytwenty-vertical .twentytwenty-before-label:before {
    top: 10px;
}

.twentytwenty-vertical .twentytwenty-after-label:before {
    bottom: 10px;
}

.twentytwenty-overlay {
    -webkit-transition-property: background;
    -moz-transition-property: background;
    transition-property: background;
    background: rgba(0, 0, 0, 0);
    z-index: 25;
}

.twentytwenty-overlay:hover {
    background: rgba(0, 0, 0, 0.5);
}

.twentytwenty-overlay:hover .twentytwenty-after-label {
    opacity: 1;
}

.twentytwenty-overlay:hover .twentytwenty-before-label {
    opacity: 1;
}

.twentytwenty-before {
    z-index: 20;
}

.twentytwenty-after {
    z-index: 10;
}

.twentytwenty-handle {
    height: 38px;
    width: 38px;
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -22px;
    margin-top: -22px;
    border: 3px solid white;
    background-color: #ba2528;
    -webkit-border-radius: 1000px;
    -moz-border-radius: 1000px;
    border-radius: 1000px;
    -webkit-box-shadow: 0px 0px 12px rgba(51, 51, 51, 0.5);
    -moz-box-shadow: 0px 0px 12px rgba(51, 51, 51, 0.5);
    box-shadow: 0px 0px 12px rgba(51, 51, 51, 0.5);
    z-index: 40;
    cursor: pointer;
}

.twentytwenty-horizontal .twentytwenty-handle:before {
    bottom: 50%;
    margin-bottom: 22px;
    -webkit-box-shadow: 0 3px 0 white, 0px 0px 12px rgba(51, 51, 51, 0.5);
    -moz-box-shadow: 0 3px 0 white, 0px 0px 12px rgba(51, 51, 51, 0.5);
    box-shadow: 0 3px 0 white, 0px 0px 12px rgba(51, 51, 51, 0.5);
}

.twentytwenty-horizontal .twentytwenty-handle:after {
    top: 50%;
    margin-top: 22px;
    -webkit-box-shadow: 0 -3px 0 white, 0px 0px 12px rgba(51, 51, 51, 0.5);
    -moz-box-shadow: 0 -3px 0 white, 0px 0px 12px rgba(51, 51, 51, 0.5);
    box-shadow: 0 -3px 0 white, 0px 0px 12px rgba(51, 51, 51, 0.5);
}

.twentytwenty-vertical .twentytwenty-handle:before {
    left: 50%;
    margin-left: 22px;
    -webkit-box-shadow: 3px 0 0 white, 0px 0px 12px rgba(51, 51, 51, 0.5);
    -moz-box-shadow: 3px 0 0 white, 0px 0px 12px rgba(51, 51, 51, 0.5);
    box-shadow: 3px 0 0 white, 0px 0px 12px rgba(51, 51, 51, 0.5);
}

.twentytwenty-vertical .twentytwenty-handle:after {
    right: 50%;
    margin-right: 22px;
    -webkit-box-shadow: -3px 0 0 white, 0px 0px 12px rgba(51, 51, 51, 0.5);
    -moz-box-shadow: -3px 0 0 white, 0px 0px 12px rgba(51, 51, 51, 0.5);
    box-shadow: -3px 0 0 white, 0px 0px 12px rgba(51, 51, 51, 0.5);
}

.twentytwenty-left-arrow {
    border-right: 6px solid white;
    left: 50%;
    margin-left: -17px;
}

.twentytwenty-right-arrow {
    border-left: 6px solid white;
    right: 50%;
    margin-right: -17px;
}

.twentytwenty-up-arrow {
    border-bottom: 6px solid white;
    top: 50%;
    margin-top: -17px;
}

.twentytwenty-down-arrow {
    border-top: 6px solid white;
    bottom: 50%;
    margin-bottom: -17px;
}

@media (min-width: 992px) {
    .hamburger {
        display: none;
    }

    .menu {
        padding: 0.9375rem 0;
        background: #fff;
        border-bottom: 2px solid rgba(0, 0, 0, 0.16);
    }

    .menu .nav-item {
        margin-right: 1.25rem;
    }

    .menu .nav-item .nav-link {
        border: 1px solid #DDDDDD;
        padding: 0.5rem 2.5rem;
        color: #000;
        border-radius: 0.25rem;
        background: #d1d1d1;
    }

    .menu .nav-item .nav-link:hover {
        background-color: #000;
        border-color: #000;
        color: #fff;
    }

    .menu .nav-item .dropdown-toggle::after {
        display: none;
    }

    .checkout {
        border: 1px solid #DDDDDD;
        padding: 0.5rem 1.5rem;
        color: #000;
        border-radius: 0.25rem;
    }

    .checkout:hover {
        color: #000;
    }

    .checkout .number {
        display: block;
        width: 0.9375rem;
        height: 0.9375rem;
        background-color: #ba2528;
        border-radius: 50%;
        font-size: 0.625rem;
        line-height: 0.9375rem;
        position: absolute;
        top: 0.3125rem;
        text-align: center;
        color: #fff;
        z-index: 2;
        left: 2.5rem;
    }

    .dropdown-menu {
        margin-top: 1rem;
        padding: 0;
        border-color: #DDDDDD;
        background-color: #F9F9F9;
    }

    .dropdown-menu .dropdown-item {
        padding: 0.5rem 1.5rem;
    }

    .dropdown-menu .dropdown-item:hover,
    .dropdown-menu .dropdown-item:active {
        background-color: #EBEBEB;
        color: #000;
    }

    .mega {
        min-width: 45rem;
        height: 15rem;
        border-color: #DDDDDD;
        background-color: #F9F9F9;
        z-index: 2000;
    }

    .mega .left {
        float: left;
        width: 30.0625rem;
        margin-left: -1px;
    }

    .mega .left .dropdown-item {
        float: left;
        width: 7.5rem;
        height: 7.5rem;
        padding: 1.5625rem 0.3125rem;
        color: #000;
        background-color: transparent;
        border: 1px solid #DDDDDD;
        text-align: center;
        clear: none;
    }

    .mega .left .dropdown-item:hover,
    .mega .left .dropdown-item:active {
        background-color: #EBEBEB;
    }

    .mega .left .dropdown-item .icon {
        height: 3.4375rem;
        width: 3.4375rem;
        vertical-align: middle;
        margin: 0 auto;
        display: block;
    }

    .mega .right {
        float: right;
        width: 15rem;
        height: 15rem;
        text-align: center;
        margin-right: -1px;
        margin-left: -1px;
    }

    .mega .right .dropdown-item {
        float: left;
        width: 15rem;
        height: 15rem;
        padding: 2.5rem 0.3125rem;
        color: #000;
        background-color: transparent;
        border: 1px solid #DDDDDD;
        text-align: center;
        clear: none;
    }

    .mega .right .dropdown-item:hover,
    .mega .right .dropdown-item:active {
        background-color: #EBEBEB;
    }

    .mega .right .dropdown-item .desc {
        width: 12.5rem;
        margin: 0 auto;
        white-space: normal;
    }
}

@media (max-width: 991.98px) {
    .navbar-brand {
        margin-right: 0;
    }

    .hamburger {
        background-color: #616161;
        color: #fff;
        width: 2.5rem;
        height: 2.5rem;
        padding: 0;
        text-align: center;
        display: block;
    }

    .menu {
        padding: 0.625rem 0;
        background: #F9F9F9;
    }

    .offcanvas-collapse {
        position: fixed;
        z-index: 9999;
        top: 0;
        bottom: 0;
        right: 100%;
        width: 80%;
        overflow-y: auto;
        visibility: hidden;
        background-color: #fff;
        box-shadow: 5px 0px 5px rgba(0, 0, 0, 0.16);
        transition: visibility 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
        transition: transform 0.3s ease-in-out, visibility 0.3s ease-in-out;
        transition: transform 0.3s ease-in-out, visibility 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
    }

    .offcanvas-collapse.open {
        visibility: visible;
        -webkit-transform: translateX(100%);
        transform: translateX(100%);
    }

    .checkout {
        border: 1px solid #DDDDDD;
        color: #000;
        border-radius: 0.25rem;
        height: 40px;
        width: 40px;
        padding: 0;
        text-align: center;
        line-height: 40px;
    }

    .checkout .text,
    .checkout .number {
        display: none;
    }

    .navbar-nav .nav-link {
        font-size: 1.125rem;
        font-weight: 700;
        color: #000;
        padding: 0.9375rem 1.875rem;
    }

    .lang {
        margin-left: 15px;
    }

    .lang .nav-link {
        float: left;
        padding: 0.9375rem;
    }

    .dropdown-menu {
        border: none;
        padding: 0;
        margin: 0;
    }

    .dropdown-menu .dropdown-item {
        display: block;
        width: 100%;
        clear: initial;
        font-weight: 400;
        text-align: inherit;
        padding: 0.9375rem 1.875rem;
        background-color: #DDDDDD;
        border-bottom: 1px solid #fff;
        font-size: 0.9375rem;
    }

    .dropdown-menu .dropdown-item:hover,
    .dropdown-menu .dropdown-item:active {
        background-color: #EBEBEB;
    }

    .dropdown-toggle::after {
        content: "";
        font-family: "Font Awesome 5 Free";
        font-weight: 900;
        border: none;
        display: inline-block;
        margin-left: 0;
        vertical-align: 0;
        float: right;
    }

    .mega .left .dropdown-item {
        display: block;
        width: 100%;
        clear: initial;
        font-weight: 400;
        text-align: inherit;
        padding: 0.9375rem 1.875rem;
        background-color: #DDDDDD;
        border-bottom: 1px solid #fff;
        font-size: 0.9375rem;
    }

    .mega .left .dropdown-item:hover,
    .mega .left .dropdown-item:active {
        background-color: #EBEBEB;
    }

    .mega .left .dropdown-item .icon {
        height: 1.875rem;
        width: 1.875rem;
        vertical-align: middle;
        display: block;
        float: left;
        text-align: center;
        margin-right: 0.9375rem;
        margin-top: -5px;
    }

    .mega .left .dropdown-item .icon img {
        height: 100%;
    }

    .mega .right {
        display: none;
    }

    .producs-tab .btn {
        min-width: 100%;
    }

    .producs-tab .t-fixed {
        bottom: -1.5625rem;
    }

    .producs-tab .border {
        border: none !important;
    }

    .bottom-box .card h3 {
        margin-bottom: 0.75rem;
    }

    .bottom-box .card .btn-container {
        display: block;
    }

    .feedback .small {
        font-size: 100%;
    }

    .email-sub .form-control {
        min-width: auto !important;
    }

    .footer h4 {
        margin-bottom: 1rem;
    }

    .footer .email-sub .btn-primary {
        padding: 0.375rem 0.75rem;
    }

    .footer .footer-navs {
        margin-top: 0;
    }

    .footer .nav-horizontal li {
        margin-right: 0;
    }

    .filters .filters-list {
        max-height: 76vh;
        overflow: auto;
    }

    .filters .dropdown {
        width: 100%;
    }

    .filters .dropdown-content {
        display: block;
        position: relative;
    }

    .filters .dropdown-content a {
        width: 50%;
        float: left;
    }

    #gallery-top .swiper-slide {
        height: 23.75rem;
    }

    .variant-container {
        width: 14.375rem;
    }

    .price-container {
        margin-bottom: 0.625rem;
        margin-left: auto;
    }

    .price-container .old-price {
        font-size: 1rem;
    }

    .price-container .new-price {
        font-size: 1.125rem;
    }

    .btn-container,
    .accordionProductList {
        width: 100%;
    }

    .accordion-desc {
        position: initial;
        top: initial;
        width: initial;
        left: initial;
        z-index: initial;
    }

    .blog .cover {
        min-height: 6.25rem;
    }

    .blog h3 {
        font-size: 1.125rem;
    }

    .bl-1 {
        border-right: none;
    }
}

/*# sourceMappingURL=styles.css.map */



.gradiant.avatar-1 {
    background: linear-gradient(45deg, #ef0781 0%, #ef0781 6%, #d00a70 6%, #d00a70 25%, #b10d60 25%, #b10d60 40%, #93104f 40%, #93104f 45%, #74133e 45%, #74133e 53%, #55162e 53%, #55162e 66%, #36191d 66%, #36191d 100%);
}

.gradiant.avatar-2 {
    background: linear-gradient(45deg, #16f4c5 0%, #16f4c5 12%, #18dbbb 12%, #18dbbb 51%, #1ac1b0 51%, #1ac1b0 52%, #1ca8a6 52%, #1ca8a6 66%, #1d8f9b 66%, #1d8f9b 73%, #1f7591 73%, #1f7591 80%, #215c86 80%, #215c86 100%);
}

.gradiant.avatar-3 {
    background: linear-gradient(45deg, #408cbe 0%, #408cbe 7%, #3e6b91 7%, #3e6b91 9%, #316383 9%, #316383 11%, #74acd3 11%, #74acd3 26%, #7db6d6 26%, #7db6d6 34%, #285a88 34%, #285a88 41%, #277bbe 41%, #277bbe 100%);
}

.gradiant.avatar-4 {
    background: linear-gradient(52deg, rgba(163, 163, 163, 0.09) 0%, rgba(163, 163, 163, 0.09) 33.3%, rgba(100, 100, 100, 0.09) 33.3%, rgba(100, 100, 100, 0.09) 66.6%, rgba(162, 162, 162, 0.09) 66.6%, rgba(162, 162, 162, 0.09) 99%), linear-gradient(258deg, rgba(193, 193, 193, 0.06) 0%, rgba(193, 193, 193, 0.06) 33.3%, rgba(169, 169, 169, 0.06) 33.3%, rgba(169, 169, 169, 0.06) 66.6%, rgba(92, 92, 92, 0.06) 66.6%, rgba(92, 92, 92, 0.06) 99%), linear-gradient(129deg, rgba(45, 45, 45, 0.03) 0%, rgba(45, 45, 45, 0.03) 33.3%, rgba(223, 223, 223, 0.03) 33.3%, rgba(223, 223, 223, 0.03) 66.6%, rgba(173, 173, 173, 0.03) 66.6%, rgba(173, 173, 173, 0.03) 99%), linear-gradient(280deg, rgba(226, 226, 226, 0.06) 0%, rgba(226, 226, 226, 0.06) 33.3%, rgba(81, 81, 81, 0.06) 33.3%, rgba(81, 81, 81, 0.06) 66.6%, rgba(186, 186, 186, 0.06) 66.6%, rgba(186, 186, 186, 0.06) 99%), linear-gradient(85deg, rgba(225, 225, 225, 0.04) 0%, rgba(225, 225, 225, 0.04) 33.3%, rgba(95, 95, 95, 0.04) 33.3%, rgba(95, 95, 95, 0.04) 66.6%, rgba(39, 39, 39, 0.04) 66.6%, rgba(39, 39, 39, 0.04) 99%), linear-gradient(128deg, rgba(184, 184, 184, 0.06) 0%, rgba(184, 184, 184, 0.06) 33.3%, rgba(0, 0, 0, 0.06) 33.3%, rgba(0, 0, 0, 0.06) 66.6%, rgba(140, 140, 140, 0.06) 66.6%, rgba(140, 140, 140, 0.06) 99.9%), linear-gradient(323deg, rgba(40, 40, 40, 0.07) 0%, rgba(40, 40, 40, 0.07) 33.3%, rgba(214, 214, 214, 0.07) 33.3%, rgba(214, 214, 214, 0.07) 66.6%, rgba(190, 190, 190, 0.07) 66.6%, rgba(190, 190, 190, 0.07) 99.9%), linear-gradient(61deg, rgba(230, 230, 230, 0) 0%, rgba(230, 230, 230, 0) 33.3%, rgba(241, 241, 241, 0) 33.3%, rgba(241, 241, 241, 0) 66.6%, rgba(55, 55, 55, 0) 66.6%, rgba(55, 55, 55, 0) 99%), linear-gradient(0deg, #2625e3, #0bbaef);
}

.gradiant.avatar-5 {
    background: linear-gradient(135deg, #f68918 0%, #f68918 31%, #ae3e9f 31%, #ae3e9f 42%, #d2645c 42%, #d2645c 49%, #8a19e3 49%, #8a19e3 100%);
}

.gradiant.avatar-6 {
    background: linear-gradient(45deg, #b6d9b9 0%, #b6d9b9 7%, #94cbb2 7%, #94cbb2 16%, #50b1a6 16%, #50b1a6 18%, #2ea39f 18%, #2ea39f 26%, #72beac 26%, #72beac 37%, #0c9699 37%, #0c9699 100%);
}

.gradiant.avatar-7 {
    background: linear-gradient(135deg, #50ce6e 0%, #50ce6e 44%, #2dc46a 44%, #2dc46a 66%, #0ab966 66%, #0ab966 73%, #97e377 73%, #97e377 75%, #74d973 75%, #74d973 93%, #baee7b 93%, #baee7b 100%);
}

.gradiant.avatar-8 {
    background: linear-gradient(45deg, #b5549b 0%, #b5549b 31%, #edc27c 31%, #edc27c 38%, #dfa684 38%, #dfa684 46%, #c36f94 46%, #c36f94 69%, #a738a3 69%, #a738a3 75%, #d18b8c 75%, #d18b8c 77%, #991dab 77%, #991dab 99%, #8b01b3 99%, #8b01b3 100%);
}

.gradiant.avatar-9 {
    background: linear-gradient(180deg, rgba(161, 161, 161, 0.01) 0%, rgba(161, 161, 161, 0.01) 13%, rgba(148, 148, 148, 0.01) 13%, rgba(148, 148, 148, 0.01) 100%), linear-gradient(334deg, rgba(3, 3, 3, 0.09) 0%, rgba(3, 3, 3, 0.09) 45%, rgba(38, 38, 38, 0.09) 45%, rgba(38, 38, 38, 0.09) 100%), linear-gradient(89deg, rgba(25, 25, 25, 0.01) 0%, rgba(25, 25, 25, 0.01) 49%, rgba(244, 244, 244, 0.01) 49%, rgba(244, 244, 244, 0.01) 100%), linear-gradient(350deg, rgba(191, 191, 191, 0.1) 0%, rgba(191, 191, 191, 0.1) 77%, rgba(42, 42, 42, 0.1) 77%, rgba(42, 42, 42, 0.1) 100%), linear-gradient(153deg, rgba(156, 156, 156, 0.04) 0%, rgba(156, 156, 156, 0.04) 56%, rgba(148, 148, 148, 0.04) 56%, rgba(148, 148, 148, 0.04) 100%), linear-gradient(223deg, rgba(135, 135, 135, 0.09) 0%, rgba(135, 135, 135, 0.09) 47%, rgba(9, 9, 9, 0.09) 47%, rgba(9, 9, 9, 0.09) 100%), linear-gradient(175deg, rgba(4, 4, 4, 0.08) 0%, rgba(4, 4, 4, 0.08) 60%, rgba(217, 217, 217, 0.08) 60%, rgba(217, 217, 217, 0.08) 100%), linear-gradient(283deg, rgba(36, 36, 36, 0.05) 0%, rgba(36, 36, 36, 0.05) 13%, rgba(156, 156, 156, 0.05) 13%, rgba(156, 156, 156, 0.05) 100%), linear-gradient(358deg, rgba(137, 137, 137, 0.04) 0%, rgba(137, 137, 137, 0.04) 45%, rgba(160, 160, 160, 0.04) 45%, rgba(160, 160, 160, 0.04) 100%), linear-gradient(90deg, #4dcfdb, #4dcfdb);
}

.gradiant.avatar-10 {
    background: linear-gradient(316deg, rgba(234, 234, 234, 0.02) 0%, rgba(234, 234, 234, 0.02) 16.667%, rgba(128, 128, 128, 0.02) 16.667%, rgba(128, 128, 128, 0.02) 33.334%, rgba(161, 161, 161, 0.02) 33.334%, rgba(161, 161, 161, 0.02) 50.001%, rgba(154, 154, 154, 0.02) 50.001%, rgba(154, 154, 154, 0.02) 66.668%, rgba(77, 77, 77, 0.02) 66.668%, rgba(77, 77, 77, 0.02) 83.335%, rgba(10, 10, 10, 0.02) 83.335%, rgba(10, 10, 10, 0.02) 100.002%), linear-gradient(75deg, rgba(39, 39, 39, 0.03) 0%, rgba(39, 39, 39, 0.03) 20%, rgba(232, 232, 232, 0.03) 20%, rgba(232, 232, 232, 0.03) 40%, rgba(33, 33, 33, 0.03) 40%, rgba(33, 33, 33, 0.03) 60%, rgba(84, 84, 84, 0.03) 60%, rgba(84, 84, 84, 0.03) 80%, rgba(112, 112, 112, 0.03) 80%, rgba(112, 112, 112, 0.03) 100%), linear-gradient(103deg, rgba(174, 174, 174, 0.03) 0%, rgba(174, 174, 174, 0.03) 12.5%, rgba(190, 190, 190, 0.03) 12.5%, rgba(190, 190, 190, 0.03) 25%, rgba(191, 191, 191, 0.03) 25%, rgba(191, 191, 191, 0.03) 37.5%, rgba(23, 23, 23, 0.03) 37.5%, rgba(23, 23, 23, 0.03) 50%, rgba(227, 227, 227, 0.03) 50%, rgba(227, 227, 227, 0.03) 62.5%, rgba(71, 71, 71, 0.03) 62.5%, rgba(71, 71, 71, 0.03) 75%, rgba(162, 162, 162, 0.03) 75%, rgba(162, 162, 162, 0.03) 87.5%, rgba(85, 85, 85, 0.03) 87.5%, rgba(85, 85, 85, 0.03) 100%), linear-gradient(355deg, rgba(38, 38, 38, 0.02) 0%, rgba(38, 38, 38, 0.02) 25%, rgba(106, 106, 106, 0.02) 25%, rgba(106, 106, 106, 0.02) 50%, rgba(28, 28, 28, 0.02) 50%, rgba(28, 28, 28, 0.02) 75%, rgba(66, 66, 66, 0.02) 75%, rgba(66, 66, 66, 0.02) 100%), linear-gradient(137deg, rgba(38, 38, 38, 0.03) 0%, rgba(38, 38, 38, 0.03) 25%, rgba(211, 211, 211, 0.03) 25%, rgba(211, 211, 211, 0.03) 50%, rgba(4, 4, 4, 0.03) 50%, rgba(4, 4, 4, 0.03) 75%, rgba(24, 24, 24, 0.03) 75%, rgba(24, 24, 24, 0.03) 100%), linear-gradient(51deg, rgba(253, 253, 253, 0.03) 0%, rgba(253, 253, 253, 0.03) 14.286%, rgba(103, 103, 103, 0.03) 14.286%, rgba(103, 103, 103, 0.03) 28.572%, rgba(46, 46, 46, 0.03) 28.572%, rgba(46, 46, 46, 0.03) 42.858%, rgba(68, 68, 68, 0.03) 42.858%, rgba(68, 68, 68, 0.03) 57.144%, rgba(116, 116, 116, 0.03) 57.144%, rgba(116, 116, 116, 0.03) 71.43%, rgba(248, 248, 248, 0.03) 71.43%, rgba(248, 248, 248, 0.03) 85.716%, rgba(174, 174, 174, 0.03) 85.716%, rgba(174, 174, 174, 0.03) 100.002%), linear-gradient(283deg, rgba(20, 20, 20, 0.01) 0%, rgba(20, 20, 20, 0.01) 14.286%, rgba(23, 23, 23, 0.01) 14.286%, rgba(23, 23, 23, 0.01) 28.572%, rgba(19, 19, 19, 0.01) 28.572%, rgba(19, 19, 19, 0.01) 42.858%, rgba(134, 134, 134, 0.01) 42.858%, rgba(134, 134, 134, 0.01) 57.144%, rgba(4, 4, 4, 0.01) 57.144%, rgba(4, 4, 4, 0.01) 71.43%, rgba(254, 254, 254, 0.01) 71.43%, rgba(254, 254, 254, 0.01) 85.716%, rgba(87, 87, 87, 0.01) 85.716%, rgba(87, 87, 87, 0.01) 100.002%), linear-gradient(90deg, #a801ce, #1478cb);
}


.profile-comment-avatar {
    background-size: 100% !important;
    box-shadow: 1px 2px 9px 0px #dee2e6 !important;
}

.point {
    width: 3.75rem;
    height: 3.75rem;
    float: left;
    background-color: #ba2528;
    border-radius: 3.75rem;
    text-align: center;
    color: #fff;
    padding-top: 0.5rem;
}

.credit-card {
    background: linear-gradient(90deg, #FFF 0%, transparent 100%), linear-gradient(0deg, #FFF 0%, transparent 100%), linear-gradient(90deg, rgba(230, 230, 230, 0.18) 0%, rgba(230, 230, 230, 0.18) 54%, rgba(61, 61, 61, 0.18) 54%, rgba(61, 61, 61, 0.18) 100%), linear-gradient(90deg, rgba(83, 83, 83, 0.18) 0%, rgba(83, 83, 83, 0.18) 5%, rgba(97, 97, 97, 0.18) 5%, rgba(97, 97, 97, 0.18) 100%), linear-gradient(135deg, rgba(62, 62, 62, 0.28) 0%, rgba(62, 62, 62, 0.28) 45%, rgba(243, 243, 243, 0.28) 45%, rgba(243, 243, 243, 0.28) 100%), linear-gradient(135deg, rgba(72, 72, 72, 0.18) 0%, rgba(72, 72, 72, 0.18) 53%, rgba(133, 133, 133, 0.18) 53%, rgba(133, 133, 133, 0.18) 100%), linear-gradient(135deg, rgba(30, 30, 30, 0.28) 0%, rgba(30, 30, 30, 0.28) 48%, rgba(104, 104, 104, 0.28) 48%, rgba(104, 104, 104, 0.28) 100%), linear-gradient(45deg, rgba(134, 134, 134, 0.24) 0%, rgba(134, 134, 134, 0.24) 62%, rgba(157, 157, 157, 0.24) 62%, rgba(157, 157, 157, 0.24) 100%), linear-gradient(135deg, rgba(175, 175, 175, 0.08) 0%, rgba(175, 175, 175, 0.08) 65%, rgba(87, 87, 87, 0.08) 65%, rgba(87, 87, 87, 0.08) 100%), linear-gradient(90deg, #939393, #c7c7c7);
    max-width: 29.375rem;
    height: 18.4375rem;
    border: 1px solid #DDDDDD;
    border-radius: 0.625rem;
    position: relative;
}

.cc-logo {
    position: absolute;
    right: 1.875rem;
    top: 1.875rem;
}

.cc-chip {
    position: absolute;
    top: 6.25rem;
    left: 1.875rem;
}

.cc-number {
    position: absolute;
    bottom: 4.375rem;
    left: 1.875rem;
    font-size: 1.9375rem;
    font-weight: 700;
    color: #787878;
    word-spacing: 0.625rem;
}

.notSendingCargo {
    cursor: default !important;
}

.alert-green {
    background: #ba2528;
    border-radius: 0;
}

.cc-name {
    position: absolute;
    bottom: 2.5rem;
    left: 1.875rem;
    font-size: 1.125rem;
    font-weight: 600;
    color: #787878;
}

.wc-size {
    width: 50%;
}

.u-image {
    height: 6.25rem;
    width: 5rem;
    background-position: no-repeat;
    background-size: cover;
    background-position: top center;
    border: 1px solid #f0f0f0;
}

.loading-bg {
    width: 100%;
    height: 100%;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    background-color: rgba(255, 255, 255, 0.5);
    z-index: 99999;
}

.loading {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    width: 2rem;
    height: 2rem;
}

.w-90 {
    width: 90px;
    text-align: right;
}

.w-110 {
    width: 110px;
    text-align: right;
}

.spinner-border-w {
    width: 1.25rem;
    height: 1.25rem;
    margin-right: 0.625rem;
}

.cursor {
    cursor: pointer !important;
}

.s-icon {
    height: 50px;
    margin-right: 15px;
    margin-left: 15px;
}

.s-icon-arti {
    background-image: url("../images/svg/arti.svg");
    background-size: cover;
    height: 25px;
    width: 25px;
    float: right;
}

.s-icon-eksi {
    background-image: url("../images/svg/eksi.svg");
    background-size: cover;
    height: 25px;
    width: 25px;
    float: right;
}

.c-cvv .soru-isareti {
    height: 25px;
    margin-top: 8px;
}

.c-cvv .soru-isareti-cvv {
    display: none;
}

.c-cvv a:hover+.soru-isareti-cvv {
    display: block;
    top: 0;
    left: 60px;
    z-index: 9999;
}

select[data-type=selectBox] {
    background-color: #fff;
    height: 2.5rem;
    text-align: center;
    text-align-last: center;
    background: none;
}

select[data-type=selectBox] option {
    background-color: #fff;
    height: 2.5rem;
    text-align: center;
    text-align-last: center;
}

.nakis-white-color {
    background: #000000;
    padding: 10px;
    border-radius: 4px;
}

.siparis-durumu h1 {
    font-size: 3.125rem;
}

.siparis-durumu h2 {
    font-size: 1.5625rem;
}

.siparis-durumu h3 {
    font-size: 1.125rem;
}

.siparis-durumu h4 {
    font-size: 1.25rem;
    font-weight: 700;
}

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

.a-opacity {
    opacity: 0.5;
}

.a-opacity:hover {
    opacity: 1;
}

.twentytwenty {
    background-color: #f3f3f5;
    position: relative;
}

.twentytwenty .colour-section {
    position: absolute;
    width: 15.625rem;
    margin: 0 auto;
    left: 0;
    right: 0;
    bottom: 1.25rem;
}

.twentytwenty .colour-section .twenty-button {
    height: 1.25rem;
    width: 2.5rem;
    border-radius: 0.25rem;
}

.twentytwenty-horizontal .twentytwenty-handle:before,
.twentytwenty-horizontal .twentytwenty-handle:after,
.twentytwenty-vertical .twentytwenty-handle:before,
.twentytwenty-vertical .twentytwenty-handle:after {
    content: " ";
    display: block;
    background: white;
    position: absolute;
    z-index: 30;
    -webkit-box-shadow: 0px 0px 12px rgba(51, 51, 51, 0.5);
    -moz-box-shadow: 0px 0px 12px rgba(51, 51, 51, 0.5);
    box-shadow: 0px 0px 12px rgba(51, 51, 51, 0.5);
}

.twentytwenty-horizontal .twentytwenty-handle:before,
.twentytwenty-horizontal .twentytwenty-handle:after {
    width: 3px;
    height: 9999px;
    left: 50%;
    margin-left: -1.5px;
}

.twentytwenty-vertical .twentytwenty-handle:before,
.twentytwenty-vertical .twentytwenty-handle:after {
    width: 9999px;
    height: 3px;
    top: 50%;
    margin-top: -1.5px;
}

.twentytwenty-before-label,
.twentytwenty-after-label,
.twentytwenty-overlay {
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
}

.twentytwenty-before-label,
.twentytwenty-after-label,
.twentytwenty-overlay {
    -webkit-transition-duration: 0.5s;
    -moz-transition-duration: 0.5s;
    transition-duration: 0.5s;
}

.twentytwenty-before-label,
.twentytwenty-after-label {
    -webkit-transition-property: opacity;
    -moz-transition-property: opacity;
    transition-property: opacity;
}

.twentytwenty-before-label:before,
.twentytwenty-after-label:before {
    color: white;
    font-size: 13px;
    letter-spacing: 0.1em;
}

.twentytwenty-before-label:before,
.twentytwenty-after-label:before {
    position: absolute;
    background: rgba(255, 255, 255, 0.2);
    line-height: 38px;
    padding: 0 20px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
}

.twentytwenty-horizontal .twentytwenty-before-label:before,
.twentytwenty-horizontal .twentytwenty-after-label:before {
    top: 50%;
    margin-top: -19px;
}

.twentytwenty-vertical .twentytwenty-before-label:before,
.twentytwenty-vertical .twentytwenty-after-label:before {
    left: 50%;
    margin-left: -45px;
    text-align: center;
    width: 90px;
}

.twentytwenty-left-arrow,
.twentytwenty-right-arrow,
.twentytwenty-up-arrow,
.twentytwenty-down-arrow {
    width: 0;
    height: 0;
    border: 6px inset transparent;
    position: absolute;
}

.twentytwenty-left-arrow,
.twentytwenty-right-arrow {
    top: 50%;
    margin-top: -6px;
}

.twentytwenty-up-arrow,
.twentytwenty-down-arrow {
    left: 50%;
    margin-left: -6px;
}

.twentytwenty-container {
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box;
    z-index: 0;
    overflow: hidden;
    position: relative;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
}

.twentytwenty-container img {
    max-width: 100%;
    position: absolute;
    left: 0;
    right: 0;
    margin: 0 auto;
    top: 0;
    display: block;
}

.twentytwenty-container.active .twentytwenty-overlay,
.twentytwenty-container.active :hover.twentytwenty-overlay {
    background: rgba(0, 0, 0, 0);
}

.twentytwenty-container.active .twentytwenty-overlay .twentytwenty-before-label,
.twentytwenty-container.active .twentytwenty-overlay .twentytwenty-after-label,
.twentytwenty-container.active :hover.twentytwenty-overlay .twentytwenty-before-label,
.twentytwenty-container.active :hover.twentytwenty-overlay .twentytwenty-after-label {
    opacity: 0;
}

.twentytwenty-container * {
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box;
}

.twentytwenty-before-label {
    opacity: 0;
}

.twentytwenty-before-label:before {
    content: attr(data-content);
}

.twentytwenty-after-label {
    opacity: 0;
}

.twentytwenty-after-label:before {
    content: attr(data-content);
}

.twentytwenty-horizontal .twentytwenty-before-label:before {
    left: 10px;
}

.twentytwenty-horizontal .twentytwenty-after-label:before {
    right: 10px;
}

.twentytwenty-vertical .twentytwenty-before-label:before {
    top: 10px;
}

.twentytwenty-vertical .twentytwenty-after-label:before {
    bottom: 10px;
}

.twentytwenty-overlay {
    -webkit-transition-property: background;
    -moz-transition-property: background;
    transition-property: background;
    background: rgba(0, 0, 0, 0);
    z-index: 25;
}

.twentytwenty-overlay:hover {
    background: rgba(0, 0, 0, 0.5);
}

.twentytwenty-overlay:hover .twentytwenty-after-label {
    opacity: 1;
}

.twentytwenty-overlay:hover .twentytwenty-before-label {
    opacity: 1;
}

.twentytwenty-before {
    z-index: 20;
}

.twentytwenty-after {
    z-index: 10;
}

.twentytwenty-handle {
    height: 38px;
    width: 38px;
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -22px;
    margin-top: -22px;
    border: 3px solid white;
    background-color: #ba2528;
    -webkit-border-radius: 1000px;
    -moz-border-radius: 1000px;
    border-radius: 1000px;
    -webkit-box-shadow: 0px 0px 12px rgba(51, 51, 51, 0.5);
    -moz-box-shadow: 0px 0px 12px rgba(51, 51, 51, 0.5);
    box-shadow: 0px 0px 12px rgba(51, 51, 51, 0.5);
    z-index: 40;
    cursor: pointer;
}

.twentytwenty-horizontal .twentytwenty-handle:before {
    bottom: 50%;
    margin-bottom: 22px;
    -webkit-box-shadow: 0 3px 0 white, 0px 0px 12px rgba(51, 51, 51, 0.5);
    -moz-box-shadow: 0 3px 0 white, 0px 0px 12px rgba(51, 51, 51, 0.5);
    box-shadow: 0 3px 0 white, 0px 0px 12px rgba(51, 51, 51, 0.5);
}

.twentytwenty-horizontal .twentytwenty-handle:after {
    top: 50%;
    margin-top: 22px;
    -webkit-box-shadow: 0 -3px 0 white, 0px 0px 12px rgba(51, 51, 51, 0.5);
    -moz-box-shadow: 0 -3px 0 white, 0px 0px 12px rgba(51, 51, 51, 0.5);
    box-shadow: 0 -3px 0 white, 0px 0px 12px rgba(51, 51, 51, 0.5);
}

.twentytwenty-vertical .twentytwenty-handle:before {
    left: 50%;
    margin-left: 22px;
    -webkit-box-shadow: 3px 0 0 white, 0px 0px 12px rgba(51, 51, 51, 0.5);
    -moz-box-shadow: 3px 0 0 white, 0px 0px 12px rgba(51, 51, 51, 0.5);
    box-shadow: 3px 0 0 white, 0px 0px 12px rgba(51, 51, 51, 0.5);
}

.twentytwenty-vertical .twentytwenty-handle:after {
    right: 50%;
    margin-right: 22px;
    -webkit-box-shadow: -3px 0 0 white, 0px 0px 12px rgba(51, 51, 51, 0.5);
    -moz-box-shadow: -3px 0 0 white, 0px 0px 12px rgba(51, 51, 51, 0.5);
    box-shadow: -3px 0 0 white, 0px 0px 12px rgba(51, 51, 51, 0.5);
}

.twentytwenty-left-arrow {
    border-right: 6px solid white;
    left: 50%;
    margin-left: -17px;
}

.twentytwenty-right-arrow {
    border-left: 6px solid white;
    right: 50%;
    margin-right: -17px;
}

.twentytwenty-up-arrow {
    border-bottom: 6px solid white;
    top: 50%;
    margin-top: -17px;
}

.twentytwenty-down-arrow {
    border-top: 6px solid white;
    bottom: 50%;
    margin-bottom: -17px;
}


.product-tab-title {
    min-height: 33px;
}

@media (min-width: 992px) {
    .producs-tab .btn:after {
        margin-top: -2.3rem;
    }
}

@media (min-width: 992px) {

    .hamburger {
        display: none;
    }

    .menu {
        padding: 0.9375rem 0;
        background: #fff;
        border-bottom: 2px solid rgba(0, 0, 0, 0.16);
    }

    .menu .nav-item {
        margin-right: 1.25rem;
    }

    .menu .nav-item .nav-link {
        border: 1px solid #DDDDDD;
        padding: 0.5rem 2.5rem;
        color: #000;
        border-radius: 0.25rem;
    }

    .menu .nav-item .nav-link:hover {
        background-color: #000;
        border-color: #000;
        color: #fff;
    }

    .menu .nav-item .dropdown-toggle::after {
        display: none;
    }

    .checkout {
        border: 1px solid #DDDDDD;
        padding: 0.5rem 1.5rem;
        color: #000;
        border-radius: 0.25rem;
    }

    .checkout:hover {
        color: #000;
    }

    .checkout .number {
        display: block;
        width: 0.9375rem;
        height: 0.9375rem;
        background-color: #ba2528;
        border-radius: 50%;
        font-size: 0.625rem;
        line-height: 0.9375rem;
        position: absolute;
        top: 0.3125rem;
        text-align: center;
        color: #fff;
        z-index: 2;
        left: 2.5rem;
    }

    .dropdown-menu {
        margin-top: 1rem;
        padding: 0;
        border-color: #DDDDDD;
        background-color: #F9F9F9;
        z-index: 2000;
    }

    .dropdown-menu .nav-link {
        display: block !important;
        width: 100% !important;
        clear: both !important;
        font-weight: 400 !important;
        color: #212529 !important;
        text-align: inherit !important;
        white-space: nowrap !important;
        background-color: transparent !important;
        border: 0 !important;
        padding: 0.5rem 1.5rem !important;
    }

    .dropdown-menu .nav-link:hover,
    .dropdown-menu .nav-link:active {
        background-color: #EBEBEB !important;
        color: #000 !important;
    }

    .mega {
        min-width: 30.125rem;
        height: auto;
        /* height: 15.125rem; */
        border-color: #DDDDDD;
        background-color: #F9F9F9;
        z-index: 2000;
    }

    .mega .dropdown-item {
        float: left;
        width: 7.5rem;
        height: 7.5rem;
        padding: 1.5625rem 0.3125rem;
        color: #000;
        background-color: transparent;
        border: 1px solid #DDDDDD;
        text-align: center;
        clear: none;
    }

    .mega .dropdown-item:hover,
    .mega .dropdown-item:active {
        background-color: #EBEBEB;
    }

    .mega .dropdown-item .icon {
        height: 3.4375rem;
        width: 3.4375rem;
        vertical-align: middle;
        margin: 0 auto;
        display: block;
    }

    .mega .right {
        float: right;
        width: 15rem;
        height: 15rem;
        text-align: center;
        margin-right: -1px;
        margin-left: -1px;
    }

    .mega .right .dropdown-item {
        float: left;
        width: 15rem;
        height: 15rem;
        padding: 2.5rem 0.3125rem;
        color: #000;
        background-color: transparent;
        border: 1px solid #DDDDDD;
        text-align: center;
        clear: none;
    }

    .mega .right .dropdown-item:hover,
    .mega .right .dropdown-item:active {
        background-color: #EBEBEB;
    }

    .mega .right .dropdown-item .desc {
        width: 12.5rem;
        margin: 0 auto;
        white-space: normal;
    }
}

@media (max-width: 991.98px) {
    .navbar-brand {
        margin-right: 0;
    }

    .hamburger {
        background-color: #616161;
        color: #fff;
        width: 2.5rem;
        height: 2.5rem;
        padding: 0;
        text-align: center;
        display: block;
    }

    .menu {
        padding: 0.625rem 0;
        background: #F9F9F9;
    }

    .offcanvas-collapse {
        position: fixed;
        z-index: 9999;
        top: 0;
        bottom: 0;
        right: 100%;
        width: 80%;
        overflow-y: auto;
        visibility: hidden;
        background-color: #fff;
        box-shadow: 5px 0px 5px rgba(0, 0, 0, 0.16);
        transition: visibility 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
        transition: transform 0.3s ease-in-out, visibility 0.3s ease-in-out;
        transition: transform 0.3s ease-in-out, visibility 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
    }

    .offcanvas-collapse.open {
        visibility: visible;
        -webkit-transform: translateX(100%);
        transform: translateX(100%);
    }

    .checkout {
        border: 1px solid #DDDDDD;
        color: #000;
        border-radius: 0.25rem;
        height: 40px;
        width: 40px;
        padding: 0;
        text-align: center;
        line-height: 40px;
    }

    .checkout .text,
    .checkout .number {
        display: none;
    }

    .navbar-nav .nav-link {
        font-size: 1.125rem;
        font-weight: 700;
        color: #000;
        padding: 0.9375rem 1.875rem;
    }

    .lang {
        margin-left: 15px;
    }

    .lang .nav-link {
        float: left;
        padding: 0.9375rem;
    }

    .dropdown-menu {
        border: none;
        padding: 0;
        margin: 0;
    }

    .dropdown-menu .nav-link {
        display: block !important;
        width: 100% !important;
        clear: initial !important;
        font-weight: 400 !important;
        text-align: inherit !important;
        padding: 0.9375rem 1.875rem !important;
        background-color: #DDDDDD !important;
        border-bottom: 1px solid #fff !important;
        font-size: 0.9375rem !important;
    }

    .dropdown-menu .nav-link:hover,
    .dropdown-menu .nav-link:active {
        background-color: #EBEBEB !important;
    }

    .dropdown-toggle::after {
        content: "";
        font-family: "Font Awesome 5 Free";
        font-weight: 900;
        border: none;
        display: inline-block;
        margin-left: 0;
        vertical-align: 0;
        float: right;
    }

    .mega .dropdown-item {
        display: block;
        width: 100%;
        clear: initial;
        font-weight: 400;
        text-align: inherit;
        padding: 0.9375rem 1.875rem;
        background-color: #DDDDDD;
        border-bottom: 1px solid #fff;
        font-size: 0.9375rem;
    }

    .mega .dropdown-item:hover,
    .mega .dropdown-item:active {
        background-color: #EBEBEB;
    }

    .mega .dropdown-item .icon {
        height: 1.875rem;
        width: 1.875rem;
        vertical-align: middle;
        display: block;
        float: left;
        text-align: center;
        margin-right: 0.9375rem;
        margin-top: -5px;
    }

    .mega .dropdown-item .icon img {
        height: 100%;
    }

    .mega .right {
        display: none;
    }

    .producs-tab .btn {
        min-width: 100%;
    }

    .producs-tab .t-fixed {
        bottom: -1.5625rem;
    }

    .producs-tab .border {
        border: none !important;
    }

    .bottom-box .card h3 {
        margin-bottom: 0.75rem;
    }

    .bottom-box .card .btn-container {
        display: block;
    }

    .feedback .small {
        font-size: 100%;
    }

    .email-sub .form-control {
        min-width: auto !important;
    }

    .footer h4 {
        margin-bottom: 1rem;
    }

    .footer .email-sub .btn-primary {
        padding: 0.375rem 0.75rem;
    }

    .footer .footer-navs {
        margin-top: 0;
    }

    .footer .nav-horizontal li {
        margin-right: 0;
    }

    .filters .filters-list {
        max-height: 76vh;
        overflow: auto;
    }

    .filters .dropdown {
        width: 100%;
    }

    .filters .dropdown-content {
        display: block;
        position: relative;
    }

    .filters .dropdown-content a {
        width: 50%;
        float: left;
    }

    #gallery-top .swiper-slide {
        height: 30rem;
    }

    .variant-container {
        width: 14.375rem;
    }

    .price-container {
        margin-bottom: 0.625rem;
        margin-left: auto;
    }

    .price-container .old-price {
        font-size: 1rem;
    }

    .price-container .new-price {
        font-size: 1.125rem;
    }

    .btn-container,
    .accordionProductList {
        width: 100%;
    }

    .accordion-desc {
        position: initial;
        top: initial;
        width: initial;
        left: initial;
        z-index: initial;
    }

    .blog .cover,
    .page .cover {
        min-height: 6.25rem;
    }

    .blog h3,
    .page h3 {
        font-size: 1.125rem;
    }

    .bl-1 {
        border-right: none;
    }

    .credit-card {
        height: 15.625rem;
    }

    .cc-number {
        font-size: 1.3125rem;
        word-spacing: 0.3125rem;
        bottom: 2.8125rem;
    }

    .cc-name {
        font-size: 1rem;
        bottom: 1.25rem;
    }

    .wc-size {
        width: 100%;
    }

    .big-screen {
        width: 100%;
        margin-left: 0px;
    }

    .nav-custom .nav-link {
        width: 50%;
        text-align: center;
    }

    .siparis-durumu h1 {
        font-size: 1.875rem;
    }

    .siparis-durumu h2 {
        font-size: 1.25rem;
    }

    .siparis-durumu h3 {
        font-size: 1rem;
    }
}


.payment-title {
    width: 100%;
    text-align: center;
}

.form-container .field-container:first-of-type {
    grid-area: name;
}

.form-container .field-container:nth-of-type(2) {
    grid-area: number;
}

.form-container .field-container:nth-of-type(3) {
    grid-area: expiration;
}

.form-container .field-container:nth-of-type(4) {
    grid-area: security;
}

.field-container input {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.field-container {
    position: relative;
}

.form-container {
    display: grid;
    grid-column-gap: 10px;
    grid-template-columns: auto auto;
    grid-template-rows: 90px 90px 90px;
    grid-template-areas: "name name""number number""expiration security";
    max-width: 400px;
    padding: 20px;
    color: #707070;
}

.ccicon {
    height: 38px;
    position: absolute;
    right: 16px;
    top: calc(50% - 11px);
    width: 60px;
}

a[href="https://froala.com/wysiwyg-editor"],
a[href="https://www.froala.com/wysiwyg-editor?k=u"] {
    overflow: hidden !important;
    height: 0px !important;
    width: 0px !important;
    background: transparent !important;
    padding: 0px !important;
}

/* CREDIT CARD IMAGE STYLING */
.preload * {
    -webkit-transition: none !important;
    -moz-transition: none !important;
    -ms-transition: none !important;
    -o-transition: none !important;
}

.card-container {
    width: 100%;
    max-width: 400px;
    max-height: 251px;
    height: 54vw;
    padding: 20px;
}

#ccsingle {
    position: absolute;
    right: 15px;
    top: 20px;
}

#ccsingle svg {
    width: 100px;
    max-height: 60px;
}

.creditcard svg#cardfront,
.creditcard svg#cardback {
    width: 100%;
    -webkit-box-shadow: 1px 5px 6px 0px black;
    box-shadow: 1px 5px 6px 0px black;
    border-radius: 22px;
}

#generatecard {
    cursor: pointer;
    float: right;
    font-size: 12px;
    color: #fff;
    padding: 2px 4px;
    background-color: #909090;
    border-radius: 4px;
    cursor: pointer;
    float: right;
}

/* CHANGEABLE CARD ELEMENTS */
.creditcard .lightcolor,
.creditcard .darkcolor {
    -webkit-transition: fill .5s;
    transition: fill .5s;
}

.creditcard .lightblue {
    fill: #03A9F4;
}

.creditcard .lightbluedark {
    fill: #0288D1;
}

.creditcard .red {
    fill: #ef5350;
}

.creditcard .reddark {
    fill: #d32f2f;
}

.creditcard .purple {
    fill: #ab47bc;
}

.creditcard .purpledark {
    fill: #7b1fa2;
}

.creditcard .cyan {
    fill: #26c6da;
}

.creditcard .cyandark {
    fill: #0097a7;
}

.creditcard .green {
    fill: #66bb6a;
}

.creditcard .greendark {
    fill: #388e3c;
}

.creditcard .lime {
    fill: #d4e157;
}

.creditcard .limedark {
    fill: #afb42b;
}

.creditcard .yellow {
    fill: #ffeb3b;
}

.creditcard .yellowdark {
    fill: #f9a825;
}

.creditcard .orange {
    fill: #ff9800;
}

.creditcard .orangedark {
    fill: #ef6c00;
}

.creditcard .grey {
    fill: #bdbdbd;
}

.creditcard .greydark {
    fill: #616161;
}

/* FRONT OF CARD */
#svgname {
    text-transform: uppercase;
}

#cardfront .st2 {
    fill: #FFFFFF;
}

#cardfront .st3 {
    font-family: 'Source Code Pro', monospace;
    font-weight: 600;
}

#cardfront .st4 {
    font-size: 54.7817px;
}

#cardfront .st5 {
    font-family: 'Source Code Pro', monospace;
    font-weight: 400;
}

#cardfront .st6 {
    font-size: 33.1112px;
}

#cardfront .st7 {
    opacity: 0.6;
    fill: #FFFFFF;
}

#cardfront .st8 {
    font-size: 24px;
}

#cardfront .st9 {
    font-size: 36.5498px;
}

#cardfront .st10 {
    font-family: 'Source Code Pro', monospace;
    font-weight: 300;
}

#cardfront .st11 {
    font-size: 16.1716px;
}

#cardfront .st12 {
    fill: #4C4C4C;
}

/* BACK OF CARD */
#cardback .st0 {
    fill: none;
    stroke: #0F0F0F;
    stroke-miterlimit: 10;
}

#cardback .st2 {
    fill: #111111;
}

#cardback .st3 {
    fill: #F2F2F2;
}

#cardback .st4 {
    fill: #D8D2DB;
}

#cardback .st5 {
    fill: #C4C4C4;
}

#cardback .st6 {
    font-family: 'Source Code Pro', monospace;
    font-weight: 400;
}

#cardback .st7 {
    font-size: 27px;
}

#cardback .st8 {
    opacity: 0.6;
}

#cardback .st9 {
    fill: #FFFFFF;
}

#cardback .st10 {
    font-size: 24px;
}

#cardback .st11 {
    fill: #EAEAEA;
}

#cardback .st12 {
    font-family: 'Rock Salt', cursive;
}

#cardback .st13 {
    font-size: 37.769px;
}

/* FLIP ANIMATION */
.card-container {
    perspective: 1000px;
}

.creditcard {
    width: 100%;
    max-width: 400px;
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d;
    transition: -webkit-transform 0.6s;
    -webkit-transition: -webkit-transform 0.6s;
    transition: transform 0.6s;
    transition: transform 0.6s, -webkit-transform 0.6s;
    cursor: pointer;
}

.creditcard .front,
.creditcard .back {
    position: absolute;
    width: 100%;
    max-width: 400px;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-font-smoothing: antialiased;
    color: #47525d;
}

.creditcard .back {
    -webkit-transform: rotateY(180deg);
    transform: rotateY(180deg);
}

.creditcard.flipped {
    -webkit-transform: rotateY(180deg);
    transform: rotateY(180deg);
}

.sg-kare {
    object-fit: cover;
    width: 300px;
    height: 300px;
}

.tab-content-custom {
    border: 1px solid #dee2e6;
    border-radius: .25rem;
    border-top-left-radius: 0
}

.nav-custom .nav-link {
    border: 1px solid #F1F1F1;
    border-top-left-radius: .25rem;
    border-top-right-radius: .25rem;
    background: #FBFAF8;
    padding: 10px 30px;
    font-weight: 700;
    text-transform: uppercase
}


@media (max-width: 991.98px) {
    .nav-custom .nav-link {
        width: 50%;
        text-align: center
    }
}

.footer-cat {
    height: 240px;
    background: url(https://www.kedievi.com/application/uploads/footer-cat.png);
    background-position: center center;
    background-repeat: no-repeat;
    position: relative;
}

.footer-cat:before {
    content: "";
    background-color: #33322e;
    width: 100%;
    position: absolute;
    height: 65px;
    bottom: 0;
    z-index: -2;
}

.social-container:hover {
    background: #dddddd;
}

.social-container a:hover {
    color: #ba2528 !important;
}

.cat-card-add-header {
    margin-top: 30px;
}

.cat-remove-image-icon {
    position: absolute;
    top: -5px;
    right: 5px;
    border: 1px solid #ff0000;
    border-radius: 30px;
    cursor: pointer;
}

.cat-remove-image-icon img {
    fill: red;
    color: red;
}

.cat-card-add-header img {
    -o-object-fit: contain;
    object-fit: contain;
    max-height: 250px;
    width: 100%;
    padding: 50px;
}

.cat-card-front{
    background-image: url(https://www.kedievi.com/application/uploads/cart-kart-bg.jpg);
    background-size: cover;
    min-height: 323px;
}

.cat-card-preview-image{
    border-radius: 5px;
    border:3px solid #7d7d7d !important;
}

.cat-card-header{
    margin-bottom: 1rem;
}

.cat-card-header span{
    font-weight: bold!important;
}