.main_page {
  width: 100vw;
  height: 100vh;
  background-image: url("/images/main_page.png");
  background-size: cover;
  background-position: center center;
}
.main_page .inner_holder {
  height: 100%;
  background-image: url("/images/main_page_inner.png");
  background-size: cover;
  background-position: center center;
  border-radius: inherit;
}

.setup_game_page_body {
  width: 100%;
  min-height: 100vh;
  overflow: visible;
}

.winners_modal {
  box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
  height: 70%;
  width: 60%;
  padding: 2em;
  position: absolute;
  top: 0;
  bottom: 0;
  margin-top: auto;
  margin-bottom: auto;
  left: 0;
  right: 0;
  margin-left: auto;
  margin-right: auto;
  z-index: 20;
  border-radius: 11px;
  display: flex;
  align-items: stretch;
}
.winners_modal h3 {
  text-align: center;
  margin-bottom: 1em;
}
.winners_modal .history_log_holder {
  width: 50%;
  max-height: none;
  margin-bottom: 2em;
}
.winners_modal .player_section {
  width: 50%;
}
.winners_modal .player_section h2 {
  text-align: center;
  margin-top: 2em;
}
.winners_modal .player_section h3 {
  text-align: center;
  margin-top: 1em;
}
.winners_modal .player_section img {
  display: block;
  margin: auto;
  width: 10em;
  height: 10em;
  margin-top: 2em;
}
.winners_modal .player_section a {
  display: block;
  margin: auto;
  width: -moz-fit-content;
  width: fit-content;
  text-decoration: none;
}
.winners_modal .player_section button {
  border: none;
  background-color: #6658D3;
  color: white;
  margin: auto;
  display: block;
  font-size: 1em;
  padding: 0.5em 1em 0.5em 1em;
  border-radius: 6px;
  margin-bottom: 2em;
  margin-top: 1em;
  cursor: pointer;
}
.winners_modal .player_section button:hover {
  background-color: white;
  outline: 1px solid #6658D3;
  color: #6658D3;
}

@media all and (max-width: 1000px) {
  .winners_modal {
    width: 100%;
    height: 100%;
  }
}
@media all and (max-width: 500px) {
  .winners_modal {
    display: block;
    box-shadow: none;
  }
  .winners_modal .player_section {
    width: 100%;
    margin: auto;
  }
  .winners_modal .history_log_holder {
    width: 100%;
    max-height: 20vh;
    margin: 0;
  }
  .winners_modal .history_log_holder .history {
    width: 100%;
  }
}
.not_found_page {
  width: 100%;
  height: 100vh;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}
.not_found_page div {
  font-family: MV Boli;
  font-size: 200px;
  background: linear-gradient(to right, #ff00cc, #3333cc);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.not_found_page p {
  font-size: 30px;
}
.not_found_page button {
  transition: all 0.5s;
  color: white;
  background-color: #6658D3;
  min-height: 3em;
  border: none;
  border-radius: 6px;
  margin-top: 3em;
  padding-left: 1em;
  padding-right: 1em;
  cursor: pointer;
}
.not_found_page button:hover {
  background-color: white;
  border: solid 2px #6658D3;
  color: #6658D3;
}

.game_room_holder {
  display: flex;
  height: 100dvh;
  overflow: hidden;
}

@keyframes test {
  100% {
    transform: translateX(100%) rotateZ(90deg);
  }
}
:root {
  --table-border-radius:20em;
  --table-border-color:#a95555;
  --table-main-color:#6658D3;
  --table-darker-color:rgb(68, 49, 214);
  --table-before-color:rgba(0, 0, 0, .1);
  --table-after-color:rgba(0, 0, 0, .1);
}

.table_holder {
  width: 70%;
  display: flex;
  justify-content: center;
  align-items: center;
}
.table_holder .table {
  transition: all 1s;
  width: 80%;
  height: 50%;
  border-radius: var(--table-border-radius);
  border: 15px solid var(--table-border-color);
  background: radial-gradient(circle at center, var(--table-darker-color) 0%, var(--table-main-color) 100%);
  position: relative;
}
.table_holder .table:before {
  transition: all 1s;
  content: "";
  border: 7px solid var(--table-before-color);
  display: block;
  width: calc(100% + 30px);
  height: calc(100% + 30px);
  border-radius: var(--table-border-radius);
  position: absolute;
  top: -15px;
  left: -15px;
}
.table_holder .table:after {
  transition: all 1s;
  content: "";
  border: 7px solid var(--table-after-color);
  display: block;
  width: calc(100% - 3px);
  height: calc(100% - 3px);
  border-radius: var(--table-border-radius);
  position: absolute;
  top: 0;
  left: 0;
}
.table_holder .table .dealer {
  position: absolute;
  border-radius: 50%;
  z-index: 2;
  width: 7em;
  height: 7em;
  left: 0;
  right: 0;
  margin-left: auto;
  margin-right: auto;
  transform: translateY(-120%);
  text-align: center;
}
.table_holder .table .dealer img {
  border-radius: inherit;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.table_holder .table .dealer p {
  font-weight: bold;
  color: grey;
}
.table_holder .table .pot_holder {
  padding: 1em;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: white;
  border: 3px solid gold;
  min-width: 30%;
  height: 30%;
  border-radius: 30%;
  display: flex;
  align-items: center;
  text-align: center;
  gap: 1em;
  justify-content: center;
}
.table_holder .table .pot_holder div {
  width: -moz-fit-content;
  width: fit-content;
}
.table_holder .table .pot_holder div p {
  margin: 0;
}
.table_holder .table .pot_holder img {
  width: 1.5em;
  height: 1.5em;
}

@media all and (max-height: 750px), (max-width: 1000px) {
  .table_holder .table {
    height: 60%;
  }
  .table_holder .table .dealer {
    transform: translateY(-150%);
    width: 4em;
    height: 4em;
  }
  .table_holder .table .dealer P {
    margin-bottom: 0;
  }
  .table_holder .table .pot_holder {
    height: 40%;
  }
}
.player {
  width: 7em;
  height: -moz-fit-content;
  height: fit-content;
  position: absolute;
  z-index: 2;
  transition: all 1s;
  border-radius: 11px;
  padding: 0.5em;
  background-color: white;
  box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
  animation: player_pop_up 1.5s;
}
@keyframes player_pop_up {
  0% {
    transform: scale(0);
  }
  50% {
    transform: scale(1.2);
  }
  100% {
    transform: scale(1);
  }
}
.player .player_bet {
  position: absolute;
  font-size: 13px;
  color: white;
  font-weight: bold;
  display: flex;
  justify-content: center;
  align-items: center;
}
.player .player_bet img {
  width: 2.3em;
  height: 2.3em;
}
.player .button {
  width: 2em;
  position: absolute;
  border-radius: 50%;
}
.player .you_indication {
  font-size: 12px;
  color: white;
  background-color: rgb(248, 74, 74);
  position: absolute;
  top: 0;
  left: 0;
  width: -moz-fit-content;
  width: fit-content;
  padding: 5px;
  border-top-left-radius: 6px;
  border-bottom-right-radius: 6px;
  font-weight: bold;
}
.player .player_avatar {
  margin: auto;
  margin-top: 1em;
  box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
  border-radius: 50%;
  width: 80%;
  display: block;
  -o-object-fit: cover;
     object-fit: cover;
}
.player .player_name {
  font-weight: 600;
  margin: auto;
  color: rgb(94, 91, 91);
  text-align: center;
  word-wrap: break-word;
}
.player .flex {
  align-items: center;
  justify-content: center;
  display: flex;
}
.player .coins {
  border-radius: none;
  width: 30%;
  height: 30%;
}

#player-0 {
  bottom: 0;
  left: 0;
  right: 0;
  margin-left: auto;
  margin-right: auto;
  top: 90%;
}
#player-0 .player_bet {
  right: 110%;
}
#player-0 .button {
  left: 120%;
}

#player-8 {
  right: 15%;
  top: 90%;
}
#player-8 .player_bet {
  right: 110%;
}
#player-8 .button {
  left: 100%;
  top: -10%;
}

#player-7 {
  bottom: 2%;
  right: -5%;
}
#player-7 .player_bet {
  right: 110%;
  top: 35%;
}
#player-7 .button {
  left: -40%;
}

#player-6 {
  top: 2%;
  right: -5%;
}
#player-6 .player_bet {
  right: 110%;
  top: 50%;
}
#player-6 .button {
  left: -40%;
  top: 30%;
}

#player-5 {
  bottom: 90%;
  right: 15%;
}
#player-5 .player_bet {
  top: 80%;
  right: 110%;
}
#player-5 .button {
  top: 110%;
}

#player-4 {
  left: 15%;
  bottom: 90%;
}
#player-4 .player_bet {
  left: 110%;
  top: 80%;
}
#player-4 .button {
  top: 110%;
}

#player-3 {
  top: 2%;
  left: -5%;
}
#player-3 .player_bet {
  left: 110%;
  top: 80%;
}
#player-3 .button {
  left: 120%;
  top: 50%;
}

#player-2 {
  bottom: 2%;
  left: -5%;
}
#player-2 .player_bet {
  left: 110%;
}
#player-2 .button {
  left: 120%;
  top: 20%;
}

#player-1 {
  top: 90%;
  left: 15%;
}
#player-1 .player_bet {
  left: 110%;
}
#player-1 .button {
  left: 120%;
  top: -20%;
}

.current {
  transform: scale(1.2) !important;
  background-color: rgb(128, 255, 111);
  box-shadow: rgba(0, 0, 0, 0.25) 0px 54px 55px, rgba(0, 0, 0, 0.12) 0px -12px 30px, rgba(0, 0, 0, 0.12) 0px 4px 6px, rgba(0, 0, 0, 0.17) 0px 12px 13px, rgba(0, 0, 0, 0.09) 0px -3px 5px;
  z-index: 3;
}

.folded {
  opacity: 0.3;
}

.lost {
  opacity: 0.4;
  background-color: rgb(250, 133, 133);
}

.big_blind, .small_blind {
  font-size: small;
  padding: 5px;
  position: absolute;
  top: 0;
  right: 0;
  background-color: rgb(233, 88, 88);
  display: flex;
  justify-content: center;
  align-items: center;
  font-weight: bold;
  border-bottom-left-radius: 5px;
  border-top-right-radius: 5px;
  color: white;
}

.small_blind {
  background-color: gold;
}

.hidden {
  display: none;
}

.animation_bet {
  animation: expand 0.5s;
}
@keyframes bet_animation {
  50% {
    transform: scale(2);
  }
  100% {
    top: 0;
    left: 0;
    transform: scale(1);
  }
}
@keyframes expand {
  0% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.5);
  }
  100% {
    transform: scale(1);
  }
}

@media all and (max-height: 750px), (max-width: 1600px) {
  .player {
    width: 6em;
    padding: 0.1em;
    font-size: 10px;
  }
  .player .player_bet {
    font-size: 10px;
  }
  .player .player_name {
    font-size: small;
  }
  .player .big_blind, .player .small_blind {
    font-size: 8px;
  }
  .player .you_indication {
    font-size: 8px;
  }
}
@media all and (max-height: 500px), (max-width: 750px) {
  .player {
    font-size: 10px;
    width: 4em;
  }
  .player .player_avatar {
    margin-top: 3px;
  }
  .player .player_name {
    color: black;
    font-weight: bold;
    margin-top: 2px;
    margin-left: 0;
    margin-right: 0;
    font-size: 11px;
  }
  .player .big_blind, .player .small_blind, .player .you_indication {
    padding: 1px;
  }
  .player .flex {
    margin-top: 0;
  }
  .player .flex p {
    margin: 0;
  }
}
.dashboard_holder {
  width: 30%;
  height: 100%;
  box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px;
  padding: 1em;
  display: flex;
  flex-direction: column;
}

.history_log_holder {
  margin-top: 2em;
  max-height: 40%;
}
.history_log_holder .history {
  box-shadow: rgba(50, 50, 93, 0.25) 0px 2px 5px -1px, rgba(0, 0, 0, 0.3) 0px 1px 3px -1px;
  border-radius: 11px;
  height: 100%;
  overflow-y: scroll;
  padding-left: 1em;
  padding-right: 1em;
}
.history_log_holder .history p {
  border-bottom: 1px rgba(0, 0, 0, 0.185) solid;
}
.history_log_holder .history p:last-child {
  border: none;
}

@media all and (max-height: 500px), (max-width: 1000px) {
  .dashboard_holder {
    font-size: small;
    padding-top: 0.5em;
  }
}
@media all and (max-width: 600px) {
  .dashboard_holder {
    font-size: 10px;
  }
}
input[type=range] {
  -webkit-appearance: none;
  display: inline-block;
  vertical-align: middle;
  font-size: 1em;
  font-family: Arial, sans-serif;
  width: 100%;
  height: 1em;
  background: rgba(255, 255, 255, 0.6);
  border-radius: 25px;
  background: linear-gradient(94deg, rgb(136, 125, 226) 0%, rgb(50, 27, 224) 100%);
  background-size: 0% 100%;
  background-repeat: no-repeat;
  margin-top: 1em;
  margin-bottom: 1em;
  position: relative;
}

/* Input Thumb */
input[type=range]::-webkit-slider-thumb {
  -webkit-appearance: none;
  height: 1.7em;
  width: 1.7em;
  border-radius: 50%;
  box-shadow: rgba(0, 0, 0, 0.25) 0px 54px 55px, rgba(0, 0, 0, 0.12) 0px -12px 30px, rgba(0, 0, 0, 0.12) 0px 4px 6px, rgba(0, 0, 0, 0.17) 0px 12px 13px, rgba(0, 0, 0, 0.09) 0px -3px 5px;
  cursor: ew-resize;
  margin-top: -0.35em;
  background-color: white;
  position: relative;
  z-index: 2;
}

input[type=range]::-moz-range-thumb {
  -webkit-appearance: none;
  height: 1.7em;
  width: 1.7em;
  border-radius: 50%;
  box-shadow: rgba(0, 0, 0, 0.25) 0px 54px 55px, rgba(0, 0, 0, 0.12) 0px -12px 30px, rgba(0, 0, 0, 0.12) 0px 4px 6px, rgba(0, 0, 0, 0.17) 0px 12px 13px, rgba(0, 0, 0, 0.09) 0px -3px 5px;
  cursor: ew-resize;
  margin-top: -0.35em;
  background-color: white;
  position: relative;
  z-index: 2;
}

input[type=range]::-ms-thumb {
  -webkit-appearance: none;
  height: 1.7em;
  width: 1.7em;
  border-radius: 50%;
  box-shadow: rgba(0, 0, 0, 0.25) 0px 54px 55px, rgba(0, 0, 0, 0.12) 0px -12px 30px, rgba(0, 0, 0, 0.12) 0px 4px 6px, rgba(0, 0, 0, 0.17) 0px 12px 13px, rgba(0, 0, 0, 0.09) 0px -3px 5px;
  cursor: ew-resize;
  margin-top: -0.35em;
  background-color: white;
  position: relative;
  z-index: 2;
}

input[type=range]::-webkit-slider-thumb:hover {
  box-shadow: 0px 0px 0px 7px rgba(102, 88, 211, 0.452);
}

input[type=range]::-moz-range-thumb:hover {
  box-shadow: 0px 0px 0px 7px rgba(102, 88, 211, 0.452);
}

input[type=range]::-ms-thumb:hover {
  box-shadow: 0px 0px 0px 7px rgba(102, 88, 211, 0.452);
}

/* Input Track */
input[type=range]::-webkit-slider-runnable-track {
  -webkit-appearance: none;
  box-shadow: none;
  border: none;
  background: transparent;
  box-shadow: inset 0px 0px 10px 1px rgb(196, 196, 196);
  border-radius: 25px;
  height: 1em;
}

input[type=range]::-moz-range-track {
  -webkit-appearance: none;
  box-shadow: none;
  border: none;
  background: transparent;
  box-shadow: inset 0px 0px 10px 1px rgb(196, 196, 196);
  border-radius: 25px;
  height: 1em;
}

input[type=range]::-ms-track {
  -webkit-appearance: none;
  box-shadow: none;
  border: none;
  background: transparent;
  box-shadow: inset 0px 0px 10px 1px rgb(196, 196, 196);
  border-radius: 25px;
  height: 1em;
}

.image_select_holder {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  margin-top: 1em;
  margin-bottom: 1em;
}
.image_select_holder div {
  padding: 0.5em;
  border-radius: 11px;
  cursor: pointer;
}
.image_select_holder div:hover {
  background-color: rgba(157, 157, 158, 0.5882352941);
}
.image_select_holder img {
  width: 3em;
  height: 3em;
  border-radius: 50%;
}
.image_select_holder .selected {
  background-color: rgba(102, 88, 211, 0.5882352941);
  transition: all 0.5s;
  border-radius: 15px;
}
.image_select_holder .selected:hover {
  background-color: rgba(102, 88, 211, 0.5882352941);
}

.menu_holder {
  width: 20%;
  position: fixed;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 5;
  background-color: white;
  box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px;
  padding-left: 1em;
  padding-right: 1em;
  transition: all 1s;
}
.menu_holder img {
  transition: all 1s;
  position: absolute;
  right: 0.1em;
  top: 0.1em;
  cursor: pointer;
  width: 3em;
}
.menu_holder p {
  text-align: center;
  border-bottom: solid 1px rgba(128, 128, 128, 0.274);
  padding-top: 0.6em;
  padding-bottom: 0.6em;
  cursor: pointer;
}
.menu_holder p:first-of-type {
  margin-top: 3em;
}
.menu_holder p:hover {
  background-color: rgba(128, 128, 128, 0.274);
}

.minimized {
  transform: translateX(-100%);
}
.minimized .menu_icon_holder img {
  transform: translateX(100%);
}

@media all and (max-width: 1200px) {
  .menu_holder {
    width: 30%;
  }
}
@media all and (max-width: 650px) {
  .menu_holder {
    width: 50%;
  }
}
@media all and (max-width: 450px) {
  .menu_holder {
    width: 100%;
  }
}
.body {
  justify-content: center;
  align-items: center;
  display: flex;
  padding: 0;
  margin: 0;
  width: 100%;
}

.progress {
  background: rgba(53, 22, 226, 0.1);
  justify-content: flex-start;
  border-radius: 100px;
  align-items: center;
  position: relative;
  padding: 0 5px;
  display: flex;
  height: 30px;
  width: 100%;
}

.progress-value {
  transition: all 0.5s;
  box-shadow: 0 10px 40px -10px #474747;
  border-radius: 100px;
  background: #6658D3;
  height: 20px;
  width: 0;
}

@keyframes load {
  0% {
    width: 0;
  }
  100% {
    width: 28%;
  }
}
@media all and (max-width: 900px) {
  .progress {
    height: 10px;
  }
}
.lds-ring {
  display: inline-block;
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  margin: auto;
  width: 80px;
  height: 80px;
}

.lds-ring div {
  box-sizing: border-box;
  display: block;
  position: absolute;
  width: 64px;
  height: 64px;
  margin: 8px;
  border: 8px solid #fff;
  border-radius: 50%;
  animation: lds-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
  border-color: #6658D3 transparent transparent transparent;
}

.lds-ring div:nth-child(1) {
  animation-delay: -0.45s;
}

.lds-ring div:nth-child(2) {
  animation-delay: -0.3s;
}

.lds-ring div:nth-child(3) {
  animation-delay: -0.15s;
}

@keyframes lds-ring {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
.lds-dual-ring {
  display: block;
  width: 80px;
  height: 80px;
  top: 0;
  bottom: 0;
  margin-top: auto;
  margin-bottom: auto;
  left: 0;
  right: 0;
  margin-left: auto;
  margin-right: auto;
}

.lds-dual-ring:after {
  content: " ";
  display: block;
  width: 64px;
  height: 64px;
  margin: 8px;
  border-radius: 50%;
  border: 6px solid #6658D3;
  border-color: #6658D3 transparent #6658D3 transparent;
  animation: lds-dual-ring 1.2s linear infinite;
}

@keyframes lds-dual-ring {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
@media all and (max-width: 1500px) {
  .lds-dual-ring {
    margin-top: 0;
  }
}
.blur_background {
  width: 100vw;
  height: 100dvh;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 10;
  -webkit-backdrop-filter: blur(3px);
          backdrop-filter: blur(3px);
}

.stop_scrolling {
  height: 100%;
  overflow: hidden;
}

.modal_frame {
  width: -moz-fit-content;
  width: fit-content;
  margin: auto;
  background-color: white;
  margin-top: 2em;
  border-radius: 11px;
  box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
  animation: pop_up 1s;
}
.modal_frame img {
  width: 1em;
}
.modal_frame header {
  height: 5em;
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 3em;
  padding-top: 0.8em;
  padding-bottom: 0.8em;
  border-bottom: solid 1px rgba(128, 128, 128, 0.212);
}
.modal_frame header div:first-of-type {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-left: 2em;
}
.modal_frame header div:first-of-type img {
  width: 3em;
  height: 3em;
}
.modal_frame header div:first-of-type p {
  margin-left: 1em;
  font-size: 1.4em;
}
.modal_frame header div:last-of-type {
  background-color: rgba(128, 128, 128, 0.493);
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 5px;
  height: 3em;
  width: 3em;
  margin-right: 1em;
  cursor: pointer;
}
.modal_frame header div:last-of-type:hover {
  background-color: rgba(128, 128, 128, 0.192);
}
.modal_frame header div:last-of-type img {
  width: 3em;
}
.modal_frame footer {
  margin-top: 2em;
  border-top: solid 1px rgba(128, 128, 128, 0.212);
  height: 5em;
}
@keyframes pop_up {
  0% {
    transform: scaleX(0.1);
  }
  100% {
    transform: scaleX(1);
  }
}

.rules {
  width: 90%;
  min-height: 40vh;
  padding-left: 4em;
  padding-right: 4em;
  padding-top: 4em;
}
.rules h3 {
  text-align: center;
  margin-bottom: 3em;
}
.rules strong {
  display: block;
  font-size: 1.2em;
  margin-top: 1em;
  margin-bottom: 1em;
}
.rules ul {
  margin-left: 5em;
}
.rules ul li {
  line-height: 2em;
  font-weight: bold;
  color: rgba(0, 0, 0, 0.712);
}
.rules ul ul {
  margin-left: 5em;
}
.rules ul img {
  width: 17em;
  float: right;
  margin: 1em;
}

@media all and (max-width: 1300px) {
  .rules ul li {
    font-size: 1em;
  }
  .rules ul img {
    width: 10em;
  }
}
@media all and (max-width: 700px) {
  .rules ul {
    margin-left: 1em;
  }
  .rules ul li {
    line-height: 1em;
    font-size: 1em;
  }
  .rules ul img {
    width: 5em;
  }
}
@media all and (max-width: 550px) {
  .rules {
    padding-left: 2em;
    padding-right: 2em;
    width: 100%;
  }
  .rules ul {
    margin-left: 1em;
  }
  .rules ul li {
    line-height: 1em;
    font-size: 1em;
  }
  .rules ul img {
    width: 3em;
  }
}
.text_input_modal {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin-left: auto;
  margin-right: auto;
  margin-top: auto;
  margin-bottom: auto;
  height: -moz-fit-content;
  height: fit-content;
  background-color: white;
  box-shadow: rgba(0, 0, 0, 0.16) 0px 3px 6px, rgba(0, 0, 0, 0.23) 0px 3px 6px;
  border-radius: 5px;
  width: 40%;
  z-index: 3;
  padding: 1em;
}
.text_input_modal header {
  text-align: center;
  color: grey;
  font-weight: bold;
  font-size: 1.2em;
}
.text_input_modal textarea {
  margin-top: 1em;
  margin-bottom: 1em;
  width: 100%;
  padding: 0.5em;
  padding-bottom: 20vh;
  font-size: 1.2em;
  font-weight: bold;
  color: grey;
  word-wrap: break-word;
  word-break: break-all;
  resize: none;
}
.text_input_modal select {
  width: 100%;
  padding: 0.5em 0.2em;
  margin-bottom: 1em;
  border-radius: 6px;
}
.text_input_modal select option {
  font-size: 1.2em;
}
.text_input_modal .error {
  color: red;
  margin-top: 0.5em;
  margin-bottom: 0.5em;
  text-align: center;
}

@media all and (max-height: 350px) {
  .text_input_modal {
    height: 80%;
    overflow: auto;
  }
}
.right_answer_modal {
  position: absolute;
  z-index: 5;
  background-color: white;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  margin-top: auto;
  margin-bottom: auto;
  margin-left: auto;
  margin-right: auto;
  max-height: 60%;
  width: 25em;
  overflow-y: scroll;
  padding: 2em;
  box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
  border-radius: 11px;
  animation: pop_up 0.5s;
}
@keyframes pop_up {
  0% {
    transform: scale(0.5);
  }
  100% {
    transform: scale(1);
  }
}
.right_answer_modal .holder {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 1em;
}
.right_answer_modal .holder label {
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.right_answer_modal .holder label p {
  margin-left: 1em;
  font-weight: bold;
  color: grey;
  font-size: 1.2em;
}
.right_answer_modal .right_answer_input_holder label {
  text-align: center;
  display: block;
  width: 100%;
  font-size: 1.2em;
}
.right_answer_modal .right_answer_input_holder input[type=text] {
  border-radius: 6px;
  padding: 1em 0.5em;
  display: block;
  width: 100%;
  margin-bottom: 1em;
  margin-top: 1em;
}
.right_answer_modal img {
  width: 3em;
  height: 3em;
}
.right_answer_modal .answer {
  box-shadow: rgba(0, 0, 0, 0.18) 0px 2px 4px;
  margin-bottom: 2em;
  padding: 14px;
  border-radius: 6px;
  color: grey;
  font-weight: bold;
  animation: show 1s;
  transform-origin: top;
  transition: all 1s;
}
.right_answer_modal .animation_class {
  background-color: rgba(128, 128, 128, 0.219);
}
@keyframes show {
  0% {
    scale: 0;
  }
  100% {
    scale: 1;
  }
}

@media all and (max-height: 550px) {
  .right_answer_modal {
    max-height: 90%;
    height: 90%;
    width: 50%;
  }
}
.slider_particle_container {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  pointer-events: none;
}
.slider_particle_container .particle {
  position: absolute;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  pointer-events: none;
}

.confetti {
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  width: 100%;
  height: 100vh;
  z-index: -1;
  overflow: hidden;
}

.confetti-piece {
  position: absolute;
  width: 8px;
  height: 16px;
  background: #ffd300;
  top: 0;
  opacity: 0;
}
.confetti-piece:nth-child(1) {
  left: 7%;
  transform: rotate(13deg);
  animation: makeItRain 3000ms infinite ease-out;
  animation-delay: 1259ms;
  animation-duration: 2362ms;
}
.confetti-piece:nth-child(2) {
  left: 14%;
  transform: rotate(38deg);
  animation: makeItRain 3000ms infinite ease-out;
  animation-delay: 1330ms;
  animation-duration: 2655ms;
}
.confetti-piece:nth-child(3) {
  left: 21%;
  transform: rotate(-53deg);
  animation: makeItRain 3000ms infinite ease-out;
  animation-delay: 188ms;
  animation-duration: 3357ms;
}
.confetti-piece:nth-child(4) {
  left: 28%;
  transform: rotate(42deg);
  animation: makeItRain 3000ms infinite ease-out;
  animation-delay: 874ms;
  animation-duration: 3565ms;
}
.confetti-piece:nth-child(5) {
  left: 35%;
  transform: rotate(26deg);
  animation: makeItRain 3000ms infinite ease-out;
  animation-delay: 458ms;
  animation-duration: 3585ms;
}
.confetti-piece:nth-child(6) {
  left: 42%;
  transform: rotate(-22deg);
  animation: makeItRain 3000ms infinite ease-out;
  animation-delay: 832ms;
  animation-duration: 3285ms;
}
.confetti-piece:nth-child(7) {
  left: 49%;
  transform: rotate(-73deg);
  animation: makeItRain 3000ms infinite ease-out;
  animation-delay: 468ms;
  animation-duration: 2871ms;
}
.confetti-piece:nth-child(8) {
  left: 56%;
  transform: rotate(10deg);
  animation: makeItRain 3000ms infinite ease-out;
  animation-delay: 584ms;
  animation-duration: 2874ms;
}
.confetti-piece:nth-child(9) {
  left: 63%;
  transform: rotate(-10deg);
  animation: makeItRain 3000ms infinite ease-out;
  animation-delay: 162ms;
  animation-duration: 3067ms;
}
.confetti-piece:nth-child(10) {
  left: 70%;
  transform: rotate(-47deg);
  animation: makeItRain 3000ms infinite ease-out;
  animation-delay: 383ms;
  animation-duration: 3422ms;
}
.confetti-piece:nth-child(11) {
  left: 77%;
  transform: rotate(10deg);
  animation: makeItRain 3000ms infinite ease-out;
  animation-delay: 60ms;
  animation-duration: 2343ms;
}
.confetti-piece:nth-child(12) {
  left: 84%;
  transform: rotate(28deg);
  animation: makeItRain 3000ms infinite ease-out;
  animation-delay: 82ms;
  animation-duration: 3233ms;
}
.confetti-piece:nth-child(13) {
  left: 91%;
  transform: rotate(-62deg);
  animation: makeItRain 3000ms infinite ease-out;
  animation-delay: 797ms;
  animation-duration: 2226ms;
}
.confetti-piece:nth-child(odd) {
  background: #17d3ff;
}
.confetti-piece:nth-child(even) {
  z-index: 1;
}
.confetti-piece:nth-child(4n) {
  width: 5px;
  height: 12px;
  animation-duration: 6000ms;
}
.confetti-piece:nth-child(3n) {
  width: 3px;
  height: 10px;
  animation-duration: 7500ms;
  animation-delay: 3000ms;
}
.confetti-piece:nth-child(4n-7) {
  background: #ff4e91;
}

@keyframes makeItRain {
  from {
    opacity: 0;
  }
  50% {
    opacity: 1;
  }
  to {
    transform: translateY(100vh);
  }
}
.particle_holder {
  position: absolute;
}
.particle_holder .particle {
  position: absolute;
  animation: shoot 3s ease-out infinite;
  animation-name: shoot, fade;
}
.particle_holder .particle:nth-child(1) {
  width: 1em;
  height: 1em;
  transform: translate(-1em, 13em);
  animation-duration: 5.61s;
  animation-delay: -3.366s;
}
.particle_holder .particle:nth-child(2) {
  width: 1em;
  height: 1em;
  transform: translate(10em, 33em);
  animation-duration: 4.98s;
  animation-delay: -4.8306s;
}
.particle_holder .particle:nth-child(3) {
  width: 2em;
  height: 2em;
  transform: translate(48em, -27em);
  animation-duration: 5.25s;
  animation-delay: -0.315s;
}
.particle_holder .particle:nth-child(4) {
  width: 2em;
  height: 2em;
  transform: translate(7em, 34em);
  animation-duration: 5.07s;
  animation-delay: -0.9633s;
}
.particle_holder .particle:nth-child(5) {
  width: 2em;
  height: 2em;
  transform: translate(44em, -34em);
  animation-duration: 5.91s;
  animation-delay: -1.3593s;
}
.particle_holder .particle:nth-child(6) {
  width: 1em;
  height: 1em;
  transform: translate(-6em, 39em);
  animation-duration: 5.07s;
  animation-delay: -3.6504s;
}
.particle_holder .particle:nth-child(7) {
  width: 1em;
  height: 1em;
  transform: translate(-7em, 48em);
  animation-duration: 5.76s;
  animation-delay: -0.288s;
}
.particle_holder .particle:nth-child(8) {
  width: 2em;
  height: 2em;
  transform: translate(-46em, 41em);
  animation-duration: 5.07s;
  animation-delay: -3.6504s;
}
.particle_holder .particle:nth-child(9) {
  width: 1em;
  height: 1em;
  transform: translate(-3em, 22em);
  animation-duration: 3.93s;
  animation-delay: -2.9082s;
}
.particle_holder .particle:nth-child(10) {
  width: 2em;
  height: 2em;
  transform: translate(12em, -45em);
  animation-duration: 5.73s;
  animation-delay: -1.0887s;
}
.particle_holder .particle:nth-child(11) {
  width: 2em;
  height: 2em;
  transform: translate(32em, 15em);
  animation-duration: 5.16s;
  animation-delay: -3.4056s;
}
.particle_holder .particle:nth-child(12) {
  width: 2em;
  height: 2em;
  transform: translate(1em, 33em);
  animation-duration: 4.2s;
  animation-delay: -2.982s;
}
.particle_holder .particle:nth-child(13) {
  width: 2em;
  height: 2em;
  transform: translate(-23em, -11em);
  animation-duration: 4.29s;
  animation-delay: -3.3033s;
}
.particle_holder .particle:nth-child(14) {
  width: 1em;
  height: 1em;
  transform: translate(-40em, -34em);
  animation-duration: 3.72s;
  animation-delay: -0.8928s;
}
.particle_holder .particle:nth-child(15) {
  width: 2em;
  height: 2em;
  transform: translate(-21em, 12em);
  animation-duration: 3.87s;
  animation-delay: -3.483s;
}
.particle_holder .particle:nth-child(16) {
  width: 2em;
  height: 2em;
  transform: translate(-11em, 22em);
  animation-duration: 5.34s;
  animation-delay: -5.073s;
}
.particle_holder .particle:nth-child(17) {
  width: 1em;
  height: 1em;
  transform: translate(-48em, 44em);
  animation-duration: 4.89s;
  animation-delay: -4.8411s;
}
.particle_holder .particle:nth-child(18) {
  width: 2em;
  height: 2em;
  transform: translate(-1em, -2em);
  animation-duration: 4.95s;
  animation-delay: -0.2475s;
}
.particle_holder .particle:nth-child(19) {
  width: 1em;
  height: 1em;
  transform: translate(-12em, -38em);
  animation-duration: 4.59s;
  animation-delay: -1.5147s;
}
.particle_holder .particle:nth-child(20) {
  width: 1em;
  height: 1em;
  transform: translate(11em, 39em);
  animation-duration: 3.63s;
  animation-delay: -1.5972s;
}
.particle_holder .particle:nth-child(21) {
  width: 1em;
  height: 1em;
  transform: translate(3em, -39em);
  animation-duration: 3.18s;
  animation-delay: -2.9892s;
}
.particle_holder .particle:nth-child(22) {
  width: 2em;
  height: 2em;
  transform: translate(-31em, 37em);
  animation-duration: 3.81s;
  animation-delay: -0.3429s;
}
.particle_holder .particle:nth-child(23) {
  width: 2em;
  height: 2em;
  transform: translate(31em, -26em);
  animation-duration: 5.4s;
  animation-delay: -3.456s;
}
.particle_holder .particle:nth-child(24) {
  width: 1em;
  height: 1em;
  transform: translate(-45em, -36em);
  animation-duration: 5.73s;
  animation-delay: -3.0942s;
}
.particle_holder .particle:nth-child(25) {
  width: 2em;
  height: 2em;
  transform: translate(-2em, 3em);
  animation-duration: 5.4s;
  animation-delay: -1.08s;
}
.particle_holder .particle:nth-child(26) {
  width: 2em;
  height: 2em;
  transform: translate(-42em, -24em);
  animation-duration: 4.29s;
  animation-delay: -1.716s;
}
.particle_holder .particle:nth-child(27) {
  width: 2em;
  height: 2em;
  transform: translate(-34em, 17em);
  animation-duration: 5.7s;
  animation-delay: -4.389s;
}
.particle_holder .particle:nth-child(28) {
  width: 2em;
  height: 2em;
  transform: translate(25em, -37em);
  animation-duration: 5.07s;
  animation-delay: -2.028s;
}
.particle_holder .particle:nth-child(29) {
  width: 1em;
  height: 1em;
  transform: translate(-46em, -16em);
  animation-duration: 4.53s;
  animation-delay: -3.6693s;
}
.particle_holder .particle:nth-child(30) {
  width: 1em;
  height: 1em;
  transform: translate(7em, 40em);
  animation-duration: 5.31s;
  animation-delay: -1.9647s;
}
.particle_holder .particle:nth-child(31) {
  width: 2em;
  height: 2em;
  transform: translate(-22em, -33em);
  animation-duration: 5.73s;
  animation-delay: -2.6931s;
}
.particle_holder .particle:nth-child(32) {
  width: 1em;
  height: 1em;
  transform: translate(-8em, 48em);
  animation-duration: 5.91s;
  animation-delay: -4.1961s;
}
.particle_holder .particle:nth-child(33) {
  width: 2em;
  height: 2em;
  transform: translate(-25em, 36em);
  animation-duration: 5.79s;
  animation-delay: -1.5054s;
}
.particle_holder .particle:nth-child(34) {
  width: 2em;
  height: 2em;
  transform: translate(-44em, 7em);
  animation-duration: 5.04s;
  animation-delay: -0.504s;
}
.particle_holder .particle:nth-child(35) {
  width: 1em;
  height: 1em;
  transform: translate(36em, -19em);
  animation-duration: 4.65s;
  animation-delay: -0.6975s;
}
.particle_holder .particle:nth-child(36) {
  width: 2em;
  height: 2em;
  transform: translate(-26em, 10em);
  animation-duration: 4.59s;
  animation-delay: -1.2852s;
}
.particle_holder .particle:nth-child(37) {
  width: 2em;
  height: 2em;
  transform: translate(-32em, -9em);
  animation-duration: 3.51s;
  animation-delay: -2.5623s;
}
.particle_holder .particle:nth-child(38) {
  width: 2em;
  height: 2em;
  transform: translate(-28em, -20em);
  animation-duration: 3.72s;
  animation-delay: -3.6084s;
}
.particle_holder .particle:nth-child(39) {
  width: 2em;
  height: 2em;
  transform: translate(35em, 47em);
  animation-duration: 3.27s;
  animation-delay: -0.654s;
}
.particle_holder .particle:nth-child(40) {
  width: 2em;
  height: 2em;
  transform: translate(-33em, 9em);
  animation-duration: 5.7s;
  animation-delay: -0.969s;
}
.particle_holder .particle:nth-child(41) {
  width: 1em;
  height: 1em;
  transform: translate(-11em, -10em);
  animation-duration: 3.72s;
  animation-delay: -3.534s;
}
.particle_holder .particle:nth-child(42) {
  width: 2em;
  height: 2em;
  transform: translate(-20em, 11em);
  animation-duration: 4.44s;
  animation-delay: -0.3996s;
}
.particle_holder .particle:nth-child(43) {
  width: 2em;
  height: 2em;
  transform: translate(-34em, 25em);
  animation-duration: 4.53s;
  animation-delay: -1.7214s;
}
.particle_holder .particle:nth-child(44) {
  width: 2em;
  height: 2em;
  transform: translate(49em, -34em);
  animation-duration: 3.75s;
  animation-delay: -2.4s;
}
.particle_holder .particle:nth-child(45) {
  width: 2em;
  height: 2em;
  transform: translate(28em, -8em);
  animation-duration: 5.19s;
  animation-delay: -1.6089s;
}
.particle_holder .particle:nth-child(46) {
  width: 1em;
  height: 1em;
  transform: translate(-8em, -47em);
  animation-duration: 4.98s;
  animation-delay: -2.0418s;
}
.particle_holder .particle:nth-child(47) {
  width: 2em;
  height: 2em;
  transform: translate(-5em, -35em);
  animation-duration: 5.01s;
  animation-delay: -0.8016s;
}
.particle_holder .particle:nth-child(48) {
  width: 2em;
  height: 2em;
  transform: translate(-35em, -3em);
  animation-duration: 5.49s;
  animation-delay: -1.9215s;
}
.particle_holder .particle:nth-child(49) {
  width: 2em;
  height: 2em;
  transform: translate(-38em, 42em);
  animation-duration: 5.01s;
  animation-delay: -3.4569s;
}
.particle_holder .particle:nth-child(50) {
  width: 1em;
  height: 1em;
  transform: translate(9em, -46em);
  animation-duration: 3.03s;
  animation-delay: -2.1513s;
}
.particle_holder .particle:nth-child(51) {
  width: 2em;
  height: 2em;
  transform: translate(-39em, 32em);
  animation-duration: 3.78s;
  animation-delay: -0.8316s;
}
.particle_holder .particle:nth-child(52) {
  width: 1em;
  height: 1em;
  transform: translate(-22em, 31em);
  animation-duration: 4.83s;
  animation-delay: -0.5796s;
}
.particle_holder .particle:nth-child(53) {
  width: 2em;
  height: 2em;
  transform: translate(-17em, 1em);
  animation-duration: 3.15s;
  animation-delay: -0.882s;
}
.particle_holder .particle:nth-child(54) {
  width: 1em;
  height: 1em;
  transform: translate(3em, 4em);
  animation-duration: 4.26s;
  animation-delay: -0.1278s;
}
.particle_holder .particle:nth-child(55) {
  width: 1em;
  height: 1em;
  transform: translate(5em, -30em);
  animation-duration: 3.45s;
  animation-delay: -0.5175s;
}
.particle_holder .particle:nth-child(56) {
  width: 1em;
  height: 1em;
  transform: translate(43em, 43em);
  animation-duration: 5.01s;
  animation-delay: -1.503s;
}
.particle_holder .particle:nth-child(57) {
  width: 2em;
  height: 2em;
  transform: translate(2em, -19em);
  animation-duration: 3.06s;
  animation-delay: -2.2338s;
}
.particle_holder .particle:nth-child(58) {
  width: 1em;
  height: 1em;
  transform: translate(43em, -9em);
  animation-duration: 5.88s;
  animation-delay: -1.5876s;
}
.particle_holder .particle:nth-child(59) {
  width: 1em;
  height: 1em;
  transform: translate(39em, 21em);
  animation-duration: 3.84s;
  animation-delay: -2.8416s;
}
.particle_holder .particle:nth-child(60) {
  width: 1em;
  height: 1em;
  transform: translate(-32em, -46em);
  animation-duration: 3.03s;
  animation-delay: -0.3636s;
}
.particle_holder .particle:nth-child(61) {
  width: 2em;
  height: 2em;
  transform: translate(-16em, -42em);
  animation-duration: 5.28s;
  animation-delay: -4.1712s;
}
.particle_holder .particle:nth-child(62) {
  width: 2em;
  height: 2em;
  transform: translate(20em, -33em);
  animation-duration: 5.04s;
  animation-delay: -1.6632s;
}
.particle_holder .particle:nth-child(63) {
  width: 1em;
  height: 1em;
  transform: translate(-28em, 16em);
  animation-duration: 3.36s;
  animation-delay: -1.2768s;
}
.particle_holder .particle:nth-child(64) {
  width: 2em;
  height: 2em;
  transform: translate(-29em, -3em);
  animation-duration: 5.7s;
  animation-delay: -0.285s;
}
.particle_holder .particle:nth-child(65) {
  width: 2em;
  height: 2em;
  transform: translate(-4em, -25em);
  animation-duration: 3.72s;
  animation-delay: -1.5252s;
}
.particle_holder .particle:nth-child(66) {
  width: 1em;
  height: 1em;
  transform: translate(32em, 48em);
  animation-duration: 5.82s;
  animation-delay: -5.0634s;
}
.particle_holder .particle:nth-child(67) {
  width: 2em;
  height: 2em;
  transform: translate(28em, -6em);
  animation-duration: 4.59s;
  animation-delay: -1.5606s;
}
.particle_holder .particle:nth-child(68) {
  width: 2em;
  height: 2em;
  transform: translate(-46em, -45em);
  animation-duration: 5.25s;
  animation-delay: -0.945s;
}
.particle_holder .particle:nth-child(69) {
  width: 2em;
  height: 2em;
  transform: translate(-11em, 2em);
  animation-duration: 4.77s;
  animation-delay: -3.1005s;
}
.particle_holder .particle:nth-child(70) {
  width: 1em;
  height: 1em;
  transform: translate(46em, 33em);
  animation-duration: 3.24s;
  animation-delay: -2.8512s;
}
.particle_holder .particle:nth-child(71) {
  width: 1em;
  height: 1em;
  transform: translate(3em, 12em);
  animation-duration: 4.89s;
  animation-delay: -4.3521s;
}
.particle_holder .particle:nth-child(72) {
  width: 1em;
  height: 1em;
  transform: translate(-30em, -11em);
  animation-duration: 5.97s;
  animation-delay: -3.8805s;
}
.particle_holder .particle:nth-child(73) {
  width: 1em;
  height: 1em;
  transform: translate(31em, 48em);
  animation-duration: 4.26s;
  animation-delay: -3.0246s;
}
.particle_holder .particle:nth-child(74) {
  width: 2em;
  height: 2em;
  transform: translate(41em, -34em);
  animation-duration: 4.92s;
  animation-delay: -4.8216s;
}
.particle_holder .particle:nth-child(75) {
  width: 1em;
  height: 1em;
  transform: translate(-5em, -46em);
  animation-duration: 5.43s;
  animation-delay: -1.4661s;
}
.particle_holder .particle:nth-child(76) {
  width: 1em;
  height: 1em;
  transform: translate(-22em, -37em);
  animation-duration: 5.16s;
  animation-delay: -3.4572s;
}
.particle_holder .particle:nth-child(77) {
  width: 2em;
  height: 2em;
  transform: translate(-9em, 9em);
  animation-duration: 4.11s;
  animation-delay: -1.2741s;
}
.particle_holder .particle:nth-child(78) {
  width: 1em;
  height: 1em;
  transform: translate(43em, 26em);
  animation-duration: 4.83s;
  animation-delay: -2.2218s;
}
.particle_holder .particle:nth-child(79) {
  width: 1em;
  height: 1em;
  transform: translate(-29em, -44em);
  animation-duration: 3.24s;
  animation-delay: -1.62s;
}
.particle_holder .particle:nth-child(80) {
  width: 2em;
  height: 2em;
  transform: translate(6em, 13em);
  animation-duration: 5.7s;
  animation-delay: -4.275s;
}
.particle_holder .particle:nth-child(81) {
  width: 2em;
  height: 2em;
  transform: translate(-19em, 44em);
  animation-duration: 5.04s;
  animation-delay: -0.4536s;
}
.particle_holder .particle:nth-child(82) {
  width: 2em;
  height: 2em;
  transform: translate(25em, 23em);
  animation-duration: 5.37s;
  animation-delay: -5.2089s;
}
.particle_holder .particle:nth-child(83) {
  width: 2em;
  height: 2em;
  transform: translate(-23em, -11em);
  animation-duration: 3.57s;
  animation-delay: -1.5708s;
}
.particle_holder .particle:nth-child(84) {
  width: 1em;
  height: 1em;
  transform: translate(44em, 5em);
  animation-duration: 5.34s;
  animation-delay: -0.4272s;
}
.particle_holder .particle:nth-child(85) {
  width: 1em;
  height: 1em;
  transform: translate(27em, 40em);
  animation-duration: 3.06s;
  animation-delay: -2.295s;
}
.particle_holder .particle:nth-child(86) {
  width: 2em;
  height: 2em;
  transform: translate(49em, -15em);
  animation-duration: 5.88s;
  animation-delay: -1.7052s;
}
.particle_holder .particle:nth-child(87) {
  width: 1em;
  height: 1em;
  transform: translate(5em, -29em);
  animation-duration: 4.71s;
  animation-delay: -2.9202s;
}
.particle_holder .particle:nth-child(88) {
  width: 2em;
  height: 2em;
  transform: translate(29em, -31em);
  animation-duration: 4.02s;
  animation-delay: -2.4522s;
}
.particle_holder .particle:nth-child(89) {
  width: 2em;
  height: 2em;
  transform: translate(42em, -43em);
  animation-duration: 5.1s;
  animation-delay: -0.867s;
}
.particle_holder .particle:nth-child(90) {
  width: 1em;
  height: 1em;
  transform: translate(-33em, -2em);
  animation-duration: 3.06s;
  animation-delay: -0.5202s;
}
.particle_holder .particle:nth-child(91) {
  width: 1em;
  height: 1em;
  transform: translate(1em, 1em);
  animation-duration: 4.26s;
  animation-delay: -0.4686s;
}
.particle_holder .particle:nth-child(92) {
  width: 2em;
  height: 2em;
  transform: translate(-23em, -31em);
  animation-duration: 4.41s;
  animation-delay: -4.0572s;
}
.particle_holder .particle:nth-child(93) {
  width: 1em;
  height: 1em;
  transform: translate(1em, 12em);
  animation-duration: 4.74s;
  animation-delay: -2.9388s;
}
.particle_holder .particle:nth-child(94) {
  width: 2em;
  height: 2em;
  transform: translate(42em, -17em);
  animation-duration: 5.43s;
  animation-delay: -1.9548s;
}
.particle_holder .particle:nth-child(95) {
  width: 2em;
  height: 2em;
  transform: translate(-9em, -37em);
  animation-duration: 4.17s;
  animation-delay: -1.2927s;
}
.particle_holder .particle:nth-child(96) {
  width: 2em;
  height: 2em;
  transform: translate(-12em, 13em);
  animation-duration: 3.6s;
  animation-delay: -1.008s;
}
.particle_holder .particle:nth-child(97) {
  width: 1em;
  height: 1em;
  transform: translate(-2em, -24em);
  animation-duration: 3.93s;
  animation-delay: -0.2751s;
}
.particle_holder .particle:nth-child(98) {
  width: 2em;
  height: 2em;
  transform: translate(15em, 45em);
  animation-duration: 3.03s;
  animation-delay: -1.4241s;
}
.particle_holder .particle:nth-child(99) {
  width: 1em;
  height: 1em;
  transform: translate(-10em, -9em);
  animation-duration: 4.44s;
  animation-delay: -4.0404s;
}
.particle_holder .particle:nth-child(100) {
  width: 2em;
  height: 2em;
  transform: translate(-44em, 49em);
  animation-duration: 3.15s;
  animation-delay: -0.8505s;
}
.particle_holder .particle:nth-child(101) {
  width: 1em;
  height: 1em;
  transform: translate(-25em, 47em);
  animation-duration: 4.35s;
  animation-delay: -2.0445s;
}
.particle_holder .particle:nth-child(102) {
  width: 2em;
  height: 2em;
  transform: translate(-28em, 36em);
  animation-duration: 5.04s;
  animation-delay: -3.8808s;
}
.particle_holder .particle:nth-child(103) {
  width: 2em;
  height: 2em;
  transform: translate(44em, 17em);
  animation-duration: 4.83s;
  animation-delay: -0.3864s;
}
.particle_holder .particle:nth-child(104) {
  width: 2em;
  height: 2em;
  transform: translate(31em, -29em);
  animation-duration: 3.15s;
  animation-delay: -1.4175s;
}
.particle_holder .particle:nth-child(105) {
  width: 1em;
  height: 1em;
  transform: translate(-14em, 19em);
  animation-duration: 3.87s;
  animation-delay: -1.5867s;
}
.particle_holder .particle:nth-child(106) {
  width: 2em;
  height: 2em;
  transform: translate(1em, 49em);
  animation-duration: 5.49s;
  animation-delay: -2.0313s;
}
.particle_holder .particle:nth-child(107) {
  width: 2em;
  height: 2em;
  transform: translate(-25em, 39em);
  animation-duration: 5.37s;
  animation-delay: -2.148s;
}
.particle_holder .particle:nth-child(108) {
  width: 2em;
  height: 2em;
  transform: translate(-11em, 31em);
  animation-duration: 5.31s;
  animation-delay: -5.0445s;
}
.particle_holder .particle:nth-child(109) {
  width: 2em;
  height: 2em;
  transform: translate(10em, -33em);
  animation-duration: 5.64s;
  animation-delay: -2.4816s;
}
.particle_holder .particle:nth-child(110) {
  width: 2em;
  height: 2em;
  transform: translate(34em, -22em);
  animation-duration: 6s;
  animation-delay: -6s;
}
.particle_holder .particle:nth-child(111) {
  width: 2em;
  height: 2em;
  transform: translate(39em, -41em);
  animation-duration: 5.16s;
  animation-delay: -1.9092s;
}
.particle_holder .particle:nth-child(112) {
  width: 1em;
  height: 1em;
  transform: translate(43em, 14em);
  animation-duration: 3.12s;
  animation-delay: -1.9968s;
}
.particle_holder .particle:nth-child(113) {
  width: 2em;
  height: 2em;
  transform: translate(33em, -43em);
  animation-duration: 4.26s;
  animation-delay: -3.5358s;
}
.particle_holder .particle:nth-child(114) {
  width: 2em;
  height: 2em;
  transform: translate(-18em, -38em);
  animation-duration: 5.28s;
  animation-delay: -4.5408s;
}
.particle_holder .particle:nth-child(115) {
  width: 2em;
  height: 2em;
  transform: translate(-14em, -16em);
  animation-duration: 5.28s;
  animation-delay: -3.8544s;
}
.particle_holder .particle:nth-child(116) {
  width: 2em;
  height: 2em;
  transform: translate(-46em, 21em);
  animation-duration: 5.55s;
  animation-delay: -2.2755s;
}
.particle_holder .particle:nth-child(117) {
  width: 2em;
  height: 2em;
  transform: translate(37em, -24em);
  animation-duration: 4.68s;
  animation-delay: -0.5148s;
}
.particle_holder .particle:nth-child(118) {
  width: 1em;
  height: 1em;
  transform: translate(-32em, 11em);
  animation-duration: 5.58s;
  animation-delay: -1.1718s;
}
.particle_holder .particle:nth-child(119) {
  width: 2em;
  height: 2em;
  transform: translate(22em, -14em);
  animation-duration: 5.25s;
  animation-delay: -2.5725s;
}
.particle_holder .particle:nth-child(120) {
  width: 1em;
  height: 1em;
  transform: translate(45em, -20em);
  animation-duration: 5.1s;
  animation-delay: -2.907s;
}
.particle_holder .particle:nth-child(121) {
  width: 2em;
  height: 2em;
  transform: translate(-25em, -40em);
  animation-duration: 5.58s;
  animation-delay: -2.3436s;
}
.particle_holder .particle:nth-child(122) {
  width: 2em;
  height: 2em;
  transform: translate(12em, 12em);
  animation-duration: 4.86s;
  animation-delay: -1.1178s;
}
.particle_holder .particle:nth-child(123) {
  width: 1em;
  height: 1em;
  transform: translate(34em, 45em);
  animation-duration: 4.05s;
  animation-delay: -2.187s;
}
.particle_holder .particle:nth-child(124) {
  width: 1em;
  height: 1em;
  transform: translate(-10em, -40em);
  animation-duration: 5.61s;
  animation-delay: -3.6465s;
}
.particle_holder .particle:nth-child(125) {
  width: 2em;
  height: 2em;
  transform: translate(-20em, -48em);
  animation-duration: 5.13s;
  animation-delay: -0.4104s;
}
.particle_holder .particle:nth-child(126) {
  width: 1em;
  height: 1em;
  transform: translate(-46em, 32em);
  animation-duration: 4.2s;
  animation-delay: -1.848s;
}
.particle_holder .particle:nth-child(127) {
  width: 2em;
  height: 2em;
  transform: translate(11em, -29em);
  animation-duration: 4.41s;
  animation-delay: -1.5876s;
}
.particle_holder .particle:nth-child(128) {
  width: 1em;
  height: 1em;
  transform: translate(-10em, -13em);
  animation-duration: 5.76s;
  animation-delay: -1.6128s;
}
.particle_holder .particle:nth-child(129) {
  width: 1em;
  height: 1em;
  transform: translate(-42em, -39em);
  animation-duration: 4.77s;
  animation-delay: -0.4293s;
}
.particle_holder .particle:nth-child(130) {
  width: 1em;
  height: 1em;
  transform: translate(31em, 35em);
  animation-duration: 3.99s;
  animation-delay: -3.192s;
}
.particle_holder .particle:nth-child(131) {
  width: 2em;
  height: 2em;
  transform: translate(2em, 24em);
  animation-duration: 5.79s;
  animation-delay: -0.6369s;
}
.particle_holder .particle:nth-child(132) {
  width: 1em;
  height: 1em;
  transform: translate(37em, 35em);
  animation-duration: 3.63s;
  animation-delay: -2.8314s;
}
.particle_holder .particle:nth-child(133) {
  width: 1em;
  height: 1em;
  transform: translate(27em, -22em);
  animation-duration: 4.35s;
  animation-delay: -1.4355s;
}
.particle_holder .particle:nth-child(134) {
  width: 2em;
  height: 2em;
  transform: translate(-5em, -18em);
  animation-duration: 4.53s;
  animation-delay: -2.8539s;
}
.particle_holder .particle:nth-child(135) {
  width: 1em;
  height: 1em;
  transform: translate(-28em, 32em);
  animation-duration: 3.21s;
  animation-delay: -0.1284s;
}
.particle_holder .particle:nth-child(136) {
  width: 2em;
  height: 2em;
  transform: translate(-23em, -36em);
  animation-duration: 3.03s;
  animation-delay: -0.303s;
}
.particle_holder .particle:nth-child(137) {
  width: 1em;
  height: 1em;
  transform: translate(47em, 31em);
  animation-duration: 5.49s;
  animation-delay: -4.3371s;
}
.particle_holder .particle:nth-child(138) {
  width: 2em;
  height: 2em;
  transform: translate(45em, -33em);
  animation-duration: 4.56s;
  animation-delay: -1.9152s;
}
.particle_holder .particle:nth-child(139) {
  width: 1em;
  height: 1em;
  transform: translate(-35em, -26em);
  animation-duration: 3.24s;
  animation-delay: -3.2076s;
}
.particle_holder .particle:nth-child(140) {
  width: 2em;
  height: 2em;
  transform: translate(20em, -49em);
  animation-duration: 5.73s;
  animation-delay: -4.3548s;
}
.particle_holder .particle:nth-child(141) {
  width: 1em;
  height: 1em;
  transform: translate(-20em, -33em);
  animation-duration: 5.4s;
  animation-delay: -2.538s;
}
.particle_holder .particle:nth-child(142) {
  width: 1em;
  height: 1em;
  transform: translate(35em, -40em);
  animation-duration: 4.44s;
  animation-delay: -0.3996s;
}
.particle_holder .particle:nth-child(143) {
  width: 2em;
  height: 2em;
  transform: translate(12em, 2em);
  animation-duration: 4.14s;
  animation-delay: -2.898s;
}
.particle_holder .particle:nth-child(144) {
  width: 2em;
  height: 2em;
  transform: translate(4em, -31em);
  animation-duration: 3.69s;
  animation-delay: -1.7712s;
}
.particle_holder .particle:nth-child(145) {
  width: 1em;
  height: 1em;
  transform: translate(-39em, 44em);
  animation-duration: 4.26s;
  animation-delay: -0.8094s;
}
.particle_holder .particle:nth-child(146) {
  width: 2em;
  height: 2em;
  transform: translate(-41em, -41em);
  animation-duration: 3.45s;
  animation-delay: -0.069s;
}
.particle_holder .particle:nth-child(147) {
  width: 2em;
  height: 2em;
  transform: translate(-7em, -6em);
  animation-duration: 3.15s;
  animation-delay: -2.079s;
}
.particle_holder .particle:nth-child(148) {
  width: 1em;
  height: 1em;
  transform: translate(-38em, -31em);
  animation-duration: 4.47s;
  animation-delay: -2.7714s;
}
.particle_holder .particle:nth-child(149) {
  width: 1em;
  height: 1em;
  transform: translate(6em, -17em);
  animation-duration: 5.34s;
  animation-delay: -0.4806s;
}
.particle_holder .particle:nth-child(150) {
  width: 1em;
  height: 1em;
  transform: translate(-27em, -26em);
  animation-duration: 5.91s;
  animation-delay: -0.5319s;
}
.particle_holder .particle:nth-child(151) {
  width: 1em;
  height: 1em;
  transform: translate(-21em, 22em);
  animation-duration: 4.08s;
  animation-delay: -2.9784s;
}
.particle_holder .particle:nth-child(152) {
  width: 1em;
  height: 1em;
  transform: translate(-41em, -34em);
  animation-duration: 4.5s;
  animation-delay: -3.33s;
}
.particle_holder .particle:nth-child(153) {
  width: 1em;
  height: 1em;
  transform: translate(-40em, 46em);
  animation-duration: 5.97s;
  animation-delay: -4.5969s;
}
.particle_holder .particle:nth-child(154) {
  width: 1em;
  height: 1em;
  transform: translate(42em, 19em);
  animation-duration: 4.83s;
  animation-delay: -2.7048s;
}
.particle_holder .particle:nth-child(155) {
  width: 1em;
  height: 1em;
  transform: translate(50em, -16em);
  animation-duration: 4.8s;
  animation-delay: -1.584s;
}
.particle_holder .particle:nth-child(156) {
  width: 1em;
  height: 1em;
  transform: translate(19em, -36em);
  animation-duration: 4.74s;
  animation-delay: -2.7966s;
}
.particle_holder .particle:nth-child(157) {
  width: 2em;
  height: 2em;
  transform: translate(6em, -29em);
  animation-duration: 3.69s;
  animation-delay: -2.7306s;
}
.particle_holder .particle:nth-child(158) {
  width: 1em;
  height: 1em;
  transform: translate(10em, -17em);
  animation-duration: 3.15s;
  animation-delay: -1.5435s;
}
.particle_holder .particle:nth-child(159) {
  width: 2em;
  height: 2em;
  transform: translate(14em, -35em);
  animation-duration: 4.32s;
  animation-delay: -2.6784s;
}
.particle_holder .particle:nth-child(160) {
  width: 1em;
  height: 1em;
  transform: translate(-41em, 27em);
  animation-duration: 3.66s;
  animation-delay: -1.281s;
}
.particle_holder .particle:nth-child(161) {
  width: 2em;
  height: 2em;
  transform: translate(-12em, 33em);
  animation-duration: 4.77s;
  animation-delay: -0.954s;
}
.particle_holder .particle:nth-child(162) {
  width: 2em;
  height: 2em;
  transform: translate(-11em, 3em);
  animation-duration: 4.11s;
  animation-delay: -0.3699s;
}
.particle_holder .particle:nth-child(163) {
  width: 2em;
  height: 2em;
  transform: translate(-12em, -10em);
  animation-duration: 5.64s;
  animation-delay: -2.1996s;
}
.particle_holder .particle:nth-child(164) {
  width: 2em;
  height: 2em;
  transform: translate(-45em, -9em);
  animation-duration: 5.76s;
  animation-delay: -3.5712s;
}
.particle_holder .particle:nth-child(165) {
  width: 1em;
  height: 1em;
  transform: translate(-4em, 50em);
  animation-duration: 5.82s;
  animation-delay: -3.7248s;
}
.particle_holder .particle:nth-child(166) {
  width: 2em;
  height: 2em;
  transform: translate(-49em, 40em);
  animation-duration: 5.04s;
  animation-delay: -0.252s;
}
.particle_holder .particle:nth-child(167) {
  width: 1em;
  height: 1em;
  transform: translate(-46em, 29em);
  animation-duration: 3.54s;
  animation-delay: -0.708s;
}
.particle_holder .particle:nth-child(168) {
  width: 2em;
  height: 2em;
  transform: translate(-26em, 16em);
  animation-duration: 5.76s;
  animation-delay: -5.184s;
}
.particle_holder .particle:nth-child(169) {
  width: 2em;
  height: 2em;
  transform: translate(23em, -41em);
  animation-duration: 3.57s;
  animation-delay: -1.3209s;
}
.particle_holder .particle:nth-child(170) {
  width: 2em;
  height: 2em;
  transform: translate(50em, 24em);
  animation-duration: 4.98s;
  animation-delay: -0.9462s;
}
.particle_holder .particle:nth-child(171) {
  width: 1em;
  height: 1em;
  transform: translate(-34em, 3em);
  animation-duration: 5.67s;
  animation-delay: -4.0257s;
}
.particle_holder .particle:nth-child(172) {
  width: 2em;
  height: 2em;
  transform: translate(-11em, -43em);
  animation-duration: 5.61s;
  animation-delay: -3.6465s;
}
.particle_holder .particle:nth-child(173) {
  width: 2em;
  height: 2em;
  transform: translate(30em, -38em);
  animation-duration: 3.45s;
  animation-delay: -2.1045s;
}
.particle_holder .particle:nth-child(174) {
  width: 2em;
  height: 2em;
  transform: translate(21em, 35em);
  animation-duration: 4.56s;
  animation-delay: -0.228s;
}
.particle_holder .particle:nth-child(175) {
  width: 1em;
  height: 1em;
  transform: translate(34em, 23em);
  animation-duration: 5.58s;
  animation-delay: -4.6314s;
}
.particle_holder .particle:nth-child(176) {
  width: 2em;
  height: 2em;
  transform: translate(48em, -14em);
  animation-duration: 3.96s;
  animation-delay: -1.8216s;
}
.particle_holder .particle:nth-child(177) {
  width: 2em;
  height: 2em;
  transform: translate(-45em, 15em);
  animation-duration: 5.37s;
  animation-delay: -1.5036s;
}
.particle_holder .particle:nth-child(178) {
  width: 2em;
  height: 2em;
  transform: translate(40em, -27em);
  animation-duration: 4.41s;
  animation-delay: -1.764s;
}
.particle_holder .particle:nth-child(179) {
  width: 2em;
  height: 2em;
  transform: translate(-32em, 48em);
  animation-duration: 5.79s;
  animation-delay: -3.1266s;
}
.particle_holder .particle:nth-child(180) {
  width: 1em;
  height: 1em;
  transform: translate(40em, -30em);
  animation-duration: 3.48s;
  animation-delay: -1.7052s;
}
.particle_holder .particle:nth-child(181) {
  width: 1em;
  height: 1em;
  transform: translate(-19em, 16em);
  animation-duration: 4.62s;
  animation-delay: -0.7392s;
}
.particle_holder .particle:nth-child(182) {
  width: 1em;
  height: 1em;
  transform: translate(39em, -31em);
  animation-duration: 4.2s;
  animation-delay: -1.176s;
}
.particle_holder .particle:nth-child(183) {
  width: 1em;
  height: 1em;
  transform: translate(-46em, 15em);
  animation-duration: 5.7s;
  animation-delay: -3.648s;
}
.particle_holder .particle:nth-child(184) {
  width: 2em;
  height: 2em;
  transform: translate(46em, 27em);
  animation-duration: 4.92s;
  animation-delay: -0.3936s;
}
.particle_holder .particle:nth-child(185) {
  width: 2em;
  height: 2em;
  transform: translate(25em, -11em);
  animation-duration: 4.26s;
  animation-delay: -3.621s;
}
.particle_holder .particle:nth-child(186) {
  width: 2em;
  height: 2em;
  transform: translate(25em, -12em);
  animation-duration: 5.37s;
  animation-delay: -3.5979s;
}
.particle_holder .particle:nth-child(187) {
  width: 1em;
  height: 1em;
  transform: translate(-17em, 34em);
  animation-duration: 3.57s;
  animation-delay: -1.3209s;
}
.particle_holder .particle:nth-child(188) {
  width: 2em;
  height: 2em;
  transform: translate(-24em, -47em);
  animation-duration: 4.74s;
  animation-delay: -3.9342s;
}
.particle_holder .particle:nth-child(189) {
  width: 1em;
  height: 1em;
  transform: translate(5em, -37em);
  animation-duration: 3.12s;
  animation-delay: -2.4336s;
}
.particle_holder .particle:nth-child(190) {
  width: 1em;
  height: 1em;
  transform: translate(10em, 9em);
  animation-duration: 3.69s;
  animation-delay: -0.2952s;
}
.particle_holder .particle:nth-child(191) {
  width: 2em;
  height: 2em;
  transform: translate(-47em, 20em);
  animation-duration: 4.53s;
  animation-delay: -0.9966s;
}
.particle_holder .particle:nth-child(192) {
  width: 1em;
  height: 1em;
  transform: translate(-33em, -38em);
  animation-duration: 5.16s;
  animation-delay: -4.386s;
}
.particle_holder .particle:nth-child(193) {
  width: 1em;
  height: 1em;
  transform: translate(48em, -39em);
  animation-duration: 3.39s;
  animation-delay: -0.3729s;
}
.particle_holder .particle:nth-child(194) {
  width: 1em;
  height: 1em;
  transform: translate(2em, 12em);
  animation-duration: 5.19s;
  animation-delay: -0.8823s;
}
.particle_holder .particle:nth-child(195) {
  width: 2em;
  height: 2em;
  transform: translate(-34em, 19em);
  animation-duration: 4.32s;
  animation-delay: -1.512s;
}
.particle_holder .particle:nth-child(196) {
  width: 2em;
  height: 2em;
  transform: translate(47em, -35em);
  animation-duration: 5.37s;
  animation-delay: -1.074s;
}
.particle_holder .particle:nth-child(197) {
  width: 2em;
  height: 2em;
  transform: translate(-41em, 19em);
  animation-duration: 5.52s;
  animation-delay: -4.14s;
}
.particle_holder .particle:nth-child(198) {
  width: 2em;
  height: 2em;
  transform: translate(6em, -34em);
  animation-duration: 4.65s;
  animation-delay: -1.1625s;
}
.particle_holder .particle:nth-child(199) {
  width: 2em;
  height: 2em;
  transform: translate(-14em, 46em);
  animation-duration: 4.68s;
  animation-delay: -0.1872s;
}
.particle_holder .particle:nth-child(200) {
  width: 1em;
  height: 1em;
  transform: translate(28em, -6em);
  animation-duration: 3.15s;
  animation-delay: -1.4175s;
}
.particle_holder .particle:nth-child(201) {
  width: 2em;
  height: 2em;
  transform: translate(-13em, -28em);
  animation-duration: 5.88s;
  animation-delay: -3.1752s;
}
.particle_holder .particle:nth-child(202) {
  width: 2em;
  height: 2em;
  transform: translate(16em, 20em);
  animation-duration: 4.38s;
  animation-delay: -0.9636s;
}
.particle_holder .particle:nth-child(203) {
  width: 1em;
  height: 1em;
  transform: translate(-16em, -31em);
  animation-duration: 5.04s;
  animation-delay: -0.9576s;
}
.particle_holder .particle:nth-child(204) {
  width: 1em;
  height: 1em;
  transform: translate(20em, -25em);
  animation-duration: 3.51s;
  animation-delay: -2.7729s;
}
.particle_holder .particle:nth-child(205) {
  width: 1em;
  height: 1em;
  transform: translate(25em, 40em);
  animation-duration: 5.55s;
  animation-delay: -3.8295s;
}
.particle_holder .particle:nth-child(206) {
  width: 2em;
  height: 2em;
  transform: translate(48em, -22em);
  animation-duration: 5.97s;
  animation-delay: -1.3134s;
}
.particle_holder .particle:nth-child(207) {
  width: 2em;
  height: 2em;
  transform: translate(14em, 2em);
  animation-duration: 3.54s;
  animation-delay: -3.2922s;
}
.particle_holder .particle:nth-child(208) {
  width: 2em;
  height: 2em;
  transform: translate(14em, -19em);
  animation-duration: 5.61s;
  animation-delay: -0.3366s;
}
.particle_holder .particle:nth-child(209) {
  width: 2em;
  height: 2em;
  transform: translate(25em, 38em);
  animation-duration: 5.55s;
  animation-delay: -4.995s;
}
.particle_holder .particle:nth-child(210) {
  width: 2em;
  height: 2em;
  transform: translate(-41em, 19em);
  animation-duration: 5.1s;
  animation-delay: -2.04s;
}
.particle_holder .particle:nth-child(211) {
  width: 1em;
  height: 1em;
  transform: translate(-38em, -43em);
  animation-duration: 3.27s;
  animation-delay: -1.4061s;
}
.particle_holder .particle:nth-child(212) {
  width: 1em;
  height: 1em;
  transform: translate(-35em, 26em);
  animation-duration: 5.7s;
  animation-delay: -3.876s;
}
.particle_holder .particle:nth-child(213) {
  width: 2em;
  height: 2em;
  transform: translate(-25em, 5em);
  animation-duration: 5.67s;
  animation-delay: -1.8711s;
}
.particle_holder .particle:nth-child(214) {
  width: 2em;
  height: 2em;
  transform: translate(32em, 4em);
  animation-duration: 3.93s;
  animation-delay: -0.2358s;
}
.particle_holder .particle:nth-child(215) {
  width: 2em;
  height: 2em;
  transform: translate(-3em, -14em);
  animation-duration: 3.42s;
  animation-delay: -3.1122s;
}
.particle_holder .particle:nth-child(216) {
  width: 1em;
  height: 1em;
  transform: translate(11em, -43em);
  animation-duration: 4.62s;
  animation-delay: -0.7392s;
}
.particle_holder .particle:nth-child(217) {
  width: 2em;
  height: 2em;
  transform: translate(13em, 28em);
  animation-duration: 4.08s;
  animation-delay: -1.632s;
}
.particle_holder .particle:nth-child(218) {
  width: 1em;
  height: 1em;
  transform: translate(33em, 34em);
  animation-duration: 4.08s;
  animation-delay: -2.4072s;
}
.particle_holder .particle:nth-child(219) {
  width: 2em;
  height: 2em;
  transform: translate(-2em, -42em);
  animation-duration: 5.22s;
  animation-delay: -1.305s;
}
.particle_holder .particle:nth-child(220) {
  width: 1em;
  height: 1em;
  transform: translate(2em, 34em);
  animation-duration: 5.76s;
  animation-delay: -3.2256s;
}
.particle_holder .particle:nth-child(221) {
  width: 2em;
  height: 2em;
  transform: translate(4em, -23em);
  animation-duration: 5.94s;
  animation-delay: -3.6234s;
}
.particle_holder .particle:nth-child(222) {
  width: 2em;
  height: 2em;
  transform: translate(23em, 28em);
  animation-duration: 5.13s;
  animation-delay: -3.9501s;
}
.particle_holder .particle:nth-child(223) {
  width: 1em;
  height: 1em;
  transform: translate(-4em, 50em);
  animation-duration: 3.18s;
  animation-delay: -0.6996s;
}
.particle_holder .particle:nth-child(224) {
  width: 1em;
  height: 1em;
  transform: translate(-23em, -44em);
  animation-duration: 3.06s;
  animation-delay: -2.3868s;
}
.particle_holder .particle:nth-child(225) {
  width: 2em;
  height: 2em;
  transform: translate(-48em, 25em);
  animation-duration: 3.87s;
  animation-delay: -3.4056s;
}
.particle_holder .particle:nth-child(226) {
  width: 1em;
  height: 1em;
  transform: translate(-33em, -38em);
  animation-duration: 3.78s;
  animation-delay: -3.2508s;
}
.particle_holder .particle:nth-child(227) {
  width: 2em;
  height: 2em;
  transform: translate(47em, 13em);
  animation-duration: 5.73s;
  animation-delay: -2.8077s;
}
.particle_holder .particle:nth-child(228) {
  width: 2em;
  height: 2em;
  transform: translate(43em, -19em);
  animation-duration: 3.87s;
  animation-delay: -3.1347s;
}
.particle_holder .particle:nth-child(229) {
  width: 2em;
  height: 2em;
  transform: translate(-4em, 19em);
  animation-duration: 5.16s;
  animation-delay: -0.2064s;
}
.particle_holder .particle:nth-child(230) {
  width: 2em;
  height: 2em;
  transform: translate(-24em, 5em);
  animation-duration: 5.64s;
  animation-delay: -2.9328s;
}
.particle_holder .particle:nth-child(231) {
  width: 2em;
  height: 2em;
  transform: translate(-26em, 20em);
  animation-duration: 5.01s;
  animation-delay: -2.7555s;
}
.particle_holder .particle:nth-child(232) {
  width: 2em;
  height: 2em;
  transform: translate(13em, -4em);
  animation-duration: 5.76s;
  animation-delay: -5.5296s;
}
.particle_holder .particle:nth-child(233) {
  width: 2em;
  height: 2em;
  transform: translate(-29em, -39em);
  animation-duration: 4.41s;
  animation-delay: -4.3218s;
}
.particle_holder .particle:nth-child(234) {
  width: 2em;
  height: 2em;
  transform: translate(33em, -32em);
  animation-duration: 4.47s;
  animation-delay: -2.5926s;
}
.particle_holder .particle:nth-child(235) {
  width: 2em;
  height: 2em;
  transform: translate(10em, -40em);
  animation-duration: 3.03s;
  animation-delay: -2.5149s;
}
.particle_holder .particle:nth-child(236) {
  width: 1em;
  height: 1em;
  transform: translate(-1em, -33em);
  animation-duration: 5.46s;
  animation-delay: -0.6552s;
}
.particle_holder .particle:nth-child(237) {
  width: 1em;
  height: 1em;
  transform: translate(-20em, 11em);
  animation-duration: 5.7s;
  animation-delay: -5.13s;
}
.particle_holder .particle:nth-child(238) {
  width: 2em;
  height: 2em;
  transform: translate(-2em, -32em);
  animation-duration: 4.17s;
  animation-delay: -1.4595s;
}
.particle_holder .particle:nth-child(239) {
  width: 1em;
  height: 1em;
  transform: translate(3em, 18em);
  animation-duration: 4.32s;
  animation-delay: -0.4752s;
}
.particle_holder .particle:nth-child(240) {
  width: 1em;
  height: 1em;
  transform: translate(26em, 26em);
  animation-duration: 5.25s;
  animation-delay: -5.0925s;
}
.particle_holder .particle:nth-child(241) {
  width: 1em;
  height: 1em;
  transform: translate(50em, -14em);
  animation-duration: 3.42s;
  animation-delay: -2.052s;
}
.particle_holder .particle:nth-child(242) {
  width: 2em;
  height: 2em;
  transform: translate(-41em, -9em);
  animation-duration: 5.22s;
  animation-delay: -0.9396s;
}
.particle_holder .particle:nth-child(243) {
  width: 1em;
  height: 1em;
  transform: translate(29em, 49em);
  animation-duration: 6s;
  animation-delay: -4.02s;
}
.particle_holder .particle:nth-child(244) {
  width: 2em;
  height: 2em;
  transform: translate(-7em, 22em);
  animation-duration: 3.96s;
  animation-delay: -0.594s;
}
.particle_holder .particle:nth-child(245) {
  width: 2em;
  height: 2em;
  transform: translate(30em, -36em);
  animation-duration: 5.49s;
  animation-delay: -3.1842s;
}
.particle_holder .particle:nth-child(246) {
  width: 1em;
  height: 1em;
  transform: translate(-42em, -9em);
  animation-duration: 3.33s;
  animation-delay: -1.0989s;
}
.particle_holder .particle:nth-child(247) {
  width: 2em;
  height: 2em;
  transform: translate(3em, 27em);
  animation-duration: 3.99s;
  animation-delay: -1.1172s;
}
.particle_holder .particle:nth-child(248) {
  width: 1em;
  height: 1em;
  transform: translate(-24em, 5em);
  animation-duration: 5.76s;
  animation-delay: -0.1152s;
}
.particle_holder .particle:nth-child(249) {
  width: 2em;
  height: 2em;
  transform: translate(-5em, -16em);
  animation-duration: 4.29s;
  animation-delay: -0.6435s;
}
.particle_holder .particle:nth-child(250) {
  width: 1em;
  height: 1em;
  transform: translate(39em, -20em);
  animation-duration: 3.48s;
  animation-delay: -0.522s;
}
.particle_holder .particle:nth-child(251) {
  width: 1em;
  height: 1em;
  transform: translate(18em, -43em);
  animation-duration: 5.34s;
  animation-delay: -1.3884s;
}
.particle_holder .particle:nth-child(252) {
  width: 1em;
  height: 1em;
  transform: translate(46em, -36em);
  animation-duration: 3.39s;
  animation-delay: -1.2543s;
}
.particle_holder .particle:nth-child(253) {
  width: 2em;
  height: 2em;
  transform: translate(21em, 40em);
  animation-duration: 3.93s;
  animation-delay: -2.358s;
}
.particle_holder .particle:nth-child(254) {
  width: 1em;
  height: 1em;
  transform: translate(45em, -40em);
  animation-duration: 5.34s;
  animation-delay: -2.5098s;
}
.particle_holder .particle:nth-child(255) {
  width: 1em;
  height: 1em;
  transform: translate(50em, 45em);
  animation-duration: 4.77s;
  animation-delay: -4.0068s;
}
.particle_holder .particle:nth-child(256) {
  width: 2em;
  height: 2em;
  transform: translate(-6em, 6em);
  animation-duration: 5.46s;
  animation-delay: -3.822s;
}
.particle_holder .particle:nth-child(257) {
  width: 1em;
  height: 1em;
  transform: translate(39em, 45em);
  animation-duration: 5.31s;
  animation-delay: -4.5135s;
}
.particle_holder .particle:nth-child(258) {
  width: 1em;
  height: 1em;
  transform: translate(12em, -23em);
  animation-duration: 5.31s;
  animation-delay: -0.6903s;
}
.particle_holder .particle:nth-child(259) {
  width: 1em;
  height: 1em;
  transform: translate(41em, 50em);
  animation-duration: 3.51s;
  animation-delay: -0.3861s;
}
.particle_holder .particle:nth-child(260) {
  width: 2em;
  height: 2em;
  transform: translate(30em, 23em);
  animation-duration: 4.32s;
  animation-delay: -3.7152s;
}
.particle_holder .particle:nth-child(261) {
  width: 2em;
  height: 2em;
  transform: translate(-40em, 26em);
  animation-duration: 3.6s;
  animation-delay: -1.044s;
}
.particle_holder .particle:nth-child(262) {
  width: 2em;
  height: 2em;
  transform: translate(-27em, -6em);
  animation-duration: 5.46s;
  animation-delay: -1.4196s;
}
.particle_holder .particle:nth-child(263) {
  width: 2em;
  height: 2em;
  transform: translate(-30em, 11em);
  animation-duration: 4.83s;
  animation-delay: -0.4347s;
}
.particle_holder .particle:nth-child(264) {
  width: 1em;
  height: 1em;
  transform: translate(16em, -7em);
  animation-duration: 4.29s;
  animation-delay: -3.8181s;
}
.particle_holder .particle:nth-child(265) {
  width: 2em;
  height: 2em;
  transform: translate(-41em, 38em);
  animation-duration: 4.05s;
  animation-delay: -1.9035s;
}
.particle_holder .particle:nth-child(266) {
  width: 1em;
  height: 1em;
  transform: translate(-47em, 29em);
  animation-duration: 4.11s;
  animation-delay: -1.1919s;
}
.particle_holder .particle:nth-child(267) {
  width: 2em;
  height: 2em;
  transform: translate(22em, 45em);
  animation-duration: 5.16s;
  animation-delay: -2.6316s;
}
.particle_holder .particle:nth-child(268) {
  width: 2em;
  height: 2em;
  transform: translate(38em, 2em);
  animation-duration: 4.68s;
  animation-delay: -0.7488s;
}
.particle_holder .particle:nth-child(269) {
  width: 2em;
  height: 2em;
  transform: translate(-39em, 0em);
  animation-duration: 5.22s;
  animation-delay: -4.5936s;
}
.particle_holder .particle:nth-child(270) {
  width: 1em;
  height: 1em;
  transform: translate(-44em, 21em);
  animation-duration: 5.64s;
  animation-delay: -3.666s;
}
.particle_holder .particle:nth-child(271) {
  width: 2em;
  height: 2em;
  transform: translate(8em, 5em);
  animation-duration: 5.13s;
  animation-delay: -4.617s;
}
.particle_holder .particle:nth-child(272) {
  width: 2em;
  height: 2em;
  transform: translate(-21em, -10em);
  animation-duration: 3.21s;
  animation-delay: -1.0593s;
}
.particle_holder .particle:nth-child(273) {
  width: 2em;
  height: 2em;
  transform: translate(22em, -8em);
  animation-duration: 3.9s;
  animation-delay: -0.819s;
}
.particle_holder .particle:nth-child(274) {
  width: 2em;
  height: 2em;
  transform: translate(-28em, 38em);
  animation-duration: 5.49s;
  animation-delay: -0.4941s;
}
.particle_holder .particle:nth-child(275) {
  width: 2em;
  height: 2em;
  transform: translate(30em, -12em);
  animation-duration: 3.75s;
  animation-delay: -2.475s;
}
.particle_holder .particle:nth-child(276) {
  width: 1em;
  height: 1em;
  transform: translate(50em, -35em);
  animation-duration: 4.08s;
  animation-delay: -3.3456s;
}
.particle_holder .particle:nth-child(277) {
  width: 2em;
  height: 2em;
  transform: translate(22em, 48em);
  animation-duration: 3.99s;
  animation-delay: -0.6384s;
}
.particle_holder .particle:nth-child(278) {
  width: 2em;
  height: 2em;
  transform: translate(-30em, 30em);
  animation-duration: 4.62s;
  animation-delay: -2.2176s;
}
.particle_holder .particle:nth-child(279) {
  width: 2em;
  height: 2em;
  transform: translate(46em, -1em);
  animation-duration: 5.67s;
  animation-delay: -0.7371s;
}
.particle_holder .particle:nth-child(280) {
  width: 1em;
  height: 1em;
  transform: translate(30em, -6em);
  animation-duration: 3.27s;
  animation-delay: -1.635s;
}
.particle_holder .particle:nth-child(281) {
  width: 2em;
  height: 2em;
  transform: translate(-22em, 49em);
  animation-duration: 4.62s;
  animation-delay: -0.6006s;
}
.particle_holder .particle:nth-child(282) {
  width: 2em;
  height: 2em;
  transform: translate(-36em, -38em);
  animation-duration: 4.98s;
  animation-delay: -3.6354s;
}
.particle_holder .particle:nth-child(283) {
  width: 1em;
  height: 1em;
  transform: translate(-30em, -31em);
  animation-duration: 3.03s;
  animation-delay: -1.9392s;
}
.particle_holder .particle:nth-child(284) {
  width: 1em;
  height: 1em;
  transform: translate(-14em, -11em);
  animation-duration: 5.7s;
  animation-delay: -3.477s;
}
.particle_holder .particle:nth-child(285) {
  width: 1em;
  height: 1em;
  transform: translate(-18em, 32em);
  animation-duration: 4.08s;
  animation-delay: -0.1224s;
}
.particle_holder .particle:nth-child(286) {
  width: 1em;
  height: 1em;
  transform: translate(-9em, -3em);
  animation-duration: 3.78s;
  animation-delay: -0.0756s;
}
.particle_holder .particle:nth-child(287) {
  width: 2em;
  height: 2em;
  transform: translate(-36em, 41em);
  animation-duration: 5.97s;
  animation-delay: -4.5969s;
}
.particle_holder .particle:nth-child(288) {
  width: 1em;
  height: 1em;
  transform: translate(23em, 8em);
  animation-duration: 5.91s;
  animation-delay: -1.3593s;
}
.particle_holder .particle:nth-child(289) {
  width: 2em;
  height: 2em;
  transform: translate(-26em, -1em);
  animation-duration: 3.81s;
  animation-delay: -3.5433s;
}
.particle_holder .particle:nth-child(290) {
  width: 1em;
  height: 1em;
  transform: translate(-46em, -12em);
  animation-duration: 5.37s;
  animation-delay: -4.9941s;
}
.particle_holder .particle:nth-child(291) {
  width: 2em;
  height: 2em;
  transform: translate(-47em, -20em);
  animation-duration: 5.19s;
  animation-delay: -3.2178s;
}
.particle_holder .particle:nth-child(292) {
  width: 2em;
  height: 2em;
  transform: translate(5em, -5em);
  animation-duration: 5.1s;
  animation-delay: -1.632s;
}
.particle_holder .particle:nth-child(293) {
  width: 1em;
  height: 1em;
  transform: translate(-7em, 0em);
  animation-duration: 4.35s;
  animation-delay: -0.261s;
}
.particle_holder .particle:nth-child(294) {
  width: 2em;
  height: 2em;
  transform: translate(26em, -7em);
  animation-duration: 4.68s;
  animation-delay: -0.0936s;
}
.particle_holder .particle:nth-child(295) {
  width: 1em;
  height: 1em;
  transform: translate(-43em, 36em);
  animation-duration: 5.16s;
  animation-delay: -2.064s;
}
.particle_holder .particle:nth-child(296) {
  width: 2em;
  height: 2em;
  transform: translate(39em, -30em);
  animation-duration: 4.77s;
  animation-delay: -4.5792s;
}
.particle_holder .particle:nth-child(297) {
  width: 2em;
  height: 2em;
  transform: translate(-15em, -38em);
  animation-duration: 5.76s;
  animation-delay: -3.168s;
}
.particle_holder .particle:nth-child(298) {
  width: 1em;
  height: 1em;
  transform: translate(31em, -40em);
  animation-duration: 5.37s;
  animation-delay: -3.9201s;
}
.particle_holder .particle:nth-child(299) {
  width: 1em;
  height: 1em;
  transform: translate(-8em, 28em);
  animation-duration: 4.38s;
  animation-delay: -0.9198s;
}
.particle_holder .particle:nth-child(300) {
  width: 2em;
  height: 2em;
  transform: translate(-41em, -39em);
  animation-duration: 4.14s;
  animation-delay: -1.0764s;
}
.particle_holder .particle:nth-child(301) {
  width: 2em;
  height: 2em;
  transform: translate(43em, -18em);
  animation-duration: 3.45s;
  animation-delay: -0.069s;
}
.particle_holder .particle:nth-child(302) {
  width: 2em;
  height: 2em;
  transform: translate(-31em, 42em);
  animation-duration: 3.39s;
  animation-delay: -1.5933s;
}
.particle_holder .particle:nth-child(303) {
  width: 1em;
  height: 1em;
  transform: translate(-24em, 44em);
  animation-duration: 3.24s;
  animation-delay: -1.0368s;
}
.particle_holder .particle:nth-child(304) {
  width: 1em;
  height: 1em;
  transform: translate(-27em, -22em);
  animation-duration: 4.83s;
  animation-delay: -4.6368s;
}
.particle_holder .particle:nth-child(305) {
  width: 2em;
  height: 2em;
  transform: translate(21em, -6em);
  animation-duration: 3.72s;
  animation-delay: -0.4836s;
}
.particle_holder .particle:nth-child(306) {
  width: 1em;
  height: 1em;
  transform: translate(16em, 31em);
  animation-duration: 3.6s;
  animation-delay: -0.864s;
}
.particle_holder .particle:nth-child(307) {
  width: 1em;
  height: 1em;
  transform: translate(-9em, -46em);
  animation-duration: 5.46s;
  animation-delay: -3.1122s;
}
.particle_holder .particle:nth-child(308) {
  width: 1em;
  height: 1em;
  transform: translate(-35em, -33em);
  animation-duration: 5.76s;
  animation-delay: -5.184s;
}
.particle_holder .particle:nth-child(309) {
  width: 2em;
  height: 2em;
  transform: translate(29em, 38em);
  animation-duration: 5.49s;
  animation-delay: -3.294s;
}
.particle_holder .particle:nth-child(310) {
  width: 1em;
  height: 1em;
  transform: translate(-7em, 29em);
  animation-duration: 5.13s;
  animation-delay: -3.9501s;
}
.particle_holder .particle:nth-child(311) {
  width: 1em;
  height: 1em;
  transform: translate(17em, 28em);
  animation-duration: 5.94s;
  animation-delay: -3.9204s;
}
.particle_holder .particle:nth-child(312) {
  width: 1em;
  height: 1em;
  transform: translate(5em, -19em);
  animation-duration: 5.1s;
  animation-delay: -3.57s;
}
.particle_holder .particle:nth-child(313) {
  width: 1em;
  height: 1em;
  transform: translate(-13em, 15em);
  animation-duration: 4.59s;
  animation-delay: -0.918s;
}
.particle_holder .particle:nth-child(314) {
  width: 2em;
  height: 2em;
  transform: translate(7em, -15em);
  animation-duration: 5.79s;
  animation-delay: -2.4318s;
}
.particle_holder .particle:nth-child(315) {
  width: 2em;
  height: 2em;
  transform: translate(-11em, 50em);
  animation-duration: 3.27s;
  animation-delay: -0.4251s;
}
.particle_holder .particle:nth-child(316) {
  width: 1em;
  height: 1em;
  transform: translate(-37em, -48em);
  animation-duration: 4.38s;
  animation-delay: -2.1462s;
}
.particle_holder .particle:nth-child(317) {
  width: 1em;
  height: 1em;
  transform: translate(1em, -6em);
  animation-duration: 4.83s;
  animation-delay: -3.381s;
}
.particle_holder .particle:nth-child(318) {
  width: 1em;
  height: 1em;
  transform: translate(18em, 44em);
  animation-duration: 4.74s;
  animation-delay: -3.1758s;
}
.particle_holder .particle:nth-child(319) {
  width: 1em;
  height: 1em;
  transform: translate(-34em, 27em);
  animation-duration: 4.92s;
  animation-delay: -2.8536s;
}
.particle_holder .particle:nth-child(320) {
  width: 2em;
  height: 2em;
  transform: translate(-4em, 16em);
  animation-duration: 3.69s;
  animation-delay: -1.9188s;
}
.particle_holder .particle:nth-child(321) {
  width: 2em;
  height: 2em;
  transform: translate(2em, 8em);
  animation-duration: 3.21s;
  animation-delay: -2.4717s;
}
.particle_holder .particle:nth-child(322) {
  width: 1em;
  height: 1em;
  transform: translate(-26em, 30em);
  animation-duration: 5.07s;
  animation-delay: -2.9406s;
}
.particle_holder .particle:nth-child(323) {
  width: 1em;
  height: 1em;
  transform: translate(-21em, 15em);
  animation-duration: 4.98s;
  animation-delay: -2.1414s;
}
.particle_holder .particle:nth-child(324) {
  width: 2em;
  height: 2em;
  transform: translate(-21em, -27em);
  animation-duration: 5.13s;
  animation-delay: -1.0773s;
}
.particle_holder .particle:nth-child(325) {
  width: 2em;
  height: 2em;
  transform: translate(-5em, 3em);
  animation-duration: 4.5s;
  animation-delay: -2.07s;
}
.particle_holder .particle:nth-child(326) {
  width: 2em;
  height: 2em;
  transform: translate(-32em, 35em);
  animation-duration: 3.15s;
  animation-delay: -1.4805s;
}
.particle_holder .particle:nth-child(327) {
  width: 2em;
  height: 2em;
  transform: translate(48em, 44em);
  animation-duration: 5.52s;
  animation-delay: -2.6496s;
}
.particle_holder .particle:nth-child(328) {
  width: 2em;
  height: 2em;
  transform: translate(26em, -8em);
  animation-duration: 4.44s;
  animation-delay: -2.9304s;
}
.particle_holder .particle:nth-child(329) {
  width: 1em;
  height: 1em;
  transform: translate(13em, -8em);
  animation-duration: 4.59s;
  animation-delay: -3.3966s;
}
.particle_holder .particle:nth-child(330) {
  width: 1em;
  height: 1em;
  transform: translate(-9em, 19em);
  animation-duration: 3.81s;
  animation-delay: -1.1811s;
}
.particle_holder .particle:nth-child(331) {
  width: 1em;
  height: 1em;
  transform: translate(47em, 10em);
  animation-duration: 4.02s;
  animation-delay: -3.015s;
}
.particle_holder .particle:nth-child(332) {
  width: 1em;
  height: 1em;
  transform: translate(31em, 29em);
  animation-duration: 5.94s;
  animation-delay: -1.0098s;
}
.particle_holder .particle:nth-child(333) {
  width: 1em;
  height: 1em;
  transform: translate(34em, -43em);
  animation-duration: 3.15s;
  animation-delay: -2.457s;
}
.particle_holder .particle:nth-child(334) {
  width: 1em;
  height: 1em;
  transform: translate(3em, -36em);
  animation-duration: 3.03s;
  animation-delay: -1.6968s;
}
.particle_holder .particle:nth-child(335) {
  width: 2em;
  height: 2em;
  transform: translate(-34em, -17em);
  animation-duration: 5.13s;
  animation-delay: -0.6669s;
}
.particle_holder .particle:nth-child(336) {
  width: 2em;
  height: 2em;
  transform: translate(-18em, 44em);
  animation-duration: 4.86s;
  animation-delay: -3.8394s;
}
.particle_holder .particle:nth-child(337) {
  width: 1em;
  height: 1em;
  transform: translate(-27em, -8em);
  animation-duration: 5.01s;
  animation-delay: -4.3587s;
}
.particle_holder .particle:nth-child(338) {
  width: 2em;
  height: 2em;
  transform: translate(9em, 49em);
  animation-duration: 3.93s;
  animation-delay: -2.358s;
}
.particle_holder .particle:nth-child(339) {
  width: 2em;
  height: 2em;
  transform: translate(13em, 47em);
  animation-duration: 3.81s;
  animation-delay: -3.0099s;
}
.particle_holder .particle:nth-child(340) {
  width: 2em;
  height: 2em;
  transform: translate(27em, -25em);
  animation-duration: 3.03s;
  animation-delay: -0.0606s;
}
.particle_holder .particle:nth-child(341) {
  width: 1em;
  height: 1em;
  transform: translate(-27em, -36em);
  animation-duration: 3.81s;
  animation-delay: -0.8382s;
}
.particle_holder .particle:nth-child(342) {
  width: 2em;
  height: 2em;
  transform: translate(23em, 18em);
  animation-duration: 5.52s;
  animation-delay: -3.6432s;
}
.particle_holder .particle:nth-child(343) {
  width: 2em;
  height: 2em;
  transform: translate(-8em, 33em);
  animation-duration: 4.11s;
  animation-delay: -3.8634s;
}
.particle_holder .particle:nth-child(344) {
  width: 1em;
  height: 1em;
  transform: translate(-17em, 41em);
  animation-duration: 3.27s;
  animation-delay: -0.1308s;
}
.particle_holder .particle:nth-child(345) {
  width: 1em;
  height: 1em;
  transform: translate(44em, 6em);
  animation-duration: 4.68s;
  animation-delay: -1.9188s;
}
.particle_holder .particle:nth-child(346) {
  width: 1em;
  height: 1em;
  transform: translate(34em, -19em);
  animation-duration: 4.35s;
  animation-delay: -1.653s;
}
.particle_holder .particle:nth-child(347) {
  width: 1em;
  height: 1em;
  transform: translate(-30em, 40em);
  animation-duration: 4.59s;
  animation-delay: -3.9015s;
}
.particle_holder .particle:nth-child(348) {
  width: 1em;
  height: 1em;
  transform: translate(27em, 23em);
  animation-duration: 4.77s;
  animation-delay: -2.0511s;
}
.particle_holder .particle:nth-child(349) {
  width: 1em;
  height: 1em;
  transform: translate(46em, -22em);
  animation-duration: 5.22s;
  animation-delay: -3.7584s;
}
.particle_holder .particle:nth-child(350) {
  width: 1em;
  height: 1em;
  transform: translate(48em, -40em);
  animation-duration: 3.66s;
  animation-delay: -3.66s;
}
.particle_holder .particle:nth-child(351) {
  width: 2em;
  height: 2em;
  transform: translate(-31em, 20em);
  animation-duration: 5.19s;
  animation-delay: -1.038s;
}
.particle_holder .particle:nth-child(352) {
  width: 1em;
  height: 1em;
  transform: translate(12em, -14em);
  animation-duration: 3.36s;
  animation-delay: -2.52s;
}
.particle_holder .particle:nth-child(353) {
  width: 2em;
  height: 2em;
  transform: translate(20em, -27em);
  animation-duration: 5.19s;
  animation-delay: -3.8925s;
}
.particle_holder .particle:nth-child(354) {
  width: 1em;
  height: 1em;
  transform: translate(14em, -22em);
  animation-duration: 4.08s;
  animation-delay: -2.5704s;
}
.particle_holder .particle:nth-child(355) {
  width: 2em;
  height: 2em;
  transform: translate(2em, -34em);
  animation-duration: 4.14s;
  animation-delay: -1.4076s;
}
.particle_holder .particle:nth-child(356) {
  width: 1em;
  height: 1em;
  transform: translate(14em, 19em);
  animation-duration: 5.82s;
  animation-delay: -1.9206s;
}
.particle_holder .particle:nth-child(357) {
  width: 2em;
  height: 2em;
  transform: translate(39em, 6em);
  animation-duration: 5.22s;
  animation-delay: -2.349s;
}
.particle_holder .particle:nth-child(358) {
  width: 1em;
  height: 1em;
  transform: translate(8em, 10em);
  animation-duration: 5.34s;
  animation-delay: -2.0292s;
}
.particle_holder .particle:nth-child(359) {
  width: 1em;
  height: 1em;
  transform: translate(-8em, -8em);
  animation-duration: 6s;
  animation-delay: -2.04s;
}
.particle_holder .particle:nth-child(360) {
  width: 2em;
  height: 2em;
  transform: translate(-38em, -19em);
  animation-duration: 5.01s;
  animation-delay: -1.8036s;
}
.particle_holder .particle:nth-child(361) {
  width: 1em;
  height: 1em;
  transform: translate(-30em, -2em);
  animation-duration: 5.61s;
  animation-delay: -4.9929s;
}
.particle_holder .particle:nth-child(362) {
  width: 2em;
  height: 2em;
  transform: translate(34em, 47em);
  animation-duration: 3.54s;
  animation-delay: -3.2568s;
}
.particle_holder .particle:nth-child(363) {
  width: 2em;
  height: 2em;
  transform: translate(30em, -16em);
  animation-duration: 4.35s;
  animation-delay: -2.871s;
}
.particle_holder .particle:nth-child(364) {
  width: 2em;
  height: 2em;
  transform: translate(8em, 30em);
  animation-duration: 5.25s;
  animation-delay: -4.095s;
}
.particle_holder .particle:nth-child(365) {
  width: 1em;
  height: 1em;
  transform: translate(-8em, -23em);
  animation-duration: 3.18s;
  animation-delay: -0.4134s;
}
.particle_holder .particle:nth-child(366) {
  width: 2em;
  height: 2em;
  transform: translate(-8em, -24em);
  animation-duration: 5.7s;
  animation-delay: -1.539s;
}
.particle_holder .particle:nth-child(367) {
  width: 2em;
  height: 2em;
  transform: translate(32em, -39em);
  animation-duration: 4.08s;
  animation-delay: -0.408s;
}
.particle_holder .particle:nth-child(368) {
  width: 2em;
  height: 2em;
  transform: translate(38em, -21em);
  animation-duration: 4.68s;
  animation-delay: -0.8892s;
}
.particle_holder .particle:nth-child(369) {
  width: 2em;
  height: 2em;
  transform: translate(-3em, -10em);
  animation-duration: 5.67s;
  animation-delay: -2.3814s;
}
.particle_holder .particle:nth-child(370) {
  width: 2em;
  height: 2em;
  transform: translate(-42em, 35em);
  animation-duration: 5.34s;
  animation-delay: -2.2428s;
}
.particle_holder .particle:nth-child(371) {
  width: 1em;
  height: 1em;
  transform: translate(-8em, -14em);
  animation-duration: 4.71s;
  animation-delay: -3.297s;
}
.particle_holder .particle:nth-child(372) {
  width: 2em;
  height: 2em;
  transform: translate(10em, -30em);
  animation-duration: 3.72s;
  animation-delay: -1.8972s;
}
.particle_holder .particle:nth-child(373) {
  width: 1em;
  height: 1em;
  transform: translate(41em, -13em);
  animation-duration: 5.25s;
  animation-delay: -3.2025s;
}
.particle_holder .particle:nth-child(374) {
  width: 1em;
  height: 1em;
  transform: translate(-22em, 17em);
  animation-duration: 5.16s;
  animation-delay: -1.5996s;
}
.particle_holder .particle:nth-child(375) {
  width: 1em;
  height: 1em;
  transform: translate(-31em, 13em);
  animation-duration: 3.57s;
  animation-delay: -1.9992s;
}
.particle_holder .particle:nth-child(376) {
  width: 1em;
  height: 1em;
  transform: translate(-37em, -28em);
  animation-duration: 3.06s;
  animation-delay: -2.0502s;
}
.particle_holder .particle:nth-child(377) {
  width: 1em;
  height: 1em;
  transform: translate(36em, 10em);
  animation-duration: 4.41s;
  animation-delay: -3.8367s;
}
.particle_holder .particle:nth-child(378) {
  width: 1em;
  height: 1em;
  transform: translate(-20em, 41em);
  animation-duration: 5.37s;
  animation-delay: -1.4499s;
}
.particle_holder .particle:nth-child(379) {
  width: 2em;
  height: 2em;
  transform: translate(-26em, -23em);
  animation-duration: 3.54s;
  animation-delay: -0.8142s;
}
.particle_holder .particle:nth-child(380) {
  width: 1em;
  height: 1em;
  transform: translate(-7em, -5em);
  animation-duration: 3.48s;
  animation-delay: -0.1392s;
}
.particle_holder .particle:nth-child(381) {
  width: 1em;
  height: 1em;
  transform: translate(-35em, 20em);
  animation-duration: 4.89s;
  animation-delay: -4.6455s;
}
.particle_holder .particle:nth-child(382) {
  width: 1em;
  height: 1em;
  transform: translate(46em, -32em);
  animation-duration: 5.67s;
  animation-delay: -0.9072s;
}
.particle_holder .particle:nth-child(383) {
  width: 1em;
  height: 1em;
  transform: translate(49em, 28em);
  animation-duration: 5.49s;
  animation-delay: -2.7999s;
}
.particle_holder .particle:nth-child(384) {
  width: 2em;
  height: 2em;
  transform: translate(-5em, 10em);
  animation-duration: 4.68s;
  animation-delay: -4.1652s;
}
.particle_holder .particle:nth-child(385) {
  width: 2em;
  height: 2em;
  transform: translate(-19em, 40em);
  animation-duration: 5.43s;
  animation-delay: -5.0499s;
}
.particle_holder .particle:nth-child(386) {
  width: 2em;
  height: 2em;
  transform: translate(7em, 29em);
  animation-duration: 3.48s;
  animation-delay: -1.2876s;
}
.particle_holder .particle:nth-child(387) {
  width: 1em;
  height: 1em;
  transform: translate(-10em, 30em);
  animation-duration: 5.97s;
  animation-delay: -1.8507s;
}
.particle_holder .particle:nth-child(388) {
  width: 1em;
  height: 1em;
  transform: translate(17em, -39em);
  animation-duration: 5.61s;
  animation-delay: -2.6367s;
}
.particle_holder .particle:nth-child(389) {
  width: 1em;
  height: 1em;
  transform: translate(-4em, 38em);
  animation-duration: 4.98s;
  animation-delay: -0.7968s;
}
.particle_holder .particle:nth-child(390) {
  width: 2em;
  height: 2em;
  transform: translate(21em, 15em);
  animation-duration: 3.18s;
  animation-delay: -1.6536s;
}
.particle_holder .particle:nth-child(391) {
  width: 2em;
  height: 2em;
  transform: translate(-48em, 12em);
  animation-duration: 3.48s;
  animation-delay: -2.3664s;
}
.particle_holder .particle:nth-child(392) {
  width: 2em;
  height: 2em;
  transform: translate(-19em, -19em);
  animation-duration: 3.27s;
  animation-delay: -1.0137s;
}
.particle_holder .particle:nth-child(393) {
  width: 1em;
  height: 1em;
  transform: translate(35em, 50em);
  animation-duration: 3.78s;
  animation-delay: -1.2852s;
}
.particle_holder .particle:nth-child(394) {
  width: 1em;
  height: 1em;
  transform: translate(-2em, -1em);
  animation-duration: 5.28s;
  animation-delay: -3.8544s;
}
.particle_holder .particle:nth-child(395) {
  width: 2em;
  height: 2em;
  transform: translate(-25em, 23em);
  animation-duration: 3.18s;
  animation-delay: -1.6218s;
}
.particle_holder .particle:nth-child(396) {
  width: 1em;
  height: 1em;
  transform: translate(-13em, -33em);
  animation-duration: 4.17s;
  animation-delay: -3.5028s;
}
.particle_holder .particle:nth-child(397) {
  width: 2em;
  height: 2em;
  transform: translate(-33em, 39em);
  animation-duration: 3.33s;
  animation-delay: -3.1635s;
}
.particle_holder .particle:nth-child(398) {
  width: 1em;
  height: 1em;
  transform: translate(-26em, 5em);
  animation-duration: 3.66s;
  animation-delay: -1.281s;
}
.particle_holder .particle:nth-child(399) {
  width: 1em;
  height: 1em;
  transform: translate(19em, -33em);
  animation-duration: 4.2s;
  animation-delay: -2.352s;
}
.particle_holder .particle:nth-child(400) {
  width: 2em;
  height: 2em;
  transform: translate(-44em, 37em);
  animation-duration: 4.59s;
  animation-delay: -0.3213s;
}
@keyframes shoot {
  0% {
    transform: translate(0, 0);
  }
}
@keyframes fade {
  to {
    opacity: 0;
  }
}

.timer_holder {
  position: absolute;
  box-shadow: rgba(0, 0, 0, 0.12) 0px 1px 3px, rgba(0, 0, 0, 0.24) 0px 1px 2px;
  border-radius: 5px;
  background-color: white;
}
.timer_holder .timer_body {
  width: 100%;
  height: 100%;
  left: 0;
  position: absolute;
  bottom: 0;
  border-radius: 5px;
  transition: all 0.4s;
}

.left {
  top: 0;
  bottom: 0;
  right: -15px;
  width: 10px;
}
.left .timer_body {
  background: rgb(88, 136, 211);
  background: linear-gradient(180deg, rgb(88, 136, 211) 0%, rgb(69, 221, 117) 25%, rgb(210, 229, 53) 50%, rgb(237, 232, 37) 75%, rgb(255, 120, 0) 100%);
}

.right {
  top: 0;
  bottom: 0;
  left: -15px;
  width: 10px;
}
.right .timer_body {
  background: rgb(88, 136, 211);
  background: linear-gradient(180deg, rgb(88, 136, 211) 0%, rgb(69, 221, 117) 25%, rgb(210, 229, 53) 50%, rgb(237, 232, 37) 75%, rgb(255, 120, 0) 100%);
}

.top {
  left: 0;
  right: 0;
  top: -15px;
  height: 10px;
}
.top .timer_body {
  background: rgb(88, 136, 211);
  background: linear-gradient(90deg, rgb(88, 136, 211) 0%, rgb(69, 221, 117) 25%, rgb(210, 229, 53) 50%, rgb(237, 232, 37) 75%, rgb(255, 120, 0) 100%);
}

.bottom {
  left: 0;
  right: 0;
  bottom: -15px;
  height: 10px;
}
.bottom .timer_body {
  background: rgb(88, 136, 211);
  background: linear-gradient(90deg, rgb(88, 136, 211) 0%, rgb(69, 221, 117) 25%, rgb(210, 229, 53) 50%, rgb(237, 232, 37) 75%, rgb(255, 120, 0) 100%);
}

.topic_and_question {
  width: 15%;
  position: absolute;
  top: 10px;
  left: 10px;
  border-radius: 6px;
  box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
  padding: 1em;
  background-color: white;
  z-index: 10;
}
.topic_and_question .minimize {
  z-index: 3;
  position: absolute;
  top: 10px;
  right: 10px;
  background-color: grey;
  width: 1em;
  height: 0.3em;
  border-radius: 5px;
  cursor: pointer;
}
.topic_and_question .minimize:hover {
  background-color: rgba(128, 128, 128, 0.507);
}
.topic_and_question .holder {
  transition: max-height 0.4s;
  max-height: 1000px;
  overflow: hidden;
  transform-origin: top;
}
.topic_and_question .topic h3 {
  color: #98eb34;
  margin: 0;
}
.topic_and_question .topic p {
  margin: 0;
}
.topic_and_question .question h3 {
  color: #eb34ae;
  margin: 0;
  margin-top: 1em;
}
.topic_and_question .question p {
  margin: 0;
}
.topic_and_question header {
  color: grey;
  font-weight: bold;
}
.topic_and_question .hidden_body {
  max-height: 0;
}

@media all and (max-width: 1400px) {
  .topic_and_question {
    width: 20%;
    font-size: small;
  }
}
@media all and (max-width: 1200px) {
  .topic_and_question {
    width: 30%;
  }
}
@media all and (max-width: 1000px) {
  .topic_and_question {
    width: 20%;
    font-size: 8px;
  }
}
.rotate_device_body {
  background: black;
  height: 100vh;
  width: 100vw;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}

.phone {
  height: 50px;
  width: 100px;
  border: 3px solid white;
  border-radius: 10px;
  animation: rotate 1.5s ease-in-out infinite alternate;
  /* display: none; */
}

.message {
  color: white;
  font-size: 1em;
  margin-top: 40px;
}

@keyframes rotate {
  0% {
    transform: rotate(0deg);
  }
  50% {
    transform: rotate(-90deg);
  }
  100% {
    transform: rotate(-90deg);
  }
}
@media only screen and (max-device-width: 812px) and (orientation: landscape) {
  .phone, .message {
    display: block;
  }
}/*# sourceMappingURL=styles.css.map */