html {
    font-size: 0.8vw;
}

body {
    background-color: black;
    margin: 0;
    height: 100%;
    background-image: url(assets/Group\ 9.svg);
    background-repeat: no-repeat;
    background-size: 100% 100%;
    background-position-x: center;

}

* {
    box-sizing: border-box;

}

.content {
    width: 100%;
    height: 100%;


}

.courier{
display: flex;
align-items:center;
margin-bottom: 7vw;
}

.woltLogo, .woltImage{
  width: 13.5rem;
  margin-left: 2rem;
}

.logoContainer {
    display: flex;
    justify-content: center;
    font-size: 10vw;
    padding-top: 2vw;
}

.topLogo {
    width: 10rem;
}

.burgersTitle {
    background-image: url(assets/Group\ 185.svg);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    width: 40rem;
    height: max-content;
    font-size: 5rem;
    text-align: center;
    font-family: "nexa-rust-slab-black-2", sans-serif;
    font-weight: 900;
    font-style: normal;
    display: flex;
    justify-content: center;
    align-items: center;
    padding-top: 1rem;
}

.menuTitleContainer {
    display: flex;
    justify-content: center;
}

.foodMenuContainer {
    padding-top: 5vw;
}

.burgersMenuItemsContainer {
    display: flex;
    padding-top: 1.5vw;
    justify-content: space-around;
    padding-left: 15vw;
    padding-right: 15vw;

}

.burgersMenuItemsContainerTop {
    display: flex;
    padding-top: 5vw;
    justify-content: space-around;
    padding-left: 10vw;
    padding-right: 10vw;
}



.menuItemTop {
    display: flex;
}

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

.menuItemName {
    font-family: "Montserrat", sans-serif;
    color: white;
    font-size: 1.4rem;
    font-weight: bold;
}

.menuItemIngredients {
    font-family: "Montserrat", sans-serif;
    color: white;
    font-size: 1rem;
    width: 21rem;
}

.menuItemPriceContainer {
    display: flex;
    align-items: center;
}

.menuItemSubtext {
    font-family: "Montserrat", sans-serif;
    color: gray;
    font-size: 0.8rem;
    display: inline;
    padding-left: 0.8rem;
    align-content: end;
    margin-bottom: 0.3vw;
    font-weight: normal;
}

.priceYellow {
    font-family: "Montserrat", sans-serif;
    color: #FAD427;
    font-size: 2rem;
    font-weight: bold;
    padding-left: 0.5rem;
}

.priceWhite {
    font-family: "Montserrat", sans-serif;
    color: white;
    font-size: 2rem;
    font-weight: bold;
    padding-left: 1rem;
}

.discountIcon {
    padding-left: 1.5rem;
}

.discountIconBorder {
    font-family: "Montserrat", sans-serif;
    font-size: 0.8rem;
    color: #FAD427;
    border-width: 1px;
    border-color: #FAD427;
    border-style: solid;
    border-radius: 200px;
    padding: 0.2rem;
}

.discountIcon img{
    width: 1.5625rem;
    margin-bottom: -0.3125rem;
    
}

.euro {
    font-family: "Montserrat", sans-serif;
    font-size: 1rem;
    color: #FAD427;
    margin-bottom: -0.5rem;
    padding-left: 0.3rem;
}

.euroWhite {
    font-family: "Montserrat", sans-serif;
    font-size: 1rem;
    color: white;
    margin-bottom: -0.5rem;
    padding-left: 0.3rem;
}

.verticalDivider {
    height: 3rem;
    border-bottom: #FAD427;
    border-width: 1px;
    border-color: #FAD427;
    border-style: solid;

}

.verticalDivider {
    height: 3rem;
    width: 80%;
    border: 0;
    display: flex;
    justify-content: center;
    margin-left: 10vw;
    margin-right: 10vw;
    overflow: hidden;
    margin-top: 1.5vw;

}

.snacksFlex {
    display: flex;
    justify-content: center;
}

.snacksLeftSide .snacksRightSide {
    width: 35%;
}

.snacksDividerMiddle {
    width: 1%;
    margin-right: 2.5vw;

}

#singleCol {
    padding-top: 1.5vw;
}

#smol.menuItemTitle {
    padding-right: 1vw;
    width: 55%;
}

#smol.priceWhite,
#smol.priceYellow {
    padding-left: 0.7rem;
}

#snackTitleBottomRight {
    margin-top: 3vw;
}

#snackTitleBottomLeft {
    margin-top: 7vw;
}

#bottomDivider.verticalDivider {
    margin-top: 0;
}

.drinkyMenuLeft,
.drinkyMenuRight {
    padding-left: 1rem;
    padding-right: 1rem;
}

.gplay,
.appstore,
.badge {
    margin-left: 1rem;
    margin-right: 1rem;
}

.gplay {
    margin-right: -1rem;
}

.badge {
    width: 17rem;
}

.qrCodes {
    display: flex;
    align-items: center;
}

.qrCodes .topBadge {
    width: 5rem;
    height: auto;
}

.bottomQR {
    width: 4vw;
    margin-top: 0.5rem;
}

.drinkyTitle {
    font-family: "nexa-rust-slab-black-2", sans-serif;
    font-weight: 900;
    font-style: normal;
    color: white;
    margin-top: 1rem;
    margin-bottom: 0.5rem;
    font-size: 2.5rem;
    margin-left: 3rem;
    margin-right: 3rem;
}

.drinkyContainer {
    display: flex;
    justify-content: center;
    width: 100%;
    margin-bottom: 5vw;
}

.drinkyBackground {
    display: flex;
    width: 80%;
    justify-content: center;
    background-image: url(assets/Group\ 14.svg);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: bottom;


}

.drinksLeft #singleCol {
    padding-top: 0.5vw;
    padding-bottom: 0.2vw;
}

.drinksRight #singleCol {
    padding-top: 0.5vw;
    padding-bottom: 1.1vw;
}

.footerTop {
    display: flex;
    width: 80%;
    justify-content: center;
    margin-bottom: 6vw;
}

.footer {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    overflow: hidden;
}

.cardLegend {
    background-image: url(assets/Group\ 185.svg);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    height: auto;
    width: 20vw;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0.5vw;

}

.cardTextTitle {
    font-family: "Montserrat", sans-serif;
    font-weight: bold;
    font-size: 0.7vw;
    margin-left: 0.7vw;

}

.cardText {
    padding: 1vw;
    display: flex;
    align-items: center;
}

#blackDiscount {
    color: #000000;
    border-width: 1px;
    font-weight: normal;
    border-color: #000000;
}

.alergyContainer {
    width: 65%;
    margin-left: 2vw;
}

.alergyTop {
    color: gray;
    font-family: "Montserrat", sans-serif;
    font-weight: normal;
    font-size: 1rem;
}

.alergyDivider {
    border-color: gray;
}

.alergyList {
    display: flex;
    justify-content: space-between;
}

.alergyCollumn {
    color: gray;
    font-size: 0.7rem;
    font-family: "Montserrat", sans-serif;
    font-weight: normal;
    or: gray;
}

.footerMid {
    display: flex;
    justify-content: center;
    color: #9a8216;
    font-size: 1.8rem;
    font-family: "Montserrat", sans-serif;
    font-weight: normal;
    or: gray;
    transform: matrix(1, -0.05, 0.05, 1, 0, 0);
    align-items: center;
    margin-bottom: 6vw;
}

.footerAddress {
    color: #FAD427 !important;
    text-decoration: none !important;
    font-weight: bold;
    margin-left: 1vw;
    margin-right: 1vw;
    text-align: center;
    a{
        color: inherit;
    }
}

.boltLogo {
    
}

.boltImage {
    width: 10rem;
}

.overlayTop,
.overlayBottom {
    position: absolute;
    width: 50%;
    height: 20%;
    pointer-events: none;

}

.overlayTop {
    width: 100%;
}

.overlayBottom {
    left: 0;
}

.rightOverlay {
    right: 0;
    margin-top: 17vw;
    position: absolute;
    width: 8vw;

}

.leftOverlay {
    position: absolute;
    width: 8vw;
}

.burgersMenuL .burgersMenuItems {
    margin-top: 1vw;
}

.burgersMenuR .burgersMenuItems {
    margin-top: 1.5vw;
}

.centeringDiv {
    display: flex;
    justify-content: center;
}

@media only screen and (max-width: 800px) {

    html {
        font-size: 2.2vw;
    }

    body {
        background-size: 120% 100%;
    }

    .qrCodes {
        display: none;
    }

    .rightOverlay {
        width: 10vw;
        margin-top: 14vw;
    }

    .snacksFlex,
    .drinkyContainer,
    .drinkyBackground {
        display: block;
    }

    .verticalDivider,
    .snacksDividerMiddle {
        display: none;
    }

    .footerMid {
        width: 250%;
    }

    .burgersMenuItemsContainer {
        padding-left: 1vw;
        padding-right: 1vw;
        flex-direction: column;
        justify-content: space-around;
    }

    .menuItemContainer {
        justify-content: space-around;
        margin-bottom: 3vw;
    }

    .menuTitleContainer {
        margin-bottom: 5vw;
    }

    .topLogo {
        width: 17rem;
        margin-bottom: 5vw;
    }

    .priceWhite {
        padding: 0;
        margin-left: -0vw;
    }

    .drinkyBackground {
        background-image: url(assets/Group\ 14Mob.svg);
        width: 100%;
        background-size: 100% 100%;
    }

    .drinksRight #singleCol {
        padding-bottom: unset;
    }

    .drinkyContainer {
        margin-top: 10vw;
    }

    .centeringDiv {
        display: flex;
        justify-content: center;
        padding-top: 6vw;
        margin-bottom: 6vw;
    }

    .footerTop {
        flex-direction: column;
        align-items: center;
    }

    .cardTextTitle {
        font-size: 1rem;
    }

    menuItemPrice .menuItemPriceContainer {
        margin-left: 5vw;
    }

    .discountIconBorder {
        font-size: 0.6rem;
    }

    .cardLegend {
        padding: 8vw;
        padding-left: 15vw;
        padding-right: 15vw;

        width: unset;
        margin-bottom: 7vw;
    }

    .alergyList {
        flex-direction: column;
    }

    .alergyDivider,
    .alergyTop {
        color: white;
    }

    .alergyTop {
        text-align: center;
    }

    .alergyCollumn {
        font-size: 1.1rem;
        text-align: center;
        color: white;
        line-height: 1.7rem;
    }

    .footerMid {
        margin-top: 3vw;
        margin-bottom: 20vw;
    }

    .boltImage {
        width: 30vw;
    }

    .woltImage{
        width: 40vw;
        margin-left: 0rem;
    }

    

    .woltLogo{
        margin-left: 0rem;
    }

    .overlayBottom {
        height: 0;
        bottom: 0;
        position: relative;
    }

    .leftOverlay {
        bottom: 0;
        width: 10vw;
        margin-bottom: -200vw;
    }

}

.burgersMenuItems#special {
    background-color: #f4dd3f;
    border-radius: 0.5vw;
    padding-left: 1.5vw;
    padding-right: 1.5vw;
    padding-top: 0.5vw;
    padding-bottom: 0.5vw;
    width: fit-content;
    margin-top: 2.5rem;
    height: 5rem;
    display: flex;
    align-items: center;
}

.burgersMenuItems#special .menuItemContainer {
display: flex;
align-items: center;
justify-content: center;
column-gap: 2.5rem;
}

.burgersMenuItems#special .left, .burgersMenuItems#special .right{
    display: flex;
    align-items: center;
    column-gap: 0.625rem;
    font-family: "Montserrat", sans-serif;
    font-weight: 600;
}

.burgersMenuItems#special .top{
    font-size: 1.25rem;
}

.burgersMenuItems#special img{
    width: 2.7rem;
    height: 2.5rem;
}

.burgersMenuM {
    display: flex;
    justify-content: center;
}

.burgersMenuItems#special .menuItemName {
    font-size: 1.2rem;
    width: 19rem
}

.burgersMenuItems#special .menuItemName,
.burgersMenuItems#special .discountIconBorder,
.burgersMenuItems#special .priceYellow,
.burgersMenuItems#special .euro,
.burgersMenuItems#special .priceWhite,
.burgersMenuItems#special .euroWhite {
    color: #000000;
    border-color: black;
}

.burgersMenuItems#special .menuItemPriceContainer {
    margin-left: 1vw;
}

.burgersMenuItems#special {
    margin-left: 4vw;
    margin-right: 4vw;
}

.coolIcon img{
width: 3rem;
  position: absolute;

  margin-top: -0.5rem;
}

.orderWith{
    color: #FAD427 !important;
    text-decoration: none !important;
    font-weight: bold;
    margin-left: 4vw;
    margin-right: 0vw;
    text-align: center;
    font-size: 3rem;
    font-family: "nexa-rust-slab-black-2", sans-serif;

}

/*
@media only screen and (min-width: 2000px) {

    html{
        font-size: 0.5vw;
    }

    .burgersMenuItemsContainer{
        justify-content: space-evenly;
        padding-left: 25vw;
        padding-right: 25vw;
    }

    

}
*/
