:root {
  --brand: #FF3130;
}

.gradbg-blue {
  background-color: #F8F0EC;
  background-image: radial-gradient(farthest-side at 100% 100%, #A3C9ED, #F8F0EC);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: bottom right;
  background-attachment: fixed;

/*
  font-family: "Montserrat", sans-serif;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
*/
}

.gradbg-grey {
  background-color: #F8F0EC;
  background-image: radial-gradient(farthest-side at 100% 100%, #D6D6D6, #FFFFFF);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: bottom right;
}

.banner-bg {
  background-image: url('/images/banner.png');
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  min-height: 80vh;
}

.banner-bg .container {
  background-color: rgba(255,255,255,0.65);
  border-radius: 1em;
  backdrop-filter: blur(10px);
}

@media (prefers-color-scheme: dark) {
  .gradbg-blue {
    background-color: #1F2937;
    background-image: radial-gradient(farthest-side at 100% 100%, #193890, #1F2937);
  }

  .gradbg-grey {
    background-color: #1F2937;
    background-image: radial-gradient(farthest-side at 100% 100%, #0D0D0D, #272727);
  }

  .banner-bg .container {
    background-color: rgba(33,37,42,0.65);
  }
}

.socialbanner a {
  text-shadow: 1px 2px 3px rgba(100,100,100,0.5);
  display: flex;
  align-items: center;
}

.socialbanner a:hover {
  text-shadow: 2px 4px 5px rgba(100,100,100,0.5);
}

/*
@media (prefers-color-scheme: dark) {
  .socialbanner a {
    text-shadow: 1px 2px 7px rgba(200,200,200,0.5);
  }

  .socialbanner a:hover {
    text-shadow: 1px 4px 9px rgba(200,200,200,0.5);
  }
}
*/

.text-brown {
  color: #654321;
}

.list-group-scroll {
  max-height: 310px;
  overflow: auto;
}

#ytfeed {
  overflow-x: auto;
  white-space: nowrap;
}

#ytfeed > div {
  display: inline-block;
  width: 250px;
  padding-right: 20px;
}

body >.container,
div.card-body >.container {
  padding-top: 2rem;
  padding-bottom: 2rem;
}

.card-header :is(h1,h2,h3,h4,h5,h6) {
  margin-bottom: 0px;
}

.prodrow:hover .buybtn {
  font-weight: bold;
/*
  color: var(--brand);
*/
}

a[name] {
  position: relative;
  top: -80px;
}

.minilogo {
  height: 25px;
}

#menunav {
  z-index: 1000;

  font-family: "Bagel Fat One", system-ui;
  font-weight: 400;
  font-style: normal;
}

.sticky-bottom {
    position: -webkit-sticky;
    position: sticky;
    bottom: 0;
    z-index: 920;
}

.blackboard {
  background-color: #000;
  min-height: 90vh;
  color: #fff;
  padding: 1em;
}

.blackboard :is(h1,h2,h3,h4,h5,.list-group) {
  font-family: "Special Elite", system-ui;
  font-weight: 400;
  font-style: normal;
}

.fs-7 {
  font-size: 0.8rem;
}

.available-0 {
  display: none !important;
}