xbody {
  text-align: left;
  margin-left: 0px;
  xbackground-color: lightblue;
}

a {
  color: #FF6600;
  text-decoration: none;
}

.page-wrap {
  padding: 2rem 0rem;
  width: 100%;
  xtext-align: center;
}

/* For front-page */
.outer {
  overflow-y: auto;
  height: 29vh;     /* !!!  HEIGHT MUST BE IN [ vh ] !!! */
}

.outer table, table {
  width: 100%;
  border-spacing: 0;
  border-collapse: separate;
}

.xouter table th {
  top: 0;
  text-align: center;
  position: sticky;
}


/* Start Responsive Menu */
.cart {
  position: relative;
  font-size: 12px;
  font-weight: bold;
  bottom: 7px;
  right: 3px;
  color: #FF6600;
}

.cart-img {
  height: auto;
  width: 28px;
  padding-top: 4px;
}

/* Reduce Hambuger menu size */
.navbar-toggler {
  vertical-align: center;
  font-size: 16px;
  border: none;
  xfloat: right;
}

/* Remove Hamburger menu border when click */
.navbar-toggler:focus {
  text-decoration: none;
  outline: 0; /* Remove outline */
  box-shadow: none; /* Remove box-shadow */
}

.navbar-toggler:active {
  text-decoration: none;
  outline: 0; /* Remove outline */
  box-shadow: none; /* Remove box-shadow */
}

/* Additional Bootstrap Start */
.dropdown-menu {
  xleft: 7px;
  xmargin-top: -9px;
  min-width: 13rem;
  --bs-dropdown-padding-y: -0.5rem;
}

.dropdowm-header {
  padding: 0px 5px;
}

.dropdown-item {
  color: #FF6600;
  background-color: #FFFFFF;
}

.dropdown-item:hover {
  color: #FFF;
  background-color: #FF6600;
}

.nav-cart {
  position: static;
}

.nav-link {
  color: #FF6600;
}

.nav-link:hover {
  xcolor: #000;
  xbackground-color: #D0D0D0;
  color: #FFF;
  background-color: #FF6600;
  xfont-weight: bold;
}

.navbar-nav .nav-link.show {
  xcolor: #000;
  xbackground-color: #D0D0D0;
  color: #FFF;
  background-color: #FF6600;
}

.bg-body-tertiary {
  --bs-bg-opacity: 0;
  background-color: #FFF;
}

.navbar>.container-fluid {
  display: inline;
}

/* End Responsive Menu */











.btn { width: 100%; height: 38px; color: #666;	border: 1px solid #999; }
.btn:hover { color: #FFF !important; background: #FF6600 !important; }

.btn-disable { width: 100%; height: 38px; color: #CCC;	border: 1px solid #999; }
.btn-disable:hover { color: #CCC !important; background: #FAFAFA !important; }


/* Start Bootstrap custom CSS */
.container { xdisplay: table; width: 60vw; }
/* End Bootstrap custom CSS */

.com-hea-tit-img-wit-bor { background-image: url('../images/bg_stripes.gif'); font-weight: bold; border-color: #CCC; border-style: solid; border-width: 1px 1px 1px 1px; text-align: center; height: 25px;}
.com-hea-tit-img-no-bor { background-image: url('../images/bg_stripes.gif'); font-weight: bold; height: 25px; }
.com-hea-fie-bgc { background-color: #D0D0D0; border: solid 0px; border-width: 0 1px 0 0; border-color: #E9E9E9; font-weight: bold; }
.com-hea-con-bgc { background-color: #E9E9E9; border: solid 1px; border-color: #CCC; }

.com-l { text-align: left; padding-left: 2px; }
.com-c { text-align: center; }
.com-r { text-align: right; }
.com-col1 { color: #666666; font-size: 18px; font-weight: bold; xborder: solid 1px; }
.com-col2 { xcolor: #FF6600; font-size: 18px; font-weight: normal; xborder: solid 1px; }
.com-wid1666 { width: 16.66%; }
.com-wid20 { width: 20%; }
.com-hei7 { height: 7px; }
.com-hei20 { height: 20px; }
.com-hei50 { height: 50px; }
.com-col-re { color: #FF0000; }




/* testing only */
.col-md-1-5 { width: 12.5%; } /* = 8,3333 + 4,16667 */
.col-md-2-5 { width: 20.83333%; } /* = 16,6666 + 4,16667 */
.col-md-3-5 { width: 29.16667%; } /* = 25 + 4,16667 */
.col-md-4-5 { width: 37.5%; } /* = 33,3333 + 4,16667 */
.col-md-5-5 { width: 45.83333%; } /* = 41,6667 + 4,16667 */
.col-md-6-5 { width: 54.16667%; } /* = 50 + 4,16667 */
.col-md-7-5 { width: 62.5%; } /* = 58,3333 + 4,16667 */
.col-md-8-5 { width: 70.83333%; } /* = 66,6666 + 4,16667 */
.col-md-9-5 { width: 79.16667%; } /* = 75 + 4,16667 */
.col-md-10-5 { width: 87.5%; } /* = 83,3333 + 4,16667 */
.col-md-11-5 { width: 95.8333%; } /* = 91,6666 + 4,16667 */
/* end of testing */












/* Medium Devices, Desktop ----------- */
/*
@media screen and (min-width: 1401px) {
  .elementor img { max-width: 143px; margin-left: -80px;}
  .hfe-nav-menu { margin-left: -80px; }
}
*/

/* Medium Devices, Tablets ----------- */
/*
@media screen and (min-width: 1025px) and (max-width: 1200px) {
   .elementor img { xmax-width: 143px; margin-left: -0px;}
}
*/

/* Small Devices, Tablets ----------- */
/*
@media (min-width: 769px) and (max-width: 1024px) {
 .elementor img { xmax-width: 143px; margin-left: 0px;}
}
*/

/* Custom, Apple iPhone 16 Plus (160.9mm x 77.8mm) Mobile ----------- */

@media screen and (max-width: 768px) {
 .container { width: 100%; }
 .elementor img { max-width: 143px; margin-left: 0px;}
  body { xbackground-color: rgb(151, 114, 151);;}
}