* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  list-style-type: none;
}

:root {
  --page-gap: clamp(150px, calc(105.88235px + 12.2549vw), 200px);
  --main-font: "Monotype Corsiva", cursive;
}

@font-face {
  font-family: "VanArkel";
  src: url("../fonts/VanArkel.otf") format("opentype");
  font-display: swap;
}
html {
  position: relative;
}

.relative {
  position: relative;
}

.disable-scroll {
  overflow: hidden;
}

.tablet-version {
  display: none !important;
}

.desktop-version {
  display: none !important;
}

.display-none {
  display: none;
}

.big-text {
  font-family: var(--main-font);
  text-align: center;
  font-size: 1.875rem;
  font-weight: 500;
  background: repeating-linear-gradient(180deg, #ce9728 0%, #865b11 15%, #e7b846 30%, #ffec7a 40%, #e7b846 55%, #ce9728 70%, #ffe173 85%, #f2b93a 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.small-text {
  color: rgb(255, 255, 255);
  font-family: "Gabriela", sans-serif;
  text-align: center;
  font-size: 0.9375rem;
}

.highlight-line {
  display: block;
  background: linear-gradient(90deg, #ce9728 0%, #865b11 15%, #e7b846 30%, #ffec7a 40%, #e7b846 55%, #ce9728 70%, #ffe173 85%, #f2b93a 100%);
  height: 2px;
  width: 160px;
  margin: 0 auto 0 auto;
  z-index: 2;
}

.long-highlight-line {
  display: block;
  background: linear-gradient(90deg, #ce9728 0%, #865b11 15%, #e7b846 30%, #ffec7a 40%, #e7b846 55%, #ce9728 70%, #ffe173 85%, #f2b93a 100%);
  height: 2px;
  width: 292px;
  margin: 0 auto 0 auto;
  z-index: 2;
}

#background-container {
  position: absolute;
  top: 0px;
  left: 0px;
  bottom: 0px;
  right: 0px;
  width: 100vw;
  height: 100%;
  background-image: url("../img/cosmic background.jpg");
  background-repeat: repeat-y;
  background-size: 300%;
  z-index: -10;
}
nav {
  position: fixed;
  top: 0px;
  left: 0px;
  height: 110px;
  width: 100vw;
  z-index: 5;
}

#nav-cosmic-background {
  position: absolute;
  top: 0px;
  left: -10%;
  width: 120vw;
  height: 110px;
  z-index: 0;
}

#nav-container {
  position: relative;
  display: flex;
}

#logo {
  width: clamp(195px, 15.931vw + 137.647px, 260px);
  height: auto;
  margin: 4px 0 0px -5px;
  z-index: 2;
}

.extended-nav {
  position: absolute;
  top: 0px;
  left: calc(-100vw - 30px);
  width: 100vw;
  height: 100vh;
  z-index: 1;
  transition: left 300ms ease-in-out;
}

.nav-slide-in {
  left: 0px;
  transition: left 300ms ease-in-out;
}

#nav-extended-background {
  position: relative;
  z-index: 2;
}
#nav-extended-background img {
  position: absolute;
  top: 0px;
  left: -20vw;
  width: 120vw;
  height: 110vh;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center center;
     object-position: center center;
}
#nav-extended-background img:nth-of-type(2) {
  z-index: 1;
}
#nav-extended-background img:nth-of-type(1) {
  filter: blur(12px);
  z-index: 0;
}

#nav-links {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 40px;
  margin-top: 90px;
}
#nav-links li {
  display: flex;
  flex-direction: column;
  z-index: 2;
  width: -moz-min-content;
  width: min-content;
  font-size: 1.75rem;
  cursor: pointer;
}
#nav-links li a {
  font-size: 2rem;
  text-decoration: none;
}

#page1 {
  margin-bottom: var(--page-gap);
  overflow: hidden;
  padding-bottom: clamp(85px, 6.1275vw + 62.9412px, 110px);
}

#main-quote {
  display: block;
  width: -moz-fit-content;
  width: fit-content;
  max-width: 100vw;
  height: auto;
  margin: 141px auto 0px auto;
  background-size: 100% 33.33%;
}

#blue-woman-container {
  position: relative;
  margin: 80px auto 0px auto;
  width: -moz-fit-content;
  width: fit-content;
}

#blue-woman-oroborus {
  position: absolute;
  width: 155%;
  top: -28%;
  left: -28%;
  animation: spin 20s linear infinite;
}

#blue-woman {
  display: block;
  width: clamp(200px, 24.5098vw + 131.7647px, 320px);
  -webkit-mask-image: linear-gradient(to left, transparent 1vw, black 10vw, black 100%, transparent 100%);
          mask-image: linear-gradient(to left, transparent 1vw, black 10vw, black 100%, transparent 100%);
}

#page3 {
  position: relative;
  margin-bottom: var(--page-gap);
  overflow-x: hidden;
}

#for-love-text-container {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-top: 15px;
}
#for-love-text-container img {
  width: 295px;
}

#lyubov-image-second-page {
  height: clamp(500px, 25vw + 410px, 600px);
  width: auto;
  position: absolute;
  top: 0px;
  left: calc(-195px + 10vw);
  z-index: -1;
  -webkit-mask-image: linear-gradient(to bottom, transparent 70px, black 120px, black calc(100% - 60px), transparent 100%);
          mask-image: linear-gradient(to bottom, transparent 70px, black 120px, black calc(100% - 60px), transparent 100%);
}

#space-woman-background {
  position: absolute;
  top: 30px;
  right: calc(-220px - 28vw);
  width: clamp(500px, 52vw + 310px, 700px);
  rotate: -7deg;
  height: auto;
  -webkit-mask-image: linear-gradient(to top, transparent 195px, black 20px, black calc(100% - 20px), transparent 100%);
          mask-image: linear-gradient(to top, transparent 195px, black 20px, black calc(100% - 20px), transparent 100%);
}

#description-container-second-page {
  position: absolute;
  width: 100vw;
  height: auto;
  top: 20px;
  left: 0px;
}
#description-container-second-page .blue-element:nth-child(1) {
  top: 0px;
  left: calc(-110px + 17vw);
}
#description-container-second-page .blue-element:nth-child(2) {
  top: 0px;
  right: calc(-110px + 17vw);
  transform: scaleX(-1);
}
#description-container-second-page .blue-element:nth-child(3) {
  bottom: -16px;
  left: calc(-110px + 17vw);
  transform: scaleX(1) scaleY(-1);
}
#description-container-second-page .blue-element:nth-child(4) {
  bottom: -16px;
  right: calc(-110px + 17vw);
  transform: scaleX(-1) scaleY(-1);
}

.blue-element {
  position: absolute;
  width: clamp(147px, 40px + 20vw, 165px);
  z-index: 1;
}

#faded-space-background {
  position: absolute;
  bottom: 0px;
  left: 50%;
  transform: translateX(-50%);
  height: 496px;
}

#text-second-page {
  position: absolute;
  top: 100px;
  left: calc(50% + 7.5px);
  transform: translate(-50%);
  min-width: 262px;
  width: 75vw;
  height: 305px;
  overflow-y: scroll;
  overflow-x: hidden;
  color: rgb(255, 255, 255);
  font-family: "Gabriela", sans-serif;
  text-align: center;
  font-size: 0.9375rem;
  z-index: 1;
  padding-right: 15px;
}
#text-second-page::-webkit-scrollbar {
  width: 3px;
}
#text-second-page::-webkit-scrollbar-thumb {
  background-color: rgba(0, 149, 255, 0.68);
  border-radius: 20px;
}
#text-second-page::-webkit-scrollbar-track {
  background-color: rgba(0, 149, 255, 0.3);
  border-radius: 20px;
}

#page2 {
  position: relative;
  height: -moz-fit-content;
  height: fit-content;
  margin-bottom: var(--page-gap);
}
#page2 h2 {
  margin-bottom: 5px;
}

#page2-image-container {
  position: relative;
  width: 100vw;
  height: -moz-fit-content;
  height: fit-content;
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: 1fr;
  place-items: center;
  margin-top: 50px;
}

#page2-hat-button {
  position: absolute;
  top: -1%;
  left: 50.6%;
  transform: translateX(-50%) rotate(9deg);
  width: 9%;
  width: 15%;
  width: 90px;
  width: clamp(54px, 22.2353px + 8.8235vw, 90px);
  z-index: 2;
  cursor: pointer;
}

#golden-frame-image {
  width: 100%;
  grid-column: 1;
  grid-row: 1;
  z-index: 1;
}

#teaching-picture {
  width: 107%;
  grid-column: 1;
  grid-row: 1;
  margin-bottom: 2vw;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}

#frame-text-background-page2 {
  position: absolute;
  -o-object-fit: cover;
     object-fit: cover;
  width: 100%;
  height: calc(100% + 15vw - 52px);
  top: -10.71vw;
  left: 50%;
  transform: translateX(-50%);
  z-index: -1;
  border-bottom: rgb(154, 132, 7) 1px solid;
}

#page2-text-container {
  position: relative;
  width: 100vw;
  height: 360px;
  display: flex;
  justify-content: center;
  padding-bottom: 20px;
}
#page2-text-container p {
  width: 85%;
  height: calc(100% + 8vw - 70px);
  overflow-y: scroll;
  overflow-x: hidden;
  color: rgb(255, 255, 255);
  font-family: "Gabriela", sans-serif;
  text-align: center;
  font-size: 0.9375rem;
  padding-right: 10px;
}
#page2-text-container p::-webkit-scrollbar {
  width: 3px;
}
#page2-text-container p::-webkit-scrollbar-thumb {
  background-color: rgba(255, 204, 0, 0.68);
  border-radius: 20px;
}
#page2-text-container p::-webkit-scrollbar-track {
  background-color: rgba(255, 204, 0, 0.3);
  border-radius: 20px;
}

#page4 {
  position: relative;
  margin-bottom: var(--page-gap);
}

#carousel-container {
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: 1fr;
  position: relative;
  overflow-x: hidden;
  width: 100vw;
  height: clamp(410px, 380px + 8vw, 440px);
  pointer-events: none;
}
#carousel-container * {
  pointer-events: auto;
  -webkit-tap-highlight-color: transparent;
}

#headline-image-workshop {
  width: 100%;
  max-height: 440px;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  grid-column: 1;
  grid-row: 1;
  display: block;
  -webkit-mask-image: linear-gradient(to top, transparent 0px, black 25px, black calc(90% - 8px), transparent 100%);
          mask-image: linear-gradient(to top, transparent 0px, black 25px, black calc(90% - 8px), transparent 100%);
}

#workshop-arrows-and-text-container {
  display: flex;
  flex-direction: row;
  margin-top: auto;
  width: 100%;
  justify-content: space-between;
  grid-column: 1;
  grid-row: 1;
  margin-bottom: 65px;
  justify-content: center;
}

#workshop-duration-text {
  position: absolute;
  top: 30px;
  left: 10px;
  font-size: 1.125rem;
  text-shadow: 1px 4px 7px rgb(0, 0, 0);
  z-index: 0;
}

#workshop-text-container {
  align-self: flex-end;
  display: flex;
  flex-direction: column;
  z-index: 2;
}
#workshop-text-container h3:nth-of-type(1) {
  font-size: 1.75rem;
  text-align: center;
  color: #ffffff;
  -webkit-text-stroke: 0.5px #b48c38;
}
#workshop-text-container h3:nth-of-type(2) {
  font-size: 1.125rem;
  text-align: center;
  color: #a2a2a2;
  -webkit-text-stroke: 0.5px #525252;
}

#arrow-left-page4 {
  padding: 10px;
  margin-left: 7px;
  height: 65px;
  width: auto;
  align-self: flex-end;
  transform: scalex(-1);
  z-index: 2;
}

#arrow-right-page4 {
  padding: 10px;
  margin-right: 7px;
  align-self: flex-end;
  height: 65px;
  width: auto;
  z-index: 2;
}

#carousel-shadow {
  position: absolute;
  bottom: clamp(250px, 235px + 6vw, 280px);
  left: 0px;
  width: 100vw;
  height: 250px;
  background: rgba(0, 0, 0, 0.6);
  -webkit-mask-image: linear-gradient(to top, transparent 0px, black 100px, black 70px, transparent 100%);
          mask-image: linear-gradient(to top, transparent 0px, black 100px, black 70px, transparent 100%);
  z-index: 1;
}

#workshop-info-container {
  display: flex;
  flex-direction: column;
  align-items: center;
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: 1fr;
}
#workshop-info-container .long-highlight-line {
  margin-top: 12px;
  margin-bottom: 14px;
}

#info-first-part-container {
  z-index: 1;
}

#workshop-quote {
  font-size: 1.0625rem;
  width: 300px;
  margin-left: auto;
  margin-right: auto;
}

#workshop-start-date-label {
  color: #a2a2a2;
  font-family: "Gabriela", sans-serif;
  text-align: center;
  font-size: 1.1875rem;
}

#workshop-start-date {
  color: rgb(255, 255, 255);
  font-family: "Gabriela", sans-serif;
  text-align: center;
  font-size: 1.8125rem;
}

#workshop-start-time {
  color: rgb(255, 255, 255);
  font-family: "Gabriela", sans-serif;
  text-align: center;
  font-size: 1.1875rem;
}

#learn-more-text-page4 {
  color: rgb(255, 255, 255);
  font-family: "Gabriela", sans-serif;
  text-align: center;
  font-size: 1.375rem;
  margin-top: 30px;
}

#icon-container-page4 {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 20px;
}
#icon-container-page4 img {
  cursor: pointer;
}
#icon-container-page4 #youtube-icon-page4 {
  width: 75px;
}
#icon-container-page4 #instagram-icon-page4 {
  width: 47px;
  margin: 11px 11px 11px 0px;
}
#icon-container-page4 #facebook-icon-page4 {
  width: 47px;
  margin: 11px 11px 11px 0px;
}

#page5 {
  position: relative;
  overflow-x: hidden;
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: 1fr;
  align-items: baseline;
  overflow-y: hidden;
  margin-bottom: var(--page-gap);
}

#page5-title-container {
  position: absolute;
  top: clamp(40px, 4.7059px + 9.80392vw, 80px);
  left: 50%;
  transform: translateX(-50%);
  width: 100vw;
}
#page5-title-container h2 {
  margin-bottom: 5px;
}

#testimonials-background-container {
  width: 100vw;
  position: relative;
  z-index: -1;
  border-radius: 50px;
  border-bottom-right-radius: 53px;
  border-bottom-left-radius: 53px;
  corner-shape: bevel;
  overflow: hidden;
  margin-top: 113px;
}

#testimonials-container {
  display: flex;
  flex-direction: column;
  position: absolute;
  top: 175px;
  left: 50%;
  transform: translateX(-50%);
  width: 100%;
}

#testimonials-avatar-container {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
}
#testimonials-avatar-container .long-highlight-line {
  width: 238px;
  height: 3px;
}

#testimonials-avatar-image-container {
  position: relative;
}

#testimonials-avatar-image-oroborus {
  position: absolute;
  width: 242px;
  top: -24px;
  left: -26px;
  animation: spin 10s linear infinite;
}

#testimonials-avatar-image {
  width: 190px;
  display: block;
}

#testimonials-image-arrows-container {
  position: relative;
  width: 100%;
  display: flex;
  justify-content: center;
}

#testimonials-arrows-container {
  width: 360px;
  display: flex;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

#arrow-left-page5 {
  transform: scaleX(-1);
  margin-right: auto;
  display: block;
  padding: 10px;
  padding-right: 4px;
  height: 75px;
  width: auto;
  z-index: 2;
}

#arrow-right-page5 {
  margin-left: auto;
  display: block;
  padding: 10px;
  padding-right: 4px;
  height: 75px;
  width: auto;
  z-index: 2;
}

#testimonials-background {
  width: clamp(1440px, 211.765vw + 677.65px, 2304px);
  height: 800px;
  -o-object-fit: cover;
     object-fit: cover;
  padding-top: 1px;
}

#testimonials-border-left {
  position: absolute;
  top: 0px;
  left: 0px;
  transform: scale(-1, 1);
  height: 800px;
}

#testimonials-border-right {
  position: absolute;
  top: 0px;
  right: 0px;
  height: 800px;
}

#testimonials-image-container {
  position: relative;
  z-index: 1;
  margin-top: 76px;
  width: 100vw;
  height: -moz-fit-content;
  height: fit-content;
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: 1fr;
  place-items: center;
  grid-column: 1;
  grid-row: 1;
  z-index: 2;
}

.picture-frame-page5 {
  width: 100vw;
  max-width: 400px;
  grid-column: 1;
  grid-row: 1;
}

.testimonials-images {
  grid-column: 1;
  grid-row: 1;
  width: 74vw;
  max-width: 299px;
  height: auto;
  padding-bottom: 7px;
  z-index: -1;
}

#testimonials-text-container {
  margin-top: 20px;
}

#testimonials-text-background {
  width: 100vw;
  max-width: 1000px;
  margin-left: auto;
  margin-right: auto;
  height: 500px;
  -o-object-fit: cover;
     object-fit: cover;
  z-index: -1;
  border-bottom: rgb(56, 48, 4) 1px solid;
  grid-column: 1;
  grid-row: 1;
}

#testimonials-names {
  background: linear-gradient(180deg, #ce9728 0%, #865b11 15%, #e7b846 30%, #ffec7a 40%, #e7b846 55%, #ce9728 70%, #ffe173 85%, #f2b93a 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  font-family: var(--main-font);
  text-align: center;
  font-size: 2.75rem;
  font-weight: 100;
  text-align: center;
  margin-bottom: 5px;
  margin-top: 10px;
  grid-column: 1;
  grid-row: 1;
}

#testimonials-names::before {
  content: "";
  z-index: -1;
  position: absolute;
  top: 120px;
  left: 50%;
  transform: translateX(-50%);
  width: 300px;
  height: 250px;
  background: radial-gradient(circle, rgb(4, 0, 48) -50%, rgba(4, 0, 48, 0) 70%);
}

#testimonials-selectors {
  margin-top: 10px;
}

#testimonials-text {
  min-width: 230px;
  width: 70vw;
  height: 330px;
  padding-right: 5px;
  overflow-y: scroll;
  overflow-x: hidden;
  margin: 0 auto 0 auto;
  color: rgb(255, 255, 255);
  font-family: "Gabriela", sans-serif;
  text-align: center;
  font-size: 0.9375rem;
  z-index: 3;
  text-shadow: 0 0 7px black;
}
#testimonials-text::-webkit-scrollbar {
  width: 3px;
}
#testimonials-text::-webkit-scrollbar-thumb {
  background-color: rgba(255, 204, 0, 0.68);
  border-radius: 20px;
}
#testimonials-text::-webkit-scrollbar-track {
  background-color: rgba(255, 204, 0, 0.3);
  border-radius: 20px;
}

#page6 {
  position: relative;
  overflow-x: hidden;
}

#page6-container {
  display: flex;
  position: relative;
  width: 100vw;
  height: 550px;
  overflow-x: hidden;
  flex-direction: column;
  align-items: center;
}

#background-photo-page6 {
  position: absolute;
  top: 0px;
  left: 50%;
  transform: translateX(calc(-50% + 20px));
  width: 960px;
  -webkit-mask-image: linear-gradient(to bottom, transparent 0px, black 100px, black 97%, transparent 100%);
          mask-image: linear-gradient(to bottom, transparent 0px, black 100px, black 97%, transparent 100%);
}

#page6-title {
  position: relative;
  font-size: 2.25rem;
  color: rgb(255, 255, 255);
  font-family: "Gabriela", sans-serif;
  font-weight: 500;
  height: -moz-fit-content;
  height: fit-content;
  text-align: center;
  margin-top: 50px;
  z-index: 1;
  text-shadow: 0px 4px 10px rgba(0, 0, 0, 0.65);
}

.contact-button {
  position: relative;
}

.contact-button-background {
  width: 180px;
  height: auto;
  position: relative;
  z-index: 0;
}

.button-oroborus-decoration {
  position: absolute;
  width: 104%;
  z-index: 1;
  top: -3px;
  left: -3px;
  animation: spin 10s linear infinite;
}

@keyframes spin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}
footer {
  display: flex;
  flex-direction: column;
  align-items: center;
  position: relative;
  z-index: 0;
}
footer .long-highlight-line {
  height: 1px;
}
footer address {
  font-size: 1.125rem;
  color: rgb(255, 255, 255);
  font-family: "Gabriela", sans-serif;
  font-style: normal;
  font-weight: 500;
  margin-top: 5px;
}

#footer-logo-container {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-top: 52px;
}
#footer-logo-container p:nth-of-type(1) {
  font-size: 1rem;
  color: rgb(255, 255, 255);
  font-family: "Gabriela", sans-serif;
  font-style: normal;
  font-weight: 500;
  text-align: center;
  margin-bottom: 10px;
}
#footer-logo-container p:nth-of-type(2) {
  font-size: 1rem;
  color: rgb(189, 189, 189);
  font-family: "Gabriela", sans-serif;
  font-style: normal;
  font-weight: 500;
  text-align: center;
  margin-top: 5px;
}

#footer-contacts-container {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-top: 50px;
}
#footer-contacts-container h3 {
  font-size: 1.375rem;
  color: rgb(255, 255, 255);
  font-family: "Gabriela", sans-serif;
  font-style: normal;
  font-weight: 500;
  text-align: center;
}

#footer-icon-container {
  display: flex;
  flex-direction: row;
  align-items: center;
  margin-top: 10px;
}
#footer-icon-container img {
  cursor: pointer;
}
#footer-icon-container img:nth-of-type(3) {
  width: 32px;
}
#footer-icon-container img:nth-of-type(4) {
  width: 41px;
}

#facebook-icon-footer {
  width: 40px;
  margin-right: 17px;
}

#instagram-icon-footer {
  width: 40px;
  margin-right: 7px;
}

#youtube-icon-footer {
  width: 65px;
}

#footer-hyperlinks-container {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  margin-top: 55px;
  margin-bottom: 55px;
  width: 300px;
  gap: 10px;
}
#footer-hyperlinks-container li a {
  font-size: 1.25rem;
  color: rgb(139, 131, 211);
  font-family: "Gabriela", sans-serif;
}

#logo-background-ball {
  position: absolute;
  top: calc(50% + 10px);
  left: 50%;
  width: 300px;
  height: 188px;
  transform: translateX(-50%) translatey(-50%) rotateY(180deg);
  z-index: -1;
}

#colored-logo-footer {
  width: 260px;
}

#footer-logo-component {
  position: absolute;
  top: -20px;
  left: 50%;
  transform: translateX(-50%);
  z-index: -1;
}

#company-info-footer {
  font-size: 0.875rem;
  color: rgb(189, 189, 189);
  font-family: "Gabriela", sans-serif;
  font-style: normal;
  font-weight: 500;
  text-align: center;
}

/* Hamburger Menu Animation --> */
#hamburger-menu::before,
#hamburger-menu::after,
#hamburger-menu input {
  content: "";
  display: block;
  height: 3px;
  background: linear-gradient(180deg, #ce9728 0%, #865b11 15%, #e7b846 30%, #ffec7a 40%, #e7b846 55%, #ce9728 70%, #ffe173 85%, #f2b93a 100%);
  border-radius: 10px;
  box-shadow: 0px 0px 6px rgb(58, 49, 0);
  transform-origin: left center;
  transition: opacity 200ms ease-in-out, width 170ms ease-in-out, rotate 250ms ease-in-out, translate 250ms ease-in-out;
  width: 45px;
}

#hamburger-menu input {
  width: 40px;
}

#hamburger-menu::after {
  width: clamp(35px, 8vw - 16px, 39px);
}

#hamburger-menu {
  position: absolute;
  top: 0px;
  right: 0px;
  z-index: 2;
  display: flex;
  flex-direction: column;
  width: -moz-max-content;
  width: max-content;
  gap: 7px;
  margin: 0px 6px 0px auto;
  padding: 13px;
  transform: scaleX(-1);
  -webkit-tap-highlight-color: transparent;
  cursor: pointer;
}

#hamburger-menu input {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  pointer-events: none;
}

#hamburger-menu:has(input:checked)::before {
  rotate: 45deg;
  width: 35px;
  translate: 7px -2px;
}

#hamburger-menu:has(input:checked)::after {
  rotate: -45deg;
  width: 35px;
  translate: 7px 3px;
}

#hamburger-menu input:checked {
  opacity: 0;
  width: 0px;
}

/* Hamburger Menu Animation  <----*/
@media (min-width: 768px) {
  .tablet-version {
    display: revert !important;
  }
  .mobile-version {
    display: none !important;
  }
  :root {
    --page-gap: clamp(200px, calc(-25px + 29.297vw), 350px);
  }
  #hamburger-menu::before {
    width: 52px;
    height: 4px;
  }
  #hamburger-menu input {
    width: 47px;
    height: 4px;
  }
  #hamburger-menu::after {
    width: 40px;
    height: 4px;
  }
  #hamburger-menu {
    gap: 8px;
    margin-top: 8px;
  }
  #hamburger-menu:has(input:checked)::before {
    width: 40px;
    translate: 7px -1px;
  }
  #hamburger-menu:has(input:checked)::after {
    width: 40px;
    translate: 7px 3px;
  }
  #background-container {
    background-size: 250%;
  }
  #logo {
    width: 280px;
    margin: 10px 0 0px 0px;
  }
  #nav-cosmic-background {
    height: 140px;
  }
  .big-text {
    font-size: 2.5rem;
  }
  #page1 {
    padding-bottom: clamp(130px, 3.90625vw + 100px, 150px);
  }
  #blue-woman {
    width: clamp(380px, 9.765625vw + 305px, 430px);
  }
  #blue-woman-container {
    margin: 140px auto 0px auto;
  }
  .long-highlight-line {
    height: 2px;
    width: 370px;
  }
  #lyubov-image-second-page {
    height: clamp(600px, 40vw + 290px, 800px);
    left: calc(-195px + 11vw);
    z-index: 0;
    -webkit-mask-image: linear-gradient(to bottom, transparent 80px, black 150px, black calc(100% - 60px), transparent 100%);
            mask-image: linear-gradient(to bottom, transparent 80px, black 150px, black calc(100% - 60px), transparent 100%);
  }
  #space-woman-background {
    top: 50px;
    right: calc(-520px + 25vw);
    width: clamp(700px, 44vw + 310px, 870px);
    z-index: 1;
    rotate: 0deg;
    -webkit-mask-image: linear-gradient(to top, transparent clamp(0px, 300px - 35vw, 40px), black clamp(20px, 510px - 55vw, 100px), black calc(100% - 20px), transparent 100%);
            mask-image: linear-gradient(to top, transparent clamp(0px, 300px - 35vw, 40px), black clamp(20px, 510px - 55vw, 100px), black calc(100% - 20px), transparent 100%);
  }
  #faded-space-background {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    height: 550px;
    width: 100vw;
  }
  #description-container-second-page {
    position: absolute;
    width: 100vw;
    top: 20px;
    left: 0px;
    z-index: -1;
  }
  #description-container-second-page .blue-element:nth-child(1) {
    top: 0px;
    left: calc(-330px + 40vw);
  }
  #description-container-second-page .blue-element:nth-child(2) {
    top: 0px;
    right: calc(-330px + 40vw);
    transform: scaleX(-1);
  }
  #description-container-second-page .blue-element:nth-child(3) {
    bottom: -16px;
    left: calc(-370px + 40vw);
    width: 250px;
    transform: scaleX(1) scaleY(-1);
  }
  #description-container-second-page .blue-element:nth-child(4) {
    bottom: -16px;
    right: calc(-370px + 40vw);
    width: 250px;
    transform: scaleX(-1) scaleY(-1);
  }
  #text-second-page {
    width: 600px;
    height: 305px;
    padding-right: 0px;
    top: 75px;
    overflow-y: visible;
    overflow-x: visible;
    font-size: 1.0625rem;
  }
  #text-second-page::-webkit-scrollbar {
    scrollbar-width: none;
    display: none;
  }
  #page2-text-container {
    position: relative;
    width: 100vw;
    height: 360px;
    display: flex;
    justify-content: center;
    padding-bottom: 20px;
  }
  #page2-text-container p {
    width: 85%;
    height: calc(100% + 8vw - 70px);
    overflow-y: scroll;
    overflow-x: hidden;
    color: rgb(255, 255, 255);
    font-family: "Gabriela", sans-serif;
    text-align: center;
    font-size: 1.0625rem;
    padding-right: 10px;
  }
  #page2-text-container p::-webkit-scrollbar {
    scrollbar-width: none;
    display: none;
  }
  #carousel-container {
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: 1fr;
    position: relative;
    overflow-x: hidden;
    width: 100vw;
    height: clamp(440px, 57vw, 700px);
  }
  #page2-hat-button {
    position: absolute;
    top: 3.7%;
    left: 50.6%;
    transform: translateX(-50%) rotate(9deg);
    width: 9%;
  }
  #headline-image-workshop {
    width: 100%;
    height: 100%;
    max-height: clamp(440px, 57vw, 700px);
  }
  #arrow-left-page4 {
    padding: 10px;
    height: clamp(70px, 40px + 4vw, 90px);
  }
  #arrow-right-page4 {
    padding: 10px;
    height: clamp(70px, 40px + 4vw, 90px);
  }
  #info-first-part-container {
    margin: 42px auto auto 0;
    grid-column: 2;
    grid-row: span 2;
  }
  #info-first-part-container .long-highlight-line {
    width: 292px;
  }
  #workshop-quote {
    z-index: 4;
    font-size: 1.25rem;
  }
  #workshop-start-date-label {
    font-size: 1.375rem;
  }
  #workshop-start-date {
    font-size: 2.25rem;
  }
  #workshop-start-time {
    font-size: 1.375rem;
  }
  #learn-more-text-page4 {
    font-size: 1.625rem;
    margin: 40px 0 20px 40px;
    grid-column: 1;
    grid-row: 1;
    z-index: 1;
  }
  #carousel-shadow {
    top: calc(45vw - 130px);
    left: 0px;
    width: 100vw;
    height: 350px;
  }
  #workshop-info-container {
    display: grid;
    grid-template-columns: 1.5fr 1fr;
    grid-template-rows: 1fr;
    justify-items: center;
    height: -moz-fit-content;
    height: fit-content;
  }
  #icon-container-page4 {
    flex-direction: column;
    gap: 0px;
    z-index: 1;
    align-self: flex-start;
    align-items: flex-start;
    margin-left: 40px;
    grid-column: 1;
    grid-row: 2;
  }
  #icon-container-page4 a {
    font-size: 1.5625rem;
    padding-left: 10px;
  }
  #icon-container-page4 a:link,
  #icon-container-page4 a:visited,
  #icon-container-page4 a:hover,
  #icon-container-page4 a:active {
    color: white;
    text-decoration: none;
  }
  #icon-container-page4 .long-highlight-line {
    margin: 5px 0 20px 0;
  }
  #icon-container-page4 .icon-links-container {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    margin: auto 0 auto 0;
  }
  #icon-container-page4 #instagram-icon-page4 {
    margin: 12px 12px 12px 12px;
  }
  #icon-container-page4 #facebook-icon-page4 {
    margin: 12px 12px 12px 12px;
  }
  #workshop-duration-text {
    top: 40px;
    left: 25px;
    font-size: 1.4375rem;
    z-index: 0;
  }
  #workshop-text-container h3:nth-of-type(1) {
    font-size: 2.375rem;
    text-align: center;
    color: #ffffff;
    -webkit-text-stroke: 2px #b48c38;
    paint-order: stroke fill;
    font-weight: 300;
  }
  #workshop-text-container h3:nth-of-type(2) {
    font-size: 1.5rem;
    text-align: center;
    color: #a2a2a2;
    -webkit-text-stroke: 1px #525252;
    paint-order: stroke fill;
    font-weight: 300;
  }
  #workshop-text-container .highlight-line {
    width: 292px;
  }
  #page5 {
    height: 850px;
    overflow-y: hidden;
  }
  #page5-title-container {
    top: 0px;
  }
  #background-glowing-border-upper {
    position: absolute;
    top: calc(3.75px - 10.6445312498vw);
    left: 50.7%;
    transform: translateX(-50%);
    width: 106vw;
    display: block;
    z-index: 2;
  }
  #background-glowing-border-lower {
    position: absolute;
    bottom: calc(4.75px - 10.6445312498vw);
    left: 50.7%;
    transform: translateX(-50%) scaleY(-1);
    width: 106vw;
    display: block;
    z-index: 2;
  }
  #background-side-border-left {
    position: absolute;
    bottom: 0px;
    left: 0px;
    height: 645px;
  }
  #background-side-border-right {
    position: absolute;
    bottom: 0px;
    right: 0px;
    height: 645px;
    transform: scale(-1, 1);
  }
  #testimonials-background-container {
    overflow: visible;
  }
  #testimonials-text {
    font-size: 1.0625rem;
    height: 220px;
  }
  #testimonials-background {
    height: 640px;
  }
  #page6 {
    overflow-y: hidden;
  }
  #page6-container {
    overflow-y: hidden;
    overflow-x: hidden;
    align-items: flex-start;
    height: 650px;
    align-items: center;
  }
  .button-oroborus-decoration {
    position: absolute;
    z-index: 1;
  }
  .contact-button-container {
    position: relative;
    width: -moz-fit-content;
    width: fit-content;
  }
  .contact-button {
    padding: 16px 20px 16px 20px;
    width: 728px;
    margin-top: 50px;
    display: flex;
    flex-direction: row;
    align-items: center;
  }
  .contact-button p {
    font-size: 1.625rem;
    color: rgb(255, 255, 255);
    font-family: "Philosopher", sans-serif;
    margin-bottom: 20px;
    margin-left: 20px;
    z-index: 1;
    text-shadow: 0px 4px 10px rgba(0, 0, 0, 0.65);
    opacity: 0;
    transition: opacity 300ms ease-in-out;
  }
  .contact-button p.activated {
    opacity: 1;
    transition: opacity 300ms ease-in-out;
  }
  .contact-button span {
    font-weight: 600;
  }
  .button-tablet-fade-background {
    position: absolute;
    top: 0px;
    left: 0px;
    opacity: 0;
    transition: opacity 300ms ease-in-out;
  }
  .button-tablet-fade-background.activated {
    opacity: 1;
    transition: opacity 300ms ease-in-out;
  }
  #background-photo-page6 {
    left: 50%;
    transform: translateX(-50%);
    width: 100vw;
    height: 100vw;
    max-height: 760px;
    -o-object-fit: cover;
       object-fit: cover;
    -webkit-mask-image: linear-gradient(to bottom, transparent 0px, black 100px, black 91%, transparent 98%);
            mask-image: linear-gradient(to bottom, transparent 0px, black 100px, black 91%, transparent 98%);
  }
  #page6-title {
    font-size: 2.5rem;
  }
  footer {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 1fr 1fr;
    margin-bottom: 40px;
    position: relative;
    z-index: 0;
  }
  footer address {
    font-size: 1.25rem;
    color: rgb(255, 255, 255);
    font-family: "Gabriela", sans-serif;
    font-style: normal;
    font-weight: 500;
    margin-top: 5px;
  }
  #footer-logo-container {
    margin-top: 15px;
    grid-row: 1;
    grid-column: span 2;
  }
  #footer-logo-container p:nth-of-type(1) {
    font-size: 1.1875rem;
    margin-bottom: 0px;
  }
  #footer-logo-container p:nth-of-type(2) {
    font-size: 1.0625rem;
    margin-top: 6px;
  }
  #footer-hyperlinks-container {
    grid-row: 2/3;
    grid-column: 1/2;
    margin-top: 0px;
    margin-bottom: 0px;
    width: 330px;
    margin-top: 24px;
    gap: 15px;
    justify-self: center;
  }
  #footer-hyperlinks-container li a {
    font-size: 1.25rem;
  }
  #footer-contacts-container {
    grid-row: 2/3;
    grid-column: 2/3;
    align-self: flex-end;
    justify-self: center;
    margin-top: 40px;
  }
  #footer-contacts-container h3 {
    font-size: 1.5625rem;
  }
  #footer-icon-container {
    margin-top: 15px;
  }
  #footer-icon-container img {
    cursor: pointer;
  }
  #footer-icon-container img:nth-of-type(3) {
    width: 39px;
  }
  #footer-icon-container img:nth-of-type(4) {
    width: 50px;
  }
  #facebook-icon-footer {
    margin-right: 20px;
  }
  #instagram-icon-footer {
    margin-right: 10px;
  }
  #logo-background-ball {
    width: 400px;
    height: 250px;
    top: calc(50% + 30px);
  }
  #colored-logo-footer {
    width: 310px;
  }
}
@media (min-width: 1280px) {
  .big-text {
    font-size: 3.5rem;
  }
  #background-container {
    background-size: 150%;
  }
  :root {
    --page-gap: clamp(350px, calc(200px + 11.71875vw), 500px);
  }
  nav {
    transition: top 400ms ease-in-out;
  }
  .navbar-hide {
    top: -160px;
    transition: top 500ms ease-in-out;
  }
  .desktop-version {
    display: revert !important;
  }
  .not-desktop-version {
    display: none !important;
  }
  #nav-cosmic-background {
    height: 160px;
  }
  #logo {
    width: 310px;
    height: auto;
    margin: 14px 0px 0px 10px;
  }
  #desktop-nav-links {
    display: flex !important;
    flex-direction: row;
    margin-left: auto;
    margin-right: 20px;
    margin-bottom: 20px;
    gap: 30px;
    z-index: 1;
    align-self: center;
  }
  #desktop-nav-links li {
    cursor: pointer;
  }
  #desktop-nav-links li a {
    font-size: 2rem;
    text-decoration: none;
  }
  #dragon-icon {
    width: 86px;
    height: 62px;
    align-self: center;
    margin-right: 25px;
    margin-bottom: 15px;
    z-index: 1;
  }
  #page1 {
    display: flex;
    align-items: center;
    gap: 3vw;
    padding-top: clamp(250px, 15.625vw + 50px, 450px);
    max-width: 2450px;
    margin-left: auto;
    margin-right: auto;
  }
  #main-quote {
    margin: 0 auto 70px auto;
    font-size: clamp(3rem, 0.25rem + 3.4375vw, 5.75rem);
    white-space: nowrap;
  }
  #blue-woman {
    width: clamp(430px, 21.09375vw + 160px, 700px);
    margin: 10px 0px 0px 0px;
  }
  #blue-woman-container {
    margin: 0px 10% 0 0;
  }
  #page2-image-container {
    width: 90vw;
    margin: 0 auto 0 auto;
    padding-left: 1.5vw;
    padding-right: 1.5vw;
    overflow-x: hidden;
  }
  #golden-frame-image {
    width: 100%;
    pointer-events: none;
  }
  #teaching-picture {
    width: 107%;
    margin-bottom: 1.7vw;
    pointer-events: none;
  }
  #page2-sliding-text-container {
    display: flex;
    justify-content: center;
    margin-right: auto;
    grid-column: 1;
    grid-row: 1;
    height: -moz-fit-content;
    height: fit-content;
    width: -moz-fit-content;
    width: fit-content;
  }
  #page2-sliding-arrow {
    position: absolute;
    width: clamp(65px, 2.734375vw + 30px, 100px);
    height: auto;
    bottom: clamp(127px, 11.015625vw - 14px, 268px);
    left: clamp(-5px, 0.390625vw - 10px, 0px);
    padding: 15px;
    transition: transform 500ms ease-in-out, margin 500ms ease-in-out;
  }
  #page2-sliding-arrow.slide {
    transform: rotate(180deg);
    transition: transform 500ms ease-in-out, margin 500ms ease-in-out;
    margin-left: clamp(20px, 1.5625vw, 40px);
  }
  #page2-sliding-background-text-container.slide {
    width: 0px;
    transition: width 500ms ease-in-out;
  }
  #sliding-text.slide {
    opacity: 0;
    transition: opacity 500ms ease-in-out;
  }
  #sliding-text-title.slide {
    opacity: 0;
    transition: opacity 500ms ease-in-out;
  }
  #page2-sliding-background-text-container {
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: minmax(0, 1fr);
    margin-left: -1px;
    margin-top: 1%;
    width: clamp(400px, 27.34375vw + 50px, 750px);
    height: clamp(490px, 39.84375vw - 20px, 1000px);
    transition: width 500ms ease-in-out;
  }
  #page2-sliding-background-text-container > img:nth-of-type(1) {
    height: 100%;
    width: 100%;
    transition: width 500ms ease-in-out;
    grid-column: 1;
    grid-row: 1;
  }
  #sliding-text {
    grid-column: 1;
    grid-row: 1;
    width: 80%;
    height: 72%;
    z-index: 1;
    align-self: center;
    margin-top: clamp(12%, -0.234375vw + 18%, 15%);
    margin-left: 2%;
    color: rgb(255, 255, 255);
    font-family: "Gabriela", sans-serif;
    text-align: center;
    font-size: clamp(1rem, 0.625vw + 0.5rem, 1.5rem);
    text-align: center;
    overflow-y: scroll;
    overflow-x: hidden;
    opacity: 1;
    transition: opacity 500ms ease-in-out;
  }
  #sliding-text::-webkit-scrollbar {
    width: 3px;
  }
  #sliding-text::-webkit-scrollbar-thumb {
    background-color: rgba(255, 204, 0, 0.68);
    border-radius: 20px;
  }
  #sliding-text::-webkit-scrollbar-track {
    background-color: rgba(255, 204, 0, 0.3);
    border-radius: 20px;
  }
  #sliding-text-title {
    grid-column: 1;
    grid-row: 1;
    width: 70%;
    height: -moz-fit-content;
    height: fit-content;
    margin-top: clamp(6%, 0.15625vw + 4%, 8%);
    margin-left: 6%;
    background: linear-gradient(180deg, #ce9728 0%, #865b11 15%, #e7b846 30%, #ffec7a 40%, #e7b846 55%, #ce9728 70%, #ffe173 85%, #f2b93a 100%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    font-family: var(--main-font);
    text-align: center;
    font-size: clamp(1.75rem, 1.5625vw + 0.5rem, 3rem);
    font-weight: 500;
    opacity: 1;
    transition: opacity 500ms ease-in-out;
  }
  #sliding-background-container {
    position: relative;
    display: flex;
    height: clamp(500px, 40.625vw - 20px, 1020px);
    width: -moz-fit-content;
    width: fit-content;
  }
  #sliding-background-container > img:nth-of-type(1) {
    margin-left: -1px;
    margin-bottom: auto;
    margin-top: auto;
    height: 100%;
  }
  #page2-sliding-background-last-piece-container {
    position: relative;
    display: flex;
  }
  #page2-sliding-background-last-piece-container img:nth-child(1) {
    height: 575px;
    margin-top: auto;
    margin-left: -1px;
    margin-bottom: 35.5%;
    height: 57.5%;
  }
  #page3 {
    overflow: hidden;
  }
  #page3-container {
    height: -moz-fit-content;
    height: fit-content;
    margin-bottom: 200px;
    margin-top: 75px;
    position: relative;
    z-index: 0;
  }
  #lyubov-image-second-page {
    position: relative;
    height: clamp(600px, 43vw + 50px, 1150px);
    left: clamp(-150px, -299px + 11.7vw, 0px);
    -webkit-mask-image: linear-gradient(to bottom, transparent 120px, black 200px, black calc(100% - 120px), transparent 98%);
            mask-image: linear-gradient(to bottom, transparent 120px, black 200px, black calc(100% - 120px), transparent 98%);
  }
  #space-woman-background {
    bottom: 0px;
    top: unset;
    right: 100px;
    height: clamp(530px, 42vw, 1075px);
    width: auto;
    -webkit-mask-image: linear-gradient(to left, transparent 0px, black 3vw, black 100%, transparent 100%), linear-gradient(to top, transparent clamp(0px, 300px - 35vw, 40px), black clamp(20px, 510px - 55vw, 100px), black calc(100% - 60px), transparent 100%);
            mask-image: linear-gradient(to left, transparent 0px, black 3vw, black 100%, transparent 100%), linear-gradient(to top, transparent clamp(0px, 300px - 35vw, 40px), black clamp(20px, 510px - 55vw, 100px), black calc(100% - 60px), transparent 100%);
    -webkit-mask-composite: destination-in;
    mask-composite: intersect;
    mask-repeat: no-repeat;
    -webkit-mask-repeat: no-repeat;
  }
  #text-second-page-desktop-version-container {
    position: absolute;
    display: flex;
    flex-direction: column;
    gap: 10px;
    top: 50%;
    transform: translateY(-50%);
    right: clamp(25px, 7.8125vw - 75px, 125px);
    z-index: 3;
    align-items: center;
  }
  #text-second-page-desktop-version-container img {
    width: clamp(330px, 17.578125vw + 105px, 555px);
  }
  #text-second-page-desktop-version-container img:nth-of-type(2) {
    rotate: 180deg;
  }
  #text-second-page-desktop-version {
    width: clamp(325px, 17.578125vw + 100px, 550px);
    height: clamp(375px, 17.578125vw + 150px, 600px);
    overflow-y: scroll;
    overflow-x: hidden;
    color: rgb(255, 255, 255);
    font-family: "Gabriela", sans-serif;
    text-align: center;
    font-size: 1.5rem;
    font-size: clamp(1.0625rem, 0.546875vw + 0.625rem, 1.5rem);
    padding-right: 10px;
  }
  #text-second-page-desktop-version::-webkit-scrollbar {
    width: 3px;
  }
  #text-second-page-desktop-version::-webkit-scrollbar-thumb {
    background-color: rgba(166, 145, 48, 0.68);
    border-radius: 20px;
  }
  #text-second-page-desktop-version::-webkit-scrollbar-track {
    background-color: rgba(204, 163, 0, 0.3);
    border-radius: 20px;
  }
  #for-love-text-container-desktop {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: -moz-fit-content;
    width: fit-content;
    margin-bottom: 10px;
  }
  #for-love-text-container-desktop h2 {
    font-size: 3rem;
  }
  #for-love-text-container-desktop img {
    width: 295px;
  }
  #blue-element-desktop-crown {
    position: absolute;
    right: clamp(380px, 27.34375vw + 30px, 730px);
    top: clamp(-260px, -10.9375vw + 20px, -120px);
    width: clamp(340px, 20.3125vw + 80px, 600px);
    height: auto;
    z-index: 2;
    rotate: 42deg;
  }
  #blue-element-desktop-small {
    position: absolute;
    bottom: clamp(-110px, -2.34375vw - 50px, -80px);
    right: clamp(10px, 11.71875vw - 140px, 150px);
    width: clamp(260px, 13.28125vw + 90px, 430px);
    height: auto;
    z-index: 2;
    rotate: -6deg;
  }
  #blue-element-desktop-big {
    position: absolute;
    right: clamp(160px, 20.3125vw - 100px, 420px);
    bottom: clamp(-350px, -14.0625vw + 10px, -170px);
    width: clamp(450px, 23.4375vw + 150px, 750px);
    height: auto;
    z-index: 2;
    rotate: 180deg;
  }
  #carousel-container {
    width: 100vw;
    height: clamp(700px, 31.25vw + 300px, 1100px);
  }
  #headline-image-workshop {
    width: 100%;
    height: 100%;
    max-height: clamp(700px, 31.25vw + 300px, 1100px);
    pointer-events: none;
    -webkit-mask-image: linear-gradient(to top, transparent 0px, black 100px, black 87%, transparent 98%);
            mask-image: linear-gradient(to top, transparent 0px, black 100px, black 87%, transparent 98%);
  }
  #page4-desktop-container {
    grid-column: 1;
    grid-row: 1;
    z-index: 1;
    pointer-events: none;
    height: 100%;
    width: 100%;
  }
  #page4-desktop-information-container {
    display: flex;
    width: -moz-fit-content;
    width: fit-content;
    flex-direction: column;
    position: absolute;
    bottom: 5%;
    left: 3%;
  }
  #desktop-workshop-start-date-label {
    color: #a2a2a2;
    font-family: "Gabriela", sans-serif;
    text-align: center;
    font-size: clamp(1.1875rem, 0.859vw + 0.5rem, 1.875rem);
  }
  #desktop-workshop-start-date {
    color: rgb(255, 255, 255);
    font-family: "Gabriela", sans-serif;
    text-align: center;
    font-size: clamp(1.8125rem, 0.732vw + 1.226rem, 2.75rem);
  }
  #desktop-workshop-start-time {
    color: rgb(255, 255, 255);
    font-family: "Gabriela", sans-serif;
    text-align: center;
    font-size: clamp(1.1875rem, 0.859375vw + 0.5rem, 1.875rem);
  }
  #desktop-workshop-quote {
    font-size: clamp(1.375rem, 0.78125vw + 0.75rem, 2rem);
    width: clamp(400px, 15.625vw + 200px, 600px);
    position: absolute;
    bottom: 5%;
    right: 3%;
    text-align: right;
    text-shadow: 1px 4px 7px rgb(0, 0, 0);
  }
  #page4-desktop-social-media-container {
    position: absolute;
    right: 1.5%;
  }
  #page4-desktop-social-media-container p {
    color: rgb(255, 255, 255);
    font-family: "Gabriela", sans-serif;
    text-align: center;
    font-size: clamp(1.5rem, 0.9375vw + 0.75rem, 2.25rem);
    text-shadow: 1px 4px 7px rgb(0, 0, 0);
    margin-top: 2.5vw;
    margin-right: 45px;
  }
  #page4-desktop-social-media-arrow {
    width: clamp(120px, 3.125vw + 80px, 160px);
    height: clamp(70px, 2.03125vw + 44px, 96px);
    margin-left: 60px;
    margin-top: 10px;
  }
  #page4-desktop-social-media-arrow-and-icons-container {
    display: flex;
  }
  #page4-desktop-icon-container {
    display: flex;
    flex-direction: column;
    width: -moz-fit-content;
    width: fit-content;
    align-items: center;
    margin-top: clamp(0px, 3.90625vw - 50px, 50px);
    margin-left: auto;
  }
  #page4-desktop-icon-container #facebook-desktop-icon-page4 {
    width: clamp(41px, 2.34375vw + 11px, 71px);
    margin: clamp(10px, 0.390625vw + 5px, 15px);
    margin-top: 40px;
  }
  #page4-desktop-icon-container #instagram-desktop-icon-page4 {
    width: clamp(41px, 2.34375vw + 11px, 71px);
    margin: clamp(10px, 0.390625vw + 5px, 15px);
  }
  #page4-desktop-icon-container #youtube-desktop-icon-page4 {
    width: clamp(70px, 3.125vw + 30px, 110px);
  }
  #workshop-duration-text {
    top: 3vw;
    left: 2%;
    font-size: clamp(1.4375rem, 1.015625vw + 0.625rem, 2.25rem);
  }
  #workshop-arrows-and-text-container {
    margin-top: unset;
    margin-bottom: unset;
    align-self: center;
    transform: translateY(25%);
  }
  #workshop-text-container {
    margin-top: clamp(140px, 6.25vw + 60px, 220px);
  }
  #workshop-text-container h3:nth-of-type(1) {
    font-size: clamp(2.25rem, 2.1875vw + 0.5rem, 4rem);
    text-align: center;
    color: #ffffff;
    -webkit-text-stroke: clamp(1.5px, 0.11719vw + 0px, 3px) #b48c38;
  }
  #workshop-text-container h3:nth-of-type(2) {
    font-size: clamp(1.5rem, 1.25vw + 0.5rem, 2.5rem);
    text-align: center;
    color: #a2a2a2;
    -webkit-text-stroke: clamp(1.5px, 0.11719vw + 0px, 3px) #525252;
  }
  #workshop-text-container .highlight-line {
    width: clamp(292px, 15.07813vw + 99px, 485px);
    height: clamp(2px, 0.15625vw + 0px, 4px);
  }
  #arrow-left-page4 {
    padding: clamp(10px, 0.78125vw + 0px, 20px);
    height: clamp(90px, 3.90625vw + 40px, 140px);
    margin-top: clamp(0px, 3.90625vw - 50px, 50px);
    align-self: flex-start;
  }
  #arrow-right-page4 {
    padding: clamp(10px, 0.78125vw + 0px, 20px);
    height: clamp(90px, 3.90625vw + 40px, 140px);
    margin-top: clamp(0px, 3.90625vw - 50px, 50px);
    align-self: flex-start;
  }
  #desktop-carousel-shadow {
    position: absolute;
    bottom: 0px;
    left: 0px;
    width: 100vw;
    height: clamp(250px, 7.8125vw + 150px, 350px);
    background: rgba(0, 0, 0, 0.6);
    -webkit-mask-image: linear-gradient(to top, transparent 0px, black 10%, black 70%, transparent 100%);
            mask-image: linear-gradient(to top, transparent 0px, black 10%, black 70%, transparent 100%);
    z-index: 0;
  }
  #page5 {
    padding-top: 50px;
    width: 87vw;
    height: clamp(900px, 400px + 39.0625vw, 1400px);
    margin-left: auto;
    margin-right: auto;
  }
  #testimonials-background {
    height: 75.5%;
  }
  #testimonials-background-container {
    width: 87vw;
    height: clamp(650px, 100px + 42.96875vw, 1200px);
    margin-top: 226px;
  }
  #testimonials-avatar-image-oroborus {
    position: absolute;
    width: clamp(204px, 20px + 14.375vw, 388px);
    top: clamp(-38px, -2px - 1.40625vw, -20px);
    left: clamp(-42px, -2px - 1.5625vw, -22px);
  }
  #testimonials-avatar-image {
    width: clamp(160px, 16px + 11.25vw, 304px);
  }
  #background-side-border-right {
    height: 76%;
    width: 2%;
    -o-object-fit: cover;
       object-fit: cover;
    top: 0px;
  }
  #background-side-border-left {
    height: 76%;
    width: 2%;
    -o-object-fit: cover;
       object-fit: cover;
    top: 0px;
  }
  #testimonials-names {
    font-size: clamp(3.25rem, 1.5rem + 2.1875vw, 5rem);
    margin-top: clamp(10px, -3px + 1.015625vw, 23px);
  }
  #testimonials-selectors {
    width: clamp(200px, 100px + 7.8125vw, 300px);
    margin-top: clamp(10px, 5px + 0.390625vw, 15px);
  }
  #testimonials-avatar-container .long-highlight-line {
    width: clamp(220px, 120px + 7.8125vw, 320px);
    height: clamp(2px, 1px + 0.078125vw, 4px);
  }
  #testimonials-text {
    width: 85%;
    height: clamp(400px, 100px + 23.4375vw, 700px);
    margin: auto;
    font-size: clamp(1.25rem, 0.375rem + 1.09375vw, 2.125rem);
    text-shadow: 2px 2px 10px black;
    padding-right: 10px;
    margin-left: 50px;
  }
  #testimonials-text::-webkit-scrollbar {
    width: clamp(4px, 2px + 0.15625vw, 6px);
  }
  #background-glowing-border-upper {
    width: 107%;
    top: clamp(-240px, 6px - 9.609375vw, -117px);
  }
  #background-glowing-border-lower {
    width: 107%;
    bottom: clamp(41px, 22px + 1.484375vw, 60px);
  }
  #testimonials-container {
    padding-top: clamp(30px, 250px - 8.59375vw, 140px);
    flex-direction: row;
    align-items: center;
    height: 35vw;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
  }
  #testimonials-avatar-container {
    flex: 1;
    transform: scale(1.3);
  }
  #testimonials-text-container {
    flex: 1;
    min-width: 0;
    margin: 0;
    margin-right: 50px;
  }
  #testimonials-arrows-container {
    width: 100%;
  }
  #arrow-left-page5 {
    position: absolute;
    top: 50%;
    left: 20px;
    transform: scaleX(-1);
    height: 100px;
  }
  #arrow-right-page5 {
    position: absolute;
    top: 50%;
    right: 20px;
    height: 100px;
  }
  .picture-frame-page5 {
    width: 87.5vw;
    max-width: unset;
    grid-column: 1;
    grid-row: 1;
  }
  .testimonials-images {
    position: static;
    height: unset;
    max-width: unset;
    max-height: unset;
    width: 96vw;
    z-index: -1;
    pointer-events: none;
  }
  #desktop-border-page5 {
    width: 90.4vw;
    max-width: unset;
    margin-top: 1.4vw;
    z-index: -1;
    grid-column: 1;
    grid-row: 1;
  }
  #testimonials-desktop-outer-text-container {
    grid-column: 1;
    grid-row: 1;
    margin-top: auto;
    margin-bottom: clamp(160px, 12.10938vw + 5px, 315px);
  }
  #testimonials-desktop-text-container {
    display: flex;
    flex-direction: column;
  }
  #testimonials-desktop-text-container .long-highlight-line {
    margin-right: unset;
    height: 3px;
    width: clamp(300px, 11.71875vw + 150px, 450px);
    margin-bottom: clamp(10px, 0.78125vw + 0px, 20px);
  }
  #testimonials-desktop-names {
    color: rgb(255, 217, 0);
    font-family: var(--main-font);
    text-align: center;
    font-size: clamp(2.5rem, 2.5vw + 0.5rem, 4.5rem);
    margin-left: auto;
    margin-right: 80px;
  }
  #testimonials-desktop-text {
    color: rgb(255, 255, 255);
    font-family: "Gabriela", sans-serif;
    text-align: center;
    height: clamp(110px, 10.15625vw - 20px, 240px);
    width: clamp(1000px, 78.125vw, 2000px);
    font-size: clamp(1rem, 1.09375vw + 0.125rem, 1.875rem);
    overflow-y: scroll;
    margin-left: clamp(50px, 2.73438vw + 15px, 85px);
    padding-right: 15px;
  }
  #testimonials-desktop-text::-webkit-scrollbar {
    width: clamp(3px, 0.07813vw + 2px, 4px);
  }
  #testimonials-desktop-text::-webkit-scrollbar-thumb {
    background-color: rgba(255, 204, 0, 0.68);
    border-radius: 20px;
  }
  #testimonials-desktop-text::-webkit-scrollbar-track {
    background-color: rgba(255, 204, 0, 0.3);
    border-radius: 20px;
  }
}
#attributions-page {
  margin-top: 100px;
}

#attributions-text-background {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 70vw;
}

#attributions-text-container {
  display: block;
  position: relative;
  z-index: 1;
  width: 70vw;
  margin-left: auto;
  margin-right: auto;
  margin-top: 50px;
}

.attribution-text {
  position: relative;
  color: rgb(255, 255, 255);
  font-family: "Gabriela", sans-serif;
  text-align: start;
  font-size: 1rem;
  z-index: 2;
  margin-left: 50px;
  padding-top: 30px;
}/*# sourceMappingURL=styles.css.map */