@charset "UTF-8";
/* CSS Document */


div#innerContent > p > span.welcome {
    background: transparent;
    box-sizing: border-box;
    padding: 12px;
    text-align: center;
    width: 100%;
    min-width: 100%;
    justify-content: center;
    font-size: 1.1rem;
    line-height: 1.4;
    margin-bottom: 12px;
    border-bottom: 1px solid;
}


    
    span.switch { display: flex; width: 86px; height: 48px; background-color: indianred; border-radius: 24px; box-sizing: border-box; padding: 4px; justify-content: flex-start; align-items: center; } span.switch.on { background-color: seagreen; justify-content: flex-end; } span.switch > i { display: block; width: 40px; height: 40px; border-radius: 20px; background-color: white; box-shadow: 0px 0px 3px 0px black; }
    

    
    input.valid, select.valid     { background-color: rgba(200,255,210,1) !important; text-align:center; } 
    input.invalid, select.invalid { background-color: rgba(255,200,210,1) !important; text-align:center; }
    
    div.orderform > input,
    div.orderform > label { max-width:480px; }
    
    
    div.orderform { 
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    box-sizing: border-box;
    padding: 12px 2px;
    padding-bottom: 120px;
    width: 100%;
    margin: 24px auto 24px;
    justify-content: flex-start;
    } div.orderform.hidden { display:none !important }
    
    
    
    
    
    div.orderform > span { display: inline-flex;
    flex-direction: column;
    box-sizing: border-box;
    margin: 4px 0px;
    padding: 0px 4px 0px 0px;
    max-width: 836px;
    min-width: 300px;
    width: 100%;
    position: relative; }
    
    div.orderform > span.half { 
        max-width: 418px;
        min-width: 160px; 
        width: 50%;
    }
    
    div.orderform > span.address.on { 
        padding: 5px 12px 2px 12px; 
        background: beige; 
        margin: 0px 0px; 
    }
    div.orderform > span.address:not(.on) { display: none !important; }
    div.orderform > span.addressdelivery.on.off, 
    div.orderform > span.addressdelivery.off, 
    div.orderform > span.ondelivery.off { display: none !important; }
    
    
    
    
    div.orderform > span.small { 
    max-width: 418px;
    min-width: 160px;
    width: 33%; }
    
    
    
    
    
    
    button.orderbase { 
        margin: 8px 0px 0px 8px;
        width: calc(100% - 13px);
        min-height: 60px;
        font-weight: 600;
        letter-spacing: 1px; 
        width: 100%;
        max-width: 580px;
        margin: 24px 0px 0px 0px;
    } 
    button.orderbase.invalid { 
        background-color: indianred;
        opacity: 0.5;
        pointer-events: none;
        color: darkred;
        font-weight: 100;
    } 
    
    
    
    
    
    div#innerContent ul.orderlist { 
    
        list-style: none;
    display: flex;
    box-sizing: border-box;
    padding: 12px 0px;
    justify-content: space-evenly;
    width: 100%;
        flex-direction: row;
        flex-wrap: wrap;
    
    
    
    
    
    
    }
    div#innerContent ul.orderlist > li.item { 
        
    padding: 8px 8px;
    background-image: none;
    border: 2px solid #cdcdcd;
    border-radius: 27px;
    display: inline-flex;
    flex-wrap: wrap;
    background-color: white;
    max-width: 550px;
    margin: 4px auto 12px auto;
        
    }
    div#innerContent ul.orderlist > li.item > b { 
    
    max-width: calc(100% - 86px);
    min-width: calc(100% - 86px);
    padding-left: 12px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    text-align: left;
    font-size: 1.35rem;
    /* background-color: #fefefe; */
    border-radius: 0px 27px 0px 0px;
    border-bottom: 1px solid #cdcdcd;
    margin-bottom: 8px;
    min-height: 49px;
    line-height: 1.2;
    font-weight: 500;
    letter-spacing: 0px;
    
    
    }
    
    div#innerContent ul.orderlist > li.item > div { 
            display: inline-flex;
            box-sizing: border-box;
            padding: 6px;
            flex-wrap: wrap;
            flex-direction: row;
            position: relative;
    }
    
    
    div#innerContent ul.orderlist > li.item > div > input.count { 
    
    max-width: 80px;
    min-width: 80px;
    box-sizing: border-box;
    text-align: center;
    padding: 0px 0px 0px 0px;
    font-size: 2rem;
    line-height: 1.5;
    font-weight: 600;
    background-repeat: no-repeat;
    margin-right: 0px;
    background-size: 32px;
    background-position: right center;
    pointer-events: none;
    
    }
    


span.plusminus { 
    display: inline-flex;
    flex-direction: column;
    box-sizing: border-box;
    padding: 0px 10px 0px 0px;
    margin: 0px 0px 0px 0px;
} 
span.plusminus > button { 

    padding: 0px 0px;
    margin: 0px 0px;
    width: 73px;
    height: 48px;
    font-size: 2rem;
    color: black;
    background-color: gainsboro;
    box-shadow: none;
    font-weight: 800;

} 
span.plusminus > button:active { 

    background-color: black;
    color:white;

} 
span.plusminus > button.plus  {     border-radius: 12px 12px 0px 0px; border-bottom:1px solid; } 
span.plusminus > button.minus {     border-radius: 0px 0px 12px 12px; } 





    
    div#innerContent ul.orderlist > li.item > div > i { 
    
    display: flex;
    min-width: calc(100% - 172px);
    /* background-color: antiquewhite; */
    min-height: 37px;
    justify-content: flex-end;
    align-items: center;
    padding: 3px 2px;
    color: black;
    font-size: 1.5rem;
    font-weight: 600;
    background-repeat: no-repeat;
    background-position: 1px center;
    /* background-size: 32px; */
    /* background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' fill='%23cdcdcd'%3E%3Cpath d='m256-168-88-88 224-224-224-224 88-88 224 224 224-224 88 88-224 224 224 224-88 88-224-224-224 224Z'/%3E%3C/svg%3E"); */
    
    }
    
    
    
    div#innerContent ul.orderlist > li.item > div > p { 
    
    display: inline-block;
    min-width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    min-height: 64px;
    font-size: 1rem;
    font-weight: 400;
    text-align: left;
    background-color: transparent;
    padding: 2px 2px 2px 6px !important;
    }
    
    div#innerContent ul.orderlist > li.item:not(.on) { background-color: gainsboro; }
    
    div#innerContent ul.orderlist > li.item:not(.on) > div > input.count, 
    div#innerContent ul.orderlist > li.item:not(.on) > div > i, 
    div#innerContent ul.orderlist > li.item:not(.on) > div > p { pointer-events: none; opacity:0.6; }
    
    
    div#innerContent div.orderform button.sendorder     { 
    
        /* margin: 0px 0px 2px 24px; */
        display: inline-flex;
        justify-content: center;
        justify-self: flex-end;
        font-size: 1.5rem;
        padding: 18px 54px 18px 16px;
        background-repeat: no-repeat;
        background-size: 45px;
        background-position: 98% center;
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' fill='%23e8eaed'%3E%3Cpath d='M140-190v-580l688.46 290L140-190Zm60-90 474-200-474-200v147.69L416.92-480 200-427.69V-280Zm0 0v-400 400Z'/%3E%3C/svg%3E");
        background-color: darkblue;
        /* border-radius: 15px; */
        /* border: 2px solid; */
    
    
    }
    div#innerContent div.orderform button.sendorder.off { pointer-events: none; opacity:0.3; background-color: black; }
    
    
    
    div#innerContent div.orderform p.datasend,    
    div#innerContent div.orderform p.dataconfirm {  
        padding: 6px 0px 6px 0px !important;
        background-color: transparent;
        border-radius: 12px;
        font-size: 0.9rem;
        line-height: 1.5;
        margin: 2px 0px 2px 0px !important;
        display: flex;
        flex-wrap: wrap;
        position: relative;
        float: left;
        color: #232323;
        font-weight: 400;
        width: 100%;
        justify-content: space-between;
    }
    
    
    div#innerContent div.orderform p.datasend > b,
    div#innerContent div.orderform p.dataconfirm > b,
    div#innerContent div.orderform p.datasend > i,
    div#innerContent div.orderform p.dataconfirm > i {  min-width:100%; margin-bottom:16px;  }
    
    
    b.localInfo { 
    
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' fill='seagreen'%3E%3Cpath d='M460-300h40v-220h-40v220Zm20-276.92q10.46 0 17.54-7.08 7.08-7.08 7.08-17.54 0-10.46-7.08-17.54-7.08-7.07-17.54-7.07-10.46 0-17.54 7.07-7.08 7.08-7.08 17.54 0 10.46 7.08 17.54 7.08 7.08 17.54 7.08Zm.13 456.92q-74.67 0-140.41-28.34-65.73-28.34-114.36-76.92-48.63-48.58-76.99-114.26Q120-405.19 120-479.87q0-74.67 28.34-140.41 28.34-65.73 76.92-114.36 48.58-48.63 114.26-76.99Q405.19-840 479.87-840q74.67 0 140.41 28.34 65.73 28.34 114.36 76.92 48.63 48.58 76.99 114.26Q840-554.81 840-480.13q0 74.67-28.34 140.41-28.34 65.73-76.92 114.36-48.58 48.63-114.26 76.99Q554.81-120 480.13-120Zm-.13-40q134 0 227-93t93-227q0-134-93-227t-227-93q-134 0-227 93t-93 227q0 134 93 227t227 93Zm0-320Z'/%3E%3C/svg%3E");
    color: seagreen;
    padding: 8px 8px 8px 32px !important;
    background-repeat: no-repeat;
    background-position: 4px 3px;
    font-size: 0.875rem;
    font-weight: 200;
    border: 1px solid;
    border-radius: 8px;
    word-break: normal !important;
    line-height: 1.4 !important;
    background-color: white;
    margin-top:18px;
    
    }
    




table { min-width: 100%; }
table > tbody > tr { min-width: 100%; }
table > tbody > tr > td { border-bottom: 1px solid #cdcdcd; }
table > tbody > tr > td:first-child {     width: 50%;
    text-align: right;
    padding-right: 10px;
    box-sizing: border-box;
    align-content: flex-start; }
table > tbody > tr > td:last-child  {     width: 50%;
    text-align: left;
    padding-left: 10px;
    box-sizing: border-box;
    align-content: flex-start; }