video,
.exampleImg {
  border: 5px solid rgb(47, 47, 47);
  background-color: grey;
  /* box-shadow: 5px 5px 5px rgb(111, 111, 111); */
}


img {
  height: 25vh;
}

.italic {
  font-style: italic;
}

.bold {
  font-weight: 800;
}

.monospace {
  font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace;

}

a {
  color: var(--aqua-dim)
}

a:hover {
  cursor: pointer;
}

.smaller {
  font-size: smaller;
}

.red {
  color: var(--red);
}

ol {
  margin: 0;
  padding: 0;
}

ul {
  padding-left: 0;
}

.flexContainer {
  display: flex;
}

.flexRow {
  flex-direction: column;
  flex-wrap: wrap;
}

.fontSizeButtons{
  display: flex;
  justify-content: center;
  padding: 30px;
}

.fontSizeButton {
  margin: 10px 20px;
  background-color: var(--bg_h);
  border: 2px solid white;
  padding: 6px 14px;
  border-radius: 10%;
  color: white;
}

.questionTextarea {
  display: block;
  margin: 0 auto;
  width: 60%;
  height: 30vh;
  font-family: var(--r-main-font);
  font-size: var(--r-main-font-size);
  color: var(--r-main-color);
  background-color: transparent;

  &:focus {
    outline: none;
  }

  /* &:active {
    all: unset;
    border-color: black;
  } */
}

.box {
  border: 5px solid #fbf1c7;
  border-radius: 15px;
  height: 50px;
  padding: 10px 0;
  margin: 10px 0;
}

.hierarchies {
  flex: 1;
  /* flex-basis: 1; */
}

.hierarchies > img {
  object-fit: contain;
}

.grid1x2 {
  display: grid;
  grid-template-columns: 3fr 2fr;
}

.grid2x5 {
  display: grid;
  grid-template-columns: 1fr 5fr;
  grid-template-rows: repeat(4, 1fr);
  row-gap: 15px;
}

.grid {
  display: grid;
  grid-template-columns: repeat(20, 1fr);
  grid-template-rows: repeat(6, 1fr);
  row-gap: 15px;
}

.grid10rows {
  display: grid;
  grid-template-columns: repeat(20, 1fr);
  grid-template-rows: repeat(10, 1fr);
  row-gap: 15px;
}

.grid14rows {
  display: grid;
  grid-template-columns: repeat(20, 1fr);
  grid-template-rows: repeat(14, 1fr);
  row-gap: 15px;
}

.no-margin {
  margin: 0;
}

/* .p-simple {
  all: unset;
  padding: -30px;
  margin: -30px;
  line-height: normal;
} */

.gridBox {
  /* border: 5px solid rgb(255, 255, 255); */
  /* border-radius: 10px; */
  height: 100%;
  width: 100%;
  margin: 5px 0;
  padding: 0;
}

.bg-white {
  background-color: white;
}

.bg-green {
  background-color: var(--green);
}

.bg-aqua {
  background-color: var(--aqua);
}

.bg-red {
  background-color: var(--red);
}

.bg-purple {
  background-color: var(--purple);
}

.bg-blue {
  background-color: var(--blue);
}

.bg-gray {
  background-color: var(--gray);
}

.bg-orange {
  background-color: var(--orange);
}

.bg-yellow {
  background-color: var(--yellow);
}

.bg-blue-dim {
  background-color: var(--blue-dim);
}

.bg-purple-dim {
  background-color: var(--purple-dim);
}

.bg-first-release {
  /* box-sizing: border-box; */
  background: #fabd2f;
  background: linear-gradient(
    140deg,
    rgba(250, 189, 47, 1) 0%,
    rgba(211, 134, 155, 1) 51%,
    rgba(142, 192, 124, 1) 100%
  );
  /* border: 6px solid var(--purple); */
}

.bg-second-release {
  /* box-sizing: border-box; */
  background: #fabd2f;
  background: linear-gradient(
    140deg,
    var(--aqua) 0%,
    var(--blue) 51%,
    var(--green) 100%
  );
  /* border: 6px solid var(--purple); */
}

.commitMsg {
  /* width: 80%; */
  /* margin: 20px 8% 0 12% ; */
  margin: 20px 0;
  font-size: 2rem;
}

.largeContainer {
  width: 100%;
  height: 50vh;
}

.text-align-left {
  text-align: left;
}

.roundCorner10 {
  border-radius: 10%;
}

.mediaPkg-container {
  position: absolute;
  width: 40%;
  top: 17%;
  left: 50%;
  padding: 15px;
  z-index: 2;
  border: 8px solid var(--bg_s);
  border-radius: 10%;
}

.backdropFilter {
  position: absolute;
  /* background-color: aliceblue; */
  width: 90%;
  height: 70%;
  top: 20%;
  left: 15%;
  backdrop-filter: saturate(0.3);
  /* backdrop-filter: blur(2px); */
}

.border-aqua-dim {
  border: 10px solid var(--aqua-dim);
}

.border-purple-dim {
  border: 10px solid var(--purple);
}

.mediaPkg-item {
  font-size: smaller;
  text-align: left;
  list-style-type: none;
  margin: 0;
  padding: 0;
}

.media-package__download-version {
  margin: 0;
  font-size: 1.3rem;
    text-align: left;

  padding: 0;
  padding-left: 15px
}

.challenges__list-item {
  font-size: 2.2rem;
}

.reveal .slides section:has(.challenges__list-item) .r-stack img {
  height: 37.5vh;
  width: auto;
}