:root {
    --green:#f0cb36;
    --white:#ffffff;
    --grey:#111111;
    --red:#FF0000;
    --black:#000000;
}

.success {border:1px solid var(--green);background:var(--green);text-align:center;font-weight:400;}


body {background:var(--green);min-height:100vh;}
#content {min-height:100vh;}
h2 {color:var(--green);font-size:150%;}
h3 {color:var(--green);font-size:130%;}
h3.startmobile {margin-top:50px;text-align:center;}
form {width:100%;margin-right:0;}
#mobileorderwrapper {margin:0 auto 100px auto;width:100%;max-width:400px;}
#mobileorderwrapper .intro h1 {text-align:center;color:var(--grey);}
#mobileorderwrapper .intro h2 {text-align:center;color:var(--grey);margin-top:20px;}

.myorderstable {margin-bottom:50px;}
.myorderstable .iteminvalid td {opacity:0.5;text-decoration:line-through;}
.myorderstable td:nth-child(3) {min-width:55px;}
.restaurantlogo {width:100%;height:auto;max-width:400px;margin:0 auto;}
table tr:nth-child(2n) {background: rgba(220,220,220,0.3);}
.producttypewrapper {width:100%;box-sizing:border-box;padding:0 0 0 0;margin: 0 auto 30px auto;max-width:400px;}
.addproduct {width:calc(100% - 50px);max-width:400px;font-size:16px;line-height:24px;text-align:left;padding:0 50px 0 0;margin:0 0 10px 0;height:auto;min-height:50px;border:none;display:flex;align-items:center;flex-wrap:wrap;overflow:hidden;transition:all 0.6s ease;}
.increaseproduct {left:unset;right:0px;top:50%;transform:translateY(-50%);text-align:center;border:none;background:url("/css/images/add-gold.png") no-repeat center center;background-size:35px auto;width:35px;height:35px;padding:0;}
.decreaseproduct {left:unset;right:-50px;top:50%;transform:translateY(-50%);display:block;text-align:center;border:0px solid var(--grey);background-color:var(--white);color:var(--grey);transition:right 0.4s ease,opacity 0.4s ease;opacity:0;background:url("/css/images/minus-grey.png") no-repeat center center;background-size:35px auto;width:35px;height:35px;padding:0;}
span.productamount {display:block;transition:right 0.6s ease;position:absolute;top:50%;transform:translateY(-50%);right:-50px;transition:right 0.6s ease,opacity 0.6s ease;opacity:0;min-width:20px;}
.addproducttype.t1 {background-color:unset;}
.addproducttype.t2 {background-color:unset;}
.addproducttype.t3 {background-color:unset;}
.addproducttype {margin:0;padding:0 0 15px 0;border:0;border-radius:0;height:auto;width:100%;max-width:400px;}
.addproduct.hasamount{padding-right:110px;width:calc(100% - 110px);}
.addproduct.hasamount .decreaseproduct{right:70px;opacity:1;}
.addproduct.hasamount .productamount{right:40px;opacity:1;}

.addproduct .productdescription {font-style:italic;font-size:10px;line-height:14px;max-width:0;max-height:0;overflow:hidden;padding:0;margin:0;transition: all 0.6s ease}
.addproduct.showproductdescription .productdescription {max-width:800px;max-height:300px;padding: 0 10px;}

.inpreparation {display:inline-block;background:none;}
.inpreparation img {width:28px;height:auto;}
.served {display:inline-block;background:none;}
.served img {width:28px;height:auto;}

#content {padding-bottom:0;}
#cart {padding:0;margin:0;position:fixed;left:0;right:0;bottom:0;height:50px;background:var(--green);color:var(--black);display:block;align-items:top;transition: height 0.6s ease, bottom 0.6s ease;}
#cartinner {width:100%;max-width:400px;margin:0 auto;}
#cart.open {height:calc(var(--vh, 1vh) * 100);overflow-y: auto;}
#cartheader {display:flex;align-items:center;position:relative;width:100%;height:50px;margin-bottom:0;padding:0;}
#cartitems {height:50px;padding:0 0 0 50px;margin:0;margin-bottom:0;background:url("/css/images/shopping-cart-black.png") no-repeat 10px center;background-size:30px auto;display:flex;align-items:center;}
#cartcash {height:50px;padding:0 0 0 50px;margin:0;margin-bottom:0;background:url("/css/images/euro-cash-black.png") no-repeat 10px center;background-size:30px auto;display:flex;align-items:center;}
#carttoggler {height:50px;width:50px;position:absolute;right:0;top:0;margin-bottom:0;padding:0;transition:all 0.6s ease;}

#cart.continue #carttoggler{background:url("/css/images/weiterpfeil-schwarz.png") no-repeat right 10px center;background-size:30px auto;transition: transform 0.6s ease;animation: shake 0.5s ease;}
#cart.continue.open #carttoggler{transform:rotate(90deg);}
.intro {margin-bottom:40px;margin-top:30px;text-align:center;}

#cartlist table {color:var(--black);}
#cartlist table th {border-bottom:2px solid var(--black);}
#cartlist table td {border-bottom:1px solid var(--black);}
#cartlist table td + td + td {min-width:75px;} {border-bottom:1px solid var(--black);}
#cartlist table tr:nth-child(2n) {  background: transparent;}
table td .status.paid {background:url("/css/images/bezahlt.png") no-repeat center center;background-size:30px auto;width:30px;height:30px;}
table td .status.tobepaid {background:url("/css/images/bezahlung_offen.png") no-repeat center center;background-size:30px auto;width:30px;height:30px;}

.payopenpaymentswrapper {text-align:center;}
#payopenpayments {background:url("/css/images/bezahlung_offen.png") no-repeat left 10px center;background-size:30px auto;margin: 0 auto 30px auto;display:inline-block;padding:25px 25px 25px 55px;border:1px solid var(--green);color:var(--green);border-radius:4px;cursor:pointer;}
#payallopenpayments {background:url("/css/images/bezahlung_offen.png") no-repeat left 10px center,var(--white);background-size:30px auto;margin: 0 auto 30px auto;display:inline-block;padding:25px 25px 25px 55px;border:1px solid var(--white);border-radius:4px;cursor:pointer;color:var(--green);}
#cartinner #payallopenpayments {margin-bottom:0;}

.mailwrapper {font-size:10px;line-height:14px;text-align:center;}
input#emailaddress {font-size:12px;font-weight:400;color:var(--black);background:var(--green);padding:8px;border:1px solid var(--black);width:calc(100% - 80px);margin:0 auto 10px auto;border-radius:3px;}
input#emailaddress::placeholder {color:var(--black);}




#orderwithcashonly {text-align:center;}
#ordernowwrapper {text-align:center;}
#ordernow {margin: 0 auto;display:inline-block;padding:25px;border:1px solid var(--white);border-radius:4px;cursor:pointer;background:var(--white);color:var(--green);}
#makecashorder {margin: 0 auto;display:inline-block;padding:25px;border:1px solid var(--white);border-radius:4px;cursor:pointer;}

#bottomcontinue {opacity:0;margin:30px auto;padding-right:60px;background:url("/css/images/weiterpfeil-gold.png") no-repeat right 10px center;background-size:0px auto;font-weight:bold;height:0px;width:auto;display:flex;align-items:center;width:80px;color:var(--green);cursor:pointer;transition: all 0.6s ease;}
#bottomcontinue.show {opacity:1;height:50px;background-size:50px auto;}


#payment-form {width:100%;max-width:400px;margin:30px auto;}
#payment-form button#submit {background:var(--green);}


.fetchnumers {font-size:65px;line-height:80px;text-align:center;}



.shakeme {animation: shake 0.5s ease;border:10px solid blue;}
.rotate {  animation: rotate 0.5s ease;}
.pulse {animation: pulse 0.5s ease-in-out;}
@keyframes rotate {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
@keyframes shake {
  0%, 100% {
    transform: translateX(0);
  }
  25% {
    transform: translateX(-5px);
  }
  50% {
    transform: translateX(5px);
  }
  75% {
    transform: translateX(-5px);
  }
}
@keyframes pulse {
  0% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.1);
  }
  100% {
    transform: scale(1);
  }
}