body{background-color:#2b3034;}


#qrloading{display:none;position:absolute;z-index:1000;left:0;top:0;width:100%;height:100%;background-color:rgba(0,0,0,0.5);}
#qrloading img{position:absolute;z-index:1;left:50%;top:50%;width:60px;height:auto;transform:translate(-50%,-50%);}


#qr{
    position:relative;
    width:800px;max-width:100%;height:100svh;margin:0 auto;box-sizing:border-box;
    overflow:hidden;
}
#qr:before{
    content:"";position:absolute;z-index:-2;left:0;top:0;width:100%;height:100%;background-color:#adb383;
}


#loader{
    position:absolute;z-index:2000;left:0;top:0;width:100%;height:100%;
    background-color:#adb383;
    transition:transform 1s;
}
#loader .loading{
    position:absolute;z-index:1;left:50%;top:50%;width:90px;height:50px;object-fit:contain;transform:translate(-50%,-50%);
}
#loader .inner{
    position:absolute;z-index:2;left:50%;top:50%;width:500vw;max-width:70%;aspect-ratio:70/36;transform:translate(-50%,-50%);
}
#loader .inner img{
    position:absolute;z-index:1000;left:0;top:0;width:100%;height:100%;object-fit:cover;
    opacity:0;scale:0;
}

#loader.hidden .loading{transition:opacity 300ms;opacity:0;}
#loader.hidden .inner img.load1{transition:all 300ms;transition-delay:750ms;}
#loader.hidden .inner img.load4{transition:all 300ms;transition-delay:450ms;}
#loader.hidden .inner img.load5{transition:all 300ms;transition-delay:300ms;}
#loader.hidden .inner img.load3{transition:all 300ms;transition-delay:600ms;}
#loader.hidden .inner img.loado{transition:all 300ms;transition-delay:900ms;}
#loader.hidden .inner img{opacity:1;scale:1;}
#loader.hidden{pointer-events:none;opacity:0;scale:2;transition:all 700ms;transition-delay:2000ms;}


.qrpage{
    position:absolute;z-index:1;left:0;top:0;width:100%;height:100%;overflow:auto;
    transform:translate(100%,0);transition:transform 1s;
}
.qrpage.selected{z-index:2;transform:translate(0,0);}
.qrpage#home{background:#adb383;}/*adb383*/
.qrpage#kategoriler{background:#aaa;}
.qrpage#urunler{background:#555;}
.qrpage#alerjenler{background:#555;}


#qrlanguages{
    position:absolute;z-index:80;right:12px;top:12px;
    display:flex;gap:6px;
}
#qrlanguages a{
    display:inline-block;min-width:42px;padding:6px 10px;text-align:center;
    background:rgba(0,0,0,0.45);color:#fff;border-radius:16px;
    font-family:'poppins_semibold',sans-serif;font-size:0.85rem;letter-spacing:1px;
}
#qrlanguages a.selected{background:#adb383;color:#222;}

#home .homegrids.alerjenhome{background:#6a6f72;}
#home .homegrids.alerjenhome .text i{display:block;margin:0 0 6px 0;font-size:1.4rem;}
#home.butonsayi4 .homegrid{grid-template-rows:repeat(4,1fr);}


#home{}
#home.butonsayi2{}
#home.butonsayi3{}
#home .homegrid{
    display:grid;
    grid-template-columns:1fr;
    grid-template-rows:1fr 1fr 1fr;gap:3px;
    min-height:100svh;
}
#home.butonsayi2 .homegrid{grid-template-rows:1fr 1fr;}
#home.butonsayi3 .homegrid{grid-template-rows:repeat(3,1fr);}
#home .homegrids{position:relative;z-index:1;text-align:center;}
#home .homegrids{}
#home .homegrids:before{
    content:"";position:absolute;z-index:-2;left:0;top:0;width:100%;height:100%;background-color:#000;
}
#home .homegrids img{
    position:absolute;z-index:-1;left:0;top:0;width:100%;height:100%;object-fit:cover;
    opacity:0.5;
}
#home .homegrids .inner{
    height:100%;display:flex;justify-content:center;align-items:center;
}
#home .homegrids .text{
    width:80%;margin:0 auto;padding:10px 0;
    /*background:rgba(0,0,0,0.55);*/
    background:rgb(173 179 131 / 60%);
    color:#fff;border-radius:20px;
    font-family:'ivymode_semibold';font-size:1.5rem;letter-spacing:2px;
}


#kategoriler{}
#kategoriler .head44{text-align:center;}
#kategoriler .head44 .grid{display:grid;grid-template-columns:1fr 1fr 1fr;}
#kategoriler .head44 .grid .s{padding:15px 5px;}
#kategoriler .head44 .grid .s.s1{background-color:#6a6f72;color:#fff;}
#kategoriler .head44 .grid .s.s2{background-color:#adb383;}
#kategoriler .head44 .grid .s.s2 img{max-width:25vw;max-height:60px;object-fit:contain;}
#kategoriler .head44 .grid .s.s3{background-color:#6a6f72;color:#fff;}
#kategoriler .head44 .grid .s .flex{display:flex;justify-content:center;align-items:center;height:100%;}
#kategoriler .head44 .grid .s .flex .inner{}
#kategoriler .head44 .grid .s .flex .inner .menu{}
#kategoriler .head44 .grid .s .flex .inner .menu .icon{display:block;font-size:1.7rem;}
#kategoriler .head44 .grid .s .flex .inner .aktiftip{}
#kategoriler .head44 .grid .s .flex .inner .aktiftip .text{display:block;font-size:0.8rem;}
#kategoriler .head44 .grid .s .flex .inner .aktiftip .icon{display:block;font-size:1.3rem;}
#kategoriler .list{}
#kategoriler .list a{
    position:relative;display:block;padding:15vh 15px;
    text-align:center;color:#fff;
    font-family:'poppins_semibold';font-size:1.8rem;letter-spacing:2px;
    /*
    padding: 120px 0;
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    */
}
#kategoriler .list a:before{
    content:"";position:absolute;z-index:-1;left:0;top:0;width:100%;height:100%;background-color:#000;opacity:0.6;
}
#kategoriler .list a .text{
    
}




#urunler{}
#urunler .head77{text-align:center;}
#urunler .head77 .grid{display:grid;grid-template-columns:1fr 1fr 1fr;}
#urunler .head77 .grid .s{padding:15px 5px;}
#urunler .head77 .grid .s.s1{background-color:#6a6f72;color:#fff;}
#urunler .head77 .grid .s.s2{background-color:#adb383;}
#urunler .head77 .grid .s.s2 img{max-width:25vw;max-height:60px;object-fit:contain;}
#urunler .head77 .grid .s.s3{background-color:#6a6f72;color:#fff;}
#urunler .head77 .grid .s .flex{display:flex;justify-content:center;align-items:center;height:100%;}
#urunler .head77 .grid .s .flex .inner{}
#urunler .head77 .grid .s .flex .inner .menu{}
#urunler .head77 .grid .s .flex .inner .menu .icon{display:block;font-size:1.7rem;}
#urunler .head77 .grid .s .flex .inner .aktiftip{}
#urunler .head77 .grid .s .flex .inner .aktiftip .text{display:block;font-size:0.8rem;}
#urunler .head77 .grid .s .flex .inner .aktiftip .icon{display:block;font-size:1.3rem;}
#urunler .list{}
#urunler .list a{
    position:relative;display:block;padding:13vh 15px;
    text-align:center;color:#fff;
    font-family:'ivymode_semibold';font-size:1.8rem;letter-spacing:2px;
    /*
    padding: 120px 0;
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    */
}
#urunler .list a:before{
    content:"";position:absolute;z-index:-1;left:0;top:0;width:100%;height:100%;background-color:#000;opacity:0.6;
}
#urunler .list{padding:0 15px;margin:20px 0 0 0;}

#urunler .list .item{
    padding:15px;margin:0 0 15px 0;background-color:#adb383;color:#fff;
    border-radius:10px;
}
#urunler .list .item .im{position:relative;z-index:1;margin:0 0 10px 0;border-radius:16px;aspect-ratio:6 / 3;overflow:hidden;
    box-shadow:0 0 7px 0 #000;
}
#urunler .list .item .im img{position:absolute;z-index:1;left:0;top:0;width:100%;height:100%;object-fit:cover;}
#urunler .list .item .nameprice{display:flex;justify-content:space-between;align-items:baseline;gap:12px;}
#urunler .list .item .name{font-size:1.4rem;font-family:'poppins_semibold';flex:1;}
#urunler .list .item .price{font-size:1.3rem;font-family:'poppins_semibold';text-align:right;white-space:nowrap;}
#urunler .list .item .kcal{margin:4px 0 0 0;font-size:0.95rem;opacity:0.92;letter-spacing:0.3px;}
#urunler .list .item .info{margin:5px 0 0 0;}
#urunler .list .item .allergenicons{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0 0 0;}
#urunler .list .item .allergenicons .al{display:inline-flex;align-items:center;gap:6px;background:rgba(0,0,0,0.22);padding:4px 8px 4px 4px;border-radius:999px;}
#urunler .list .item .allergenicons .al img{width:32px;height:32px;object-fit:contain;background:#fff;border-radius:50%;flex:0 0 32px;}
#urunler .list .item .allergenicons .al .alname{font-size:0.78rem;line-height:1.2;color:#fff;}


#alerjenler .head44{text-align:center;}
#alerjenler .head44 .grid{display:grid;grid-template-columns:1fr 1fr 1fr;}
#alerjenler .head44 .grid .s{padding:15px 5px;}
#alerjenler .head44 .grid .s.s1{background-color:#6a6f72;color:#fff;}
#alerjenler .head44 .grid .s.s2{background-color:#adb383;}
#alerjenler .head44 .grid .s.s2 img{max-width:25vw;max-height:60px;object-fit:contain;}
#alerjenler .head44 .grid .s.s3{background-color:#6a6f72;color:#fff;}
#alerjenler .head44 .grid .s .flex{display:flex;justify-content:center;align-items:center;height:100%;}
#alerjenler .head44 .grid .s .flex .inner .menu .icon{display:block;font-size:1.7rem;}
#alerjenler .head44 .grid .s .flex .inner .aktiftip .text{display:block;font-size:0.8rem;}
#alerjenler .head44 .grid .s .flex .inner .aktiftip .icon{display:block;font-size:1.3rem;}
#alerjenler .alerjeninfo{padding:18px 18px 0 18px;color:#fff;opacity:0.9;}
#alerjenler .alerjenlist{padding:15px;}
#alerjenler .alerjenlist .item{
    display:flex;align-items:center;gap:12px;
    padding:12px;margin:0 0 10px 0;background:#adb383;color:#fff;border-radius:10px;
}
#alerjenler .alerjenlist .item .im{width:42px;height:42px;flex:0 0 42px;background:#fff;border-radius:8px;overflow:hidden;}
#alerjenler .alerjenlist .item .im img{width:100%;height:100%;object-fit:contain;}
#alerjenler .alerjenlist .item .text{font-family:'poppins_semibold',sans-serif;font-size:1rem;}




.bottombar{display:block;
    position:sticky;z-index:111000;left:0;bottom:0;width:100%;
    pointer-events:none;opacity:0;transform:translate(0,100%);transition:all 500ms;
}
.qrpage.selected .bottombar.show{pointer-events:all;opacity:1;transform:translate(0,0);}
.bottombar .grid{display:grid;grid-template-columns:repeat(2,1fr);}
.bottombar.uclu .grid{grid-template-columns:repeat(3,1fr);}
.bottombar .grid .s{}
.bottombar .grid .s.s1{}
.bottombar .grid .s.s2{}
.bottombar .grid .s a{
  position:relative;z-index:1;display:block;
  text-align:center;color:#fff;overflow:hidden;}
.bottombar .grid .s a .xgrid{display:inline-grid;grid-template-columns:auto auto;align-items:center;height:50px;}
.bottombar .grid .s a .icon{display:block;font-size:1.4rem;}
.bottombar .grid .s a:before{
  content:"";position:absolute;z-index:-1;left:0;top:0;width:100%;height:200%;
  transition:all 500ms;
}
.bottombar .grid .s.s1 a:before{
  background:linear-gradient( to bottom, #7b8153, #adb383 );
}
.bottombar .grid .s.s2 a:before{
  background:linear-gradient( to bottom, #26292b, #525659 );
}
.bottombar .grid .s.s3 a:before{
    background:linear-gradient( to bottom, #7b8153, #adb383 );
}
.bottombar .grid .s a:hover:before{transform:translate(0,-50%);}
@media only screen and (max-width:800px){
    /*
    .bottombar{display:block;}
    */
}