/* <fixed-footer-support> */
html, body {
  height: 100%;
}
.wrapper {
  min-height: 100%;
  display: flex;
  flex-direction: column;
}
.content {
  flex: 1;
}
/* </fixed-footer-support> */

a {
  text-decoration: none;
}

#page-header {
  max-width: 2560px;
}

/* bootstrap overrides */
.border-bottom {
  border-bottom: 3px solid #eee!important;
}

.navbar {
  margin-bottom: 20px;
}

.nav-link:focus-visible {
  box-shadow: none;
  background-color: #eee;
}

.bd-placeholder-img {
  font-size: 1.125rem;
  text-anchor: middle;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
}

@media (min-width: 768px) {
  .bd-placeholder-img-lg {
    font-size: 3.5rem;
  }
}

/* Hide the offcanvas navbar when the viewport width is greater than or equal to 768px */
@media (min-width: 768px) {
  .product-item--width2 { width: 200px!important; }
  .offcanvas-collapse {
    display: none !important;
  }
}

@media (min-width: 576px) {
  .container, .container-sm {
    max-width: 100%;
  }
}

@media (min-width: 620px) {
  .product-item--width2 { width: 200px!important; }
  .product-item {padding: 15px;margin: 0!important;}
  div.product-item a {
    font-size: 14px!important;

  }
  div.product-item p {
    /*color: #6c757d!important;*/
  }
  div.product-item .specs {
    /*margin-top: 6px;*/
    margin-top: 0.5em;
    font-size: 14px;
    color: #666;
  }
}


/* Show the footer when the viewport height is higher than 600px */
@media (max-height: 360px) {
  .footer {
    /*display: none;*/
  }
  .fixed-bottom {
    position: inherit;
  }
}

@media (max-width: 6000px) {
  #product .featureGroup {width: calc((100%/4) - 32px)!important;}
  #product .featureGroup.image-item-140 {width: calc((100%/4) - 32px)!important;}
  .product-item--width2 { width: calc(100% / 10) !important; }
  .product-item {padding: 20px;margin: 0!important;}
}
@media (max-width: 2560px) {
  .product-item--width2 { width: calc(100% / 8) !important; }
  .product-item {padding: 20px;margin: 0!important;}
}
@media (max-width: 1920px) {
  #product .featureGroup {width: calc((100%/4) - 32px)!important;}
  #product .featureGroup.image-item-140 {width: calc((100%/4) - 32px)!important;}
  .product-item--width2 { width: calc(100% / 6) !important; }
  .product-item {padding: 20px;margin: 0!important;}
}
@media (max-width: 1720px) {
  #product .featureGroup {width: calc((100%/3) - 32px)!important;}
  #product .featureGroup.image-item-140 {width: calc((100%/6) - 32px)!important;}
  #product .featureGroup.store {width: calc((100%/6) - 32px)!important;}
  .product-item--width2 { width: calc(100% / 5) !important; }
  .product-item {padding: 20px;margin: 0!important;}
}
@media (max-width: 1280px) {
  #product .featureGroup {width: calc((100%/3) - 32px)!important;}
  #product .featureGroup.image-item-140 {width: calc((100%/3) - 32px)!important;}
  #product .featureGroup.store {width: calc((100%/3) - 32px)!important;}
  .product-item--width2 { width: calc(100% / 4) !important; }
  .product-item {padding: 20px;margin: 0!important;}
}
/* This CSS will apply only when the screen size is extra large (xl) or larger */
/*@media (min-width: 1200px) {
  .left-border {
    padding: 0 1em;border-left: 1px solid #ddd;
  }
}*/
@media (max-width: 1080px) {
  #product .featureGroup {width: calc((100%/2) - 32px)!important;}
  #product .featureGroup.image-item-140 {width: calc((100%/4) - 32px)!important;}
  .product-item--width2 { width: calc(100% / 3) !important; }
  .product-item {padding: 20px;margin: 0!important;}
}
@media (max-width: 820px) {
  .product-item--width2 { width: calc(100% / 3) !important; }
  .product-item {padding: 10px;margin: 0!important;}
}
@media (max-width: 710px) {
  #product .featureGroup {width: calc((100%) - 20px)!important;margin: 0.5em!important;}
  #product .featureGroup.image-item-140 {width: calc((100%/2) - 20px)!important;margin: 0.5em!important;}
  .product-item--width2 { width: calc(100% / 2) !important; }
  .product-item {padding: 10px;margin: 0!important;}

  .row>* {
    padding-right: 0!important;
    padding-left: 0!important;
  }

  .container-sm {
    --bs-gutter-x: 0;
  }
}
@media (max-width: 500px) {
  .product-item--width2 { width: 50%!important;}
  .product-item {padding: 10px;margin: 0!important;}
}
@media (max-width: 440px) {
  .product-item--width2 { width: 50%!important; }
  .product-item {padding: 10px;margin: 0!important;}
}
@media (max-width: 360px) {
  .product-item--width2 { width: 100%!important; min-width: 200px;}
  .product-item {padding: 0;margin: 0!important;}
}

.logo .l-o {font-weight: 700;color: limegreen;}
.logo .l-p {font-weight: 700;color: #00b3ee;}
.logo .l-t {font-weight: 700;color: rebeccapurple;}
.logo .l-u {font-weight: 700;color: deeppink;}
.logo .l-r {font-weight: 700;color: red;}
.logo .l-i {font-weight: 700;color: orange;}
.logo .l-a {font-weight: 700;color: gold;}
.logo .l-com {margin-left: 0.4em;color: #888;}
.logo .l-se {margin-left: 0.6em;font-weight: 600;color: gold;height: 36px;font-size: 16px;}
.logo .l-se:hover {margin-left: 0.6em;font-weight: 600;color: limegreen;height: 36px;font-size: 16px;}
.logo .l-se-sm {margin-left: 0.6em;font-weight: 600;color: gold;font-size: 12px;height: 26px;align-content: baseline;}
.logo .l-se-sm:hover {margin-left: 0.6em;font-weight: 600;color: limegreen;font-size: 12px;height: 26px;align-content: baseline;}


li.slogan {color: #888;font-weight: 200;}
a.slogan {text-decoration: none;}
.slogan .service {color: #000;font-weight: bold;}
.slogan .marketAndCompany {font-weight: 200;color: #000}
.slogan .creation {font-weight: 200; color: #000;}

td.info {
  padding: 0 2em;
}
.info a {
  color: rebeccapurple;
  text-decoration: none;
  font-weight: 300;
}
i.icon-plus-sign {
  color: rebeccapurple;
}

i.icon-plus-sign:hover {
  color: deeppink;
}

.forum a {
  color: rebeccapurple;
}

.b-example-divider {
  width: 100%;
  height: 3rem;
  background-color: rgba(0, 0, 0, .1);
  border: solid rgba(0, 0, 0, .15);
  border-width: 1px 0;
  box-shadow: inset 0 .5em 1.5em rgba(0, 0, 0, .1), inset 0 .125em .5em rgba(0, 0, 0, .15);
}

.b-example-vr {
  flex-shrink: 0;
  width: 1.5rem;
  height: 100vh;
}

.bi {
  vertical-align: -.125em;
  fill: currentColor;
}

.nav-scroller {
  position: relative;
  z-index: 2;
  height: 2.75rem;
  overflow-y: hidden;
}

.nav-scroller .nav {
  display: flex;
  flex-wrap: nowrap;
  padding-bottom: 1rem;
  margin-top: -1px;
  overflow-x: auto;
  text-align: center;
  white-space: nowrap;
  -webkit-overflow-scrolling: touch;
}

.footer h5 {
  color: #888;
  font-size: smaller;
}

#new-search .search-focus-visible {display: none;}
#new-search:focus-visible .search-focus-visible {display: block;}
#new-search:focus-visible .search-default {display: none;}
#new-search:focus-visible {background-color: #6c757d!important;border: 1px solid #6c757d;outline:none; box-shadow: 0 0 0 0.25rem #bbb;}

#filter-menu-left {
  border-right: 3px solid #eee;
}

.btn-filter {
  background-color: #ccc;
  color: #fff;
  border-radius: 0;
  height: 38px;

}
a.btn.btn-filter {
  background-color: #eee;
  margin-left: 1px;
  border-radius: 20px;
  width: 40px;
}

.btn-group.btn-group-discrete button.btn {
 color: #ccc;
 background-color: #fff;
 border-color: #ddd;
}

.btn-group.btn-group-discrete button.btn.btn-secondary {
  /*background-color: #eee;
  border-color: #ddd;*/
}
.btn-group.btn-group-discrete button.btn.btn-secondary svg {
  color: #000;
}

.btn-group.btn-group-discrete button.btn.btn-secondary.active {
  color: #fff;
  background-color: limegreen;
  border-color: limegreen;
}
.btn-group.btn-group-discrete button.btn.btn-secondary.active svg {
  color: #fff;
}

.btn-group.btn-group-discrete button.btn.btn-secondary.active:hover {
  color: #fff;
  background-color: limegreen;
  border-color: limegreen;
}

.btn-group.btn-group-discrete button.btn.btn-secondary:hover {
  color: #000;
  background-color: #eee;
  border-color: #ddd;
}

.btn-backspace {
  height: 38px;
}
.btn-backspace:hover, .btn-backspace:focus {
  background-color: #6c757d;
  color: #fff;
  border-color: #6c757d;
  box-shadow: none;
}

.btn-filter:hover {
  background-color: limegreen;
  border-color: limegreen;
  color: #fff;
}

.btn-filter:focus {
  background-color: #6c757d;
  border-color: #6c757d;
  color: #000;
}

.btn-filter:active {
  background-color: #6c757d;
  /*border-color: #6c757d;*/
  color: #000;
}

.btn-filter-selected {
  background-color: limegreen;
  border-color: limegreen;
  color: #fff;
}

.btn-filter-selected:hover {
  background-color: darkgreen!important;
  border-color: darkgreen;
}

.btn-filter-selected:focus {
  background-color: darkgreen!important;
  border-color: darkgreen;
}

.btn-outline-secondary {
  border-color: #dee2e6;
}

.btn-tertiary {
  background-color: #ccc;
  color: #fff;
}

a.text-search, em.text-search, span.text-search {
  color: limegreen;
}

#search-panel {

}

.product-item .btn-filter {
  position: absolute;
  right: 0;
}
.product-item img {
  display: block;
}

.search-matches {
  /*color: limegreen;*/
  color: #00b3ee;
  font-weight: 400;
}

button.btn.btn-secondary {
   background-color: #ccc;
   border-color: #fff;
 }
button.btn.btn-secondary:hover {
  background-color: #000;
  color: #ccc  ;
}

#filterModalLabel.modal-title {
  color: limegreen;
}

.page-link {
  color: #0b0b0b;
}

.active .page-link {
  color: #00b3ee;
  background-color: #fff;
  border-color: #00b3ee;
}

.page-link:hover {
  color: #00b3ee;
}

.btn-bd-primary {
  --bd-violet-bg: #712cf9;
  --bd-violet-rgb: 112.520718, 44.062154, 249.437846;

  --bs-btn-font-weight: 600;
  --bs-btn-color: var(--bs-white);
  --bs-btn-bg: var(--bd-violet-bg);
  --bs-btn-border-color: var(--bd-violet-bg);
  --bs-btn-hover-color: var(--bs-white);
  --bs-btn-hover-bg: #6528e0;
  --bs-btn-hover-border-color: #6528e0;
  --bs-btn-focus-shadow-rgb: var(--bd-violet-rgb);
  --bs-btn-active-color: var(--bs-btn-hover-color);
  --bs-btn-active-bg: #5a23c8;
  --bs-btn-active-border-color: #5a23c8;
}

.bd-mode-toggle {
  z-index: 1500;
}

.bd-mode-toggle .dropdown-menu .active .bi {
  display: block !important;
}

/* search input field */
 .form-control:focus {
   border-color: #888;
   outline: 0;
   box-shadow: none;
 }
.form-control:hover {
  box-shadow: 0 .25rem 1rem rgba(0,0,0,.15)!important;
}

.bd-placeholder-img {
  font-size: 1.125rem;
  text-anchor: middle;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
}

@media (min-width: 1000px) {
  .container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
    max-width: 2560px;
  }
}

@media (min-width: 768px) {
  .container, .container-md, .container-sm {
    max-width: 2560px;
  }
}

@media (min-width: 768px) {
  .bd-placeholder-img-lg {
    font-size: 3.5rem;
  }
}

.b-example-divider {
  width: 100%;
  height: 3rem;
  background-color: rgba(0, 0, 0, .1);
  border: solid rgba(0, 0, 0, .15);
  border-width: 1px 0;
  box-shadow: inset 0 .5em 1.5em rgba(0, 0, 0, .1), inset 0 .125em .5em rgba(0, 0, 0, .15);
}

.b-example-vr {
  flex-shrink: 0;
  width: 1.5rem;
  height: 100vh;
}

.bi {
  vertical-align: -.125em;
  fill: currentColor;
}

.nav-scroller {
  position: relative;
  z-index: 2;
  height: 2.75rem;
  overflow-y: hidden;
}

.nav-scroller .nav {
  display: flex;
  flex-wrap: nowrap;
  padding-bottom: 1rem;
  margin-top: -1px;
  overflow-x: auto;
  text-align: center;
  white-space: nowrap;
  -webkit-overflow-scrolling: touch;
}

.btn-bd-primary {
  --bd-violet-bg: #712cf9;
  --bd-violet-rgb: 112.520718, 44.062154, 249.437846;

  --bs-btn-font-weight: 600;
  --bs-btn-color: var(--bs-white);
  --bs-btn-bg: var(--bd-violet-bg);
  --bs-btn-border-color: var(--bd-violet-bg);
  --bs-btn-hover-color: var(--bs-white);
  --bs-btn-hover-bg: #6528e0;
  --bs-btn-hover-border-color: #6528e0;
  --bs-btn-focus-shadow-rgb: var(--bd-violet-rgb);
  --bs-btn-active-color: var(--bs-btn-hover-color);
  --bs-btn-active-bg: #5a23c8;
  --bs-btn-active-border-color: #5a23c8;
}

.bd-mode-toggle {
  z-index: 1500;
}

.bd-mode-toggle .dropdown-menu .active .bi {
  display: block !important;
}

li.breadcrumb-item a {color: #000}
li.breadcrumb-item.active a {color: #00b3ee;text-decoration: none;}

/* product */
div.product-item a {
  text-decoration: none;
  /*color: #00b3ee;*/
  color: #000;
  font-size: 16px!important;
  /*font-weight: 600;*/
  font-weight: 300;
  text-align: -webkit-center;
}
div.product-item span.variant {
  font-weight: 100;
  color: #000;
  padding-left: 0.25em;
  line-break: auto;
  white-space: pre;
}
div.product-item:hover span.variant {
  color: #666;
}
div.product-item .specs {
  /*margin-top: 1em;*/
  cursor: pointer;
  margin-top: 0.5em;
  font-size: 13px;
}
div.product-item p {
  font-weight: 500;
  /*font-weight: 300;*/
  /*font-weight: 400;*/
  /*color: #000;*/
}
div.product-item span.featureName {
  /*font-weight: 100;*/
  font-weight: 300;
  color: #888;
}
/*div.product-item:hover a {
  color: #00b3ee;
}*/

.detailed-view .product-item {
  /*width: 260px;
  height: 400px;*/
  /* 300x360 works better on xx-small devices (such as iphone)*/
  /*width: 300px;
  height: 360px;*/
  /*
  margin-right: 10px;
  margin-bottom: 10px;
  overflow: inherit;
  font-size: 14px;
  padding: 10px;*/
  /*padding: 30px 30px;*/
}

.list-unstyled {
  color: #6c757d;
}