body {
 /*https://scontent.fkul8-1.fna.fbcdn.net/v/t1.0-9/fr/cp0/e15/q65/69715057_2428302520823304_8485628785775869952_o.jpg?_nc_cat=111&efg=eyJpIjoidCJ9&_nc_oc=AQl_dg1JpVJKdAqinbHV3tDTNW5yBcMhXL52tVR-zH-ZOkxteym0dbVfgZVwl16uZeqNHsYnI6iHHzCS55pDEG2M&_nc_ht=scontent.fkul8-1.fna&oh=e6e32856b1726153e80e8089609707d5&oe=5E057099*/
/* background: url('../img/pink-galaxy-bg.jpg') fixed;*/
 background: url('../img/xmas-bg.jpg') fixed;

}
modal {
  overflow-y:auto;
}

table { border-collapse: separate; border-spacing: 0; }
td {
    border: solid 1px #000;
    border-style: none none solid none;
    padding: 10px;
}
tr:first-child td:first-child { border-top-left-radius: 20px; }
tr:first-child td:last-child { border-top-right-radius: 20px; }
tr:last-child td:first-child { border-bottom-left-radius: 20px; }
tr:last-child td:last-child { border-bottom-right-radius: 20px; }
tr:first-child td { border-top-style: none; }
tr td:first-child { border-left-style: none; }

.modal-header{
   background-image: url('../img/pink-bg.jpg');
}
.modal-body{
   background-image: url('../img/light-pink-bg.jpg');
}
.modal-footer{
   background-image: url('../img/pink-bg.jpg');
}
.btn-danger.pink-btn {
	background-color: #ffd0d0;
	border-color: #fdc3c3;
	color: #000000;
}

.btn-danger.purple-btn {
	background-color: #f4c6fb;
	border-color: #f4c6fb;
	color: #000000;
}

.btn-danger.skyblue-btn {
	background-color: #e8e9f8;
	border-color: #cdd0fa;
	color: #000000;
}
.btn-danger.yellow-btn {
	background-color: #fffbeb;
	border-color: #fdfb72;
	color: #000000;
}
.btn-danger.skygreen-btn {
	background-color: #f3fff5;
	border-color: #d8fcde;
	color: #000000;
}

.yellow-bg{
	background-color: #fff6d3;
	border-color: #fdfb72;
}
.skygreen-bg{
	background-color: #f3fff5 !important;
	border-color: #d8fcde;
}

/**Use in accept-showcase-task (showcase pane)**/
.nav-success{
	background-color: #c3e6cb !important;
	border-color: #d8fcde;
	color:#ffffff;
}
/**Use in accept-showcase-task (discarded pane)**/
.nav-danger{
	background-color: #f5c6cb !important;
	border-color: #d8fcde;
	color:#ffffff;
}

/**Use in accept-showcase-task (sold pane)**/
.nav-warning{
	background-color: #ffeeba !important;
	border-color: #d8fcde;
	color:#ffffff;
}

/**For cashier add showcase table bg img**/
.cashier-add-showcase-table{
    background-size: 450px auto;
    background-repeat: repeat;
   /** background-image: url('https://drive.google.com/uc?export=view&id=17SS3AErgnJ8nmNdsaIjL2zmGEwMGJTa0');**/
    /*background-image: url('../img/cakes-bg-green.png');*/
	background-position: center center;
	background-attachment: fixed;
}
/**END cashier add showcase table bg img**/

/*shopping cart check out selected class*/
.sunset-orange-bg{
	background-color: #fffef3 !important;
	border-color: #d8fcde;
	opacity: 0.8;
}


/**For add fnb msg fade in out */
.visible {
  /*visibility: visible;*/
  opacity: 1;
  transition: opacity 0.3s linear;
}
.hidden {
  /*visibility: hidden;*/
  /*font-size: 0px;*/
  opacity: 0;
  transition: opacity 0.3s linear;
  /*visibility 0s 2s linear, */
  /*font-size 1s linear, */
}

/*Used by menu detail to hide addon when max qty reached*/
.fadeout {
  /*visibility: hidden;*/
  /*font-size: 0px;*/
  opacity: 0.3;
  transition: opacity 0.3s linear;
  /*visibility 0s 2s linear, */
  /*font-size 1s linear, */
}
/**END For add fnb msg fade in out 8*/

.row-no-margin{
	display:flex;
	flex-wrap:wrap;
}

.div-monday-red{
	background-image: radial-gradient(circle, rgba(255,0,0,0.0), rgba(255,0,0,0.3));
}
.div-tuesday-orange{
	background-image: radial-gradient(circle, rgba(255,150,0,0.0), rgba(255,150,0,0.3));
}
.div-wednesday-yellow{
	background-image: radial-gradient(circle, rgba(252,255,0,0.0), rgba(252,255,0,0.3));
}
.div-thursday-green{
	background-image: radial-gradient(circle, rgba(24,255,0,0.0), rgba(24,255,0,0.3));
}
.div-friday-blue{
	background-image: radial-gradient(circle, rgba(0,138,255,0.0), rgba(0,138,255,0.3));
}
.div-saturday-teal{
	background-image: radial-gradient(circle, rgba(134,242,255,0.0), rgba(134,242,255,0.3));
}
.div-sunday-purple{
	background-image: radial-gradient(circle, rgba(138,0,255,0.0), rgba(138,0,255,0.3));
}

/**Homepage blue btn bg img**/
.blue-crystal-bg{
    background-size: auto;
    background-repeat: repeat;
    background-image: url('../img/symbol/blue-crystal-bg.jpg');	
	background-position: center center;
	background-attachment: fixed;
}
/**Homepage teal btn bg img**/
.teal-crystal-bg{
    background-size: auto;
    background-repeat: repeat;
    background-image: url('../img/symbol/teal-crystal-bg.jpg');	
	background-position: center center;
	background-attachment: fixed;
}
/**Homepage green btn bg img**/
.green-crystal-bg{
    background-size: auto;
    background-repeat: repeat;
    background-image: url('../img/symbol/green-crystal-bg.jpg');	
	background-position: center center;
	background-attachment: fixed;
}
/**Homepage yellow btn bg img**/
.yellow-crystal-bg{
    background-size: auto;
    background-repeat: repeat;
    background-image: url('../img/symbol/yellow-crystal-bg.jpg');	
	background-position: center center;
	background-attachment: fixed;
}
/**Homepage purple btn bg img**/
.purple-crystal-bg{
    background-size: auto;
    background-repeat: repeat;
    background-image: url('../img/symbol/purple-crystal-bg.jpg');	
	background-position: center center;
	background-attachment: fixed;
}
/**Homepage red btn bg img**/
.red-crystal-bg{
    background-size: auto;
    background-repeat: repeat;
    background-image: url('../img/symbol/red-crystal-bg.jpg');	
	background-position: center center;
	background-attachment: fixed;
}
/**Homepage orange btn bg img**/
.orange-crystal-bg{
    background-size: auto;
    background-repeat: repeat;
    background-image: url('../img/symbol/orange-crystal-bg.jpg');	
	background-position: center center;
	background-attachment: fixed;
}

/**For shopping cart QR scanner**/
.section {
    background-color: #ffffff;
    padding: 50px 30px;
    border: 1.5px solid #b2b2b2;
    border-radius: 0.25em;
    box-shadow: 0 20px 25px rgba(0, 0, 0, 0.25);
}
 
#my-qr-reader {
    padding: 20px !important;
    border: 1.5px solid #b2b2b2 !important;
    border-radius: 8px;
}
 
#my-qr-reader img[alt="Info icon"] {
    display: none;
}
 
#my-qr-reader img[alt="Camera based scan"] {
    width: 100px !important;
    height: 100px !important;
}
 /**
button {
    padding: 10px 20px;
    border: 1px solid #b2b2b2;
    outline: none;
    border-radius: 0.25em;
    color: white;
    font-size: 15px;
    cursor: pointer;
    margin-top: 15px;
    margin-bottom: 10px;
    background-color: #008000ad;
    transition: 0.3s background-color;
}
 **/
button:hover {
    background-color: #008000;
}
 
#html5-qrcode-anchor-scan-type-change {
    text-decoration: none !important;
    color: #1d9bf0;
}
 
video {
    width: 100% !important;
    border: 1px solid #b2b2b2 !important;
    border-radius: 0.25em;
}
/**END For shopping cart QR scanner**/