




.nothinghere                                                            { text-align: center; margin: 0; padding: 32px 0; }




.qtychanger                                                             { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba( 0, 0, 0, .75 ); }
.qtychanger form                                                        { background: #ffffff; padding: 16px; width: 180px; position: absolute; top: 50%; left: 50%; transform: translate( -50%, -50% ); }
.qtychanger h4                                                          { margin: 0; padding: 0; font-size: 90%; text-align: center; font-weight: normal; text-transform: uppercase; }
.qtychanger p                                                           { margin: 12px 0 0 0; padding: 0; text-align: center; }
.qtychanger input                                                       { width: 50%; font-size: 100%; text-align: center; padding: 4px 0; border: 1px solid #cccccc; background: #ffffff; }
.qtychanger button                                                      { font-size: 100%; width: 100%; padding: 4px 0; }



.summary                                                                {}

.summary .itemlist                                                      { margin: 24px 0 0 0; padding: 0; list-style: none; }

.summary .itemlist .item                                                { border-top: 1px solid #dddddd; margin: 0; padding: 8px 0; display: flex; flex-flow: row wrap; align-items: center; }
.summary .itemlist .item .subtotal                                      { margin-left: auto; font-size: 120%; }

.summary .itemlist .item .namepriceqty                                  { display: flex; flex-flow: column wrap; width: 80%; }

.summary .itemlist .item .namepriceqty .name                            { font-weight: bold; font-size: 85%; width: 100%; display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.summary .itemlist .item .namepriceqty .priceqty                        { display: flex; flex-flow: row wrap; font-size: 75%; }
.summary .itemlist .item .namepriceqty .priceqty .price                 { width: 36px; color: #666666; }
.summary .itemlist .item .namepriceqty .priceqty .qty                   { font-weight: bold; }
.summary .itemlist .item .namepriceqty .priceqty .qty .fas              { margin-left: 8px; cursor: pointer; font-size: 90%; }

.summary .itemlist .customization                                       { width: 100%; margin: 2px 0 0 0; padding: 0; list-style: none; font-size: 75%; }
.summary .itemlist .customization li                                    { margin: 0; padding: 3px 0 0 0; display: flex; flex-flow: column wrap; }
.summary .itemlist .customization li strong                             { font-weight: normal; }
.summary .itemlist .customization li .secondarycolor                    { font-size: 110%; }

.summary .grandtotal                                                    { font-size: 100%; margin: 12px 0 0 0; background: #eeeeee; padding: 12px; list-style: none; }
.summary .grandtotal li                                                 { margin: 0; padding: 4px 0; display: flex; flex-flow: row nowrap; }
.summary .grandtotal .value                                             { margin-left: auto; }
.summary .grandtotal .gt                                                { font-size: 120%; }
.summary .grandtotal .gt.multiline                                      { border-top: 1px dashed #bbbbbb; margin-top: 8px; padding-top: 12px; }

.summary .addmoar                                                       { font-size: 80%; font-weight: bold; text-align: center; margin: 8px 0 0 0; padding: 0; }




.customer                                                               { margin: 24px 0 0 0; }

.customer .paneled                                                      { background: #F1F1F1; padding: 12px; margin: 16px 0 0 0; }

.customer .paneled fieldset                                             { margin: 0; padding: 0; border: none; display: flex; flex-direction: row; justify-content: space-between; }
.customer .paneled fieldset label                                       { cursor: pointer; font-size: 80%; display: inline-block; text-align: center; border-width: 1px; border-style: solid; padding: 8px; width: 47%; }
.customer .paneled fieldset label input                                 { display: none; }

.customer .field                                                        { margin: 16px 0 0 0; padding: 0; overflow: auto; }
.customer .field label                                                  { display: block; padding-bottom: 3px; font-size: 90%; font-weight: bold; color: #666666; }

.customer .field input, .customer .field select,
.customer .field textarea                                               { display: block; margin: 0; padding: 8px 12px; background: #ffffff; border: 1px solid #cccccc; width: 100%; font-size: 120%; }

.customer .field input.plus                                             { width: 6%; padding-left: 0; padding-right: 0; text-align: center; border-right: none; float: left; }
.customer .field input.cc                                               { width: 14%; padding-left: 0; padding-right: 0; text-align: center; border-left: none; float: left; }
.customer .field input.num                                              { width: 78%; margin-left: 2%; float: left; }

.customer .paneled.cashpayment p                                        { text-transform: uppercase; margin: 0; padding: 0 0 12px 0; font-weight: bold; font-size: 90%; text-align: center; color: #666666; }
.customer .paneled.cashpayment i                                        { margin-right: 3px; }


@media( min-width: 375px ){
.customer .paneled fieldset label                                       { font-size: 95%; width: 48%; padding: 8px 12px; }
}

@media( min-width: 425px ){
.customer .paneled fieldset label                                       { font-size: 100%; }
}




.action                                                                 { text-align: center; margin: 24px 0 0 0; }

.action .error                                                          { margin: 0 0 24px 0; padding: 6px 12px; background: #FFF7C6; border: 1px solid #DFD796; list-style: none; }
.action .error li                                                       { color: #D92C07; font-size: 85%; margin: 0; padding: 3px 0; text-align: left; }

.action .confirmbutton                                                 { width: 100%; cursor: pointer; border: none; font-size: 120%; color: #ffffff; background: #25B43C; padding: 8px 18px; margin: 0; position: relative; }

.action .whatsappbutton:disabled                                        { cursor: default; color: #bbbbbb; background: #DDDDDD;  }



