@import url('https://fonts.googleapis.com/css2?family=Josefin+Sans:ital,wght@0,100..700;1,100..700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');

@font-face {
    font-family: "Trully";
    src: url("../fonts/Trully.ttf") format("truetype");
}

@font-face {
    font-family: "Baron Neue Bold";
    src: url("../fonts/Baron Neue Bold.otf") format("opentype");
}

@font-face {
    font-family: "BrandonGrotesqueBlack";
    src: url("../fonts/BrandonGrotesque-Black.otf") format("opentype");
}

@font-face {
    font-family: "news706bt";
    src: url("../fonts/News706-BT-Bold.ttf") format("opentype");
}

@font-face {
    font-family: "Mr Canfields Regular";
    src: url("../fonts/Mr-Canfields-Regular.ttf") format("opentype");
}

@keyframes pulse {
    0% {
        transform: scale(1);
    }

    50% {
        transform: scale(1.1);
    }

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

@keyframes pulse-circle {
    0% {
        transform: scale(1);
        opacity: 1;
    }

    50% {
        transform: scale(1.2);
        opacity: 0.7;
    }

    100% {
        transform: scale(1);
        opacity: 1;
    }
}
::-webkit-scrollbar {
    width: 8px;
    height: 6px;
    cursor: pointer;
}

::-webkit-scrollbar-thumb {
    background: #bcbcbb;
    border-radius: 10px;
    cursor: pointer;
}

::-webkit-scrollbar-track {
    background: transparent;
}

body {
    font-family: "Rubik", sans-serif;
}

.fontFamilyBrandon {
    font-family: "BrandonGrotesqueBlack";
}

.fontFamilyNews706Bt {
    font-family: "news706bt";
}

.fontFamilyMrCanfields{
    font-family: "Mr Canfields Regular";
}

.fontFamilyPoppins {
    font-family: "Poppins", sans-serif !important;
}

/*section{border-bottom: 2px solid red;;}*/
.modalBackdropBlur {
    z-index: 9999 !important;
    background-color: rgba(0, 0, 0, 0.6);
    backdrop-filter: blur(15px);
}
.noPadding {
    padding: 0 !important;
}

.noMargin {
    margin: 0 !important;
}

.noBorder {
    border: none !important;
}

.noResize {
    resize: none !important;
}

.relativeDiv {
    position: relative;
}

.cursorPointer {
    cursor: pointer;
}

.hideElement {
    display: none !important;
}

.generalBlackButton {
    background-color: #1d1d1b;
    border: 2px solid #1d1d1b;
    min-width: 122px;
    max-width: 165px;
    white-space: nowrap;
    height: 32px;
    color: #ffffff;
    font-family: "Rubik", sans-serif;
    font-weight: 500;
    font-size: 12px;
    line-height: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    letter-spacing: 0px;
    opacity: 1;
}
.generalBorderButton {
    font-weight: 600;
    border-radius: 0;
    width: fit-content;
    height: 30px;
    padding: .5rem;
    width: 80%;
    font-size: 12px;
    line-height: 12px;
}

    .generalBlackButton:hover {
        color: #ffffff !important;
    }

.m-generalBlackButton {
    background-color: #1d1d1b;
    border: 2px solid #1d1d1b;
    height: 30px;
    padding: .375rem .75rem;
    color: #ffffff;
    text-align: left;
    font-family: "Rubik", sans-serif;
    font-weight: 500;
    font-size: 9px;
    line-height: 14px;
    letter-spacing: 0px;
    opacity: 1;
}
    .m-generalBlackButton:hover {
        color: #ffffff !important;
        background-color: #1d1d1b;
        border-color: #1d1d1b;
    }

.generalWhiteButton {
    display: inline-block;
    color: #ffffff;
    opacity: 1;
    background-color: transparent;
    font-size: 12px;
    letter-spacing: 1px;
    font-weight: 600;
    border: 1px solid #ffffff;
    border-radius: 5px;
}

    .generalWhiteButton:hover {
        display: inline-block;
        color: #ffffff;
        opacity: 1;
        font-size: 12px;
        letter-spacing: 1px;
        font-weight: 600;
        border: 1px solid #ffffff;
        border-radius: 5px;
    }

.textOrange {
    color: #f1592a;
}

.textGreen {
    color: #6eb356 !important;
}

.textWhite {
    color: #ffffff;
}

.textBlack {
    color: #1d1d1b;
}

.textGray {
    color: #c6c6c6;
}

.textGray2 {
    color: #828282;
}

.textLightGray {
    color: #A5A5A5;
}

.textYellow {
    color: #ffee00;
}

.textBlue {
    color: #5F7BB2;
}

.textRed {
    color: #ce0917;
}

.textBold {
    font-weight: bold !important;
}

.textLight {
    font-weight: 100;
}

.font6 {
    font-size: 6px;
}

.font7 {
    font-size: 7px;
}

.font8 {
    font-size: 8px;
}

.font9 {
    font-size: 9px;
}

.font10 {
    font-size: 10px;
}

.font11 {
    font-size: 11px;
}

.font12 {
    font-size: 12px;
}

.font13 {
    font-size: 13px;
}

.font14 {
    font-size: 14px;
}

.font15 {
    font-size: 15px;
}

.font16 {
    font-size: 16px;
}

.font17 {
    font-size: 17px;
}

.font18 {
    font-size: 18px;
}

.font19 {
    font-size: 19px;
}

.font20 {
    font-size: 20px;
}

.font21 {
    font-size: 21px;
}

.font22 {
    font-size: 22px;
}

.font23 {
    font-size: 23px;
}

.font24 {
    font-size: 24px;
}

.font28 {
    font-size: 28px;
}

.font30 {
    font-size: 30px;
}

.font32 {
    font-size: 32px;
}

.font36 {
    font-size: 36px;
}

.font38 {
    font-size: 38px;
}

.letters15 {
    letter-spacing: 1.5px;
}

.letters2 {
    letter-spacing: 2px;
}

.lineHeight15 {
    line-height: 15px;
}

.lineHeight18 {
    line-height: 18px;
}

.param {
    font-size:14px;
}

.productPriceDiv {
    height: 60px;
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
    align-items: center;
}
.lineHeight24 {
    line-height: 24px;
}

.lineHeight40 {
    line-height: 40px;
}

.transparentWhiteButton {
    text-decoration: none;
    border-radius: 7px;
    border: 1px solid #FFFFFF;
    background-color: transparent;
    letter-spacing: 0px;
    color: #FFFFFF;
    padding: 5px 10px;
    cursor: pointer;
}
    .transparentWhiteButton:hover{
        background-color: white;
        color: unset;
    }

.productPriceDiv {
    height: 60px;
    flex-direction: column;
    justify-content: space-evenly;
    align-items: center;
}

.oldPrice {
    color: #a5a5a5;
    font-size: 12px;
    line-height: 12px;
    font-weight: 500;
    text-decoration: line-through;
    margin-top: 0.25rem;
    margin-bottom: 0.15rem;
}

.newPrice {
    color: #ce0917;
    font-size: 16px;
    line-height: 17px;
    font-weight: 600;
    margin-top: 0.15rem;
    margin-bottom: 0.5rem;
}
.m-basketSummaryCard .newPrice,
.basketProductCard .newPrice {
    width: 100%;
    text-align: right;
}
.basketProductCard .basketPanelColumn .newPrice {
    width: 100%;
    text-align: left;
}
.kdvText {
    font-family: Rubik;
    font-size: 12px;
    line-height: 12px;
    font-weight: 600;
}


.m-oldPrice {
    color: #a5a5a5;
    font-size: 10px;
    line-height: 10px;
    font-weight: 500;
    text-decoration: line-through;
    margin-top: 0.25rem;
    margin-bottom: 0.15rem;
}

.newPriceBaron {
    font-family: "Rubik", sans-serif;
}

.badgeAbsolute {
    position: absolute;
    top: 0;
    left: 0;
}

.badge64 {
    width: 64px;
}

.badge48 {
    width: 48px !important;
}

.badge40 {
    width: 40px !important;
}

.basketCountDiv {
    width: 18px;
    height: 18px;
    display: inline-block;
    border-radius: 50%;
    color: #fff;
    text-align: center;
    margin: auto;
}

.borderRadius4 {
    border-radius: 4px;
}

.borderRadius5 {
    border-radius: 5px;
}

.borderRadius6 {
    border-radius: 6px;
}

.borderRadius7 {
    border-radius: 7px;
}

.borderRadius8 {
    border-radius: 8px;
}
.whiteBorderedWrapper {
    width: 100%;
    position: absolute;
    bottom: 0;
    left: 0;
    text-align: left;
    padding: 0 3rem 3rem;
}
.whiteBorderedTitle {
    font: normal normal bold 18px / 25px Geologica;
    letter-spacing: 0px;
    color: #FFFFFF;
}
.whiteBorderedShortDesc {
    font: normal normal bold 37px / 49px Geologica;
    letter-spacing: 0px;
    color: #FFFFFF;
}
.whiteBorderedDesc {
    font: normal normal 200 14px / 19px Geologica;
    letter-spacing: 0px;
    color: #FFFFFF;
}
.whiteBorderedButtonWrapper {
    width: 100%;
    position: absolute;
    bottom: 15px;
    left: 0;
    text-align: center;
}

.whiteBorderedButton {
    width: fit-content;
    height: fit-content;
    display: inline-block;
    border-radius: 5px;
    font-family: "Rubik", sans-serif;
    font-weight: 600;
    font-size: 12px;
    line-height: 15px;
    letter-spacing: 0px;
    color: #ffffff;
    padding: 0.35rem 0.75rem;
}

    .whiteBorderedButton:hover {
        background-color: #ffffff !important;
    }

.blackBorderedButtonWrapper {
    width: 100%;
    position: absolute;
    bottom: 15px;
    left: 0;
    text-align: center;
}

.blackBorderedButton {
    width: fit-content;
    height: fit-content;
    display: inline-block;
    background: #ffffff 0% 0% no-repeat padding-box;
    border-radius: 5px;
    font-family: "Rubik", sans-serif;
    font-weight: 600;
    font-size: 14px;
    line-height: 12px;
    letter-spacing: 0px;
    color: #1D1D1B;
    padding: 0.35rem 1rem;
}

    .blackBorderedButton:hover {
        color: #ffffff;
    }

.sectionBoxIcons {
    width: 16px;
}

.sectionBoxAddButtonAbsoluteWrapper {
    position: absolute;
    top: -48px;
    right: 0;
}

.boxAddButton {
    width: 40px;
    height: 40px;
    color: #ffffff;
    font-family: "Rubik", sans-serif;
    font-weight: 600;
    font-size: 28px;
    line-height: 28px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-left: auto;
}

    .boxAddButton:hover {
        background-color: #1d1d1b;
        color: #fff;
    }

.sectionBoxText {
    max-height: 24px;
    overflow: hidden;
    font-size: 16px;
    line-height: 20px;
    font-weight: normal;
    color: #1d1d1b;
}

.sectionBoxTextPriceWrapper {
    width: 125%;
}

.sectionBoxPriceBig {
    font-size: 18px;
    font-weight: 600;
}

.sectionBoxPriceSmall {
    margin-top: 4px;
    font-size: 14px;
    font-weight: normal;
    color: #a4a4a4;
    text-decoration: line-through;
}

/*Desktop Index Start */
    /*Header Elements Start*/

.mediumCarouselCard {
    border: 1px solid #ddd; 
    border-radius: 8px; 
    overflow: hidden; 
    padding: 15px; 
    position: relative;
}

.headerFixed {
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    z-index: 1030;
    background-color: #fff;
    font-size: 12px;
    box-shadow: 0px 0px 30px #0000004F;
}

.headerGap {
    background-color: transparent;
}


.headerTopLeft {
    position: relative;
    height: 35px;
    display: block;
    padding-top: 14px;
    color: white;
    font-family: "Rubik", sans-serif;
    font-weight: normal;
    font-size: 10px;
    line-height: 10px;
}

    .headerTopLeft:before {
        position: absolute;
        content: "";
        top: 0;
        right: 0;
        width: 1000%;
        height: 100%;
        background-color: #1d1d1b;
        z-index: -1;
    }
.bgUnset {
        background:unset !important;
}
.bgUnset hr {
    border-bottom: 1px solid #FFFFFF;
    opacity: 0.1;
    margin:0;
}
.bgUnset .yemekOnProductContent {
    color: white;
    font: normal normal normal 12px / 16px Rubik;
    max-height:33px;
    height:unset;
}
.bgUnset .headerTopLeft {
    height: 44px;
    padding-top: 20px;
}
.bgUnset .headerButtons {
    color: white;
    background-color: transparent;
}
    .bgUnset .headerMenu {
    padding-top: 20px;
}
.headerProfileWrapper {
    display:flex;
    align-items:center;
    justify-content:space-evenly;
    cursor:pointer;
    border: 1px solid white;
    margin-top: -9px;
    padding: 5px;
    border-radius: 4px;
}
    .headerProfileWrapper .headerProfileIcon {
        margin: -1px 4px 0px 5px;
    }
    .bgUnset .headerTopLeft:before {
        background-color: transparent !important;
    }
    .headerTopRight {
    position: relative;
    height: 35px;
    color: #fff !important;
    width: 15%;
    flex: 0 0 13%;
    max-width: 15%;
    text-align: center;
    padding-right: 0;
    padding-left: 0;
    text-decoration:none;
}

    .headerTopRight:before {
        position: absolute;
        content: "";
        top: 0;
        left: 0;
        width: 1000%;
        height: 100%;
        z-index: -1;
    }

.headerProfileIcon {
    width: 16px;
    margin: -3px 4px 0px 5px;
}

.headerTopRightText {
    text-align: start;
    margin-left: 5px;
    display: block;
    padding-top: 14px;
    color: #fff;
    font-family: "Rubik", sans-serif;
    font-weight: normal;
    font-size: 10px;
    line-height: 12px;
}

.headerMenu {
    margin: 0;
    padding-top: 14px;
    color: #fff;
    font-family: "Rubik", sans-serif;
    font-weight: normal;
    font-size: 10px;
    line-height: 10px;
}

    .headerMenu li {
        list-style-type: none;
        float: right;
        margin: 0 8px;
    }

        .headerMenu li a {
            color: inherit;
            text-decoration: none !important;
        }

.headerLogoLink {
    display: block;
    color: inherit;
    text-decoration: none;
    outline: none;
    border: none;
}

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

.searchPanel {
    position: relative;
}
.emptyPanel150 {
    position: relative;
    max-width: 150px;
}


.searchResultDiv {
    overflow: hidden;
    display: none;
    position: absolute;
    width: 150%;
    top: 78%;
    left: 3%;
    z-index: 0;
    border-radius: 5px;
    border: 1px solid #70707033;
    background: white;
}
.searchResultB2BDiv {
    background: white;
    overflow: hidden;
    display: none;
    width: 100%;
    top: 100%;
    left: 0;
    position: absolute;
    border-bottom-right-radius: 17px;
    border-bottom-left-radius: 17px;
}

.backgroundCircle {
    position: absolute;
    top: 15%;
    left: 50%;
    width: 1000px;
    height: 599px;
    background-color: #f2f2f2;
    border-radius: 50%;
    transform: translateX(-50%);
    z-index: 1;
    pointer-events: none;
}

.searchResults {
    position: relative;
    z-index: 1;
    max-height: 500px;
    overflow-y: auto;
    padding: 1rem;
    overflow-x: hidden;
}

.beforeFooterDescScroll {
    height: 250px;
    overflow-x: hidden;
    overflow-y: scroll;
    text-align: justify;
}
.searchResultDiv .categoryNavButton {
    border: 1px solid #DDDDDD;
    border-radius: 18px;
    padding: 4px 15px
}
.searchResultRow {
    display: flex;
    align-items: center;
    cursor: pointer;
    background: white;
    border: 1px solid #dddddd;
    padding: 0.1rem 0.5rem;
    border-radius:10px;
    margin: 2px 0px;
}
.closeSearchBox {
    cursor: pointer;
    position: absolute;
    width: 18px;
    height: 18px;
    right: 20px
}
.closeMenuBox {
    cursor: pointer;
    position: absolute;
    width: 18px;
    height: 18px;
    right: 20px;
    font-size: 24px;
    top: 10px;
    fill: white;
}
.searchResultPrice {
    margin: auto;
    padding: 0.35em 0.65em;
    width: 100px;
    text-align: center;
    font-weight: 600;
    line-height: 1;
    color: #fff;
    border-radius: 0.25rem;
    font-size: 14px;
}

.searchResultText {
    padding-left:10px;
    font-size: 14px;
    width: 67%;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}


.searchResultImg {
    width: 60px;
    height: 60px;
    object-fit: contain;
}

.searchResultLink {
    text-align: center;
    text-decoration: none;
    font-size: 13px;
    font-weight: bold;
}

.mobileSearchResultDiv {
    display: none;
    position: absolute;
    width: 95%;
    top: 99%;
    left: 1%;
    background: #fff;
    z-index: 0;
    border-radius: 5px;
    border: 1px solid #70707033;
}

.mobileSearchResultRow {
    border-bottom: 1px solid #dddddd;
    margin: 0;
    padding: 0.5rem 0;
}

.mobileSearchResultPrice {
    display: inline-block;
    padding: 0.35em 0.65em;
    font-weight: 600;
    line-height: 1;
    color: #fff;
    text-align: center;
    border-radius: 0.25rem;
    font-size: 9px;
}

.mobileSearchResultText {
    font-size: 12px;
}

.mobileSearchResultLink {
    text-align: center;
    text-decoration: none;
    font-size: 12px;
    font-weight: bold;
}

.generalTextBox {
    width: 100%;
    height: 38px;
    padding: 5px;
    background: #ffffff 0% 0% no-repeat padding-box;
    border: 1px solid #70707033 !important;
    border-radius: 5px;
}
    .generalTextBox::placeholder{
        font-size:12px;
    }
    .twoColumnDiv {
        position: relative;
    }

    .twoColumnDiv:hover .twoColumnBackground {
        opacity: 0.5;
    }

.twoColumnImg {
    width: 100%;
    height: 300px;
    object-fit: cover;
}

.twoColumnBackground {
    mix-blend-mode: multiply;
    position: absolute;
    width: 95.5%;
    height: 100%;
    top: 0;
    opacity: 0;
    transition: all 0.3s ease;
}

@media (max-width:1400px) {
    .textBoxButtons {
        bottom: 27%;
        right: 7%;
    }
}
.relativeDiv .textBoxButtons {
    right: 7px;
    padding: 7px 14px;
    color: #012E5D !important;
    background-color: white !important;
    border-radius: 17px;
}
.relativeDiv .generalTextBox {
    height: 38px;
    padding: 15px;
    background: transparent;
    border: 1px solid #E5E5E5 !important;
    border-radius: 17px;
    color: white;
}

.relativeDiv .generalTextBox::placeholder {
    color:white;
}
.textBoxButtons {
    position: absolute;
    padding: 0.50rem;
    top: 50%;
    transform: translateY(-50%);
    right: 4.35%;
    border-radius: 5px;
    text-align: center;
    letter-spacing: 0px;
    color: #1d1d1b;
    background-color: #f1f1f1;
    z-index: 100;
    font-weight: bold;
    cursor: pointer;
    border: none !important;
    font-family: "Rubik", sans-serif;
    font-weight: 600;
    font-size: 12px;
    line-height: 16px;
}

    .textBoxButtons:hover {
        background-color: #1d1d1b;
        color: #fff;
    }
.relativeDiv .textBoxButtons:hover {
    background-color: #1d1d1b;
    color: unset;
}
.nutTextBoxButtons {
    position: absolute;
    padding: 0.40rem;
    bottom: 28%;
    left: 65%;
    border-radius: 5px;
    text-align: center;
    letter-spacing: 0px;
    color: #1d1d1b;
    background-color: #f1f1f1;
    z-index: 100;
    font-weight: bold;
    cursor: pointer;
    border: none !important;
    font-family: "Rubik", sans-serif;
    font-weight: 600;
    font-size: 12px;
    line-height: 16px;
}

    .nutTextBoxButtons:hover {
        background-color: #1d1d1b;
        color: #fff;
    }

.searchBoxButton {
    position: absolute;
    padding: 0.40rem;
    bottom: 28%;
    right: 3.5%;
    border-radius: 5px;
    text-align: center;
    letter-spacing: 0px;
    color: #1d1d1b;
    background-color: #f1f1f1;
    z-index: 100;
    font-weight: bold;
    cursor: pointer;
    border: none !important;
    font-family: "Rubik", sans-serif;
    font-weight: 600;
    font-size: 12px;
    line-height: 16px;
}

    .searchBoxButton:hover {
        background-color: #1d1d1b;
        color: #fff;
    }

.nutSearchBoxButton {
    position: absolute;
    padding: 0.50rem;
    top: 50%;
    transform: translateY(-50%);
    right: 4.5%;
    border-radius: 5px;
    text-align: center;
    letter-spacing: 0px;
    color: #1d1d1b;
    background-color: #f1f1f1;
    z-index: 100;
    font-weight: bold;
    cursor: pointer;
    border: none !important;
    font-family: "Rubik", sans-serif;
    font-weight: 600;
    font-size: 12px;
    line-height: 16px;
}

    .nutSearchBoxButton:hover {
        background-color: #1d1d1b;
        color: #fff;
    }

.headerLocationWrapper {
    position: relative;
    float: right;
}

.headerLocationExpanded {
    position: absolute;
    top: 14px;
    left: 3px;
    color: #fff;
    float: left;
    height: 34px;
    border-radius: 5px;
    text-align: center;
    padding: 3px 0;
    width: 0px;
    overflow: hidden;
    transition-property: width;
    transition-duration: 0.2s;
    transition-timing-function: linear;
    transition-delay: 0.1s;
}

.headerLocationWrapper:hover .headerLocationExpanded {
    width: 100%;
}

.headerBasketWrapper {
    position: relative;
    float: right;
}

.headerAllMenuWrapper {
    position: relative;
    float: right;
    margin-left:5px;
}

.headerBasketExpanded {
    position: absolute;
    top: 14px;
    left: 3px;
    color: #fff;
    height: 34px;
    padding: 3px 0;
    border-radius: 5px;
    text-align: center;
    width: 0px;
    overflow: hidden;
    transition-property: width;
    transition-duration: 0.2s;
    transition-timing-function: linear;
    transition-delay: 0.1s;
}

/* .headerBasketWrapper:hover .headerBasketExpanded{width: 90%;} */

.headerBasketWrapper:hover .headerBasketPopup {
    display: flex;
}

.headerBasketPopup {
    width: 280px;
    height: 390px;
    display: none;
    position: absolute;
    top: 65px;
    right: 1%;
    z-index: 1030;
    background-color: #fff;
    border: 1px solid #a5a5a5;
    border-radius: 4px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.headerBasketPopupArrow {
    width: 0;
    height: 0;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-bottom: 10px solid #a5a5a5;
    position: absolute;
    top: -10px;
    right: 14%;
}

.headerBasketPopupArrowInner {
    width: 0;
    height: 0;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    border-bottom: 8px solid #fff;
    position: absolute;
    bottom: -10px;
    right: -8px;
}

.headerBasketPopupContentWrapper {
    width: 100%;
    height: 300px;
    padding: 0 12px;
    overflow-x: hidden;
    overflow-y: auto;
}

.headerBasketPopupItem {
    width: 100%;
    margin: 5px 0;
    padding: 10px 0;
    border-bottom: 1px solid #ececec;
}

.headerBasketPopupImg {
    width: 72px;
    border-radius: 5px;
}

.headerBasketPopupItemHeader {
    height: 28px;
    font-size: 14px;
    line-height: 14px;
    font-weight: 600;
    color: #1d1d1d;
    width: 100%;
    margin-top: -2px;
    overflow: hidden;
}

.headerBasketPopupItemRow {
    font-size: 12px;
    line-height: 12px;
    font-weight: 600;
    color: #1d1d1d;
    width: 100%;
    height: 18px;
    overflow: hidden;
    margin-top: 0.5rem;
}


.headerBasketPopupGrayButton {
    width: 140px;
    padding: 8px 10px;
    margin: 0 0 0 12px;
    background-color: #a5a5a5;
}

    .headerBasketPopupGrayButton:hover {
        background-color: #1d1d1b;
        color: #fff;
    }

.headerBasketPopupButton {
    width: 100%;
    padding: 8px 10px;
    margin: 0 12px 0 12px;
}

    .headerBasketPopupButton:hover {
        background-color: #6eb356;
        color: #fff;
    }

.headerButtonExpText {
    display: flex;
    height: 100%;
    align-items: center;
    font-size: 12px;
    justify-content: center;
}

.headerButtons {
    width: auto;
    float: left;
    margin: 16px 5px;
    height: 34px;
    padding: 3px 3px;
    border-radius: 5px;
    text-align: center;
    letter-spacing: 0px;
    color: #1d1d1b;
    background-color: #f1f1f1;
    cursor: pointer;
    display: flex;
    justify-content: center;
    align-items: center;
}

.headerButtonText {
    font-family: "Rubik", sans-serif;
    font-weight: 400;
    font-size: 12px;
    line-height: 14px;
}

.headerButtonTextStrong {
    font-family: "Rubik", sans-serif;
    font-weight: 600;
    font-size: 12px;
    line-height: 12px;
    text-align: left;
}

.headerListWrapper:hover .headerButtonIcon {
    font-size: 17px;
}

.headerButtonIcon {
    float: left;
    font-size: 16px;
    margin: 2px;
    float: left;
    font-size: 21px;
    line-height: 1;
    margin-right: 0.25rem;
}

.headerBasketBadge {
    width: 16px;
    height: 16px;
    padding: 0;
    position: absolute;
    top: -5px;
    left: -20px;
    background-color: #ce0917;
    border-radius: 50%;
    color: white;
}

.headerButtonTextPanel {
    width: auto;
    float: left;
    margin-left: 5px;
}

.headerBottomMenu {
    overflow-y: hidden;
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 15px 0 0 0;
    color: #656565;
}

.headerBottomMenuList {
    list-style-type: none;
    float: left;
    margin: 0 8px 0 0;
    height: 100%
}

.headerBottomMenuLink {
    color: inherit;
    float: left;
    text-decoration: none !important;
    font-family: "Rubik", sans-serif;
    font-weight: normal;
    font-size: 12px;
    line-height: 16px;
    cursor:pointer;
}

.headerBottomMenuIcon {
    float: left;
    font-size: 6px;
    line-height: 10px;
    margin: 5px 10px 0 15px;
}

.headerBottomMenuWrapper {
    display: flex;
    align-items: center;
    background-color: #ffffff;
    border-top: 1px solid #00000012;
    height: 50px;
}

.headerBottomMenuExpanded {
    width: 100%;
    padding: 20px 12px;
    background-color: #f5f5f5;
    box-shadow: 0px 30px 30px #00000091;
    border-radius: 0px 0px 5px 5px;
    position: absolute;
    top: 100%;
    left: 0;
    display: none;
    transition: all 0.1s linear;
}
/*
.headerBottomMenu:hover {
    min-height: 200px;
}*/

.headerBottomMenuList:hover .headerBottomMenuExpanded {
    display: block;
    min-height: 200px;
}

.headerBottomMenuExpanded:hover {
    display: block;
    min-height: 200px;
}


.headerBottomButton {
    width: fit-content;
    height: 40px;
    border-radius: 5px;
    border: 1px solid !important;
    color: #fff;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.headerMenuIcon {
    transition-property: transform;
    transition-duration: 0.2s;
    transition-timing-function: linear;
    transition-delay: 0.1s;
    width: 35px;
}
/* .headerBottomButton:hover .headerMenuIcon{transform: rotate(-90deg); } */
.headerExpandenMenuHeadlines {
    margin-bottom: 0.5rem;
    width: 100%;
    font-size: 14px;
    text-transform: uppercase;
    font-weight: 600;
}

.headerLeftMenuWrapper {
    width: 60px;
    height: 40px;
    position: absolute;
    top: 0;
    right: 9.5%;
    z-index: 103;
    transition-property: width;
    transition-duration: 0.2s;
    transition-timing-function: linear;
    transition-delay: 0.1s;
    border-radius: 5px;
}

.headerLeftMenu {
    width: 0%;
    float: left;
    overflow: hidden;
    border-radius: 5px;
    text-align: center;
}

    .headerLeftMenu ul {
        margin: 0;
        padding: 3px 0;
        font-size: 14px;
        text-align: center;
        color: #fff;
        font-weight: lighter;
        display: inline-block;
    }
        /* .headerLeftMenuWrapper:hover {width: 82%;  height: 40px; z-index: 102;}
.headerLeftMenuWrapper:hover .headerLeftMenu {width: 100%;   height: 40px;} */

        .headerLeftMenu ul li {
            display: inline-block;
            list-style-type: none;
            margin: 8px 16px;
        }

            .headerLeftMenu ul li a {
                color: inherit;
                text-decoration: none !important;
            }

/*Header Elements End */

/*Slider Styles Start */
.pageContainer {
    padding-top: 1rem;
}
.pageContainerProduct {
    padding: 2rem 0;
}
.aboutPageDiv {
    overflow-x:hidden;
}
.carousel-control-next,
.carousel-control-prev {
    top: 0%;
}
/*Slider Styles End */

/*Anasayfa Login Popup Start */
.backgroundLock {
    width: 100%;
    height: 100%;
    min-height: 320px;
    background: rgb(44 44 44 / 0%);
    display: flex;
    justify-content: center;
    align-items: center;
}

.h-100vh{
    height:100vh;
}

.transparentPopup {
    height: fit-content;
    padding: 4%;
    background: rgb(0 0 0 / 25%);
    backdrop-filter: blur(20px);
    box-shadow: 0px 3px 20px #00000029;
    text-align: center;
    z-index: 2000;
}

.modalHideDiv {
    position: absolute;
    justify-content: center;
    align-items: center;
    top: 3%;
    right: 3%;
}

.modalHideButton {
    width: fit-content;
    font-size: 24px;
    text-align: end;
    margin-left: auto;
}

.loginTransparentButton {
    width: 100%;
    padding: 0.5rem;
    background-color: transparent;
    border: 1px solid #ffffff;
    color: #fff;
}

    .loginTransparentButton:hover {
        background-color: #fff;
        color: #1d1d1b;
    }

.loginButton {
    width: 100%;
    display: inline-block;
    padding: 0.75rem;
    color: #fff;
    font-size: 12px;
    font-weight: 600;
    line-height: 12px;
    border: 2px solid;
}

    .loginButton:hover {
        color: #fff;
    }

.loginWhiteButton {
    width: 100%;
    display: inline-block;
    padding: 0.75rem;
    background-color: #fff;
    color: #1d1d1b;
    font-size: 12px;
    font-weight: 600;
    line-height: 12px;
}

    .loginWhiteButton:hover {
        background-color: #fff;
        color: #1d1d1b;
    }

.noLoginButton {
    width: 100%;
    display: inline-block;
    padding: 0.75rem;
    background-color: black;
    color: #fff;
    font-size: 12px;
    font-weight: 600;
    line-height: 12px;
    border: 2px solid transparent;
}

    .noLoginButton:hover {
        background-color: #1d1d1b !important;
        color: #fff;
    }

.loginTextBox {
    width: 100%;
    height: 40px;
    padding: 6px 10px;
    background-color: transparent;
    border: 1px solid #ededed;
    border-radius: 4px;
    color: #fff;
}

.loginPhoneIcon {
    width: 64px;
}

.loginConfirmationTextBoxTransparent {
    width: 40px;
    height: 40px;
    padding: 5px;
    display: inline-block;
    background: transparent;
    text-align: center;
    border: 1px solid #dedede;
    border-radius: 4px;
    color: #fff;
}

.loginResendCode {
    color: #fff;
    text-decoration: underline;
    cursor: pointer;
}

.loginTransparentButtonIcon {
    width: 24px;
}
/*Anasayfa Login Popup End */

.itemScrollPanel {
    width: 100%;
    height: 100px;
    padding-bottom: 5px;
    overflow-y: hidden;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scroll-behavior: smooth;
    -webkit-overflow-scrolling: touch;
}

    .itemScrollPanel::-webkit-scrollbar {
        width: 10px;
        height: 6px;
        cursor: pointer;
    }

    .itemScrollPanel::-webkit-scrollbar-thumb {
        background: #bcbcbb;
        border-radius: 10px;
        cursor: pointer;
    }

    .itemScrollPanel::-webkit-scrollbar-track {
        background: transparent;
    }

.itemScrollCard {
    position: relative;
    padding: 0.5rem;
    margin: 0.5rem 0.75rem 0.75rem 0;
    border: 1px solid #dadada;
    border-radius: 4px;
}

.itemScrollTextDetail {
    width: 100%;
    font-size: 12px;
    line-height: 14px;
    color: #1D1D1B;
    height: 28px;
    overflow: hidden;
}

.itemScrollImg {
    width: 100%;
    height: 95px;
    object-fit: cover;
}

.itemScrollBadge {
    display: flex;
    justify-content: space-between;
    align-items: end;
    margin-top: 0.5rem;
    margin-left: 0.05rem;
}

.itemScrollBadgeText {
    padding: 0.5rem;
    background-color: #6eb356;
    color: #fff;
    border-radius: 4px;
    text-align: center;
    font-size: 12px;
    line-height: 12px;
    height: 40px;
    overflow: hidden;
}

.itemScrollBadge .productPriceDiv {
    justify-content: end;
    align-items: start;
}

.m-itemScrollBadge .productPriceDiv {
    justify-content: end;
    align-items: start;
}

.chanceTabBoxTextPriceWrapper .productPriceDiv {
    justify-content: end;
    align-items: start;
}
.chanceTabBoxTextPriceWrapper .newPrice {
    margin-bottom: 0rem !important;
}

.itemScrollOld {
    width: 100%;
    color: #a5a5a5;
    text-decoration: line-through;
    font-size: 12px;
}

.itemScrollNew {
    width: 100%;
    color: #CE0917;
    font-weight: 900;
    font-size: 13px;
    line-height: 13px;
    font-family: "Rubik", sans-serif;
}

.itemScrollAddToBasket {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 24px;
    height: 24px;
    padding: 5px;
    position: absolute;
    top: 36%;
    right: -10px;
    border-radius: 4px;
    cursor: pointer;
}

.mainPageSocialIconsWrapper {
    width: auto;
    height: auto;
    padding: 15px;
    position: fixed;
    bottom: 0;
    right: 1%;
    z-index: 1020;
    background-color: #fff;
    border-top-left-radius: 21px;
    border-top-right-radius: 21px;
}

.mainPageSocialLinks {
    display: inline-block;
    text-decoration: none;
    color: inherit;
}

.mainPageSocialIcons {
    width: 52px;
    display: inline-block;
}

.mainPageActiveOrdersButton {
    width: 52px;
    height: 52px;
    padding: 5px 0 0 0;
    background-color: #5f7bb2;
    border-radius: 50%;
    text-align: center;
    border: 1px solid transparent;
}


    .mainPageActiveOrdersButton:hover {
        background-color: #fff;
        color: #5f7bb2;
        border-color: #5f7bb2;
    }

        .mainPageActiveOrdersButton:hover .mainPageActiveOrdersText {
            color: #5f7bb2;
        }

        .mainPageActiveOrdersButton:hover .mainPageActiveOrdersBadge {
            background-color: #5f7bb2;
            color: #fff;
        }

.mainPageActiveOrdersText {
    width: 100%;
    height: 14px;
    line-height: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 5px;
}

.mainPageActiveOrdersBadge {
    width: auto;
    min-width: 16px;
    max-width: 32px;
    height: 16px;
    display: inline-block;
    border-radius: 50%;
    background-color: #fff;
    color: #5f7bb2;
    text-align: center;
}
/*Desktop Anasayfa End */

.generalMenu {
    margin: 0;
    padding: 0;
    font-size: 12px;
}

.generalMenuList {
    list-style-type: none;
    margin-top: 0.75rem;
}

.generalMenuLink {
    color: inherit;
    text-decoration: none !important;
}

.headlineImage {
    width: 100%;
    height: 170px;
    object-fit: cover;
}

.headlineTextDiv {
    margin-top: 0.5rem;
}

    .headlineTextDiv .productPriceDiv {
        align-items: start;
    }
    .headlineTextDiv .newPrice {
        margin-bottom: 0rem;
    }

    .priceText {
        font-size: 24px;
        font-weight: bold;
    }

.priceDecimalText {
    color: #6eb356;
    font-size: 16px;
    font-weight: bold;
}

.productNameText {
    color: #1d1d1b;
    font-size: 12px;
    line-height: 12px;
    font-weight: bold;
    text-decoration: none;
    height: 23px !important;
    display: block;
    overflow: hidden;
}

.prooductFeatureText {
    color: #1d1d1b;
    font-size: 12px;
    text-decoration: none;
}

.prooductAmountText {
    color: #1d1d1b;
    font-size: 8px;
}

.productButtonText {
    font-size: 8px;
    color: #fff;
    display: inline-block;
    margin: 5px 2px;
    background-color: #1d1d1b;
    border: 2px solid #1d1d1b;
}

.bestsellerCard {
    font-size: 8px;
    display: inline-block;
    margin: 8px 2px;
}

.productQuantityText {
    font-size: 14px;
    font-weight: 600;
    width: 50px;
    text-align: center;
    color: #1d1d1b;
    margin: 0px 5px;
    overflow: hidden;
}

.basketButtons {
    display: inline;
    font-size: 8px;
}

.basketIcons {
    font-size: 8px;
}

.roundedImages {
    border: 15px solid #fff;
    border-radius: 50%;
    transition: all 0.3s ease-out;
    width: 100%;
    object-fit: cover;
    background-color: #fff;
}

.roundedImageDiv {
    text-align: center;
    position: relative;
    z-index: 1;
}

    .roundedImageDiv::after {
        content: "";
        z-index: 0;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        width: 85%;
        height: 85%;
        border-radius: 50%;
        border: 3px solid #1d1d1b;
        opacity: 0;
        transition: all 0.3s ease-out;
    }

.roundedItem {
    margin-top: 1.5rem;
    margin-bottom: 1.5rem;
    transition: all 0.3s ease-out;
}

    .roundedItem:hover .roundedImageDiv::after {
        transform: translate(-50%, -60%);
        border: 3px solid #1d1d1b;
        width: 100%;
        height: 100%;
        opacity: 1;
    }

    .roundedItem:hover .roundedImages {
        transform: translateY(-15px);
    }

    .roundedItem:hover .roundedImageButtons {
        transform: translateY(-20px);
        background-color: #1D1D1B;
        color: #fff;
    }

.stickerHeaderDiv {
    position: absolute;
    left: -8%;
    top: -12%;
}

.stickerHeaderWrapper {
    width: 100%;
    height: 75%;
    position: relative;
}

.stickerHeaderImg {
    width: 64px;
    position: absolute;
    left: 54px;
    transform: rotate(1deg);
}

.stickerHeaderText {
    position: absolute;
    top: -42px;
    left: 9px;
    transform: rotate(-7deg);
    text-align: center;
    font-size: 16px;
    line-height: 16px;
    letter-spacing: 2px;
}

.nutStickerHeaderDiv {
    position: absolute;
    left: -8%;
    top: -4%;
}

.nutStickerHeaderWrapper {
    width: 100%;
    height: 75%;
    position: relative;
}

.nutStickerHeaderImg {
    width: 64px;
    position: absolute;
    left: 54px;
    transform: rotate(1deg);
}

.nutStickerHeaderText {
    position: absolute;
    top: -42px;
    left: 9px;
    transform: rotate(-7deg);
    text-align: center;
    font-size: 16px;
    line-height: 16px;
    letter-spacing: 2px;
}

.bg-f2f2f2 {
    background-color: #f2f2f2;
}
.bg-f4f4f4 {
    background-color: #f4f4f4;
}

.owl-next:hover,
.owl-prev:hover {
    background: unset !important;
    background: white !important;
}
.soloCarousel .owl-prev:hover i,
.soloCarousel .owl-next:hover i {
    color: #d7d7d7 !important;
}

.owl-prev {
    width: 40px !important;
    height: 40px !important;
    border-radius: 50% !important;
    border: 1px solid #a5a5a5 !important;
    background: white !important;
    position: absolute !important;
    left: -2% !important;
    top: 45% !important;
    transform: translateY(-50%) !important;
}

.owl-next {
    width: 40px !important;
    height: 40px !important;
    border-radius: 50% !important;
    border: 1px solid #a5a5a5 !important;
    background: white !important;
    position: absolute !important;
    right: -2% !important;
    top: 45% !important;
    transform: translateY(-50%) !important;
}

.product {
    display: block;
}

.roundedImageButtons {
    overflow:hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    width: 90%;
    display: inline-block;
    background-color: transparent;
    border: 2px solid #1d1d1b;
    color: #1d1d1b;
    font-size: 12px;
    line-height: 18px;
    font-family: "Rubik", sans-serif;
    font-weight: 600;
    transition: transform 0.3s ease-out, color 0.3s ease-out;
}

    .roundedImageButtons:hover {
        background-color: #1d1d1b;
        border: 2px solid #1d1d1d;
        color: #fff;
    }

.productQuantityIcon {
    text-decoration: none;
    font-size: 14px;
    background: #c8c8c8;
    color: #fff;
    width: 30px;
    height: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.chanceTabBasketText {
    color: #1d1d1b;
    font-size: 12px;
    font-weight: normal;
}

.sectionBoxHeader {
    width: 100%;
    height: 35px;
    padding: 5px;
    text-align: center;
    font-size: 12px;
    font-weight: normal;
    color: #ffffff;
    position: relative;
    cursor: pointer;
}

.chanceTabBoxHeaderBgOrange {
    background-color: #f1592a;
}

.chanceTabBoxArrowDownOrange {
    border-top: 10px solid #f1592a;
}

.chanceTabBoxHeaderBgGreen {
    background-color: #6eb356;
}

.chanceTabBoxArrowDownGreen {
    border-top: 10px solid #6eb356;
}

.chanceTabBoxHeaderBgBlue {
    background-color: #5f7bb2;
}

.chanceTabBoxArrowDownBlue {
    border-top: 10px solid #5f7bb2;
}

.chanceTabBoxHeaderBgPurple {
    background-color: #9271cb;
}

.chanceTabBoxArrowDownPurple {
    border-top: 10px solid #9271cb;
}

.chanceTabBoxHeaderBgRed {
    background-color: #ce0917;
}

.chanceTabBoxArrowDownRed {
    border-top: 10px solid #ce0917;
}

.chanceTabBoxArrowDown {
    width: 0;
    height: 0;
    display: none;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    position: absolute;
    bottom: -9px;
    left: 45%;
    border-top: 10px solid;
}

.sectionActiveMenu .chanceTabBoxArrowDown {
    display: block;
}

.sectionBoxHeader:hover .chanceTabBoxArrowDown {
    display: block;
}

.chanceTabText {
    width: 100%;
    font-family: "Rubik", sans-serif;
    font-weight: 600;
    font-size: 17px;
    line-height: 17px;
    color: #1d1d1b;
}

.chanceTabTextSmall {
    width: 100%;
    font-family: "Rubik", sans-serif;
    font-weight: 300;
    font-size: 14px;
    line-height: 14px;
}

.chanceTabBoxIcons {
    width: 16px;
}

.boxAddButtonDiv {
    position: absolute;
    top: -48px;
    right: 0;
    width: fit-content;
}

.smallBoxAddButton {
    width: 40px;
    height: 40px;
    background-color: #1d1d1b;
    color: #ffffff;
    font-size: 16px;
    line-height: 16px;
    font-weight: bold;
    display: flex;
    justify-content: center;
    align-items: center;
}

    .smallBoxAddButton:hover {
        background-color: #1d1d1b;
        color: #fff;
    }

.chanceTabItem {
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    height: 100%;
    position: relative;
}

.discountPercentTag {
    position: absolute;
    top: 0;
    right: 5%;
    width: 48px;
    height: 48px;
    display: flex;
    justify-content: center;
    align-items: center;
    background: url("../images/misc/blueBanner.png") 0 0 no-repeat;
    font-family: "Rubik", sans-serif;
    font-weight: normal;
    font-size: 12px;
    letter-spacing: 0px;
    color: #FFFFFF;
    opacity: 1;
    z-index: 1;
    text-align: center;
}

.freeCargoTag {
    position: absolute;
    top: 0;
    right: 5%;
    width: fit-content;
    height: fit-content;
    display: flex;
    justify-content: end;
    align-items: center;
    background: url(../images/misc/ribbon.png) 0 0 no-repeat;
    font-family: "Rubik", sans-serif;
    font-weight: normal;
    font-size: 12px;
    line-height: 12px;
    letter-spacing: 0px;
    color: #FFFFFF;
    opacity: 1;
    z-index: 1;
    text-align: center;
    padding: 0.5rem 0.25rem 0.5rem 1.5rem;
}

.newProductTag {
    position: absolute;
    top: 0;
    right: 5%;
    width: 48px;
    height: 48px;
    display: flex;
    justify-content: center;
    align-items: center;
    background: url("../images/misc/redBanner.png") 0 0 no-repeat;
    font-family: "Rubik", sans-serif;
    font-weight: normal;
    font-size: 12px;
    letter-spacing: 0px;
    color: #FFFFFF;
    opacity: 1;
    z-index: 1;
    text-align: center;
}

@media (max-width:992px) {
    .discountPercentTag {
        right: 0%;
    }

    .freeCargoTag {
        right: 0%;
    }

    .newProductTag {
        right: 0%;
    }
}

.chanceTabImage {
    width: 100%;
    height: 200px;
    object-fit: contain;
}

.chanceTabFiveScroll {
    width: 100%;
    overflow-y: hidden;
    overflow-x: auto;
    white-space: nowrap;
    padding: 0;
}

.orderCheckLabel {
    font-family: "Rubik", sans-serif;
    font-weight: 600;
    font-size: 13px;
    margin-left: 0.5rem;
}

.chanceTabFiveItem {
    width: 100%;
    height: 100%;
    padding-bottom: 1.5rem;
    background-color: #f5f5f5;
    border-radius: 7px;
    position: relative;
}

.smCarouselWithBackCard {
    width: 100%;
    height: 100%;
    padding-top: 1.5rem;
    padding-bottom: 1.5rem;
    background-color: #fff;
    border-radius: 7px;
    position: relative;
    border: 1px solid #1D1D1B4C;
}
.smCarouselWithBorderCard {
    width: 100%;
    height: 100%;
    padding-top: 1.5rem;
    padding-bottom: 1.5rem;
    background-color: #fff;
    border-radius: 7px;
    position: relative;
    border: 1px solid #1D1D1B4C;
}

.smCarouselWithBackCardTitle {
    font-weight: 700;
    font-size: 12px;
    line-height: 14px;
    color: #1d1d1b;
    text-align: center;
    padding: 0.25rem;
    margin-top: 0.5rem;
    height: 45px;
    overflow: hidden;
}

.smCarouselWithBackImg {
    width: 25px;
    height: 25px;
    margin-right: 0.5rem;
}

.smCarouselWithBackTitle {
    text-align: left;
    font-family: "Rubik", sans-serif;
    font-weight: 600;
    font-size: 18px;
    line-height: 22px;
    letter-spacing: 0px;
}

.smCarouselWithBackLink {
    text-decoration: none;
    text-align: right;
    font-family: "Rubik", sans-serif;
    font-weight: 600;
    font-size: 14px;
    line-height: 14px;
    letter-spacing: 0px;
}

.marketYellowBackground {
    background-color: #FFEE00 !important;
}

.marketBlueBackground {
    background-color: #005B92 !important;
}

.marketBlueBackground .smCarouselWithBackTitle {
    color: #FFEE00;
}

.marketBlueBackground .smCarouselWithBackLink {
    color: #FFEE00;
}

.marketYellowBackground .smCarouselWithBackTitle {
    color: #005B92;
}

.marketYellowBackground .smCarouselWithBackLink {
    color: #005B92;
}

.marketBlueBackground .generalBlackButton {
    background-color: #FFEE00 !important;
    border-color: #FFEE00 !important;
    color: #005B92 !important;
    font-weight: 600 !important;
}

.marketYellowBackground .generalBlackButton {
    background-color: #005B92 !important;
    border-color: #005B92 !important;
    color: #FFEE00 !important;
    font-weight: 600 !important;
}

.chanceTabHorizScroll {
    width: 100%;
    overflow-y: hidden;
    overflow-x: auto;
    white-space: nowrap;
    height: 315px;
}

.chanceTabHorizItem {
    width: 100%;
    border-radius: 7px;
}

.chanceTabHorizCard {
    display: flex;
    background-color: #f5f5f5;
    border-radius: 7px;
}

    .chanceTabHorizCard:not(:first-child) {
        margin-top: 1.75rem;
    }

.chanceTabFiveItemTitle {
    font-weight: 700;
    font-size: 14px;
    line-height: 14px;
    color: #1d1d1b;
    text-align: center;
    padding: 0.25rem;
    margin-top: 0.5rem;
}

.chanceTabColumn {
    display: none;
}

    .chanceTabColumn.activeTab {
        display: block !important;
    }

.chanceTabFiveColumn {
    display: none;
}

    .chanceTabFiveColumn.activeTab {
        display: block !important;
    }

.chanceTabHorizColumn {
    display: none;
    height: 100%;
    margin-bottom: auto;
}

    .chanceTabHorizColumn.activeTab {
        display: block !important;
    }

.chanceTabBoxText {
    margin: 2px 0 0 0;
    height: 26px !important;
    font-size: 14px;
    line-height: 14px;
    font-weight: bold;
    color: #1d1d1b;
    overflow: hidden;
}

.m-chanceTabBoxText {
    margin: 2px 0 0 0;
    height: 16px;
    font-size: 16px;
    line-height: 12px;
    font-weight: normal;
    color: #1d1d1b;
    overflow: hidden;
}

.chanceTabBoxTextPriceWrapper {
    width: 100%;
}

 

.chanceTabBoxPriceBig {
    margin-top: 6px;
    font-size: 15px;
    font-weight: 600;
    line-height: 16px;
    font-family: "Rubik", sans-serif;
    letter-spacing: 0px;
    color: #CE0917;
}

.chanceTabBoxPriceSmall {
    margin-top: 8px;
    margin-left: 0.25rem;
    font-size: 12px;
    font-weight: normal;
    color: #a4a4a4;
    text-decoration: line-through;
}

.chanceTabAllProdutsLink {
    padding: 10px 20px;
    border-radius: 50rem !important;
    text-decoration: none;
    color: #fff !important;
}

.promotionDetailPanel {
    background-color: #f5f5f5;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
}

.sliderImageWrapper {
    position: relative;
}

.sliderImageDiv {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    position: absolute;
    top: 0;
    right: 0;
    background: transparent linear-gradient(180deg, #000000ab 0%, #00000000 100%) 0% 0% no-repeat padding-box;
}

.videoBannerImage {
    width: 100%;
    height: 100%;
}

.sliderImageTitle {
    text-align: left;
    font-family: "Rubik", sans-serif;
    font-weight: normal;
    font-size: 40px;
    line-height: 60px;
    letter-spacing: 1.68px;
    color: #F8F8F8;
}

.sliderImageText {
    font-size: 20px;
    color: #f8f8f8;
    margin: 0px;
    font-weight: 300;
    text-align: center !important;
}

.sliderImageButton {
    display: block;
    letter-spacing: 0px;
    color: #ffffff;
    opacity: 1;
    background-color: transparent;
    font-size: 14px;
    font-weight: 700;
    border: 1px solid #ffffff;
    border-radius: 5px;
    width: 15%;
    margin-top: 1rem;
}

    .sliderImageButton:hover {
        background: #f8f8f8 0% 0% no-repeat padding-box;
    }

.sliderImageItalic {
    color: #fff;
    font-family: "Trully", sans-serif;
    font-weight: normal;
    font-size: 54px;
    line-height: 82px;
    margin-top: 2rem;
    display: block;
}

.sliderVideoDiv {
    width: 85%;
    padding: 12px;
    background: rgba(0, 0, 0, 0.2);
    mix-blend-mode: multiply;
    border-radius: 8px;
    opacity: 0.99;
}

.sliderPlayIconWrapper {
    width: 100%;
    position: absolute;
    top: 35%;
    left: 0;
    text-align: center;
}

.sliderPlayIcon {
    border: 4px solid white;
    border-radius: 70px;
    font-size: 60px;
    background-color: #fff;
}

.sliderVideoDiv:hover .sliderPlayIcon {
    font-size: 70px;
}

.zIndex1 {
    z-index: 1;
}

.videoSectionImg {
    border-radius: 8px;
    opacity: 0.7;
    transition-property: opacity;
    transition-duration: 0.5s;
    transition-timing-function: linear;
    transition-delay: 0.2s;
}

.sliderVideoDiv:hover .videoSectionImg {
    opacity: 1;
}

.section3ButtonWrapper {
    width: 100%;
    position: absolute;
    bottom: 15px;
    left: 0;
    text-align: center;
}

.section3Button {
    width: 100px;
    display: inline-block;
    background-color: transparent;
    border: 2px solid #1d1d1b;
    font-size: 12px;
}

    .section3Button:hover {
        background-color: #1d1d1b;
        color: #ffffff;
    }

.videoSectionBanner {
    width: 100%;
    height: 35px;
    display: flex;
    align-items: center;
}

.videoSectionBannerText {
    color: #ffffff;
    font-size: 12px;
}

.footerIcon {
    width: 25%;
    float: left;
}

.footerTextWrapper {
    width: 70%;
    float: left;
    margin-left: 5%;
    margin-top: 2%;
}

.footerTextHeader {
    width: 100%;
    float: left;
    margin-top: 10px;
    font-size: 10px;
    font-weight: bold;
    color: #1d1d1b;
}

.footerTextSpan {
    width: 100%;
    float: left;
    margin-top: 1px;
    font-size: 12px;
    font-weight: normal;
    color: #1d1d1b;
    text-decoration: none;
}

.footerGrayPanelText {
    display: block;
    font-size: 14px;
    font-weight: 600;
    color: #1d1d1b;
    line-height: 20px;
}

.footerGrayButton {
    width: 100%;
    background-color: #1d1d1b;
    padding: 10px 10px;
    border: 2px solid #1d1d1b;
    font-size: 14px;
    font-weight: 600;
    border-radius: 5px;
    color: #ffffff;
}

    .footerGrayButton:hover {
        background-color: #ffffff;
        color: #1d1d1b;
    }

.footerGrayTextBox {
    width: 100%;
    height: 44px;
    padding: 10px 10px;
    background-color: #ffffff;
    border: none;
    border-radius: 8px;
    font-size: 12px;
}

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

.m-footerLogoImg {
    width: 60%;
    height: auto;
}

.footerLogoText {
    margin: 20px 10px 10% 10px;
    text-align: center;
    color: #fff;
    font-size: 12px;
    font-weight: 400;
    letter-spacing: normal;
}

.footerSocialIconsWrapper {
    width: fit-content;
    margin: auto;
    text-align: center;
    border-radius: 20px;
    border: 1px solid #707070;
    background-color: #fff;
    padding: 0.25rem 1rem;
}

    .footerSocialIconsWrapper a {
        color: inherit;
        text-decoration: none !important;
    }

.footerSocialIcons {
    width: 28px;
    margin: 0 0.25rem;
    display: inline-block;
}


.footerAppIcons {
    width: 96px;
    margin-top: 20px;
}

.footerBottomPhone {
    width: 148px;
    margin-top: -15px;
}

.footerMenuHeader {
    font-size: 14px;
    color: #fff;
    text-transform: uppercase;
}

.footerMenu {
    margin: 20px 0 0 0;
    padding: 0;
}

    .footerMenu li {
        width: 100%;
        margin: 5px 0;
        font-size: 12px;
        color: #fff;
        list-style-type: none;
    }

.footerMenuContact li {
    margin: 12px 0 !important;
}

.footerMenu li a {
    color: inherit;
    text-decoration: none;
}

    .footerMenu li a:hover {
        text-shadow: 0 0 5px #fff;
    }

.footerContactIcons {
    width: 18px;
    height: 18px;
    display: block;
    float: left;
    padding: 4px 0 0 0;
    text-align: center;
    background-color: #fff;
    border-radius: 50%;
}

.footerBottom {
    border-top: 2px solid #fff;
    color: #fff;
}

.footerBottomCopyrightText {
    font-size: 12px;
}

.footerBottomLink {
    color: #fff;
    text-decoration: none;
    font-size: 12px;
}

    .footerBottomLink:hover {
        text-shadow: 0 0 5px #fff;
        color: #fff;
    }

.footerBottomSeperator {
    margin: 0 20px;
}

.page-content {

}
.bg-market {
    background: url(../images/pageBg.jpg) 0 10% no-repeat;
    background-position: top;
}

.pageNavigation {
    display: inline-block;
    width: 90%;
    color: #1d1d1b;
    font-size: 13px;
    padding-left: 0;
}

/* Desktop Login Start */
.loginPanel {
    background-color: #fff;
    border-radius: 8px;
    min-height: 200px;
}

#loginModalDiv .loginCard, #signInModalDiv .registerCard {
    padding: 0 !important;
}

.backgroundLock .loginCard, .backgroundLock .registerCard {
    background-color: inherit !important;
}

    .backgroundLock .loginCard:hover, .backgroundLock .registerCard:hover {
        box-shadow: none !important;
    }

.backgroundLock .loginPanelHeader {
    color: #fff !important;
}

.backgroundLock .loginPanelText {
    color: #fff !important;
}

.backgroundLock .loginControls {
    background: transparent !important;
    color: #fff;
    border: 1px solid #fff !important;
}

    .backgroundLock .loginControls::placeholder {
        color: #fff !important;
    }

    .backgroundLock .loginControls:focus-visible {
        outline: 1px solid #fff;
    }

#loginModalDiv .loginPanelHeader, #signInModalDiv .loginPanelHeader {
    text-align: center !important;
}
.webLogin .loginCard {
    padding: 1.5rem 3rem !important;
}
.loginCard {
    background-color: #fff;
    border-radius: 8px;
    padding: 0.5rem 2rem;
    width: 100%;
}

    .loginCard:hover {
        box-shadow: 0px 3px 30px #00000029;
    }

.registerCard {
    background-color: #fff;
    border-radius: 8px;
    padding: 0.5rem 2rem;
    height: 100%;
    width: 100%;
}

    .registerCard:hover {
        box-shadow: 0px 3px 30px #00000029;
    }

.loginPanelRow {
    width: 100%;
    margin-top: 20px;
}

    .loginPanelRow .loginControls {
        margin-bottom: 1rem;
        font-size: 14px;
    }

    .loginPanelRow .loginPanelForgotPassword {
        font-size: 14px;
        margin-bottom:1rem;
    }

    .loginPanelHeader {
        color: #1d1d1b;
        font-size: 18px;
        font-weight: bold;
    }

.loginPanelText {
    color: #1d1d1b;
    font-size: 16px;
}
.loginPanelDiv .loginPanelText {
    font-size: 12px;
}
.loginControls {
    font-size: 13px;
}

.loginPanelForgotPassword {
    float: right;
    font-size: 12px;
    letter-spacing: 0px;
}

.loginCheckbox {
    background: #ffffff 0% 0% no-repeat padding-box;
    border: 1px solid #707070;
    border-radius: 3px;
    margin-top: 2px;
}

.loginPanelButtons {
    width: 100%;
    display: inline-block;
    padding: 0.75rem;
    background-color: #1d1d1b;
    border: 2px solid #1d1d1b;
    color: #ffffff;
    font-size: 12px;
    font-weight: 600;
    line-height: 12px;
}

    .loginPanelButtons:hover {
        color: white;
    }

.loginPanelLink {
    text-decoration: none !important;
}

.loginPanelCancelButton {
    background-color: #bbbbba;
    border: 2px solid #bbbbba;
}

.loginPanelStartSubs {
    border: 2px solid;
    height: 40px;
    font-size: 15px;
}

.loginConfirmationTextBox {
    width: 40px;
    height: 40px;
    padding: 5px;
    display: inline-block;
    text-align: center;
    border: 1px solid #1b1b1b;
    border-radius: 4px;
}

.orderDetailItemList {
    list-style: none;
}

.orderDetailText {
    font-family: "Rubik", sans-serif;
    font-weight: normal;
    font-size: 12px;
    line-height: 12px;
    color: #1d1d1d;
    text-decoration: none;
}

.ship-free {
    width: fit-content;
    height: fit-content;
    font-family: "Rubik", sans-serif;
    font-weight: normal;
    font-size: 12px;
    line-height: 12px;
    color: #fff;
}

/*alert start*/


.notifyImgDiv {
    position: absolute;
    width: 70px;
    height: 70px;
    top: 9.25%;
    left: 1.75%;
}

.notifyImg {
    border-radius: 45px;
}
.modalAlertDiv {
    position: fixed;
    top: 10px;
    right: 10px;
    z-index: 1050;
}
.alert {
    padding: 0;
    border-radius: 45px;
    font-family: "Rubik", sans-serif;
    font-weight: normal;
    font-size: 15px;
    line-height: 15px;
    max-width: 400px;
    display: flex !important;
    align-items: center;
    z-index: 1056 !important;
}

[data-notify="icon"] {
    width: 85px;
    height: 85px;
    display: block;
    color: #fff;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    border-radius: 45px;
    flex: none;
}

[data-notify="message"] {
    padding: 0 0.5rem;
    display: flex;
    align-items: center;
}

.alert.alert-success {
    background: #6EB356 !important;
    color: #FFF !important;
    border: none;
}

    .alert.alert-success [data-notify="icon"] {
        background-image: url(../images/alert/success.svg);
        border: 10px solid #5A814C;
    }

.alert.alert-danger {
    background: #CE0917 !important;
    color: #FFF !important;
    border: none;
}

    .alert.alert-danger [data-notify="icon"] {
        background-image: url(../images/alert/danger.svg);
        border: 10px solid #842229;
    }

.alert.alert-warning {
    background: #FF8307 !important;
    color: #FFF !important;
    border: none;
}

    .alert.alert-warning [data-notify="icon"] {
        background-image: url(../images/alert/warning.svg);
        border: 10px solid #BE5F00;
    }

.alert.alert-info {
    background: #5F7BB2 !important;
    color: #FFF !important;
    border: none;
}

    .alert.alert-info [data-notify="icon"] {
        background-image: url(../images/alert/info.svg);
        border: 10px solid #28457E;
    }

.alert .close {
    color: #FFF;
    opacity: 1;
    text-shadow: none;
    font-weight: 400;
    font-size: 26px;
    background: transparent;
    border: none;
    margin-right: 0.5rem;
    margin-left: auto;
}

/* alerts end */

/* Desktop Login End */
/*Desktop Tüm Ürünler Start */
.categoryNav {
    display: flex;
    align-items: center;
    width: 100%;
    height: 55px;
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
}

    .categoryNav::-webkit-scrollbar {
        width: 10px;
        height: 4px;
        cursor: pointer;
    }

    .categoryNav::-webkit-scrollbar-thumb {
        background: #bcbcbb;
        border-radius: 10px;
        cursor: pointer;
    }

    .categoryNav::-webkit-scrollbar-track {
        background: transparent;
    }

.categoryNavButton {
    width: fit-content;
    font-size: 14px;
    font-weight: 600;
    padding: 6px 15px;
    margin: 5px 5px 0 0;
    background-color: #fff;
    border: 2px solid #1d1d1b;
    border-radius: 16px;
    color: #1d1d1b;
}
.productCategoryCarousel .owl-stage {
    display: flex !important;
    align-items: flex-start !important;
}

.productCategoryCarousel .owl-item {
    flex: 0 0 auto !important;
    margin: 0 1px !important;
    box-sizing: border-box !important;
}
    .categoryNavButton:hover {
        background-color: #000;
        border: 2px solid #000;
        color: #fff;
    }

.categoryNavButton-active {
    background-color: #000;
    border: 2px solid #000;
    color: #fff;
}

.categoryNavSearch {
    align-items: center;
    width: 100%;
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
}

    .categoryNavSearch::-webkit-scrollbar {
        width: 10px;
        height: 4px;
        cursor: pointer;
    }

    .categoryNavSearch::-webkit-scrollbar-thumb {
        background: #bcbcbb;
        border-radius: 10px;
        cursor: pointer;
    }

    .categoryNavSearch::-webkit-scrollbar-track {
        background: transparent;
    }

.categoryNavSearchButton {
    width: fit-content;
    font-size: 14px;
    font-weight: 600;
    padding: 6px 15px;
    margin: 5px 5px 0 0;
    background-color: #fff;
    border: 2px solid #1d1d1b;
    border-radius: 16px;
    color: #1d1d1b;
}

    .categoryNavSearchButton:hover {
        background-color: #000;
        border: 2px solid #000;
        color: #fff;
    }

.categoryNavSearchButton-active {
    background-color: #000;
    border: 2px solid #000;
    color: #fff;
}

.categorySubMenuWrapper {
    width: 100%;
    height: 910px;
    padding: 15px;
    border: 1px solid #1d1d1b1a;
    border-radius: 12px;
    color: #1d1d1b80;
}

.categorySubMenu {
    width: 100%;
    margin: 15px 0;
    padding: 10px 0 0 0;
    border-top: 1px solid #1d1d1b1a;
}

.mainColor a {
    color: inherit;
    text-decoration: none;
}

.categorySubMenuScrollablePanel {
    width: 100%;
    height: 100%;
    padding: 2px 2px 2px 0;
    overflow-y: auto;
}

    .categorySubMenuScrollablePanel::-webkit-scrollbar {
        width: 4px;
        height: 4px;
    }

    .categorySubMenuScrollablePanel::-webkit-scrollbar-thumb {
        background: #bcbcbb;
        border-radius: 10px;
        cursor: pointer;
    }

    .categorySubMenuScrollablePanel::-webkit-scrollbar-track {
        background: transparent;
    }

.categorySubMenuItem {
    width: 100%;
    display: block;
    margin: 3px 0;
    font-size: 13px;
    color: #1D1D1B;
    text-decoration: none !important;
}

.categoryTextBox {
    width: 46% !important;
    margin: 0 2% 0 0;
}

.categoryBadges {
    width: auto;
    display: inline-block;
    padding: 0.25rem 0.40rem;
    font-size: 11px;
    border-radius: 16px;
    color: #fff;
    margin-top: 0.25rem;
    text-decoration: none;
}

.productFav {
    cursor: pointer;
    font-size: 22px;
    text-decoration: none;
}

.productOptionDiv {
    display: flex;
    align-items: center;
    padding: 0.75rem 0;
}

    .productOptionDiv:not(:last-child) {
        border-bottom: 1px solid #ebebeb;
    }

.m-productOptionDiv {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1rem;
}

    .m-productOptionDiv:not(:last-child) {
        border-bottom: 1px solid #ebebeb;
    }

.stockOptionDiv {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.75rem 0;
}

    .stockOptionDiv:not(:last-child) {
        border-bottom: 1px solid #ebebeb;
    }

.m-stockOptionDiv {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1rem;
}

    .m-stockOptionDiv:not(:last-child) {
        border-bottom: 1px solid #ebebeb;
    }

    .productOption {
    text-align: left;
    font-family: "Rubik", sans-serif;
    font-weight: 600;
    font-size: 15px;
    line-height: 20px;
    letter-spacing: 0px;
    color: #173B07;
    opacity: 1;
}

.stockOptionDiv .productOption {
    width: 80px;
    flex-wrap: nowrap;
    white-space: nowrap;
}

.stockOptionDiv .newPrice {
    width: 80px;
    text-align: end;
}

.productOptionBasketButton {
    text-decoration: none;
    min-width: 122px;
    max-width: 165px;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 32px;
    font-size: 15px;
    line-height: 0;
    border-radius: 5px;
    font-family: "Rubik", sans-serif;
    font-weight: 500;
    letter-spacing: 0px;
    color: #fff;
    opacity: 1;
    white-space: nowrap;
}

    .productOptionBasketButton:hover {
        background: #1D1D1B 0% 0% no-repeat padding-box;
        color: #fff;
    }

.productOptionFavButton {
    display: block;
    width: fit-content;
    height: 30px;
    padding: 1rem 1.5rem;
    background: transparent 0% 0% no-repeat padding-box;
    border: 2px solid #1D1D1B;
    border-radius: 5px;
    text-align: center;
    font-family: "Rubik", sans-serif;
    font-size: 14px;
    font-weight: 400;
    line-height: 0;
    letter-spacing: 0px;
    color: #1D1D1B;
    opacity: 1;
}

.favListWrapper {
    position: relative;
    text-decoration: none;
    margin-left: 1rem;
}

    .favListWrapper:hover .favListExpanded {
        height: 100%;
    }

.favListExpanded {
    position: absolute;
    bottom: 0;
    left: 0;
    color: #fff;
    width: 100%;
    height: 0px;
    text-align: center;
    border-radius: 5px;
    transition-property: height;
    transition-duration: 0.2s;
    transition-timing-function: linear;
    transition-delay: 0.1s;
}

.removeCategoryLink {
    margin-right: 0.25rem;
    font-size: 12px;
    line-height: 12px;
    color: #ce0917;
}

.categoryBadgeOrange {
    background-color: #f1592a;
}

.categoryBadgeBlack {
    background-color: #1d1d1b;
}

.categoryBadgeGreen {
    background-color: #6eb356;
}

.categoryBadgeBlue {
    background-color: #5f7bb2;
}

.categoryBadgePurple {
    background-color: #420d9e;
}

.categoryBadgeMaroon {
    background-color: #a12900;
}

.categoryBadgeIcon {
    width: 12px;
    height: 12px;
    margin-right: 3px;
}

.categoryCheckBoxWrapper {
    width: auto;
    display: inline-block;
    padding: 0.50rem 0.75rem;
    background-color: #fff;
    border: 1px solid #1D1D1B1A;
    font-size: 12px;
    color: #1d1d1b;
    border-radius: 12px;
}

.categoryProductPanel {
    background-color: #f5f5f5;
    padding: 0.5rem;
    border-radius: 7px;
    position: relative;
    border: 1px solid transparent;
    transition: all 0.3s ease;
}

    .categoryProductPanel:hover {
        border: 1px solid #a5a5a573;
    }

.categoryCheckBox {
    width: 15px;
    height: 15px;
    background-color: #ffffff;
    border: 1px solid #707070;
    border-radius: 3px;
}

.categorySelectBox {
    background: #ffffff 0% 0% no-repeat padding-box;
    border: 1px solid #1D1D1B1A !important;
    color: #1d1d1b;
    border-radius: 12px;
    font-size: 12px;
    font-weight: 400;
    line-height: 1.5;
    transition: all .15s ease-in-out;
    padding: 0.50rem 0.75rem;
}

.chanceTabFiveMainPanel {
    overflow-y: hidden;
    background-color: #f5f5f5;
    border-radius: 7px;
}

.slideImage {
    width: 100%;
    height: 250px;
    object-fit: cover;
    border-radius: 5px;
}

.horizTabSlideImage {
    width: 100%;
    height: 230px;
    object-fit: cover;
    border-radius: 5px;
}

.chanceTabFiveSubPanel {
    height: 20vw;
    overflow-y: hidden;
}

.categoryProductImagesWrapper {
    cursor: pointer;
    position: relative;
    width: 100%;
    height: 250px;
    overflow: hidden;
}
.listSixView .categoryProductImagesWrapper {
    height: 130px !important;
}

.carouselImgOverlay,
.carouselHoverImg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    transition: transform 0.5s ease;
}

#productContainer {
    min-height: 0px;
    display: block;
}

.carouselHoverImg {
    transform: translateY(100%);
}

.categoryProductImagesWrapper:hover .carouselImgOverlay {
    transform: translateY(-100%);
}

.categoryProductImagesWrapper:hover .carouselHoverImg {
    transform: translateY(0);
}

.categoryProductImagesWrapper img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}
.categoryProductImages {
    width: 100%;
    border-top-left-radius: 7px;
    border-top-right-radius: 7px;
    height: 100%;
    object-fit: contain;
}

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

.productQuantityRow {
    align-items: center;
    justify-content: center;
}
.productDetailBasketDiv .productQuantityRow {
    justify-content:start !important;
}
.productQuantityDiv {
    cursor: pointer;
    width: fit-content;
    height: fit-content;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0;
    background-color: #fff;
    border: 1px solid #e5e5e5;
}

.categoryProductOldPrice {
    color: #1d1d1b;
    font-size: 12px;
}

.categoryProductPrice {
    font-family: "Rubik", sans-serif;
    font-size: 30px;
    font-weight: bold;
}

.categoryProductButtonText {
    width: fit-content;
    font-size: 14px;
    color: #fff;
    background-color: #1d1d1b;
    border: 2px solid #1d1d1b;
    height: 30px;
    padding: 0.5rem;
    line-height: 12px;
}

.categoryProductLeftBanner {
    width: 32px !important;
    height: 32px;
    position: absolute;
    top: 0px;
    left: 0px;
    z-index: 201;
}

.productDetailImageCarousel {
    display: flex !important;
    justify-content: center;
    margin-top: 1rem;
    margin-bottom: 1rem;
}

.categoryProductPromotionBanner {
    display: flex;
    justify-content: center;
    align-items: center;
    width: fit-content;
    position: absolute;
    top: 2%;
    left: 2%;
    z-index: 201;
    border-radius: 20px;
    padding: 0.1rem 0.5rem;
}

.categoryProductPromotionPercentage {
    font-size: 12px;
    font-weight: 600;
    border-radius: 20px;
    color: #ffffff;
}

.categoryNavigationButtons {
    padding: 5px 5px;
    margin: 0 0.10rem;
    display: inline-block;
    width: 40px;
    background-color: #e5e5e5;
    font-size: 12px;
    color: #1d1d1b;
    border-radius: 50%;
    text-align: center;
    cursor: pointer;
    border-radius: 2rem;
    text-decoration: none !important;
}

    .categoryNavigationButtons:hover {
        background-color: #a8a6a6;
    }

.categoryNavigationActive {
    color: #fff;
}

.categoryNavtigationAllPages {
    padding: 5px 10px;
    border-radius: 2rem;
    text-decoration: none;
    color: #fff !important;
    width: 80px;
    text-align: center;
}
/*Desktop Tüm Ürünler End */

.chanceTabHorizMainPanel {
    overflow-y: hidden;
    border-radius: 7px;
}

.chanceTabImageWrapper {
    position: relative;
    width: 40%;
}

.chanceTabHorizProductImages {
    display: inline-block;
    border-top-left-radius: 7px;
    border-bottom-left-radius: 7px;
    width: 100%;
    height: 135px;
    object-fit: cover;
}

.chanceTabHorizProductQuantityWrapper {
    width: 100%;
    position: absolute;
    bottom: 5px;
    left: 0;
    text-align: center;
}

.chanceTabHorizProductQuantity {
    height: 25px;
    padding: 2px 8px;
    display: inline-block;
    background-color: #fff;
    border-radius: 16px;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 85%;
    margin-right: auto;
    margin-left: auto;
}

.chanceTabHorizVistaCardPanel {
    background-color: #a12900;
    border-radius: 7px;
    height: 300px;
}

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

.chanceTabHorizVistaCardImg {
    width: 80%;
    display: inline-block;
}

/*Desktop Sepetim Start */

.basketPanel {
    background-color: #fff;
    border-radius: 8px;
    padding: 2.5rem;
    min-height: 200px;
}

.basketPanelIcon {
    font-size: 20px;
    color: #1d1d1b;
    margin: 0px 0.5rem;
}

.basketText {
    font-family: "Rubik", sans-serif;
    font-weight: normal;
    font-size: 18px;
    line-height: 18px;
}

.basketCountText {
    color: #1d1d1b;
    font-family: "Rubik", sans-serif;
    font-weight: bold;
    font-size: 18px;
    line-height: 18px;
}

.basketPanelRow {
    display: flex;
    align-items: center;
    /*margin: 0.5rem 0 0.5rem 0;*/
}

.basketPanelColumn {
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin: 0.5rem 0 0.5rem 0;
}

.basketPanelButtons {
    width: auto;
    padding: 3px !important;
    background-color: #b70814;
    border: 2px solid #b70814;
    font-size: 12px;
    color: #ffffff;
}

    .basketPanelButtons:hover {
        color: white;
        text-shadow: 0 2px 2px #ffffff;
    }

.basketWarningText {
    color: #ce0917;
    font-size: 12px;
}

.paymentMethodPanel {
    text-decoration: none;
    font-size: 12px;
}

.basketProductCard {
    padding: 20px;
    background-color: #f8f8f8;
    border-radius: 5px;
    margin-top: 1.5rem
}

.basketProductText {
    color: #1d1d1b;
    font-family: "Rubik", sans-serif;
    font-weight: bold;
    font-size: 12px;
    line-height: 12px;
}

    .basketProductText a {
        color: inherit;
        text-decoration: none;
    }

.basketProductDetailText {
    color: #656565;
    font-size: 12px;
    margin-top: 0.75rem;
}

.deleteIconRed {
    color: #ce0917;
}

.productPriceWrapper {
    font-size: 12px;
    font-weight: bold;
    color: #1d1d1b;
    text-align: start;
}
.m-basketSummaryCard .productPriceWrapper,
.basketProductCard .productPriceWrapper {
    text-align: right;
    width: 100%;
}
.basketProductCard .basketPanelRow .productPriceWrapper{
    text-align: start;
    width: unset;
}
    .basketTotalProductText {
        font-size: 12px;
        color: #1d1d1b;
        font-weight: bold;
    }

.basketTotalPriceText {
    font-family: "Rubik", sans-serif;
    font-size: 30px;
    font-weight: bold;
}

.generalButton {
    color: #ffffff;
}

    .generalButton:hover {
        color: #ffffff;
        text-shadow: 0 1px 2px #ffffff;
    }

.basketCancelButton {
    background-color: #bbbbba;
    color: #ffffff;
    font-size: 12px;
}

    .basketCancelButton:hover {
        background-color: #ce0917;
        color: #ffffff;
    }

.basketAddWishlistButton {
    background-color: transparent;
    border: 2px solid #1d1d1b;
    color: #1d1d1b;
    font-size: 12px;
}

    .basketAddWishlistButton:hover {
        background-color: #1d1d1b;
        color: #ffffff;
    }

.basketGreenPanel {
    padding: 8px;
    background-color: #6eb356;
    border-radius: 5px;
    font-size: 14px;
    color: #ffffff;
}

.basketPreAddedImage {
    width: 100%;
    border-radius: 5px;
}

.basketPreAddedText {
    color: #1d1d1b;
    font-size: 14px;
    font-weight: bold;
}

.basketPreAddedDetailText {
    color: #1d1d1b;
    font-size: 12px;
}

.basketDeliveryButton {
    background: #CE0917 0% 0% no-repeat padding-box;
    border-radius: 4px;
    padding: 0.25rem;
    text-align: left;
    letter-spacing: 0px;
    color: #FFFFFF;
    opacity: 1;
    font-family: "Rubik", sans-serif;
    font-weight: normal;
    font-size: 12px;
    line-height: 10px;
}

.basketDeliveryIcon {
    width: 20px;
    margin-right: -5px;
}

.basketInfoButtons {
    padding: 10px 10px 8px 10px;
    background-color: #828282;
    border: 2px solid #828282;
    font-size: 14px;
    color: #ffffff;
    border-radius: 4px 4px 0px 0px;
}

    .basketInfoButtons:hover {
        background-color: #000;
        border: 2px solid #000;
        font-size: 14px;
        color: #ffffff;
    }

.basketOrderDateInfoPanel {
    padding: 15px;
    border: 1px solid #6eb356;
    border-radius: 5px;
}

.basketChangeDateButton {
    padding: 3px 10px;
    border-radius: 50rem;
    border: none;
}

.basketPanelResultWrapper {
    padding: 5% 15%;
    background-color: #f8f8f8;
    border-radius: 5px;
}

.basketStarIcon {
    cursor: pointer;
}

.basketStarIconActive {
    color: #ffc107;
}

.basketStarIconHover {
    color: #ffc107;
}

/* Desktop Sepetim End */

.categoryPanel {
    padding: 40px;
    background-color: #fff;
    border-radius: 8px;
    min-height: 200px;
}

.categoryDetailImg {
    width: 100%;
    height: 250px;
    object-fit: contain;
    border-radius: 8px;
}

.m-navigationRow {
    align-items: center;
    height: 45px;
    background: #FFFFFF 0% 0% no-repeat padding-box;
    box-shadow: 0px 2px 2px #00000029;
    margin-bottom: 0.5rem;
}

.m-categoryDetailImg {
    width: 100%;
    height: 175px;
    object-fit: contain;
    border-radius: 8px;
}

@media (min-width:576px) and (max-width:992px) {
    .m-categoryDetailImg {
        height: 600px;
    }
}

.productDetailPriceDiv {
    align-items: end;
    margin-top: 0.5rem;
    margin-bottom: 0.5rem;
}

    .productDetailPriceDiv .productPriceDiv {
        align-items: start;
        justify-content: end;
    }

    .productDetailPriceDiv .oldPrice {
        font-size: 15px;
        line-height: 22px;
    }

    .productDetailPriceDiv .newPrice {
        font-size: 20px !important;
        line-height: 22px;
    }

.productGridCard .oldPrice {
    font-size: 12px;
}

.productGridCard .newPrice {
    font-size: 18px;
}

.productDetailBasketDiv {
    align-items: center;
    margin-top: 1rem;
    margin-bottom: 0.5rem;
}

    .productDetailBasketDiv .generalBlackButton {
        padding: 0;
        font-size: 15px;
        line-height: 0;
    }

    .productDetailBasketDiv .addBasketRow {
        justify-content: start;
    }
.addBasketRow .headerProfileWrapper {
    margin-top: 0;
    padding: 4px !important;
}
    .addBasketRow .headerProfileWrapper:hover {
        background-color: white;
    }
    .addBasketRow .headerProfileWrapper:hover span {
        color: black !important;
    }
        .addBasketRow .headerProfileWrapper:hover .headerButtonIcon {
            color: black !important;
        }
    .payMethodPriceDiv {
        width: 100%;
        height: fit-content;
        background: #F8F8F8 0% 0% no-repeat padding-box;
        border-radius: 8px;
        padding: 0.25rem 0.5rem;
    }

.payMethodPriceItem {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.payMethodPriceTitle {
    font-family: "Rubik", sans-serif;
    font-weight: normal;
    font-size: 14px;
    line-height: 14px;
    color: #1D1D1B;
}

.payMethodPriceText {
    font-family: "Rubik", sans-serif;
    font-weight: normal;
    font-size: 16px;
    line-height: 16px;
    color: #CE0917;
}

.categoryDetailThumbImg {
    width: 100%;
    height: 85px;
    object-fit: contain;
    border-radius: 8px;
    cursor: pointer;
}

    .categoryDetailThumbImg:not(:first-child) {
        margin-top: .5rem;
    }

.categoryStarColor {
    color: #fbb000;
}

.categoryOldPrice {
    color: #1d1d1b;
}

.categoryNewPrice {
    font-size: 24px;
    font-family: "Rubik", sans-serif;
    font-weight: bold;
}

.productDetailTitle {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 0.50rem;
    padding-bottom: 0.50rem;
    /*border-bottom: 1px solid #ebebeb;*/
}

.categoryAddWishList {
    background-color: transparent;
    border: 1px solid #1d1d1b;
    color: #1d1d1b;
    font-size: 12px;
}

    .categoryAddWishList:hover {
        background-color: #1d1d1b;
        color: #ffffff;
    }

.categoryBlackButton {
    width: 110px;
    background-color: #1d1d1b;
    border: 1px solid #1d1d1b;
    font-size: 12px;
    color: #ffffff;
}

.categoryDetailHeader {
    padding: 20px 20px 10px 20px;
    text-align: center;
    text-transform: uppercase;
    font-size: 12px;
    font-weight: bold;
    color: #1d1d1d;
    cursor: pointer;
    text-decoration: none;
    display: block;
    width: 100%;
}

.categoryDetailHeaderActive {
    background-color: #f5f5f5;
}

.categoryDetailPanel {
    padding: 3% 10%;
    background-color: #f5f5f5;
    display: none;
}

.categoryDetailPanelActive {
    display: block;
}

.settingsPanel {
    min-height: 200px;
    background-color: #fff;
    border-radius: 8px;
    padding: 2.5rem;
}

.productsPanel {
    min-height: 200px;
    background-color: #fff;
    border-radius: 8px;
    padding: 20px;
}

.productDetailPanel {
    min-height: 200px;
    background-color: #fff;
    border-radius: 8px;
    padding: 2.5rem;
    padding-top: 20px;
}

.shareIcon {
    color: #b3b3b3;
    font-size: 24px;
}

.m-productDetailTitle {
    border-radius: 4px;
    background-color: #F2F2F2;
    padding: 1rem;
    margin-top: 0.75rem;
}

.settingsPanelIcon {
    font-size: 20px;
    color: #1d1d1b;
    margin: 5px 20px 0 0;
}

.settingsPanelImageIcon {
    width: 35px;
}

.settingsPanelRow {
    margin: 2px 0;
}

.settingsValidationMessagePanel {
    color: #d80027;
}

.settingsMenu {
    width: 200px;
    padding: 0;
    margin: 0;
    color: #1d1d1b;
    border-right: 1px solid #e9e9e9;
}

    .settingsMenu li {
        margin: 20px 0;
        list-style-type: none;
        font-size: 12px;
        font-weight: bold;
    }

        .settingsMenu li a {
            text-decoration: none !important;
            color: #1d1d1d;
        }

.settingsMenuListIcon {
    margin: 0 25px 0 15px;
}

.settingsMenuImage {
    width: 180px;
}

.settingsMenuAbsoluteItem {
    position: absolute;
    top: 0;
    left: 0;
    color: #ffffff !important;
    font-weight: normal;
}

.settingsPanelBasket {
    color: #1d1d1b;
    font-size: 12px;
    line-height: 12px;
}

.settingsPanelBasketIcon {
    font-size: 20px;
    margin: 0 5px;
}

.settingsBasketButton {
    border: 2px solid;
    font-size: 12px;
    color: #ffffff;
}

    .settingsBasketButton:hover {
        color: #fff;
        text-shadow: 0 0 5px #fff;
    }

.settingsPanelBasketBadge {
    width: 16px;
    height: 16px;
    padding: 2px;
    position: absolute;
    top: -5px;
    left: -20px;
    color: #ffffff;
    font-size: 8px;
    font-weight: normal;
    text-align: center;
    border-radius: 50%;
}

.settingsLabel {
    width: 100%;
    color: #1d1d1b;
    font-size: 12px;
    font-weight: bold;
    text-align: left;
}

.settingsButton {
    padding: 6px 10px 6px 10px;
}

.settingsTextBox {
    width: 100%;
    height: 34px;
    padding: 5px 10px;
    background: #ffffff 0% 0% no-repeat padding-box;
    border: 1px solid #70707033 !important;
    border-radius: 5px;
    font-size: 12px;
}
    .settingsTextBox::placeholder {
        color: #b2b2b2
    }
.settingsTextArea {
    width: 100%;
    height: auto;
    padding: 10px 10px;
    background: #ffffff 0% 0% no-repeat padding-box;
    border: 1px solid #70707033 !important;
    border-radius: 5px;
    font-size: 12px;
}

    .settingsTextArea:hover {
        border: 1px solid #6eb356 !important;
    }

    .settingsTextArea:focus {
        border: 1px solid #6eb356 !important;
        outline: none !important;
    }

.settingsTextBox:hover {
    border: 1px solid #6eb356 !important;
}

.settingsTextBox:focus {
    border: 1px solid #6eb356 !important;
    outline: none !important;
}

.settingsSelectBox {
    height: 34px;
    padding: 5px 10px;
    background: #ffffff 0% 0% no-repeat padding-box;
    border: 1px solid #70707033 !important;
    border-radius: 5px;
    font-size: 12px;
}

.settingsCheckBox {
    width: 20px;
    height: 20px;
    background: #ffffff 0% 0% no-repeat padding-box;
    border: 1px solid #707070;
    border-radius: 3px;
    margin-top: 2px;
}

.settingsLink {
    color: #5f7bb2 !important;
    text-decoration: none !important;
}

.helpCenterPanel {
    min-height: 200px;
    background-color: #fff;
    border-radius: 8px;
    padding: 2.5rem 5rem;
}

.payMethodPanel {
    padding-left: 3rem;
}

.myAccountPanel {
    padding-left: 3rem;
}

.articleDetailPanel {
    min-height: 200px;
    background-color: #fff;
    border-radius: 8px;
    padding: 2.5rem 5rem;
}

.accountPanel {
    min-height: 200px;
    background-color: #fff;
    border-radius: 8px;
    padding: 2.5rem;
}
.bgUnset .accountPanel {
    margin: 2rem 0;
    box-shadow: 0px 0px 30px #0000004F;
}
.addressPanelWrapper {
    padding: 10px;
    border: 1px solid #6eb356;
    border-radius: 5px;
    height: 129px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    position:relative;
}

    .addressPanelWrapper:hover::after {
        content: "";
        position: absolute;
        bottom: 0;
        left: 0;
        width: 100%;
        height: 65%;
        background-color: #e2e2e2;
        z-index: -1;
    }

.addressPanelActive {
    box-shadow: 0px 3px 20px #00000029;
}

.addressPanelText {
    width: 100%;
    display: flex;
    color: #1d1d1b;
    font-size: 12px;
    height: 57px;
    overflow: hidden;
}

.addressPanelSubText {
    width: 100%;
    display: flex;
    color: #1d1d1b;
    font-size: 10px;
}

.shippingCard {
    position: relative;
    display: flex;
    align-items: center;
    border: 1px solid #6eb356;
    border-radius: 5px;
    padding: 1.5rem;
}

.shippingCardActive {
    box-shadow: 0px 3px 20px #00000029;
}

.shipTimeCard {
    position: relative;
    display: flex;
    align-items: center;
    border: 1px solid #6eb356;
    border-radius: 5px;
    box-shadow: 0px 3px 20px #00000029;
    padding: 1.5rem;
    z-index: 99999 !important;
}

.shipTimeText {
    font-family: "Rubik", sans-serif;
    font-weight: normal;
    font-size: 12px;
    line-height: 16px;
    letter-spacing: 0px;
    color: #A5A5A5;
}

.shipTimeInput {
    background-color: #F1592A;
    border-radius: 12px;
    font-family: "Rubik", sans-serif;
    font-weight: 400;
    font-size: 12px;
    line-height: 12px;
    letter-spacing: 0px;
    color: #FFFFFF;
    padding: 0.25rem 0.5rem;
    text-decoration: none;
    border: 1px solid #F1592A;
    text-align: center;
    width: 100%;
}

    .shipTimeInput:focus {
        outline: none; /* Focus halinde dış çizgiyi kaldır */
    }

.payMethodCard {
    padding: 0.5rem;
    cursor: pointer;
    background: #FFFFFF 0% 0% no-repeat padding-box;
    border: 1px solid #6EB356;
    border-radius: 7px;
    width: 100%;
    height: 100px;
    overflow: hidden;
    text-decoration: none;
}

.activePayMethod {
    border: 1px solid #6eb356;
    border-radius: 5px;
    box-shadow: 0px 3px 20px #00000029;
}

.newAddressPanel {
    width: 100%;
    height: 100%;
    cursor: pointer;
    background: #FFFFFF 0% 0% no-repeat padding-box;
    border: 1px solid #6EB356;
    border-radius: 7px;
    height: 129px;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
    text-decoration: none;
}

.orderBoxWrapper {
    padding: 1rem;
    background-color: #fff;
    box-shadow: 0px 3px 20px #00000029;
    border-radius: 5px;
    border: 1px solid var(--unnamed-color-6eb356);
}

.orderBox {
    padding: 12px 0;
    background-color: #fff;
    border-bottom: 1px solid #f1f1f1;
}

.orderBoxWrapperAlternative {
    padding: 0;
}

.orderBoxAlternative {
    padding: 15px 20px;
    margin: 10px 0;
    background-color: #fff;
    box-shadow: 0px 3px 20px #00000029;
    border-radius: 5px;
}

.orderBoxBorderGreen {
    border: 1px solid #6eb356;
}

.orderBoxBorderRed {
    border: 1px solid #ce0917;
}

.orderBoxLine {
    width: 50px;
    height: 1px;
    margin: 0 5px;
    background-color: #a5a5a5;
}

.orderLineGray {
    background-color: #a5a5a5;
}

.orderLineOrange {
    background-color: #f1592a;
}

.orderLineGreen {
    background-color: #6eb356;
}

.orderCircleGray {
    color: #a5a5a5;
}

.orderCircleBorderOrange {
    border: 1px solid #f1592a;
    padding: 2px;
    border-radius: 50%;
    font-size: 14px;
}

.orderCircleBorderTransparent {
    padding: 2px;
}

.orderCircleGreen {
    color: #6eb356;
}

.orderCircleBorderGreen {
    border: 1px solid #6eb356;
    padding: 2px;
    border-radius: 50%;
    font-size: 14px;
}

.orderCircleRed {
    color: #ce0917;
}

.orderCircleBorderRed {
    border: 1px solid #ce0917;
    padding: 2px;
    border-radius: 50%;
    font-size: 14px;
}

.orderStatusButton {
    min-width: 120px;
    padding: 2px 10px;
    border-radius: 50rem;
    cursor: pointer;
}

    .orderStatusButton:hover {
        color: #1d1d1b;
        border-color: #1d1d1b;
    }

.orderStatusGray {
    background-color: #828282;
    color: #fff;
}

.orderStatusOrange {
    background-color: #f1592a;
    color: #fff;
}

.orderStatusGreen {
    background-color: #6eb356;
    color: #fff;
}

.orderStatusRed {
    background-color: #ce0917;
    color: #fff;
}

.orderInfoButton {
    padding: 6px 10px;
    margin: 0 0 0 8px;
    border-radius: 50rem;
}

.ordersGrayButton {
    background-color: #f2f2f2;
    color: #828282;
}

    .ordersGrayButton:hover {
        background-color: #828282;
        color: #fff;
    }

.ordersGreenButton {
    background-color: #6eb3562e;
    color: #6eb356;
}

    .ordersGreenButton:hover {
        background-color: #6eb356;
        color: #fff;
    }

.ordersRedButton {
    background-color: #ce091712;
    color: #ce0917;
}

    .ordersRedButton:hover {
        background-color: #ce0917;
        color: #fff;
    }

.orderBadge {
    width: 36px;
    height: 22px;
    border-top-right-radius: 12px;
    border-bottom-right-radius: 12px;
    color: #fff;
}

.orderBadgeGray {
    background-color: #a5a5a5;
}

.orderBadgeGrayText {
    color: #828282;
}

.orderBadgeGreen {
    background-color: #6eb356;
}

.orderBadgeGreenText {
    color: #6eb356;
}

.orderBadgeRed {
    background-color: #ce0917;
}

.orderBadgeRedText {
    color: #ce0917;
}

.orderNumberWrapper {
    padding: 4px 5px 2px 5px;
    background-color: #c1c1c1;
    font-size: 12px;
}

.orderProductImage {
    width: 32px;
    margin-left: 10px;
    border-radius: 8px;
    box-shadow: 0px 4px 6px #00000029;
}

.orderProductCountText {
    color: #a5a5a5;
    font-size: 12px;
}

.orderProductPriceText {
    color: #ce0917;
    font-size: 12px;
    font-weight: bold;
}

.favoriteBox {
    padding: 12px;
    margin: 5px 0;
    background-color: #f8f8f8;
    border-radius: 4px;
}

.favoriteCheckBox {
    display: none;
}

    .favoriteCheckBox + label {
        margin-right: 10px;
        padding-left: 25px;
        position: relative;
        cursor: pointer;
        border: 1px solid transparent;
    }

        .favoriteCheckBox + label:before {
            content: "";
            position: absolute;
            left: -10px;
            top: 37%;
            width: 25px;
            height: 25px;
            border: 1px solid #A5A5A5;
            border-radius: 3px;
            background-color: #fff;
        }

    .favoriteCheckBox:checked + label:before {
        border-color: #F1592A;
        background-color: #F1592A;
    }

    .favoriteCheckBox:checked + label:after {
        position: absolute;
        content: "\f164";
        color: white;
        font-size: 1rem;
        font-weight: 900;
        font-family: "Font Awesome 6 Free";
        left: -5px;
        top: 48%;
        animation-name: up;
        animation-duration: 0.5s;
        animation-fill-mode: forwards;
        opacity: 0;
    }

    .favoriteCheckBox:checked + label {
        border: 1px solid #F1592A;
    }

.customFileUpload {
    display: none;
}

.customFileUploadLabel {
    background-color: #5F7BB2;
    color: #fff;
    border-radius: 5px;
    padding: 0.5rem;
    font-size: 12px;
    cursor: pointer;
}

.customFileSpan {
    font-family: "Rubik", sans-serif;
    font-weight: normal;
    font-size: 13px;
    margin-bottom: 0.40rem;
    margin-left: 1rem;
    margin-left: 1rem;
}

@keyframes up {
    50% {
        opacity: 1;
    }

    100% {
        transform: translateY(-12px);
        opacity: 1;
    }
}

.favoriteImage {
    width: 100%;
    height: 90px;
    object-fit: contain;
    box-shadow: 0px 10px 12px -15px #111;
}

.favoriteProductName {
    font-size: 12px;
    font-weight: bold;
}

.favoriteProductOldPrice {
    font-size: 12px;
    text-decoration: line-through;
    color: #a5a5a5;
}

.favoriteProductNewPrice {
    font-size: 16px;
    color: #ce0917;
    font-weight: bold;
}

.favoriteRemoveItem {
    width: fit-content;
    height: 20px;
    margin-left: auto;
}

.favoriteRemoveItemText {
    color: #a5a5a5;
    font-size: 12px;
    float: right;
}

.favoriteRemoveItemIcon {
    position: absolute;
    z-index: 1;
    top: -2%;
    right: 2%;
    color: #ce0917;
    font-size: 22px;
}

.cardHeader {
    color: #1d1d1b;
    font-size: 12px;
}

.cardPanel {
    padding: 10px;
    min-height: 100px;
    margin: 5px 0;
    border: 1px solid #a5a5a5;
    border-radius: 5px;
}

.cardPanelActive {
    border: 1px solid #6eb356;
    box-shadow: 0px 3px 20px #00000029;
    border-radius: 5px;
}

.cardNameText {
    font-size: 12px;
    font-weight: bold;
    color: #1d1d1b;
}

.cardEditText {
    font-size: 12px;
    color: #656565;
    cursor: pointer;
}

    .cardEditText:hover {
        color: #6eb356;
    }

.cardNumberText {
    font-size: 12px;
    color: #6eb356;
}

.cardLogo {
    width: 34px;
    height: 11px;
}

.cardRemoveItem {
    width: 100%;
}

.cardRemoveItemText {
    color: #a5a5a5;
    font-size: 12px;
    float: right;
}

.cardRemoveItemIcon {
    color: #ce0917;
    font-size: 16px;
    float: right;
    margin: 1px 5px;
}

.cardEditPanel {
    margin: 5% 0;
}

.cardAddInfo {
    padding: 7px 10px;
    background-color: #6eb356;
    border-radius: 5px;
    color: #fff;
    text-align: center;
}

/*Desktop Kampanyalar Start*/
.campaignBoxMedium {
    width: 100%;
    height: 33vh;
    margin: 1vh 0;
    background-size: cover;
    background-position: 50% 50%;
    background-repeat: no-repeat;
}

.campaignBoxSmall {
    width: 100%;
    height: 16vh;
    margin: 1vh 0;
    background-size: cover;
    background-position: 50% 50%;
    background-repeat: no-repeat;
}
/*Desktop Kampanyalar End*/

/*Mobile Kampanyalar Start*/
.m-campaignBoxMedium {
    width: 100%;
    height: 21vh;
    margin: 1vh 0 0 0;
    background-size: cover;
    background-position: 50% 50%;
    background-repeat: no-repeat;
}

.m-campaignBoxSmall {
    width: 100%;
    height: 10vh;
    margin: 1vh 0 0 0;
    background-size: cover;
    background-position: 50% 50%;
    background-repeat: no-repeat;
}
/*Mobile Kampanyalar End*/

/* Desktop Yardım Merkezi Start */
.helpCenterContentPanel {
    padding: 20px 40px;
    background-color: #f8f8f8;
}

.helpCenterButton {
    padding: 10px 10px;
    background-color: #f8f8f8;
    border-radius: 5px;
    font-size: 12px;
    font-weight: 400;
    color: #1d1d1b;
    cursor: pointer;
    text-decoration: none;
    width: 100%;
    display: block;
}

    .helpCenterButton.activeHelpCenterButton {
        background-color: #1D1D1B;
        color: #fff;
    }

    .helpCenterButton:hover {
        background-color: #e8e8e8;
        color: #1d1d1b;
    }

.helpCenterButtonActive {
    background-color: #1d1d1b;
    color: #fff;
}
/* Desktop Yardım Merkezi End */
/* Carousel Images Start */

.xsProductCarousel .productPriceDiv {
    font-family: "Baron Neue Bold", sans-serif !important;
    font-size: 20px !important;
}

.xsCarouselText {
    display: block;
    width: 100%;
    height: 30px;
    overflow: hidden;
    color: #1d1d1b;
    font-size: 15px;
    line-height: 15px;
}

.xsCarouselItem {
    position: relative;
    background-color: #F5F5F5;
    border-radius: 7px;
    padding: 1rem;
    margin-bottom: 1.5rem;
}

.xsCarouselImgDiv {
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 24px;
    font-weight: bold;
    position: relative;
    transform-origin: 0 0;
    overflow: hidden;
    margin: 0;
    padding: 0;
}

    .xsCarouselImgDiv:hover .xsCarouselImg {
        transform: scale(1.15);
    }

.xsCarouselImg {
    width: 100%;
    height: 150px;
    object-fit: cover;
    border-radius: 7px;
    transition: transform 0.3s ease;
    transform-origin: 0 0;
    overflow: hidden;
}

.smProductCarousel .productPriceDiv {
    align-items: start !important;
}

.smCarouselItem {
    position: relative;
    background-color: #F5F5F5;
    border-radius: 7px;
    padding: 1rem;
    margin-bottom: 1.5rem;
}

.smCarouselImgDiv {
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 24px;
    font-weight: bold;
    position: relative;
    transform-origin: 0 0;
    overflow: hidden;
    margin: 0;
    padding: 0;
}

    .smCarouselImgDiv:hover .smCarouselImg {
        transform: scale(1.15);
    }

.smCarouselImg {
    width: 100%;
    height: 200px;
    object-fit: cover;
    transition: transform 0.3s ease;
    transform-origin: 0 0;
    overflow: hidden;
    border-radius: 7px;
}

.mdProductCarousel .productPriceDiv {
    align-items: start !important;
    justify-content: end;
}

.mdProductCarousel .newPrice {
    color: #6eb356 !important;
}


.mdCarouselTitle {
    font-size: 14px;
    line-height: 16px;
    font-weight: bold;
    color: #1d1d1b;
    margin-bottom: .25rem !important;
    height: 20px;
    overflow: hidden;
}

.m-mdCarouselTitle {
    font-size: 14px;
    line-height: 14px;
    font-weight: bold;
    color: #1d1d1b;
    margin-bottom: .25rem !important;
    height: 20px;
    overflow: hidden;
}

.mdCarouselImgDiv {
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 24px;
    font-weight: bold;
    position: relative;
    transform-origin: 0 0;
    overflow: hidden;
    margin: 0;
    padding: 0;
}

    .mdCarouselImgDiv:hover .mdCarouselImg {
        transform: scale(1.15);
    }

.mdCarouselText {
    display: block;
    height: 40px;
    overflow: hidden;
    font-size: 18px;
    line-height: 18px;
    font-weight: bold;
    color: #1d1d1b;
    text-decoration: none;
}

.mdCarouselImg {
    width: 100%;
    height: 210px;
    object-fit: cover;
    border-radius: 7px;
    transition: transform 0.3s ease;
    transform-origin: 0 0;
    overflow: hidden;
}

.lgProductCarousel .productPriceDiv {
    align-items: start;
}

.lgCarouselItem {
    position: relative;
    border: 3px solid #F5F5F5;
    border-radius: 7px;
    padding: 1rem;
    margin-bottom: 1.5rem;
}

.lgCarouselImgDiv {
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 24px;
    font-weight: bold;
    position: relative;
    transform-origin: 0 0;
    overflow: hidden;
    margin: 0;
    padding: 0;
}

    .lgCarouselImgDiv:hover .lgCarouselImg {
        transform: scale(1.15);
    }

.lgCarouselImg {
    width: 100%;
    height: 305px;
    object-fit: cover;
    border-radius: 7px;
    transition: transform 0.3s ease;
    transform-origin: 0 0;
    overflow: hidden;
}

.xlProductCarousel .productPriceDiv {
    align-items: start !important;
}

.xlCarouselItem {
    position: relative;
    border: 3px solid #F5F5F5;
    border-radius: 7px;
    padding: 1rem;
    margin-bottom: 1.5rem;
}

.xlCarouselImgDiv {
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 24px;
    font-weight: bold;
    position: relative;
    transform-origin: 0 0;
    overflow: hidden;
    margin: 0;
    padding: 0;
}

    .xlCarouselImgDiv:hover .xlCarouselImg {
        transform: scale(1.15);
    }

.xlCarouselImg {
    width: 100%;
    height: 460px;
    object-fit: cover;
    border-radius: 7px;
    transition: transform 0.3s ease;
    transform-origin: 0 0;
    overflow: hidden;
}

/* Carousel Images End */

.percentDiscount {
    background-color: #cc0917;
    padding: 0.35rem 0.45rem;
    color: #fff;
    border-radius: 25px;
    font-size: 12px;
    width: fit-content;
}

.percentSmallDiscount {
    background-color: #cc0917;
    padding: 0.25rem 0.35rem;
    color: #fff;
    border-radius: 25px;
    font-size: 12px;
    width: fit-content;
}

.sectionHeaderDiv {
    display: flex;
    align-items: center;
    height: 35px;
    margin-top: 1.25rem;
    margin-bottom: 1.25rem;
}

.orangeBackground {
    background-color: #f1592a !important;
}

.redBackground {
    background-color: #ce0917 !important;
}

.greenBackground {
    background-color: #6eb356 !important;
}

.blueBackground {
    background-color: #5f7bb2 !important;
}

.purpleBackground {
    background-color: #9271cb !important;
}

.sectionHeaderTitle {
    text-transform: uppercase;
    text-align: left;
    font-family: "Rubik", sans-serif;
    font-weight: 500;
    font-size: 14px;
    line-height: 16px;
    letter-spacing: 0px;
    color: #FFFFFF;
    height: 35px;
    display: flex;
    align-items: center;
}

.m-sectionHeaderTitle {
    text-transform: uppercase;
    text-align: left;
    font-family: "Rubik", sans-serif;
    font-weight: 500;
    font-size: 14px;
    line-height: 16px;
    letter-spacing: 0px;
    color: #FFFFFF;
    padding-left: 0.25rem;
    height: 35px;
    display: flex;
    align-items: center;
}

/*Desktop Blog Start*/
.blogPanelWrapper {
    position: relative;
    z-index: 1;
    width: 100%;
    min-height: 300px;
    padding: 20px 0;
}

.blogPanelBackground {
    position: absolute;
    z-index: -1;
    top: 0;
    left: 38%;
    width: 256px;
    height: auto;
    object-fit: cover;
}

.blogItalicText {
    color: #1d1d1b;
    font: normal normal normal 54px/82px "Trully";
    margin-top: 50px;
    display: block;
}

.blogImage {
    width: 100%;
    height: 265px;
    border-radius: 8px;
}

.blogTextWrapper {
    width: 100%;
    padding: 12px;
    position: relative;
    font-size: 12px;
    cursor: pointer;
}

blogWithDescCard {
    margin-top: 1.5rem;
    margin-bottom: 1.5rem;
}

.blogWithDescCard:hover .blogTextWrapperShadow {
    width: 100%;
    transition-property: width;
    transition-duration: 0.3s;
    transition-timing-function: linear;
    transition-delay: 0.1s;
}

.blogTextWrapperShadow {
    width: 40px;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-color: #f5f5f5;
    border-radius: 8px;
    z-index: 50;
}

.blogText {
    width: 100%;
    position: relative;
    z-index: 100;
}

.blogDesc {
    height: 55px;
    overflow: hidden;
    width: 100%;
    margin-top: 0.25rem;
}

.blogLink {
    width: 100%;
    display: flex;
    justify-content: start;
    align-items: center;
    text-decoration: none;
    margin-top: 0.5rem;
    font-size: 12px;
    font-weight: bold;
    color: #1d1d1b;
}

.blogCategoryHeaderFirst {
    width: 100%;
    padding: 4px 10px;
    background-color: #1d1d1b;
    border-radius: 4px;
    font-size: 12px;
    color: #fff;
}

.blogCategoryItemWrapper {
    width: 100%;
    height: 140px;
    margin-top: 24px;
    position: relative;
    background-size: cover;
    background-position: 50% 50%;
    border-radius: 8px;
    cursor: pointer;
}

.blogCategoryItemImage {
    width: 100%;
    height: 100%;
    border-radius: 8px;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 79;
    object-fit: cover;
}

.blogCategoryNavigationText {
    width: 100%;
    display: none;
    position: absolute;
    left: 0;
    bottom: 10px;
    text-align: center;
    z-index: 79;
}

.blogCategoryItemWrapper:hover .blogCategoryNavigationText {
    display: block;
}

.blogCategoryItemWrapper:hover .blogCategoryItemText {
    bottom: 30px;
}

.blogCategoryItemWrapper:hover {
    background-position: 100% 0% !important;
}

.blogCategoryItemImageShadow {
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.4);
    border-radius: 8px;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 79;
}

.blogCategoryItemText {
    width: 96%;
    padding: 0 2%;
    position: absolute;
    bottom: 20px;
    left: 0;
    text-align: center;
    color: #fff;
    z-index: 80;
    height: 37px;
    overflow: hidden;
}

.blogCategoryOtherBlogs {
    width: 100%;
    height: 140px;
    margin-top: 24px;
    position: relative;
    background-color: #f5f5f5;
    border-radius: 8px;
    font-weight: bold;
    text-align: center;
}

    .blogCategoryOtherBlogs:hover {
        color: #fff;
    }

.blogShareImage {
    width: 24px;
}

.blogHeaderTextPanel {
    border-bottom: 1px solid #ebebeb;
    padding-bottom: 20px;
}

.blogMainImageWrapper {
    width: 100%;
    height: 30vh;
    overflow: hidden;
    border-radius: 8px;
}

.blogMainImage {
    width: 100%;
    border-radius: 8px;
}

.blogMainImage {
    width: 100%;
    height: 40vh;
    object-fit: cover;
    border-radius: 8px;
}

.blogOtherBlogsText {
    padding-top: 20px;
    border-top: 1px solid #ebebeb;
}
/*Desktop Blog End */

/*Mobile Blog Start */
.m-blogMainImageWrapper {
    width: 100%;
    overflow: hidden;
    position: relative;
}

.m-blogMainGradient {
    width: 100%;
    height: 100%;
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: 100;
    background-image: linear-gradient(0deg, rgba(29, 29, 27, 1) 17%, rgba(20, 20, 20, 0) 100%, rgba(249, 249, 249, 1) 100%);
}

.m-blogMainImage {
    width: 100%;
}

.m-blogHeadlinePanel {
    width: 90%;
    margin: -20% 5% 0 5%;
    font-size: 5vw;
    position: relative;
    z-index: 201;
}

.m-blogShareImage {
    width: 32px;
}

.m-blogInfoPanel {
    padding-bottom: 3vw;
    border-bottom: 1px solid #555555;
}

.m-blogInfoText {
    font-size: 3.2vw;
}

.m-blogTextWrapper {
    width: 90%;
    margin: 0 5% 0 5%;
}

.m-blogContentImage {
    width: 100%;
    border-radius: 8px;
}

.m-blogPanelContent {
    width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
}

.m-blogItemWrapper {
    padding: 10px 0;
}

.m-blogItem {
    position: relative;
    background-size: cover;
    background-position: 50% 50%;
    border-radius: 8px;
    text-align: center;
}

.m-blogItemImage {
    width: 100%;
    height: 145px;
    border-radius: 8px;
}

.m-blogItemImageShadow {
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.4);
    border-radius: 8px;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 79;
}

.m-blogDesc {
    height: 36px;
    overflow: hidden;
    font-size: 12px;
    margin-top: 1rem;
    width: 100%;
    font-weight: bold;
    color: #1d1d1d;
}

.m-blogItemText {
    width: 96%;
    padding: 0 2%;
    position: absolute;
    bottom: 20px;
    left: 0;
    text-align: center;
    color: #fff;
    z-index: 80;
    text-align: left;
}

.m-blogOtherBlogTextLine {
    border-top: 1px solid #777776;
}

.m-blogOtherItem {
    background-color: #fff;
    border-radius: 8px;
}

.m-blogOtherItemAlternative {
    display: flex;
    justify-content: start;
    align-items: start;
    margin-top: 1rem;
    background-color: #f2f2f2;
    border-radius: 8px;
    font-size: 12px;
    margin-right: 0.25rem;
    margin-left: 0.25rem;
}

.m-blogOtherItemImage {
    width: 100%;
    height: 90px;
    object-fit: cover;
    border-top-left-radius: 8px;
    border-bottom-left-radius: 8px;
}

.m-blogOtherItemTextPanel {
    max-height: 80px;
    overflow: hidden;
    padding-top: 0.5rem;
    text-align: start;
}

.m-blogOtherItemShareIcon {
    width: 20px;
    margin: 0.5rem 1rem 0 0;
}

/*Mobile Blog End */

/*Bize Ulaşın Start*/
.contactInfoBorder {
    height: 380px;
    display: inline-block;
    border-left: 1px solid #e0e0df;
}

.contactInfoBox {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 90px;
    padding: 4px;
    background-color: #f5f5f5;
    border: 1px solid;
    border-radius: 4px;
    font-size: 12px;
    color: #1d1d1b;
    text-align: center;
}
/*Bize Ulaşın End*/

/* Vista Menu Desktop Start */
.vistaPointLabel {
    background-color: #ffde00;
    padding: 8px 10px 8px 5px;
    border-radius: 50rem;
}

.vistaPointStar {
    padding: 5px 4px;
    color: #ffde00;
    background-color: #1d1d1b;
    font-size: 12px;
    border-radius: 50%;
}

.vistaPointNumber {
    font-weight: bold;
}

.vistaMenuLeftPanel {
    width: 100%;
    padding: 5%;
    color: #fff;
    text-align: center;
}

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

.vistaMenuLeft {
    height: 30%;
}

.vistaMenuRight {
    min-height: 40vh;
}

.menuPanelBackground {
    position: absolute;
    top: 0;
    left: 0;
    min-height: 395px;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 4px;
    z-index: -1;
    filter: brightness(50%);
}

.cardAvantagesDiv {
    position: relative;
    z-index: 1;
    padding-bottom: 4rem;
}

.cardAvantages {
    position: absolute;
    left: 15%;
    bottom: 3%;
}

.cardAvantagesTitle {
    text-align: left;
    font-family: "Rubik", sans-serif;
    font-weight: 600;
    font-size: 90px;
    line-height: 90px;
    letter-spacing: 0px;
    color: #FFFFFF;
    opacity: 1;
}

.cardAvantagesText {
    text-align: left;
    font-family: "Rubik", sans-serif;
    font-weight: 600;
    font-size: 45px;
    line-height: 55px;
    letter-spacing: 0px;
    opacity: 1;
}

.cardAvantagesButton {
    display: inline-block;
    background-color: transparent;
    border: 1px solid #1d1d1b;
    font-size: 12px;
    margin-top: 0.75rem;
}

    .cardAvantagesButton:hover {
        background-color: #1d1d1b;
        color: white;
    }

.vistaMenuLeftSectionMargin {
    margin-top: 5%;
}

.vistaMenuGrayPanel {
    width: 100%;
    background-color: #f5f5f5;
    padding: 5%;
    margin-bottom: 5%;
    border-radius: 4px;
}

.vistaMenuButtons {
    width: 100%;
    background-color: #fff;
    padding: 10px 5px;
    border-radius: 4px;
    text-align: center;
    box-shadow: 0px 10px 12px -16px #111;
    transition: all 0.3s ease;
}

    .vistaMenuButtons:hover {
        transform: translateY(-20px);
    }

.vistaMenuButtonIcon {
    width: 48px;
    display: block;
    margin-right: auto !important;
    margin-left: auto !important;
}

.vistaMenuchanceTab {
    width: 100%;
}

.vistaMenuchanceTabText1 {
    position: absolute;
    bottom: 21.6%;
    left: 18%;
    font-size: 5vw;
    line-height: 5vw;
    font-weight: 600;
    color: #fff;
}

.vistaMenuchanceTabText2 {
    position: absolute;
    bottom: 6%;
    left: 18%;
    font-size: 2.4vw;
    letter-spacing: 1.5px;
    line-height: 2.8vw;
    font-weight: 600;
}

/*Vista Menu Desktop End */

/*Mobile css */
.m-mobileHeader {
    background-color: #1d1d1b;
    padding: 1rem;
}

.m-mobileProfileIcon {
    width: 20px;
    height: 20px;
    padding: 0;
    border-radius: 50%;
}
.bgUnset .m-mobileHeaderBadgeIcon {
    background-color: white;
    width: 45px;
    height: 45px;
    font-size: 5vw;
}


.bgUnset .basketPanel {
    box-shadow: 0px 0px 30px #0000004F;
}

.m-mobileHeaderBadgeIcon {
    border-radius: 50%;
    width: 45px;
    height: 45px;
    background: #4478321c 0% 0% no-repeat padding-box;
    font-size: 6vw;
    color: #1d1d1d;
    display: flex;
    text-decoration: none;
    align-items: center;
    justify-content: center;
}

.m-mobileHeaderColumn {
    display: flex;
    align-items: center;
    justify-content: space-around;
    padding-right: 0;
    padding-left: 0;
}

@media (min-width:576px) and (max-width:992px) {
    .m-mobileHeaderBadgeIcon {
        font-size: 4vw;
    }

    .m-mobileHeaderColumn {
        justify-content: right;
    }
}

.m-headerBasketIcon {
    width: 20px;
    display: inline-block;
}

.m-headerBadge {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 14px;
    height: 14px;
    position: absolute;
    top: 0;
    right: 0;
    border: 1px solid #fff;
    border-radius: 50%;
    font-size: 9px;
    color: white;
}

.m-mobileHeaderBottom {
    background-color: #ffffff;
    padding: 0px 1rem;
    box-shadow: 0px -1px 2px #00000033;
    border-top: 1px solid #cecece;
}

.m-mobileHeaderBottomLink {
    display: block;
    padding: 6px 0 3px 0 !important;
    font-size: 4vw;
    color: #a5a5a5;
    text-decoration: none !important;
    text-align: center;
}

.basketCount {
    top: 50%;
    transform: translateY(-35%) translateX(-50%);
    left: 50%;
    font-size: 12px;
}

.m-mobileHeaderBottomIcon {
    width: 18px;
    margin-top: -3px;
}

.m-mobileHeaderBottomText {
    width: 100%;
    display: block;
    font-size: 12px;
    color: #a5a5a5;
    margin-top:3px;
}

.m-mobileButtons {
    padding-top: 10px;
    padding-bottom: 10px;
}

.m-DeliverMethodButton {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    font: 11px / 1.33 Inter, sans-serif;
    padding: 0.5rem;
    background-color: #582e1f;
    color: #fff;
    font-weight: 100;
}
.m-deliveryOptionText {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 150px;
    display: inline-block;
    vertical-align: middle;
}

.m-ProfileButton {
    padding: 5px 8px;
    background-color: #582e1f;
    color: #fff;
    border-radius: 50%;
    font-size: 18px;
}

.m-deliveryMethodPanelWrapper {
    width: 98%;
    position: fixed;
    top: 60px;
    left: 0;
    z-index: 2000;
    background-color: rgba(255, 255, 255, 0.4);
    backdrop-filter: saturate(180%) blur(20px);
    border-bottom-left-radius: 15px;
    border-bottom-right-radius: 15px;
}

.m-deliveryMethodPanel {
    width: 100%;
    height: auto;
    padding: 20px 20px 40px 20px;
    background-color: #737372;
    border-bottom-left-radius: 15px;
    border-bottom-right-radius: 15px;
}

.m-deliveryMethodPanelButton {
    padding: 6px 12px;
    background-color: #f2f2f2;
    border: 1px solid #a5a5a5;
    border-radius: 10px;
    font-size: 12px;
    color: #1d1d1b;
}

.m-deliveryMethodPanelClosePanel {
    width: 100%;
    height: 20px;
    background-color: transparent;
    position: absolute;
    bottom: 10px;
    left: 0;
    z-index: 2000;
}

.m-deliveryMethodPanelCloseBar {
    width: 20%;
    height: 2px;
    display: inline-block;
    background-color: #a5a5a5;
}

.m-SearchPanelWrapper {
    padding: 6px 15px;
    background-color: #f2f2f2;
}

.m-MenuSearchPanelWrapper {
    position: absolute;
    width: 100%;
    top: 0;
    padding: 6px 8px;
    background-color: #f2f2f2;
}

.m-SearchPanel {
    position: relative;
}

.m-SearchTextBox {
    padding: 0.5rem 2rem;
    background-color: #fff;
    border: 1px solid #e3e3e3;
    border-radius: 40px;
    font-size: 14px;
    height: 45px;
}

.m-SearchButton {
    width: 55px;
    padding: 0.5rem;
    position: absolute;
    top: 4px;
    right: 5px;
    border: none !important;
    border-radius: 40px;
    color: #ffffff;
    font-size: 14px;
    text-align: center;
}

.m-SearchIcon {
    position: absolute;
    top: 12px;
    left: 10px;
    font-size: 18px;
    color: #d2d2d1;
    font-weight: 100;
}

.m-BarcodeIcon {
    width: 24px;
    margin-top: 5px;
}

.m-NotificationsPanel {
    width: 36px;
    margin-top: 2px;
    font-size: 20px;
}

.m-NotificationsBadge {
    width: auto;
    min-width: 14px;
    height: auto;
    min-height: 14px;
    padding: 2px 3px 0 3px;
    position: absolute;
    top: -3px;
    right: -5px;
    border: 1px solid #fff;
    border-radius: 50%;
    font-size: 8px;
    color: white;
}

.m-itemScroll {
    margin: 4px 0;
    background-color: #fff;
}

.m-itemScrollPanel {
    padding: 12px 12px 0 12px;
    background-color: #f2f2f2;
    border: 1px solid #cbcbcb;
    border-radius: 5px;
}

.m-itemScrollPanelProductText {
    font-size: 12px;
    font-weight: bold;
    color: #1d1d1b;
}

.m-itemScrollPanelPriceText {
    font-size: 12px;
    font-weight: bold;
    color: #ce0917;
}

.m-itemScrollPanelImage {
    width: 100%;
}

.m-itemScrollPanelAddButton {
    width: 24px;
    height: 24px;
    position: absolute;
    bottom: 0;
    right: 0;
    z-index: 100;
    border-radius: 5px;
    cursor: pointer;
    text-align: center;
}

    .m-itemScrollPanelAddButton i {
        font-size: 14px;
        color: #fff;
        margin-left: -5px;
        padding: 0;
    }


.m-mainchanceTabImage {
    width: 100%;
}

.m-mainchanceTabButton {
    width: auto;
    position: absolute;
    bottom: 15%;
    left: 10%;
    z-index: 100;
    border-color: #fff;
    font-size: 12px;
    color: #fff;
}

.m-mainOrder {
    background-color: #6EB356;
    z-index: 1;
    position: relative;
}

.m-mainOrderInfoPanel {
    display: flex;
    align-items: center;
    padding: 0.5rem 1rem;
    text-decoration: none;
}

.headerProgressDots {
    display: flex;
    margin: 0 1px 10px 3px;
}

.m-mainPageActiveOrdersBadge {
    width: auto;
    min-width: 24px;
    max-width: 32px;
    height: 24px;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 4px;
    border-radius: 50%;
    background-color: #fff;
    color: #5f7bb2;
    text-align: center;
}

.m-itemScrollPanel {
    width: 100%;
    height: 100px;
    padding-bottom: 5px;
    overflow-y: hidden;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scroll-behavior: smooth;
    -webkit-overflow-scrolling: touch;
}

    .m-itemScrollPanel::-webkit-scrollbar {
        width: 10px;
        height: 6px;
        cursor: pointer;
    }

    .m-itemScrollPanel::-webkit-scrollbar-thumb {
        background: #bcbcbb;
        border-radius: 10px;
        cursor: pointer;
    }

    .m-itemScrollPanel::-webkit-scrollbar-track {
        background: transparent;
    }

.m-itemScrollCard {
    position: relative;
    padding: 0.5rem;
    padding-bottom: 1.5rem;
    border: 1px solid #dadada;
    border-radius: 4px;
}


.m-itemScrollProductImg {
    width: 64px;
    height: 64px;
    overflow: hidden;
}

.m-itemScrollProductTexts {
    width: 140px;
    overflow: hidden;
}

.m-itemScrollTextDetail {
    width: 100%;
    font-size: 12px;
    line-height: 14px;
    color: #1D1D1B;
    height: 28px;
    overflow: hidden;
}

.m-itemScrollBadge {
    display: flex;
    justify-content: space-between;
    align-items: end;
    margin-top: 0.5rem;
    margin-left: 0.05rem;
}

.m-itemScrollBadgeText {
    padding: 0.25rem;
    background-color: #6eb356;
    color: #fff;
    border-radius: 4px;
    text-align: center;
    font-size: 12px;
    line-height: 12px;
    position: absolute;
    bottom: 0;
    right: 0;
    width: 100%;
}


.m-itemScrollOld {
    width: 100%;
    color: #a5a5a5;
    text-decoration: line-through;
    font-size: 10px;
}

.m-itemScrollNew {
    font-weight: 700;
    width: 100%;
    color: #CE0917;
    font-size: 12px;
    line-height: 8px;
    font-family: "Rubik", sans-serif;
}

.m-itemScrollAddToBasket {
    width: 24px;
    height: 24px;
    padding: 5px;
    position: absolute;
    top: 36%;
    right: -10px;
    border-radius: 4px;
    cursor: pointer;
    display: flex;
    justify-content: center;
    align-items: center;
}

.m-mainCategoryPanelText {
    padding: 12px;
    font-size: 14px;
    font-weight: 600;
}

.m-mainCategoryPanelContent {
    width: 100%;
    padding: 0 12px;
    overflow-x: auto;
    overflow-y: hidden;
}

.m-mainCategoryItemWrapper {
    padding-bottom: 12px;
}

.m-mainCategoryItem {
    margin: 4px 0;
    display: block;
    text-align: center;
}

.m-mainCategoryImageWrapper {
    padding: 4px;
    border: 1px solid #a5a5a5;
    border-radius: 50%;
}

.m-mainCategoryImage {
    padding: 5px;
    background-color: #ffffff;
    border-radius: 50%;
    width: 100%;
    height: auto;
    object-fit: cover;
}

.m-mainCategoryImagePlus {
    font-size: 80px;
}

.m-mainCategoryText {
    font-size: 12px;
    font-weight: 600;
    color: #1d1d1b;
    display: inline-block;
}

.m-roundedGridRow {
    background: transparent linear-gradient(180deg, #F2F2F2 0%, #F2F2F2 100%) 0% 0% no-repeat padding-box;
    border-radius: 7px;
    padding: 0.5rem;
    margin-top: 0.5rem;
    width: 100%;
}

/*.m-roundedGridColumn {
    padding: 0.5rem;
}*/

.m-roundedGridImg {
    width: 100%;
    height: 100px;
    object-fit: cover;
}

.m-roundedGridItem {
    background: #FFFFFF 0% 0% no-repeat padding-box;
    border: 0.25px solid #dadada;
    border-radius: 10px;
    opacity: 1;
    padding: 0.75rem 0.5rem;
    text-decoration: none;
    display: block;
}

.m-roundedGridText {
    background: #f1f1f1 0% 0% no-repeat padding-box;
    text-align: center;
    font-family: "Rubik", sans-serif;
    font-weight: normal;
    font-size: 12px;
    line-height: 12px;
    letter-spacing: 0px;
    color: #1D1D1B;
    padding: 0.5rem 0.25rem;
    margin-top: 0.5rem;
    border-radius: 5px;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 40px;
    overflow: hidden;
}

.m-NavigationBar {
    padding: 12px 24px;
    background-color: #fff;
    box-shadow: 0px 1px 3px #c1c1c1;
}

.m-NavigationText {
    font-size: 12px;
    color: #1d1d1b;
    font-weight: 600;
    display: inline-block;
    width: fit-content;
    padding-left: 0;
}

.m-NavigationIcon {
    font-size: 24px;
    display: inline-block;
    width: 10%;
}


.m-blogPanelWrapper {
    width: 100%;
    padding: 20px 0;
}

.m-blogItalicTextWrapper {
    width: 100%;
    position: absolute;
    top: 0%;
    left: 0%;
    z-index: 800;
}

.m-blogItalicText {
    color: #1d1d1b;
    font-family: "Trully";
    font-size: 14vw;
    margin-top: 50px;
    display: inline-block;
}

.m-blogImage {
    width: 40%;
    display: inline-block;
    border-radius: 8px;
}

/*Mobile Login Start */

.m-productsPanel {
    /*padding-top: 10.50rem;*/
    padding-bottom: 2rem;
}

.m-basketPanel {
    /*padding-top: 10.50rem;*/
    padding-bottom: 2rem;
}

.m-loginPanel {
    position: relative;
    z-index: 1;
    /*padding-top: 10.50rem;*/
    padding-bottom: 2rem;
}

.m-contactPanel {
    /*padding-top: 10.50rem;*/
    padding-bottom: 2rem;
}

.m-aboutPanel {
    /*padding-top: 10.50rem;*/
    padding-bottom: 2rem;
}

.m-accountPanel {
    /*padding-top: 10.50rem;*/
    padding-bottom: 2rem;
}

.m-articleDetailPanel {
    /*padding-top: 10.50rem;*/
    padding-bottom: 2rem;
}

.m-helpCenterPanel {
    /*padding-top: 10.50rem;*/
    padding-bottom: 2rem;
}

.m-productDetailPanel {
    /*padding-top: 10.50rem;*/
    padding-bottom: 2rem;
}

.m-loginBackground {
    position: absolute;
    left: 0;
    right: 0;
    height: 100%;
    width: 100%;
    filter: brightness(50%);
}

.m-loginCard {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

    .m-loginCard .loginCard {
        padding: 1rem;
    }

    .m-loginCard .registerCard {
        padding: 2.5rem 2rem;
    }

.m-loginLogo {
    width: 200px;
    display: inline-block;
}

.m-loginScreens {
    width: 100%;
    padding: 0;
    display: none;
}

.m-loginMainScreen {
    display: block;
}

.m-loginWhiteText {
    display: inline-block;
    margin: 0 auto;
    color: white;
    line-height: 20px;
}

.m-loginWhiteText {
    display: inline-block;
    margin: 0 auto;
    color: #fff;
    line-height: 20px;
}

.m-loginButtons {
    width: 100%;
    height: 40px;
    padding: 6px 10px;
    border-radius: 4px;
    box-shadow: 0px 3px 6px #00000038;
}

.m-lognTextBox {
    width: 100%;
    height: 40px;
    padding: 6px 10px;
    background-color: transparent;
    border: 1px solid #ffffff;
    border-radius: 4px;
    color: #fff;
}

.m-loginTransparentButton {
    background-color: transparent;
    border: 1px solid #ffffff;
    color: #fff;
}

.m-loginWhiteButton {
    background-color: #fff;
    color: #1d1d1b;
    font-weight: 600;
}

.m-loginConfirmationTextBox {
    width: 40px;
    height: 40px;
    padding: 5px;
    display: inline-block;
    background-color: transparent;
    border: 2px solid #fff;
    text-align: center;
    border-radius: 4px;
    color: #fff;
    font-size: 20px;
}

.m-loginResendCode {
    color: #fff;
    text-decoration: underline;
}
/*Mobile Login End */

/*Mobile Tüm Ürünler Start*/

.m-categoryNavButton:hover {
    background-color: #000;
    border: 2px solid #000;
    color: #fff;
}

.m-categoryNav {
    display: flex;
    align-items: center;
    width: 100%;
    height: 55px;
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
}

    .m-categoryNav::-webkit-scrollbar {
        width: 10px;
        height: 4px;
        cursor: pointer;
    }

    .m-categoryNav::-webkit-scrollbar-thumb {
        background: #bcbcbb;
        border-radius: 10px;
        cursor: pointer;
    }

    .m-categoryNav::-webkit-scrollbar-track {
        background: transparent;
    }

.m-categoryNavButton {
    width: 100%;
    font-size: 12px;
    padding: 6px 15px;
    margin: 5px 5px 0 0;
    background-color: #fff;
    border: 2px solid #1d1d1b;
    border-radius: 16px;
    color: #1d1d1b;
}

.m-promotionCategoryItem {
    width: 170px;
    display: inline-block;
    margin: 16px 8px;
    background-color: #f2f2f2;
    border-radius: 4px;
    padding: 0.75rem 0.25rem;
    text-align: center;
}

.m-promotionCategoryItemImageWrapper {
    width: 145px;
    height: 145px;
    box-shadow: 0px 10px 12px -15px #111;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: auto;
}

.m-allCategories-panel {
    display: none;
    background-color: #f8f8f8;
}

.m-subCategoryPanel {
    padding: 8px 8px;
    border: 1px solid #d2d2d2;
    border-radius: 8px;
    font-size: 12px;
}

.m-subCategories-panel {
    display: none;
}

.m-filter-panel {
    display: none;
}

.m-categoryItem {
    width: 170px;
    height: 200px;
    display: inline-block;
    padding: 12px 3px;
    margin: 12px 3px 12px 3px;
    background-color: #fff;
    border-radius: 8px;
}

.m-categoryItemImage {
    width: 50%;
    height: 50%;
    margin: 10px 25%;
}

.m-categoryItemText {
    width: 100%;
    height: 22px;
    max-height: 40px;
    margin: 20px 0 10px 0;
    font-size: 14px;
    font-weight: 600;
    text-align: center;
    overflow: auto;
}
/*Mobile Tüm Ürünler End */

.m-categoryPanel {
    margin: 24px;
}

.m-categoryHeader {
    font-size: 12px;
    font-weight: bold;
}

.m-categoryMenu {
    margin: 10px 2px;
    font-size: 12px;
    color: #656565;
}

    .m-categoryMenu a {
        color: inherit !important;
        text-decoration: none !important;
    }

.m-categoryMenuItem {
    width: 50%;
    margin: 2px 0;
}

.m-categoryMenu i {
    font-size: 3px;
    margin-right: 10px;
}

.m-bestSellersPanel {
    background-color: #5f7bb2;
    padding: 8px 24px;
}

.m-bestSellersBar {
    font-size: 14px;
    color: #ffffff;
    font-weight: 600;
}

.m-bestSellersAllProducts {
    font-size: 14px;
    color: #ffffff;
    font-weight: normal;
    opacity: 0.5;
}

.m-promotionsPanelRed {
    background-color: #ce0917;
    margin: 10px 0;
}

.m-promotionsPanelPurple {
    background-color: #9271cb;
    margin: 10px 0;
}

.m-promotionsPanelOrange {
    background-color: #f1592a;
    margin: 10px 0;
}

.m-promotionsPanelBlack {
    background-color: #1d1d1b;
    margin: 10px 0;
}

.m-promotionsPanelGreen {
    background-color: #6eb356;
    margin: 10px 0;
}

.m-promotionsPanel {
    padding: 0;
}

.m-promotionsPanelHeader {
    padding: 8px 0 8px 15px;
    color: #fff;
}

.m-promotionsPanelHeaderIcon {
    width: 32px;
    height: 32px;
    display: inline-block;
}

.m-promotionsPanelHeaderText {
    width: 40%;
    display: inline-block;
    font-size: 14px;
}

.m-promotionsPanelHeaderTime {
    width: 45%;
    display: inline-block;
    text-align: right;
    font-size: 12px;
}

.m-promotionsPanelHeaderLink {
    width: 40%;
    display: inline-block;
    text-align: right;
    font-size: 14px;
    font-weight: 100;
    color: inherit !important;
    text-decoration: none !important;
    opacity: 0.5;
}

.m-productDetailImgWrapper {
    position: relative;
    justify-content: center;
    overflow-x: hidden;
    width: 100%;
    padding: 1rem 0.25rem;
}

.m-productDetailBadge {
    position: absolute;
    top: 0;
    left: 2%;
    width: 100%;
    z-index: 2;
}

.m-promotionsPanelContent {
    justify-content: center;
    align-items: center;
}

.m-promotionItem {
    background-color: #f2f2f2;
    border-radius: 4px;
    padding: 0.5rem;
    margin-top: 0.5rem;
    margin-bottom: 0.5rem;
}

.m-promotionItemImageWrapper {
    width: 100%;
    display: inline-block;
    background-color: #fff;
    position: relative;
    box-shadow: 0px 10px 12px -15px #111;
}

.m-promotionItemImage {
    width: 100%;
    height: 150px;
}

.m-promotionItemImageRightBanner {
    width: 48px;
    height: 48px;
    position: absolute;
    top: -2px;
    right: 4px;
    z-index: 201;
    color: #fff;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
}

.m-promotionItemImageLeftBanner {
    width: 24px !important;
    height: 24px;
    position: absolute;
    top: 0px;
    left: 0px;
    z-index: 201;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
}

.m-promotionItemImageRightBannerText {
    width: 100%;
    height: 18px;
    float: left;
    display: block;
    text-align: center;
}

.m-promotionItemImageGreenBanner {
    background: url("../images/misc/greenBanner.png") 0 0 no-repeat;
}

.m-promotionItemImageRedBanner {
    background: url("../images/misc/redBanner.png") 0 0 no-repeat;
    top: -5px;
    right: -5px;
}

.m-promotionItemQuantity {
    font-size: 12px;
    color: #fff;
}

.m-promotionItemQuantityIcon {
    background-color: #c84d27;
    padding: 8px;
    margin: 5px 2px;
    border-radius: 4px;
    font-size: 12px;
    color: #fff;
}

.m-promotionItemButtonWrapper {
    width: 152px;
    height: 40px;
    font-size: 14px;
    color: #fff;
    margin: 0.5rem;
    padding: 0.5rem;
    border: 2px solid;
    text-transform: uppercase;
    text-align: center;
    border-radius: 4px;
    margin-right: auto;
    margin-left: auto;
}

.m-promotionItemAddButton {
    padding: 12px 10px;
    height: 40px;
    float: right;
    background-color: #c84d27;
    color: #fff;
    font-size: 12px;
    text-transform: uppercase;
}

.m-promotionItemButton {
    width: 152px;
    height: 40px;
    font-size: 14px;
    color: #fff;
    margin: 0.5rem;
    border: 2px solid;
    text-transform: uppercase;
    padding: 0.5rem;
}

.m-oldPrice {
    font-size: 14px;
    color: #a5a5a5;
    text-decoration: line-through;
}

.m-newPrice {
    font-size: 18px;
    color: #ce0917;
    font-weight: 700;
}

.m-videoSectionPanel {
    width: 100%;
    height: 200px;
    max-height: 200px;
}

.m-videoBannerImage {
    width: 100%;
    height: 100%;
    object-fit: cover;
    overflow: hidden;
}

.m-videoSectionText {
    width: 80%;
    margin: 5% 10% 10px 10%;
    text-align: center;
    font-size: 12px;
    font-weight: 100;
    color: #fff;
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
}

.m-videoSectionButton {
    display: inline-block;
    color: #ffffff;
    opacity: 1;
    background-color: transparent;
    font-size: 12px;
    font-weight: 400;
    border: 1px solid #ffffff;
    border-radius: 5px;
}

.m-videoSection {
    margin-top: -50px;
    background-color: #fff;
}

.m-videoSectionImg {
    width: 100%;
    margin: 10px 0;
}
.m-videoSectionButtonDiv {
    position: absolute;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    bottom: 3%;
    left: 0;
}

.m-videoSectionItalicText {
    color: white;
    font-family: "Trully", sans-serif;
    font-size: 12vw;
    display: block;
    text-align: center;
    position: absolute;
    bottom: 10%;
}

.m-vistaCardPanelWrapper {
    width: 100%;
    border-radius: 4px;
    overflow: hidden;
    position: relative;
    margin-top: 1rem;
}

.m-twoColumnImg {
    width: 100%;
    height: 222px;
    object-fit: cover;
}

.m-vistaCardPanelDiv {
    position: absolute;
    width: 100%;
    left: 0%;
    bottom: 10%;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.m-vistaCardPanelText {
    font-family: "Rubik", sans-serif;
    font-weight: 600;
    font-size: 40px;
    line-height: 50px;
    letter-spacing: 0px;
    color: #FFFFFF;
    text-shadow: 0px 3px 6px #00000029;
    width: 100%;
    text-align: left;
}

.m-vistaCardPanelSlogan {
    font-size: 30px;
    font-weight: bold;
}

.m-footerIcomWrapper {
    width: 100%;
    padding: 10% 0;
    background-color: #f2f2f2;
    border-radius: 4px;
    color: #828282;
}

.m-footerIcon {
    width: 20%;
    display: inline-block;
}

.m-footerGrayPanelText {
    display: block;
    font-size: 12px;
    font-weight: 600;
    color: #1d1d1b;
    line-height: 15px;
    text-align: center;
}

.m-footerGrayButton {
    width: 100%;
    height: 44px;
    background-color: #1d1d1b;
    border: 2px solid #1d1d1b;
    font-size: 14px;
    font-weight: 600;
    border-radius: 5px;
    color: #ffffff;
    padding: 0.75rem 0.25rem;
}

    .m-footerGrayButton:hover {
        background-color: #ffffff;
        color: #1d1d1b;
    }

.m-footerGrayTextBox {
    width: 100%;
    height: 44px;
    padding: 10px 10px;
    background-color: #f2f2f2;
    border: none;
    border-radius: 8px;
    font-size: 12px;
}

.m-footerPanel {
    padding: 20px 0;
}

.m-footerMenuItem {
    width: 100%;
    display: inline-block;
}

.m-footerMenuHeader {
    width: 100%;
    margin: 10px 0;
    border-bottom: 1px solid #FFFFFF;
}

.m-footerMenuHeaderText {
    width: 90%;
    display: inline-block;
    font-size: 14px;
    color: #fff;
}

.m-footerMenuHeaderIcon {
    color: #fff;
    float: right;
    text-align: right;
}

.m-footerMenuList {
    margin: 5px 0 0 0;
    padding: 0;
    display: none;
}

    .m-footerMenuList li {
        width: 100%;
        margin: 5px 0;
        font-size: 12px;
        color: #fff;
        list-style-type: none;
    }

        .m-footerMenuList li a {
            color: inherit;
            text-decoration: none;
        }

            .m-footerMenuList li a:hover {
                text-shadow: 0 0 5px #fff;
            }

.m-footerContactList {
    width: 100%;
    display: inline-block;
    margin: 5px 0 0 0;
    padding: 0;
}

    .m-footerContactList li {
        width: 100%;
        margin: 2vw 0;
        font-size: 12px;
        color: #fff;
        list-style-type: none;
        display: flex;
    }

        .m-footerContactList li a {
            color: inherit;
            text-decoration: none;
        }

        .m-footerContactList li i {
            width: 20px;
            height: 20px;
            padding: 4px;
            border-radius: 50%;
            background-color: #fff;
            text-align: center;
        }

        .m-footerContactList li a:hover {
            text-shadow: 0 0 5px #fff;
        }

.m-footerAppIcons {
    width: 150px;
}

.m-footerSocialIconsWrapper {
    display: flex;
    margin: 0 -5% 0 0;
    padding: 3px 10px;
    text-align: center;
    border-radius: 20px;
    border: 1px solid #707070;
    background-color: #fff;
}

    .m-footerSocialIconsWrapper a {
        color: inherit;
        text-decoration: none !important;
        margin-right: 0.25rem;
        margin-left: 0.25rem;
    }

.m-footerSocialIcons {
    width: 24px;
    margin: 5px 0;
    display: inline-block;
}

.m-footerBottomCopyrightPanel {
    background-color: #1d1d1b;
    padding: 20px 0 120px 0;
}

.m-footerBottomCopyrightText {
    font-size: 12px;
    color: #fff;
}

.m-footerBottomLink {
    margin: 5px 10px;
    color: #fff;
    text-decoration: none;
    font-size: 12px;
}

    .m-footerBottomLink:hover {
        text-shadow: 0 0 5px #fff;
        color: #fff;
    }

.m-bottomPhonePanelFixed {
    width: 64px;
    height: 80px;
    position: absolute;
    top: -120px;
    right: 4px;
}

.m-bottomPhonePanelFixedSingle {
    width: 64px;
    height: 80px;
    position: absolute;
    top: -65px;
    right: 4px;
}

.m-bottomPhonePanelFixedIcon {
    width: 48px;
    height: 48px;
    margin: 5px 0;
    padding: 0.5rem;
    border: 3px solid #fff;
    border-radius: 50%;
    color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    text-decoration: none;
}

    .m-bottomPhonePanelFixedIcon i {
        font-size: 24px;
    }

.m-footerBottomPhone {
    max-height: 250px;
    width: 100%;
    display: inline-block;
    margin: 20px -10% 0 0;
}

/*m Sepetim */

.m-basketInfoPanel {
    width: 100%;
    padding: 12px;
    border-radius: 4px;
    background-color: #ce0917;
    font-size: 12px;
    color: #fff;
    text-align: center;
}

.m-basketProductCard {
    width: 100%;
}

.m-basketPanelRemoveAll {
    text-decoration: underline;
}

.m-basketProductItem {
    padding: 12px;
    margin: 5px 0;
    background-color: #f8f8f8;
    border-radius: 4px;
}

.m-basketCheckBox {
    width: 20px;
    height: 20px;
    position: absolute;
    top: 5px;
    left: 5px;
}

.m-basketProductName {
    font-size: 12px;
    font-weight: bold;
}

.favoriteProductOldPrice {
    font-size: 12px;
    text-decoration: line-through;
    color: #a5a5a5;
}

.favoriteProductNewPrice {
    font-size: 16px;
    color: #ce0917;
    font-weight: bold;
}

.m-basketRemoveItemText {
    color: #a5a5a5;
    font-size: 12px;
    float: right;
}

.m-basketRemoveItemIcon {
    color: #ce0917;
    font-size: 16px;
    float: right;
    margin: 1px 5px;
}

.m-basketProductQuantity {
    font-size: 12px;
    font-weight: normal;
    color: #1d1d1b;
}

.m-basketSummaryPanel {
    padding: 12px;
    margin: 5px 0;
    background-color: #f8f8f8;
    border-radius: 4px;
}

.m-basketSummaryHeader {
    font-size: 22px;
}

.m-basketDeliveryButton {
    background-color: #a5a5a5;
    color: #fff;
}

.m-basketPriceText {
    margin: 0.5rem 0;
    font-weight: 600;
}

.m-basketSubmitButton {
    padding: 8px;
    border: 2px solid;
    font-size: 14px;
    color: #ffffff;
}

.m-basketInfoButtons {
    padding: 10px 10px 5px 10px;
    background-color: #828282;
    border: 2px solid #828282;
    font-size: 14px;
    color: #ffffff;
}

    .m-basketInfoButtons:hover {
        background-color: #000;
        border: 2px solid #000;
        font-size: 14px;
        color: #ffffff;
    }

.deliveryRegionList {
    height: 265px;
    overflow-y: scroll;
}

.deliveryRegionSearchDiv {
    position: relative;
    margin-top: 1rem;
}

.deliveryRegionTextBox {
    width: 100%;
    height: 35px;
    padding: 5px;
    background: transparent;
    border: 1px solid #ffffff !important;
    border-radius: 5px;
    color: #fff;
    outline-color: transparent !important;
}

.deliveryRegionSearchResult {
    position: absolute;
    width: 100%;
    top: 75%;
    left: 0;
    background: transparent;
    opacity: 0;
    z-index: -1;
    margin-top: 1rem;
    border-radius: 5px;
    border: 1px solid #ffffff !important;
}

.deliveryRegionButton {
    width: 100%;
    padding: 10px;
    background-color: transparent;
    border-bottom: 1px solid #ffffff;
    color: #fff;
}

    .deliveryRegionButton:hover {
        background-color: #fff;
        color: #1d1d1b;
    }

/*Mobile Yardım Merkezi Start */
.m-helpCenterButton {
    padding: 10px 10px;
    background-color: #ffffff;
    border: 1px solid #a5a5a5;
    border-radius: 5px;
    font-size: 12px;
    font-weight: 400;
    color: #1d1d1b;
    cursor: pointer;
    width: 100%;
    display: block;
    text-decoration: none;
}

    .m-helpCenterButton:hover {
        background-color: #6eb356;
        color: #fff;
    }

        .m-helpCenterButton:hover .m-helpCenterButtonIcon {
            color: #fff;
        }

.m-helpCenterButtonIcon {
    color: #a5a5a5;
    float: right;
    font-size: 18px;
    line-height: 15px;
}

.m-helpCenterContent {
    display: none;
}
/*Mobile Yardım Merkezi End */
/* Adreslerim */

.m-addressPanelWrapper {
    padding: 10px;
    border: 1px solid #eaeaea;
    border-radius: 5px;
    color: #a5a5a5;
}

.m-addressPanelActive {
    border: 1px solid #6eb356;
    box-shadow: 0px 3px 20px #00000029;
    color: #6eb356;
}

.m-addressPanelText {
    color: #a5a5a5;
    font-size: 11px;
}

.m-addressPanelSubText {
    color: #1d1d1b;
    font-size: 8px;
}

.m-addressPanelLine {
    padding-bottom: 3px;
    border-bottom: 1px solid #ebebeb;
}

.m-newAddressPanel {
    width: 100%;
    height: 100%;
    cursor: pointer;
}

.grayButton {
    background-color: #f2f2f2;
    color: #888;
}

    .grayButton:hover {
        color: #888;
        text-shadow: 0 1px 2px #999;
    }

/*Ödeme Yöntemlerim */
.m-cardPanelWrapper {
    margin: 5px 0;
}

.m-cardHeader {
    color: #1d1d1b;
    font-size: 12px;
}

.m-cardPanel {
    padding: 10px;
    margin: 5px 0;
    border: 1px solid #a5a5a5;
    border-radius: 5px;
}

.m-cardNameText {
    font-size: 12px;
    font-weight: bold;
    color: #1d1d1b;
}

.m-cardEditText {
    font-size: 12px;
    color: #656565;
    cursor: pointer;
}

    .m-cardEditText:hover {
        color: #6eb356;
    }

.m-cardNumberText {
    font-size: 12px;
    color: #6eb356;
}

.m-cardLogo {
    width: 34px;
    height: 11px;
}

.m-cardRemoveItem {
    width: 100%;
}

.m-cardRemoveItemText {
    color: #a5a5a5;
    font-size: 12px;
    float: right;
}

.m-cardRemoveItemIcon {
    color: #ce0917;
    font-size: 16px;
    float: right;
    margin: 1px 5px;
}

.m-cardAddNewButton {
    width: 100%;
    height: 100%;
    cursor: pointer;
}

.m-cardEditPanel {
    margin: 0 0;
}

.m-newCardPanel {
    display: none;
}

/*Mobile Siparişlerim Start*/
.m-ordersWrapper {
    background-color: #fff;
    border-radius: 5px;
    box-shadow: 0px 3px 20px #00000029;
    padding: 0;
}

.m-activeOrdersHeader {
    padding: 12px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
}

.m-activeOrderBadge {
    width: auto;
    min-width: 32px;
    max-height: 32px;
    display: inline-block;
    padding: 5px 7px;
    border-radius: 50%;
    background-color: #fff;
    text-align: center;
}

.m-ordersPanel {
    width: 100%;
    padding: 12px;
}

.m-ordersGrayButton {
    background-color: #6c757d;
    color: #fff;
}

.m-ordersGreenButton {
    background-color: #1abc9c2e;
    color: #1abc9c;
}

.m-ordersRedButton {
    background-color: #f1556c2e;
    color: #f1556c;
}

.m-orderBox {
    margin: 10px 0;
    background-color: #fff;
    border-bottom: 1px solid #e4e4e4;
}

.m-orderBoxBorderGreen {
    border: 1px solid #6eb356;
}

.m-orderBoxBorderRed {
    border: 1px solid #ce0917;
}

.m-orderBadge {
    width: 28px;
    height: 18px;
    font-size: 12px;
    border-top-right-radius: 12px;
    border-bottom-right-radius: 12px;
    color: #fff;
}

.m-orderBadgeGray {
    background-color: #a5a5a5;
}

.m-orderBadgeGrayText {
    color: #828282;
}

.m-orderBadgeGreen {
    background-color: #6eb356;
}

.m-orderBadgeGreenText {
    color: #6eb356;
}

.m-orderBadgeRed {
    background-color: #ce0917;
}

.m-orderBadgeRedText {
    color: #ce0917;
}

.m-orderNumberWrapper {
    padding: 4px 5px 2px 5px;
    background-color: #c1c1c1;
    font-size: 10px;
}

.m-orderProductImage {
    width: 40px;
    margin: 5px 5px 0 0;
    border-radius: 8px;
    box-shadow: 0px 4px 6px #00000029;
}

.m-orderProductCountText {
    color: #a5a5a5;
    font-size: 10px;
}

.m-orderProductPriceText {
    color: #ce0917;
    font-size: 11px;
    font-weight: bold;
}
/*Mobile Siparişlerim End*/

/*Vista Menu Mobile Start */

.m-NavigationBarOrange {
    background-color: #f1592a;
    color: #fff;
}

.m-vistaPointLabel {
    background-color: #ffde00;
    padding: 8px 10px 8px 5px;
    border-radius: 50rem;
}

.m-vistaPointStar {
    padding: 5px 4px;
    color: #ffde00;
    background-color: #1d1d1b;
    font-size: 12px;
    border-radius: 50%;
}

.m-vistaPointNumber {
    font-weight: bold;
}

.m-vistaMenuLeftPanel {
    width: 100%;
    height: 100%;
    padding: 5%;
    color: #fff;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.m-menuPanelCol {
    position: relative;
    z-index: 1;
}

.m-menuPanelBackground {
    position: absolute;
    top: 0;
    left: 11px;
    width: 95%;
    height: 100%;
    object-fit: cover;
    border-radius: 4px;
    z-index: -1;
}

.m-vistaMenuLeftSectionMargin {
    margin-top: 2%;
}

.m-vistaMenuRightPanel {
    background-color: #fff;
    padding: 10%;
    border-radius: 4px;
    height: 100%;
}

.m-vistaMenuGrayPanel {
    width: 100%;
    background-color: #f2f2f2;
    padding: 3%;
    border-radius: 4px;
}

.m-vistaMenuButtons {
    width: 100%;
    background-color: #fff;
    padding: 10px 5px;
    border-radius: 4px;
    text-align: center;
    box-shadow: 0px 10px 12px -16px #111;
}

.m-vistaMenuButtonsVistaCard {
    background-color: #a12900;
    padding: 8px 5px;
}

.m-vistaMenuButtonIcon {
    width: 48px;
    display: inline-block;
}

.m-vistaMenuchanceTab {
    width: 100%;
}

.m-vistaMenuchanceTabText1 {
    position: absolute;
    bottom: 21.6%;
    left: 18%;
    font-size: 5vw;
    line-height: 5vw;
    font-weight: 600;
    color: #fff;
}

.m-vistaMenuchanceTabText2 {
    position: absolute;
    bottom: 6%;
    left: 18%;
    font-size: 2.4vw;
    letter-spacing: 1.5px;
    line-height: 2.8vw;
    font-weight: 600;
}

.m-cardAvantagesButton {
    background-color: transparent;
    border: 1px solid #1d1d1b;
    font-size: 10px;
}

    .m-cardAvantagesButton:hover {
        background-color: #1d1d1b;
        color: white;
    }

.m-vistaMenuLogo {
    width: 36%;
    display: inline-block;
}

.m-vistaLinkButtons {
    display: block;
    padding: 7px 5%;
    margin: 8px 0;
    background-color: #fff;
    border-radius: 4px;
    color: #828282;
    text-decoration: none;
}

/*Vista Menu Mobile End */
@media only screen and (max-width: 576px) and (orientation: landscape) {
    .dekstopDesign {
        display: none !important;
    }

    .mobileDesign {
        display: block !important;
    }
}

@media only screen and (max-width: 768px) and (orientation: landscape) {
    .dekstopDesign {
        display: none !important;
    }

    .mobileDesign {
        display: block !important;
    }
}

@media only screen and (max-width: 992px) and (orientation: landscape) {
    .dekstopDesign {
        display: none !important;
    }

    .mobileDesign {
        display: block !important;
    }
}

@media only screen and (max-width: 1200px) and (orientation: landscape) {
    .dekstopDesign {
        display: block !important;
    }

    .mobileDesign {
        display: none !important;
    }
}

@media only screen and (min-width: 1400px)and (orientation: landscape) {
    .dekstopDesign {
        display: block !important;
    }

    .mobileDesign {
        display: none !important;
    }
}

.threeColumnImage {
    width: 100%;
    height: 250px;
    object-fit: cover;
}

.productDetailCarousel .owl-dots {
    position: absolute;
    bottom: 0;
    left: 2%;
    width: 100%;
    z-index: 2;
}

.productDetailCarousel button.owl-dot span {
    width: 7px !important;
    height: 7px !important;
}

.productDetailCarousel button.owl-dot.active {
    position: relative;
}

    .productDetailCarousel button.owl-dot.active::after {
        content: "";
        position: absolute;
        transform: translate(0, 0);
        width: 60%;
        height: 60%;
        top: 20%;
        left: 20%;
        border: 1px solid #F1592A;
        /*box-shadow: 0px 0px 0px 2px #F1592A inset;*/
        border-radius: 50%;
    }

.modal-backdrop.show {
    opacity: .5 !important;
}

@media screen and (max-width: 992px) {
    .mdCarouselImg {
        height: 285px;
    }

    .categoryNavButton {
        font-weight: 400;
        padding: 6px 15px;
        font-size: 12px;
    }
}

@media screen and (max-width: 480px) {
    .contactInfoBox {
        font-size: 10px;
    }
}

.payMethodDiv {
    margin-top: 1.5rem;
    margin-bottom: 1.5rem;
}

.flatpickr-calendar {
    position: absolute !important;
    z-index: 99999 !important;
    top: 100% !important;
    left: 0 !important;
    width: 100% !important;
    border: 1px solid #6eb356 !important;
    border-radius: 5px !important;
    box-shadow: 0px 3px 20px #00000029 !important;
}

.flatpickr-wrapper {
    width: 100%;
    position: unset !important;
    z-index: 99999 !important;
}

.flatpickr-rContainer {
    width: 100% !important;
}

.flatpickr-days {
    width: 100% !important;
}

.dayContainer {
    min-width: 100% !important;
    width: 100% !important;
}

span.flatpickr-day {
    border: none !important;
    background-color: #A5A5A51A;
    color: #A5A5A5 !important;
    border-radius: 12px !important;
    font-family: "Rubik", sans-serif !important;
    font-weight: normal !important;
    font-size: 14px !important;
    box-shadow: 0px 0px 0px 5px #fff inset;
}

    span.flatpickr-day.prevMonthDay, span.flatpickr-day.nextMonthDay {
        opacity: 0.5 !important;
    }

.numInputWrapper span {
    border-radius: 7px;
}

.flatpickr-current-month .flatpickr-monthDropdown-months {
    border-radius: 7px;
}

.radioAsCheckbox {
    display: none;
}

    .radioAsCheckbox + label {
        margin-right: 10px;
        padding-left: 25px;
        position: relative;
        cursor: pointer;
    }

        .radioAsCheckbox + label:before {
            content: "";
            position: absolute;
            left: -6px;
            top: 50%;
            transform: translateY(-50%);
            width: 25px;
            height: 25px;
            border: 2px solid #555;
            border-radius: 3px;
            background-color: #fff;
        }

    .radioAsCheckbox:checked + label:after {
        content: "";
        position: absolute;
        left: -3px;
        top: 50%;
        transform: translateY(-50%);
        width: 19px;
        height: 19px;
        border-radius: 3px;
        background: #FF6830;
        opacity: 1;
    }

.termsCheckbox {
    display: none;
}

    .termsCheckbox + label {
        margin-right: 10px;
        padding-left: 25px;
        position: relative;
        cursor: pointer;
    }

        .termsCheckbox + label:before {
            content: "";
            position: absolute;
            left: -15px;
            top: 5px;
            width: 25px;
            height: 25px;
            border: 2px solid #555;
            border-radius: 3px;
            background-color: #fff;
        }

    .termsCheckbox:checked + label:after {
        opacity:1;
        position: absolute;
        left: -12px;
        content: "";
        top: 8px;
        width: 19px;
        height: 19px;
        border-radius: 3px;
        background: #FF6830;
    }

.basketProductItem {
    padding-left: 2rem;
}

.basketProductImg {
    width: 100%;
    height: 65px;
    object-fit: cover;
}

.okayCheckbox {
    display: none;
}

    .okayCheckbox + label {
        margin-right: 10px;
        padding-left: 25px;
        position: relative;
        cursor: pointer;
    }

        .okayCheckbox + label:before {
            content: "";
            position: absolute;
            left: -6px;
            top: -4px;
            width: 25px;
            height: 25px;
            border: 2px solid #555;
            border-radius: 3px;
            background-color: #fff;
        }

    .okayCheckbox:checked + label:after {
        position: absolute;
        content: "\f164";
        font-size: 1rem;
        font-weight: 900;
        font-family: "Font Awesome 6 Free";
        left: 0px;
        top: 50%;
        animation-name: up;
        animation-duration: 0.5s;
        animation-fill-mode: forwards;
        opacity: 0;
        color: #828282;
    }

.okayCheckboxLabel {
    font-family: "Rubik", sans-serif;
    font-weight: 500;
    font-size: 12px;
    margin-left: 0.5rem;
}

.height40 {
    height: 40%;
}

.noProductOptionRadio {
    display: none;
}

    .noProductOptionRadio + label {
        margin-right: 10px;
        padding-left: 25px;
        position: relative;
        cursor: pointer;
    }

        .noProductOptionRadio + label:before {
            content: "";
            position: absolute;
            left: -15px;
            top: 9px;
            width: 25px;
            height: 25px;
            border: 2px solid #555;
            border-radius: 3px;
            background-color: #fff;
        }

    .noProductOptionRadio:checked + label:after {
        content: "";
        position: absolute;
        left: -12px;
        top: 12px;
        width: 19px;
        height: 19px;
        border-radius: 3px;
        background: #FF6830;
    }

.agreementCheckBox {
}

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

    .pageContainer {
        padding-top: 0 !important;
    }

    .pageContainerProduct{
        padding: 0 !important;
    }

    .page-content {
        background: none !important;
        padding: 0 !important;
    }

    .basketPanel {
        padding: 0 !important;
    }

    .contactPanel {
        padding: 0 !important;
    }

    .productDetailPanel {
        padding: 0 !important;
    }
}

@media screen and (max-width: 768px) {
    .newAddressPanel {
        margin-top: 1rem;
    }

    .payMethodCard {
        margin-top: 1rem;
    }
}

.checkOutPanel {
    background-color: #fff;
    border-radius: 8px;
    padding: 2rem 15rem;
    min-height: 200px;
}

.checkOutTitle {
    width: 100%;
    text-align: center;
    font-family: "Rubik", sans-serif;
    font-weight: normal;
    font-size: 24px;
    line-height: 24px;
    letter-spacing: 0px;
    color: #6EB356;
    opacity: 1;
    margin-top: 1rem;
}

.checkOutText {
    width: 100%;
    text-align: center;
    font-family: "Rubik", sans-serif;
    font-weight: normal;
    font-size: 16px;
    line-height: 22px;
    letter-spacing: 0px;
    color: #6EB356;
    opacity: 1;
    margin-top: 1rem;
}

.checkOutCard {
    background: #F8F8F8 0% 0% no-repeat padding-box;
    border-radius: 5px;
    opacity: 1;
    padding: 4rem 6rem;
    min-height: 350px;
    margin-top: 2rem;
}

.checkOutDesc {
    width: 100%;
    text-align: center;
    font-family: "Rubik", sans-serif;
    font-weight: normal;
    font-size: 16px;
    line-height: 28px;
    letter-spacing: 0px;
    color: #A5A5A5;
    opacity: 1;
}

.starOutside {
    stroke-width: 0px;
    fill: #e6e6e6;
}

.starInside {
    stroke-width: 0px;
    fill: #d6d6d6;
}

.star {
    width: 30px;
    height: 30px;
    margin-right: 1rem;
    margin-left: 1rem;
    margin-right: 0.75rem;
    margin-left: 0.75rem;
}

.starRow {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 4rem;
}

    .starRow:hover .starOutside {
        fill: #fe0;
    }

    .starRow:hover .starInside {
        fill: #ffc107;
    }

    .starRow .star:hover,
    .starRow .star:hover ~ .star .starOutside {
        fill: #e6e6e6;
    }

        .starRow .star:hover,
        .starRow .star:hover ~ .star .starInside {
            fill: #d6d6d6;
        }

.evaluationText {
    text-align: center;
    font-family: "Rubik", sans-serif;
    font-weight: normal;
    font-size: 18px;
    line-height: 28px;
    letter-spacing: 0px;
    color: #6E6E6E;
    opacity: 1;
}

.evaluationButton {
    border-radius: 5px;
    opacity: 1;
    text-align: center;
    letter-spacing: 0px;
    font-family: "Rubik", sans-serif;
    font-weight: normal;
    font-size: 12px;
    line-height: 10px;
    color: #F2F2F2;
    opacity: 1;
    padding: 1rem;
    text-decoration: none;
}

    .evaluationButton:hover {
        color: #F2F2F2;
    }

.orderImageDiv {
    margin-left: 1.5rem;
}

@media screen and (max-width: 1200px) {
    .checkOutPanel {
        padding: 2rem 6rem;
    }

    .checkOutCard {
        padding: 3rem 3rem;
    }

    /*    .accountPanel {
        padding: 2.5rem;
    }*/

        .orderImageDiv {
        display: none;
    }

    .transparentPopup {
        background: rgb(0 0 0 / 50%);
    }

    .backgroundLock {
        background: rgb(44 44 44 / 10%);
    }
}

@media screen and (max-width: 992px) {
    .checkOutPanel {
        padding: 0;
    }

    .checkOutCard {
        padding: 2rem 2rem;
    }

    .payMethodPanel {
        padding-left: 0 !important;
    }

    .myAccountPanel {
        padding-left: 0 !important;
    }
}
.bgUnset .contactPanel {
    margin: 2rem 0;
    box-shadow: 0px 0px 30px #0000004F;
}
.contactPanel {
    background-color: #fff;
    border-radius: 8px;
    padding: 2.5rem;
    min-height: 200px;
}

/*placeholders*/
input::placeholder {
    font-family: "Rubik", sans-serif;
    font-weight: normal;
    font-size: 12px;
    color: #1D1D1B;
}

input::-webkit-input-placeholder {
    font-family: "Rubik", sans-serif;
    font-weight: normal;
    font-size: 12px;
    color: #1D1D1B;
}

input::placeholder {
    font-family: "Rubik", sans-serif;
    font-weight: normal;
    font-size: 12px;
    color: #1D1D1B;
}

textarea::placeholder {
    font-family: "Rubik", sans-serif;
    font-weight: normal;
    font-size: 13px;
    color: #A5A5A5;
}

textarea::-webkit-input-placeholder {
    font-family: "Rubik", sans-serif;
    font-weight: normal;
    font-size: 13px;
    color: #A5A5A5;
}

textarea:-ms-input-placeholder {
    font-family: "Rubik", sans-serif;
    font-weight: normal;
    font-size: 13px;
    color: #A5A5A5;
}

.shipTimeInput::placeholder {
    font-family: "Rubik", sans-serif;
    font-weight: 400;
    font-size: 12px;
    color: #FFFFFF;
}

.shipTimeInput::-webkit-input-placeholder {
    font-family: "Rubik", sans-serif;
    font-weight: 400;
    font-size: 12px;
    color: #FFFFFF;
}

.shipTimeInput:-ms-input-placeholder {
    font-family: "Rubik", sans-serif;
    font-weight: 400;
    font-size: 12px;
    color: #FFFFFF;
}

.m-nutSearchInput::placeholder {
    font-family: "Rubik", sans-serif;
    font-weight: 400;
    font-size: 12px;
    color: #FFFFFF;
    padding-left: 0.5rem;
}

.m-nutSearchInput::-webkit-input-placeholder {
    font-family: "Rubik", sans-serif;
    font-weight: 400;
    font-size: 12px;
    color: #FFFFFF;
    padding-left: 0.5rem;
}

.m-nutSearchInput:-ms-input-placeholder {
    font-family: "Rubik", sans-serif;
    font-weight: 400;
    font-size: 12px;
    color: #FFFFFF;
    padding-left: 0.5rem;
}

.deliveryRegionTextBox::placeholder {
    color: #fff;
}

.deliveryRegionTextBox::-webkit-input-placeholder {
    color: #fff;
}

.deliveryRegionTextBox:-ms-input-placeholder {
    color: #fff;
}

.loginTextBox::placeholder {
    color: #fff;
}

.loginTextBox::-webkit-input-placeholder {
    color: #fff;
}

.loginTextBox:-ms-input-placeholder {
    color: #fff;
}

.loginConfirmationTextBoxTransparent::placeholder {
    color: #fff;
}

.loginConfirmationTextBoxTransparent::-webkit-input-placeholder {
    color: #fff;
}

.loginConfirmationTextBoxTransparent:-ms-input-placeholder {
    color: #fff;
}


/*nut css start*/

@media (min-width: 576px) {
    .productGridCard {
        border-radius: 10px !important;
    }

    .productGridImg {
        border-radius: 0 !important;
        height: 175px !important;
    }

    .productGridRightColumn {
        border-radius: 10px !important;
    }
}

@media (min-width: 768px) {
    .productGridCard {
        border-radius: 10px !important;
    }

    .productGridImg {
        border-radius: 0 !important;
        height: 250px !important;
    }

    .productGridRightColumn {
        border-radius: 10px !important;
    }
}

@media (min-width: 992px) {
    .productGridCard {
        border-radius: 0 !important;
    }

    .productGridImg {
        border-radius: 27px !important;
        height: 390px !important;
    }

    .productGridRightColumn {
        border-radius: 0 !important;
    }
}

.productGridCard {
    border-radius: 10px;
    background: #FFFFFF 0% 0% no-repeat padding-box;
    border: 1px solid #E5E5E5;
    padding: 1rem;
    margin-bottom: 1rem;
}

.productGridImg {
    width: 100%;
    height: 175px;
    object-fit: cover;
    border: 1px solid #E5E5E5;
    border-radius: 0;
}

.productGridName {
    text-align: center;
    font-family: "Rubik", sans-serif;
    font-weight: 600;
    font-size: 14px;
    line-height: 15px;
    letter-spacing: 0px;
    color: #1D1D1B;
    opacity: 1;
    margin-top: 1rem;
    margin-bottom: 1rem;
    height: 30px;
    overflow: hidden;
}

.productGridOldPrice {
    text-align: center;
    font-family: "Rubik", sans-serif;
    font-weight: normal;
    font-size: 12px;
    line-height: 18px;
    letter-spacing: 0px;
    color: #A4A4A4;
    opacity: 1;
    margin-top: 1rem;
    text-decoration: line-through;
}

.productGridPrice {
    text-align: center;
    font-family: "Rubik", sans-serif;
    font-weight: 600;
    font-size: 18px;
    line-height: 20px;
    letter-spacing: 0px;
    color: #CE0917;
    opacity: 1;
    margin-bottom: 1rem;
}

.productGridLeftColumn {
    background-color: #1D1D1B;
    opacity: 1;
    color: #FFFFFF;
    text-align: center;
    font-family: "Rubik", sans-serif;
    font-weight: normal;
    font-size: 18px;
    line-height: 25px;
    padding: 0.5rem 0.25rem;
    text-decoration: none;
    height: 40px;
}

.productGridRightColumn {
    cursor:pointer;
    background-color: #6EB356;
    opacity: 1;
    color: #FFFFFF;
    text-align: center;
    font-family: "Rubik", sans-serif;
    font-weight: normal;
    font-size: 16px;
    line-height: 16px;
    padding: 0.75rem 0.25rem;
    text-decoration: none;
    border-radius: 10px;
    height: 40px;
    margin-right: auto;
    margin-left: auto;
}

.queryOrderButton {
    padding: 0.75rem;
    color: #fff;
    font-size: 12px;
    font-weight: 600;
    line-height: 12px;
    border: 2px solid;
    position: absolute !important;
    width: 45px;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    top: 0;
    right: 0;
    border-radius: 3px;
}

.similarProductGridRightColumn {
    background-color: #6EB356;
    opacity: 1;
    color: #FFFFFF;
    text-align: center;
    font-family: "Rubik", sans-serif;
    font-weight: normal;
    font-size: 15px;
    line-height: 15px;
    padding: 0.75rem 0.25rem;
    text-decoration: none;
    border-radius: 0px;
    height: 40px;
}

.similarProductCard {
    background: #F8F8F8 0% 0% no-repeat padding-box;
    opacity: 1;
}

.similarProductImg {
    width: 100%;
    height: auto;
    height: 295px !important;
    object-fit: contain !important;
}

.m-nutHeaderIcon {
    background: #4478321c 0% 0% no-repeat padding-box;
    border-radius: 50%;
    width: 45px;
    height: 45px;
    font-size: 5vw;
    display: flex;
    justify-content: center;
    align-items: center;
    text-decoration: none;
}

.m-kitchenHeaderIcon {
    color: #fff;
    border-radius: 50%;
    padding: 0.75rem;
    width: 100%;
    height: 100%;
    font-size: 5vw;
    display: flex;
    justify-content: center;
    align-items: center;
    text-decoration: none;
}

.m-b2bHeaderIcon {
    background:white;
    border-radius: 50%;
    padding: 0.75rem;
    width: 100%;
    height: 100%;
    font-size: 5vw;
    display: flex;
    justify-content: center;
    align-items: center;
    text-decoration: none;
}

@media (min-width: 576px) and (max-width: 992px) {
    .m-nutHeaderIcon {
        font-size: 3vw;
    }

    .m-kitchenHeaderIcon {
        font-size: 3vw;
    }
}

@media (max-width: 576px) {
    .productGridRightColumn {
        font-size: 15px;
    }
}

.m-nutSearchRow {
    position: relative;
    z-index: 1;
    background-color: #f2f2f2;
    padding: 0.5rem;
}

.m-nutSearchIcon {
    position: absolute;
    top: 30%;
    left: 5%;
    font-size: 18px;
    color: #d2d2d1;
    width: fit-content;
}

.m-nutSearchInput {
    padding: 0.25rem 0.25rem 0.25rem 2.5rem;
    background-color: #fff;
    border: 1px solid #e3e3e3;
    border-radius: 30px;
    font-size: 14px;
    width: 100%;
    height: 40px;
}

.m-nutSearchInputButton {
    min-width: fit-content;
    padding: 0.35rem;
    position: absolute;
    top: 12px;
    right: 24px;
    border: none !important;
    border-radius: 20px;
    color: #ffffff;
    font-size: 14px;
    text-align: center;
    width: 55px;
}

.productListGridCard {
    background: #FFFFFF 0% 0% no-repeat padding-box;
    border: 1px solid #E5E5E5;
    padding: 1rem;
}

    .productListGridCard .productGridLeftColumn {
        font-size: 16px !important;
    }

    .productListGridCard .productGridRightColumn {
        font-size: 14px !important;
    }

    .productListGridCard .productQuantityText {
        font-size: 14px !important;
    }

@media (min-width:1200px) and (max-width:1400px) {
    .productListGridCard .productGridLeftColumn {
        font-size: 10px !important;
    }

    .productListGridCard .productGridRightColumn {
        font-size: 10px !important;
    }

    .productListGridCard .productQuantityText {
        font-size: 12px !important;
    }
}
.productListGridImgWrapper{
    max-height: 320px
}
.productListGridImg {
    border: 1px solid #E5E5E5;
    border-radius: 27px;
    width: 100%;
    object-fit: cover;
}

.w-90 {
    width: 90% !important;
}

/*nut css end*/

/*kitchen css start*/

/* Start of Navbar */

.kitchenHeaderLogoLink {
    display: block;
    margin-top: 5px;
    margin-left: -2px;
    color: inherit;
    text-decoration: none;
    outline: none;
    border: none;
}

.kitchenSearchPanel {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

.kitchenGeneralTextBox {
    border-radius: 0;
    height: 40px;
    width: 100%;
    background: #ffffff 0% 0% no-repeat padding-box;
    border: 1px solid #70707033 !important;
    font-size: 15px;
    padding-left: 0.25rem;
}

    .kitchenGeneralTextBox:focus-visible {
        outline: none;
        border-color: currentColor;
        outline-offset: 0px;
    }

    .kitchenGeneralTextBox::placeholder {
        font-family: "Rubik", sans-serif;
        font-weight: normal;
        font-size: 14px;
        line-height: 17px;
        letter-spacing: 0px;
        color: #1b1d1c4d;
    }

.sharpEdgeButton {
    position: absolute;
    height: 41%;
    right: 3.5%;
    top: 50%;
    transform: translateY(-50%);
    font-family: "Rubik", sans-serif;
    font-weight: normal;
    font-size: 12px;
    line-height: 15px;
    letter-spacing: 0px;
    padding: 0.75rem;
    border-radius: 0;
    color: #1d1d1b;
    background-color: #F8F8F8;
    z-index: 100;
    border: none;
    width: 25%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.kitchenHeaderButtons {
    width: auto;
    float: left;
    margin: 16px 5px;
    height: auto;
    letter-spacing: 0px;
    color: #1d1d1b;
    background-color: #F8F8F8;
    cursor: pointer;
    padding: 6px 10px;
    display: flex;
    align-items: center;
    border-radius: 0;
    text-decoration: none;
}

.kitchenHeaderButtonIcon {
    width: auto;
    height: auto;
    margin: 2px;
    font-size: 16px;
}

.kitchenHeaderButtons:hover .kitchenHeaderButtonIcon {
    color: white !important;
}

.kitchenHeaderButtonTextPanel {
    margin-left: 5px;
}

.kitchenHeaderButtonText {
    font-family: "Rubik", sans-serif;
    font-weight: normal;
    font-style: normal;
    font-size: 12px;
    line-height: 17px;
}

/* End of Navbar */

/*Start of Header Menu And Bottom Menu */
.kitchenHeaderMenu {
    position: relative;
    background-color: #1d1d1b;
}

.kitchenHeaderBottomMenuWrapper {
    display: flex;
    align-items: center;
    position: relative;
    min-height: 40px;
}

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

    .kitchenHeaderBottomButton:hover .kitchenHeaderMenuIcon {
        transform: rotate(45deg) scale(1.5);
    }

    .kitchenHeaderBottomButton:hover .kitchenHeaderHoverContent {
        min-width: 91.66666666%;
        height: 100%;
    }

.kitchenHeaderMenuIconDiv {
    width: 7.33333333%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0.66666666%;
    z-index: 1;
    display: flex;
    justify-content: center;
    align-items: center;
}

.kitchenHeaderMenuIcon {
    transition: transform 0.3s ease;
    width: 2vw;
}

.kitchenHeaderHoverContentList {
    display: flex;
    justify-content: space-around;
    align-items: center;
    color: white;
    list-style: none;
    width: 100%;
    height: 100%;
}

.kitchenHeaderHoverContent {
    position: absolute;
    top: 0;
    left: 7.66666666%;
    width: 0;
    overflow: hidden;
    height: 0;
    z-index: 1;
    transition: width 0.2s ease;
}

    .kitchenHeaderHoverContent a {
        font-style: normal;
        font-weight: 600;
        font-size: 12px;
        line-height: 17px;
        font-family: "Rubik", sans-serif;
        color: white;
        text-decoration: none;
    }

.kitchenHeaderBottomMenuExpanded {
    position: absolute;
    width: 200%;
    top: 100%;
    left: -52%;
    background-color: #454545;
    display: none;
    animation-duration: 0.5s !important;
}

    .kitchenHeaderBottomMenuExpanded:hover {
        display: block;
        min-height: 200px;
    }

.kitchenHeaderBottomMenu {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: auto;
    margin-bottom: auto;
    padding-left: 0;
}

.kitchenHeaderBottomMenuList {
    color: white;
    margin: 0 0.25rem;
    min-height: 70px;
    text-align: center;
    list-style: none;
    display: flex;
    flex-direction: column;
    justify-content: end;
    align-items: center;
}

.kitchenHeaderBottomMenuListIcon {
    font-size: 2rem;
    opacity: 0;
    line-height: 0.25 !important;
    margin-top: 0.5rem;
}

.kitchenHeaderBottomMenuListItem {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 35px;
    padding: 0.25rem 0.5rem;
}

.kitchenHeaderBottomMenuList:hover .kitchenHeaderBottomMenuListItem {
    border-radius: 4px;
    color: #fff;
}

.kitchenHeaderBottomMenuList:hover .kitchenHeaderBottomMenuLink {
    color: #fff;
}

.kitchenHeaderBottomMenuList:hover .kitchenHeaderBottomMenuListIcon {
    opacity: 1;
}

.kitchenHeaderBottomMenuList:hover .kitchenHeaderBottomMenuExpanded {
    display: block;
    min-height: 200px;
}

.kitchenHeaderBottomMenuLink {
    color: inherit;
    text-decoration: none !important;
    font-style: normal;
    font-size: 12px;
    line-height: 17px;
    font-family: "Rubik", sans-serif;
    text-align: left;
}

.kitchenHeaderBottomMenuListImg {
    margin-right: 10px;
    width: 25px;
    height: 25px;
}

.kitchenHeaderBottomMenuExpandedDiv {
    position: relative;
    padding: 1rem 0.5rem;
}

.kitchenHeaderBottomMenuExpandedImgDiv {
    padding: 1rem;
    border-radius: 5px;
}

.kitchenHeaderBottomMenuExpandedButton {
    position: absolute;
    bottom: 5px;
    left: 50%;
    background-color: #ce0917;
    font-size: 12px;
    height: 36px !important;
    line-height: 15px;
    color: #fff;
    padding: 0.35rem 0.5rem;
    border: none;
    border-radius: 4px;
    transform: translateX(-50%);
    transition: bottom 0.3s ease;
    z-index: 1;
    text-decoration: none;
    width: 75%;
}

.kitchenHeaderBottomMenuExpandedImgDiv:hover + .kitchenHeaderBottomMenuExpandedButton {
    bottom: 5%;
}

.kitchenHeaderBottomMenuExpandedImg {
    width: 100%;
    height: 150px;
    object-fit: cover;
    transition: transform 0.3s ease;
}

.kitchenHeaderBottomMenuExpandedImgDiv:hover
.kitchenHeaderBottomMenuExpandedImg {
    transform: scale(1.2);
}

.kitchenHeaderBottomMenuExpandedUl {
    list-style: none;
}

.kitchenHeaderBottomMenuExpandedLi {
    position: relative;
    padding-left: 20px;
    text-align: left;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: start;
}

    .kitchenHeaderBottomMenuExpandedLi::before {
        border-radius: 3px;
        color: white;
        content: "";
        position: absolute;
        left: 0;
        top: 50%;
        transform: translateY(-50%);
        height: 85%;
        width: 5px;
        transition: width 0.3s ease;
    }

    .kitchenHeaderBottomMenuExpandedLi:hover::before {
        width: 105%;
    }

    .kitchenHeaderBottomMenuExpandedLi::after {
        content: "";
        position: absolute;
        left: 0;
        top: 50%;
        transform: translateY(-50%);
        color: white;
        transition: left 0.3s ease;
    }

    .kitchenHeaderBottomMenuExpandedLi:hover::after {
        border: 1px solid #ffffff;
        width: 13px;
        left: 10px;
    }

.kitchenHeaderBottomMenuExpandedLink {
    height:unset !important;
    max-height:34px !important;
    width: 95%;
    color: white;
    text-decoration: none;
    padding: 0;
    display: inline-block;
    transition: left 0.3s ease;
    position: relative;
    left: 0;
    font-style: normal;
    font-size: 12px;
    line-height: 17px;
    font-family: "Rubik", sans-serif;
}

.kitchenHeaderBottomMenuExpandedLi:hover .kitchenHeaderBottomMenuExpandedLink {
    left: 10px;
}


/*End of Header Menu And Bottom Menu */

/* slot carouse start */

.kitchenCarouselDiv {
    position: relative;
    width: 120px;
    height: 140px;
    border: 1px solid #1d1d1b26;
    border-radius: 8px;
    margin-right: auto;
    margin-left: auto;
}

.kitchenCarouselImgOverlay {
    position: absolute;
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-top: 10px;
    transition: transform 0.5s ease;
}
.kitchenCarouselHoverImgWrapper {
    height: 70px;
}
.kitchenCarouselImgWrapper {
    height: 50px;
    object-fit: contain !important;
}
.kitchenCarouselImgTitle {
    font-size: 12px;
    line-height: 15px;
    font-weight: 600;
    font-family: "Rubik", sans-serif;
    color: #1d1d1b;
    margin-top: 1rem;
    text-align: center;
}

.kitchenCarouselHoverImg {
    position: absolute;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: transform 0.5s ease;
    transform: translateY(100%);
}

.kitchenCarouselDiv:hover .kitchenCarouselImgOverlay {
    transform: translateY(-100%);
}

.kitchenCarouselDiv:hover .kitchenCarouselHoverImg {
    transform: translateY(0%);
}

.kitchenMailAbsolute {
    margin-top: -110px;
    position: absolute;
}

.slotCarousel .owl-item img {
    height: 100%;
    object-fit: contain !important;
}

.kitchenAboutInformationTitle {
    font: normal normal 600 20px/60px Rubik;
    letter-spacing: 0px;
    color: #1d1d1b;
}

.kitchenAboutInformationExplanation {
    font: normal normal normal 14px/19px Rubik;
    letter-spacing: 0px;
    color: #1d1d1b;
}

.kitchenAboutInformationDiv {
    max-height: 170px;
    overflow-y: auto;
}

    .kitchenAboutInformationDiv::-webkit-scrollbar {
        width: 5px;
    }

    .kitchenAboutInformationDiv::-webkit-scrollbar-track {
        border-radius: 10px;
    }

    .kitchenAboutInformationDiv::-webkit-scrollbar-thumb {
        background: gray;
        border-radius: 10px;
    }

        .kitchenAboutInformationDiv::-webkit-scrollbar-thumb:hover {
            background: gray;
        }

.kitchenMonthlyProducts {
    background-color: #f5f5f5;
    height: 545px;
}

.kitchenMonthlyProductsHeader {
    background-color: #1d1d1b;
    height: 300px;
}


    .kitchenSectionHeader {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        padding: 20px 30px 20px;
    }

.kitchenSectionTitle {
    font-style: normal;
    font-weight: 600;
    font-size: 18px;
    line-height: 24px;
    font-family: "Rubik", sans-serif;
    color: #1d1d1b;
    letter-spacing: 0px;
    position: relative;
}

.kitchenSectionDescriptionNormal {
    font-style: normal;
    font-weight: normal;
    font-size: 14px;
    line-height: 19px;
    font-family: "Rubik", sans-serif;
    text-align: center;
}

.kitchenSectionDescriptionMedium {
    text-align: center;
    color: #1d1d1b;
    font-family: "Rubik", sans-serif;
    font-weight: 600;
    font-size: 14px;
    line-height: 20px;
}

.kitchenSectionDividerHr {
    width: 25%;
    opacity: 1;
    height: 2px !important;
    border-top: none !important;
}

.headerBasketPopupOrangeButton {
    width: 140px;
    padding: 8px 10px;
    margin: 0 12px 0 0;
    background-color: #ce0917;
}

    .headerBasketPopupOrangeButton:hover {
        background-color: #1d1d1b;
        color: #fff;
    }

.footerMainBackGround {
    padding-top: 60px;
    margin-top: 75px;
}

.flag {
    width: 15px;
    height: 15px;
    border-radius: 100%;
}

/* slot carouse end */

/* Start of Monthly Products */

.kitchenCardProduct {
    position: relative;
    background-color: white;
    text-align: center;
    padding-bottom: 2rem;
    border-radius: 17px;
    transition: transform 0.3s ease;
}

    .kitchenCardProduct .newPrice {
        margin-bottom: 0rem;
    }
.kitchenCardProductImgWrapper {
    width: 100%;
    height: 220px;
}
.kitchenCardProductImg {
    width: 100%;
    height: 100%;
    padding-top: 1rem;
    object-fit: contain;
}

.kitchenCardProduct:hover .kitchenCardProductImgWrapper {
    display: none;
}
.kitchenCardProductHoverImgWrapper {
    width: 100%;
    height: 150px;
    display:none
}
.kitchenCardProductHoverImg {
    display: none;
    width: 100%;
    height: 220px;
    padding: 1rem;
}

.kitchenCardProduct:hover .kitchenCardProductHoverImgWrapper {
    display: inline-block;
}
.kitchenCardProduct:hover .kitchenCardProductHoverImg {
    display: inline-block;
}
.kitchenCardProduct:hover {
    transform: translateY(-10px);
}

.kitchenCardProductButton {
    cursor: pointer;
    overflow: hidden;
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 40px;
    height: 40px;
    border-radius: 30px;
    transition: all 0.3s ease;
}

.kitchenCardProduct:hover .kitchenCardProductButton {
    width: 150px;
    border-radius: 30px;
    transition: width 0.3s ease;
}

.kitchenCardProductButton i {
    transition: transform 0.3s ease;
    width: 100%;
    transform: translateY(-50%) translateX(-50%);
    top: 50%;
    position: absolute;
    left: 50%;
}

.kitchenCardProduct:hover .kitchenCardProductButton i {
    transform: translateY(-260%) translateX(-50%);
}

.kitchenCardProductAddButton {
    position: absolute;
    text-align: center;
    font-size: 14px;
    font-weight: 400;
    font-family: "Rubik", sans-serif;
    letter-spacing: 0px;
    color: #ffffff;
    opacity: 1;
    border: none;
    position: absolute;
    width: 100%;
    height: 100%;
    transition: transform 0.5s ease;
    z-index: 1;
    top: -13%;
    left: 0%;
    transform: translateY(55px);
    transition: 0.3s ease;
    text-decoration: none;
}

.kitchenCardProduct:hover .kitchenCardProductAddButton {
    transform: translateY(15px);
    transition: 0.3s ease;
}

.kitchenCardProductDividerHr {
    width: 80%;
    margin-right: auto !important;
    margin-left: auto !important;
    text-align: center;
}

/*End of Monthly Products */

/*Start of Products price*/

.kitchenProductNameAndDescription {
    letter-spacing: 0px;
    color: #1b1d1c;
    font-size: 12px;
    line-height: 15px;
    font-style: normal;
    font-weight: 600;
    font-family: "Rubik", sans-serif;
    margin-bottom: 5px;
    text-decoration: none;
}
.kitchenCardProduct .kitchenProductNameAndDescription {
    padding:0 1rem;
}
    .kitchenProductPriceSmall {
    display: block;
    font-family: "Rubik", sans-serif;
    font-weight: normal;
    font-style: normal;
    font-size: 15px;
    line-height: 23px;
    letter-spacing: 0px;
    color: #a4a4a4;
    text-decoration: line-through;
}

.kitchenProductPriceBig {
    font-family: "Rubik", sans-serif;
    font-weight: 600;
    font-style: normal;
    font-size: 20px;
    line-height: 23px;
    letter-spacing: 0px;
    color: #ce0917;
}

/*End of Products price*/

/* Start of Spare Parts */

.kitchenSparePartsProdBanner {
    background-color: #000;
    width: 100%;
    height: 100%;
    border-radius: 10px;
}

.kitchenBoxProductImgDiv {
    background: #ffffff;
    border: 1px solid #1d1d1b1a;
    padding: 1rem;
    margin-bottom: 1.5rem;
    border-radius: 8px;
    display: flex;
    justify-content: center;
    height: 195px;
}

.kitchenBoxProductImg {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.kitchenBoxImg {
    width: 400px;
    height: 300px;
    object-fit: fill;
    border-radius: 8px;
}

.kitchenBoxProductDetails {
    display: flex;
    align-items: end;
    justify-content: space-between;
}

.kitchenBoxProductTextStart {
    text-align: left;
}
    .kitchenBoxProductTextStart .productPriceDiv{
        align-items:start;
        justify-content:end;
        height:50px;
    }
    .kitchenBoxProductTextStart .oldPrice {
        margin-top: 0rem;
        font-size: 13px;
    }
    .kitchenBoxProductTextStart .newPrice {
        margin-bottom: 0rem
    }
    .kitchenBoxProductTextStart .kdvText {
        margin-bottom: 6px;
    }


    .kitchenBoxProductButton {
        width: 50px;
        height: 50px;
        background-color: #1b1d1c;
        color: #ffffff;
        border-radius: 100%;
        font-size: 1.5em;
        border-width: 0px;
    }

/* End of Spare Parts */


/* Start of Slider Image  */

.kitchenSliderImgWrapper {
    margin-top: 1rem;
    position: relative;
    padding: 0;
    width: 100%;
}

.kitchenSliderImg {
    width: 100%;
    height: 370px;
    object-fit: cover;
}

.kitchenSliderImgDiv {
    position: absolute;
    top: 15%;
    width: 100%;
}

.kitchenSliderItemImg {
    width: auto;
    height: 60px;
    object-fit: cover;
}

.kitchenSliderImageTitle {
    font-family: "Rubik", sans-serif;
    font-weight: normal;
    font-style: normal;
    font-size: 30px;
    line-height: 61px;
    letter-spacing: 1.68px;
    color: #f8f8f8;
}

.kitchenSliderImageText {
    font-family: "Rubik", sans-serif;
    font-weight: 600;
    font-size: 20px;
    line-height: 34px;
    color: #f8f8f8;
    margin: 0px;
}

.kitchenSliderImageButton {
    letter-spacing: 0px;
    color: #ffffff;
    background-color: transparent;
    font-size: 18px;
    font-weight: 500;
    border: 1px solid #ffffff;
    border-radius: 5px;
    margin-top: 15px;
    text-decoration: none;
    cursor: pointer;
    display: inline-block;
    padding: 0.375rem 0.75rem;
}

    .kitchenSliderImageButton:hover {
        color: #1d1d1b;
        background-color: #ffffff;
        border: 1px solid #1d1d1b;
    }


/*mobile*/

.m-kitchenSliderImageTitle {
    font-family: "Rubik", sans-serif;
    font-weight: normal;
    font-style: normal;
    font-size: 24px;
    line-height: 41px;
    letter-spacing: 1.68px;
    color: #f8f8f8;
    margin-bottom: 0rem !important;
}

.m-kitchenSliderImageButton {
    letter-spacing: 0px;
    color: #1d1d1b;
    background-color: #ffffff;
    font-size: 12px;
    font-weight: 600;
    border: 1px solid #ffffff;
    border-radius: 5px;
    margin-top: 15px;
    text-decoration: none;
    cursor: pointer;
    display: inline-block;
    padding: 0.375rem 0.75rem;
}

.m-kitchenSliderImageText {
    font-family: "Rubik", sans-serif;
    font-weight: 600;
    font-size: 12px;
    line-height: 34px;
    color: #f8f8f8;
    margin: 0px;
}

.m-kitchenSliderImgDiv {
    padding-left: 10px;
    top: 5%;
    position: absolute;
    width: 100%;
}

.m-kitchenSliderItemImg {
    width: auto;
    height: 35px;
    object-fit: cover;
}
/* End of Slider Image */


@media screen and (max-width:992px) {
    .kitchenHeaderBottomMenuExpandedImg {
        height: 90px;
    }

    .kitchenHeaderBottomMenuExpandedButton {
        padding: 0.35rem 0.2rem;
    }

    .kitchenArticleSliderDiv:before {
        top: 50% !important;
        background-color: white !important;
    }

    .kitchenArticleSliderButtonText {
        transform: translateX(31%) !important;
        top: 24% !important;
        font-size: 12px !important;
    }

    .kitchenArticleSliderButton {
        width: 150px !important;
        height: 30px !important;
    }

        .kitchenArticleSliderButton img {
            transform: translateX(150px) !important;
        }
}

.kitchenArticleSliderDiv {
    overflow: hidden;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    transition: transform 0.5s ease;
    position: relative;
    border-radius: 16px;
    transform: translateY(10px);
}

    .kitchenArticleSliderDiv:hover {
        transform: translateY(0px);
    }

    .kitchenArticleSliderDiv:before {
        content: "";
        position: absolute;
        top: -50%;
        left: 0;
        transform: translateY(-50%);
        width: 100%;
        height: 100%;
        background-color: transparent;
        transition: top 0.5s ease;
        z-index: -1;
        border-radius: 15px;
    }

    .kitchenArticleSliderDiv:hover:before {
        background-color: white;
        top: 50%;
        transition: top 0.5s ease;
    }

.kitchenArticleSliderButton {
    position: relative;
    display: flex;
    justify-content: center;
    margin-bottom: 1rem;
    width: 35px;
    height: 35px;
    border-radius: 30px;
    overflow: hidden;
    transition: width 0.3s ease;
    text-decoration: none;
}

.kitchenArticleSliderDiv:hover .kitchenArticleSliderButton {
    width: 150px;
}

.kitchenArticleSliderButtonText {
    text-align: center;
    font-size: 14px;
    font-weight: 400;
    font-family: "Rubik", sans-serif;
    letter-spacing: 0px;
    color: #ffffff;
    text-transform: uppercase;
    position: absolute;
    left: 0;
    transform: translateX(-130%);
    top: 20%;
    transition: transform 0.3s ease;
    text-decoration: none;
}

.kitchenArticleSliderDiv:hover .kitchenArticleSliderButtonText {
    transform: translateX(20%);
}

.kitchenArticleSliderButton i {
    transition: transform 0.3s ease;
    transform: translateY(-50%) translateX(-50%);
    top: 50%;
    position: absolute;
    left: 50%;
}

.kitchenArticleSliderDiv:hover .kitchenArticleSliderButton i {
    transform: translateX(8vw) translateY(-50%);
}

.kitchenArticleSliderImg {
    width: 100%;
    max-height: 300px;
    object-fit: cover;
}


.kitchenArticleSliderTitle {
    line-height:15px;
    font-family: "Rubik", sans-serif;
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 0px;
    color: #1b1d1c;
    text-align: center;
    margin-top: 1rem;
    margin-bottom: 1rem;
}

.kitchenArticleSliderDescription {
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
    display: -webkit-box;
    overflow: hidden;
    font: normal normal normal 12px/15px Rubik !important;
    letter-spacing: 0px;
    color: #1d1d1b;
    text-align: center;
    margin-bottom: 1rem;
    padding-right: 1rem;
    padding-left: 1rem;
    height: 60px;
    overflow: hidden;
}

.kitchenArticleSliderDetails {
    display: flex;
    justify-content: space-evenly;
    text-align: center;
    font: normal normal normal 12px/23px Rubik;
    letter-spacing: 0px;
    color: #a4a4a4;
    text-decoration: none;
}

/* End of BLOG and NEWS */

.kitchenHeaderLogo {
    width: 70%;
}

.kitchenCirleIcon {
    position: relative;
    width: 20px;
    height: 20px;
}

.kitchenCirleIconNumber {
    position: absolute;
    font-style: normal;
    font-variant: normal;
    font-weight: 600;
    font-size: 12px;
    line-height: 12px;
    font-family: "Rubik", sans-serif;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    color: white;
}

.kitchenBackgroundLock {
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1059;
    background-color: #ce0917;
}

.kitchenBackgroundLockOverlay {
    position: relative;
}

    .kitchenBackgroundLockOverlay::before {
        content: "";
        z-index: 1059;
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-color: #ce0917;
        opacity: 0.3;
    }

.button-container {
    position: fixed;
    bottom: 50px; /* Sayfanın altından yükseklik */
    left: 50%; /* Sayfanın yatay ortası */
    transform: translateX(-50%);
}

.kitchenProgressDots {
    display: flex;
    margin: 0 1px 10px 3px;
}

.dot {
    width: 100%;
    height: 5px;
    background-color: #ccc;
    margin-right: 3px;
    transform: skew(-25deg);
}

.kitchenCarouselProductButton {
    position:relative;
    cursor: pointer;
    overflow: hidden;
    background-color: #1b1d1c;
    transition: background-color 0.3s ease;
    border-radius: 100%;
    width: 35px;
    height: 35px;
}

.kitchenPlus {
    background-color: transparent;
    color: #ffffff;
    font-size: 0.9em;
    position:absolute;
    top: 50%;
    left: 50%;
    transform: translateX(-50%) translateY(-50%);
    transition: all 0.3s ease;
}

.kitchenCheck {
    position: absolute;
    transform: translateX(76%) translateY(26px);
    color: white;
    font-size: 24px;
    transition: all 0.3s ease;
}



.mobileKitchenHeaderMenuList {
    list-style: none;
    margin-left: 2rem;
}

.mobileKitchenHeaderMenuLink {
    text-decoration: none;
    color: #fff;
    font-style: normal;
    font-size: 14px;
    line-height: 14px;
    font-family: "Rubik", sans-serif;
    margin: 1rem auto;
    display: flex;
    align-items: center;
}

.m-kitchenSectionDescriptionMedium {
    text-align: center;
    color: #1d1d1b;
    font-family: "Rubik", sans-serif;
    font-weight: 500;
    font-size: 14px;
    line-height: 19px;
}

.m-kitchenSectionDividerHr {
    width: 37%;
    opacity: 1;
    height: 2px !important;
    border-top: none !important;
}


.m-kitchenCardProduct {
    position: relative;
    background-color: white;
    text-align: center;
    padding-bottom: 3rem;
    border-radius: 17px;
    transition: transform 0.3s ease;
}

.m-kitchenCardProductImg {
    width: 100%;
    height: 210px;
    object-fit: contain;
}

.m-kitchenCardProductButton {
    cursor: pointer;
    overflow: hidden;
    position: absolute;
    top: 98%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 200px;
    height: 40px;
    border-radius: 30px;
    background-color: #ce0917;
    display: flex;
    justify-content: center;
    align-items: center;
}

.m-kitchenCardProductButtonLink {
    text-decoration: none;
    text-align: center;
    font-family: "Rubik", sans-serif;
    font-weight: 600;
    font-size: 16px;
    line-height: 20px;
    letter-spacing: 0px;
    color: #FFFFFF;
    opacity: 1;
}

.m-kitchenCarouselProductButton {
    cursor: pointer;
    overflow: hidden;
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-color: #1b1d1c;
    transition: background-color 0.3s ease;
    border-radius: 100%;
    width: 40px;
    height: 40px;
    text-align: center;
    text-decoration: none;
}

.m-kitchenCardCarouselItem {
    margin-bottom: 2rem;
    margin-top: 1rem;
}

.m-kitchenCardCarouselProduct {
    border: 2px solid #1d1d1b1a;
    position: relative;
    background-color: white;
    text-align: center;
    padding: 1rem 0.5rem;
    border-radius: 10px;
}

    .m-kitchenCardCarouselProduct .m-newPrice {
       font-size:14px;
    }
    .m-kitchenCardCarouselProduct .m-oldPrice {
        font-size: 12px;
    }
        .m-kitchenCardCarouselProductImg {
        width: 100%;
        height: 190px;
        object-fit: contain;
    }

.m-kitchenCheck {
    position: absolute;
    left: 50%;
    transform: translateX(-50%) translateY(40%);
    color: white;
    font-size: 24px;
    transition: all 0.3s ease;
}

.m-kitchenArticleSliderDetails {
    display: flex;
    justify-content: space-evenly;
    margin: 1rem 0;
    text-align: center;
    font: normal normal normal 19px/23px Rubik;
    letter-spacing: 0px;
    color: #a4a4a4;
    text-decoration: none;
    margin-bottom: 40px;
}

.m-kitchenHeaderFixed {
    position: fixed;
    z-index: 1030;
    top: 0;
    left: 0;
    width: 100%;
}

.m-kitchenSliderImg {
    width: 100%;
    height: 240px;
    object-fit: cover;
}

.m-kitchenFooterGrayPanelText {
    display: block;
    font-size: 18px;
    font-weight: 600;
    color: #1d1d1b;
    line-height: 24px;
    text-align: center;
    font-family: "Rubik", sans-serif;
}

.m-kitchenFooterGrayButton {
    width: 80%;
    height: 44px;
    background-color: #1d1d1b;
    border: 2px solid #1d1d1b;
    font-size: 14px;
    font-weight: 600;
    border-radius: 5px;
    color: #ffffff;
}

.m-kitchenFooterGrayTextBox {
    width: 80%;
    height: 44px;
    padding: 10px 10px;
    background-color: #f2f2f2;
    border: none;
    border-radius: 8px;
    font-size: 12px;
    margin: 20px 0 10px;
}

.m-kitchenHeaderLogoDiv {
    display: flex;
    justify-content: center;
    align-items: center;
}

.m-kitchenHeaderDiv {
    display: flex;
    justify-content: space-between;
}

.m-kitchenHeaderIcon {
    width: 30px;
    height: 30px;
    padding: 0;
    border-radius: 50%;
}

.m-kitchenHeaderMenuIcon {
    font-size: 25px;
    color: white;
}

.m-kitchenHeaderMenu {
    background-color: #1d1d1b;
    z-index: 1;
    position: absolute;
    top: 55%;
    left: 0;
    overflow: auto;
    width: 100%;
    height: 100vh;
    overflow-x: hidden;
    display: none;
}

.m-nutsHeaderMenu {
    background-color: #F2F2F2;
    z-index: 1;
    position: absolute;
    top: 100%;
    left: 0;
    overflow: auto;
    width: 100%;
    height: 100vh;
    overflow-x: hidden;
    display: none;
}

.m-kitchenHeaderBottomMenu {
    width: 100%;
    overflow-y: scroll;
    padding: 1rem;
    overflow-x: hidden;
}

.m-kitchenHeaderBottomMenuList {
    position: relative;
    align-items: center;
    display: flex;
    justify-content: space-between;
    color: white;
    margin: 0;
    padding: 0.75rem 0.5rem;
    transition: all 0.3s ease;
}

.b-Radius5px {
    border-radius: 5px;
}

.m-kitchenHeaderBottomMenuImg {
    margin-right: 10px;
    width: 25px;
    height: 25px;
}

.m-kitchenHeaderBottomMenuLink {
    font-style: normal;
    font-size: 14px;
    line-height: 16px;
    font-family: "Rubik", sans-serif;
    color: #fff;
    float: left;
    text-decoration: none !important;
}

.m-fixed-bottom {
    position: fixed;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1030;
}

.m-kitchenBottomPhonePanelFixed {
    width: 67px;
    height: 85px;
    top: 63%;
    right: 20px;
}

.m-kitchenBottomPhonePanelFixedIcon {
    width: 48px;
    height: 48px;
    margin: 10px 0;
    padding: 10px 0;
    border: 3px solid #fff;
    border-radius: 50%;
    color: #fff;
    text-align: center;
}

.m-kitchenMainOrder {
    background-color: black;
}

.m-kitchenMainOrderInfoPanel {
    display: flex;
    align-items: center;
    padding: 0.5rem 1rem;
}

.m-kitchenMainPageActiveOrdersBadge {
    position: relative;
    width: auto;
    min-width: 24px;
    max-width: 32px;
    height: 24px;
    display: inline-block;
    padding: 0;
    border-radius: 50%;
    background-color: #fff;
    color: white;
    text-align: center;
    font-weight: 600;
}

.m-kitchenMainPageActiveOrdersBadgeSpan {
    position: absolute;
    font-style: normal;
    font-variant: normal;
    font-weight: 600;
    font-size: 15px;
    line-height: 12px;
    font-family: "Rubik", sans-serif;
    left: 47%;
    top: 50%;
    transform: translate(-50%, -50%);
    color: #000;
}

.m-kitchenFooterAppDiv {
    display: flex;
    align-items: end;
    justify-content: space-between;
}

.m-kitchenFooterAppIcons {
    width: 130px;
}

.m-kitchenFooterSocialIconsWrapper {
    width: 100%;
    padding: 3px 0px;
    border-radius: 20px;
    background-color: #fff;
    margin-right: -40px;
    margin-left: 20px;
    text-align: center;
}

    .m-kitchenFooterSocialIconsWrapper a {
        text-decoration: none;
    }

.m-kitchenFooterSocialIcons {
    min-width: 14px;
    max-width: 20px;
    margin: 5px 0;
    display: inline-block;
}

.m-kitchenFooterBottomCopyrightText {
    font-family: "Rubik", sans-serif;
    font-weight: normal;
    font-style: normal;
    font-size: 12px;
    line-height: 19px;
    color: #fff;
    padding: 0 50px;
}

.m-kitchenFooterBottomCopyrightPanel {
    background-color: #1d1d1b;
    padding: 20px 0 100px;
}


.m-kitchenSearchPanelDiv {
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: start;
}

.m-kitchenSearchPanel {
    padding: 0;
    margin: 0;
    position: relative;
    flex: 1 1 auto;
}

.m-kitchenSearchIcon {
    position: absolute;
    top: 12px;
    left: 10px;
    font-size: 18px;
    color: #d2d2d1;
}

.m-kitchenSearchTextBox {
    padding: 0.5rem 2rem;
    background-color: #fff;
    border: 1px solid #e3e3e3;
    border-radius: 30px;
    font-size: 11px;
    width: 100%;
    height: 45px;
}

.m-kitchenSearchButton {
    width: 55px;
    padding: 0.5rem;
    position: absolute;
    top: 4px;
    right: 5px;
    border: none !important;
    border-radius: 20px;
    color: #ffffff;
    font-size: 14px;
    text-align: center;
}

/*kitchen css end*/

/*dessert css start */

.dessertHeaderButton {
    margin: 16px 5px;
    height: 34px;
    padding: 3px 3px;
    border-radius: 5px;
    text-align: center;
    letter-spacing: 0px;
    color: #1d1d1b;
    cursor: pointer;
    display: flex;
    justify-content: center;
    align-items: center;
}

.m-dessertHeaderButtonIcon {
    color: #806721;
    padding: 0.75rem;
    width: 100%;
    height: 100%;
    font-size: 30px;
    display: flex;
    justify-content: end;
    align-items: center;
    text-decoration: none;
}

.m-dessertHeaderBadge {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 17px;
    height: 17px;
    position: absolute;
    top: -3px;
    right: -5px;
    border: 1px solid #fff;
    border-radius: 50%;
    font-size: 9px;
    color: white;
}

.dessertHeaderButtonIcon {
    font-size: 16px;
    margin: 2px;
    float: left;
    font-size: 20px;
    line-height: 1;
    margin-right: 0.25rem;
    color: #806721;
}

.dessertHeaderButtonCount {
    width: 15px;
    height: 15px;
    padding: 0;
    position: absolute;
    top: 11%;
    right: 27%;
    border-radius: 50%;
    color: white;
    font-size: 11px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.dessertNav {
    background-color: transparent;
    height: 70px;
    display: flex;
    align-items: center;
    z-index: 3;
    width: 100%;
    top: 0;
    left: 0;
}


    .dessertNav.dessertNavFixed {
        position: fixed;
        z-index: 999;
        width: 100%;
        top: 0;
        left: 0;
        background-color: #fffdf6;
    }

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

.dessertNavMenu {
    display: flex;
    justify-content: end;
    align-items: center;
}

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

.dessertLogoText {
    margin-left: 20px;
    width: 50%;
}

.dessertNavMenuList {
    list-style: none;
    display: flex;
    align-items: center;
    padding: 0;
}

.item {
    z-index: 1;
}

.dessertNavMenuListItem {
    margin: 0 1rem;
    display: inline-block;
}

.dessertNavIcon {
    font-size: 20px;
    color: #c09a2e;
}

.dessertNavMenuListItem > a {
    text-decoration: none;
    color: #806721;
    font-family: "Poppins", sans-serif;
    font-size: 12px;
    font-weight: bold;
}

    .dessertNavMenuListItem > a:hover {
        color: #005934;
        font-weight: bolder;
    }

.dessertBannerColumn {
    text-align: center;
    color: white;
    font-size: 16px;
    height: 100%;
    width: 100%;
    box-sizing: border-box;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    align-items: start;
    justify-content: center;
}

.dessertBannerImgDiv {
    position: relative;
    text-align: center;
    color: white;
    font-size: 16px;
    z-index: 0;
    height: 100%;
    width: 100%;
    box-sizing: border-box;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.dessertBannerImg {
    width: 100%;
    height: auto;
    object-fit: cover;
    overflow: hidden;
    transition: all 0.5s ease-in-out;
    cursor: pointer;
    animation: reverseRotate 0.8s forwards;
}


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

.dessertBannerImgWrapper {
    position: relative;
    display: inline-block;
    max-width: 75%;
    padding: 3%;
    background-color: #fffdf6;
    border-radius: 100%;
}

    .dessertBannerImgWrapper:before,
    .dessertBannerImgWrapper:after {
        content: "";
        position: absolute;
        background-color: transparent;
        border: 1px solid #c09a2e;
        border-radius: 100%;
        z-index: -1;
        opacity: 0;
        width: 94%;
        height: 94%;
        left: 3%;
        top: 3%;
        transition: transform 0.8s, opacity 0.8s;
        transform: scale(1);
        animation: scaleAnimation 2s infinite;
    }

    .dessertBannerImgWrapper:after {
        width: 86%;
        height: 86%;
        left: 7%;
        top: 7%;
    }



.dessertFeatureCard {
    position: absolute;
    width: 100%;
    top: -10%;
    z-index: -1;
}
 
    @-webkit-keyframes scaleAnimation {
        0%, 100%

{
    opacity: 0;
    transform: scale(1);
}

50% {
    opacity: 1;
    transform: scale(1.3);
}

}

@keyframes scaleAnimation {
    0%, 100% {
        opacity: 0;
        transform: scale(1);
    }

    50% {
        opacity: 1;
        transform: scale(1.3);
    }
}

@-webkit-keyframes scaleAnimation {
    0%, 100% {
        opacity: 0;
        -webkit-transform: scale(1);
    }

    50% {
        opacity: 1;
        -webkit-transform: scale(1.3);
    }
}

.dessertBannerBack {
    position: absolute;
    top: 0;
    right: 0;
    z-index: -1;
    height: 100%;
    width: auto;
}

.dessertBannerTitle {
    margin-bottom: -6rem;
    margin-left: 8rem;
    text-align: left;
    font-family: "Poppins", sans-serif;
    font-size: 30px;
    font-weight: bold;
    letter-spacing: 0px;
    color: #806721;
    opacity: 1;
}

.dessertBannerShortDesc {
    font-family: 'Crunchy PERSONAL USE ONLY';
    font-weight: 400;
    font-style: normal;
    font-size: 150px;
    line-height: 200px;
    color: #005934;
    text-align: left;
}

.dessertBannerDesc {
    margin-left: 9rem;
    text-align: left;
    font-family: "Poppins", sans-serif;
    font-size: 14px;
    font-weight: normal;
    letter-spacing: 0px;
    color: #806721;
    opacity: 1;
    margin-bottom: 0;
}

.detailInfoButton {
    margin-left: 9rem;
    color: #8a6f22;
    font-size: 12px;
    font-weight: bolder;
    border: 1px solid #8a6f22;
    cursor: pointer;
    transition: background-color 0.3s ease, color 0.3s ease;
    width: fit-content;
    height: 30px;
    margin-top: 1rem;
    background: transparent;
    border-radius: 0;
}

.m-dessertBannerTitle {
    text-align: center;
    font-family: "Poppins", sans-serif;
    font-size: 28px;
    font-weight: bold;
    letter-spacing: 0px;
    color: #806721;
    opacity: 1;
}

.m-dessertBannerShortDesc {
    font-family: 'Crunchy PERSONAL USE ONLY';
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
    font-size: 75px;
    line-height: 75px;
    color: #005934;
    text-align: center;
    margin-top: 1rem;
}

.m-dessertBannerDesc {
    text-align: center;
    font-family: "Poppins", sans-serif;
    font-size: 14px;
    font-weight: normal;
    letter-spacing: 0px;
    color: #806721;
    opacity: 1;
}

.m-detailInfoButton {
    color: #fff;
    font-size: 14px;
    font-weight: bolder;
    border: 1px solid #c19b2e;
    cursor: pointer;
    transition: background-color 0.3s ease, color 0.3s ease;
    width: fit-content;
    height: fit-content;
    margin-top: 1rem;
    margin-bottom: 1rem;
    background: #c19b2e;
    border-radius: 0;
}

    .m-detailInfoButton:hover {
        color: #c19b2e;
        border: 1px solid #c19b2e;
        background: transparent;
    }

.detailInfoButton:hover {
    background: #806721 0% 0% no-repeat padding-box;
    color: #ffff;
}

.dessertBannerFork {
    position: absolute;
    width: 24%;
    left: 0;
    bottom: -2rem;
    background-color: transparent;
    display: flex;
    z-index: -1;
}

.dessertBanner {
    position: relative;
    z-index: 1;
    background-color: #fffdf6;
    width: 100%;
    height: 100vh;
    overflow: hidden;
}

.dessertCatButtonContainer {
    display: flex;
    flex-direction: row;
    justify-content: center;
    text-align: center;
}

.displayCenterCenterColumn {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

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

.dessertCatButtonDiv {
    position: relative;
    z-index: 1;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
    margin: 0.5rem 1.5rem;
}

.dessertCatButton {
    border: none;
    padding: 0.75rem 1.5rem;
    background-color: #43b27e;
    color: white;
    font-size: 15px;
    line-height: 15px;
    overflow: hidden;
    transition: background-color 0.3s ease;
    width: 100%;
    height: 40px;
    text-align: center;
    text-decoration: none;
}

.categoryFilterButton {
    transition: background-color 0.3s ease;
    border: none;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 15px;
    line-height: 15px;
    overflow: hidden;
    width: 100%;
    height: 40px;
    text-align: center;
    text-decoration: none;
}

.productBackground .dessertCatButton {
    padding: 1rem 0.5rem;
    height: 48px;
}
.productBackground .dessertCatButtonDiv {
    margin: 0rem 1.5rem;
}

.dessertCatButtonDiv::before {
    transition: color 0.3s ease;
    position: absolute;
    content: "\f0d9";
    font-size: 2rem;
    font-weight: 900;
    font-family: "Font Awesome 6 Free";
    top: 0;
    left: 0;
    width: 0;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #43b27e;
}

.dessertCatButtonDiv::after {
    transition: color 0.3s ease;
    position: absolute;
    content: "\f0da";
    font-size: 2rem;
    font-weight: 900;
    font-family: "Font Awesome 6 Free";
    top: 0;
    right: 0;
    width: 0;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #43b27e;
}

.dessertCatButtonDiv:hover .dessertCatButton {
    background-color: #8a6f22;
}

.dessertCatButtonDiv:hover.dessertCatButtonDiv::before {
    color: #8a6f22 !important;
}

.dessertCatButtonDiv:hover.dessertCatButtonDiv::after {
    color: #8a6f22 !important;
}

.dessertChefWrapper {
    flex-direction: column;
    width: 80%;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    background: #f4edd9 0% 0% no-repeat padding-box;
}

    .dessertChefWrapper:before {
        content: "";
        position: absolute;
        bottom: 100%;
        left: 50%;
        height: 50px;
        width: 50%;
        border-bottom-left-radius: 50%;
        background: transparent;
        box-shadow: 0 25px #f4edd9;
        z-index: -1;
    }

    .dessertChefWrapper:after {
        content: "";
        position: absolute;
        bottom: 100%;
        right: 50%;
        height: 50px;
        width: 50%;
        border-bottom-right-radius: 50%;
        background: transparent;
        box-shadow: 0 25px #f4edd9;
        z-index: -1;
    }

.dessertChefCorner {
    position: relative;
    top: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 80%;
    height: 40px;
    background: #f4edd9 0% 0% no-repeat padding-box;
}

    .dessertChefCorner:before {
        content: "";
        position: absolute;
        bottom: -27px;
        left: 50%;
        height: 50px;
        width: 51%;
        border-top-left-radius: 50%;
        background: white;
        z-index: 0;
    }

    .dessertChefCorner:after {
        content: "";
        position: absolute;
        bottom: -27px;
        right: 50%;
        height: 50px;
        width: 51%;
        border-top-right-radius: 50%;
        background: white;
        z-index: 0;
    }

.dessertChefDiv {
    z-index: 1;
    text-align: center;
}

.dessertChefTitle {
    font-family: "Poppins", sans-serif;
    font-weight: bold;
    font-size: 45px;
    text-align: center;
    letter-spacing: 0px;
    color: #ffffff;
    text-shadow: 0px 3px 6px #00000029;
    opacity: 1;
    line-height: 1;
    text-transform: uppercase;
    margin-top: 1rem;
}

.dessertChefButton {
    background: #ffffff 0% 0% no-repeat padding-box;
    box-shadow: 0px 3px 6px #00000029;
    border: 2px solid #ffffff;
    border-radius: 18px;
    width: 90px;
    height: 36px;
    text-align: center;
    font-family: "Poppins", sans-serif;
    font-weight: bold;
    font-size: 14px;
    letter-spacing: 0px;
    color: #8a6f22;
    opacity: 1;
    margin-top: 1rem;
}

    .dessertChefButton:hover {
        background: #8a6f22 0% 0% no-repeat padding-box;
        box-shadow: 0px 3px 6px #00000029;
        border: 2px solid #ffffff;
        color: #fff;
    }

.dessertChefAnimation {
    position: absolute;
    background: transparent;
    bottom: 38%;
    width: 75%;
    opacity: 0;
}

.dessertChefImageDiv {
    z-index: 0;
    transform: translateY(45%);
    margin-top: -30%;
    display: flex;
    width: 200%;
    justify-content: center;
}

.dessertChefWrapper:hover > .dessertChefImageDiv {
    animation-name: translate;
    animation-duration: 0.5s;
    animation-fill-mode: forwards;
}

.dessertChefWrapper:hover .dessertChefButton {
    background: #8a6f22 0% 0% no-repeat padding-box;
    box-shadow: 0px 3px 6px #00000029;
    border: 2px solid #ffffff;
    color: #fff;
}

@keyframes translate {
    50% {
        transform: translateY(30px);
    }

    100% {
        opacity: 0;
    }
}

.dessertChefWrapper:hover > .dessertChefAnimation {
    animation-name: translateO;
    animation-duration: 0.5s;
    animation-fill-mode: forwards;
}

@keyframes translateO {
    50% {
        opacity: 1;
    }

    100% {
        transform: translateY(-30px);
        opacity: 1;
    }
}

.dessertOverlaySection {
    background-color: #FFFDF6;
}

.dessertOverlay {
    position: relative;
    display: flex;
    align-items: center;
    height: 120px;
    padding: 1rem;
    text-align: center;
    justify-content: center;
    overflow: hidden;
}

.dessertOverlayImg {
    position: absolute;
    top: 0;
    left: 0;
    height: 120px;
    width: 100%;
    object-fit: cover;
}

.dessertOverlayLine {
    display: inline-block;
    width: 100%;
    height: 2px;
    background-color: #005934;
}

.dessertOverlayText {
    font-family: "Poppins", sans-serif;
    font-weight: bold;
    font-size: 35px;
    text-align: center;
    letter-spacing: 0px;
    color: #005934;
    opacity: 1;
    display: inline;
    text-transform: uppercase;
}

@media (max-width:992px) {
    .dessertOverlayText {
        font-size: 25px !important;
    }

    .dessertChefColumn {
        padding: 7rem 4rem 3rem 4rem !important;
    }

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

    .dessertReservationShortDesc {
        font-size: 16px !important;
    }

    .dessertReservationDesc {
        font-size: 14px !important;
    }

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

    .dessertFeatureCardBack {
        width: 60% !important;
        left: 20% !important;
        top: -13% !important;
    }

    .dessertNavMenu {
        justify-content: center;
    }
}

.dessertOverlayDesc {
    font-family: "Poppins", sans-serif;
    font-weight: normal;
    font-size: 14px;
    text-align: center;
    letter-spacing: 0px;
    color: #806721;
    opacity: 1;
    margin: 1rem;
}

.dessertFeatureCardSection {
    background-image: url("images/elipse.png");
    background-size: 40%;
    background-repeat: no-repeat;
    background-position-y: center;
    background-position-x: center;
    padding-top: 10rem !important;
    padding-bottom: 10rem !important;
}



.dessertFeatureCardImg img {
    display: block;
    max-width: 100%;
    transform: translateY(0px);
    filter: drop-shadow(0px 10px 10px rgba(0, 0, 0, 0.5)); /* Gölge efekti burada belirleniyor */
    transition: transform 0.3s ease-out;
}

.dessertFeatureCardImg:hover img {
    transition: transform 0.3s ease-out;
    transform: translateY(-15px);
}



.dessertFeatureCardWrapper {
    position: relative;
    width: 100%;
    z-index: 1;
    margin-top: 10rem;
    padding-bottom: 14rem;
}

.dessertFeatureCardBack {
    position: absolute;
    width: 50%;
    height: auto;
    left: 25%;
    top: -22%;
}

.dessertFeatureCardLeft {
    text-align: left;
    padding-left: 0;
}

@media (max-width:1200px) and (min-width:992px) {
    .dessertFeatureCardLeft {
        padding-left: 4rem !important;
    }
}

.dessertFeatureCardTitle {
    font-family: "Poppins", sans-serif;
    font-weight: bold;
    font-size: 35px;
    text-align: center;
    letter-spacing: 0px;
    color: #005934;
    opacity: 1;
    line-height: normal !important;
}

.dessertFeatureCardDesc {
    font-family: "Poppins", sans-serif;
    font-weight: normal;
    font-size: 14px;
    text-align: center;
    letter-spacing: 0px;
    color: #8a6f22;
    opacity: 1;
    line-height: normal !important;
}

.dessertInfoCardSection {
    background-color: #FFFDF6;
    margin-top: 8rem;
}

.dessertInfoCard {
    display:flex;
    flex-direction:column;
    align-items:center;
    position: relative;
}
.dessertInfoCard:not(:first-child)::before {
    content: "";
    position: absolute;
    clear: both;
    height: 85%;
    width: 2px;
    left: 1px;
    background-color: #b7a081;
}

.dessertInfoCardImg {
    width: 15% !important;
    margin-bottom: 1rem;
    height: 50px;
}

.dessertInfoCardTitle {
    font-family: "Poppins", sans-serif;
    font-weight: bolder;
    letter-spacing: 0px;
    color: #8a6f22;
    opacity: 1;
    text-align: center;
    font-size: 20px;
}

.dessertInfoCardText {
    font-family: "Poppins", sans-serif;
    font-weight: normal;
    font-size: 14px;
    letter-spacing: 0px;
    color: #8a6f22;
    text-align: center;
    opacity: 1;
    padding-right: 3rem;
    padding-left: 3rem;
}

.dessertCargo {
    height: 150px;
    border: 2px solid #b7a081;
    opacity: 1;
}

.dessertVideo {
    position: relative;
    width: 100%;
    height: auto;
}

.dessertVideoContainer {
    position: relative;
    width: 100%;
    padding: 0;
}

    .dessertVideoContainer:hover .dessertVideoButton {
        transform: translate(-50%, -50%) scale(1.1);
    }

    .dessertVideoContainer:hover .dessertVideoButtonShadow {
        transform: translate(-50%, -50%) scale(1.1);
    }

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

.dessertVideoShadow {
    position: absolute;
    z-index: -1;
    top: 0;
    left: 0;
    background: #8A6F22 0% 0% no-repeat padding-box;
    mix-blend-mode: multiply;
    opacity: 0.58;
    width: 100%;
    height: 100%;
}

.dessertVideoButton {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100px;
    height: 100px;
    background-color: #ce0917;
    border: 4px solid #ffffff;
    border-radius: 50%;
    z-index: 2;
    transition: transform 0.3s;
    text-decoration: none;
}

.dessertVideoButtonShadow {
    position: absolute;
    width: 200px;
    height: 200px;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    border-radius: 50%;
    background: #000000 0% 0% no-repeat padding-box;
    opacity: 0.3;
    transition: transform 0.3s;
}

.dessertVideoPlayIcon {
    position: absolute;
    top: 50%;
    left: 55%;
    transform: translate(-50%, -50%);
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 25px 0 25px 46px;
    border-color: transparent transparent transparent #ffffff;
}

.dessertGalleryColumn {
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 24px;
    font-weight: bold;
    position: relative;
    transform-origin: 0 0;
    overflow: hidden;
    margin: 0;
    padding: 0;
}

.dessertGalleryImg {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 3s ease;
    overflow: hidden;
    max-height: 415px;
}


.dessertGalleryColumn:hover .dessertGalleryImg {
    transform: scale(1.3);
}

.dessertGalleryButton {
    font-family: "Poppins", sans-serif;
    font-weight: bold;
    font-size: 14px;
    border-radius: 0;
    border: 1px solid #8a6f22;
    text-align: center;
    color: #806721;
    margin-top: 1rem;
}

    .dessertGalleryButton:hover {
        background: #806721 0% 0% no-repeat padding-box;
        color: #ffff;
    }

.dessertReservationSection {
    overflow-x: hidden;
    background-color: #FFFDF6;
}

.dessertReservationShortDesc {
    font-family: "Poppins", sans-serif;
    font-weight: normal;
    font-size: 30px;
    text-align: left;
    letter-spacing: 0px;
    color: #c09a2e;
    opacity: 1;
}

.dessertReservationTitle {
    font-family: "Poppins", sans-serif;
    font-weight: bold;
    font-size: 45px;
    text-align: left;
    letter-spacing: 0px;
    color: #806721;
    opacity: 1;
}

.dessertReservationDesc {
    font-family: "Poppins", sans-serif;
    font-weight: normal;
    font-size: 16px;
    text-align: left;
    letter-spacing: 0px;
    color: #c09a2e;
    opacity: 1;
    width: 84%;
    box-sizing: border-box;
}

.dessertReservationImg {
    position: relative;
    margin-top: -35%;
}

.dessertReservationButton {
    font-family: "Poppins", sans-serif;
    font-weight: bold;
    font-size: 14px;
    border-radius: 0;
    border: 1px solid #8a6f22;
    text-align: center;
    letter-spacing: 0px;
    color: #806721;
    margin-top: 1rem;
}

    .dessertReservationButton:hover {
        background: #806721 0% 0% no-repeat padding-box;
        color: #ffff;
    }

.dessertMap {
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #ffffff;
    position: relative;
}

.dessertMapFrame {
    width: 110%;
    height: 120%;
    border: 2px solid #c09a2e;
    position: absolute;
    z-index: -1;
    top: -10%;
}

.dessertFooter {
    background: #005934 0% 0% no-repeat padding-box;
    color: #fff;
    margin-top: 5rem;
    padding-top: 3rem;
}

.dessertFooterSlogan {
    font-family: "Rubik", sans-serif;
    font-size: 15px;
    font-weight: normal;
    text-align: center;
    letter-spacing: 0px;
    color: #ffffff;
    opacity: 1;
    margin-top: 2rem;
}

.dessertFooterLogo {
    width: 25%;
}

.dessertFooterList {
    list-style: none;
    padding-left: 0 !important;
    text-align: left;
    font-size: 12px;
    line-height: 30px;
    font-family: "Rubik", sans-serif;
    letter-spacing: 0px;
    color: #ffffff;
    opacity: 1;
}

.mobileMenu {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #fff;
    z-index: 1000;
    padding-top: 20px;
    box-sizing: border-box;
}


.menuItem {
    display: block;
    padding: 15px;
    border-bottom: 1px solid #ccc;
    text-decoration: none;
    color: #806721;
    font-family: "Poppins", sans-serif;
    font-size: 12px;
    font-weight: bold;
}

    .menuItem:last-child {
        border-bottom: none;
    }
@media screen and (max-width: 1400px) {
    .dessertFooterList {
        font-size: 10px;
    }

    .dessertChefTitle {
        font-size: 35px;
    }
}

.dessertFooterTitle {
    text-align: left;
    font-size: 15px;
    font-family: "Rubik", sans-serif;
    line-height: 40px;
    font-weight: bolder;
    letter-spacing: 0px;
    color: #ffffff;
    opacity: 1;
    margin-bottom: 1rem;
}

.dessertFooterBottomText {
    text-align: left;
    font-size: 14px;
    font-family: "Rubik", sans-serif;
    line-height: 20px;
    font-weight: normal;
    letter-spacing: 0px;
    color: #ffffff;
}

.dessertFooterBottomList {
    display: flex;
    list-style: none;
    text-align: left;
    font-size: 14px;
    font-family: "Rubik", sans-serif;
    font-weight: normal;
    line-height: 20px;
    letter-spacing: 0px;
    color: #ffffff;
    opacity: 1;
}

    .dessertFooterBottomList a {
        text-decoration: none;
        color: #ffffff;
    }

.dessertFooterBottomLine {
    content: "";
    display: inline-block;
    height: 100%;
    width: 2px;
    background-color: #ffffff;
    margin: 0 1.5rem;
}

.dessertFooterSocialMedia {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 232px;
    height: 40px;
    background: #ffffff 0% 0% no-repeat padding-box;
    border: 1px solid #707070;
    border-radius: 20px;
    opacity: 1;
    margin-top: 1rem;
    margin-bottom: 1rem;
    margin-right: auto !important;
    margin-left: auto !important;
}

.dessertFooterSocialMediaLink {
    text-decoration: none;
    margin-right: 1rem;
}

.dessertChefColumn {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    padding: 8rem 4rem 3rem 4rem;
}
.dessertInfoCardImgWrapper {
    width: 55px;
    height: 55px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.dessertFooterCenter {
    text-align: center;
}

.roundedItemCarouselBackground {
    position: absolute;
    object-fit: cover;
    width: 100%;
    height: 100%;
}
@media only screen and (max-width: 1200px) {
    .dessertFooterList {
        font-size: 12px;
    }

    .dessertNavMenuListItem {
        margin: 0 0.5rem;
    }

    .dessertChefTitle {
        font-size: 50px;
    }
}

@media only screen and (max-width: 991px) {
}

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


    .dessertVideoButton {
        width: 50px;
        height: 50px;
    }

    .dessertVideoPlayIcon {
        border-width: 15px 0 15px 30px;
    }

    .dessertVideoButtonShadow {
        position: absolute;
        width: 100px;
        height: 100px;
    }
}

@media screen and (max-width: 768px) {
    .dessertBanner {
        height: 120vh;
    }
    .dessertChefTitle {
        font-size: 25px;
    }

    .dessertFooterCenter {
        display: flex;
        align-items: center;
        flex-direction: column;
    }

    .radioAsCheckbox + label:before {
        left: -8px !important;
    }

    .radioAsCheckbox:checked + label:after {
        left: -5px !important;
    }

    #addressShipPanel .radioAsCheckbox + label:before {
        left: -6px !important;
        top: -2px !important;
    }

    .basketProductCard .radioAsCheckbox + label:before {
        left: -6px !important;
    }
    .basketProductCard .radioAsCheckbox:checked + label:after {
        left: -3px !important;
    }
}

@media screen and (max-width: 576px) {
    #addressShipPanel .radioAsCheckbox + label:before {
        left: -8px !important;
        top: 9.5px !important;
    }
    .dessertChefTitle {
        font-size: 40px;
    }
}


@media (min-width: 0px) {
    .dessertFeatureCardCarousel {
        margin-top: 15rem !important;
    }

    .dessertFeatureCardWrapper {
        margin-top: 4rem !important;
    }
}

@media (min-width: 576px) {
    .dessertFeatureCardCarousel {
        margin-top: 20rem !important;
    }

    .dessertFeatureCardWrapper {
        margin-top: 6rem !important;
    }
}

@media (min-width: 768px) {
    .dessertFeatureCardCarousel {
        margin-top: 25rem !important;
    }

}

@media (min-width: 992px) {
    .dessertFeatureCardCarousel {
        margin-top: 30rem !important;
    }

    .dessertFeatureCardWrapper {
        margin-top: 10rem !important;
    }
}

.dessertFeatureCardCarousel {
    margin-top: 7rem;
}

.dessertNav .navbar-toggler {
    border-color: #806721 !important;
}

.dessertNav .navbar-toggler-icon {
    background-image: url(../images/dessert/menu-toggle.svg) !important;
}


.dessertChefCarousel .owl-prev {
    position: absolute;
    top: 40%;
    left: 1%;
    border: none !important;
    border-radius: 100% !important;
    background-color: transparent !important;
    font-size: 50px !important;
    z-index: 9999;
    color: #8A6F22;
}

.dessertChefCarousel .owl-next {
    position: absolute;
    top: 40%;
    right: 1%;
    border: none !important;
    border-radius: 100% !important;
    background-color: transparent !important;
    font-size: 50px !important;
    z-index: 9999;
    color: #8A6F22;
}

/*dessert css end*/

.collapse.show {
    display: block;
}
.features-card {
    position: relative;
    width: 350px;
    height: 70px;
    border-style: solid;
    border-width: 3px;
    border-radius: 15px;
    padding: 0.5rem;
    display: flex;
    justify-content: center;
    align-items: center;
    border-color: #00460b;
}

    .features-card::before {
        position: absolute;
        font-size: 1rem;
        font-weight: 900;
        font-family: "Font Awesome 5 Free";
        top: 11%;
        left: -2%;
        width: 35px;
        height: 45px;
        display: flex;
        justify-content: center;
        align-items: center;
        color: #00460b;
    }

.ship-feature::before {
    content: "\f57d" !important;
}

.vip-feature::before {
    content: "\f521" !important;
}

.receipt-feature::before {
    content: "\f543" !important;
}

.features-card-title-div {
    position: absolute;
    content: "";
    top: -38%;
    left: 7%;
    width: 170px;
    height: 25px;
    border-radius: 5px;
    z-index: 1;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #00460b;
}
.features-card-title {
    text-align: center;
    font-size: 12px;
    line-height: 16px;
    font-weight: bold;
    font-family: "Rajdhani",sans-serif;
    letter-spacing: 0;
    color: #fff;
    opacity: 1;
}

.vip-feature .features-card-title {
    color: #fdce46;
}

.features-card-div {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 0.5rem 0 0.5rem 1.5rem;
    border-radius: 15px;
}

.features-card-desc {
    text-align: left;
    font-size: 12px;
    line-height: 16px;
    font-weight: bolder;
    font-family: "Rajdhani",sans-serif;
    letter-spacing: 0;
    color: #00460b;
    opacity: 1;
}
.featuresCard {
    position: relative;
    width: 350px;
    height: 55px;
    border-style: solid;
    border-width: 2px;
    border-radius: 15px;
    padding: 0.5rem;
    display: flex;
    justify-content: start;
    align-items: center;
}

.featuresCardIcon {
    position: absolute;
    font-size: 1rem;
    top: 5%;
    left: -5%;
    width: 35px;
    height: 45px;
    background-color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
}

.featuresCardTitleDiv {
    position: absolute;
    content: "";
    top: -38%;
    left: 7%;
    width: 135px;
    height: 25px;
    border-radius: 5px;
    z-index: 1;
    display: flex;
    justify-content: center;
    align-items: center;
}

.featuresCardTitle {
    text-align: center;
    font-size: 12px;
    line-height: 16px;
    font-weight: bold;
    font-family: "Rajdhani",sans-serif;
    letter-spacing: 0;
    color: #fff;
    opacity: 1;
}

.vipFeature .featuresCardTitle {
    color: #fdce46;
}

.featuresCardDiv {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 0.5rem;
    border-radius: 15px;
}

.featuresCardDesc {
    text-align: left;
    font-size: 14px;
    line-height: 16px;
    font-weight: 600;
    font-family: "Rajdhani",sans-serif;
    letter-spacing: 0;
    color: #00460b;
    opacity: 1;
    padding-left: 0.5rem;
}

/*taksit tablosu */
#paytr_taksit_tablosu {
    clear: both;
    font-size: 12px;
    /*max-width: 1200px;*/
    text-align: center;
    font-family: "Rubik", sans-serif;
}

.taksit-tablosu-wrapper {
    margin: 5px;
    width: 280px;
    padding: 12px;
    cursor: default;
    text-align: center;
    display: inline-block;
    border: 1px solid #e1e1e1;
}

.taksit-tutari-text {
    float: left;
    width: 126px;
    color: #a2a2a2;
    margin-bottom: 5px;
}

.taksit-tutar-wrapper {
    display: inline-block;
    background-color: #f7f7f7;
}

    .taksit-tutar-wrapper:hover {
        background-color: #e8e8e8;
    }

.taksit-tutari {
    float: left;
    width: 126px;
    padding: 6px 0;
    color: #474747;
    border: 2px solid #fff;
}
/*taksit tablosu */

.warrantyText {
    font-family: "Rubik", sans-serif;
    font-weight: normal;
    font-size: 12px;
    line-height: 12px;
}

.modalHeader {
    padding: 0.75rem 1.5rem !important;
}

.modalBody {
    padding: 1.5rem;
}


.modalResetButton {
    background-color: transparent;
    font-family: "Rubik", sans-serif;
    font-weight: normal;
    font-size: 14px;
    line-height: 14px;
    border-radius: 4px;
    border: 1px solid #A5A5A5;
    color: #A5A5A5;
    padding: 0.75rem 2rem;
    margin-right: 0.75rem;
}

.modalSubmitButton {
    font-family: "Rubik", sans-serif;
    font-weight: normal;
    font-size: 14px;
    line-height: 14px;
    border-radius: 4px;
    color: #FFFFFF;
    padding: 0.75rem 2rem;
}
/* loading height 125vh verilmesinin sebebi body yüzden 80 boyutunu çekilmesinden dolayı*/
.loading {
    z-index: 1056 !important;
}

/* yemekOn ortak section Header start*/
.yemekOnSectionHeader {
    display: flex;
    justify-content: space-between;
    margin: 1rem 0;
}

.yemekOnCustomLink {
    text-decoration: none;
    font: normal normal bold 18px/24px Rubik;
    letter-spacing: 0px;
    color: #ff6830;
}
/* yemekOn ortak section Header end*/

/* yemekOn Product section start*/

.yemekOnRestaurantImgWrapper {
    position: relative;
    overflow: hidden;
}

.yemekOnRestaurantImg {
    width: 100%;
    transition: transform 0.3s ease;
    height: 250px;
    object-fit: cover;
    position: relative;
}
.yemekOnRestaurantSearchImg {
    width: 100%;
    transition: transform 0.3s ease;
    height: 100px;
    object-fit: cover;
    position: relative;
    filter: blur(4px);
    -webkit-filter: blur(4px);
}
.search-title {
    font-weight: 700;
    font-size: 14px;
    color: #1d1d1b;
    padding: 0.25rem;
    margin-top: 0.5rem;
    overflow: hidden;
    margin-left:8px;
}




.yemekOnRestaurantImgWrapper .twoColumnBackground {
    background: radial-gradient(circle at center, rgba(0, 0, 0, 0) 40%, rgba(0, 0, 0, 0.8) 100%) !important;
    opacity: 1;
    width: 100%;
}

    .yemekOnRestaurantImgWrapper:hover .yemekOnRestaurantImg {
        transform: scale(1.1);
        transition: transform 0.3s ease; 
    }

.yemekOnDiscountLabel,
.yemekOnProductName,
.yemekOnCompanyName,
.yemekOnTopRightIcon {
    position: absolute;
}

.yemekOnDiscountLabel {
    border-radius: 0px 12px 12px 0px;
    top: 10px;
    left: 0;
    background-color: #ff6830;
    padding: 5px 20px 5px 10px;
    font: normal normal bold 17px/28px Rubik;
    color: #FFFFFF;
}


.yemekOnProductName {
    bottom: 45px;
    left: 10px;
    font: normal normal 400 19px / 28px Rubik;
    letter-spacing: 0px;
    color: #FFDD00;
    height: 28px;
    overflow: hidden;
}

.yemekOnCompanyName {
    bottom: 10px;
    left: 10px;
    font: normal normal bold 23px/35px Rubik;
    letter-spacing: 0px;
    color: #FFFFFF;
    height: 35px;
    overflow: hidden;
}

.yemekOnTopRightIcon {
    top: 10px;
    right: 10px;
    display: flex;
    align-items: center;
    width: 40px;
    height: 40px;
    justify-content: center;
    background-color: white;
    border-radius: 50%;
}

.yemekOnShippingCost {
    padding-top: 10px;
}

.yemekOntimeInfo {
    padding-top: 10px;
    display: flex;
    align-items: center;
    justify-content: end;
}


.yemekOnRestaurantWrapper {
    position: relative;
    border: 1px solid #dddddd;
    border-radius: 12px;
    overflow: hidden;
    margin: 10px;
}

    .yemekOnRestaurantWrapper:first-child {
        margin-left: 0;
    }

    .yemekOnRestaurantWrapper:last-child {
        margin-right: 0;
    }




.yemekOnRestaurantIcon {
    width: 20px;
    height: 18px;
}

.yemekOnRatingContainer {
    display: flex;
    align-items: center;
}

    .yemekOnRatingContainer strong {
        margin-left: 8px;
    }

    .yemekOnRatingContainer span {
        margin-left: 8px;
    }

        .yemekOnRatingContainer span:first-child {
            margin-left: 0;
        }

.yemekOnShippingCostIcon {
    width: 50px;
    height: 30px;
}

.yemekOnEvaluation {
    font: normal normal bold 19px/28px Rubik;
    letter-spacing: 0px;
    color: #33302E;
}

.yemekOnRestaurantCard {
    padding: 10px 5px 0;
    justify-content: space-between;
    display: flex;
}

.yemekOnRestaurantCardDiv .yemekOnRatingContainer span {
    height: unset;
}

.yemekOnRestaurantCardDiv {
    display: flex;
    flex-direction: column;
    font: normal normal normal 19px/28px Rubik;
    letter-spacing: 0px;
    color: #9A9A9A;
}

    .yemekOnRestaurantCardDiv span {
        height: 28px;
    }
/* yemekOn Product section end*/
/* yemekOn Campaign section start*/
.yemekOnCarouselImgDiv {
    margin: 15px;
    transition: transform 0.3s ease;
}

    .yemekOnCarouselImgDiv:hover {
        transform: scale(1.1);
        transition: transform 0.3s ease;
    }

/* yemekOn Campaign section end*/

/* yemekOn Product section start*/

.yemekOnmbProductCardWrapper {
    display: flex;
    margin: 7px 9px;
    padding: 10px 0;
    border-bottom: 1px solid #A5A5A5;
    overflow: hidden;
    min-height: 110px;
    max-height: 150px;
}

.yemekOnProductCardWrapper {
    display: flex;
    padding: 12px 15px;
    border: 1px solid #A5A5A5;
    border-radius: 10px;
    overflow: hidden;
    margin: 10px 0;
    height: 150px;
    transition: background-color 1s ease;
    cursor: pointer;
}

    .yemekOnProductCardWrapper:hover {
        background-color: #f5f5f5;
    }

    .yemekOnProductCardWrapper:first-child {
        margin-left: 0;
    }

    .yemekOnProductCardWrapper:last-child {
        margin-right: 0;
    }

.yemekOnProductImgDiv {
    padding:3px;
    position: relative;
    display: flex;
    align-items: center;
}

.yemekOnProductImg {
    object-fit: contain;
    height: 90px;
    width: 100%;
}

.yemekOnAddToCartIcon {
    background-color: white;
    width: 50%;
    position: absolute;
    top: 69%;
    right: 25%;
    border-radius: 18px;
    padding: 2px;
}

.yemekOnmbAddToCartIcon {
    width: 20%;
    margin: 0 10px 0 0;
}

.yemekOnProductDiv {
    display: flex;
    align-items: center;
    flex-direction: column;
}

.yemekOnRestaurantDiv {
    font: normal normal normal 14px/21px Rubik;
    color: #6E6E6E;
    display: flex;
    justify-content: space-between;
    letter-spacing: 0px;
}

.yemekOnProductCardDiv {
    display: flex;
    flex-direction: column;
    position:relative;
}


.yemekOnScroll {
    padding: 15px 0;
    min-height: 83px;
}
.yemekOnProductTitle {
    font: normal normal 600 16px / 18px Rubik;
    letter-spacing: 0px;
    color: #33302E;
    height: 18px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.yemekOnProductCardDiv .generalBlackButton {
    font: normal normal bold 20px/26px Rubik;
    letter-spacing: 0px;
}
.yemekOnProductContent {
    font: normal normal normal 14px / 16px Rubik;
    letter-spacing: 0px;
    color: #9A9A9A;
    height: 33px;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    display: -webkit-box;
}
.twoLineRestriction {
    height: 30px;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    display: -webkit-box;
    overflow: hidden;
}
.listSixView:hover {
    transform: scale(1.2);
}
.listSixView .productGridName {
    font-size: 13px;
}
.threeLineRestriction {
    height: 45px;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    display: -webkit-box;
    overflow: hidden;
}

.listSixView:hover .threeLineRestriction {
    -webkit-line-clamp: unset;
    height: auto;
    position: relative;
    z-index: 1;
}
.chanceTabTitle {
    width: 100%;
    font-family: "Rubik", sans-serif;
    font-weight: 600;
    font-size: 14px;
    line-height: 14px;
    color: #1d1d1d;
    height: 29px;
    text-align:center;
}
.yemekOnProductCardWrapperDiv .basketPanelColumn .yemekOnProductBoldandOrangeText {
    height: 30px;
}
.yemekOnProductCardDiv .basketPanelColumn .yemekOnProductBoldandOrangeText {
    height: 29px;
}

.yemekOnProductBoldandOrangeText {
    white-space: nowrap;
    overflow: hidden; 
    text-overflow: ellipsis;
    font: normal normal bold 18px / 29px Rubik;
    letter-spacing: 0px;
    color: #FF6830;
}


.yemekOnProductHeading {
    font: normal normal bold 18px/24px Rubik;
    letter-spacing: 0px;
    color: #FF6830;
    position: relative;
    display: inline-block;
    margin-left: 10px;
}

    .yemekOnProductHeading::after {
        content: "";
        display: block;
        width: 100%;
        height: 6px;
        background-color: #FF6830;
        position: absolute;
        bottom: -12px;
        z-index: 1000;
    }

.yemekOnProductHeadingHr {
    margin: .5rem 0 0;
    opacity: .05;
}

.yemekOnProductHeaderSectionDiv {
    margin: 2rem 0;
    display: flex;
}
.payMethodPriceItem .yemekOnProductHeaderSectionDiv {
    margin:  0;
    display: flex;
}
.payMethodPriceItem .yemekOnProductHeaderSectionDiv div {
    margin-left: 20px
}
    .payMethodPriceItem .yemekOnProductHeaderSectionDiv div span{
        margin-left: 20px
    }
.yemekOnProductHeaderSectionDiv .basketPanelColumn {
    margin: 0 0 0 1rem;
    height: 100%;
    justify-content: space-evenly;
}

        .yemekOnProductHeaderSectionDiv .basketPanelColumn .yemekOnProductTitle {
            font: normal normal 600 16px / 18px Rubik;
            max-height: unset;
            min-height: unset;
            height: 25px;
        }

        .yemekOnProductHeaderSectionDiv .basketPanelColumn .yemekOnProductBoldandOrangeText {
            height: 40px;
            font: normal normal bold 24px / 34px Rubik;
        }

.yemekOnRestaurantDiv .basketPanelRow {
    padding: 0 0 0 10px;
}

    .yemekOnRestaurantDiv .basketPanelRow span {
        margin-left: 5px;
    }

.yemekOnRestaurantDiv .yemekOnRatingContainer {
    margin: 0 0 0 10px;
}

    .yemekOnRestaurantDiv .yemekOnRatingContainer span,
    .yemekOnRestaurantDiv .yemekOnRatingContainer strong {
        margin-left: auto;
    }

    .yemekOnRestaurantDiv .yemekOnRatingContainer .yemekOnShippingCostIcon {
        width: 40px;
        height: 21px;
        margin-right: 10px;
        color: #1D1D1B;
    }

.yemekOnProductCardDiv .basketPanelColumn {
    margin: 0;
    word-wrap: break-word;
    overflow-wrap: break-word;
}
    .yemekOnProductCardDiv .basketPanelColumn span {
        margin-bottom: 20px;
    }
.yemekOnsmProductCardWrapper .yemekOnProductCardDiv .basketPanelColumn span {
    margin-bottom: 10px;
}

.yemekOnsmProductCardWrapper .yemekOnProductCardWrapper .basketPanelColumn span:last-child {
    margin-bottom: 0;
}
.yemekOnRestaurantAndProductDivWrapper {
    background: #F5F5F5;
    border-radius: 10px;
    margin: 5px;
    padding: 10px;
}

    .yemekOnRestaurantAndProductDivWrapper .yemekOnProductCardWrapper {
        height:unset;
        padding: 0;
        margin: 5px 0 0 0;
        
        border: none;
    }

.yemekOnProductCardWrapperDiv {
    display: flex;
    flex-direction: column;
}

    .yemekOnProductCardWrapperDiv:last-child {
        align-items: end;
        justify-content: space-between;
    }

    .yemekOnProductCardWrapperDiv .yemekOnRestaurantDiv {
        flex-direction: row;
        justify-content: space-between;
    }

    .yemekOnProductCardWrapperDiv .basketPanelColumn {
        margin: 0 0 1rem 0;
    }


.yemekOnsmProductCardWrapper {
    padding: 5px 10px;
}

    .yemekOnsmProductCardWrapper:first-child {
        padding-right: 4px;
    }

    .yemekOnsmProductCardWrapper:last-child {
        padding-left: 4px;
    }

    .yemekOnsmProductCardWrapper .yemekOnProductCardWrapper {
        background: #FFFFFF 0% 0% no-repeat padding-box;
        border: 1px solid #A5A5A5;
        border-radius: 10px;
        margin: 0;
        padding: 5px;
    }


    .yemekOnsmProductCardWrapper .yemekOnAddToCartIcon {
        top: 69%;
        width: 66%;
        right: 15%;
    }


.yemekOnRestaurantAndProductDivWrapper:first-child {
    margin-left: 0;
}

.yemekOnRestaurantAndProductDivWrapper:last-child {
    margin-right: 0;
}

.yemekOnmbProductHeaderSectionDiv {
    border-radius: 10px;
    display: flex;
    flex-direction: column;
    margin: 1rem 0;
    padding: 1rem;
    background-color: #f5f5f5;
}

.yemekOnRestaurantProductImg {
    border-radius: 10px;
    object-fit: cover;
    width:100%
}

.yemekOnCarousel {
    position: unset;
}
    .yemekOnCarousel.yemekOnCarouselFixed {
        padding: 1.5rem 0;
        position: fixed;
        background-color: white;
        z-index: 1009;
        left: 50%;
        width: 100%;
        transform: translateX(-50%);
        box-shadow: 0px 0px 30px #0000004F;
    }

.yemekOnProductCardDiv .payMethodPriceItem{
    margin-bottom:20px
}
.yemekOnRatingContainer {
    font: normal normal normal 16px/21px Rubik;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.basketPanelRow .yemekOnProductBoldandOrangeText{
    overflow:unset;
}

.bgUnset .productsPanel {
    padding: 0;
}
    .yemekOnProductHeaderWrapper {
        margin: 2rem 0;
        padding: 1.5rem 0;
        box-shadow: 0px 5px 8px #0000004F;
    }
.wantedProductButton {
    margin: 5px 5px 5px 0;
    padding: 7px 13px;
    background: none;
    border: 1px solid #DDDDDD;
    border-radius: 18px;
    font: normal normal 600 14px/21px Rubik;
    letter-spacing: 0px;
    color: #33302E;
}

    .wantedProductButton.selected {
        background-color: #FF6830;
        color: white;
    }
.unwantedProductButton {
    margin: 5px 5px 5px 0;
    padding: 7px 13px;
    background: none;
    border: 1px solid #DDDDDD;
    border-radius: 18px;
    font: normal normal 600 14px/21px Rubik;
    letter-spacing: 0px;
    color: #33302E;
}

    .unwantedProductButton.selected {
        background-color: #c5c5c5;
        text-decoration: line-through;
    }
.basketPanelRow .orderCheckLabel {
    font-size: 14px;
    max-width: 75%;
    height:20px;
   margin-right: 0px;
}
.yemekOnProductCardDiv .basketPanelRow {
    flex-wrap: wrap;
}
.yemekOnProductCardDiv .settingsTextArea {
    min-height:100px;
    background-color: #F2F2F2;

}
.yemekOnProductCardDiv .basketPanelRow .basketPanelRow {
    padding: 15px 5px;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
    .yemekOnProductCardDiv .basketPanelRow .basketPanelRow:hover {
        border-radius: 10px;
        background-color: #f7f7f7;
    }
    .yemekOnProductCardDiv .basketPanelRow .basketPanelRow .yemekOnProductBoldandOrangeText {
        font: normal normal 600 14px / 29px Rubik;
        display: flex;
        align-items: center;
    }
.productFormModel {
    overflow-y: auto;
    max-height: 75vh;
}
    .productFormModel .yemekOnProductCardDiv {
        border-bottom: 1px solid #f2f2f2;
        margin: 20px 0;
    }
        .productFormModel .yemekOnProductCardDiv:first-child {
            margin-top: 0;
        }
        .productFormModel .yemekOnProductCardDiv:last-child {
            border-bottom: unset;
        }
.productFormModelImgWrapper{
    display:flex;
    justify-content:center;
    margin-top:1rem;
}
.optionBody {
    overflow-y: unset !important;
    padding: unset!important;
}
.modalHeaderScroll {
    position: unset
}
    .modalHeaderScroll .yemekOnProductBoldandOrangeText {
        white-space: unset;
        max-height:87px;
         text-overflow: unset;
    }
    .modalHeaderScrollFixed {
        position: fixed;
        left: 50%;
        transform: translateX(-50%);
        padding: 10px 0;
        background: white;
        z-index: 1000;
        border-bottom: 1px solid #dcdcdc;
    }
.modalFooter {
    padding:0 1rem;
    border-top: 1px solid #f2f2f2;
    height: 70px;
    display: flex;
    align-items: center;
}
    .modalFoodImg {
        width: 250px;
        height: 250px ;
        object-fit: cover;
    }
.yemekOnProductCardDiv p {
    margin-bottom: 0;
    text-align: left;
    font: normal normal normal 16px / 21px Rubik;
    letter-spacing: 0px;
    color: #9A9A9A;
}
.yemekOnProductCardDiv h3 {
    font: normal normal normal 16px/19px Rubik;
    letter-spacing: 0px;
    color: #1D1D1B;
    max-height: 100px;
}
.nutsCardCircleDiv {
    display: flex;
    align-items: center;
    justify-content:space-between;
}
    .nutsCardCircleDiv .yemekOnRestaurantIcon {
        height: 30px;
        width: 30px;
    }

    .yemekOnProductForm {
    display: flex;
    flex-wrap: wrap;
}
.modalButton {
    justify-content: center;
    display: flex;
    align-items: center;
    border-radius: 28px;
    padding: 5px 20px;
    font: normal normal 400 14px / 26px Rubik;
    letter-spacing: 0px;
    color: #FFFFFF;
    background-color: #FF6830;
    text-decoration: unset;
}
.showMoreBtn {
    font: normal normal 600 14px / 29px Rubik;
    background-color: transparent;
    border: none;
   color: #FF6830;
    padding-bottom: 20px;
    display: inline-block;
    border-radius: 5px;
    text-align: center;
    text-decoration: none;
}

.arrowIcon {
    margin-left: 5px; /* Adjust spacing between text and icon */
}
.headerRelativ {
    position:relative;
}
.dessertInfoCardContainer {
    padding-top: 3rem;
    padding-bottom: 1rem;
    background-color:white;
}
.parallaxSection {
    position: relative;
    height: 380px;
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    display: flex;
    align-items: center;
    justify-content: center;
}
    .parallaxSection::before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: #0C8155 0% 0% no-repeat padding-box;
        mix-blend-mode: multiply;
        opacity: 0.45;
        z-index: 0;
    }
    .parallaxSection .transparentWhiteButton{
        border-radius:5px; 
        padding: 5px 20px;
    }
.fourRibbonSection {
    position: relative;
    background-color: #f9f8ed;
    z-index:1;
}
.addToCartOverlay {
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translate(-50%, 0);
    opacity: 0;
    transition: opacity 0.3s ease;
}

    .fourRibbonProductCard:hover .addToCartOverlay {
        opacity: 1;
    }
.fourRibbonProductCard .newPrice, .fourRibbonProductCard .m-newPrice {
    color: white !important;
}
.fourRibbonBackgorundImg {
    position: absolute;
    width: 100%;
    height: 400px;
    top: 0;
    left: 0;
    z-index: -1;
}
.fourRibbonDiv {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    position: relative;
    padding: 3rem 0;
}

.fourRibbonDivTop {
    font-size: 24px;
    font-weight: bold;
    color: #F8F3E9;
}

.fourRibbonDivImgLeft {
    position: absolute;
    top: 50%;
    transform: translateY(-59%) translateX(-90%);
    width: 5%;
    height: 15px;
    right: 50%;
}

.fourRibbonDivImgRight {
    position: absolute;
    top: 50%;
    transform: translateY(-59%) translateX(90%);
    width: 5%;
    height: 15px;
    left: 50%;
}
.fourRibbonDivCrispy {
    font-size: 75px;
    line-height: 16px;
    position: absolute;
    color: #FFFFFF12;
    font-style: italic;
}
.fourRibbonProductCard {
    border-radius: 10px 10px 0 0;
    position: relative;
    background: #0C3327 0% 0% no-repeat padding-box;
    border-top: 5px solid #D8CF82;
    border-left: 5px solid #D8CF82;
    border-right: 5px solid #D8CF82;
    border-bottom: none;
    margin-bottom: 3rem;
}
.fourRibbonProductImgWrapper {
    border-radius: 7px 7px 0 0;
    position: relative;
    overflow: hidden;
    height: 270px;
}

.fourRibbonPriceWrapper {
    margin: 0rem 3rem;
    text-align: center;
    transform: translateY(25px);
}
.fourRibbonProductCard:after {
    content: "";
    position: absolute;
    top: 100%;
    left: -6px;
    z-index: -1;
    width: 103.8%;
    height: 49px;
    background-image: url(https://files.catbox.moe/4nyqeq.png);
    background-repeat: no-repeat;
    object-fit: initial;
    background-size: contain;
    background-size: calc(100% - 0px);
}
/* searchRestaurantCard start */
.searchRestaurantCard {
    overflow: hidden;
    cursor: pointer;
    display: flex;
    align-items: center;
    border: 1px solid #DDDDDD;
    border-radius: 5px;
    background-color: white;
}
    .searchRestaurantCard .yemekOnRestaurantImg {
        height: 80px !important;
        width: 80px !important;
        border-radius: 15px !important;
        margin: 5px;
        padding:5px;
    }
    .searchRestaurantCard .yemekOnCompanyName {
        font: normal normal bold 16px/26px Rubik;
        color: #33302E !important;
        position: unset !important;
    }
    .searchRestaurantCard .yemekOnRestaurantCardDiv {
        font: normal normal normal 14px/21px Rubik;
        flex-direction: column !important;
    }
    .searchRestaurantCard .yemekOntimeInfo {
        align-items: unset;
        padding-top: 0 !important;
        justify-content: center !important;
    }
    .searchRestaurantCard .yemekOnEvaluation {
        font: normal normal bold 16px / 21px Rubik;
    }
.searchRestaurantCard .yemekOnShippingCost {
    padding-top: 0 !important;
}
/* searchRestaurantCard end */
        /* addressMap start */

        .addressMap {
    position: relative;
    display: inline-block;
    margin-bottom:2rem;
    overflow:hidden;
}

    .addressMap img {
        overflow: hidden;
        width: 100%;
        height: 500px;
        border: 2px solid #33302e;
    }

.addressMapIcon, .addressMapIconInside, .mapLocationTextArea, .addressMapIconInsideSpin {
    border: unset !important;
    position: absolute;
    transform: translate(-50%, -50%);
    pointer-events: none;
    top: 50%;
    left: 50%;
}
.addressMapIcon {

    z-index: 1009;
    width: 50px !important;
    height: 57px !important;
}
.mapLocationTextArea {
    position: absolute;
    top: 41%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-color: #33302E;
    border-radius: 16px;
    height: 52px;
    width: 28%;
    z-index: 1011;
    overflow: hidden;
}

    .mapLocationTextArea span {
        display: inline-block;
        text-align: center;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
        display: -webkit-box;
        margin: 5px 10px;
        font: normal normal normal 14px/21px Rubik;
        letter-spacing: 0px;
        color: #FFFFFF;
    }
.addressMapIconInside {
    top: 49%;
    transform: translate(-50%, -37%);
    z-index: 1010;
    width: 25px !important;
    height: 30px !important;
}
.addressMapIconInsideSpin {
    width: 30px !important;
    height: 27px !important;
    top: 47%;
    left: 48%;
    z-index: 1010;
    animation: spin360 3s linear infinite;
}

@keyframes spin360 {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}
/* addressMap end */

    .koseImgWrapper .yemekOnDiscountLabel {
        left: 15px;
        border-radius: unset;
        padding: 5px 10px;
        font: normal normal bold 16px / 28px Rubik;
    }
    .koseImgWrapper .yemekOnProductName {
        font: normal normal 600 16px / 23px Rubik;
        letter-spacing: 0px;
        color: #FFFFFF;
        bottom: 15px;
        left: 15px;
        width: 40%;
        height: 25px;
        white-space: nowrap;
        text-overflow: ellipsis;
    }
.koseImgWrapper .yemekOnCompanyName {
    text-decoration:none;
    border-radius: 4px;
    border: 1px solid #FFFFFF;
    background-color: transparent;
    font: normal normal 400 14px/17px Rubik;
    letter-spacing: 0px;
    color: #FFFFFF;
    left:unset;
    right:15px;
    bottom:15px;
    padding: 7px 13px;
    height:unset;
}
.koseImgWrapper:hover .yemekOnCompanyName {
    background-color: white;
    color: #012E5D;
}
.singleCardCarousel .yemekOnRestaurantImg{
    height:507px;
}
.singleCardCarousel .yemekOnProductName {
    bottom: 60px;
    white-space: unset;
    height: 45px;
    width: 50% !important;
}
.singleCardCarousel .yemekOnCompanyName{
    right:unset;
    left:15px;
}

.shadowFromTopToBottom {
    position: absolute;
    top: 0%;
    left: 0;
    width: 100%;
    height: 100%;
    background: transparent linear-gradient(180deg, #1D1D1B 0%, #1D1D1B00 100%) 0% 0% no-repeat padding-box;
    opacity: 0.6;
}
.shadow{
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 50%;
    background: transparent linear-gradient(0deg, #1D1D1B 0%, #1D1D1B00 100%) 0% 0% no-repeat padding-box;
    opacity: 0.7;
}
.imgBackgroundShadow {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 25%;
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0.1), rgb(36 36 36));
}

.koseImgWrapper .yemekOnSectionHeader {
    padding: 0.5rem 1rem;
}
.koseImgWrapper .videoSectionBannerText{
    font-size:14px;
}
.koseImgWrapper .similarProductCard {
    padding: 10px;
}
.koseImgWrapper .similarProductImg {
    padding: 5px;
    height: 200px !important;
    object-fit: cover;
}

.koseImgWrapper .productGridRightColumn {
    font-size: 14px;
    border-radius:0 !important;
}
.koseImg {
    margin-left:10px;
    width: 100%;
    height: 371px;
}

.headerFixedText {
    padding: 10px 0;
    font: normal normal bold 16px/18px Rubik;
    letter-spacing: 0px;
    color: #012E5D;
}
.bgUnset .headerButtonIcon {
    border-radius:50%;
    background-color:white;
    padding:5px;
}
.bgUnset .m-nutHeaderIcon {
    background-color: white;
    width: 35px;
    height: 35px;
    font-size: 4vw;
}

.bgUnset .m-mobileHeaderBottomIcon {
    width: 15px;
}
.iti {
    display:block !important
}
.blurMenu {
    position:fixed;
    -webkit-backdrop-filter: blur(50px);
    backdrop-filter: blur(50px);
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    color: white;
    display: none;
    flex-direction: column-reverse;
    justify-content: start;
    padding-top:2rem;
    align-items: center;
    transition: left 0.3s ease-in-out;
    z-index: 1000;
}
.mobileMenuCategoryDiv {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: none;
    flex-direction: column-reverse;
    justify-content: start;
    background-color:white;
    align-items: center;
    transition: left 0.3s ease-in-out;
    z-index: 1000;
}
.mobileMenuCategoryWrapper {
    position: relative;
    z-index: 1;
    overflow-y: auto;
    padding: 4rem 1rem 1rem 1rem;
    overflow-x: hidden;
}
.mobileMenuHeader {
    width: 100%;
    height: 45px;
    position: absolute;
    background: white;
    z-index: 9999;
    box-shadow: 0px 2px 3px #00000033;
}
.mobileMenuTitle {
    font-weight: 600;
    display: inline-block;
    left: 20px;
    top: 10px;
    position: absolute;
}
.mobileMenuCategoryWrapper .m-roundedGridColumn {
    padding: 0 .3rem !important;
}

.mobileMenuCategoryWrapper .m-roundedGridImg {
    width: 56px;
    height: 56px;
    object-fit: cover;
}
.mobileMenuCategoryWrapper .m-roundedGridText {
    background-color: white;
    padding: 0;
    font-weight: unset;
    font-weight: 600;
    line-height: 17px;
    height: 50px
}
.mobileMenuCategoryWrapper .m-roundedGridItem {
    padding: 0.5rem;
}
.imgBackground {
    width: 100%;
    height: 115vh;
}
.halfImgWrapper {
    position: relative;
    width: 100%;
    padding-left: 150px;
    height: 500px;
}
    .halfImgWrapper::before {
        content: "";
        position: absolute;
        width: 75%;
        height: 100%;
        top: 5%;
        left: 30%;
    }

.animate {
    transition: transform 1.5s ease-out;
}

.kolboregi8, .kolboregi3 {
    transform: translate(100%, -100%);
}

    .kolboregi8.animate, .kolboregi3.animate {
        transform: translate(0, 0);
    }

.kolboregi9, .kolboregi10 {
    transform: translate(-100%, -100%);
}

    .kolboregi9.animate, .kolboregi10.animate {
        transform: translate(0, 0);
    }

.kolboregi8 {
    right: 5%;
    top: 32%;
    width: 23%;
}

.kolboregi3 {
    right: 9%;
    top: 11%;
    width: 23%;
}

.kolboregi9 {
    left: 9%;
    top: 11%;
    width: 23%;
}

.kolboregi10 {
    left: 5%;
    top: 32%;
    width: 23%;
}
.kolboregi11 {
    left: 31%;
    top: 48%;
    width: 17%;
}

.katmer1 {
    left: 51%;
    top: 55%;
    width: 22%;
}

.imgBackgroundText {
    left: 27%;
    top: 27%;
    width: 45%;
}

.suboregitepsi {
    top: 5%;
    left: 38%;
    width: 23%;
    animation: rotate360 12s linear infinite;
}

@keyframes rotate360 {
    from {
        transform: translate(0, -50%) rotate(0deg);
    }

    to {
        transform: translate(0,-50%) rotate(360deg);
    }
}

.m-imgBackground {
    width: 100%;
    height: 100vh;
}

.m-imgBackgroundText {
    left: 13%;
    top: 32%;
    width: 75%;
}

.m-suboregitepsi {
    top: 0;
    left: 50%;
    width: 400px;
    transform: translate(-50%, -50%);
}

.m-kolboregi8 {
    left: -10%;
    top: 47%;
    width: 50%;
    transform: translate(-100%, 100%);
}
    .m-kolboregi8.animate {
        transform: translate(0, 0);
    }

.m-kolboregi11 {
    right: 30%;
    top: 60%;
    width: 40%;
}

.m-kolboregi9 {
    right: -10%;
    top: 47%;
    width: 50%;
    transform: translate(100%, 100%);
}

    .m-kolboregi9.animate {
        transform: translate(0, 0);
    }

.rightTopImgAbsolute {
    position: absolute;
    width: 12%;
    z-index: 1000;
    right: 10%;
    top: -25%;
}

.leftBottomImgAbsolute {
    position: absolute;
    height: 60%;
    width: 18%;
    z-index: 1000;
    left: 0;
    bottom: -50px;
}

.halfTextName {
    padding-left:3rem;
    font-size:36px;
    font-weight:bold;
    letter-spacing: 0px;
     color: #FFFFFF;
}

.halfTextTitle {
    font: normal normal normal 100px / 162px Mr Canfields Regular;
    letter-spacing: 0px;
    margin-top: -77px;
}

.halfTextDesc {
    font-size: 16px;
    letter-spacing: 0px;
    color: #FFFFFF;
    width: 75%;
    line-height: 22px;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 14;
    display: -webkit-box;
    overflow: hidden;
}
.m-halfTextDesc {
    padding:0 0.5rem;
    font-size: 14px;
    letter-spacing: 0px;
    color: #FFFFFF;
    line-height: 22px;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 7;
    display: -webkit-box;
    overflow: hidden;
}
.m-halfImgWrapper {
    position: relative;
    height: 340px;
    padding:0 0 2rem 0;
}
    .m-halfImgWrapper::before {
        content: "";
        position: absolute;
        width: 100%;
        height: 90%;
        top: 5%;
        left: 5%;
    }
.productBackground {
    border-radius: 40px;
    background-color: white;
    text-align: center;
    padding: 6rem 12rem 2rem 12rem;
    margin-top: 8rem;
    margin-bottom: 3rem;
}
.m-productBackground {
    border-radius: 40px;
    background-color: white;
    text-align: center;
    padding-bottom: 2rem;
    margin-bottom:3rem;
}
.productBackgroundDesc {
    font-size: 16px;
    letter-spacing: 0px;
    line-height: 22px;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 5;
    display: -webkit-box;
    overflow: hidden;
}
.hoverImageSliderContainer {
    position: relative;
    width: 300px;
    height: auto;
}

.hoverImageSlider {
    position: absolute;
    width: 100%;
    height: auto;
    transition: transform 0.5s ease;
}

    .hoverImageSlider.top {
        filter: drop-shadow(0px 10px 15px rgba(0, 0, 0, 0.5));
        transform: translateX(175%) translateY(-70%);
    }

    .hoverImageSlider.bottom {
        transform: translateX(175%) translateY(-70%);
    }
.hoverImageSliderContainer:hover .hoverImageSlider.top {
    transform: translateX(190%) translateY(-70%);
}

.hoverImageSliderContainer:hover .hoverImageSlider.bottom {
    transform: translateX(140%) translateY(-70%);
}
.m-hoverImageSliderContainer {
    top: 0;
    position: absolute;
    width: 140px;
    height: 140px;
    right: 17%;
}
.m-hoverImageSlider.top {
    transform: translateX(-10%) translateY(-30%);
    position: absolute;
    width: 100%;
    height: auto;
    transition: transform 0.5s ease;
    filter: drop-shadow(0px 10px 15px rgba(0, 0, 0, 0.5));
}
.m-hoverImageSlider.bottom {
    transform: translateX(-45%) translateY(-30%);
    position: absolute;
    transition: transform 0.5s ease;
    height: 100%;
    width: 100%;
}
.aboveTitleImg {
    height: 90px;
    margin-left: -25px;
}
.leftMidImgAbsolute {
    position: absolute;
    left: 6%;
    transform: translateX(-50%);
    width: 300px;
    height: auto;
    top: 47%;
}
.m-productBackgroundDesc {
    padding:0 2rem;
    font-size: 14px;
    letter-spacing: 0px;
    line-height: 22px;
    -webkit-box-orient: vertical;
    display: -webkit-box;
    overflow: hidden;
}
.rightBottomImgAbsolute {
    position: absolute;
    right: -5%;
    bottom: 5%;
    width: 300px;
    height: auto;
}
/* F.A.Q CSS */

    .faqSection {
    overflow:hidden;
    width: 100%;
    padding: 3rem;
}
 
.faqCheckbox {
    display: none;
}

.faqQuestion {
    display: flex;
    align-items: center;
    padding: 10px;
    cursor: pointer;
    color: white;
    position: relative;
    font-size: 13px;
    font-weight: 600;
}

.faqItem:not(:first-of-type) {
    border-top: 0;
}

.faqIcon::after {
    content: "+";
    font-size: 24px;
    width: 1.5rem;
    height: 1.5rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-right: 1rem;
    font-weight: 300;
}

.faqCheckbox:checked + .faqQuestion {
    border-bottom: none;
}

.faqCheckbox:checked + .faqQuestion .faqIcon::after {
    content: "-";
}

.faqAnswer {
    display: none;
    font-size: 13px;
    font-weight: 200;
    overflow-y: auto;
    padding: 0 10px;
}

.faqCheckbox:checked ~ .faqAnswer {
    display: block;
    padding: 0 0 10px 50px;
    color: white;
}

/* F.A.Q CSS */

.dessertSeacrh {
    border: 1px solid #806721 !important;
    padding: 5px 5px 5px 15px;
    opacity: 0.4;
}
    .dessertSeacrh::placeholder {
        color: #806721;
    }
    .dessertSeacrh:focus {
        outline: none;
        box-shadow: none;
        opacity: 1;
    }
.headerLanguageMenu {
    text-align: right;
    padding-top: 4px;
    margin-right: 30px;
}

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

.dropdown-btn {
    padding: 5px 10px;
    font-size: 11px;
    border: unset;
    border-radius: 4px;
    background-color: #0C5AE2 !important;
    display: flex;
    gap: 10px;
    cursor: pointer;
    align-items: center;
    color: white;
}

.dropdown-menu {
    list-style: none;
    margin: 0;
    padding: 0;
    position: absolute;
    top: 100%;
    left: 0;
    background-color: white;
    border: 1px solid #ccc;
    border-radius: 4px;
    min-width: 100px;
    display: none;
    z-index: 10;
}

    .dropdown-menu li {
        padding: 5px 5px 5px 9px;
        display: flex;
        align-items: center;
        gap: 12px;
        cursor: pointer;
        font-size: 11px;
    }

        .dropdown-menu li:hover {
            background-color: #f0f0f0;
        }

    .dropdown-menu img {
        width: 20px;
        height: 15px;
        object-fit: cover;
    }

.dropdown.open .dropdown-menu {
    display: block;
}
.headerBottomMenuButton {
    border-radius: 6px;
    height: 50px;
    color: white;
    min-width: 120px;
}
.videoPlayBannerSection {
    overflow: hidden;
    color: white;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 88vh;
}
.fullScreenVideo {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    overflow: hidden;
    z-index: -1;
}

.videoPlayBannerImgWrapper {
    position: absolute;
    bottom: -1px;
    z-index: -1;
    width:100%;
}
.videoPlayBannerTitle {
    width: 25%;
    font-size: 38px;
    font-weight: 600;
}
.videoPlayBannerDesc {
    font-size: 16px;
    width: 34%;
    display: flex;
}

.videoPlayBannerBtn {
    padding: 0 5px;
    width: max-content;
    height: 35px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 5px;
    font-size: 12px;
    background-color: transparent;
    border: 1px solid white;
    color: white;
    text-decoration: none;
    font-weight: bold;
    width: 120px;
}
.projects-col-div {
    height: 618px;
}
.projects-col-div:last-child {
    width: 600px;
}
.projects-title {
    font-size: 38px;
    font-weight: bold;
    opacity: 1;
    letter-spacing: 0px;
}

.projects-text {
    text-align: left;
    font-size: 13px;
    margin-top: 1rem;
    margin-bottom: 1rem !important;
}

.projects-item-title {
    padding: 10px 0;
    text-align: left;
    font-size: 13px;
    opacity: 1;
    letter-spacing: 0px;
    line-height: 1;
    position: relative;
    z-index: 1;
}

.projects-title-div {
    cursor: pointer;
    position: relative;
    background: transparent 0% 0% no-repeat padding-box;
    border-radius: 0px 6px 6px 0px;
    opacity: 1;
    height: 50px;
    display: flex;
    flex-direction: column;
    transition: background 0.5s ease, height 0.5s ease;
}

    .projects-title-div:before {
        position: absolute;
        content: "";
        height: 50px;
        left: -100%;
        top: 0;
        width: 100%;
        transition: background 0.5s ease, height 0.5s ease;
    }

    .projects-title-div.active {
        background: #EF4A49 0% 0% no-repeat padding-box;
        height: 80px;
        transition: background 0.5s ease, height 0.5s ease;
    }

        .projects-title-div.active:before {
            left: -100%;
            top: 0;
            width: 100%;
            height: 80px;
            background: #EF4A49 0% 0% no-repeat padding-box;
            transition: background 0.5s ease, height 0.5s ease;
        }

        .projects-title-div.active .projects-item-title {
            color: #fff;
            margin-bottom: 0.5rem;
        }

.projects-item-shortDesc {
    font-size: 13px;
    font-weight: normal;
    color: #fff;
    opacity: 0;
    padding-bottom: 10px;
    transition: opacity 0.3s ease;
}

.projects-title-div.active .projects-item-shortDesc {
    opacity: 1;
    transition: opacity 0.3s ease;
}

.projects-button {
    font-size: 12px;
    font-weight: normal;
    color: #fff;
    border-color: #fff;
    background-color: transparent;
    border-radius: 6px;
    border: 1px solid #fff;
    padding: 8px;
}

    .projects-button:hover {
        color: #121A50;
        border-color: #fff;
        background-color: #fff;
    }
.halfImage{
    height:500px;
}
.halfTextWrapper {
    margin-left:3rem;
}
.marquee {
    position: relative;
    overflow: hidden;
    white-space: nowrap;
    height: 45px;
    display: flex;
    align-items: center;
}

.marquee-content {
    display: inline-block;
    animation: marquee 35s linear infinite;
    padding-left: 100%;
    font-size: 38px;
    font-weight: bold;
    color: black;
}

@keyframes marquee {
    0% {
        transform: translateX(0%);
    }

    100% {
        transform: translateX(-100%);
    }
}
.doubleColor {
    position: relative;
    width: 100%;
    overflow: hidden;
}

    .doubleColor::before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        z-index: -2;
    }

    .doubleColor:after {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        z-index: -1;
    }
.headerMenuWrapper {
    position: relative;
}

    .headerMenuWrapper:before {
        position: absolute;
        content: "";
        top: 0;
        right: -990%;
        width: 1000%;
        height: 100%;
        z-index: -1;
    }

.eightItemStatementTitle {
    font-size: 38px;
    font-weight: bold;
    opacity: 1;
    letter-spacing: 0px;
    text-align: center;
}
.eightItemStatementImg {
    position: absolute;
    bottom: 99%;
    left: 0;
    z-index: -1;
    height: 5%;
    width: 100%;
}
.eightItemStatementText {
    text-align: center;
    font-size: 13px;
    margin-top: 1rem;
    margin-bottom: 1rem !important;
}
.eightItemStatementCardTitle {
    font-size: 16px;
    font-weight: bold;
    opacity: 1;
    letter-spacing: 0px;
    text-align: center;
}
.eightItemStatementCardText {
    text-align: center;
    font-size: 13px;
    opacity: 0.7;
}

.eightItemStatementCard {
    display: flex;
    flex-direction: column;
    align-items: center;
    height: 260px;
    border: 1px solid;
    border-radius: 10px;
    padding: 10px;
    position: relative;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

    .eightItemStatementCard:hover {
        transform: translateY(-10px);
        box-shadow: 0 8px 20px rgba(0, 0, 0, 0.15);
    }

.eightItemStatementImageContainer {
    position: relative;
    overflow: hidden;
    width: 75px;
    height: 75px;
    margin-bottom: 1rem;
}

.eightItemStatementImageFirst,
.eightItemStatementImageSecond {
    position:absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    transition: opacity 0.3s ease;
}

.eightItemStatementImageFirst {
    opacity: 1;
    z-index: 2;
}

.eightItemStatementImageSecond {
    opacity: 0;
    z-index: 1;
}

.eightItemStatementCard:hover .eightItemStatementImageFirst {
    opacity: 0;
}

.eightItemStatementCard:hover .eightItemStatementImageSecond {
    opacity: 1;
}

.fourStepsBgImage {
    height: 600px;
    width: 100%;
    position: absolute;
    z-index: -1;
    top: 0;
    left: 0;
}
.fourStepsCard {
    border: 2px dashed white;
    border-radius: 10px;
    height: 210px;
    padding: 20px;
}
.fourStepsDiv{
    display:flex;
    align-items:center;
    justify-content:space-evenly;
    flex-direction:column;
    height:600px;
}
.fourStepsTitle {
    font-size: 38px;
    font-weight: bold;
    text-align: center;
    color: white;
}
.fourStepsCardTitle {
    font-weight: 400;
    color:white;
}
.fourStepsCardShortDesc {
    font-size: 13px;
    font-weight: 100;
    color: white;
}
.fourStepsFooter {
    text-align:center;
    font-size: 13px;
    font-weight: 400;
    color: white;
}
.evaluationProfileDiv {
    background: white;
    border-radius: 4px;
    text-align: center;
    position: relative;
    padding: 40px 20px 20px 20px;
    height: 320px;
    z-index: 1;
}
.evaluationProfileDesc {
    display: -webkit-box;
    -webkit-line-clamp: 7;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}
.evaluationProfileImg {
    height: 70px;
    width: 70px !important;
    border-radius: 100%;
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%) translateY(-50%);
    z-index: 1;
    overflow: visible !important;
}

.evaluationProfileImgWrapper {
    position: relative;
    display: inline-block;
    transform: translateY(-52px);
}

    .evaluationProfileImgWrapper::after {
        content: "";
        position: absolute;
        height: 63px;
        width: 63px;
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
        border: 1px solid #FFFFFF;
        border-radius: 50%;
        z-index: 2;
        pointer-events: none;
    }

.pieceSaleImg {
    height: 140px;
    margin-bottom: 3rem;
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%) translateY(-50%);
}
.storyImgDiv {
    border: 4px solid #FFFFFF;
    border-radius: 20px;
    height: 361px;
}

.storyImg {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.stars {
    display: flex;
    gap: 5px;
    font-size: 30px;
    color: #ffc107;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

.faqImageDiv {
    text-align: center !important;
}

    .faqImageDiv > img {
        width: 40%;
    }

.faqTitle {
    text-align: center;
    font-size: 38px;
    font-weight: bold;
    opacity: 1;
    margin-top: 3rem;
    margin-bottom: 3rem;
    color: #57A0F0;
}

.faqAccordion {
    padding-right: 8rem;
    padding-left: 8rem;
}

.faqItem {
    border: none;
    margin-top: 0.5rem;
}

.faqHeader {
    border-top-left-radius: 0.75rem !important;
    border-top-right-radius: 0.75rem !important;
    border-bottom-left-radius: 0.75rem !important;
    border-bottom-right-radius: 0.75rem !important;
}

.faqButton {
    position: relative;
    background: #ebf3fa 0% 0% no-repeat padding-box;
    border-top-left-radius: 0.75rem !important;
    border-top-right-radius: 0.75rem !important;
    border-bottom-left-radius: 0.75rem !important;
    border-bottom-right-radius: 0.75rem !important;
}

.faqContent {
    text-align: left;
    font-size: 12px;
    line-height: 24px;
    font-weight: normal;
    font-family: "Ubuntu", sans-serif;
    letter-spacing: 0px;
    color: #00253b;
    opacity: 1;
    margin-left: 1.5rem;
    margin-top: 0.5rem !important;
    margin-bottom: 0.5rem !important;
}

#mobileHeader {
    width: 100%;
    position: relative;
    padding: 0.1px 0;
}

    #mobileHeader:after {
        content: "";
        clear: both;
        display: block
    }
.logo {
    float: left;
    position: relative;
    z-index: 9999;
}

#mobileHeaderMenuIcon {
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    margin-right: 10px;
    display: none;
    z-index: 9999;
}

    #mobileHeaderMenuIcon span {
        border: 1px solid #fff;
        width: 24px;
        margin: 5px;
        display: block;
        -webkit-transition: all .3s;
        transition: all .3s
    }

#mobileMenuSignage {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    overflow: hidden;
    z-index: 1002;
    opacity: 0;
    transform: translateY(-10px);
    transition: opacity 0.4s ease-in-out, transform 0.4s ease-in-out;
    pointer-events: none;
}
    #mobileMenuSignage.show {
        transition: opacity 0.4s ease-in-out, transform 0.4s ease-in-out;
        opacity: 1;
        transform: translateY(0);
        pointer-events: auto;
    }

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

        #mobileMenuSignage ul li {
            padding: 10px;
            border-bottom: 1px solid #ccc;
        }

            #mobileMenuSignage ul li a {
                text-decoration: none;
                color: black;
                font-size: 16px;
                font-weight:bold;
                display: block;
            }

                #mobileMenuSignage ul li a:hover {
                    color: #007bff;
                }


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


    #mobileHeaderMenuIcon {
        display: inline;
        cursor: pointer;
        margin-top: 4px;
        top: 0;
        transform: translateY(0);
    }

        #mobileHeaderMenuIcon.active .first {
            transform: rotate(45deg);
            -webkit-transform: rotate(45deg);
            margin-top: 9px
        }

        #mobileHeaderMenuIcon.active .second {
            transform: rotate(135deg);
            -webkit-transform: rotate(135deg);
            position: relative;
            top: -7px;
        }

        #mobileHeaderMenuIcon.active .third {
            display: none
        }
}
.doubleColor.zIndexFix::before,
.doubleColor.zIndexFix::after {
    z-index: 1001;
}
.faqButton:not(.collapsed)::before {
    content: "-";
    position: absolute;
    left: 1%;
    font-size: 2rem;
}

.faqButton.collapsed::before {
    content: "+";
    position: absolute;
    left: 1%;
    font-size: 2rem;
}

.faqButtonText {
    margin-left: 1.5rem;
    text-align: left;
    font-size: 16px;
    line-height: 20px;
    font-weight: bold;
    font-family: "Rajdhani", sans-serif;
    letter-spacing: 0px;
    color: #1c3862;
    opacity: 1;
}

.image-slider-wrapper {
    width: 100%;
    overflow: hidden;
    position: relative;
    padding: 20px 0;
}

.image-slider {
    display: flex;
    position: relative;
    transition: transform 0.3s linear;
}

    .image-slider .item {
        height: 120px;
        background: #fff;
        border: 1px solid #f2f2f2;
        border-radius: 28px;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 7px 40px;
        margin: 0 20px;
        box-shadow: 0 0 20px 0 rgba(0, 0, 0, .05);
    }

    .image-slider img {
        max-width: 100%;
        max-height: 100%;
        object-fit: contain;
    }
.threeBlogCarousel {
    opacity: 1;
    display: flex !important;
    justify-content: center;
    align-items: center;
}

.threeBlogItem {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    top: 0;
    right: 0;
    z-index: 0;
    transition: all 2s linear;
    height: 400px;
}

.threeBlogImg {
    width: 380px !important;
    height: 450px;
    object-fit: cover;
}

.threeBlogItem:hover .threeBlogImg {
    border: 2px dashed #00253b;
}

.threeBlogItem:hover .threeBlogContainer {
    transform: translateY(-13rem);
}


.threeBlogContainer {
    position: absolute;
    width: 100%;
    top: 76%;
    left: 0;
    z-index: 1;
    transition: all 0.5s linear;
    padding: 0 1rem;
}

    .threeBlogContainer:after {
        content: "";
        position: absolute;
        top: -60px;
        width: 100%;
        left: 0;
        background: transparent linear-gradient(0deg, #002e49 8%, #00253B00 100%) 0% 0% no-repeat padding-box;
        height: 145px;
        transition: all 0.5s linear;
        z-index: -1;
    }

.threeBlogItem:hover .threeBlogContainer:after {
    content: "";
    position: absolute;
    top: -200px;
    width: 100%;
    left: 0;
    transition: all 0.5s linear;
    background: transparent linear-gradient(0deg, #002e49 8%, #00253B00 100%) 0% 0% no-repeat padding-box;
    height: 500px;
    z-index: -1;
}

.threeBlogShortDesc {
    text-align: left;
    font-size: 20px;
    line-height: 24px;
    font-weight: bold;
    font-family: "Ubuntu", sans-serif;
    letter-spacing: 0px;
    color: #ffffff;
    opacity: 1;
    transition: all 1s ease;
    height: 72px;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    display: -webkit-box;
    overflow: hidden;
}

.threeBlogDesc {
    text-align: left;
    font-size: 16px;
    line-height: 28px;
    font-weight: 100;
    font-style: italic;
    font-family: "Ubuntu", sans-serif;
    letter-spacing: 0px;
    color: #ffffff;
    transition: all 1s ease;
    margin-top: 0.5rem;
    margin-bottom: 0.5rem;
    height: 140px;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 5;
    display: -webkit-box;
}

.threeBlogItemButton {
    letter-spacing: 0px;
    color: #ffffff;
    border: 1px solid #ffffff;
    line-height: 1;
    border-radius: 0;
    text-align: center;
    font-size: 18px;
    font-weight: 600;
    font-style: italic;
    font-family: "Rajdhani", sans-serif;
    letter-spacing: 0px;
    transition: all 1s ease;
    position: relative;
    width: 50%;
    padding: 7px 10px;
    margin-top: 1rem;
}

    .threeBlogItemButton:hover {
        background: white;
        color: #12a19a;
        font-weight: 600;
    }

.threeBlogButton {
    height: 35px;
    text-align: center;
    font-size: 14px;
    font-weight: 600;
    font-family: "Rajdhani", sans-serif;
    letter-spacing: 0px;
    color: #00253b;
    border: 1px solid #00253b;
    opacity: 1;
    display: flex;
    border-radius: 0;
    position: relative;
    z-index: 2;
    align-items: center;
    justify-content: center;
}

    .threeBlogButton:hover {
        background: white;
        color: #12a19a;
    }

.pieceSaleCard {
    box-shadow: 0px 3px 20px #00000029;
    border-radius: 31px;
    padding-top: 90px;
    position: relative;
    text-align: center;
    height: 545px;
    background: white;
    margin-top: 6rem;
}

    .pieceSaleCard h2 {
        color: #002060;
    }

    .pieceSaleCard .price {
        font-size: 2.5rem;
        font-weight: bold;
    }

    .pieceSaleCard ul {
        list-style: none;
        padding: 0;
        text-align: left
    }

.btn-custom {
    padding: 10px 20px;
    border-radius: 26px;
    width: 80%;
}

.pieceSaleImgDiv {
    width: 200px;
    height: 150px;
    margin-bottom: 3rem;
}

.pieceSaleCardTitle {
    font-size: 20px;
    font-weight: bold;
    color: black;
}

.contactInputDiv {
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    flex-direction:column;
    margin-right: auto !important;
    margin-left: auto !important;
}


.contactCarousel {
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    margin-top: 1rem;
    margin-bottom: 1rem;
}

.contactAddressCard {
    padding: 0.5rem !important;
}

.contactAddressIconDiv {
    width: 80px;
    height: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background-color: #003c57;
    padding: 0.75rem;
}

.contactAddressIcon {
    font-size: 3rem;
    color: #ffffff;
}

.contactAddressText {
    flex-direction: column;
    display: flex;
    height: 70px;
    justify-content: center;
    color: #003c57;
    font-size: 15px;
}

.contactInput {
    height: 50px;
    background: #f3f3f3 0% 0% no-repeat padding-box;
    border-radius: 4px;
    opacity: 1;
}

.contactTextArea {
    height: 60px;
    background: #f3f3f3 0% 0% no-repeat padding-box;
    border-radius: 4px;
    opacity: 1;
}

.contactButton {
    width: 100%;
    height: 44px;
    border: 1px solid #00253b;
    border-radius: 5px;
    opacity: 1;
    text-align: center;
    font-size: 16px;
    line-height: 18px;
    font-weight: bold;
    font-family: "Ubuntu", sans-serif;
    letter-spacing: 5px;
    color: #00253b;
    opacity: 1;
    padding: 0.75rem;
}

    .contactButton:hover {
        background: #00253b 0% 0% no-repeat padding-box;
        border: 2px solid #00253b;
        border-radius: 10px;
        opacity: 1;
        color: #ffffff;
    }
.inputWrapper {
    position: relative;
    margin: 0.1em 0;
}

.contactInputDiv .getOfferFormInput {
    background: white;
    color: #000000;
}

.getOfferFormInput {
    height: 40px;
    background: transparent;
    border-radius: 0;
    border: 1px solid #ffffff;
    opacity: 1;
    padding: 0.5em;
    font-size: 16px;
    color: white;
}


.getOfferFormInput:not(:placeholder-shown) {
    top: 0.75em;
    left: 0.5em;
    font-size: 16px;
    color: #000000;
    background-color: white;
}
.getOfferFormButton{
    border-radius:0 !important;
    background:unset;
    width:100%;
}
.getOfferFormButton:hover {
    color:white !important;
}

.demoCountry::after {
    content: "\f078";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    font-size: 14px;
    color: #555;
    position: absolute;
    right: 15px;
    top: 50%;
    transform: translateY(-50%);
    pointer-events: none;
}
.optionalSalesDesc {
    display:flex;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    height:100px;
}
.optionalSalesShorDesc {
    height: 160px;
}
    .optionalSalesShorDesc ul li i {
        color: black;
    }
    
.videoPlayVideo {
    height: 100vh;
    object-fit: contain;
}
.freeTrialFormInput{
    height:40px;
}
@media (max-width: 1400px) {
    .projects-col-div:last-child {
        width: 560px;
    }
    .categoryProductImagesWrapper {
        height: 185px;
    }
    .listSixView .categoryProductImagesWrapper {
        height: 110px !important;
    }
    .halfTextDesc {
        font-size: 14px;
        letter-spacing: 0px;
        color: #FFFFFF;
        width: 85%;
        line-height: 22px;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 12;
        display: -webkit-box;
        overflow: hidden;
    }
    .leftBottomImgAbsolute {
        position: absolute;
        height: 50%;
        width: 16%;
        z-index: 1000;
        left: 0;
        bottom: -50px;
    }
    .halfImgWrapper {
        padding-left: 75px;
        height: 460px;
    }
    .halfImgWrapper::before {
        width: 87%;
        top: 6%;
        left: 19%;
    }
    .kolboregi10 {
        top: 31%;
    }

    .kolboregi8 {
        top: 31%;
    }
    .kitchenBoxImg {
        width: 100%;
        height: 300px;
        object-fit: fill;
        border-radius: 8px;
    }

    .sliderImageText {
        font-size: 16px !important;
    }

    .dessertBannerTitle {
        margin-bottom: -6rem;
        margin-left: 5rem;
        font-size: 20px;
    }

    .dessertBannerShortDesc {
        font-size: 100px;
    }

    .searchResultDiv {
        width: 180%;
    }

    .yemekOnRestaurantCardDiv {
        font: normal normal normal 16px / 28px Rubik;
    }

    .yemekOnRestaurantDiv {
        font: normal normal normal 13px/21px Rubik;
    }

    .yemekOnsmProductCardWrapper .yemekOnAddToCartIcon {
        top: 72%;
        width: 80%;
        right: 8%;
    }

    .yemekOnAddToCartIcon {
        top: 71%;
        width: 55%;
        right: 22%;
    }

    .yemekOnsmProductCardWrapper .yemekOnProductImg {
        height: 85px
    }

    .yemekOnRestaurantCardDiv {
        font: normal normal normal 16px / 28px Rubik;
    }

    .yemekOnRestaurantDiv {
        font: normal normal normal 13px/21px Rubik;
    }

    .yemekOnsmProductCardWrapper .yemekOnAddToCartIcon {
        top: 72%;
        width: 80%;
        right: 8%;
    }

    .yemekOnAddToCartIcon {
        top: 71%;
        width: 55%;
        right: 22%;
    }

    .yemekOnsmProductCardWrapper .yemekOnProductImg {
        height: 85px
    }
}

    @media (max-width: 1200px) {
        .projects-col-div:last-child {
            width: 479px;
        }

        .projects-col-div {
            height: 633px;
        }
        .videoPlayBannerSection {
            height: 75vh;
        }
        .halfImage {
            height: 420px;
        }
        .listSixView .categoryProductImagesWrapper {
            height: 132px !important;
        }
        .leftMidImgAbsolute {
            left: 3%;
            width: 240px;
        }
        .rightBottomImgAbsolute {
            right: -9%;
            width: 240px;
        }
        .productBackground {
            padding: 6rem 7rem 2rem 7rem;
        }
        .hoverImageSlider.top {
            transform: translateX(115%) translateY(-70%);
        }

        .hoverImageSlider.bottom {
            transform: translateX(115%) translateY(-70%);
        }

        .hoverImageSliderContainer:hover .hoverImageSlider.top {
            transform: translateX(130%) translateY(-70%);
        }

        .hoverImageSliderContainer:hover .hoverImageSlider.bottom {
            transform: translateX(80%) translateY(-70%);
        }
        .rightTopImgAbsolute{
            right:5%;
        }
        .halfImgWrapper {
            height: 400px;
        }

        .halfImgWrapper::before {
                width: 83%;
                top: 5%;
                left: 23%;
         }
        .halfTextDesc {
            width: 100%;
            -webkit-box-orient: vertical;
            -webkit-line-clamp: 9;
            display: -webkit-box;
        }
        .imgBackground {
            height: 105vh;
        }
        .kolboregi3 {
            top: 14%;
        }
        .kolboregi9 {
            top: 14%;
        }
        .imageInsideText {
            font-size: 30px !important;
        }
        .imageInsideTitle {
            font-size: 28px !important;
        }
        .transparentWhiteButton{
            font-size:14px;
        }
        .kitchenBoxImg {
            height: 250px;
        }
        .dessertBanner {
            height: 75vh;
        }
        .dessertBannerDesc {
            margin-left: 0;
        }
        .roundedItem:hover .roundedImageDiv::after {
            transform: translate(-50%, -57%);
            border: 3px solid #1d1d1b;
            width: 100%;
            height: 100%;
            opacity: 1;
        }
        .searchResultDiv {
            width: 240%;
        }

        .yemekOnsmProductCardWrapper .yemekOnProductCardWrapper {
            padding: 15px;
        }


        .yemekOnProductHeaderSectionDiv .basketPanelColumn {
            margin: 0;
        }

        .yemekOnAddToCartIcon {
            width: 50%;
            top: 67%;
            right: 24%;
            border-radius: 16px;
        }

        .yemekOnsmProductCardWrapper .yemekOnAddToCartIcon {
            top: 71%;
            right: 20%;
            width: 60%;
        }
    }
    .searchProductB2BInput{
        width:75%
    }

    @media (max-width: 991px) {
        .fourStepsBgImage {
            height: 700px;
        }
        .fourStepsDiv {
            height: 700px;
        }
        .faqAccordion {
            padding-right: 0;
            padding-left: 0;
            height: unset;
        }
        .faqImageDiv > img {
            width: 100%;
        }
        .faqTitle {
            font-size: 25px;
            margin-top: 2rem;
            margin-bottom: 2rem;
        }
        .videoPlayBannerSection {
            align-items: start;
            height: 60vh;
        }
        .videoPlayBannerTitle {
            width:100%;
            margin-top: 3rem;
        }
        .kitchenArticleSliderButton i {
            display: none;
        }
        .dessertNavIcon {
            font-size: 14px;
            color: #c09a2e;
        }
        .dessertFeatureCardImg {
            width: 50%;
        }
        .logoMargin {
            margin-top: 1rem;
        }
        .categoryProductImagesWrapper {
            height: 159px;
        }
        .hoverImageSliderContainer {
            max-width: 250px;
        }
        .leftMidImgAbsolute{
            display:none;
        }
        .rightBottomImgAbsolute {
            display: none;
        }
        .halfTextDesc {
            font-size: 12px;
            -webkit-line-clamp: 6;
        }
        .halfImgWrapper {
            height: 330px;
        }
        .halfTextTitle {
            font: normal normal normal 87px / 162px Mr Canfields Regular;

        }
        .halfImgWrapper {
            padding-left: 50px;
        }
        .halfTextName {
            font-size: 32px;
        }
        .rightTopImgAbsolute {
            height: 30%;
        }
        .productBackground {
            padding: 4rem 2rem 2rem;
        }
        .slotCarousel .owl-prev {
            display: none;
        }
        .slotCarousel .owl-next{
            display: none;
        }
        .sliderImageButton {
            width: 20%;
        }
        .sliderImageText {
            font-size: 13px !important;
        }
        .dessertBanner {
            height: 118vh;
        }
        .dessertBannerImgWrapper {
            padding: 0;
            background-color: unset;
            margin-bottom: 5%;
        }
        .bgUnset .m-mobileHeaderBadgeIcon {
            background-color: white;
            width: 35px;
            height: 35px;
            font-size: 2vw;
        }
        .addressMapIconInsideSpin {
            width: 29px !important;
            height: 23px !important;
            top: 47%;
            left: 47%;
        }

        .mapLocationTextArea {
            top: 40%;
            height: 50px;
            width: 35%;
        }

            .mapLocationTextArea span {
                font: normal normal normal 12px / 21px Rubik;
            }

        .addressMapIconInside {
            transform: translate(-50%, -42%);
            width: 20px !important;
            height: 25px !important;
        }

        .addressMapIcon {
            height: 50px !important;
        }

        .addressMap img {
            height: 400px;
        }

        .searchResultDiv {
            width: 360%;
        }

        .modalFoodImg {
            width: 150px;
            height: 150px;
        }

        .productFormModel {
            min-height: 400px;
        }

        .yemekOnsmProductCardWrapper .yemekOnProductCardWrapper {
            padding: 10px;
        }

        .yemekOnsmProductCardWrapper .yemekOnAddToCartIcon {
            top: 71%;
            right: 27%;
            width: 45%;
        }

        .yemekOnAddToCartIcon {
            width: 53%;
            top: 73%;
            right: 23%;
        }
        .kitchenBoxImg {
            height: 270px;
        }
        .kitchenCarouselImgWrapper {
            height: 75px;
        }
        .kitchenCarouselDiv {
            width: 125px;
            height: 140px;
        }
        .kitchenMonthlyProducts {
            height: 600px;
        }
    }

    @media (min-width: 844px) {

        .yemekOnmbProductHeaderSectionDiv {
            display: none;
        }

        .yemekOnmbProductCardWrapper {
            display: none;
        }
    }

    @media (max-width: 844px) {
        .productOptionBasketButton {
            padding: 1rem;
            font-size: 14px;
        }
        .dessertGalleryImg {
            height:200px;
            max-height: unset;
        }

        .dessertBannerColumn {
            margin-top: 16%;
        }

        .bgUnset .basketPanel {
            box-shadow: unset;
        }

        .bgUnset .dessertNavMenu {
            justify-content: end;
            align-items: end;
        }
            .koseImgWrapper .yemekOnDiscountLabel {
            font-size: 12px;
        }

        .koseImgWrapper .similarProductImg{
            height:150px !important;
        }
        .shadow {
            height: 75%;
            opacity: 0.8;
        }

        .singleCardCarousel .yemekOnRestaurantImg {
            height: 250px !important;
        }

        .koseImgWrapper .yemekOnProductName {
            bottom: 55px;
            font-size:14px;
            width:85%;
        }

        .koseImgWrapper .yemekOnRestaurantImg {
            height: 200px;
        }

        .koseImgWrapper .yemekOnCompanyName {
            left: 15px;
            right: unset;
            font-size:12px;
        }

        .yemekOnProductHeaderWrapper {
            margin: 1rem 0;
            padding: 0.5rem 0;
        }

        .yemekOnCarousel.yemekOnCarouselFixed {
            padding: 0.5rem 0;
        }

        .yemekOnRestaurantProductImg {
            border-radius: 10px;
            object-fit: cover;
        }

        .searchResultDiv {
            border-radius: 0 !important;
            width: 100% !important;
            top: 100%;
            left: 0;
        }

        .searchResults {
            max-height:unset;
            padding-bottom: 100px;
        }

        .unwantedProductButton {
            padding: 5px 10px;
        }

        .yemekOnMbDisplay .productsPanel {
            padding: 0;
        }

        .yemekOnsmProductCardWrapper .yemekOnAddToCartIcon {
            top: 69%;
            right: 22%;
            width: 55%;
        }




        .yemekOnProductBoldandOrangeText {
            height: 29px;
        }



        .yemekOnProductCardWrapper {
            display: none;
        }

        .yemekOnRestaurantAndProductDivWrapper .yemekOnProductCardWrapper {
            display: flex;
        }

        .yemekOnsmProductCardWrapper .yemekOnmbProductCardWrapper {
            display: none;
        }

        .yemekOnRestaurantDiv span {
            font: normal normal normal 11px / 21px Rubik;
        }

        .yemekOnRestaurantDiv .basketPanelRow {
            padding: 0;
        }

        .yemekOnRestaurantDiv .yemekOnRatingContainer {
            margin: 0;
        }

        .yemekOnRestaurantDiv strong {
            font: normal normal bold 12px / 21px Rubik;
            color: #33302E;
        }

        .yemekOnRestaurantDiv {
            flex-direction: column
        }

        .yemekOnProductDiv {
            display: flex;
            margin: 0;
            justify-content: space-between;
            flex-direction: row;
        }



        .yemekOnProductHeaderSectionDiv {
            display: none;
        }

        .yemekOnsmProductCardWrapper:first-child {
            padding-right: 10px;
        }

        .yemekOnsmProductCardWrapper:last-child {
            padding-left: 10px;
        }

        .yemekOnAddToCartIcon {
            width: 45%;
            top: 67%;
            right: 26%;
            border-radius: 24px;
        }

        .searchRestaurantCard .yemekOnCompanyName {
            font: normal normal bold 14px / 26px Rubik;
            white-space: nowrap;
            text-overflow: ellipsis;
        }

        .searchRestaurantCard .yemekOnRestaurantCardDiv {
            font: normal normal normal 14px / 21px Rubik !important;
        }

            .searchRestaurantCard .yemekOnRestaurantCardDiv div:last-child {
                margin-top: 0.5rem;
            }

        .searchRestaurantCard .yemekOnRestaurantImg {
            height: 70px !important;
            width: 70px !important;
        }

        .searchRestaurantCard .yemekOnRestaurantCardDiv span {
            height: 20px;
        }

        .searchRestaurantCard .yemekOnEvaluation {
            font: normal normal bold 16px / 21px Rubik;
        }

        .searchRestaurantCard .yemekOnShippingCostIcon {
            width: 40px;
        }

        .searchResultText {
            font-size: 12px;
        }

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

@media (max-width: 768px) {
    .image-slider .item {
        height: 95px;
        padding: 7px 20px;
        margin: 0 5px;
    }
    .blogImg {
        height: 450px;
    }
    .projects-col-div {
        height: 540px;
    }
    .projectsTitle {
        height: 450px;
    }
    .doubleColor {
        transition: height 0.4s ease;
    }
    .contactAddressIconDiv {
        width: 50px;
        height: 50px;
    }
    .contactAddressIcon {
        margin-top: 3px;
        font-size: 2rem;
        color: #ffffff;
    }
    .faqButton:not(.collapsed)::before {
        content: "-";
        position: absolute;
        left: 5%;
        font-size: 2rem;
    }

    .faqButton.collapsed::before {
        content: "+";
        position: absolute;
        left: 5%;
        font-size: 2rem;
    }

    .faqButtonText {
        margin-left: 2rem;
        text-align: left;
        font-size: 13px;
        line-height: 20px;
        font-weight: bold;
        font-family: "Rajdhani", sans-serif;
        letter-spacing: 0px;
        color: #1c3862;
        opacity: 1;
    }
    .faqContent {
        font-size: 11px;
        margin-left: 2rem;
    }
    .flagImg{
        width:30px;
        height:20px;
    }
    .pieceSaleCard {
        margin-top: 5rem;
        padding: 80px 15px 0 15px;
        border-radius: 15px;
        height: 525px;
    }
    .pieceSaleImg {
        height: 110px;
        width: 166px !important;
    }
    .badgeAbsolute {
        object-fit: cover;
    }
    .fourStepsCardTitle {
        font-size: 16px;
    }
    .fourStepsCardName {
        font-size: 16px;
    }
    .stars {
        font-size: 20px;
    }

    .evaluationProfileDiv {
        padding: 40px 10px 20px 10px;
        height: 280px;
    }
    .marquee-content {
        font-size: 13px;
    }
    .eightItemStatementImage {
        height: 80px;
        margin-bottom: 1rem;
        width:75px !important;
    }
    .eightItemStatementCard:hover {
        transform: translateY(0px);
        box-shadow:unset;
    }
    .videoPlayBannerTitle {
        width:90%;
        margin-top: 0;
    }
    .eightItemStatementTitle {
        font-size: 25px;
        text-align: start;
        width: 100%;
    }
    .contactInputDiv .eightItemStatementTitle {
        text-align:center;
    }
    .eightItemStatementText {
        text-align: start;
        width: 75%;
        margin-bottom: 0 !important;
    }
    .eightItemStatementText p{
        margin-bottom: 0 !important;
    }
    .projects-title {
        font-size: 25px;
    }
    .fourStepsDiv {
        justify-content: center;
        align-items: start;
        height: 350px;
    }
    .fourStepsBgImage {
        height: 350px;
    }
    .about-title {
        font-size: 25px;
    }
    .fourStepsCard {
        margin-top:1rem;
        height: 170px;
        padding: 15px;
    }
    .fourStepsTitle {
        text-align: start;
        font-size: 25px;
        width:65%;
    }
    .halfTextWrapper {
        margin-top: 1rem;
        margin-left: 0rem;
    }
    .halfImage {
        height: 250px;
        width: 100%;
        object-fit: contain;
    }
    .videoPlayBannerTitle {
        font-size: 20px;
        font-weight: 600;
        text-align:center;
    }
    .videoPlayBannerDesc {
        font-size: 13px;
        display: block;
        width: 100%;
        text-align:center;
    }
    .videoPlayBannerSection {
        height: 55vh;
        align-items:flex-start;
        padding-top:1rem;
    }
    .videoPlayVideo {
        height: 70vh;
        object-fit: cover;
    }
    .headerBottomMenuButton {
        height:60px;
        font-size:18px;
        border-radius: 0px;
    }
    .features-card {
       justify-content:start !important;
    }
    .parallaxSection {
        overflow: hidden;
        width: 100%;
        height: 250px;
        background-attachment: unset;
    }
    .addToCartOverlay {
        position: unset;
        opacity: 1;
        margin-top: 1rem;
        transform: unset;
        bottom: unset;
        left: unset;
    }
    .dessertInfoCard:not(:first-child)::before {
        height: 100%;
    }
    .fourRibbonBackgorundImg {
        height: 290px;
    }
    .fourRibbonProductImgWrapper {
        height: 170px;
    }
    .fourRibbonDivCrispy {
        font-size: 55px;
    }
    .dessertInfoCardImgWrapper {
        width: 40px;
        height: 40px;
    }

    .dessertInfoCardContainer {
        padding-top: 2rem;
    }
    .dessertInfoCardTitle {
        font-size: 10px;
        padding: 0.5rem 1rem 0;
    }
    .productDetailBasketDiv .productQuantityRow {
        justify-content: center !important;
    }
    .productDetailBasketDiv .addBasketRow {
        justify-content: center !important;
    }
    .kitchenArticleSliderTitle {
        font-size: 14px;
    }
    .kitchenSectionTitle {
        font-size: 16px;
    }
    .kitchenCarouselDiv{
        margin-bottom:10px;
    }
    .dessertFeatureCard {
        top: -13%;
    }
    .logoMargin {
        margin-top: 0;
    }
    .faqSection {
        width: 100%;
        padding: 1rem 0 3rem;
    }
    .faqQuestion {
        font-size: 11px;
    }
    .faqAnswer {
        font-size: 11px;
    }
    .hoverImageSliderContainer {
        max-width: 200px;
    }
    .halfImgWrapper::before {
        width: 100%;
        top: 5%;
        left: 8%;
    }
    .halfTextTitle {
        font: normal normal normal 68px / 162px Mr Canfields Regular;
    }
    .halfTextName {
        font-size: 20px;
        padding-left: 2rem;
    }
    .halfImgWrapper {
        padding-left: 0;
        height: 300px;
    }
    .imgBackgroundText {
        top: 27%;
    }
    .imageInsideText {
        line-height: 24px;
    }
    .kolboregi3 {
        top: 26%;
    }
    .kolboregi8 {
        top: 42%;
    }
    .kolboregi9 {
        top: 26%;
    }
    .kolboregi10 {
        top: 42%;
    }
    .kolboregi11 {
        top: 62%;
    }
    .katmer1 {
        top: 66%;
    }
    .imgBackground {
        height: 75vh;
    }

    .imageInsideTitle {
        font-size: 20px !important;
    }
        .kitchenArticleSliderDiv {
         transform: translateY(0);
        }
        .invisibleDotsOnMobile .owl-theme .owl-nav.disabled + .owl-dots {
           display: none;
        }
        .kitchenBoxImg{
           display:none;
        }
        .kitchenCarouselImgWrapper {
            height: 65px;
        }
        .dessertOverlayText{
            font-size: 20px !important;
        }
        .dessertOverlay {
            height: 90px;
        }
        .dessertOverlayImg {
            height: 90px;
        }
        .dessertBannerColumn {
            margin-top: 9%;
        }
        .dessertBanner {
        height: 113vh;
        }
        .dessertBannerImgWrapper {
            max-width: 45%;
        }
        .yemekOnScroll .basketPanelRow .radioAsCheckbox + label:before {
            top: -2px !important;
        }

        .yemekOnProductCardDiv .productOptionDiv {
            padding: 0;
        }

        .pageContainer .productsPanel {
            padding: 0rem;
        }

        .yemekOnsmProductCardWrapper .yemekOnProductCardWrapper {
            padding: 5px;
        }

        .yemekOnmbAddToCartIcon {
            width: 13%;
        }

        .yemekOnsmProductCardWrapper .yemekOnProductImg {
            height: 75px
        }

        .yemekOnsmProductCardWrapper .yemekOnAddToCartIcon {
            top: 70%;
            right: 38%;
            width: 24%;
        }

        .yemekOnsmProductCardWrapper:first-child {
            padding-right: 10px;
        }

        .yemekOnsmProductCardWrapper:last-child {
            padding-left: 10px;
        }

        .yemekOnAddToCartIcon {
            width: 50%;
            top: 71%;
            right: 23%;
            border-radius: 24px;
        }
        .kitchenArticleSliderDetails {
            font: normal normal normal 10px / 23px Rubik;
        }
    }


    @media (max-width: 576px) {
        .kitchenMonthlyProducts {
            height: 630px;
        }
        .rightImgTop {
            width: 70%;
            margin-top: -62px;
            margin-left: 122px;
            margin-bottom: 35px;
        }
        .dessertGalleryColumn {
            max-height: unset;
            height: 200px;
        }
        .dessertFeatureCard {
            top: 5%;
        }
        .m-imgBackground {
            width: 100%;
            height: 80vh;
        }

        .m-kolboregi8 {
            left: -15%;
            top: 50%;
            width: 60%;
        }

        .m-kolboregi9 {
            right: -20%;
            top: 50%;
            width: 60%;
        }

        .m-kolboregi11 {
            right: 29%;
            top: 64%;
            width: 40%;
        }

        .m-suboregitepsi {
            width: 300px;
        }

        .m-imgBackgroundText {
            left: 13%;
            top: 32%;
            width: 75%;
        }
        .m-videoSectionItalicText {
            bottom: 25%;
        }
        .m-dessertBannerDesc {
            padding-right: 1rem;
            padding-left: 1rem;
        }

        .addressMapIconInsideSpin {
            width: 31px !important;
            top: 46%;
        }

        .addressMapIconInside {
            transform: translate(-50%, -46%);
        }

        .mapLocationTextArea {
            top: 38%;
            width: 44%;
        }

        .addressMap img {
            height: 350px;
        }

        .searchResultText {
            width: 60%;
        }

        .yemekOnsmProductCardWrapper .yemekOnAddToCartIcon {
            top: 64%;
            right: 33%;
            width: 33%;
        }

        .yemekOnmbAddToCartIcon {
            width: 18%;
        }

        .basketPanelColumn {
            margin: 0;
        }

        .kitchenCarouselDiv {
            width: 120px;
            height: 125px;
        }
        .kitchenCarouselImgWrapper {
            height: 45px;
        }
        .yemekOnAddToCartIcon {
            width: 45%;
            top: 72%;
            right: 28%;
            border-radius: 24px;
        }
    }
@media (max-width: 450px) {
    .projectsTitle {
        height: 300px;
    }
    .videoPlayBannerDesc {
        width: 100%;
    }
    .fourRibbonProductCard {
        border-top: 3px solid #D8CF82;
        border-left: 3px solid #D8CF82;
        border-right: 3px solid #D8CF82;
    }
        .fourRibbonProductCard:after {
            left: -3px;
            width: 103.5%;
            top: 99%;
        }
    .kitchenSectionHeader {
        padding: 20px 10px 20px;
    }
         .m-suboregitepsi {
            width: 300px;
         }
        .dessertFeatureCardWrapper {
            padding-bottom: 12rem;
        }
        .dessertFeatureCard {
            top: -13%;
        }
        .dessertBanner {
            height: 105vh;
        }
        .m-imgBackground {
            width: 100%;
            height: 80vh;
        }
    }
    @media (max-width: 400px) {
        .kitchenMonthlyProducts {
            height: 590px;
        }
        .kitchenCarouselDiv {
            width: 110px;
            height: 125px;
        }
        .dessertBanner {
            height: 109vh;
        }
        .m-imgBackground {
            height: 67vh;
        }
        .m-kolboregi8 {
            left: -5%;
            top: 55%;
            width: 50%;
        }
        .m-imgBackgroundText {
            left: 13%;
            top: 29%;
            width: 75%;
        }
        .m-kolboregi11 {
            right: 31%;
            top: 65%;
            width: 40%;
        }
        .m-kolboregi9 {
            right: -5%;
            top: 55%;
            width: 50%;
        }
        .m-suboregitepsi {
            width: 250px;
        }
        .dessertBannerImgWrapper {
            max-width: 60%;
        }
        .dessertBannerColumn {
            margin-top: 11%;
        }

        .chanceTabTitle {
            font-size: 12px;
        }
        .yemekOnmbAddToCartIcon {
            width: 20%;
        }

        .searchResultText {
            font-size: 10px;
            width: 60%;
        }

        .searchResultImg {
            width: 45px;
            height: 45px;
        }

        .searchResultPrice {
            width:75px;
            font-size: 10px;
        }

        .searchRestaurantCard .yemekOnCompanyName {
            font: normal normal bold 12px / 26px Rubik !important;
        }

        .searchRestaurantCard .yemekOnRestaurantCardDiv {
            font: normal normal normal 13px / 21px Rubik !important;
        }

        .searchRestaurantCard .yemekOnEvaluation {
            font: normal normal bold 15px / 21px Rubik !important;
        }

        .searchRestaurantCard .yemekOnRestaurantImg {
            height: 45px !important;
            width: 45px !important;
        }

        .searchRestaurantCard .yemekOnShippingCostIcon {
            width: 30px;
            height: 30px;
        }

        .basketPanelRow .yemekOnRestaurantIcon {
            width: 16px;
            height: 15px;
        }

        .yemekOnProductCardWrapperDiv .yemekOnRatingContainer {
            align-items: unset;
        }

        .yemekOnAddToCartIcon {
            top: 72%;
        }

        .yemekOnsmProductCardWrapper .yemekOnAddToCartIcon {
            top: 69%;
            right: 28%;
            width: 42%;
        }
    }
    /*@media (min-width: 1400px) {
    .container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
        max-width: 1200px;
    }
}*/

        .footer-section-wrapper {
    max-height: 200px;
    overflow-y: scroll;
    scrollbar-width: none;
    -ms-overflow-style: none;
}

    .footer-section-wrapper::-webkit-scrollbar {
        display: none;
    }
/* Mobil */
@media (max-width: 768px) {
    #searchProductInput {
        display: none;
    }
}

/* Web */
@media (min-width: 769px) {
    #mobileSearchForm {
        display: none;
    }
}

    #languageButtons.hide {
        display: none;
    }

.articlePageTitle {
    font-size: 38px;
    font-weight: bold;
    opacity: 1;
    letter-spacing: 0px;
    text-align: center;
}
.articleDetailPanel {
    border-radius: 30px;
    min-height: 200px;
    background-color: #fff;
    padding: 2.5rem 5rem;
}

.articleImageWrapper {
    width: 100%;
    overflow: hidden;
}

.articleImage {
    width: 100%;
    height: 250px;
    object-fit: cover;
    transition: transform 1s ease;
}

.articleContentWrapper {
    border: 1px solid #707070;
    margin-top: -1px;
    padding: 15px;
}

.articleHeader {
    line-height: 18px;
    font-size: 16px;
    font-weight: bold;
    color: #003C57;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    height: 42px;
}

.articleText {
    line-height: 18px;
    font-size: 14px;
    color: #00253B;
    margin-bottom: 15px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    height: 36px;
}

.articleReadMore {
    padding: 0 10px;
    display: flex;
    border: 1px solid #004868;
    align-items: center;
    height: 35px;
}

.article:hover .articleImage {
    transition: transform 1s ease;
    transform: scale(1.1);
}

.article:hover .articleReadMore {
    background-color: #004868;
}

    .article:hover .articleReadMore a {
        color: white;
    }

.articleReadMore a {
    font-size: 14px;
    color: #004868;
    text-decoration: none;
    font-weight: normal;
}

.articleDateWrapper {
    display: flex;
    justify-content: space-between;
    align-items: end;
    margin-top: 10px;
    text-align: right;
}

.articleDate .dateText {
    font-size: 12px;
    color: #6E6E6E;
}

@media (max-width: 768px) {
    .articlePageTitle {
        font-size: 25px;
    }
    .articleContentWrapper {
        padding: 10px;
    }

    .articleHeader {
        height: 45px;
    }


    .articleImage {
        width: 100%;
        height: 150px;
        object-fit: cover;
    }

    .articleDateWrapper {
        margin: 0 0 5px 0;
        text-align: left;
    }
}