:root {
  --color-1: #323232;
}

* {
  box-sizing: border-box;
}

::-moz-selection {
  /* Code for Firefox */
  color: white;
  background: var(--color-3);
}

::selection {
  color: white;
  background: var(--color-3);
}

*,
*:focus,
*:hover {
  outline: none;
}

html,
body {
  margin: 0;
  height: 100%;
  width: 100%;
}

a {
  color: inherit;
  text-decoration: none;
}

input,
select,
textarea {
  font-family: inherit;
  font-size: inherit;
  outline: none;
  padding: 6px 10px;
  display: inline-block;
  background-color: var(--form-background-color);
  color: var(--form-text-color);
  transition: background-color 1s, color 1s;
  margin: 0;
  border-radius: 0;
  -webkit-appearance: none;
}

input[type="file"] {
  padding: 0;
}

input[type="text"],
input[type="password"],
input[type="number"],
input[type="tel"],
input[type="email"] {
  width: 100%;
  border: 1px solid #ccc;
  box-sizing: border-box;
}

input[type="checkbox"] {
  position: relative;
  top: 2px;
  -webkit-appearance: checkbox;
}

input[type="date"],
input[type="time"] {
  width: 200px;
  border: 1px solid #ccc;
  box-sizing: border-box;
  padding: 5px 10px;
}

input[type="submit"] {
  font-family: "Catamaran", sans-serif;
  font-size: inherit;
}

fieldset {
  border: none;
}

input[type="radio"] {
  -webkit-appearance: auto;
}

textarea {
  width: 100%;
  height: 150px;
  border-color: #cccccc;
  box-sizing: border-box;
}

select {
  display: inline-block;
  border: 1px solid #ccc;
  -webkit-appearance: none;
  -webkit-border-radius: 0px;
}

@media (min-width: 500px) and (max-width: 999999999px) {
  /* Only show custom scrollbar on screens wide enough */
  ::-webkit-scrollbar {
    width: 8px;
    height: 8px;
  }

  ::-webkit-scrollbar-track {
    background: #707070;
  }

  ::-webkit-scrollbar-thumb {
    border-radius: 10px;
    background: var(--color-1);
  }

  ::-webkit-scrollbar-thumb:hover {
    background: var(--color-1);
  }
}

.width_5,
.width_10,
.width_12,
.width_15,
.width_20,
.width_25,
.width_30,
.width_33,
.width_35,
.width_40,
.width_45,
.width_50,
.width_55,
.width_60,
.width_65,
.width_70,
.width_75,
.width_80,
.width_85,
.width_90,
.width_95,
.width_100 {
  height: auto;
  float: left;
}

.width_5 {
  width: 5%;
}

.width_10 {
  width: 10%;
}

.width_12 {
  width: 12%;
}

.width_15 {
  width: 15%;
}

.width_20 {
  width: 20%;
}

.width_25 {
  width: 25%;
}

.width_30 {
  width: 30%;
}

.width_33 {
  width: 33.3%;
}

.width_35 {
  width: 35%;
}

.width_40 {
  width: 40%;
}

.width_45 {
  width: 45%;
}

.width_50 {
  width: 50%;
}

.width_55 {
  width: 55%;
}

.width_60 {
  width: 60%;
}

.width_65 {
  width: 65%;
}

.width_70 {
  width: 70%;
}

.width_75 {
  width: 75%;
}

.width_80 {
  width: 80%;
}

.width_85 {
  width: 85%;
}

.width_90 {
  width: 90%;
}

.width_95 {
  width: 95%;
}

.width_100 {
  width: 100%;
}

.width_auto {
  width: auto !important;
}

.height_0 {
  height: 0;
}

.height_5 {
  height: 5vh;
}
.height_10 {
  height: 10vh;
}
.height_15 {
  height: 15vh;
}
.height_20 {
  height: 20vh;
}
.height_25 {
  height: 25vh;
}
.height_30 {
  height: 30vh;
}
.height_35 {
  height: 35vh;
}
.height_40 {
  height: 40vh;
}
.height_45 {
  height: 45vh;
}
.height_50 {
  height: 50vh;
}
.height_55 {
  height: 55vh;
}
.height_60 {
  height: 60vh;
}
.height_65 {
  height: 65vh;
}
.height_70 {
  height: 70vh;
}
.height_75 {
  height: 75vh;
}
.height_80 {
  height: 80vh;
}
.height_85 {
  height: 85vh;
}
.height_90 {
  height: 90vh;
}
.height_95 {
  height: 95vh;
}
.height_100 {
  height: 100vh;
}

@media (max-width: 768px) {
  .mobile_height_0 {
    height: 0;
  }
  .mobile_height_5 {
    height: 5vh;
  }
  .mobile_height_10 {
    height: 10vh;
  }
  .mobile_height_15 {
    height: 15vh;
  }
  .mobile_height_20 {
    height: 20vh;
  }
  .mobile_height_25 {
    height: 25vh;
  }
  .mobile_height_30 {
    height: 30vh;
  }
  .mobile_height_35 {
    height: 35vh;
  }
  .mobile_height_40 {
    height: 40vh;
  }
  .mobile_height_45 {
    height: 45vh;
  }
  .mobile_height_50 {
    height: 50vh;
  }
  .mobile_height_55 {
    height: 55vh;
  }
  .mobile_height_60 {
    height: 60vh;
  }
  .mobile_height_65 {
    height: 65vh;
  }
  .mobile_height_70 {
    height: 70vh;
  }
  .mobile_height_75 {
    height: 75vh;
  }
  .mobile_height_80 {
    height: 80vh;
  }
  .mobile_height_85 {
    height: 85vh;
  }
  .mobile_height_90 {
    height: 90vh;
  }
  .mobile_height_95 {
    height: 95vh;
  }
  .mobile_height_100 {
    height: 100vh;
  }
}

.min_height_5 {
  min-height: 5vh;
}
.min_height_10 {
  min-height: 10vh;
}
.min_height_15 {
  min-height: 15vh;
}
.min_height_20 {
  min-height: 20vh;
}
.min_height_25 {
  min-height: 25vh;
}
.min_height_30 {
  min-height: 30vh;
}
.min_height_35 {
  min-height: 35vh;
}
.min_height_40 {
  min-height: 40vh;
}
.min_height_45 {
  min-height: 45vh;
}
.min_height_50 {
  min-height: 50vh;
}
.min_height_55 {
  min-height: 55vh;
}
.min_height_60 {
  min-height: 60vh;
}
.min_height_65 {
  min-height: 65vh;
}
.min_height_70 {
  min-height: 70vh;
}
.min_height_75 {
  min-height: 75vh;
}
.min_height_80 {
  min-height: 80vh;
}
.min_height_85 {
  min-height: 85vh;
}
.min_height_90 {
  min-height: 90vh;
}
.min_height_95 {
  min-height: 95vh;
}
.min_height_100 {
  min-height: 100vh;
}

.banner_padding_1 {
  padding: 1vh 0;
}

.banner_padding_2 {
  padding: 2vh 0;
}

.banner_padding_3 {
  padding: 3vh 0;
}

.banner_padding_4 {
  padding: 4vh 0;
}

.banner_padding_5 {
  padding: 5vh 0;
}

.banner_padding_6 {
  padding: 6vh 0;
}

.banner_padding_7 {
  padding: 7vh 0;
}

.banner_padding_8 {
  padding: 8vh 0;
}

.banner_padding_9 {
  padding: 9vh 0;
}

.banner_padding_10 {
  padding: 10vh 0;
}

.text_center {
  text-align: center;
}

.text_left {
  text-align: left;
}

.text_right {
  text-align: right;
}

.text_italic {
  font-style: italic !important;
}
.text_bold {
  font-weight: bold !important;
}
.screen_width {
  width: 1300px;
  margin: 0 auto;
}

@media (min-width: 1300px) and (max-width: 1500px) {
  .screen_width {
    width: 1100px;
  }
}

.small_break {
  height: 1vh;
  width: 100%;
  height: auto;
  overflow: hidden;
  border: none;
}

.break {
  height: 2vh;
  width: 100%;
  height: auto;
  overflow: hidden;
  border: none;
}

.large_break {
  height: 3vh;
  width: 100%;
  overflow: hidden;
  border: none;
}

.extra_large_break {
  height: 7vh;
  width: 100%;
  overflow: hidden;
  border: none;
}

.margin_0 {
  margin: 0 !important;
}

.float_right {
  float: right;
}

.float_left {
  float: left;
}

.float_none {
  float: none;
}

.vertical_center {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
}

.vertical_bottom {
  display: flex;
  align-items: flex-end;
  flex-wrap: wrap;
}

.vertical_spread {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  flex-wrap: wrap;
}

.horizontal_spread {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}

.horizontal_evenly {
  display: flex;
  justify-content: space-evenly;
  flex-wrap: wrap;
}

.horizontal_center {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
}

.horizontal_right {
  display: flex;
  justify-content: flex-end;
  flex-wrap: wrap;
}

.mirror_element_y {
  transform: scaleY(-1);
}

.mirror_element_x {
  transform: scaleX(-1);
}

.masonry img {
  max-width: 100%;
  display: block;
}

.masonry div {
  margin: 0;
  display: grid;
  grid-template-rows: 1fr auto;
  margin-bottom: 10px;
  break-inside: avoid;
}

.masonry div > img {
  grid-row: 1 / -1;
  grid-column: 1;
}

.masonry {
  column-count: 4;
  column-gap: 10px;
}

.ratio_1 {
  aspect-ratio: 1;
}

.overflow_hidden {
  overflow: hidden;
}

.grid_1,
.grid_2,
.grid_3,
.grid_4,
.grid_5,
.grid_6 {
  display: grid;
  gap: 1rem;
}

.grid_1 {
  grid-template-columns: repeat(1, 1fr);
}

.grid_2 {
  grid-template-columns: repeat(2, 1fr);
}

.grid_3 {
  grid-template-columns: repeat(3, 1fr);
}

.grid_4 {
  grid-template-columns: repeat(4, 1fr);
}

.grid_5 {
  grid-template-columns: repeat(5, 1fr);
}

.grid_6 {
  grid-template-columns: repeat(6, 1fr);
}

.grid_span_2 {
  grid-column: span 2;
}

.grid_span_3 {
  grid-column: span 3;
}

.grid_span_4 {
  grid-column: span 4;
}

.grid_span_5 {
  grid-column: span 5;
}

.grid_span_6 {
  grid-column: span 6;
}

.grid_row_2 {
  grid-row: span 2;
}

.grid_row_3 {
  grid-row: span 3;
}

.grid_row_4 {
  grid-row: span 4;
}

.grid_row_5 {
  grid-row: span 5;
}

.grid_row_6 {
  grid-row: span 6;
}

.gap_1 {
  gap: 1rem;
}

.gap_2 {
  gap: 2rem;
}

.gap_3 {
  gap: 3rem;
}

.gap_4 {
  gap: 4rem;
}

.gap_5 {
  gap: 5rem;
}

@media (min-width: 320px) and (max-width: 767px) {
  .mobile_gap_0 {
    gap: 1rem;
  }

  .mobile_gap_1 {
    gap: 1rem;
  }

  .mobile_gap_2 {
    gap: 2rem;
  }

  .mobile_gap_3 {
    gap: 3rem;
  }

  .mobile_gap_4 {
    gap: 4rem;
  }

  .mobile_gap_5 {
    gap: 5rem;
  }
}

.flex_full {
  flex: 0 0 100%;
}

.flex_1 {
  flex: 1;
}
.flex_2 {
  flex: 2;
}
.flex_3 {
  flex: 3;
}
.flex_4 {
  flex: 4;
}
.flex_5 {
  flex: 5;
}
.flex_6 {
  flex: 6;
}
.flex_7 {
  flex: 7;
}
.flex_8 {
  flex: 8;
}
.flex_9 {
  flex: 9;
}
.flex_10 {
  flex: 10;
}

@media (max-width: 768px) {
  .mobile_flex_full {
    flex: 0 0 100%;
  }

  .mobile_flex_1 {
    flex: 1;
  }
  .mobile_flex_2 {
    flex: 2;
  }
  .mobile_flex_3 {
    flex: 3;
  }
  .mobile_flex_4 {
    flex: 4;
  }
  .mobile_flex_5 {
    flex: 5;
  }
  .mobile_flex_6 {
    flex: 6;
  }
  .mobile_flex_7 {
    flex: 7;
  }
  .mobile_flex_8 {
    flex: 8;
  }
  .mobile_flex_9 {
    flex: 9;
  }
  .mobile_flex_10 {
    flex: 10;
  }
}
.ipad_only {
  display: none;
}

.no_wrap {
  flex-wrap: nowrap;
}
@media (min-width: 320px) and (max-width: 767px) {
  .mobile_wrap {
    flex-wrap: wrap;
  }
}
@media (min-width: 320px) and (max-width: 1300px) {
  .ipad_disable {
    display: none;
  }
  .ipad_only {
    display: block;
  }

  .screen_width {
    width: 80%;
  }
}

.mobile_only {
  display: none;
}

@media (min-width: 320px) and (max-width: 767px) {
  .mobile_text_center {
    text-align: center;
  }

  .mobile_text_left {
    text-align: left;
  }

  .mobile_text_right {
    text-align: right;
  }
}

@media (min-width: 320px) and (max-width: 767px) {
  .mobile_grid_1,
  .mobile_grid_2,
  .mobile_grid_3,
  .mobile_grid_4,
  .mobile_grid_5,
  .mobile_grid_6 {
    display: grid;
    gap: 1rem;
  }

  .mobile_grid_1 {
    grid-template-columns: repeat(1, 1fr);
  }

  .mobile_grid_2 {
    grid-template-columns: repeat(2, 1fr);
  }

  .mobile_grid_3 {
    grid-template-columns: repeat(3, 1fr);
  }

  .mobile_grid_4 {
    grid-template-columns: repeat(4, 1fr);
  }

  .mobile_grid_5 {
    grid-template-columns: repeat(5, 1fr);
  }

  .mobile_grid_6 {
    grid-template-columns: repeat(6, 1fr);
  }

  .mobile_grid_span_1 {
    grid-column: span 1;
  }

  .mobile_only {
    display: block;
  }

  .mobile_float_right {
    float: right;
  }

  .mobile_float_left {
    float: left;
  }

  .mobile_disable {
    display: none !important;
  }

  .mobile_reverse {
    display: flex;
    flex-direction: column-reverse;
  }

  .mobile_flexbox * {
    flex-basis: 100%;
  }

  .mobile_width_10 {
    width: 10%;
    height: auto;
    float: left;
    overflow: hidden;
  }
  .mobile_width_20 {
    width: 20%;
    height: auto;
    float: left;
    overflow: hidden;
  }
  .mobile_width_30 {
    width: 30%;
    height: auto;
    float: left;
    overflow: hidden;
  }
  .mobile_width_40 {
    width: 40%;
    height: auto;
    float: left;
    overflow: hidden;
  }
  .mobile_width_50 {
    width: 50%;
    height: auto;
    float: left;
    overflow: hidden;
  }
  .mobile_width_60 {
    width: 60%;
    height: auto;
    float: left;
    overflow: hidden;
  }
  .mobile_width_70 {
    width: 70%;
    height: auto;
    float: left;
    overflow: hidden;
  }
  .mobile_width_80 {
    width: 80%;
    height: auto;
    float: left;
    overflow: hidden;
  }
  .mobile_width_90 {
    width: 90%;
    height: auto;
    float: left;
    overflow: hidden;
  }
  .mobile_width_100 {
    width: 100%;
    height: auto;
    float: left;
    overflow: hidden;
  }
  .mobile_height_auto {
    height: auto !important;
  }

  .mobile_vertical_center {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
  }

  .mobile_vertical_bottom {
    display: flex;
    align-items: flex-end;
    flex-wrap: wrap;
  }

  .mobile_horizontal_spread {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
  }

  .mobile_horizontal_evenly {
    display: flex;
    justify-content: space-evenly;
    flex-wrap: wrap;
  }

  .mobile_horizontal_center {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
  }

  .mobile_horizontal_right {
    display: flex;
    justify-content: flex-end;
    flex-wrap: wrap;
  }
}
