/* Bootstrap Colours Start */
/* Bootstrap Colours End */
/* Theme accents start */
/* Theme accents end */
:root {
  --font-family-base: "NotoSansRegular", sans-serif;
  --dark-1: #4B3922;
  --light-1: #E6D3B3;
  --dark-2: #3F3326;
  --light-2: #B39C75;
  --foreground-1: #4B3922;
  --foreground-2: #3F3326;
  --background-1: #E6D3B3;
  --background-2: #B39C75;
  --accent-1: #070605;
  --accent-2: #4B3A24;
  --accent-3: #5E4524;
  --accent-4: #A28969;
  --accent-5: #FFFFFF;
  --accent-6: #E6C577;
}

/* Font awesome. */
@font-face {
  font-family: "fontawesome";
  font-style: normal;
  font-weight: normal;
  src: url(../plugins/fontawesome/webfonts/fa-solid-900.woff2);
}
/* NotoSans. */
@font-face {
  font-family: "Noto Sans";
  font-style: normal;
  font-weight: normal;
  src: url(../fonts/NotoSans/NotoSans-Regular.ttf);
}
@font-face {
  font-family: "NotoSansRegular";
  font-style: normal;
  font-weight: normal;
  src: url(../fonts/NotoSans/NotoSans-Regular.ttf);
}
@font-face {
  font-family: "NotoSansEthiopic";
  font-style: normal;
  font-weight: normal;
  src: url(../fonts/NotoSans/NotoSansEthiopic-Regular.ttf);
}
@font-face {
  font-family: "NotoSansArabic";
  font-style: normal;
  font-weight: normal;
  src: url(../fonts/NotoSans/NotoSansArabic-Regular.ttf);
}
@font-face {
  font-family: "NotoSansBengali";
  font-style: normal;
  font-weight: normal;
  src: url(../fonts/NotoSans/NotoSansBengali-Regular.ttf);
}
@font-face {
  font-family: "NotoSansDevanagari";
  font-style: normal;
  font-weight: normal;
  src: url(../fonts/NotoSans/NotoSansDevanagari-Regular.ttf);
}
@font-face {
  font-family: "NotoSansThaana";
  font-style: normal;
  font-weight: normal;
  src: url(../fonts/NotoSans/NotoSansThaana-Regular.ttf);
}
@font-face {
  font-family: "NotoSansGujarati";
  font-style: normal;
  font-weight: normal;
  src: url(../fonts/NotoSans/NotoSansGujarati-Regular.ttf);
}
@font-face {
  font-family: "NotoSansHebrew";
  font-style: normal;
  font-weight: normal;
  src: url(../fonts/NotoSans/NotoSansHebrew-Regular.ttf);
}
@font-face {
  font-family: "NotoSansHebrew";
  font-style: normal;
  font-weight: normal;
  src: url(../fonts/NotoSans/NotoSansHebrew-Regular.ttf);
}
@font-face {
  font-family: "NotoSansCanadianAboriginal";
  font-style: normal;
  font-weight: normal;
  src: url(../fonts/NotoSans/NotoSansCanadianAboriginal-Regular.ttf);
}
@font-face {
  font-family: "NotoSansGeorgian";
  font-style: normal;
  font-weight: normal;
  src: url(../fonts/NotoSans/NotoSansGeorgian-Regular.ttf);
}
@font-face {
  font-family: "NotoSansMeeteiMayek";
  font-style: normal;
  font-weight: normal;
  src: url(../fonts/NotoSans/NotoSansMeeteiMayek-Regular.ttf);
}
@font-face {
  font-family: "NotoSansKhmer";
  font-style: normal;
  font-weight: normal;
  src: url(../fonts/NotoSans/NotoSansKhmer-Regular.ttf);
}
@font-face {
  font-family: "NotoSansKannada";
  font-style: normal;
  font-weight: normal;
  src: url(../fonts/NotoSans/NotoSansKannada-Regular.ttf);
}
@font-face {
  font-family: "NotoSansLao";
  font-style: normal;
  font-weight: normal;
  src: url(../fonts/NotoSans/NotoSansLao-Regular.ttf);
}
@font-face {
  font-family: "NotoSansMalayalam";
  font-style: normal;
  font-weight: normal;
  src: url(../fonts/NotoSans/NotoSansMalayalam-Regular.ttf);
}
@font-face {
  font-family: "NotoSansMongolian";
  font-style: normal;
  font-weight: normal;
  src: url(../fonts/NotoSans/NotoSansMongolian-Regular.ttf);
}
@font-face {
  font-family: "NotoSansMyanmar";
  font-style: normal;
  font-weight: normal;
  src: url(../fonts/NotoSans/NotoSansMyanmar-Regular.ttf);
}
@font-face {
  font-family: "NotoSansOriya";
  font-style: normal;
  font-weight: normal;
  src: url(../fonts/NotoSans/NotoSansOriya-Regular.ttf);
}
@font-face {
  font-family: "NotoSansGurmukhi";
  font-style: normal;
  font-weight: normal;
  src: url(../fonts/NotoSans/NotoSansLao-Regular.ttf);
}
@font-face {
  font-family: "NotoSansSinhala";
  font-style: normal;
  font-weight: normal;
  src: url(../fonts/NotoSans/NotoSansLao-Regular.ttf);
}
@font-face {
  font-family: "NotoSansTamil";
  font-style: normal;
  font-weight: normal;
  src: url(../fonts/NotoSans/NotoSansLao-Regular.ttf);
}
@font-face {
  font-family: "NotoSansTelugu";
  font-style: normal;
  font-weight: normal;
  src: url(../fonts/NotoSans/NotoSansLao-Regular.ttf);
}
@font-face {
  font-family: "NotoSansThai";
  font-style: normal;
  font-weight: normal;
  src: url(../fonts/NotoSans/NotoSansLao-Regular.ttf);
}
/* Noto Serif. */
@font-face {
  font-family: "NotoSerifTibetan";
  font-style: normal;
  font-weight: normal;
  src: url(../fonts/NotoSans/NotoSerifTibetan-Regular.ttf);
}
/* Controls */
/* Bootstrap Colours Start */
/* Bootstrap Colours End */
/* Theme accents start */
/* Theme accents end */
:root {
  --font-family-base: "NotoSansRegular", sans-serif;
  --dark-1: #4B3922;
  --light-1: #E6D3B3;
  --dark-2: #3F3326;
  --light-2: #B39C75;
  --foreground-1: #4B3922;
  --foreground-2: #3F3326;
  --background-1: #E6D3B3;
  --background-2: #B39C75;
  --accent-1: #070605;
  --accent-2: #4B3A24;
  --accent-3: #5E4524;
  --accent-4: #A28969;
  --accent-5: #FFFFFF;
  --accent-6: #E6C577;
}

.custom-radio input[type=radio] {
  display: none;
}

.custom-radio label {
  cursor: pointer;
  padding: 8px 16px;
  border: none;
  border-radius: 50%;
  margin-right: 10px;
  transition: all 0.3s;
}

.custom-radio input[type=radio]:checked + label {
  background: rgba(255, 255, 255, 0.25);
  color: var(--light-1);
  box-shadow: rgb(162, 137, 105) 1px 1px 4px;
}

/* Helpers */
/* Bootstrap Colours Start */
/* Bootstrap Colours End */
/* Theme accents start */
/* Theme accents end */
:root {
  --font-family-base: "NotoSansRegular", sans-serif;
  --dark-1: #4B3922;
  --light-1: #E6D3B3;
  --dark-2: #3F3326;
  --light-2: #B39C75;
  --foreground-1: #4B3922;
  --foreground-2: #3F3326;
  --background-1: #E6D3B3;
  --background-2: #B39C75;
  --accent-1: #070605;
  --accent-2: #4B3A24;
  --accent-3: #5E4524;
  --accent-4: #A28969;
  --accent-5: #FFFFFF;
  --accent-6: #E6C577;
}

.information-pane,
.content-information-pane {
  display: flex;
  width: 100%;
  height: 100%;
}
.information-pane .adventure-map,
.content-information-pane .adventure-map {
  width: 100%;
  height: 100%;
}
.information-pane .achievements,
.content-information-pane .achievements {
  overflow-y: auto;
  box-sizing: border-box;
  position: relative;
}
.information-pane .achievements .achievement-list,
.content-information-pane .achievements .achievement-list {
  background-image: url(../images/background-textures/brick-wall-texture.jpg);
  background-repeat: repeat-y;
  background-size: contain;
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding-top: 16px;
  padding-bottom: 16px;
  position: relative;
  z-index: 1;
}
.information-pane .achievements .achievement-list .achievement-item,
.content-information-pane .achievements .achievement-list .achievement-item {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 16px 20px;
  width: 90%;
  max-width: 100%;
  margin: 0 auto;
  background: radial-gradient(ellipse at center, #E6D3B3 0%, #A28969 100%);
  border-radius: 8px;
  border: 2px ridge #E6C577;
  box-shadow: inset 0px 0px 2px #070605;
  backdrop-filter: blur(3px);
  transition: transform 0.2s ease;
  position: relative;
}
.information-pane .achievements .achievement-list .achievement-item img,
.content-information-pane .achievements .achievement-list .achievement-item img {
  width: 64px;
  height: 64px;
  object-fit: contain;
  border-radius: 4px;
  filter: grayscale(100%);
  transition: filter 0.3s, opacity 0.3s;
}
.information-pane .achievements .achievement-list .achievement-item .unlocked,
.content-information-pane .achievements .achievement-list .achievement-item .unlocked {
  filter: grayscale(0) !important;
}
.information-pane .achievements .achievement-list .achievement-item .text,
.content-information-pane .achievements .achievement-list .achievement-item .text {
  display: flex;
  flex-direction: column;
  color: #4B3922;
  font-size: 16px;
}
.information-pane .achievements .achievement-list .achievement-item .text h3,
.content-information-pane .achievements .achievement-list .achievement-item .text h3 {
  margin: 0;
  font-size: 16px;
  font-weight: bold;
}
.information-pane .achievements .achievement-list .achievement-item .text p,
.content-information-pane .achievements .achievement-list .achievement-item .text p {
  margin: 4px 0 0;
  font-size: 16px;
}
.information-pane .journal .journal-container, .information-pane .debug .journal-container,
.content-information-pane .journal .journal-container,
.content-information-pane .debug .journal-container {
  display: flex;
  flex-direction: column;
  height: 100%;
  overflow-y: auto;
  padding: 16px;
  font-size: 16px;
}
.information-pane .journal .journal-container .journal-entry, .information-pane .debug .journal-container .journal-entry,
.content-information-pane .journal .journal-container .journal-entry,
.content-information-pane .debug .journal-container .journal-entry {
  display: flex;
  flex-direction: row;
  align-items: baseline;
  margin-bottom: 16px;
  gap: 16px;
}
.information-pane .home,
.content-information-pane .home {
  overflow-y: auto;
  box-sizing: border-box;
  position: relative;
  padding: 16px;
}
.information-pane .home .title,
.content-information-pane .home .title {
  margin-bottom: 20px;
}
.information-pane .home .branding,
.content-information-pane .home .branding {
  color: #4B3922;
  justify-content: center;
  display: flex;
  gap: 20px;
  align-items: center;
  margin-bottom: 20px;
}
.information-pane .home .branding img,
.content-information-pane .home .branding img {
  display: inline-block;
  max-width: 300px;
  width: 100%;
}
.information-pane .home .text-holder,
.content-information-pane .home .text-holder {
  color: #4B3922;
  font-size: 1rem;
  margin-bottom: 20px;
}
.information-pane .home .text-holder .award-wrapper,
.content-information-pane .home .text-holder .award-wrapper {
  display: flex;
  gap: 20px;
  flex-wrap: wrap;
  justify-content: center;
}
.information-pane .home .text-holder .award-wrapper img,
.content-information-pane .home .text-holder .award-wrapper img {
  display: inline-block;
  max-width: 200px;
  width: 100%;
}
.information-pane .home .call-to-action-holder,
.content-information-pane .home .call-to-action-holder {
  display: flex;
  flex-direction: column;
  gap: 20px;
  justify-content: space-around;
}
.information-pane .home .setting-group,
.content-information-pane .home .setting-group {
  display: flex;
  flex-direction: column;
  width: 100%;
  margin-bottom: 20px;
  color: #4B3922;
  gap: 16px;
}
.information-pane .home .setting-group label,
.content-information-pane .home .setting-group label {
  font-size: 20px;
}
.information-pane .home .setting-group .toggle-group,
.content-information-pane .home .setting-group .toggle-group {
  display: flex;
  flex-direction: row;
  gap: 10px;
}
.information-pane .home .setting-group .toggle,
.content-information-pane .home .setting-group .toggle {
  display: flex;
  flex-direction: row;
  gap: 5px;
  align-items: center;
}
.information-pane .home .setting-group .toggle label,
.content-information-pane .home .setting-group .toggle label {
  font-size: 16px;
}
.information-pane .home .setting-group .range,
.content-information-pane .home .setting-group .range {
  display: flex;
  flex-direction: row;
  gap: 16px;
  align-items: center;
  width: 200px;
  margin-left: 10px;
  margin-right: 10px;
}
.information-pane .home .setting-group .range .e-control.e-slider .e-slider-track,
.content-information-pane .home .setting-group .range .e-control.e-slider .e-slider-track {
  height: 10px;
  top: calc(50% - 5px);
}
.information-pane .home .setting-group .range .e-control-wrapper.e-slider-container.e-horizontal .e-range,
.content-information-pane .home .setting-group .range .e-control-wrapper.e-slider-container.e-horizontal .e-range {
  height: 10px;
  top: calc(50% - 5px);
}
.information-pane .home .setting-group .range .e-slider .e-handle,
.content-information-pane .home .setting-group .range .e-slider .e-handle {
  height: 20px;
  width: 20px;
}
.information-pane .home .setting-group .range .e-handle,
.content-information-pane .home .setting-group .range .e-handle {
  top: calc(50% - 10px);
  margin-left: -10px;
}
.information-pane .home .setting-group .range label,
.content-information-pane .home .setting-group .range label {
  font-size: 16px;
}
.information-pane .e-content,
.content-information-pane .e-content {
  height: 100% !important;
}

.content-information-pane {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  align-content: center;
  z-index: 10;
}
@media (min-width: 992px) {
  .content-information-pane {
    display: none;
  }
}

.information-pane .e-item {
  height: calc(100% - 34px);
}

.content-information-pane .e-item {
  height: 100%;
}

.information-pane-tab-control.e-tab .e-tab-header .e-toolbar-item .e-tab-wrap {
  color: #4B3922 !important;
}
.information-pane-tab-control.e-tab .e-tab-header.e-horizontal-bottom .e-toolbar-item.e-active,
.information-pane-tab-control.e-tab .e-tab-header:not(.e-vertical) .e-toolbar-item.e-active {
  border: 2px ridge #E6C577;
  border-top: none;
}
.information-pane-tab-control.e-tab .e-tab-header.e-horizontal-bottom .e-toolbar-item.e-active .e-tab-text,
.information-pane-tab-control.e-tab .e-tab-header.e-horizontal-bottom .e-toolbar-item.e-active .e-tab-icon,
.information-pane-tab-control.e-tab .e-tab-header:not(.e-vertical) .e-toolbar-item.e-active .e-tab-text,
.information-pane-tab-control.e-tab .e-tab-header:not(.e-vertical) .e-toolbar-item.e-active .e-tab-icon {
  color: #4B3922 !important;
}
.information-pane-tab-control.e-tab .e-tab-header .e-toolbar-item .e-tab-wrap:hover {
  background: radial-gradient(ellipse at center, #E6D3B3 0%, #A28969 100%);
  color: #4B3922 !important;
  border: 1px solid #5E4524;
  border-top: none;
}
.information-pane-tab-control.e-tab .e-tab-header .e-toolbar-item.e-active:hover {
  background: radial-gradient(ellipse at center, #E6D3B3 0%, #A28969 100%);
  color: #4B3922 !important;
}
.information-pane-tab-control.e-tab .e-tab-header::before,
.information-pane-tab-control.e-tab .e-tab-header:not(.e-vertical)::before {
  border-bottom: 2px ridge #E6C577;
}

@media (max-width: 991px) {
  .content-information-pane .information-pane-toolbar {
    display: flex;
    justify-content: end;
    width: 100%;
    height: 34px;
    border-bottom: 2px ridge #E6C577;
    background: #4B3A24;
  }
  .content-information-pane .information-pane-toolbar button {
    background: radial-gradient(ellipse at center, #E6D3B3 0%, #e0c8a0 100%);
    border: 2px ridge #E6C577;
    /*border: 1px solid black;*/
    border-radius: 5px;
    font-size: 20px;
    padding: 2px;
    width: 32px;
    height: 32px;
  }
  .restored .content-information-pane {
    height: calc(33vh + 8px);
    position: relative;
    border-top: 2px ridge #E6C577;
    padding: 0px;
  }
  .restored .content-information-pane .information-pane-tab-control .e-content {
    height: calc(33vh - 68px) !important;
  }
  .minimized .content-information-pane {
    height: 34px !important;
    position: relative;
  }
  .minimized .information-pane-toolbar {
    display: none !important;
  }
  .minimized .information-pane-tab-control .e-content {
    height: 0px !important;
    display: none;
  }
  .maximized .content-information-pane {
    position: absolute;
    height: 100%;
    top: 0;
    left: 0;
    width: 100%;
    background: radial-gradient(ellipse at center, #E6D3B3 0%, #e0c8a0 100%);
    border-top: 2px ridge #E6C577;
    padding: 0px;
  }
  .maximized .content-information-pane .information-pane-tab-control .e-content {
    height: calc(100vh - 110px) !important;
  }
}
/* Bootstrap Colours Start */
/* Bootstrap Colours End */
/* Theme accents start */
/* Theme accents end */
:root {
  --font-family-base: "NotoSansRegular", sans-serif;
  --dark-1: #4B3922;
  --light-1: #E6D3B3;
  --dark-2: #3F3326;
  --light-2: #B39C75;
  --foreground-1: #4B3922;
  --foreground-2: #3F3326;
  --background-1: #E6D3B3;
  --background-2: #B39C75;
  --accent-1: #070605;
  --accent-2: #4B3A24;
  --accent-3: #5E4524;
  --accent-4: #A28969;
  --accent-5: #FFFFFF;
  --accent-6: #E6C577;
}

.information-pane .leaderboard,
.content-information-pane .leaderboard {
  width: 100%;
  height: 100%;
  align-content: center;
  align-self: center;
  justify-content: center;
}
.information-pane .leaderboard .leaderboard-grid,
.content-information-pane .leaderboard .leaderboard-grid {
  height: 100%;
  border-color: transparent;
}
.information-pane .leaderboard .leaderboard-grid .e-gridheader,
.content-information-pane .leaderboard .leaderboard-grid .e-gridheader {
  background-color: #B39C75;
  border-bottom-color: transparent;
  border-top-color: transparent;
  color: #4B3922;
}
.information-pane .leaderboard .leaderboard-grid .e-gridheader .e-headercontent,
.content-information-pane .leaderboard .leaderboard-grid .e-gridheader .e-headercontent {
  background-color: transparent;
}
.information-pane .leaderboard .leaderboard-grid .e-gridheader .e-headercontent .e-icons,
.content-information-pane .leaderboard .leaderboard-grid .e-gridheader .e-headercontent .e-icons {
  color: #4B3922 !important;
}
.information-pane .leaderboard .leaderboard-grid .e-gridheader .e-headercontent .e-table,
.content-information-pane .leaderboard .leaderboard-grid .e-gridheader .e-headercontent .e-table {
  background-color: transparent;
}
.information-pane .leaderboard .leaderboard-grid .e-gridheader .e-headercontent .e-headercell,
.content-information-pane .leaderboard .leaderboard-grid .e-gridheader .e-headercontent .e-headercell {
  background-color: transparent !important;
}
.information-pane .leaderboard .leaderboard-grid .e-gridheader .e-headercontent .e-headercell .e-headercelldiv,
.content-information-pane .leaderboard .leaderboard-grid .e-gridheader .e-headercontent .e-headercell .e-headercelldiv {
  text-align: left !important;
}
.information-pane .leaderboard .leaderboard-grid .e-gridcontent,
.content-information-pane .leaderboard .leaderboard-grid .e-gridcontent {
  height: calc(100% - 33px);
  background-color: transparent;
}
.information-pane .leaderboard .leaderboard-grid .e-gridcontent .e-content,
.content-information-pane .leaderboard .leaderboard-grid .e-gridcontent .e-content {
  background-color: transparent;
}
.information-pane .leaderboard .leaderboard-grid .e-gridcontent .e-content .e-table,
.content-information-pane .leaderboard .leaderboard-grid .e-gridcontent .e-content .e-table {
  background-color: transparent;
}
.information-pane .leaderboard .leaderboard-grid .e-gridcontent .e-content .e-table td.e-rowcell,
.content-information-pane .leaderboard .leaderboard-grid .e-gridcontent .e-content .e-table td.e-rowcell {
  border-color: #A28969;
  color: #4B3922;
}

/* Bootstrap Colours Start */
/* Bootstrap Colours End */
/* Theme accents start */
/* Theme accents end */
:root {
  --font-family-base: "NotoSansRegular", sans-serif;
  --dark-1: #4B3922;
  --light-1: #E6D3B3;
  --dark-2: #3F3326;
  --light-2: #B39C75;
  --foreground-1: #4B3922;
  --foreground-2: #3F3326;
  --background-1: #E6D3B3;
  --background-2: #B39C75;
  --accent-1: #070605;
  --accent-2: #4B3A24;
  --accent-3: #5E4524;
  --accent-4: #A28969;
  --accent-5: #FFFFFF;
  --accent-6: #E6C577;
}

.early-access-page {
  display: flex;
  flex-direction: column;
}
.early-access-page .image-holder {
  margin-bottom: 20px;
}
.early-access-page .image-holder img {
  width: 100%;
  max-width: 100%;
  border: 2px ridge #E6C577;
  border-radius: 50px 0px;
}
.early-access-page .prefer-sound-holder .bold {
  font-weight: bold;
}
.early-access-page .prefer-sound-holder .button-wrapper {
  display: flex;
  gap: 10px;
  place-items: baseline;
}
.early-access-page .text-holder {
  text-align: left;
  margin-bottom: 10px;
}
.early-access-page .text-holder h1 {
  text-align: left;
}
.early-access-page .text-holder p {
  text-align: left;
  font-size: 16px;
}
.early-access-page .timer-holder {
  display: inline-flex;
  justify-content: center;
  margin-bottom: 10px;
}
.early-access-page .early-access-holder {
  display: inline-flex;
  justify-content: center;
  margin-bottom: 20px;
}
.early-access-page .access-key-holder {
  display: inline-flex;
  justify-content: center;
  flex-direction: column;
}
.early-access-page .access-key-holder label {
  display: inline-block;
  font-weight: bold;
  margin-bottom: 10px;
}
.early-access-page .access-key-holder .input-group {
  margin: 0 auto;
}
.early-access-page .access-key-holder input {
  text-transform: uppercase;
  border: 1px solid #A28969;
  border-right: none;
}
.early-access-page .access-key-holder .btn {
  background: rgba(255, 255, 255, 0.25);
  border: 1px solid #A28969;
  border-left: none;
  color: #4b3922;
  padding: 0.75rem 0.75rem;
}

/* Bootstrap Colours Start */
/* Bootstrap Colours End */
/* Theme accents start */
/* Theme accents end */
:root {
  --font-family-base: "NotoSansRegular", sans-serif;
  --dark-1: #4B3922;
  --light-1: #E6D3B3;
  --dark-2: #3F3326;
  --light-2: #B39C75;
  --foreground-1: #4B3922;
  --foreground-2: #3F3326;
  --background-1: #E6D3B3;
  --background-2: #B39C75;
  --accent-1: #070605;
  --accent-2: #4B3A24;
  --accent-3: #5E4524;
  --accent-4: #A28969;
  --accent-5: #FFFFFF;
  --accent-6: #E6C577;
}

.dev-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(7, 6, 5, 0.2);
  display: flex;
  align-items: center;
  justify-content: center;
}
.dev-overlay .dev-tools-container {
  background: radial-gradient(ellipse at center, #E6D3B3 0%, #e0c8a0 100%);
  padding: 1.5rem 2rem;
  border-radius: 8px;
  box-shadow: 0 4px 12px rgba(7, 6, 5, 0.3);
  text-align: center;
  min-width: 300px;
}
.dev-overlay .dev-tools-container .text-wrapper {
  text-align: left;
}
.dev-overlay .dev-tools-container .text-wrapper .button-wrapper {
  display: flex;
}
.dev-overlay .dev-tools-container .text-wrapper .button-wrapper .dev-cur-input {
  border-right: 0;
  border-top-right-radius: 0px;
  border-bottom-right-radius: 0px;
}
.dev-overlay .dev-tools-container .text-wrapper .button-wrapper .increase {
  border-radius: 0px;
}
.dev-overlay .dev-tools-container .text-wrapper .button-wrapper .decrease {
  border-radius: 0px;
}
.dev-overlay .dev-tools-container .text-wrapper .button-wrapper .cancel {
  border-top-left-radius: 0px;
  border-bottom-left-radius: 0px;
}

/* Bootstrap Colours Start */
/* Bootstrap Colours End */
/* Theme accents start */
/* Theme accents end */
:root {
  --font-family-base: "NotoSansRegular", sans-serif;
  --dark-1: #4B3922;
  --light-1: #E6D3B3;
  --dark-2: #3F3326;
  --light-2: #B39C75;
  --foreground-1: #4B3922;
  --foreground-2: #3F3326;
  --background-1: #E6D3B3;
  --background-2: #B39C75;
  --accent-1: #070605;
  --accent-2: #4B3A24;
  --accent-3: #5E4524;
  --accent-4: #A28969;
  --accent-5: #FFFFFF;
  --accent-6: #E6C577;
}

.popup-overlay {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.2);
  z-index: 100;
}
.popup-overlay .popup-modal {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  background: radial-gradient(ellipse at center, #E6D3B3 0%, #e0c8a0 100%);
  border: 2px ridge #E6C577;
  box-shadow: 4px 4px 4px rgba(67, 57, 48, 0.3);
  border-radius: 8px;
  padding: 1rem;
  text-align: center;
  color: #4B3922;
  opacity: 1;
  transition: opacity 0.3s ease;
}
.popup-overlay .popup-modal .text-wrapper {
  text-align: left;
  font-size: 18px;
}
.popup-overlay .popup-modal .button-wrapper {
  display: flex;
  flex-direction: row;
  gap: 25px;
  flex-wrap: wrap;
  width: 100%;
  justify-content: center;
  margin-bottom: calc(1rem - 10px);
}
.popup-overlay .popup-modal .button-wrapper .popup-button {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  background: rgba(255, 255, 255, 0.25);
  border-radius: 5px;
  border: 1px solid #A28969;
  padding: 2px 10px;
  gap: 10px;
  height: 32px;
  font-weight: 500;
  cursor: pointer !important;
  transition: background 0.2s ease;
  text-align: center;
  box-shadow: 1px 1px 4px #433930;
  color: #4b3922;
}

:root {
  --bs-body-font-family: "Noto Sans",system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";
  --vh100: calc(var(--vh) * 100);
}

html {
  font-size: 14px;
}

@media (min-width: 768px) {
  html {
    font-size: 16px;
  }
}
.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
  box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

html {
  position: relative;
  min-height: 100%;
}

body {
  overflow: hidden;
}

.body {
  background: #8f7356;
  height: var(--vh100);
  display: flex;
  align-items: center;
  justify-content: center;
  border: 2px solid #5f4d39;
}

.book {
  display: flex;
  width: 99.5%;
  height: 99%;
  justify-self: center;
  justify-content: center;
  box-shadow: 0px 0px 6px black;
  background-color: #B39C75;
}

.book .empty-page {
  display: flex;
  width: 99.5%;
  height: 100%;
  justify-self: center;
  justify-content: center;
  box-shadow: 0px 0px 6px black;
  background-color: #B39C75;
}

.book .chapter {
  display: flex;
  width: 99.5%;
  height: 100%;
  justify-self: center;
  justify-content: center;
  box-shadow: 0px 0px 6px black;
  background-color: #B39C75;
}

.book .chapter .page-left {
  display: flex;
  width: 49.75%;
  height: 100%;
  justify-self: center;
  justify-content: center;
  box-shadow: -2px 0px 2px #605345;
  background: linear-gradient(to right, #B39C75 0%, #9e8060 90%, #3F3326 100%);
  padding: 24px;
}

.book .chapter .page-left .content-container {
  background: radial-gradient(ellipse at center, #E6D3B3 0%, #e0c8a0 100%);
  border: 2px ridge #E6C577;
  border-radius: 8px;
  height: 100%;
  width: 100%;
  overflow: hidden;
}

.book .chapter .page-right {
  position: relative;
  display: flex;
  flex-direction: column;
  width: 49.75%;
  height: 100%;
  justify-self: center;
  box-shadow: 2px 0px 2px #605345;
  background: linear-gradient(to left, #B39C75 0%, #9e8060 90%, #5f4d39 100%);
  padding: 12px;
}
@media (min-width: 992px) {
  .book .chapter .page-right {
    padding: 24px;
  }
}

.book .chapter .page-right .content-container {
  position: relative;
  border: 2px ridge #E6C577;
  border-radius: 8px;
  height: 100%;
  width: 100%;
  overflow: hidden;
  background: radial-gradient(ellipse at center, #E6D3B3 0%, #e0c8a0 100%);
  display: flex;
  flex-direction: column;
}

.book .chapter .page-right .page-toolbar {
  display: flex;
  justify-content: space-between;
  padding: 10px 16px;
  gap: 16px;
  flex-wrap: wrap;
  height: 42px;
  width: 100%;
  align-content: center;
  place-content: baseline;
  color: #4B3922;
}

.book .chapter .page-right .content-wrapper {
  display: flex;
  flex-direction: column;
  padding: 16px;
  padding-top: 6px;
  color: #4B3922;
  overflow: auto;
  overflow-y: scroll;
  height: calc(100% - 42px);
  /* Main text */
}
.book .chapter .page-right .content-wrapper .chapter-title-container {
  display: flex;
  flex-direction: row;
  gap: 5px;
  place-items: center;
  place-content: baseline;
  margin-bottom: 1rem;
  align-items: baseline;
  /* Title area */
}
.book .chapter .page-right .content-wrapper .chapter-title-container .progress-wrapper {
  display: flex;
  flex-direction: row;
  gap: 2.5px;
  place-items: center;
}
.book .chapter .page-right .content-wrapper .chapter-title-container .progress-wrapper label {
  font-weight: bold;
}
.book .chapter .page-right .content-wrapper .chapter-title-container .chapter-title {
  text-align: left;
  font-size: 1.1rem;
  font-weight: bold;
}
.book .chapter .page-right .content-wrapper .chapter-content {
  text-align: left;
  font-size: 1rem;
  line-height: 1.6;
}

@media (max-width: 991px) {
  .book .chapter .page-right .page-toolbar {
    height: auto;
  }
  .book .chapter .page-right .content-wrapper {
    /*height: calc(100% - 42px - 33vh);*/
  }
}
/* Choices */
.content-wrapper .choice-item {
  text-align: left;
}

.content-wrapper .chapter-choices {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.home-btn {
  color: #4B3922;
  display: flex;
  flex-direction: column;
  background: rgba(255, 255, 255, 0.25);
  border-radius: 5px;
  border: 1px solid #A28969;
  padding: 0.75rem 0.75rem;
  width: 100%;
  cursor: pointer;
  transition: background 0.2s ease;
  box-shadow: 1px 1px 4px #937e69;
  text-align: left;
}
.home-btn .choice {
  display: flex;
  flex-wrap: nowrap;
  gap: 0.75rem;
}
.home-btn .choice .icon {
  display: inline-block;
  align-items: center;
  align-content: center;
  text-align: left;
  width: 18px;
}
.home-btn .choice .icon i {
  font-size: 16px;
  width: 100%;
}
.home-btn .choice .icon img {
  width: 100px;
  padding: 10px;
}
.home-btn .choice .header {
  display: inline-block;
  font-size: 1rem;
  font-weight: bold;
  align-content: center;
}
.home-btn .choice .desc {
  font-size: 16px;
  font-weight: normal;
  width: 100%;
}
.home-btn .choice .desc p:last-of-type {
  margin-bottom: 0px;
}

.chapter-btn {
  color: #4B3922;
  display: flex;
  flex-direction: column;
  background: rgba(255, 255, 255, 0.25);
  border-radius: 5px;
  border: 1px solid #A28969;
  padding: 0.75rem 0.75rem;
  margin: 0.5rem 0;
  width: 100%;
  cursor: pointer;
  transition: background 0.2s ease;
  box-shadow: 1px 1px 4px #937e69;
  text-align: left;
}
.chapter-btn .choice {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  flex-wrap: wrap;
}
.chapter-btn .choice:not(:has(.desc)) {
  flex-wrap: unset;
}
.chapter-btn .choice .icon {
  display: inline-block;
  float: left;
}
.chapter-btn .choice .icon i {
  font-size: 50px;
  width: 66px;
  line-height: 66px;
}
.chapter-btn .choice .icon img {
  width: 66px;
  padding: 10px;
}
@media (max-width: 574px) {
  .chapter-btn .choice .icon i {
    font-size: 64px;
  }
}
.chapter-btn .choice .flex-wrapper {
  display: flex;
  flex-direction: column;
}
.chapter-btn .choice .flex-wrapper .primary-label {
  display: inline-block;
  font-size: 1.5rem;
  font-weight: bold;
  align-content: center;
}
.chapter-btn .choice .flex-wrapper .secondary-label {
  display: flex;
  flex-direction: row;
  gap: 10px;
}
.chapter-btn .choice .desc {
  display: inline;
  font-size: 16px;
  font-weight: normal;
}
.chapter-btn .choice .desc p {
  margin-bottom: 0.75rem;
}
.chapter-btn .choice .desc p:last-of-type {
  margin-bottom: 0px;
}

.content-wrapper .wheel-button-container {
  display: flex;
  flex-direction: column;
  gap: 0px;
  align-self: center;
  width: 100%;
}
.content-wrapper .wheel-button-container .buttons-wrapper {
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
}
.content-wrapper .wheel-button-container .buttons-wrapper .button-item-helper {
  display: flex;
  flex-direction: column;
  align-items: center;
  align-self: center;
  background: rgba(255, 255, 255, 0.25);
  border-radius: 5px;
  border: 1px solid #A28969;
  padding: 8px 8px;
  width: 50px;
  margin-bottom: 16px;
  cursor: pointer !important;
  transition: background 0.2s ease;
  text-align: left;
  box-shadow: 1px 1px 4px #937e69;
}
.content-wrapper .wheel-button-container .buttons-wrapper .button-item label {
  cursor: pointer !important;
}
.content-wrapper .wheel-button-container .buttons-wrapper .button-item .resource-item {
  margin-bottom: 16px;
}
.content-wrapper .wheel-button-container .buttons-wrapper .button-item .resource-item .cost {
  font-size: 1rem;
}

.content-wrapper .canvas-container {
  display: flex;
  flex-direction: column;
}
.content-wrapper .canvas-container #wheel-of-pixel {
  margin: 20px auto 30px auto !important;
}

.content-wrapper .hidden {
  display: none;
}

.content-wrapper .disabled {
  background: #4B3922 !important;
  color: #E6D3B3;
  box-shadow: 0px 0px 4px #937e69 !important;
}

.content-wrapper .disabled {
  background: #4B3922 !important;
  color: #E6D3B3;
  box-shadow: 0px 0px 4px #937e69 !important;
}

@media (max-width: 991px) {
  .book {
    flex-direction: column;
  }
  .page-left {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 10;
    display: none !important;
  }
  .page-left .active {
    display: flex;
  }
  .page-right {
    width: 100% !important;
  }
  .book-gap {
    display: none;
  }
}
.sound-button {
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  background: rgba(255, 255, 255, 0.25);
  border: 1px ridge #A28969;
  border-radius: 5px;
  font-size: 16px;
  padding: 2px 3px;
  width: 32px;
  height: 32px;
  color: #4B3922;
}

.currency-tracker-ui {
  display: flex;
  flex-direction: row;
  gap: 10px;
  justify-content: left;
  flex-wrap: wrap;
  width: 100%;
}

.currency-tracker-ui .currency-item {
  display: flex;
  flex-direction: row;
  gap: 2.5px;
  align-items: baseline;
  height: 26px;
}
.currency-tracker-ui .currency-item .currency-threshold {
  font-size: 1rem;
}

.currency-tracker-ui .currency-item .currency-label {
  font-weight: bold;
}

.achievement-popup {
  position: fixed;
  top: 20px;
  left: 50%;
  transform: translateX(-50%) !important;
  display: flex;
  align-items: center;
  background: linear-gradient(to right, #070605, #5E4524);
  border: 2px ridge #E6C577;
  border-radius: 5px;
  border-top-right-radius: 5px;
  border-bottom-right-radius: 5px;
  padding: 10px;
  width: fit-content;
  max-width: 400px;
  color: #4B3922;
  font-family: "Georgia", serif;
  box-shadow: 1px 1px 5px #937e69;
  animation: fade-in-out 8s ease-out;
  z-index: 11;
  opacity: 0;
}

.achievement-popup .achievement-icon img {
  height: 64px;
  margin-right: 10px;
}

.achievement-popup .achievement-text {
  display: flex;
  flex-direction: column;
}

.achievement-popup .achievement-text .achievement-title {
  font-size: 18px;
  text-transform: uppercase;
  color: #E6C577;
  letter-spacing: 0.5px;
  text-shadow: 1px 1px 2px black;
}

.achievement-popup .achievement-text .achievement-name {
  font-size: 18px;
  font-weight: bold;
  color: #E6D3B3;
  text-shadow: 1px 1px 2px black;
  padding-left: 10px;
}

@keyframes fade-in-out {
  0% {
    opacity: 0;
    transform: translateY(-30px);
  }
  10% {
    opacity: 1;
    transform: translateY(0);
  }
  90% {
    opacity: 1;
    transform: translateY(0);
  }
  100% {
    opacity: 0;
    transform: translateY(-30px);
  }
}
/* Timer */
.countdownHolder {
  font-size: 20pt;
}

@media (min-width: 768px) {
  .countdownHolder {
    font-size: 30pt;
  }
}
.position {
  display: inline-block;
  height: 1.6em;
  overflow: hidden;
  position: relative;
  width: 1.05em;
}

.digit {
  position: absolute;
  display: block;
  width: 1em;
  color: white;
  text-align: center;
  background-color: #444;
  border-radius: 0.2em;
  letter-spacing: -1px;
}

.digit.static {
  box-shadow: 1px 1px 1px rgba(4, 4, 4, 0.35);
  background-image: linear-gradient(bottom, #3A3A3A 50%, #444444 50%);
  background-image: -o-linear-gradient(bottom, #3A3A3A 50%, #444444 50%);
  background-image: -moz-linear-gradient(bottom, #3A3A3A 50%, #444444 50%);
  background-image: -webkit-linear-gradient(bottom, #3A3A3A 50%, #444444 50%);
  background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0.5, #3A3A3A), color-stop(0.5, #444444));
}

.countDiv {
  display: inline-block;
  width: 16px;
  height: 1.6em;
  position: relative;
}

.countDiv:before,
.countDiv:after {
  position: absolute;
  width: 5px;
  height: 5px;
  background-color: #444;
  border-radius: 50%;
  left: 50%;
  margin-left: -3px;
  top: 0.5em;
  box-shadow: 1px 1px 1px rgba(4, 4, 4, 0.5);
  content: "";
}

.countDiv:after {
  top: 0.9em;
}

#wheel-of-pixel {
  margin: 40px auto 10px auto;
}

.book .chapter .page-right .feedback-form {
  margin-bottom: calc(2rem + 16px);
  border: 2px ridge #E6C577;
  border-radius: 8px;
  padding: 10px;
  padding-bottom: 0px;
}
.book .chapter .page-right .feedback-form .row {
  margin-bottom: 10px;
}
.book .chapter .page-right .feedback-form .chapter-btn {
  text-align: left;
}

.alert-message {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  display: flex;
  flex-direction: column;
  background: radial-gradient(ellipse at center, #E6D3B3 0%, #e0c8a0 100%);
  border: 2px ridge #E6C577;
  box-shadow: 4px 4px 4px rgba(147, 126, 105, 0.3);
  border-radius: 8px;
  padding: 10px 10px;
  text-align: center;
  color: #4B3922;
  transition: opacity 0.3s ease;
  z-index: 100;
}
.alert-message .text-wrapper {
  font-size: 18px;
  margin-bottom: 10px;
}
.alert-message .button-wrapper {
  display: flex;
  justify-content: center;
  margin-bottom: 5px;
}
.alert-message .button-wrapper .alert-button {
  display: flex;
  flex-direction: column;
  justify-content: center;
  background: rgba(255, 255, 255, 0.25);
  border-radius: 5px;
  border: 1px solid #A28969;
  padding: 1px 2px;
  width: 64px;
  height: 32px;
  font-weight: 500;
  cursor: pointer !important;
  transition: background 0.2s ease;
  text-align: center;
  box-shadow: 1px 1px 4px #937e69;
  color: #4B3922;
}

.currency-counter {
  font-size: 1.1rem;
}

.confetti-wrapper {
  position: absolute;
  top: 0px;
  width: 100%;
  height: 100%;
  pointer-events: none;
}
.confetti-wrapper [class|=confetti] {
  position: absolute;
}
.confetti-wrapper .confetti-0 {
  width: 5px;
  height: 2px;
  background-color: #ee5f5b;
  top: -10%;
  left: 27%;
  opacity: 1.452544894;
  transform: rotate(290.0213221743deg);
  border-radius: 5px;
  animation: drop-0 4.2905854543s 0.0961929099s infinite;
}
@keyframes drop-0 {
  100% {
    top: 110%;
    left: 41%;
  }
}
.confetti-wrapper .confetti-1 {
  width: 10px;
  height: 4px;
  background-color: #ee5f5b;
  top: -10%;
  left: 3%;
  opacity: 0.9677841913;
  transform: rotate(304.6430332957deg);
  border-radius: 5px;
  animation: drop-1 4.9703820157s 0.1747336446s infinite;
}
@keyframes drop-1 {
  100% {
    top: 110%;
    left: 8%;
  }
}
.confetti-wrapper .confetti-2 {
  width: 16px;
  height: 6.4px;
  background-color: #ee5f5b;
  top: -10%;
  left: 38%;
  opacity: 1.3004123943;
  transform: rotate(103.9333276263deg);
  border-radius: 5px;
  animation: drop-2 4.9420966451s 0.6908946075s infinite;
}
@keyframes drop-2 {
  100% {
    top: 110%;
    left: 51%;
  }
}
.confetti-wrapper .confetti-3 {
  width: 13px;
  height: 5.2px;
  background-color: #f89406;
  top: -10%;
  left: 16%;
  opacity: 1.0092846429;
  transform: rotate(47.2580135823deg);
  border-radius: 5px;
  animation: drop-3 4.1123227355s 0.423047938s infinite;
}
@keyframes drop-3 {
  100% {
    top: 110%;
    left: 30%;
  }
}
.confetti-wrapper .confetti-4 {
  width: 17px;
  height: 6.8px;
  background-color: #ee5f5b;
  top: -10%;
  left: 55%;
  opacity: 0.8694247207;
  transform: rotate(34.7150329582deg);
  border-radius: 5px;
  animation: drop-4 4.9714331322s 0.7822460124s infinite;
}
@keyframes drop-4 {
  100% {
    top: 110%;
    left: 62%;
  }
}
.confetti-wrapper .confetti-5 {
  width: 9px;
  height: 3.6px;
  background-color: #f89406;
  top: -10%;
  left: 1%;
  opacity: 1.2491157214;
  transform: rotate(302.8606330096deg);
  border-radius: 5px;
  animation: drop-5 4.3441106307s 0.1980461767s infinite;
}
@keyframes drop-5 {
  100% {
    top: 110%;
    left: 13%;
  }
}
.confetti-wrapper .confetti-6 {
  width: 4px;
  height: 1.6px;
  background-color: #62c462;
  top: -10%;
  left: 11%;
  opacity: 1.1905512281;
  transform: rotate(51.6508747377deg);
  border-radius: 5px;
  animation: drop-6 4.1132604519s 0.7687606795s infinite;
}
@keyframes drop-6 {
  100% {
    top: 110%;
    left: 14%;
  }
}
.confetti-wrapper .confetti-7 {
  width: 2px;
  height: 0.8px;
  background-color: #ee5f5b;
  top: -10%;
  left: 58%;
  opacity: 1.0472538573;
  transform: rotate(87.1206885324deg);
  border-radius: 5px;
  animation: drop-7 4.1363394945s 0.6201667198s infinite;
}
@keyframes drop-7 {
  100% {
    top: 110%;
    left: 65%;
  }
}
.confetti-wrapper .confetti-8 {
  width: 6px;
  height: 2.4px;
  background-color: #f89406;
  top: -10%;
  left: 4%;
  opacity: 1.0251325664;
  transform: rotate(16.9522878386deg);
  border-radius: 5px;
  animation: drop-8 4.312852246s 0.1129501168s infinite;
}
@keyframes drop-8 {
  100% {
    top: 110%;
    left: 10%;
  }
}
.confetti-wrapper .confetti-9 {
  width: 8px;
  height: 3.2px;
  background-color: #5bc0de;
  top: -10%;
  left: 58%;
  opacity: 1.4033189646;
  transform: rotate(29.2585700609deg);
  border-radius: 5px;
  animation: drop-9 4.9089695342s 0.4094749189s infinite;
}
@keyframes drop-9 {
  100% {
    top: 110%;
    left: 73%;
  }
}
.confetti-wrapper .confetti-10 {
  width: 16px;
  height: 6.4px;
  background-color: #5bc0de;
  top: -10%;
  left: 2%;
  opacity: 1.346874641;
  transform: rotate(191.4882496775deg);
  border-radius: 5px;
  animation: drop-10 4.4329692415s 0.6529406616s infinite;
}
@keyframes drop-10 {
  100% {
    top: 110%;
    left: 7%;
  }
}
.confetti-wrapper .confetti-11 {
  width: 20px;
  height: 8px;
  background-color: #62c462;
  top: -10%;
  left: 55%;
  opacity: 0.5529136982;
  transform: rotate(307.7747238118deg);
  border-radius: 5px;
  animation: drop-11 4.9561964439s 0.1703288581s infinite;
}
@keyframes drop-11 {
  100% {
    top: 110%;
    left: 57%;
  }
}
.confetti-wrapper .confetti-12 {
  width: 17px;
  height: 6.8px;
  background-color: #ee5f5b;
  top: -10%;
  left: 56%;
  opacity: 0.6243220354;
  transform: rotate(239.2291464707deg);
  border-radius: 5px;
  animation: drop-12 4.8138834711s 0.4424010567s infinite;
}
@keyframes drop-12 {
  100% {
    top: 110%;
    left: 57%;
  }
}
.confetti-wrapper .confetti-13 {
  width: 15px;
  height: 6px;
  background-color: #f89406;
  top: -10%;
  left: 39%;
  opacity: 0.8468588089;
  transform: rotate(197.9430132983deg);
  border-radius: 5px;
  animation: drop-13 4.371100252s 0.3519433187s infinite;
}
@keyframes drop-13 {
  100% {
    top: 110%;
    left: 40%;
  }
}
.confetti-wrapper .confetti-14 {
  width: 8px;
  height: 3.2px;
  background-color: #ee5f5b;
  top: -10%;
  left: 91%;
  opacity: 1.4498102559;
  transform: rotate(333.4964496318deg);
  border-radius: 5px;
  animation: drop-14 4.5190059668s 0.9781453105s infinite;
}
@keyframes drop-14 {
  100% {
    top: 110%;
    left: 105%;
  }
}
.confetti-wrapper .confetti-15 {
  width: 7px;
  height: 2.8px;
  background-color: #ee5f5b;
  top: -10%;
  left: 16%;
  opacity: 0.9536548073;
  transform: rotate(299.0283334003deg);
  border-radius: 5px;
  animation: drop-15 4.2271308427s 0.3915152004s infinite;
}
@keyframes drop-15 {
  100% {
    top: 110%;
    left: 19%;
  }
}
.confetti-wrapper .confetti-16 {
  width: 12px;
  height: 4.8px;
  background-color: #f89406;
  top: -10%;
  left: 2%;
  opacity: 0.6726056823;
  transform: rotate(149.1108726399deg);
  border-radius: 5px;
  animation: drop-16 4.8671360742s 0.2500468455s infinite;
}
@keyframes drop-16 {
  100% {
    top: 110%;
    left: 11%;
  }
}
.confetti-wrapper .confetti-17 {
  width: 18px;
  height: 7.2px;
  background-color: #f89406;
  top: -10%;
  left: 100%;
  opacity: 1.0451304801;
  transform: rotate(281.4674573604deg);
  border-radius: 5px;
  animation: drop-17 4.6030524791s 0.6344531701s infinite;
}
@keyframes drop-17 {
  100% {
    top: 110%;
    left: 115%;
  }
}
.confetti-wrapper .confetti-18 {
  width: 14px;
  height: 5.6px;
  background-color: #f89406;
  top: -10%;
  left: 81%;
  opacity: 0.8978304449;
  transform: rotate(126.7125040479deg);
  border-radius: 5px;
  animation: drop-18 4.05610063s 0.9696713297s infinite;
}
@keyframes drop-18 {
  100% {
    top: 110%;
    left: 91%;
  }
}
.confetti-wrapper .confetti-19 {
  width: 3px;
  height: 1.2px;
  background-color: #5bc0de;
  top: -10%;
  left: 57%;
  opacity: 0.5132587229;
  transform: rotate(14.0892728764deg);
  border-radius: 5px;
  animation: drop-19 4.306016836s 0.6259288659s infinite;
}
@keyframes drop-19 {
  100% {
    top: 110%;
    left: 69%;
  }
}
.confetti-wrapper .confetti-20 {
  width: 20px;
  height: 8px;
  background-color: #f89406;
  top: -10%;
  left: 22%;
  opacity: 0.7411780458;
  transform: rotate(59.3182478878deg);
  border-radius: 5px;
  animation: drop-20 4.8449140563s 0.8946899285s infinite;
}
@keyframes drop-20 {
  100% {
    top: 110%;
    left: 34%;
  }
}
.confetti-wrapper .confetti-21 {
  width: 2px;
  height: 0.8px;
  background-color: #f89406;
  top: -10%;
  left: 74%;
  opacity: 0.7778470946;
  transform: rotate(58.6156744103deg);
  border-radius: 5px;
  animation: drop-21 4.8920689276s 0.7755686098s infinite;
}
@keyframes drop-21 {
  100% {
    top: 110%;
    left: 77%;
  }
}
.confetti-wrapper .confetti-22 {
  width: 18px;
  height: 7.2px;
  background-color: #5bc0de;
  top: -10%;
  left: 1%;
  opacity: 1.481606453;
  transform: rotate(306.4016094241deg);
  border-radius: 5px;
  animation: drop-22 4.7772120109s 0.7226385389s infinite;
}
@keyframes drop-22 {
  100% {
    top: 110%;
    left: 12%;
  }
}
.confetti-wrapper .confetti-23 {
  width: 11px;
  height: 4.4px;
  background-color: #f89406;
  top: -10%;
  left: 99%;
  opacity: 1.2150408449;
  transform: rotate(125.0058149895deg);
  border-radius: 5px;
  animation: drop-23 4.958607686s 0.935865433s infinite;
}
@keyframes drop-23 {
  100% {
    top: 110%;
    left: 101%;
  }
}
.confetti-wrapper .confetti-24 {
  width: 1px;
  height: 0.4px;
  background-color: #62c462;
  top: -10%;
  left: 86%;
  opacity: 1.076186933;
  transform: rotate(342.3084645042deg);
  border-radius: 5px;
  animation: drop-24 4.2643003628s 0.765275532s infinite;
}
@keyframes drop-24 {
  100% {
    top: 110%;
    left: 93%;
  }
}
.confetti-wrapper .confetti-25 {
  width: 17px;
  height: 6.8px;
  background-color: #62c462;
  top: -10%;
  left: 6%;
  opacity: 0.5593176077;
  transform: rotate(57.0967661591deg);
  border-radius: 5px;
  animation: drop-25 4.5590989183s 0.0730343708s infinite;
}
@keyframes drop-25 {
  100% {
    top: 110%;
    left: 17%;
  }
}
.confetti-wrapper .confetti-26 {
  width: 12px;
  height: 4.8px;
  background-color: #ee5f5b;
  top: -10%;
  left: 66%;
  opacity: 1.4401318734;
  transform: rotate(353.4598180048deg);
  border-radius: 5px;
  animation: drop-26 4.1411959156s 0.0672625072s infinite;
}
@keyframes drop-26 {
  100% {
    top: 110%;
    left: 71%;
  }
}
.confetti-wrapper .confetti-27 {
  width: 15px;
  height: 6px;
  background-color: #f89406;
  top: -10%;
  left: 65%;
  opacity: 0.8197563237;
  transform: rotate(49.5810509372deg);
  border-radius: 5px;
  animation: drop-27 4.3182431627s 0.2449851393s infinite;
}
@keyframes drop-27 {
  100% {
    top: 110%;
    left: 77%;
  }
}
.confetti-wrapper .confetti-28 {
  width: 7px;
  height: 2.8px;
  background-color: #f89406;
  top: -10%;
  left: 96%;
  opacity: 1.0865760985;
  transform: rotate(179.1138689763deg);
  border-radius: 5px;
  animation: drop-28 4.2755957469s 0.105327861s infinite;
}
@keyframes drop-28 {
  100% {
    top: 110%;
    left: 99%;
  }
}
.confetti-wrapper .confetti-29 {
  width: 5px;
  height: 2px;
  background-color: #f89406;
  top: -10%;
  left: 16%;
  opacity: 1.1918369174;
  transform: rotate(153.7214144438deg);
  border-radius: 5px;
  animation: drop-29 4.9027377643s 0.078882768s infinite;
}
@keyframes drop-29 {
  100% {
    top: 110%;
    left: 29%;
  }
}
.confetti-wrapper .confetti-30 {
  width: 14px;
  height: 5.6px;
  background-color: #ee5f5b;
  top: -10%;
  left: 99%;
  opacity: 1.1693112584;
  transform: rotate(231.574355461deg);
  border-radius: 5px;
  animation: drop-30 4.2678376787s 0.9660873522s infinite;
}
@keyframes drop-30 {
  100% {
    top: 110%;
    left: 108%;
  }
}
.confetti-wrapper .confetti-31 {
  width: 20px;
  height: 8px;
  background-color: #5bc0de;
  top: -10%;
  left: 2%;
  opacity: 1.2210045716;
  transform: rotate(311.9258337317deg);
  border-radius: 5px;
  animation: drop-31 4.4948101174s 0.2133310539s infinite;
}
@keyframes drop-31 {
  100% {
    top: 110%;
    left: 16%;
  }
}
.confetti-wrapper .confetti-32 {
  width: 4px;
  height: 1.6px;
  background-color: #ee5f5b;
  top: -10%;
  left: 62%;
  opacity: 1.1403680878;
  transform: rotate(239.5276035158deg);
  border-radius: 5px;
  animation: drop-32 4.9312395937s 0.6257401574s infinite;
}
@keyframes drop-32 {
  100% {
    top: 110%;
    left: 65%;
  }
}
.confetti-wrapper .confetti-33 {
  width: 18px;
  height: 7.2px;
  background-color: #62c462;
  top: -10%;
  left: 98%;
  opacity: 0.6300864506;
  transform: rotate(284.3393421111deg);
  border-radius: 5px;
  animation: drop-33 4.4579909585s 0.8077894979s infinite;
}
@keyframes drop-33 {
  100% {
    top: 110%;
    left: 107%;
  }
}
.confetti-wrapper .confetti-34 {
  width: 11px;
  height: 4.4px;
  background-color: #f89406;
  top: -10%;
  left: 28%;
  opacity: 1.4114339027;
  transform: rotate(236.3923602012deg);
  border-radius: 5px;
  animation: drop-34 4.6951639581s 0.2723093463s infinite;
}
@keyframes drop-34 {
  100% {
    top: 110%;
    left: 37%;
  }
}
.confetti-wrapper .confetti-35 {
  width: 5px;
  height: 2px;
  background-color: #f89406;
  top: -10%;
  left: 62%;
  opacity: 1.0434538987;
  transform: rotate(167.529651726deg);
  border-radius: 5px;
  animation: drop-35 4.2263996681s 0.3586326936s infinite;
}
@keyframes drop-35 {
  100% {
    top: 110%;
    left: 65%;
  }
}
.confetti-wrapper .confetti-36 {
  width: 8px;
  height: 3.2px;
  background-color: #f89406;
  top: -10%;
  left: 74%;
  opacity: 0.5981725938;
  transform: rotate(139.8172947262deg);
  border-radius: 5px;
  animation: drop-36 4.8731541214s 0.1999269201s infinite;
}
@keyframes drop-36 {
  100% {
    top: 110%;
    left: 84%;
  }
}
.confetti-wrapper .confetti-37 {
  width: 14px;
  height: 5.6px;
  background-color: #f89406;
  top: -10%;
  left: 9%;
  opacity: 0.9138488883;
  transform: rotate(45.2117096794deg);
  border-radius: 5px;
  animation: drop-37 4.002292548s 0.1580655616s infinite;
}
@keyframes drop-37 {
  100% {
    top: 110%;
    left: 24%;
  }
}
.confetti-wrapper .confetti-38 {
  width: 3px;
  height: 1.2px;
  background-color: #62c462;
  top: -10%;
  left: 53%;
  opacity: 0.9424691831;
  transform: rotate(98.3593617431deg);
  border-radius: 5px;
  animation: drop-38 4.2405923648s 0.6594720859s infinite;
}
@keyframes drop-38 {
  100% {
    top: 110%;
    left: 63%;
  }
}
.confetti-wrapper .confetti-39 {
  width: 20px;
  height: 8px;
  background-color: #5bc0de;
  top: -10%;
  left: 53%;
  opacity: 1.1954159074;
  transform: rotate(195.7540460915deg);
  border-radius: 5px;
  animation: drop-39 4.3442568039s 0.1228852032s infinite;
}
@keyframes drop-39 {
  100% {
    top: 110%;
    left: 62%;
  }
}
.confetti-wrapper .confetti-40 {
  width: 7px;
  height: 2.8px;
  background-color: #5bc0de;
  top: -10%;
  left: 44%;
  opacity: 0.881286512;
  transform: rotate(205.8580476901deg);
  border-radius: 5px;
  animation: drop-40 4.6668204485s 0.2381500025s infinite;
}
@keyframes drop-40 {
  100% {
    top: 110%;
    left: 50%;
  }
}
.confetti-wrapper .confetti-41 {
  width: 2px;
  height: 0.8px;
  background-color: #5bc0de;
  top: -10%;
  left: 28%;
  opacity: 0.8754922403;
  transform: rotate(117.5726313495deg);
  border-radius: 5px;
  animation: drop-41 4.1646101594s 0.5893194598s infinite;
}
@keyframes drop-41 {
  100% {
    top: 110%;
    left: 42%;
  }
}
.confetti-wrapper .confetti-42 {
  width: 11px;
  height: 4.4px;
  background-color: #62c462;
  top: -10%;
  left: 92%;
  opacity: 0.7627666594;
  transform: rotate(178.4132131164deg);
  border-radius: 5px;
  animation: drop-42 4.4230552101s 0.7437576861s infinite;
}
@keyframes drop-42 {
  100% {
    top: 110%;
    left: 95%;
  }
}
.confetti-wrapper .confetti-43 {
  width: 20px;
  height: 8px;
  background-color: #f89406;
  top: -10%;
  left: 61%;
  opacity: 0.9269807914;
  transform: rotate(29.7465144734deg);
  border-radius: 5px;
  animation: drop-43 4.057728465s 0.083377845s infinite;
}
@keyframes drop-43 {
  100% {
    top: 110%;
    left: 66%;
  }
}
.confetti-wrapper .confetti-44 {
  width: 3px;
  height: 1.2px;
  background-color: #5bc0de;
  top: -10%;
  left: 35%;
  opacity: 1.4950206472;
  transform: rotate(55.2480162219deg);
  border-radius: 5px;
  animation: drop-44 4.2888024524s 0.610836619s infinite;
}
@keyframes drop-44 {
  100% {
    top: 110%;
    left: 37%;
  }
}
.confetti-wrapper .confetti-45 {
  width: 3px;
  height: 1.2px;
  background-color: #f89406;
  top: -10%;
  left: 49%;
  opacity: 0.8143810267;
  transform: rotate(241.307776515deg);
  border-radius: 5px;
  animation: drop-45 4.4737805737s 0.480806549s infinite;
}
@keyframes drop-45 {
  100% {
    top: 110%;
    left: 60%;
  }
}
.confetti-wrapper .confetti-46 {
  width: 14px;
  height: 5.6px;
  background-color: #ee5f5b;
  top: -10%;
  left: 36%;
  opacity: 0.6472080547;
  transform: rotate(29.8563621532deg);
  border-radius: 5px;
  animation: drop-46 4.3978220621s 0.6741945578s infinite;
}
@keyframes drop-46 {
  100% {
    top: 110%;
    left: 45%;
  }
}
.confetti-wrapper .confetti-47 {
  width: 5px;
  height: 2px;
  background-color: #f89406;
  top: -10%;
  left: 31%;
  opacity: 0.7818308258;
  transform: rotate(204.4558035816deg);
  border-radius: 5px;
  animation: drop-47 4.3214312247s 0.750244619s infinite;
}
@keyframes drop-47 {
  100% {
    top: 110%;
    left: 37%;
  }
}
.confetti-wrapper .confetti-48 {
  width: 17px;
  height: 6.8px;
  background-color: #5bc0de;
  top: -10%;
  left: 16%;
  opacity: 0.8449446782;
  transform: rotate(101.6601376525deg);
  border-radius: 5px;
  animation: drop-48 4.2937583156s 0.6777137136s infinite;
}
@keyframes drop-48 {
  100% {
    top: 110%;
    left: 31%;
  }
}
.confetti-wrapper .confetti-49 {
  width: 17px;
  height: 6.8px;
  background-color: #62c462;
  top: -10%;
  left: 88%;
  opacity: 0.7724678367;
  transform: rotate(138.2926471068deg);
  border-radius: 5px;
  animation: drop-49 4.6706996617s 0.2400878615s infinite;
}
@keyframes drop-49 {
  100% {
    top: 110%;
    left: 91%;
  }
}
.confetti-wrapper .confetti-50 {
  width: 18px;
  height: 7.2px;
  background-color: #62c462;
  top: -10%;
  left: 92%;
  opacity: 0.6589301506;
  transform: rotate(53.06628716deg);
  border-radius: 5px;
  animation: drop-50 4.3109979939s 0.7757552474s infinite;
}
@keyframes drop-50 {
  100% {
    top: 110%;
    left: 102%;
  }
}
.confetti-wrapper .confetti-51 {
  width: 6px;
  height: 2.4px;
  background-color: #62c462;
  top: -10%;
  left: 70%;
  opacity: 0.7864113258;
  transform: rotate(231.2162839662deg);
  border-radius: 5px;
  animation: drop-51 4.7521324371s 0.8554578713s infinite;
}
@keyframes drop-51 {
  100% {
    top: 110%;
    left: 78%;
  }
}
.confetti-wrapper .confetti-52 {
  width: 8px;
  height: 3.2px;
  background-color: #5bc0de;
  top: -10%;
  left: 48%;
  opacity: 1.0937066689;
  transform: rotate(44.9139288287deg);
  border-radius: 5px;
  animation: drop-52 4.6462073537s 0.9872441618s infinite;
}
@keyframes drop-52 {
  100% {
    top: 110%;
    left: 57%;
  }
}
.confetti-wrapper .confetti-53 {
  width: 8px;
  height: 3.2px;
  background-color: #f89406;
  top: -10%;
  left: 47%;
  opacity: 1.3116497152;
  transform: rotate(50.3426421589deg);
  border-radius: 5px;
  animation: drop-53 4.0220963851s 0.0556961485s infinite;
}
@keyframes drop-53 {
  100% {
    top: 110%;
    left: 60%;
  }
}
.confetti-wrapper .confetti-54 {
  width: 13px;
  height: 5.2px;
  background-color: #ee5f5b;
  top: -10%;
  left: 52%;
  opacity: 1.3651739724;
  transform: rotate(116.8384414362deg);
  border-radius: 5px;
  animation: drop-54 4.3909699817s 0.5186833406s infinite;
}
@keyframes drop-54 {
  100% {
    top: 110%;
    left: 63%;
  }
}
.confetti-wrapper .confetti-55 {
  width: 2px;
  height: 0.8px;
  background-color: #ee5f5b;
  top: -10%;
  left: 100%;
  opacity: 0.5070577673;
  transform: rotate(276.5482916692deg);
  border-radius: 5px;
  animation: drop-55 4.8286290249s 0.3398861026s infinite;
}
@keyframes drop-55 {
  100% {
    top: 110%;
    left: 110%;
  }
}
.confetti-wrapper .confetti-56 {
  width: 1px;
  height: 0.4px;
  background-color: #f89406;
  top: -10%;
  left: 66%;
  opacity: 1.1925252908;
  transform: rotate(252.0137637467deg);
  border-radius: 5px;
  animation: drop-56 4.0194975168s 0.2173226478s infinite;
}
@keyframes drop-56 {
  100% {
    top: 110%;
    left: 67%;
  }
}
.confetti-wrapper .confetti-57 {
  width: 10px;
  height: 4px;
  background-color: #62c462;
  top: -10%;
  left: 91%;
  opacity: 1.0697905158;
  transform: rotate(84.6553908046deg);
  border-radius: 5px;
  animation: drop-57 4.2693763865s 0.9486398148s infinite;
}
@keyframes drop-57 {
  100% {
    top: 110%;
    left: 100%;
  }
}
.confetti-wrapper .confetti-58 {
  width: 16px;
  height: 6.4px;
  background-color: #5bc0de;
  top: -10%;
  left: 83%;
  opacity: 1.4720995048;
  transform: rotate(293.193723676deg);
  border-radius: 5px;
  animation: drop-58 4.2895364029s 0.3206535319s infinite;
}
@keyframes drop-58 {
  100% {
    top: 110%;
    left: 88%;
  }
}
.confetti-wrapper .confetti-59 {
  width: 5px;
  height: 2px;
  background-color: #f89406;
  top: -10%;
  left: 19%;
  opacity: 0.7546705343;
  transform: rotate(336.753483397deg);
  border-radius: 5px;
  animation: drop-59 4.5340656223s 0.9721688773s infinite;
}
@keyframes drop-59 {
  100% {
    top: 110%;
    left: 30%;
  }
}
.confetti-wrapper .confetti-60 {
  width: 20px;
  height: 8px;
  background-color: #ee5f5b;
  top: -10%;
  left: 83%;
  opacity: 1.3826020202;
  transform: rotate(292.8593525075deg);
  border-radius: 5px;
  animation: drop-60 4.7323011806s 0.3974443742s infinite;
}
@keyframes drop-60 {
  100% {
    top: 110%;
    left: 97%;
  }
}
.confetti-wrapper .confetti-61 {
  width: 12px;
  height: 4.8px;
  background-color: #ee5f5b;
  top: -10%;
  left: 1%;
  opacity: 0.5429982694;
  transform: rotate(227.1641372782deg);
  border-radius: 5px;
  animation: drop-61 4.4226757021s 0.9615066329s infinite;
}
@keyframes drop-61 {
  100% {
    top: 110%;
    left: 11%;
  }
}
.confetti-wrapper .confetti-62 {
  width: 5px;
  height: 2px;
  background-color: #f89406;
  top: -10%;
  left: 2%;
  opacity: 0.5745311453;
  transform: rotate(254.9551621829deg);
  border-radius: 5px;
  animation: drop-62 4.852856217s 0.4211063408s infinite;
}
@keyframes drop-62 {
  100% {
    top: 110%;
    left: 11%;
  }
}
.confetti-wrapper .confetti-63 {
  width: 6px;
  height: 2.4px;
  background-color: #62c462;
  top: -10%;
  left: 28%;
  opacity: 0.97448902;
  transform: rotate(311.7827068495deg);
  border-radius: 5px;
  animation: drop-63 4.1859063559s 0.5666914448s infinite;
}
@keyframes drop-63 {
  100% {
    top: 110%;
    left: 37%;
  }
}
.confetti-wrapper .confetti-64 {
  width: 20px;
  height: 8px;
  background-color: #ee5f5b;
  top: -10%;
  left: 24%;
  opacity: 0.6431094463;
  transform: rotate(99.595869392deg);
  border-radius: 5px;
  animation: drop-64 4.4655367235s 0.2806016757s infinite;
}
@keyframes drop-64 {
  100% {
    top: 110%;
    left: 36%;
  }
}
.confetti-wrapper .confetti-65 {
  width: 3px;
  height: 1.2px;
  background-color: #f89406;
  top: -10%;
  left: 55%;
  opacity: 1.3121847969;
  transform: rotate(111.678765528deg);
  border-radius: 5px;
  animation: drop-65 4.2185042759s 0.0592408738s infinite;
}
@keyframes drop-65 {
  100% {
    top: 110%;
    left: 68%;
  }
}
.confetti-wrapper .confetti-66 {
  width: 1px;
  height: 0.4px;
  background-color: #5bc0de;
  top: -10%;
  left: 85%;
  opacity: 1.4532129449;
  transform: rotate(300.5060633041deg);
  border-radius: 5px;
  animation: drop-66 4.5467065173s 0.3218902406s infinite;
}
@keyframes drop-66 {
  100% {
    top: 110%;
    left: 86%;
  }
}
.confetti-wrapper .confetti-67 {
  width: 6px;
  height: 2.4px;
  background-color: #5bc0de;
  top: -10%;
  left: 11%;
  opacity: 0.7668626527;
  transform: rotate(312.9989939306deg);
  border-radius: 5px;
  animation: drop-67 4.7980520381s 0.2454084363s infinite;
}
@keyframes drop-67 {
  100% {
    top: 110%;
    left: 19%;
  }
}
.confetti-wrapper .confetti-68 {
  width: 4px;
  height: 1.6px;
  background-color: #f89406;
  top: -10%;
  left: 37%;
  opacity: 1.1595686977;
  transform: rotate(188.990307691deg);
  border-radius: 5px;
  animation: drop-68 4.0392837695s 0.6337142206s infinite;
}
@keyframes drop-68 {
  100% {
    top: 110%;
    left: 38%;
  }
}
.confetti-wrapper .confetti-69 {
  width: 8px;
  height: 3.2px;
  background-color: #ee5f5b;
  top: -10%;
  left: 66%;
  opacity: 0.5846641141;
  transform: rotate(131.9151519298deg);
  border-radius: 5px;
  animation: drop-69 4.9560268805s 0.8905637611s infinite;
}
@keyframes drop-69 {
  100% {
    top: 110%;
    left: 70%;
  }
}
.confetti-wrapper .confetti-70 {
  width: 13px;
  height: 5.2px;
  background-color: #62c462;
  top: -10%;
  left: 52%;
  opacity: 0.9454923823;
  transform: rotate(175.4064352115deg);
  border-radius: 5px;
  animation: drop-70 4.989228362s 0.1081379178s infinite;
}
@keyframes drop-70 {
  100% {
    top: 110%;
    left: 67%;
  }
}
.confetti-wrapper .confetti-71 {
  width: 3px;
  height: 1.2px;
  background-color: #62c462;
  top: -10%;
  left: 68%;
  opacity: 1.206864909;
  transform: rotate(130.8797803662deg);
  border-radius: 5px;
  animation: drop-71 4.9432126398s 0.7542847905s infinite;
}
@keyframes drop-71 {
  100% {
    top: 110%;
    left: 77%;
  }
}
.confetti-wrapper .confetti-72 {
  width: 13px;
  height: 5.2px;
  background-color: #f89406;
  top: -10%;
  left: 77%;
  opacity: 0.5333596198;
  transform: rotate(210.4485169036deg);
  border-radius: 5px;
  animation: drop-72 4.460490812s 0.2243144331s infinite;
}
@keyframes drop-72 {
  100% {
    top: 110%;
    left: 91%;
  }
}
.confetti-wrapper .confetti-73 {
  width: 11px;
  height: 4.4px;
  background-color: #f89406;
  top: -10%;
  left: 12%;
  opacity: 1.0049396377;
  transform: rotate(83.051181932deg);
  border-radius: 5px;
  animation: drop-73 4.9064376737s 0.1777863496s infinite;
}
@keyframes drop-73 {
  100% {
    top: 110%;
    left: 24%;
  }
}
.confetti-wrapper .confetti-74 {
  width: 16px;
  height: 6.4px;
  background-color: #5bc0de;
  top: -10%;
  left: 83%;
  opacity: 1.0030706877;
  transform: rotate(330.8226593095deg);
  border-radius: 5px;
  animation: drop-74 4.5431595894s 0.4100167792s infinite;
}
@keyframes drop-74 {
  100% {
    top: 110%;
    left: 97%;
  }
}
.confetti-wrapper .confetti-75 {
  width: 17px;
  height: 6.8px;
  background-color: #62c462;
  top: -10%;
  left: 98%;
  opacity: 1.4401828798;
  transform: rotate(103.8693654934deg);
  border-radius: 5px;
  animation: drop-75 4.012242404s 0.9717929001s infinite;
}
@keyframes drop-75 {
  100% {
    top: 110%;
    left: 111%;
  }
}
.confetti-wrapper .confetti-76 {
  width: 3px;
  height: 1.2px;
  background-color: #ee5f5b;
  top: -10%;
  left: 32%;
  opacity: 1.4213346089;
  transform: rotate(6.2347530797deg);
  border-radius: 5px;
  animation: drop-76 4.8315403738s 0.3945892703s infinite;
}
@keyframes drop-76 {
  100% {
    top: 110%;
    left: 40%;
  }
}
.confetti-wrapper .confetti-77 {
  width: 18px;
  height: 7.2px;
  background-color: #f89406;
  top: -10%;
  left: 73%;
  opacity: 1.4689450845;
  transform: rotate(270.6787687131deg);
  border-radius: 5px;
  animation: drop-77 4.2890494398s 0.2006318247s infinite;
}
@keyframes drop-77 {
  100% {
    top: 110%;
    left: 80%;
  }
}
.confetti-wrapper .confetti-78 {
  width: 15px;
  height: 6px;
  background-color: #ee5f5b;
  top: -10%;
  left: 27%;
  opacity: 0.5863583527;
  transform: rotate(182.1973992993deg);
  border-radius: 5px;
  animation: drop-78 4.8224053704s 0.7829736003s infinite;
}
@keyframes drop-78 {
  100% {
    top: 110%;
    left: 37%;
  }
}
.confetti-wrapper .confetti-79 {
  width: 8px;
  height: 3.2px;
  background-color: #f89406;
  top: -10%;
  left: 72%;
  opacity: 0.6195968108;
  transform: rotate(341.2438371251deg);
  border-radius: 5px;
  animation: drop-79 4.2412967467s 0.2285102555s infinite;
}
@keyframes drop-79 {
  100% {
    top: 110%;
    left: 75%;
  }
}
.confetti-wrapper .confetti-80 {
  width: 6px;
  height: 2.4px;
  background-color: #62c462;
  top: -10%;
  left: 73%;
  opacity: 0.8556182203;
  transform: rotate(274.9851133404deg);
  border-radius: 5px;
  animation: drop-80 4.7967065961s 0.484380061s infinite;
}
@keyframes drop-80 {
  100% {
    top: 110%;
    left: 86%;
  }
}
.confetti-wrapper .confetti-81 {
  width: 15px;
  height: 6px;
  background-color: #62c462;
  top: -10%;
  left: 28%;
  opacity: 1.1891614598;
  transform: rotate(156.1101405963deg);
  border-radius: 5px;
  animation: drop-81 4.6915694989s 0.4119512697s infinite;
}
@keyframes drop-81 {
  100% {
    top: 110%;
    left: 36%;
  }
}
.confetti-wrapper .confetti-82 {
  width: 1px;
  height: 0.4px;
  background-color: #f89406;
  top: -10%;
  left: 41%;
  opacity: 1.2844599526;
  transform: rotate(58.5177970068deg);
  border-radius: 5px;
  animation: drop-82 4.3322534208s 0.8935460561s infinite;
}
@keyframes drop-82 {
  100% {
    top: 110%;
    left: 54%;
  }
}
.confetti-wrapper .confetti-83 {
  width: 17px;
  height: 6.8px;
  background-color: #ee5f5b;
  top: -10%;
  left: 10%;
  opacity: 0.5293056412;
  transform: rotate(168.2456577418deg);
  border-radius: 5px;
  animation: drop-83 4.2629455568s 0.7988442147s infinite;
}
@keyframes drop-83 {
  100% {
    top: 110%;
    left: 18%;
  }
}
.confetti-wrapper .confetti-84 {
  width: 17px;
  height: 6.8px;
  background-color: #5bc0de;
  top: -10%;
  left: 93%;
  opacity: 1.2221923744;
  transform: rotate(313.1395162923deg);
  border-radius: 5px;
  animation: drop-84 4.0627755478s 0.7526089019s infinite;
}
@keyframes drop-84 {
  100% {
    top: 110%;
    left: 96%;
  }
}
.confetti-wrapper .confetti-85 {
  width: 19px;
  height: 7.6px;
  background-color: #ee5f5b;
  top: -10%;
  left: 88%;
  opacity: 1.473914181;
  transform: rotate(196.4040386214deg);
  border-radius: 5px;
  animation: drop-85 4.0214884837s 0.167029696s infinite;
}
@keyframes drop-85 {
  100% {
    top: 110%;
    left: 91%;
  }
}
.confetti-wrapper .confetti-86 {
  width: 6px;
  height: 2.4px;
  background-color: #ee5f5b;
  top: -10%;
  left: 80%;
  opacity: 0.8812868727;
  transform: rotate(8.3810150685deg);
  border-radius: 5px;
  animation: drop-86 4.1864759083s 0.7838611246s infinite;
}
@keyframes drop-86 {
  100% {
    top: 110%;
    left: 95%;
  }
}
.confetti-wrapper .confetti-87 {
  width: 5px;
  height: 2px;
  background-color: #f89406;
  top: -10%;
  left: 24%;
  opacity: 1.2308392346;
  transform: rotate(250.6060950783deg);
  border-radius: 5px;
  animation: drop-87 4.6238649593s 0.0303974349s infinite;
}
@keyframes drop-87 {
  100% {
    top: 110%;
    left: 28%;
  }
}
.confetti-wrapper .confetti-88 {
  width: 1px;
  height: 0.4px;
  background-color: #5bc0de;
  top: -10%;
  left: 62%;
  opacity: 1.1344622973;
  transform: rotate(142.2938117713deg);
  border-radius: 5px;
  animation: drop-88 4.262679877s 0.3815003968s infinite;
}
@keyframes drop-88 {
  100% {
    top: 110%;
    left: 67%;
  }
}
.confetti-wrapper .confetti-89 {
  width: 17px;
  height: 6.8px;
  background-color: #5bc0de;
  top: -10%;
  left: 94%;
  opacity: 1.193392588;
  transform: rotate(68.4792579797deg);
  border-radius: 5px;
  animation: drop-89 4.5825959538s 0.3888165681s infinite;
}
@keyframes drop-89 {
  100% {
    top: 110%;
    left: 95%;
  }
}
.confetti-wrapper .confetti-90 {
  width: 8px;
  height: 3.2px;
  background-color: #5bc0de;
  top: -10%;
  left: 68%;
  opacity: 1.0137429767;
  transform: rotate(13.1530131656deg);
  border-radius: 5px;
  animation: drop-90 4.5751711251s 0.9218106799s infinite;
}
@keyframes drop-90 {
  100% {
    top: 110%;
    left: 77%;
  }
}
.confetti-wrapper .confetti-91 {
  width: 9px;
  height: 3.6px;
  background-color: #62c462;
  top: -10%;
  left: 75%;
  opacity: 1.1058105827;
  transform: rotate(129.9521177878deg);
  border-radius: 5px;
  animation: drop-91 4.7779362203s 0.0684422901s infinite;
}
@keyframes drop-91 {
  100% {
    top: 110%;
    left: 76%;
  }
}
.confetti-wrapper .confetti-92 {
  width: 20px;
  height: 8px;
  background-color: #ee5f5b;
  top: -10%;
  left: 53%;
  opacity: 0.6532223822;
  transform: rotate(181.4069389993deg);
  border-radius: 5px;
  animation: drop-92 4.1069298672s 0.1929498516s infinite;
}
@keyframes drop-92 {
  100% {
    top: 110%;
    left: 64%;
  }
}
.confetti-wrapper .confetti-93 {
  width: 14px;
  height: 5.6px;
  background-color: #5bc0de;
  top: -10%;
  left: 58%;
  opacity: 0.8842685771;
  transform: rotate(49.8231109723deg);
  border-radius: 5px;
  animation: drop-93 4.7039529034s 0.5047576532s infinite;
}
@keyframes drop-93 {
  100% {
    top: 110%;
    left: 64%;
  }
}
.confetti-wrapper .confetti-94 {
  width: 17px;
  height: 6.8px;
  background-color: #f89406;
  top: -10%;
  left: 45%;
  opacity: 1.2274173897;
  transform: rotate(162.109732025deg);
  border-radius: 5px;
  animation: drop-94 4.3080733454s 0.3859676567s infinite;
}
@keyframes drop-94 {
  100% {
    top: 110%;
    left: 56%;
  }
}
.confetti-wrapper .confetti-95 {
  width: 4px;
  height: 1.6px;
  background-color: #62c462;
  top: -10%;
  left: 34%;
  opacity: 0.931863071;
  transform: rotate(41.5628861151deg);
  border-radius: 5px;
  animation: drop-95 4.5553266989s 0.1457996028s infinite;
}
@keyframes drop-95 {
  100% {
    top: 110%;
    left: 38%;
  }
}
.confetti-wrapper .confetti-96 {
  width: 17px;
  height: 6.8px;
  background-color: #5bc0de;
  top: -10%;
  left: 8%;
  opacity: 1.2675345467;
  transform: rotate(351.9504494263deg);
  border-radius: 5px;
  animation: drop-96 4.5997962541s 0.5745593239s infinite;
}
@keyframes drop-96 {
  100% {
    top: 110%;
    left: 22%;
  }
}
.confetti-wrapper .confetti-97 {
  width: 20px;
  height: 8px;
  background-color: #62c462;
  top: -10%;
  left: 48%;
  opacity: 1.1965325283;
  transform: rotate(107.4450365348deg);
  border-radius: 5px;
  animation: drop-97 4.4767190833s 0.9325675782s infinite;
}
@keyframes drop-97 {
  100% {
    top: 110%;
    left: 59%;
  }
}
.confetti-wrapper .confetti-98 {
  width: 10px;
  height: 4px;
  background-color: #62c462;
  top: -10%;
  left: 88%;
  opacity: 0.5870191653;
  transform: rotate(334.7922084145deg);
  border-radius: 5px;
  animation: drop-98 4.7525567082s 0.9960533158s infinite;
}
@keyframes drop-98 {
  100% {
    top: 110%;
    left: 96%;
  }
}
.confetti-wrapper .confetti-99 {
  width: 20px;
  height: 8px;
  background-color: #62c462;
  top: -10%;
  left: 81%;
  opacity: 0.8372377141;
  transform: rotate(138.5304464225deg);
  border-radius: 5px;
  animation: drop-99 4.5411470224s 0.5610119587s infinite;
}
@keyframes drop-99 {
  100% {
    top: 110%;
    left: 82%;
  }
}
.confetti-wrapper .confetti-100 {
  width: 15px;
  height: 6px;
  background-color: #62c462;
  top: -10%;
  left: 100%;
  opacity: 1.0053471138;
  transform: rotate(275.963142898deg);
  border-radius: 5px;
  animation: drop-100 4.9673502086s 0.06416847s infinite;
}
@keyframes drop-100 {
  100% {
    top: 110%;
    left: 102%;
  }
}
.confetti-wrapper .confetti-101 {
  width: 2px;
  height: 0.8px;
  background-color: #ee5f5b;
  top: -10%;
  left: 77%;
  opacity: 0.6839894259;
  transform: rotate(202.6608498698deg);
  border-radius: 5px;
  animation: drop-101 4.8404928931s 0.3416559772s infinite;
}
@keyframes drop-101 {
  100% {
    top: 110%;
    left: 92%;
  }
}
.confetti-wrapper .confetti-102 {
  width: 16px;
  height: 6.4px;
  background-color: #5bc0de;
  top: -10%;
  left: 87%;
  opacity: 0.690694403;
  transform: rotate(157.119107896deg);
  border-radius: 5px;
  animation: drop-102 4.9469787688s 0.6558774981s infinite;
}
@keyframes drop-102 {
  100% {
    top: 110%;
    left: 96%;
  }
}
.confetti-wrapper .confetti-103 {
  width: 14px;
  height: 5.6px;
  background-color: #62c462;
  top: -10%;
  left: 1%;
  opacity: 0.6919635179;
  transform: rotate(26.7128382354deg);
  border-radius: 5px;
  animation: drop-103 4.1214378163s 0.9285046907s infinite;
}
@keyframes drop-103 {
  100% {
    top: 110%;
    left: 16%;
  }
}
.confetti-wrapper .confetti-104 {
  width: 12px;
  height: 4.8px;
  background-color: #f89406;
  top: -10%;
  left: 42%;
  opacity: 1.3161183191;
  transform: rotate(335.3301275244deg);
  border-radius: 5px;
  animation: drop-104 4.5236718322s 0.1680649833s infinite;
}
@keyframes drop-104 {
  100% {
    top: 110%;
    left: 51%;
  }
}
.confetti-wrapper .confetti-105 {
  width: 12px;
  height: 4.8px;
  background-color: #f89406;
  top: -10%;
  left: 65%;
  opacity: 0.548948763;
  transform: rotate(4.8652004358deg);
  border-radius: 5px;
  animation: drop-105 4.3601725492s 0.2236299992s infinite;
}
@keyframes drop-105 {
  100% {
    top: 110%;
    left: 76%;
  }
}
.confetti-wrapper .confetti-106 {
  width: 18px;
  height: 7.2px;
  background-color: #ee5f5b;
  top: -10%;
  left: 40%;
  opacity: 1.1404103736;
  transform: rotate(217.6319736992deg);
  border-radius: 5px;
  animation: drop-106 4.779186248s 0.9430642933s infinite;
}
@keyframes drop-106 {
  100% {
    top: 110%;
    left: 42%;
  }
}
.confetti-wrapper .confetti-107 {
  width: 2px;
  height: 0.8px;
  background-color: #f89406;
  top: -10%;
  left: 49%;
  opacity: 1.065964359;
  transform: rotate(350.7631601296deg);
  border-radius: 5px;
  animation: drop-107 4.3297356655s 0.2613456174s infinite;
}
@keyframes drop-107 {
  100% {
    top: 110%;
    left: 55%;
  }
}
.confetti-wrapper .confetti-108 {
  width: 3px;
  height: 1.2px;
  background-color: #f89406;
  top: -10%;
  left: 66%;
  opacity: 1.3218709415;
  transform: rotate(133.4811357643deg);
  border-radius: 5px;
  animation: drop-108 4.265912507s 0.7586489733s infinite;
}
@keyframes drop-108 {
  100% {
    top: 110%;
    left: 70%;
  }
}
.confetti-wrapper .confetti-109 {
  width: 17px;
  height: 6.8px;
  background-color: #5bc0de;
  top: -10%;
  left: 55%;
  opacity: 1.2070081178;
  transform: rotate(230.6190776098deg);
  border-radius: 5px;
  animation: drop-109 4.5429106494s 0.0897267163s infinite;
}
@keyframes drop-109 {
  100% {
    top: 110%;
    left: 60%;
  }
}
.confetti-wrapper .confetti-110 {
  width: 3px;
  height: 1.2px;
  background-color: #f89406;
  top: -10%;
  left: 31%;
  opacity: 0.6192214196;
  transform: rotate(94.3154398085deg);
  border-radius: 5px;
  animation: drop-110 4.5507271073s 0.6508818163s infinite;
}
@keyframes drop-110 {
  100% {
    top: 110%;
    left: 43%;
  }
}
.confetti-wrapper .confetti-111 {
  width: 1px;
  height: 0.4px;
  background-color: #62c462;
  top: -10%;
  left: 59%;
  opacity: 1.1478564618;
  transform: rotate(33.962629999deg);
  border-radius: 5px;
  animation: drop-111 4.2058926268s 0.5147355419s infinite;
}
@keyframes drop-111 {
  100% {
    top: 110%;
    left: 68%;
  }
}
.confetti-wrapper .confetti-112 {
  width: 7px;
  height: 2.8px;
  background-color: #5bc0de;
  top: -10%;
  left: 72%;
  opacity: 0.573209863;
  transform: rotate(247.5679954113deg);
  border-radius: 5px;
  animation: drop-112 4.4228956471s 0.1735073254s infinite;
}
@keyframes drop-112 {
  100% {
    top: 110%;
    left: 76%;
  }
}
.confetti-wrapper .confetti-113 {
  width: 8px;
  height: 3.2px;
  background-color: #f89406;
  top: -10%;
  left: 61%;
  opacity: 0.9464743366;
  transform: rotate(20.8519665368deg);
  border-radius: 5px;
  animation: drop-113 4.9528140498s 0.0764135042s infinite;
}
@keyframes drop-113 {
  100% {
    top: 110%;
    left: 73%;
  }
}
.confetti-wrapper .confetti-114 {
  width: 14px;
  height: 5.6px;
  background-color: #5bc0de;
  top: -10%;
  left: 89%;
  opacity: 1.3309886666;
  transform: rotate(303.0594028974deg);
  border-radius: 5px;
  animation: drop-114 4.8673848944s 0.6383813223s infinite;
}
@keyframes drop-114 {
  100% {
    top: 110%;
    left: 102%;
  }
}
.confetti-wrapper .confetti-115 {
  width: 12px;
  height: 4.8px;
  background-color: #ee5f5b;
  top: -10%;
  left: 81%;
  opacity: 1.486097172;
  transform: rotate(280.6929397211deg);
  border-radius: 5px;
  animation: drop-115 4.1337092043s 0.0012062667s infinite;
}
@keyframes drop-115 {
  100% {
    top: 110%;
    left: 82%;
  }
}
.confetti-wrapper .confetti-116 {
  width: 1px;
  height: 0.4px;
  background-color: #62c462;
  top: -10%;
  left: 76%;
  opacity: 1.355795606;
  transform: rotate(264.1900478799deg);
  border-radius: 5px;
  animation: drop-116 4.3706653408s 0.3867854505s infinite;
}
@keyframes drop-116 {
  100% {
    top: 110%;
    left: 82%;
  }
}
.confetti-wrapper .confetti-117 {
  width: 13px;
  height: 5.2px;
  background-color: #62c462;
  top: -10%;
  left: 26%;
  opacity: 0.8622136547;
  transform: rotate(20.0200276508deg);
  border-radius: 5px;
  animation: drop-117 4.2749750711s 0.485946322s infinite;
}
@keyframes drop-117 {
  100% {
    top: 110%;
    left: 28%;
  }
}
.confetti-wrapper .confetti-118 {
  width: 4px;
  height: 1.6px;
  background-color: #62c462;
  top: -10%;
  left: 12%;
  opacity: 0.8058967419;
  transform: rotate(119.4622510448deg);
  border-radius: 5px;
  animation: drop-118 4.1188147091s 0.8917185452s infinite;
}
@keyframes drop-118 {
  100% {
    top: 110%;
    left: 24%;
  }
}
.confetti-wrapper .confetti-119 {
  width: 11px;
  height: 4.4px;
  background-color: #5bc0de;
  top: -10%;
  left: 31%;
  opacity: 0.6902958769;
  transform: rotate(14.7821001709deg);
  border-radius: 5px;
  animation: drop-119 4.2564517835s 0.2645292322s infinite;
}
@keyframes drop-119 {
  100% {
    top: 110%;
    left: 32%;
  }
}
.confetti-wrapper .confetti-120 {
  width: 18px;
  height: 7.2px;
  background-color: #f89406;
  top: -10%;
  left: 9%;
  opacity: 1.393838263;
  transform: rotate(114.3059569147deg);
  border-radius: 5px;
  animation: drop-120 4.1604414715s 0.4326070654s infinite;
}
@keyframes drop-120 {
  100% {
    top: 110%;
    left: 23%;
  }
}
.confetti-wrapper .confetti-121 {
  width: 12px;
  height: 4.8px;
  background-color: #5bc0de;
  top: -10%;
  left: 86%;
  opacity: 0.7848501281;
  transform: rotate(332.8095454025deg);
  border-radius: 5px;
  animation: drop-121 4.0104150357s 0.6339848397s infinite;
}
@keyframes drop-121 {
  100% {
    top: 110%;
    left: 89%;
  }
}
.confetti-wrapper .confetti-122 {
  width: 10px;
  height: 4px;
  background-color: #62c462;
  top: -10%;
  left: 57%;
  opacity: 1.4264669549;
  transform: rotate(54.4167800404deg);
  border-radius: 5px;
  animation: drop-122 4.1053054116s 0.2060706655s infinite;
}
@keyframes drop-122 {
  100% {
    top: 110%;
    left: 69%;
  }
}
.confetti-wrapper .confetti-123 {
  width: 20px;
  height: 8px;
  background-color: #ee5f5b;
  top: -10%;
  left: 75%;
  opacity: 0.6332219023;
  transform: rotate(221.3669608892deg);
  border-radius: 5px;
  animation: drop-123 4.3128877801s 0.631263426s infinite;
}
@keyframes drop-123 {
  100% {
    top: 110%;
    left: 88%;
  }
}
.confetti-wrapper .confetti-124 {
  width: 10px;
  height: 4px;
  background-color: #5bc0de;
  top: -10%;
  left: 42%;
  opacity: 1.1942902875;
  transform: rotate(152.1834807814deg);
  border-radius: 5px;
  animation: drop-124 4.4150085113s 0.3225256598s infinite;
}
@keyframes drop-124 {
  100% {
    top: 110%;
    left: 50%;
  }
}
.confetti-wrapper .confetti-125 {
  width: 19px;
  height: 7.6px;
  background-color: #62c462;
  top: -10%;
  left: 7%;
  opacity: 0.9050918516;
  transform: rotate(228.2718148525deg);
  border-radius: 5px;
  animation: drop-125 4.5468771802s 0.2916743033s infinite;
}
@keyframes drop-125 {
  100% {
    top: 110%;
    left: 14%;
  }
}
.confetti-wrapper .confetti-126 {
  width: 9px;
  height: 3.6px;
  background-color: #f89406;
  top: -10%;
  left: 66%;
  opacity: 1.4582323731;
  transform: rotate(123.8045835649deg);
  border-radius: 5px;
  animation: drop-126 4.4803641847s 0.9787584359s infinite;
}
@keyframes drop-126 {
  100% {
    top: 110%;
    left: 77%;
  }
}
.confetti-wrapper .confetti-127 {
  width: 8px;
  height: 3.2px;
  background-color: #ee5f5b;
  top: -10%;
  left: 11%;
  opacity: 1.43887673;
  transform: rotate(86.130806541deg);
  border-radius: 5px;
  animation: drop-127 4.0445012776s 0.434098643s infinite;
}
@keyframes drop-127 {
  100% {
    top: 110%;
    left: 15%;
  }
}
.confetti-wrapper .confetti-128 {
  width: 2px;
  height: 0.8px;
  background-color: #62c462;
  top: -10%;
  left: 89%;
  opacity: 0.5130574083;
  transform: rotate(31.9305237701deg);
  border-radius: 5px;
  animation: drop-128 4.3658999541s 0.5919165446s infinite;
}
@keyframes drop-128 {
  100% {
    top: 110%;
    left: 103%;
  }
}
.confetti-wrapper .confetti-129 {
  width: 5px;
  height: 2px;
  background-color: #62c462;
  top: -10%;
  left: 14%;
  opacity: 0.7294849433;
  transform: rotate(315.992623899deg);
  border-radius: 5px;
  animation: drop-129 4.9278034231s 0.4004009271s infinite;
}
@keyframes drop-129 {
  100% {
    top: 110%;
    left: 18%;
  }
}
.confetti-wrapper .confetti-130 {
  width: 3px;
  height: 1.2px;
  background-color: #ee5f5b;
  top: -10%;
  left: 73%;
  opacity: 1.3338435586;
  transform: rotate(27.51982036deg);
  border-radius: 5px;
  animation: drop-130 4.872488153s 0.7853275564s infinite;
}
@keyframes drop-130 {
  100% {
    top: 110%;
    left: 79%;
  }
}
.confetti-wrapper .confetti-131 {
  width: 16px;
  height: 6.4px;
  background-color: #5bc0de;
  top: -10%;
  left: 43%;
  opacity: 0.9334164085;
  transform: rotate(122.0837330113deg);
  border-radius: 5px;
  animation: drop-131 4.571686162s 0.7303546064s infinite;
}
@keyframes drop-131 {
  100% {
    top: 110%;
    left: 58%;
  }
}
.confetti-wrapper .confetti-132 {
  width: 20px;
  height: 8px;
  background-color: #ee5f5b;
  top: -10%;
  left: 99%;
  opacity: 1.0010729951;
  transform: rotate(210.7077613875deg);
  border-radius: 5px;
  animation: drop-132 4.511329483s 0.2356765472s infinite;
}
@keyframes drop-132 {
  100% {
    top: 110%;
    left: 112%;
  }
}
.confetti-wrapper .confetti-133 {
  width: 6px;
  height: 2.4px;
  background-color: #5bc0de;
  top: -10%;
  left: 82%;
  opacity: 1.3525503422;
  transform: rotate(199.7827509141deg);
  border-radius: 5px;
  animation: drop-133 4.6754928793s 0.9312810658s infinite;
}
@keyframes drop-133 {
  100% {
    top: 110%;
    left: 96%;
  }
}
.confetti-wrapper .confetti-134 {
  width: 9px;
  height: 3.6px;
  background-color: #f89406;
  top: -10%;
  left: 13%;
  opacity: 0.8876738683;
  transform: rotate(277.7809313262deg);
  border-radius: 5px;
  animation: drop-134 4.4759392586s 0.3681422334s infinite;
}
@keyframes drop-134 {
  100% {
    top: 110%;
    left: 22%;
  }
}
.confetti-wrapper .confetti-135 {
  width: 18px;
  height: 7.2px;
  background-color: #f89406;
  top: -10%;
  left: 49%;
  opacity: 0.8476183825;
  transform: rotate(337.3053740318deg);
  border-radius: 5px;
  animation: drop-135 4.6553545077s 0.0040774686s infinite;
}
@keyframes drop-135 {
  100% {
    top: 110%;
    left: 57%;
  }
}
.confetti-wrapper .confetti-136 {
  width: 5px;
  height: 2px;
  background-color: #5bc0de;
  top: -10%;
  left: 99%;
  opacity: 0.7633636634;
  transform: rotate(69.5309551546deg);
  border-radius: 5px;
  animation: drop-136 4.23372892s 0.9456951584s infinite;
}
@keyframes drop-136 {
  100% {
    top: 110%;
    left: 106%;
  }
}
.confetti-wrapper .confetti-137 {
  width: 1px;
  height: 0.4px;
  background-color: #5bc0de;
  top: -10%;
  left: 11%;
  opacity: 0.8242317533;
  transform: rotate(154.4036577913deg);
  border-radius: 5px;
  animation: drop-137 4.9748291705s 0.4330919956s infinite;
}
@keyframes drop-137 {
  100% {
    top: 110%;
    left: 25%;
  }
}
.confetti-wrapper .confetti-138 {
  width: 9px;
  height: 3.6px;
  background-color: #f89406;
  top: -10%;
  left: 5%;
  opacity: 1.1652005693;
  transform: rotate(184.9279433354deg);
  border-radius: 5px;
  animation: drop-138 4.8471591403s 0.8746624611s infinite;
}
@keyframes drop-138 {
  100% {
    top: 110%;
    left: 16%;
  }
}
.confetti-wrapper .confetti-139 {
  width: 12px;
  height: 4.8px;
  background-color: #62c462;
  top: -10%;
  left: 26%;
  opacity: 0.7383772742;
  transform: rotate(218.4014927769deg);
  border-radius: 5px;
  animation: drop-139 4.4332179766s 0.4030240264s infinite;
}
@keyframes drop-139 {
  100% {
    top: 110%;
    left: 34%;
  }
}
.confetti-wrapper .confetti-140 {
  width: 11px;
  height: 4.4px;
  background-color: #5bc0de;
  top: -10%;
  left: 10%;
  opacity: 0.5271426765;
  transform: rotate(89.4908043917deg);
  border-radius: 5px;
  animation: drop-140 4.6282748699s 0.9555377271s infinite;
}
@keyframes drop-140 {
  100% {
    top: 110%;
    left: 15%;
  }
}
.confetti-wrapper .confetti-141 {
  width: 18px;
  height: 7.2px;
  background-color: #62c462;
  top: -10%;
  left: 1%;
  opacity: 1.3986475466;
  transform: rotate(18.5109742529deg);
  border-radius: 5px;
  animation: drop-141 4.7723244646s 0.9787261719s infinite;
}
@keyframes drop-141 {
  100% {
    top: 110%;
    left: 7%;
  }
}
.confetti-wrapper .confetti-142 {
  width: 18px;
  height: 7.2px;
  background-color: #62c462;
  top: -10%;
  left: 33%;
  opacity: 1.3381667727;
  transform: rotate(117.1511014474deg);
  border-radius: 5px;
  animation: drop-142 4.4376903725s 0.2796259396s infinite;
}
@keyframes drop-142 {
  100% {
    top: 110%;
    left: 35%;
  }
}
.confetti-wrapper .confetti-143 {
  width: 16px;
  height: 6.4px;
  background-color: #f89406;
  top: -10%;
  left: 84%;
  opacity: 1.353806144;
  transform: rotate(63.9125632772deg);
  border-radius: 5px;
  animation: drop-143 4.7809801325s 0.7089589089s infinite;
}
@keyframes drop-143 {
  100% {
    top: 110%;
    left: 94%;
  }
}
.confetti-wrapper .confetti-144 {
  width: 14px;
  height: 5.6px;
  background-color: #62c462;
  top: -10%;
  left: 3%;
  opacity: 1.4616477256;
  transform: rotate(182.74088834deg);
  border-radius: 5px;
  animation: drop-144 4.934804749s 0.5059533041s infinite;
}
@keyframes drop-144 {
  100% {
    top: 110%;
    left: 15%;
  }
}
.confetti-wrapper .confetti-145 {
  width: 9px;
  height: 3.6px;
  background-color: #62c462;
  top: -10%;
  left: 11%;
  opacity: 0.7350752335;
  transform: rotate(134.8441854394deg);
  border-radius: 5px;
  animation: drop-145 4.6901443989s 0.1657806361s infinite;
}
@keyframes drop-145 {
  100% {
    top: 110%;
    left: 22%;
  }
}
.confetti-wrapper .confetti-146 {
  width: 17px;
  height: 6.8px;
  background-color: #5bc0de;
  top: -10%;
  left: 81%;
  opacity: 0.6843658365;
  transform: rotate(36.5223714714deg);
  border-radius: 5px;
  animation: drop-146 4.1961255097s 0.8005899076s infinite;
}
@keyframes drop-146 {
  100% {
    top: 110%;
    left: 82%;
  }
}
.confetti-wrapper .confetti-147 {
  width: 14px;
  height: 5.6px;
  background-color: #5bc0de;
  top: -10%;
  left: 81%;
  opacity: 1.4655860026;
  transform: rotate(123.4336908004deg);
  border-radius: 5px;
  animation: drop-147 4.7945325875s 0.0202332258s infinite;
}
@keyframes drop-147 {
  100% {
    top: 110%;
    left: 89%;
  }
}
.confetti-wrapper .confetti-148 {
  width: 10px;
  height: 4px;
  background-color: #5bc0de;
  top: -10%;
  left: 5%;
  opacity: 1.0625093074;
  transform: rotate(10.8317602648deg);
  border-radius: 5px;
  animation: drop-148 4.8451198712s 0.8155042004s infinite;
}
@keyframes drop-148 {
  100% {
    top: 110%;
    left: 7%;
  }
}
.confetti-wrapper .confetti-149 {
  width: 15px;
  height: 6px;
  background-color: #5bc0de;
  top: -10%;
  left: 3%;
  opacity: 0.8104327294;
  transform: rotate(151.3371317709deg);
  border-radius: 5px;
  animation: drop-149 4.863059517s 0.0901599678s infinite;
}
@keyframes drop-149 {
  100% {
    top: 110%;
    left: 6%;
  }
}
.confetti-wrapper .confetti-150 {
  width: 18px;
  height: 7.2px;
  background-color: #5bc0de;
  top: -10%;
  left: 24%;
  opacity: 1.3190486621;
  transform: rotate(83.0721818615deg);
  border-radius: 5px;
  animation: drop-150 4.3422118114s 0.3633339786s infinite;
}
@keyframes drop-150 {
  100% {
    top: 110%;
    left: 39%;
  }
}
