.container-fluid.outer {
  max-width: 100rem;
}
h1 {
  color: white;
  text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;
}
.navbar {
  background-color: black;
  box-shadow: 0 4px 15px 0 rgba(83, 176, 57, 0.75);
}
.main-catch {
  padding: 1rem;
  margin: 1rem;
  margin-top: 3rem;
  border-radius: 1rem;
  background-image: linear-gradient(to right, #009245, #FCEE21, #00A8C5, #D9E021);
  box-shadow: 0 4px 50px 0 rgba(83, 176, 57, 0.75);
}
.mainPunch {
  font-weight: 900;
  letter-spacing: -0.1em;
}
.main-image {
  margin-top: 5em;
  border-radius: 100%;
  box-shadow: 0 4px 50px 0 rgba(202, 0, 169, 0.75);
}
#carouselPraise {
  height: 50rem;
}
#carouselPraise img {
  border-radius: 1rem;
  box-shadow: 0 4px 50px 0 rgba(83, 176, 57, 0.75);
}
.typewriter {
  font-family: 'FiraCode';
  background-color: black;
  color: greenyellow;
  margin: 1em;
  padding: 1em;
  text-align: left;
}
.highlightbox {
  margin: 50px auto;
  width: 300px;
  height: 300px;
  max-width: calc(100% - 60px);
  background: #fffbaf;
  position: relative;
  border: 2px solid #111;
}
.highlightbox ::before {
  content: "";
  position: absolute;
  z-index: -1;
  width: 100%;
  height: 100%;
  top: 20px;
  left: 20px;
  border-radius: 7px;
  /*        background: repeating-linear-gradient( 45deg, #d4c481, #d4c481 2px, transparent 2px, transparent 6px );
        transition: all 0.3s ease;*/
  background-image: linear-gradient(to right, #f5ce62, #e43603, #fa7199, #e85a19);
  box-shadow: 0 4px 15px 0 rgba(229, 66, 10, 0.75);
}
.bubble {
  --r: 1em;
  /* the radius */
  --t: 1.5em;
  /* the size of the tail */
  max-width: 300px;
  padding: 1em;
  border-inline: var(--t) solid #0000;
  border-radius: calc(var(--r) + var(--t))/var(--r);
  mask: radial-gradient(100% 100% at var(--_p) 0, #0000 99%, #000 102%) var(--_p) 100%/var(--t) var(--t) no-repeat, linear-gradient(#000 0 0) padding-box;
  background: linear-gradient(135deg, #FE6D00, #1384C5) border-box;
  color: #fff;
  margin: auto;
  margin-bottom: 1em;
}
.bubble.left {
  --_p: 0;
  border-bottom-left-radius: 0 0;
  place-self: start;
}
.bubble.right {
  --_p: 100%;
  border-bottom-right-radius: 0 0;
  place-self: end;
}
