@font-face {
  font-family: "font-1-reg";
  src: url("../fonts/Montserrat-Regular.ttf");
  font-display: swap;
}
@font-face {
  font-family: "font-1-med";
  src: url("../fonts/Montserrat-Medium.ttf");
  font-display: swap;
}
@font-face {
  font-family: "font-1-bol";
  src: url("../fonts/Montserrat-Bold.ttf");
  font-display: swap;
}
@font-face {
  font-family: "font-1-bla";
  src: url("../fonts/Montserrat-Black.ttf");
  font-display: swap;
}
@font-face {
  font-family: "font-2-reg";
  src: url("../fonts/PlayfairDisplay-Regular.ttf");
  font-display: swap;
}
@font-face {
  font-family: "font-2-reg-ita";
  src: url("../fonts/PlayfairDisplay-Italic.ttf");
  font-display: swap;
}
@font-face {
  font-family: "font-2-med-ita";
  src: url("../fonts/PlayfairDisplay-MediumItalic.ttf");
  font-display: swap;
}
@font-face {
  font-family: "font-2-bla";
  src: url("../fonts/PlayfairDisplay-Black.ttf");
  font-display: swap;
}
@font-face {
  font-family: "font-2-bla-ita";
  src: url("../fonts/PlayfairDisplay-BlackItalic.ttf");
  font-display: swap;
}
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

::-webkit-scrollbar {
  width: 5px;
}

::-webkit-scrollbar-thumb {
  background: #F25A38;
}

::-moz-selection {
  /* Code for Firefox */
  background: #38D0F2;
}

::selection {
  background: #38D0F2;
}

a,
#goTop,
.burger_container,
.close_container,
.disable_highlight {
  -webkit-tap-highlight-color: transparent;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
}

body {
  font-family: "font-1-med";
  background-color: #F8E2A9;
  color: #F25A38;
}

.top_container {
  display: none;
  position: fixed;
  top: 4rem;
  left: 50%;
  transform: translateX(-50%);
  z-index: 20;
  background-color: #F25A38;
  color: #F8E2A9;
  padding: 4px 8px;
  border-radius: 50em;
  border: 0.75px solid #F8E2A9;
  cursor: pointer;
}
@media screen and (max-width: 1024px) {
  .top_container {
    transform: none;
    left: initial;
    top: 0.75rem;
    right: 0.75rem;
  }
}
.top_container:active {
  scale: 0.95;
}

.burger_container {
  position: fixed;
  bottom: 0.75rem;
  right: 0.75rem;
  z-index: 23;
  width: 2rem;
  height: 2rem;
  padding: 8px;
  background-color: #F25A38;
  border-radius: 50%;
  border: 0.75px solid #F8E2A9;
  background-image: url("../assets/icons/burger.svg");
  background-size: 50%;
  background-repeat: no-repeat;
  background-position: center;
  cursor: pointer;
  display: none;
}
@media screen and (max-width: 1024px) {
  .burger_container {
    display: block;
  }
}

.close_container {
  position: fixed;
  bottom: 0.75rem;
  right: 0.75rem;
  z-index: 23;
  width: 2rem;
  height: 2rem;
  padding: 8px;
  background-color: #F8E2A9;
  border-radius: 50%;
  background-image: url("../assets/icons/close.svg");
  background-size: 50%;
  background-repeat: no-repeat;
  background-position: center;
  cursor: pointer;
}
@media screen and (max-width: 1024px) {
  .close_container {
    display: block;
  }
}

.disable-scrolling {
  height: 100%;
  overflow: hidden;
}

.mobile_navbar {
  position: fixed;
  height: calc(100vh - (100vh - 100%));
  width: 40%;
  top: 0;
  right: 0;
  background-color: #F25A38;
  z-index: 22;
  transition: -webkit-clip-path 0.6s ease-out;
  transition: clip-path 0.6s ease-out;
  transition: clip-path 0.6s ease-out, -webkit-clip-path 0.6s ease-out;
  padding: 0 1rem;
  display: none;
  flex-direction: column;
  -webkit-clip-path: circle(0%);
          clip-path: circle(0%);
  padding-top: 2rem;
}
@media screen and (max-width: 1024px) {
  .mobile_navbar {
    display: flex;
  }
}
@media screen and (max-width: 768px) {
  .mobile_navbar {
    width: 100%;
  }
}
.mobile_navbar .logo_dance_studio_group {
  line-height: 0.95;
}
.mobile_navbar .dance_text,
.mobile_navbar .studio_text {
  color: #F8E2A9;
  text-align: right;
  font-size: 7.5rem;
}
@media screen and (max-width: 1024px) {
  .mobile_navbar .dance_text,
  .mobile_navbar .studio_text {
    font-size: 3.75rem;
  }
}
@media screen and (max-width: 768px) {
  .mobile_navbar .dance_text,
  .mobile_navbar .studio_text {
    font-size: 4.5rem;
  }
}
@media screen and (max-width: 480px) {
  .mobile_navbar .dance_text,
  .mobile_navbar .studio_text {
    font-size: 3.5rem;
  }
}
.mobile_navbar .dance_text {
  font-family: "font-2-reg-ita";
  margin-top: -6px;
  font-weight: 300;
}
.mobile_navbar .studio_text {
  font-family: "font-1-reg";
  font-weight: 300;
}
.mobile_navbar .mobile_navbar_holder {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
}
.mobile_navbar .nav_container {
  display: flex;
  flex-direction: column;
  width: -moz-fit-content;
  width: fit-content;
  margin-left: auto;
  align-items: flex-end;
  line-height: 1.3;
  margin-top: 2rem;
}
.mobile_navbar .nav_container a {
  display: inline-block;
  text-decoration: none;
  color: #F8E2A9;
  width: -moz-fit-content;
  width: fit-content;
  font-family: "font-1-reg";
  font-size: 1.5rem;
  border-radius: 2px;
}
.mobile_navbar .nav_container a::first-letter {
  font-family: "font-1-med";
}
.mobile_navbar .socials {
  display: flex;
  justify-content: flex-end;
  -moz-column-gap: 1rem;
       column-gap: 1rem;
  margin-top: 2px;
}
.mobile_navbar .socials a {
  display: inline-block;
  text-decoration: none;
  color: #F8E2A9;
  width: -moz-fit-content;
  width: fit-content;
  font-family: "font-1-reg";
  font-size: 1rem;
  font-weight: 300;
  border-radius: 2px;
}
.mobile_navbar .email_and_phone {
  margin-top: 3rem;
  line-height: 1.4;
}
.mobile_navbar .email_and_phone .email,
.mobile_navbar .email_and_phone .phone {
  color: #F8E2A9;
  text-align: right;
}

.laptop_navbar {
  display: flex;
  align-items: center;
  position: fixed;
  left: 50%;
  transform: translate(-50%, -100%);
  z-index: 20;
  transition: all 0.2s ease-out;
}
@media screen and (max-width: 1024px) {
  .laptop_navbar {
    display: none;
  }
}
.laptop_navbar .menus_container {
  background-color: #F8E2A9;
  border: 1.4px solid #F25A38;
  border-radius: 50em;
  display: flex;
  position: relative;
  overflow: hidden;
}
.laptop_navbar .menus_container a {
  display: inline-block;
  text-decoration: none;
  color: #F25A38;
  white-space: nowrap;
  padding: 8px 12px;
}
.laptop_navbar .menus_container a:hover {
  background-color: #F25A38;
  color: #F8E2A9;
}

.hero {
  max-width: 1920px;
  margin: auto;
  height: 100svh;
}
.hero .hero_contents_parent {
  display: flex;
  height: 100%;
}
@media screen and (max-width: 1024px) {
  .hero .hero_contents_parent {
    flex-direction: column;
    justify-content: space-between;
  }
}
.hero .hero_logo_and_navigation_menu_container {
  flex: 0 0 55%;
  text-align: right;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 1rem;
}
@media screen and (max-width: 1024px) {
  .hero .hero_logo_and_navigation_menu_container {
    order: 2;
    flex: initial;
  }
}
.hero .logo_dance_studio_group {
  line-height: 0.95;
}
.hero .text_and_logo_container {
  display: inline-block;
}
@media screen and (max-width: 1024px) {
  .hero .text_and_logo_container {
    max-width: 20rem;
  }
}
@media screen and (max-width: 768px) {
  .hero .text_and_logo_container {
    max-width: 22rem;
  }
}
@media screen and (max-width: 480px) {
  .hero .text_and_logo_container {
    max-width: 15rem;
  }
}
.hero .text_and_logo_container img {
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
}
.hero .dance_text,
.hero .studio_text {
  font-size: 7.5rem;
}
@media screen and (max-width: 1024px) {
  .hero .dance_text,
  .hero .studio_text {
    font-size: 3.75rem;
  }
}
@media screen and (max-width: 768px) {
  .hero .dance_text,
  .hero .studio_text {
    font-size: 4.5rem;
  }
}
@media screen and (max-width: 480px) {
  .hero .dance_text,
  .hero .studio_text {
    font-size: 3.5rem;
  }
}
.hero .dance_text {
  font-family: "font-2-reg-ita";
  margin-top: -6px;
  font-weight: 300;
}
.hero .studio_text {
  font-family: "font-1-reg";
  font-weight: 300;
}
.hero .nav_container {
  display: flex;
  flex-direction: column;
  width: -moz-fit-content;
  width: fit-content;
  margin-left: auto;
  align-items: flex-end;
  line-height: 1.3;
}
@media screen and (max-width: 1024px) {
  .hero .nav_container {
    display: none;
  }
}
.hero .nav_container a {
  display: inline-block;
  text-decoration: none;
  color: #F25A38;
  width: -moz-fit-content;
  width: fit-content;
  font-family: "font-1-reg";
  font-size: 1.5rem;
  padding: 0 8px;
  border-radius: 2px;
}
.hero .nav_container a:hover {
  background-color: #F25A38;
  color: #F8E2A9;
}
.hero .nav_container a::first-letter {
  font-family: "font-1-med";
}
.hero .hero_image_container {
  flex: 0 0 45%;
  position: relative;
}
@media screen and (max-width: 1024px) {
  .hero .hero_image_container {
    order: 1;
    height: 70%;
    flex: initial;
  }
}
.hero .hero_image_container::before {
  content: "";
  width: 100%;
  height: 100%;
  background-color: rgba(248, 226, 169, 0.7);
  mix-blend-mode: multiply;
  position: absolute;
  inset: 0;
  display: inline-block;
  z-index: 10;
}
.hero .hero_image_container img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center 20%;
     object-position: center 20%;
  filter: saturate(0);
}

.about {
  max-width: 1920px;
  margin: auto;
  padding: 0 2rem;
  margin-top: 6rem;
}
@media screen and (max-width: 768px) {
  .about {
    padding: 0 0.75rem;
  }
}
.about .subheading {
  font-family: "font-1-reg";
  font-size: 5rem;
}
@media screen and (max-width: 1024px) {
  .about .subheading {
    font-size: 4rem;
  }
}
@media screen and (max-width: 768px) {
  .about .subheading {
    font-size: 3rem;
  }
}
@media screen and (max-width: 480px) {
  .about .subheading {
    font-size: 2rem;
  }
}
.about .subheading::first-letter {
  font-family: "font-2-bla-ita";
}
.about .grid {
  margin-top: 4rem;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 30px;
}
@media screen and (max-width: 1024px) {
  .about .grid {
    margin-top: 2rem;
  }
}
@media screen and (max-width: 768px) {
  .about .grid {
    margin-top: 1.5rem;
  }
}
@media screen and (max-width: 480px) {
  .about .grid {
    margin-top: 1rem;
  }
}
@media screen and (max-width: 768px) {
  .about .grid {
    gap: 1rem;
  }
}
.about .grid .image_container {
  height: 415px;
  grid-column: span 3;
}
@media screen and (max-width: 1024px) {
  .about .grid .image_container {
    grid-column: 1/-1;
  }
}
.about .grid .image_container img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.about .grid .first_para,
.about .grid .second_para {
  margin-top: 2rem;
  font-size: 1.25rem;
  line-height: 1.75rem;
}
@media screen and (max-width: 768px) {
  .about .grid .first_para,
  .about .grid .second_para {
    font-size: 1rem;
    line-height: 1.5rem;
  }
}
@media screen and (max-width: 1024px) {
  .about .grid .first_para,
  .about .grid .second_para {
    margin-top: 0;
  }
}
.about .grid .first_para {
  grid-column: 3;
}
@media screen and (max-width: 1024px) {
  .about .grid .first_para {
    grid-column: 1/span 2;
  }
}
@media screen and (max-width: 768px) {
  .about .grid .first_para {
    grid-column: 1/-1;
  }
}
@media screen and (max-width: 1024px) {
  .about .grid .second_para {
    grid-column: 3/span 2;
  }
}
@media screen and (max-width: 768px) {
  .about .grid .second_para {
    grid-column: 1/-1;
  }
}

#portfolio {
  max-width: 1920px;
  margin: auto;
  padding: 0 2rem;
  margin-top: 6rem;
}
@media screen and (max-width: 768px) {
  #portfolio {
    padding: 0 0.75rem;
  }
}
#portfolio .subheading {
  font-family: "font-1-reg";
  font-size: 5rem;
}
@media screen and (max-width: 1024px) {
  #portfolio .subheading {
    font-size: 4rem;
  }
}
@media screen and (max-width: 768px) {
  #portfolio .subheading {
    font-size: 3rem;
  }
}
@media screen and (max-width: 480px) {
  #portfolio .subheading {
    font-size: 2rem;
  }
}
#portfolio .subheading::first-letter {
  font-family: "font-2-bla-ita";
}
#portfolio .description_items_holder {
  margin-top: 4rem;
  font-size: 1.25rem;
  line-height: 1.75rem;
  width: 74%;
  margin-left: auto;
}
@media screen and (max-width: 1024px) {
  #portfolio .description_items_holder {
    margin-top: 2rem;
  }
}
@media screen and (max-width: 768px) {
  #portfolio .description_items_holder {
    margin-top: 1.5rem;
  }
}
@media screen and (max-width: 480px) {
  #portfolio .description_items_holder {
    margin-top: 1rem;
  }
}
@media screen and (max-width: 768px) {
  #portfolio .description_items_holder {
    font-size: 1rem;
    line-height: 1.5rem;
  }
}
@media screen and (max-width: 1024px) {
  #portfolio .description_items_holder {
    width: 100%;
  }
}
#portfolio .description {
  max-width: 344px;
  margin: auto;
}
@media screen and (max-width: 480px) {
  #portfolio .description {
    max-width: 74%;
    margin: 0;
    margin-left: auto;
  }
}
#portfolio .grid {
  margin-top: 2rem;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-auto-rows: 520px;
  gap: 2rem;
}
@media screen and (max-width: 1024px) {
  #portfolio .grid {
    grid-template-columns: repeat(1, minmax(0, 1fr));
  }
}
@media screen and (max-width: 768px) {
  #portfolio .grid {
    grid-auto-rows: 300px;
    gap: 1rem;
  }
}
#portfolio .grid .item {
  position: relative;
}
#portfolio .grid .item:hover::before {
  background-color: transparent;
}
#portfolio .grid .item:hover img {
  filter: saturate(100%);
}
#portfolio .grid .item::before {
  content: "";
  width: 100%;
  height: 100%;
  background-color: rgba(248, 226, 169, 0.7);
  mix-blend-mode: multiply;
  position: absolute;
  inset: 0;
  display: inline-block;
  z-index: 10;
}
#portfolio .grid .item img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  filter: saturate(0);
  transition: all 0.4s;
}
#portfolio .see_more_container {
  display: flex;
  justify-content: center;
  margin-top: 2rem;
}
@media screen and (max-width: 768px) {
  #portfolio .see_more_container {
    font-size: 12px;
  }
}
#portfolio .see_more_container .text {
  background-color: #F25A38;
  padding: 8px 22px;
  color: #F8E2A9;
  border-radius: 50em;
  cursor: pointer;
}
@media screen and (max-width: 768px) {
  #portfolio .see_more_container .text {
    padding: 2px 8px;
  }
}
#portfolio .see_more_container .text:active {
  scale: 0.95;
}
#portfolio .see_more_container .text span {
  font-family: "font-2-bla-ita";
}

#services {
  max-width: 1920px;
  margin: auto;
  padding: 0 2rem;
  margin-top: 6rem;
}
@media screen and (max-width: 768px) {
  #services {
    padding: 0 0.75rem;
  }
}
#services .subheading {
  font-family: "font-1-reg";
  font-size: 5rem;
}
@media screen and (max-width: 1024px) {
  #services .subheading {
    font-size: 4rem;
  }
}
@media screen and (max-width: 768px) {
  #services .subheading {
    font-size: 3rem;
  }
}
@media screen and (max-width: 480px) {
  #services .subheading {
    font-size: 2rem;
  }
}
#services .subheading::first-letter {
  font-family: "font-2-bla-ita";
}
#services .description_items_holder {
  margin-top: 4rem;
  font-size: 1.25rem;
  line-height: 1.75rem;
  width: 74%;
  margin-left: auto;
}
@media screen and (max-width: 1024px) {
  #services .description_items_holder {
    margin-top: 2rem;
  }
}
@media screen and (max-width: 768px) {
  #services .description_items_holder {
    margin-top: 1.5rem;
  }
}
@media screen and (max-width: 480px) {
  #services .description_items_holder {
    margin-top: 1rem;
  }
}
@media screen and (max-width: 768px) {
  #services .description_items_holder {
    font-size: 1rem;
    line-height: 1.5rem;
  }
}
@media screen and (max-width: 1024px) {
  #services .description_items_holder {
    width: 100%;
  }
}
#services .description {
  max-width: 344px;
}
@media screen and (max-width: 480px) {
  #services .description {
    max-width: 74%;
    margin: 0;
    margin-left: auto;
  }
}
#services .description a {
  color: #F25A38;
  text-decoration: none;
  font-family: "font-1-bol";
}
#services .grid {
  margin-top: 2rem;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 2rem;
}
@media screen and (max-width: 1024px) {
  #services .grid {
    grid-template-columns: repeat(1, minmax(0, 1fr));
  }
}
@media screen and (max-width: 768px) {
  #services .grid {
    gap: 1rem;
  }
}
#services .grid .item {
  position: relative;
  background-color: #F25A38;
  padding: 2rem;
  padding-bottom: 0;
  color: #F8E2A9;
  line-height: initial;
}
#services .grid .item:hover .image_container::before {
  background-color: transparent;
}
#services .grid .item:hover .image_container img {
  filter: saturate(100%);
}
@media screen and (max-width: 768px) {
  #services .grid .item {
    padding: 1rem;
    padding-bottom: 0;
  }
}
#services .grid .item .image_container {
  height: 400px;
}
@media screen and (max-width: 480px) {
  #services .grid .item .image_container {
    height: 200px;
  }
}
#services .grid .item .image_container img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  filter: saturate(0);
  transition: all 0.4s;
}
#services .grid .item .image_container::before {
  content: "";
  width: 100%;
  height: 100%;
  background-color: rgba(248, 226, 169, 0.7);
  mix-blend-mode: multiply;
  position: absolute;
  inset: 0;
  display: inline-block;
  z-index: 10;
}
#services .grid .item .text_container .service_name_container {
  position: relative;
  z-index: 11;
  height: 6rem;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 2rem;
  font-weight: 300;
}
@media screen and (max-width: 768px) {
  #services .grid .item .text_container .service_name_container {
    font-size: 1.25rem;
    height: 4rem;
  }
}

#crew {
  max-width: 1920px;
  margin: auto;
  padding: 0 2rem;
  margin-top: 6rem;
}
@media screen and (max-width: 768px) {
  #crew {
    padding: 0 0.75rem;
  }
}
#crew .subheading {
  font-family: "font-1-reg";
  font-size: 5rem;
}
@media screen and (max-width: 1024px) {
  #crew .subheading {
    font-size: 4rem;
  }
}
@media screen and (max-width: 768px) {
  #crew .subheading {
    font-size: 3rem;
  }
}
@media screen and (max-width: 480px) {
  #crew .subheading {
    font-size: 2rem;
  }
}
#crew .subheading::first-letter {
  font-family: "font-2-bla-ita";
}
#crew .description_items_holder {
  margin-top: 4rem;
  font-size: 1.25rem;
  line-height: 1.75rem;
  width: 74%;
  margin-left: auto;
}
@media screen and (max-width: 1024px) {
  #crew .description_items_holder {
    margin-top: 2rem;
  }
}
@media screen and (max-width: 768px) {
  #crew .description_items_holder {
    margin-top: 1.5rem;
  }
}
@media screen and (max-width: 480px) {
  #crew .description_items_holder {
    margin-top: 1rem;
  }
}
@media screen and (max-width: 768px) {
  #crew .description_items_holder {
    font-size: 1rem;
    line-height: 1.5rem;
  }
}
@media screen and (max-width: 1024px) {
  #crew .description_items_holder {
    width: 100%;
  }
}
#crew .description {
  max-width: 344px;
  margin: auto;
}
@media screen and (max-width: 480px) {
  #crew .description {
    max-width: 74%;
    margin: 0;
    margin-left: auto;
  }
}
#crew .grid {
  margin-top: 7rem;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  -moz-column-gap: 3rem;
       column-gap: 3rem;
  row-gap: 9rem;
}
@media screen and (max-width: 1580px) {
  #crew .grid {
    row-gap: 7rem;
  }
}
@media screen and (max-width: 1280px) {
  #crew .grid {
    row-gap: 6rem;
  }
}
@media screen and (max-width: 780px) {
  #crew .grid {
    row-gap: 4rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin-top: 4rem;
  }
}
@media screen and (max-width: 480px) {
  #crew .grid {
    grid-template-columns: repeat(1, minmax(0, 1fr));
  }
}
#crew .grid .item .image_container {
  position: relative;
  height: 645px;
}
@media screen and (max-width: 1560px) {
  #crew .grid .item .image_container {
    height: 485px;
  }
}
@media screen and (max-width: 1280px) {
  #crew .grid .item .image_container {
    height: 405px;
  }
}
@media screen and (max-width: 780px) {
  #crew .grid .item .image_container {
    height: 335px;
  }
}
#crew .grid .item .image_container::before {
  content: "";
  position: absolute;
  top: -10%;
  left: 0;
  width: 100%;
  height: 90%;
  background-color: #F25A38;
}
#crew .grid .item .image_container img {
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
  filter: saturate(0);
}
#crew .grid .item .crew_name_and_designation_container {
  text-align: right;
}
#crew .grid .item .crew_name_and_designation_container .designation {
  font-family: "font-2-med-ita";
  font-size: 1rem;
}
#crew .grid .item.third_item {
  grid-column: 2;
}
@media screen and (max-width: 780px) {
  #crew .grid .item.third_item {
    grid-column: initial;
  }
}

#testimonials {
  max-width: 1920px;
  margin: auto;
  padding: 0 2rem;
  margin-top: 6rem;
}
@media screen and (max-width: 768px) {
  #testimonials {
    padding: 0 0.75rem;
  }
}
#testimonials .subheading {
  font-family: "font-1-reg";
  font-size: 5rem;
}
@media screen and (max-width: 1024px) {
  #testimonials .subheading {
    font-size: 4rem;
  }
}
@media screen and (max-width: 768px) {
  #testimonials .subheading {
    font-size: 3rem;
  }
}
@media screen and (max-width: 480px) {
  #testimonials .subheading {
    font-size: 2rem;
  }
}
#testimonials .subheading::first-letter {
  font-family: "font-2-bla-ita";
}
#testimonials .description_items_holder {
  margin-top: 4rem;
  font-size: 1.25rem;
  line-height: 1.75rem;
  width: 74%;
  margin-left: auto;
}
@media screen and (max-width: 1024px) {
  #testimonials .description_items_holder {
    margin-top: 2rem;
  }
}
@media screen and (max-width: 768px) {
  #testimonials .description_items_holder {
    margin-top: 1.5rem;
  }
}
@media screen and (max-width: 480px) {
  #testimonials .description_items_holder {
    margin-top: 1rem;
  }
}
@media screen and (max-width: 768px) {
  #testimonials .description_items_holder {
    font-size: 1rem;
    line-height: 1.5rem;
  }
}
@media screen and (max-width: 1024px) {
  #testimonials .description_items_holder {
    width: 100%;
  }
}
#testimonials .description {
  max-width: 344px;
}
@media screen and (max-width: 480px) {
  #testimonials .description {
    max-width: 74%;
    margin: 0;
    margin-left: auto;
  }
}
#testimonials .swiper_my_holder {
  width: 40%;
  margin-left: auto;
  margin-right: auto;
  position: relative;
}
#testimonials .swiper_my_holder .swiper-wrapper {
  align-items: center;
}
#testimonials .swiper_my_holder .swiper-wrapper:hover {
  cursor: grab;
}
#testimonials .swiper_my_holder .swiper-wrapper:active {
  cursor: grabbing;
}
@media screen and (max-width: 480px) {
  #testimonials .swiper_my_holder {
    width: 100%;
  }
}
#testimonials .swiper_my_holder .swiper {
  margin-top: 2rem;
  position: unset;
}
#testimonials .swiper_my_holder .swiper .item .happy_summary,
#testimonials .swiper_my_holder .swiper .item .happy_description {
  max-width: 300px;
}
@media screen and (max-width: 480px) {
  #testimonials .swiper_my_holder .swiper .item .happy_summary,
  #testimonials .swiper_my_holder .swiper .item .happy_description {
    max-width: 100%;
  }
}
#testimonials .swiper_my_holder .swiper .item .happy_summary {
  font-family: "font-1-bol";
  font-size: 24px;
  line-height: 2rem;
}
@media screen and (max-width: 768px) {
  #testimonials .swiper_my_holder .swiper .item .happy_summary {
    line-height: 28px;
  }
}
#testimonials .swiper_my_holder .swiper .item .happy_description {
  margin-top: 0.75rem;
}
#testimonials .swiper_my_holder .swiper .item .happy_details {
  min-width: 300px;
  margin-top: 1rem;
}
@media screen and (max-width: 480px) {
  #testimonials .swiper_my_holder .swiper .item .happy_details {
    min-width: 100%;
  }
}
#testimonials .swiper_my_holder .swiper .item .happy_name {
  font-family: "font-1-bol";
}
#testimonials .swiper_my_holder .swiper .item .happy_designation {
  font-family: "font-2-reg-ita";
  font-size: 1rem;
}
#testimonials .swiper_my_holder .swiper .swiper-pagination-bullet-active {
  background-color: #F25A38 !important;
}
#testimonials .swiper_my_holder .swiper .swiper-pagination-bullet {
  background-color: transparent;
  border: 1px solid #F25A38;
  opacity: 1;
}
#testimonials .swiper_my_holder .swiper .swiper-pagination {
  position: relative;
  margin-top: 1rem;
}
#testimonials .swiper_my_holder .swiper .swiper-slide {
  text-align: left;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
#testimonials .swiper_my_holder .swiper-button-next,
#testimonials .swiper_my_holder .swiper-button-prev {
  position: absolute;
  color: #F8E2A9;
  background-color: #F25A38;
  border-radius: 50%;
  width: 2rem;
  height: 2rem;
}
@media screen and (max-width: 768px) {
  #testimonials .swiper_my_holder .swiper-button-next,
  #testimonials .swiper_my_holder .swiper-button-prev {
    display: none;
  }
}
#testimonials .swiper_my_holder .swiper-button-prev {
  left: -10%;
}
#testimonials .swiper_my_holder .swiper-button-prev:active {
  scale: 0.95;
}
#testimonials .swiper_my_holder .swiper-button-next {
  right: -10%;
}
#testimonials .swiper_my_holder .swiper-button-next:active {
  scale: 0.95;
}
#testimonials .swiper_my_holder .swiper-button-next:after,
#testimonials .swiper_my_holder .swiper-button-prev:after {
  font-size: 1rem;
}

#faq {
  max-width: 1920px;
  margin: auto;
  padding: 0 2rem;
  margin-top: 6rem;
}
@media screen and (max-width: 768px) {
  #faq {
    padding: 0 0.75rem;
  }
}
#faq .subheading {
  font-family: "font-1-reg";
  font-size: 5rem;
}
@media screen and (max-width: 1024px) {
  #faq .subheading {
    font-size: 4rem;
  }
}
@media screen and (max-width: 768px) {
  #faq .subheading {
    font-size: 3rem;
  }
}
@media screen and (max-width: 480px) {
  #faq .subheading {
    font-size: 2rem;
  }
}
#faq .subheading::first-letter {
  font-family: "font-2-bla-ita";
}
#faq .description_items_holder {
  margin-top: 4rem;
  font-size: 1.25rem;
  line-height: 1.75rem;
  width: 74%;
  margin-left: auto;
}
@media screen and (max-width: 1024px) {
  #faq .description_items_holder {
    margin-top: 2rem;
  }
}
@media screen and (max-width: 768px) {
  #faq .description_items_holder {
    margin-top: 1.5rem;
  }
}
@media screen and (max-width: 480px) {
  #faq .description_items_holder {
    margin-top: 1rem;
  }
}
@media screen and (max-width: 768px) {
  #faq .description_items_holder {
    font-size: 1rem;
    line-height: 1.5rem;
  }
}
@media screen and (max-width: 1024px) {
  #faq .description_items_holder {
    width: 100%;
  }
}
#faq .description {
  max-width: 344px;
}
@media screen and (max-width: 480px) {
  #faq .description {
    max-width: 74%;
    margin: 0;
    margin-left: auto;
  }
}
#faq .description a {
  color: #F25A38;
  text-decoration: none;
  font-family: "font-1-bol";
}
#faq .grid {
  margin: auto;
  margin-top: 2rem;
  max-width: 600px;
}
#faq .grid .item {
  padding: 1rem 0;
  border-bottom: 1px solid #F25A38;
}
#faq .grid .item:last-child {
  border-bottom: none;
}
#faq .grid .question_container {
  display: flex;
  justify-content: space-between;
  cursor: pointer;
}
#faq .grid .question_container:hover .plus-icon {
  background-color: #F25A38;
  color: #F8E2A9;
}
@media screen and (max-width: 768px) {
  #faq .grid .question_container:hover .plus-icon {
    background-color: transparent;
    color: #F25A38;
  }
}
#faq .grid .question_container .question {
  font-family: "font-1-bol";
  font-size: 24px;
}
@media screen and (max-width: 768px) {
  #faq .grid .question_container .question {
    font-size: 20px;
  }
}
@media screen and (max-width: 480px) {
  #faq .grid .question_container .question {
    font-size: 14px;
  }
}
#faq .grid .plus-icon {
  border: 1px solid #F25A38;
  border-radius: 50%;
  width: 22px;
  height: 22px;
  display: flex;
  justify-content: center;
  align-items: center;
}
#faq .grid .answer_container {
  margin-top: 0.75rem;
  display: none;
}

#contact {
  max-width: 1920px;
  margin: auto;
  padding: 0 2rem;
  margin-top: 6rem;
}
@media screen and (max-width: 768px) {
  #contact {
    padding: 0 0.75rem;
  }
}
#contact .subheading {
  font-family: "font-1-reg";
  font-size: 5rem;
}
@media screen and (max-width: 1024px) {
  #contact .subheading {
    font-size: 4rem;
  }
}
@media screen and (max-width: 768px) {
  #contact .subheading {
    font-size: 3rem;
  }
}
@media screen and (max-width: 480px) {
  #contact .subheading {
    font-size: 2rem;
  }
}
#contact .subheading::first-letter {
  font-family: "font-2-bla-ita";
}
#contact .description_items_holder {
  margin-top: 4rem;
  font-size: 1.25rem;
  line-height: 1.75rem;
  width: 74%;
  margin-left: auto;
}
@media screen and (max-width: 1024px) {
  #contact .description_items_holder {
    margin-top: 2rem;
  }
}
@media screen and (max-width: 768px) {
  #contact .description_items_holder {
    margin-top: 1.5rem;
  }
}
@media screen and (max-width: 480px) {
  #contact .description_items_holder {
    margin-top: 1rem;
  }
}
@media screen and (max-width: 768px) {
  #contact .description_items_holder {
    font-size: 1rem;
    line-height: 1.5rem;
  }
}
@media screen and (max-width: 1024px) {
  #contact .description_items_holder {
    width: 100%;
  }
}
#contact .description {
  max-width: 344px;
  margin: auto;
}
@media screen and (max-width: 480px) {
  #contact .description {
    max-width: 74%;
    margin: 0;
    margin-right: auto;
  }
}
#contact .details_container {
  margin-top: 2rem;
}
#contact .details_container .socials_container {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
}
#contact .details_container .socials_container .social_item {
  text-decoration: none;
  color: #F25A38;
  font-family: "font-1-bla";
  font-size: 2rem;
  display: block;
  width: -moz-fit-content;
  width: fit-content;
}
@media screen and (max-width: 480px) {
  #contact .details_container .socials_container .social_item {
    font-size: 20px;
  }
}
#contact .details_container .socials_container .phone_number {
  margin-top: 2rem;
}
@media screen and (max-width: 480px) {
  #contact .details_container .socials_container .phone_number {
    margin-top: 1rem;
  }
}
#contact .details_container .socials_container .whatsapp, #contact .details_container .socials_container .gmail {
  margin-top: 0.5rem;
}
@media screen and (max-width: 480px) {
  #contact .details_container .socials_container .whatsapp, #contact .details_container .socials_container .gmail {
    margin-top: 2px;
  }
}
#contact .details_container .socials_container .instagram:hover {
  color: #E1306C;
}
#contact .details_container .socials_container .whatsapp:hover {
  color: #25D366;
}
#contact .details_container .socials_container .gmail_text {
  font-size: 24px;
}
@media screen and (max-width: 480px) {
  #contact .details_container .socials_container .gmail_text {
    font-size: 1rem;
  }
}
#contact .details_container .address_container {
  text-align: right;
  margin-top: 2rem;
  font-family: "font-1-bla";
  font-size: 20px;
}
@media screen and (max-width: 480px) {
  #contact .details_container .address_container {
    margin-top: 1rem;
  }
}
#contact .map_container {
  height: 500px;
  border: 1px solid #F25A38;
  margin-top: 1rem;
}
@media screen and (max-width: 768px) {
  #contact .map_container {
    height: 400px;
  }
}
@media screen and (max-width: 480px) {
  #contact .map_container {
    height: 300px;
  }
}
#contact .map_container iframe {
  width: 100%;
  height: 100%;
}

#glad {
  margin: auto;
  margin-top: 6rem;
  font-size: 80px;
  padding: 40px 65px;
  background-color: #F25A38;
  width: -moz-fit-content;
  width: fit-content;
  border-radius: 24px;
  border-top-right-radius: 211px;
}
@media screen and (max-width: 480px) {
  #glad {
    font-size: 40px;
    padding: 20px 35px;
    border-radius: 16px;
    border-top-right-radius: 100px;
  }
}
#glad p {
  color: #F8E2A9;
  max-width: 330px;
  font-family: "font-2-reg";
  line-height: 106%;
}
@media screen and (max-width: 480px) {
  #glad p {
    max-width: 160px;
  }
}
#glad .different {
  font-family: "font-2-bla-ita";
}

footer {
  margin-top: 6rem;
  font-size: 16px;
  font-weight: 300;
  border-top: 1px solid #F25A38;
}
@media screen and (max-width: 768px) {
  footer {
    font-size: 12px;
    margin-top: 3rem;
  }
}
footer .copyright {
  max-width: 1920px;
  margin: auto;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 16px 0;
}
@media screen and (max-width: 1024px) {
  footer .copyright {
    flex-direction: column;
    row-gap: 16px;
    padding: 12px 0;
  }
}
@media screen and (max-width: 768px) {
  footer .copyright {
    padding: 8px 0;
  }
}
footer .copyright .copyright_container {
  padding-left: 2rem;
}
@media screen and (max-width: 1024px) {
  footer .copyright .copyright_container {
    order: 2;
  }
}
@media screen and (max-width: 768px) {
  footer .copyright .copyright_container {
    padding-left: 0.75rem;
  }
}
footer .made_by_container {
  background-color: #F25A38;
  color: #F8E2A9;
  padding: 12px 0;
}
@media screen and (max-width: 768px) {
  footer .made_by_container {
    padding: 8px 0;
  }
}
footer .made_by_container p {
  text-align: center;
}
footer .made_by_container .name {
  font-family: "font-1-bol";
  text-decoration: none;
  color: #F8E2A9;
  display: inline-block;
}
footer .made_by_container .love {
  display: inline-block;
  text-decoration: none;
  color: #F8E2A9;
  animation: beat 1s linear infinite;
}

@keyframes beat {
  0% {
    transform: scale(1);
  }
  14% {
    transform: scale(0.9);
  }
  21% {
    transform: scale(1.1) skew(0.004turn);
  }
  28% {
    transform: scale(1) skew(0.008turn);
  }
  35% {
    transform: scale(1) skew(0);
  }
}
.love_hover {
  color: #6B0000 !important;
}

#error {
  display: none;
  position: fixed;
  left: 50%;
  transform: translateX(-50%);
  bottom: 24px;
  padding: 12px;
  font-family: "font-2";
  font-size: 28px;
  z-index: 22;
  white-space: nowrap;
  background-color: rgba(255, 0, 0, 0.8);
  color: #F8E2A9;
  border: 1px solid #ff0000;
}
@media screen and (max-width: 768px) {
  #error {
    font-size: 14px;
    padding: 8px;
  }
}

.bgPage {
  background-color: #F8E2A9;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100svh;
}
.bgPage .headingParent {
  font-family: "font-2";
  font-size: 20px;
  color: #F25A38;
  text-align: center;
}
.bgPage .inParent {
  margin: auto;
  margin-top: 42px;
  background-color: #F25A38;
  padding: 24px;
  border-radius: 6px;
  max-width: 500px;
}
@media screen and (max-width: 1024px) {
  .bgPage .inParent {
    padding: 12px;
    max-width: 300px;
  }
}
.bgPage .inParent input {
  width: 100%;
  border-radius: 4px;
  outline: none;
  border: none;
  padding: 12px;
  font-size: 24px;
  color: #F25A38;
  font-family: "font-1";
}
@media screen and (max-width: 1024px) {
  .bgPage .inParent input {
    font-size: 16px;
    padding: 8px;
  }
}
.bgPage .inParent .ticketName {
  margin-top: 12px;
}
.bgPage .inParent .logInParent #loginButton {
  background-color: #EAEAEA;
  padding: 6px 8px;
  color: #F25A38;
  outline: none;
  border: 1px solid #fff;
  border-radius: 4px;
  margin-top: 12px;
  font-size: 24px;
  cursor: pointer;
}
.bgPage .inParent .logInParent #loginButton:hover {
  background-color: #F25A38;
  color: #fff;
}
@media screen and (max-width: 1024px) {
  .bgPage .inParent .logInParent #loginButton {
    font-size: 16px;
  }
}

.error_page {
  display: flex;
  justify-content: center;
  align-items: center;
}
.error_page .holder {
  height: 100svh;
  width: -moz-fit-content;
  width: fit-content;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.error_page .four_not_four {
  font-size: 10rem;
  margin-left: auto;
}
.error_page .logo_dance_studio_group {
  line-height: 0.95;
  display: flex;
  flex-direction: column;
  margin-left: auto;
}
.error_page .text_and_logo_container {
  display: flex;
  max-width: 12rem;
  margin-left: auto;
}
@media screen and (max-width: 768px) {
  .error_page .text_and_logo_container {
    max-width: 12rem;
  }
}
@media screen and (max-width: 480px) {
  .error_page .text_and_logo_container {
    max-width: 10rem;
  }
}
.error_page .text_and_logo_container img {
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
}
.error_page .dance_text,
.error_page .studio_text {
  text-align: right;
  font-size: 3rem;
}
@media screen and (max-width: 1024px) {
  .error_page .dance_text,
  .error_page .studio_text {
    font-size: 3.75rem;
  }
}
@media screen and (max-width: 768px) {
  .error_page .dance_text,
  .error_page .studio_text {
    font-size: 4.5rem;
  }
}
@media screen and (max-width: 480px) {
  .error_page .dance_text,
  .error_page .studio_text {
    font-size: 3.5rem;
  }
}
.error_page .dance_text {
  font-family: "font-2-reg-ita";
  margin-top: -6px;
  font-weight: 300;
}
.error_page .studio_text {
  font-family: "font-1-reg";
  font-weight: 300;
}
.error_page .nothing {
  margin-top: 1rem;
  margin-left: auto;
  max-width: 50%;
  font-size: 1rem;
  text-align: right;
}
.error_page .nothing .dance {
  display: inline-block;
  text-decoration: none;
  color: #F25A38;
  font-family: "font-1-bol";
}/*# sourceMappingURL=styles.css.map */