/*
Theme Name: Raftari theme
Theme URI: https://www.hidokmeh.com/
Author: Dokmeh Agency
Author URI: https://www.hidokmeh.com/
Description: Raftari kebab theme
Text Domain: dokmeh
* Prefixed by https://autoprefixer.github.io
* PostCSS: v8.4.14,
* Autoprefixer: v10.4.7
* Browsers: last 4 version
*/
/*
* Prefixed by https://autoprefixer.github.io
* PostCSS: v8.4.14,
* Autoprefixer: v10.4.7
* Browsers: last 4 version
*/

/*================FONTS===============*/
html,body,p,span,a,ul li,ol li,textarea,input,h1,h2,h3,h4,h5,h6{
    font-family: 'Doran NoEn',serif;
}
/*================FONTS===============*/
/*============GENERAL CLASS==============*/
/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */button,hr,input{overflow:visible}progress,sub,sup{vertical-align:baseline}[type=checkbox],[type=radio],legend{-webkit-box-sizing:border-box;box-sizing:border-box;padding:0}html{line-height:1.15;-webkit-text-size-adjust:100%}body{margin:0}details,main{display:block}h1{font-size:2em;margin:.67em 0}hr{-webkit-box-sizing:content-box;box-sizing:content-box;height:0}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted}b,strong{font-weight:bolder}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:ButtonText dotted 1px}fieldset{padding:.35em .75em .625em}legend{color:inherit;display:table;max-width:100%;white-space:normal}textarea{overflow:auto}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}[hidden],template{display:none}
:root {
    --white:#fff;
    --black:#000;
    --darkColor: #383838;
    --backColorDark: #1c1c1c;
    --primary: #fff1e2;
    --lightBlue:#F3F9FA;
    --background-color:#13B7CE1A;
    --brown:#602d2c;
    --darkBrown: #411919;
    --lightBrown: #F9E8D5;
    --darkBlue:#40727A;
    --spaceX:2.5rem;
    --spaceXX: 10vw;
    --headerHeight:6rem;
    --doranFont:'Doran NoEn';
    --border-color: rgba(96,45,44,.6);
}
body{
    color: var(--brown);
    background-color: var(--primary);
}
body:before {
    /*content: '';*/
    /*position: absolute;*/
    /*top: 0;*/
    /*left: 0;*/
    /*width: 100%;*/
    /*height: 100%;*/
    /*background-color: #13B7CE1A;*/
    /*z-index: 1;*/
}
.blur-up {
    -webkit-filter: blur(5px);
    filter: blur(5px);
    transition: filter 0.4s, -webkit-filter 0.4s;
}
.blur-up.lazyloaded {
    -webkit-filter: blur(0);
    filter: blur(0);
}
main {
    /*padding-top: 14rem;*/
    padding-top: calc(var(--headerHeight) + 2rem)
}
body[data-pageType=home] main ,
body[data-pageType=foodSingle] main {
    padding-top: 0;
}
.paddingX{
    padding-right: var(--spaceX);
    padding-left: var(--spaceX);
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}
.paddingXX{
    padding-right: var(--spaceXX);
    padding-left: var(--spaceXX);
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}
form input:focus-visible,form input:focus {
    border: none;
    outline: none;
}
*, ::after, ::before {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    position: relative;
}
*:focus,*:focus-visible{
    outline: none !important;
}
a,a:hover {
    color: inherit;
    text-decoration: none;
}
html::-webkit-scrollbar {
    width: 6px;
}
html::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px var(--white);
    box-shadow: inset 0 0 6px var(--white);
}
html::-webkit-scrollbar-thumb {
    background-color: var(--brown);
    outline: 1px solid var(--brown);
    border-radius: 10px;
}
::-moz-selection {
    background-color: var(--brown);
    color: var(--white);
}
::selection {
    background-color: var(--brown);
    color: var(--white);
}
hr {
    margin: 1rem 0;
    color: inherit;
    border: 0;
    border-top: 1px solid;
    opacity: 0.25;
}
.h1,
.h2,
.h3,
.h4,
.h5,
.h6,
h1,
h2,
h3,
h4,
h5,
h6 {
    margin-top: 0;
    margin-bottom: 0.5rem;
}
.h1,
h1 {
    font-size: calc(1.375rem + 1.5vw);
}
@media (min-width: 1200px) {
    .h1,
    h1 {
        font-size: 2.5rem;
    }
}
.h2,
h2 {
    font-size: calc(1.325rem + 0.9vw);
}
@media (min-width: 1200px) {
    .h2,
    h2 {
        font-size: 2rem;
    }
}
.h3,
h3 {
    font-size: calc(1.3rem + 0.6vw);
}
@media (min-width: 1200px) {
    .h3,
    h3 {
        font-size: 1.75rem;
    }
}
.h4,
h4 {
    font-size: calc(1.275rem + 0.3vw);
}
@media (min-width: 1200px) {
    .h4,
    h4 {
        font-size: 1.5rem;
    }
}
.h5,
h5 {
    font-size: 1.25rem;
}
.h6,
h6 {
    font-size: 1rem;
}
p {
    margin-top: 0;
    margin-bottom: 0;
}
ol,
ul {
    padding-left: 2rem;
}
dl,
ol,
ul {
    margin-top: 0;
    margin-bottom: 1rem;
}
ol ol,
ol ul,
ul ol,
ul ul {
    margin-bottom: 0;
}
textarea{
    resize: none;
}

.h1,
.h2,
.h3,
.h4,
.h5,
.h6,
h1,
h2,
h3,
h4,
h5,
h6 {
    font-weight: 600;
    line-height: 1.2;
}
.h1,
h1 {
    font-size: calc(1.375rem + 1.5vw);
}
@media (min-width: 1200px) {
    .h1,
    h1 {
        font-size: 2.5rem;
    }
}
.h2,
h2 {
    font-size: calc(1.325rem + 0.9vw);
}
@media (min-width: 1200px) {
    .h2,
    h2 {
        font-size: 2rem;
    }
}
.h3,
h3 {
    font-size: calc(1.3rem + 0.6vw);
}
@media (min-width: 1200px) {
    .h3,
    h3 {
        font-size: 1.75rem;
    }
}
.h4,
h4 {
    font-size: calc(1.275rem + 0.3vw);
}
@media (min-width: 1200px) {
    .h4,
    h4 {
        font-size: 1.5rem;
    }
}
.h5,
h5 {
    font-size: 1.25rem;
}
.h6,
h6 {
    font-size: 1rem;
}

*::-webkit-media-controls-panel {
    display: none!important;
    -webkit-appearance: none !important;
}
*::-webkit-media-controls-start-playback-button {
    display: none!important;
    -webkit-appearance: none !important;
}
*::-webkit-media-controls {
    display:none !important;
    -webkit-appearance: none !important;
}
*::-webkit-media-controls-overlay-play-button {
    display: none !important;
    -webkit-appearance: none !important;
}
*::-webkit-media-controls-enclosure {
    display:none !important;
    -webkit-appearance: none !important;
}
html.lenis {
    height: auto;
}

.lenis.lenis-smooth {
    scroll-behavior: auto !important;
}

.lenis.lenis-smooth [data-lenis-prevent] {
    -ms-scroll-chaining: none;
    overscroll-behavior: contain;
}

.lenis.lenis-stopped {
    overflow: hidden;
}

.lenis.lenis-scrolling iframe {
    pointer-events: none;
}
main.wrapper {
    padding-bottom: 5rem;
    -webkit-transition: all ease-in-out .3s;
    -o-transition: all ease-in-out .3s;
    transition: all ease-in-out .3s;
}
body[data-pagetype="food"] main.wrapper ,
body[data-pagetype="foodSingle"] main.wrapper {
    padding-bottom: 1rem;
}
.gm-style > div {
    position: static;
}
/*============GENERAL CLASS==============*/
/*=============#equalizerIcon============*/
#equalizerIcon,#equalizerIconMute {
    position: fixed;
    bottom: 0;
    margin: var(--spaceX);
    z-index: 98;
    left: 0;
    cursor: pointer;
    -webkit-transition: all ease-in-out .4s;
    -o-transition: all ease-in-out .4s;
    transition: all ease-in-out .4s;
    opacity: 0;
    pointer-events: none;
    mix-blend-mode: difference;
}
#equalizerIcon img{
    width: 2.625rem;
    height: 2.0625rem;
    -o-object-fit: contain;
    object-fit: contain;
}
#equalizerIcon span,#equalizerIconMute span{
    display: inline-block;
    width: 1.5px;
    height: 32px;
    background-color: var(--white);
    margin: 0 2px;
    -webkit-transform-origin: center;
    -ms-transform-origin: center;
    transform-origin: center;
    border-radius: 32px;
    pointer-events: none;
}
#equalizerIcon span:nth-child(3n+1),#equalizerIconMute span:nth-child(3n+1){
    -webkit-transform: scaleY(.4);
    -ms-transform: scaleY(.4);
    transform: scaleY(.4);
    -webkit-animation: equalizerAnimation-first 1s infinite alternate;
    animation: equalizerAnimation-first 1s infinite alternate;
}
#equalizerIcon span:nth-child(3n+2),#equalizerIconMute span:nth-child(3n+2){
    -webkit-transform: scaleY(1.2);
    -ms-transform: scaleY(1.2);
    transform: scaleY(1.2);
    -webkit-animation: equalizerAnimation-second 1s infinite alternate;
    animation: equalizerAnimation-second 1s infinite alternate;
}
#equalizerIcon span:nth-child(3n+3),#equalizerIconMute span:nth-child(3n+3){
    -webkit-transform: scaleY(.8);
    -ms-transform: scaleY(.8);
    transform: scaleY(.8);
    -webkit-animation: equalizerAnimation-third 1s infinite alternate;
    animation: equalizerAnimation-third 1s infinite alternate;
}
@-webkit-keyframes equalizerAnimation-first {
    0% {
        -webkit-transform: scaleY(.8);
        transform: scaleY(.8);
    }
    50% {
        -webkit-transform: scaleY(1);
        transform: scaleY(1);
    }
    100% {
        -webkit-transform: scaleY(.8);
        transform: scaleY(.8);
    }
}
@keyframes equalizerAnimation-first {
    0% {
        -webkit-transform: scaleY(.8);
        transform: scaleY(.8);
    }
    50% {
        -webkit-transform: scaleY(1);
        transform: scaleY(1);
    }
    100% {
        -webkit-transform: scaleY(.8);
        transform: scaleY(.8);
    }
}
@-webkit-keyframes equalizerAnimation-second {
    0% {
        -webkit-transform: scaleY(1);
        transform: scaleY(1);
    }
    50% {
        -webkit-transform: scaleY(.5);
        transform: scaleY(.5);
    }
    100% {
        -webkit-transform: scaleY(1);
        transform: scaleY(1);
    }
}
@keyframes equalizerAnimation-second {
    0% {
        -webkit-transform: scaleY(1);
        transform: scaleY(1);
    }
    50% {
        -webkit-transform: scaleY(.5);
        transform: scaleY(.5);
    }
    100% {
        -webkit-transform: scaleY(1);
        transform: scaleY(1);
    }
}
@-webkit-keyframes equalizerAnimation-third {
    0% {
        -webkit-transform: scaleY(.4);
        transform: scaleY(.4);
    }
    50% {
        -webkit-transform: scaleY(1.2);
        transform: scaleY(1.2);
    }
    100% {
        -webkit-transform: scaleY(.4);
        transform: scaleY(.4);
    }
}
@keyframes equalizerAnimation-third {
    0% {
        -webkit-transform: scaleY(.4);
        transform: scaleY(.4);
    }
    50% {
        -webkit-transform: scaleY(1.2);
        transform: scaleY(1.2);
    }
    100% {
        -webkit-transform: scaleY(.4);
        transform: scaleY(.4);
    }
}
#equalizerIcon.mute span,#equalizerIconMute.mute span {
    -webkit-animation-play-state: paused;
    animation-play-state: paused;
    opacity: .5;
}
#equalizerIcon.enter,#equalizerIconMute.enter {
    opacity: 1;
    pointer-events: auto;
}
#equalizerIcon.hide {
    opacity: 0;
    pointer-events: none;
}

#equalizerIconMute.mute {
    opacity: .3;
}
#equalizerIconMute.enter.exit {
    opacity: 0;
    pointer-events: none;
}
html.hideEqualizer #equalizerIcon,html.hideEqualizer #equalizerIconMute {
    display: none;
}
/*=============#equalizerIcon============*/
/*=============#socialMedia============*/
#socialMedia {
    position: fixed;
    bottom: 0;
    margin: var(--spaceX);
    z-index: 99;
    right: 0;
    cursor: pointer;
}
#socialMedia img{
    width: 2rem;
    height: 2rem;
    -o-object-fit: contain;
    object-fit: contain;
}
/*=============#socialMedia============*/
/*=============#scroll ============*/
#scroll {
    position: fixed;
    bottom: 0;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    z-index: 98;
    margin-bottom: 2rem;
    mix-blend-mode: difference;
    -webkit-transition: all ease-in-out .4s;
    -o-transition: all ease-in-out .4s;
    transition: all ease-in-out .4s;
    display: flex;
    flex-direction: column;
    align-items: center;
    row-gap: .75rem;
}
#scroll.hide {
    opacity: 0;
}
#scroll span {
    display: inline-block;
    color: var(--brown);
    font-size: 0.875rem;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
}
#scroll .line {
    width: 2px;
    height: 70px;
    background-color: var(--brown);
    margin: 0 auto 1rem;
    overflow: hidden;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}

#scroll .line:after {
    content: '';
    position: absolute;
    top: 0;
    left: -2px;
    width: 5px;
    height: 15px;
    background-color: var(--black);
    -webkit-animation: scrolldown 1.5s linear forwards infinite;
    animation: scrolldown 1.5s linear forwards infinite;
}
@-webkit-keyframes scrolldown {
    0% {
        top: 0;
    }
    100% {
        top:calc(100% + 10px)
    }
}
@keyframes scrolldown {
    0% {
        top: 0;
    }
    100% {
        top:calc(100% + 10px)
    }
}
body[data-pagetype="foodSingle"] #scroll {
    position: absolute;
    z-index: 1;
    mix-blend-mode: normal;
}
.responsive-scroll {
    position: relative;
    display: flex;
    justify-content: center;
    width: 32px;
    height: 45px;
    transition: all 450ms ease;
    border: var(--brown) 2px solid;
    border-radius: 20px;
}

body[data-pagetype='home'] #scroll {
    display: flex;
    flex-direction: column;
    align-items: center;
    row-gap: .55rem;
    left: auto;
    right: var(--spaceX);
    transform: none;
    mix-blend-mode: normal;
}

.responsive-scroll span {
    display: block;
    width: 5px;
    transition: all 450ms ease;
    height: 5px;
    margin-top: 18%;
    border-radius: 1000px;
    background-color: var(--brown);
    transform: translatex(0px) rotate(0deg);
    -webkit-animation: responsive-scroll infinite 2250ms;
    animation: responsive-scroll infinite 2250ms;
}
@keyframes responsive-scroll {
    0% {
        margin-top: 25%;
        opacity: 0;
    }
    33% {
        margin-top: 36.55%;
        opacity: 1;
    }
    100% {
        margin-top: 60%;
        opacity: 0;
    }
}
/*=============#scroll ============*/
/*==================#lineContainer==================*/
#lineContainer {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    z-index: 0;
    background-image: url(./assets/img/lines.png);
    background-repeat: repeat;
    background-size: cover;
}
/*==================#lineContainer==================*/
/*==================R E S P O N S I V E==================*/
@media only screen and (max-width: 768px){
    /*============GENERAL CLASS==============*/
    :root {
        --spaceXX: 20px;
        --spaceX: 20px;
        --headerHeight: 4.5rem;
    }
    main {
        padding-top: calc(var(--headerHeight) + 1rem);
    }
    main.wrapper {
        padding-bottom: 3rem;
    }
    /*============GENERAL CLASS==============*/
    #scroll {
        margin-bottom: 1rem;
    }
    #scroll .line {
        width: 1px;
        height: 40px;
        margin: 0 auto .4rem;
    }
    #scroll span {
        font-size: 10px;
    }
    #equalizerIcon span, #equalizerIconMute span {
        width: 1px;
        height: 25px;
    }
    body[data-pagetype='home'] #scroll {
        right: auto;
        left: 50%;
        transform: translateX(-50%);
        display: none;
    }

    .responsive-scroll {
        width: 26px;
        height: 33px;
        border-radius: 12px;
    }

    .responsive-scroll span {
        margin-top: 10%;
    }
}
@media only screen and (min-width: 640px) and (max-width: 768px){}
@media only screen and (min-width: 769px) and (max-width: 1199px){
    /*=============GENERAL CLASS=============*/
    :root {
        --spaceXX: 5vw;
        --headerHeight: 8rem;
    }
    #scroll {
        margin-bottom: 1rem;
    }
    #scroll .line {
        width: 1px;
        height: 50px;
        margin: 0 auto .5rem;
    }
    #scroll span {
        font-size: 0.775rem;
    }
    section.branchMapContainer h2 {
        font-size: 3.96131rem;
    }
    /*=============GENERAL CLASS=============*/
}
@media only screen and (min-width: 1200px) and (max-width: 1400px){
    /*=============GENERAL CLASS=============*/
    :root {
        --spaceX: 2rem;
        --headerHeight: 5.5rem;
    }

    #scroll {
        margin-bottom: 1rem;
    }

    #scroll .line:after {
        width: 3px;
        height: 13px;
    }

    #scroll .line {
        height: 54px;
        margin: 0 auto .4rem;
        width: 1px;
    }
    #scroll span {
        font-size: 0.675rem;
    }
    #equalizerIcon span, #equalizerIconMute span {
        width: .5px;
        height: 24px;
    }
    /*=============GENERAL CLASS=============*/
}
@media only screen and (min-width: 1401px) and (max-width: 1600px){
    /*=============GENERAL CLASS=============*/
    :root {
        --spaceX: 2rem;
        --headerHeight: 5.5rem;
    }
    #scroll {
        margin-bottom: 1rem;
    }

    #scroll .line:after {
        width: 3px;
        height: 13px;
    }

    #scroll .line {
        height: 54px;
        margin: 0 auto .4rem;
        width: 1px;
    }
    #scroll span {
        font-size: 0.675rem;
    }
    #equalizerIcon span, #equalizerIconMute span {
        width: .5px;
        height: 24px;
    }
    /*=============GENERAL CLASS=============*/
}