*,
*::after,
*::before {
  margin: 0;
  padding: 0;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  outline: none;
  border: none;
  font-family: inherit;
}

@font-face {
  font-family: "Montserrat";
  font-weight: 500;
  font-style: normal;
  src: url(../../fonts/Montserrat/Montserrat-Medium.ttf) format("truetype");
}

@font-face {
  font-family: "Montserrat";
  font-weight: bold;
  font-style: normal;
  src: url(../../fonts/Montserrat/Montserrat-Bold.ttf) format("truetype");
}

@font-face {
  font-family: "Poppins";
  font-weight: 400;
  font-style: normal;
  src: url(../../fonts/Poppins/Poppins-Regular.ttf) format("truetype");
}

@font-face {
  font-family: "Poppins";
  font-weight: 600;
  font-style: normal;
  src: url(../../fonts/Poppins/Poppins-Bold.ttf) format("truetype");
}

@font-face {
  font-family: "Poppins";
  font-weight: 600;
  font-style: italic;
  src: url(../../fonts/Poppins/Poppins-BoldItalic.ttf) format("truetype");
}

@font-face {
  font-family: "Poppins";
  font-weight: 500;
  font-style: normal;
  src: url(../../fonts/Poppins/Poppins-SemiBold.ttf) format("truetype");
}

@font-face {
  font-family: "Poppins";
  font-weight: 700;
  font-style: normal;
  src: url(../../fonts/Poppins/Poppins-ExtraBold.ttf) format("truetype");
}

@font-face {
  font-family: "Roboto";
  font-weight: 400;
  font-style: normal;
  src: url(../../fonts/Roboto/Roboto-Regular.ttf);
}

@font-face {
  font-family: "Roboto";
  font-weight: 700;
  font-style: normal;
  src: url(../../fonts/Roboto/Roboto-Bold.ttf);
}

body#register {
  background: #d2215f;
  overflow-x: hidden;
}

body#welcome-body,
body#communication-body,
body#stage_body {
  background: #e22276;
}

html,
body {
  overflow-x: hidden !important;
}

body {
  position: relative;
}

.main-section {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  position: relative;
  -webkit-animation: fade-in 1s linear;
  animation: fade-in 1s linear;
}

.main-section .cover-img {
  width: 900px;
  position: absolute;
  top: 0px;
  left: -80px;
  z-index: -1;
  -webkit-animation: toTop 1s linear;
  animation: toTop 1s linear;
}

@media screen and (min-width: 1000px) {
  .main-section .cover-img {
    width: 60vw;
    left: -60px;
  }
}

.main-section .left-side {
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
}

.main-section .right-side {
  padding: 0 60px 137px 120px;
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-animation: toBottom 1s linear;
  animation: toBottom 1s linear;
}

.main-section .right-side .top-img {
  width: 581px;
  height: 282px;
}

.main-section .right-side .event-time {
  width: 594px;
  height: 56px;
  background-color: #ffffff;
  margin-top: 37px;
}

.main-section .right-side .event-time p {
  font-family: Montserrat, sans-serif;
  font-size: 45.5px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  letter-spacing: 22.75px;
  color: #d91a5d;
  width: 100%;
  text-align: center;
}

.main-section .right-side .btn-register {
  width: 665px;
  height: 178px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-shadow: 0px 10px 18.3px 2.7px #00000063;
  box-shadow: 0px 10px 18.3px 2.7px #00000063;
  background-blend-mode: color-dodge;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#ffffff));
  background-image: linear-gradient(to bottom, #ffffff, #ffffff);
  font-family: Montserrat, sans-serif;
  font-size: 50.5px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  letter-spacing: normal;
  text-align: left;
  color: #d91a5d;
  text-transform: uppercase;
  text-decoration: none;
  border-radius: 999px;
  margin-top: 118px;
  padding: 0 40px;
  margin-bottom: 34px;
  -webkit-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}

.main-section .right-side .btn-register:hover {
  -webkit-box-shadow: none;
  box-shadow: none;
}

.main-section .right-side .social-media {
  width: 346px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

@-webkit-keyframes fade-in {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@keyframes fade-in {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@-webkit-keyframes toBottom {
  from {
    -webkit-transform: translate(-100%);
    transform: translate(-100%);
  }
  to {
    -webkit-transform: translate(0);
    transform: translate(0);
  }
}

@keyframes toBottom {
  from {
    -webkit-transform: translate(-100%);
    transform: translate(-100%);
  }
  to {
    -webkit-transform: translate(0);
    transform: translate(0);
  }
}

@-webkit-keyframes toTop {
  from {
    -webkit-transform: translate(100%);
    transform: translate(100%);
  }
  to {
    -webkit-transform: translate(0);
    transform: translate(0);
  }
}

@keyframes toTop {
  from {
    -webkit-transform: translate(100%);
    transform: translate(100%);
  }
  to {
    -webkit-transform: translate(0);
    transform: translate(0);
  }
}

@media screen and (max-width: 1000px) {
  .main-section {
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
  }
  .main-section .left-side {
    -webkit-box-flex: 0;
    -ms-flex: 0;
    flex: 0;
    width: 0;
    height: 0;
  }
  .main-section .cover-img {
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
  }
  .main-section .right-side {
    background: rgba(210, 33, 95, 0.8);
    padding: 0;
    margin: 0;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
  }
}

@media screen and (max-width: 726px) {
  .main-section .cover-img {
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    height: 100vw;
    width: 100vw;
  }
  .main-section .right-side {
    background: rgba(210, 33, 95, 0.8);
    padding: 0;
    height: 100%;
    margin: 0;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    width: 100%;
  }
  .main-section .right-side .event-time {
    width: 95%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
  }
  .main-section .right-side .event-time p {
    letter-spacing: 12px;
    font-size: 6vw;
  }
  .main-section .right-side .btn-register {
    width: 95%;
    padding: 0;
    font-size: 7vw;
    line-height: normal;
    height: 15vw;
    margin-top: 100px;
  }
  .main-section .right-side .social-media {
    width: auto;
    display: block;
  }
  .main-section .right-side .btn-social {
    display: inline-block;
    margin-bottom: 40px;
  }
  .main-section .right-side .btn-social:first-child {
    margin-right: 30px;
  }
  .main-section .right-side .btn-social img {
    width: 30vw;
  }
}

@media screen and (max-width: 660px) {
  .main-section .right-side .top-img {
    width: 90vw;
    height: 40vw;
  }
}

@media screen and (max-width: 480px) {
  .main-section .right-side {
    padding-top: 19vw;
  }
}

@media screen and (max-width: 420px) {
  .main-section .right-side {
    padding-top: 23vw;
  }
}

@media screen and (max-width: 360px) {
  .main-section .right-side {
    padding-top: 32vw;
  }
}

/******************************* Home Page Start *********************************/
.navbar {
  width: 100%;
  background: #fff;
  font-family: "Poppins", sans-serif;
  padding: 0 20px;
  position: relative;
  z-index: 2;
}

.navbar-wrapper {
  max-width: 950px;
  margin: 0 auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  max-height: 47px;
}

.navbar-wrapper-item {
  list-style: none;
  -webkit-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
}

.navbar-wrapper-item:not(.navbar-wrapper-item:last-child) {
  position: relative;
}

.navbar-wrapper-item::after {
  content: "";
  position: absolute;
  right: 0;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  background: #dd105c;
  height: 9px;
  width: 1px;
}

.navbar-wrapper-item a {
  display: block;
  padding: 12px 0;
  text-decoration: none;
  color: #dd105c;
  text-align: center;
  -webkit-transition: all 0.2s linear;
  transition: all 0.2s linear;
  font-style: normal;
  font-weight: 600;
  font-size: 16px;
  line-height: 24px;
  text-transform: uppercase;
  background: #fff;
  font-family: inherit;
  z-index: 2;
}

.navbar-wrapper-item a.active,
.navbar-wrapper-item a:hover {
  -webkit-box-shadow: 0 4px 9px rgba(0, 0, 0, 0.1);
  box-shadow: 0 4px 9px rgba(0, 0, 0, 0.1);
  padding: 26px 0 14px 0;
  border-bottom-right-radius: 20px;
  border-bottom-left-radius: 20px;
  color: #2f2f30;
  font-size: 18px;
  line-height: 27px;
}

#welcome-section {
  width: 100%;
  padding: 25px 20px 40px 20px;
  background: #e22276;
  margin-top: 4px;
}

#welcome-section .stores {
  max-width: calc(1440px - 83px * 2);
  margin: 0 auto;
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 300px 1fr;
  grid-template-columns: 1fr 300px 1fr;
}

#welcome-section .stores-left_side {
  padding-right: 50px;
  margin-top: -60px;
}

#welcome-section .stores-right_side {
  padding-left: 50px;
  margin-top: -60px;
}

#welcome-section .stores .fest-logo img {
  width: 303px;
  height: 147px;
  -o-object-fit: contain;
  object-fit: contain;
}

#welcome-section .stores-link {
  width: 88px;
  height: 88px;
  background: #e33d51;
  display: -ms-grid;
  display: grid;
  place-items: center;
  border-radius: 50%;
  font-family: "Roboto", sans-serif;
  text-decoration: none;
  -webkit-box-shadow: 0 4px 10px -5px rgba(0, 0, 0, 0.25);
  box-shadow: 0 4px 10px -5px rgba(0, 0, 0, 0.25);
  color: #ffffff;
  -webkit-transition: all 0.2s linear;
  transition: all 0.2s linear;
  position: relative;
  z-index: 1;
}

#welcome-section .stores-link:hover {
  background: #ffffff;
  color: #e33d51;
}

#welcome-section .stores-link:hover .stores-link-subtitle {
  opacity: 1;
  visibility: visible;
}

#welcome-section .stores-link-title {
  font-style: normal;
  font-weight: normal;
  font-size: 12px;
  line-height: 14px;
  opacity: 0.6;
  color: inherit;
  text-transform: uppercase;
}

#welcome-section .stores-link-subtitle {
  text-transform: uppercase;
  position: absolute;
  bottom: -5px;
  left: 50%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
  opacity: 0;
  visibility: hidden;
  font-style: normal;
  font-weight: bold;
  font-size: 10px;
  line-height: 12px;
  color: #ffffff;
  text-shadow: 0 4px 4px rgba(0, 0, 0, 0.25);
  white-space: nowrap;
  -webkit-transition: all 0.2s linear;
  transition: all 0.2s linear;
  height: 20px;
  padding-top: 38px;
}

#welcome-section .stores-wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

#welcome-section .main-view {
  display: -ms-grid;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  padding: 0 2.6vw;
  overflow-y: hidden;
  height: 100%;
  margin-top: -30px;
  padding-top: 30px;
}

#welcome-section .main-view .welcome-modal {
  background: #261b1f;
  border-radius: 12px;
  padding: 20px 32px 26px 32px;
  color: #fff;
  font-family: "Roboto", sans-serif;
  margin: 33px 10px 0 20px;
}

#welcome-section .main-view .welcome-modal.hidden {
  -webkit-animation: hide 0.6s ease-in-out 0s 1 forwards;
  animation: hide 0.6s ease-in-out 0s 1 forwards;
}

#welcome-section .main-view .welcome-modal-header {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: end;
  -ms-flex-pack: end;
  justify-content: flex-end;
  margin-bottom: 25px;
}

#welcome-section .main-view .welcome-modal-header .btn-close {
  width: 17px;
  height: 16px;
  background: #ffffff;
  border-radius: 2px;
  cursor: pointer;
  position: relative;
  z-index: 2;
}

#welcome-section .main-view .welcome-modal-body {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  color: #fff;
}

#welcome-section .main-view .welcome-modal-body h1 {
  font-style: normal;
  font-weight: 500;
  font-size: 24px;
  line-height: 28px;
  margin-bottom: 11px;
}

@media screen and (min-width: 1000px) {
  #welcome-section .main-view {
    margin-bottom: 20px;
  }
}

#welcome-section .main-view .welcome-modal-body p {
  font-style: normal;
  font-weight: normal;
  font-size: 16px;
  line-height: 19px;
  text-align: center;
}

#welcome-section .main-view .welcome-modal-body h1,
#welcome-section .main-view .welcome-modal-body p {
  font-family: inherit;
}

#welcome-section .main-view-left {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: (minmax(50%, 1fr)) [auto-fill];
  grid-template-columns: repeat(auto-fill, minmax(50%, 1fr));
}

/* #welcome-section .main-view-left img:hover {
  -webkit-animation: tilt 0.3s ease forwards;
  animation: tilt 0.3s ease forwards;
} */

#welcome-section .main-view-left .svg-1 {
  margin: 5.9vw 0 0 3.1vw;
  width: 220px;
  height: 220px;
}

#welcome-section .main-view-left .svg-2 {
  margin-left: 30px;
  margin-top: -10px;
  width: 190px;
  height: 190px;
}

#welcome-section .main-view-left .svg-3 {
  margin-left: 6vw;
  width: 207px;
  height: 172px;
}

#welcome-section .main-view-left .svg-4 {
  margin-left: 2.6vw;
  margin-top: -7.8vw;
  width: 203px;
  height: 166px;
}

#welcome-section .main-view-right {
  -ms-grid-column: 3;
  -ms-grid-column-span: 1;
  grid-column: 3 / 4;
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: (minmax(50%, 1fr)) [auto-fill];
  grid-template-columns: repeat(auto-fill, minmax(50%, 1fr));
}

/* #welcome-section .main-view-right img:hover {
  -webkit-animation: tilt 0.3s ease forwards;
  animation: tilt 0.3s ease forwards;
} */

#welcome-section .main-view-right .svg-1 {
  margin-top: -1.95vw;
  width: 230px;
  height: 180px;
}

#welcome-section .main-view-right .svg-2 {
  margin-top: 3.5vw;
  margin-left: -3.9vw;
  width: 200px;
  height: 200px;
}

#welcome-section .main-view-right .svg-3,
#welcome-section .main-view-right .svg-4 {
  width: 201px;
  height: 164px;
}

#welcome-section .main-view-right .svg-3 {
  margin-top: -11.1vw;
}

#welcome-section .main-view-right .svg-4 {
  margin-top: -4.6vw;
  margin-left: -5.2vw;
}

#welcome-section .main-view-bottom {
  -ms-grid-column: 1;
  -ms-grid-column-span: 3;
  grid-column: 1/4;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  margin-top: -140px;
}

#welcome-section .main-view-bottom img:first-child {
  width: 230px;
  height: 200px;
  margin-right: 30px;
}

#welcome-section .main-view-bottom img:last-child {
  margin-top: 40px;
}

/* #welcome-section .main-view-bottom img:hover {
  -webkit-animation: tilt 0.3s ease forwards;
  animation: tilt 0.3s ease forwards;
} */

.action-buttons {
  position: absolute;
  right: 0;
  bottom: 130px;
  width: 234px;
  height: 71px;
  background: #ffffff;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  font-family: Poppins;
  font-style: normal;
  font-weight: 500;
  font-size: 20px;
  line-height: 35px;
  color: #000000;
}

.action-buttons #login,
.action-buttons #register {
  font-family: "Poppins";
  font-style: normal;
  font-weight: 500;
  font-size: 20px;
  line-height: 35px;
  color: #000000;
  text-decoration: none;
  -webkit-transition: all 0.2s linear;
  transition: all 0.2s linear;
}

.action-buttons #login:hover,
.action-buttons #register:hover {
  color: #dd105c;
}

.action-buttons.registered {
  -ms-flex-pack: distribute;
  justify-content: space-around;
}

.action-buttons.registered #id_code {
  font-family: "Poppins";
  font-style: normal;
  font-weight: 300;
  font-size: 16px;
  line-height: 28px;
  color: #98999a;
}

.action-buttons.registered #btn_login {
  width: 100px;
  height: 34px;
  background: #261b1f;
  font-style: normal;
  font-weight: 500;
  font-size: 16px;
  line-height: 28px;
  color: #ffffff;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  text-decoration: none;
  -webkit-transition: all 0.2s linear;
  transition: all 0.2s linear;
  border: 1px solid #261b1f;
  text-transform: uppercase;
}

.action-buttons.registered #btn_login:hover {
  background-color: #fff;
  color: #261b1f;
}

@-webkit-keyframes hide {
  0% {
    opacity: 1;
  }
  50% {
    -webkit-transform: translateY(400px);
    transform: translateY(400px);
  }
  100% {
    opacity: 0;
    max-height: 0;
    -webkit-animation: remove 0.1s linear;
    animation: remove 0.1s linear;
    -webkit-transform: scale(0);
    transform: scale(0);
  }
}

@keyframes hide {
  0% {
    opacity: 1;
  }
  50% {
    -webkit-transform: translateY(400px);
    transform: translateY(400px);
  }
  100% {
    opacity: 0;
    max-height: 0;
    -webkit-animation: remove 0.1s linear;
    animation: remove 0.1s linear;
    -webkit-transform: scale(0);
    transform: scale(0);
  }
}

@-webkit-keyframes remove {
  from {
    display: -webkit-box;
    display: flex;
  }
  to {
    display: none;
  }
}

@keyframes remove {
  from {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
  to {
    display: none;
  }
}

/* @-webkit-keyframes tilt {
  0% {
    -webkit-transform: translate(1px, 1px) rotate(0deg);
    transform: translate(1px, 1px) rotate(0deg);
  }
  10% {
    -webkit-transform: translate(-1px, -2px) rotate(-1deg);
    transform: translate(-1px, -2px) rotate(-1deg);
  }
  20% {
    -webkit-transform: translate(-3px, 0px) rotate(1deg);
    transform: translate(-3px, 0px) rotate(1deg);
  }
  30% {
    -webkit-transform: translate(3px, 2px) rotate(0deg);
    transform: translate(3px, 2px) rotate(0deg);
  }
  40% {
    -webkit-transform: translate(1px, -1px) rotate(1deg);
    transform: translate(1px, -1px) rotate(1deg);
  }
  50% {
    -webkit-transform: translate(-1px, 2px) rotate(-1deg);
    transform: translate(-1px, 2px) rotate(-1deg);
  }
  60% {
    -webkit-transform: translate(-3px, 1px) rotate(0deg);
    transform: translate(-3px, 1px) rotate(0deg);
  }
  70% {
    -webkit-transform: translate(3px, 1px) rotate(-1deg);
    transform: translate(3px, 1px) rotate(-1deg);
  }
  80% {
    -webkit-transform: translate(-1px, -1px) rotate(1deg);
    transform: translate(-1px, -1px) rotate(1deg);
  }
  90% {
    -webkit-transform: translate(1px, 2px) rotate(0deg);
    transform: translate(1px, 2px) rotate(0deg);
  }
  100% {
    -webkit-transform: translate(1px, -2px) rotate(-1deg);
    transform: translate(1px, -2px) rotate(-1deg);
  }
}

@keyframes tilt {
  0% {
    -webkit-transform: translate(1px, 1px) rotate(0deg);
    transform: translate(1px, 1px) rotate(0deg);
  }
  10% {
    -webkit-transform: translate(-1px, -2px) rotate(-1deg);
    transform: translate(-1px, -2px) rotate(-1deg);
  }
  20% {
    -webkit-transform: translate(-3px, 0px) rotate(1deg);
    transform: translate(-3px, 0px) rotate(1deg);
  }
  30% {
    -webkit-transform: translate(3px, 2px) rotate(0deg);
    transform: translate(3px, 2px) rotate(0deg);
  }
  40% {
    -webkit-transform: translate(1px, -1px) rotate(1deg);
    transform: translate(1px, -1px) rotate(1deg);
  }
  50% {
    -webkit-transform: translate(-1px, 2px) rotate(-1deg);
    transform: translate(-1px, 2px) rotate(-1deg);
  }
  60% {
    -webkit-transform: translate(-3px, 1px) rotate(0deg);
    transform: translate(-3px, 1px) rotate(0deg);
  }
  70% {
    -webkit-transform: translate(3px, 1px) rotate(-1deg);
    transform: translate(3px, 1px) rotate(-1deg);
  }
  80% {
    -webkit-transform: translate(-1px, -1px) rotate(1deg);
    transform: translate(-1px, -1px) rotate(1deg);
  }
  90% {
    -webkit-transform: translate(1px, 2px) rotate(0deg);
    transform: translate(1px, 2px) rotate(0deg);
  }
  100% {
    -webkit-transform: translate(1px, -2px) rotate(-1deg);
    transform: translate(1px, -2px) rotate(-1deg);
  }
} */

/******************************* Home Page End *********************************/
/******************************* Stage Page Start *********************************/
.live-room {
  background: #e22276;
  display: -ms-grid;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  margin-top: 2px;
  padding-bottom: 20px;
}

.live-room #fest-logo {
  width: 303px;
  height: 147px;
  -ms-grid-column: 1;
  -ms-grid-column-span: 3;
  grid-column: 1 / 4;
  -ms-grid-column-align: center;
  justify-self: center;
}

.live-room .live-broadcast {
  -ms-grid-column: 1;
  -ms-grid-column-span: 3;
  grid-column: 1/4;
  display: -ms-grid;
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  grid-gap: 20px;
  margin-top: 26px;
}

.live-room .live-broadcast .users-view {
  margin-left: 56px;
}

.live-room .live-broadcast .users-view img {
  -o-object-fit: contain;
  object-fit: contain;
}

/*Chat Global Css */
.chat-zone {
  -ms-grid-column: 2;
  -ms-grid-column-span: 10;
  grid-column: 2/12;
  width: 100%;
  -ms-grid-column-align: center;
  justify-self: center;
  font-family: "Poppins", sans-serif;
  max-width: 448px;
}

.chat-zone.on-social-zone {
  -ms-grid-column: 3;
  -ms-grid-column-span: 1;
  grid-column: 3 / 4;
  margin-top: -120px;
  margin-left: -100px;
  position: relative;
}

.chat-zone.on-social-zone .rotated-text {
  position: absolute;
  right: -75px;
  top: 70px;
  -webkit-transform: rotate(-90deg);
  transform: rotate(-90deg);
  font-family: "Poppins", sans-serif;
  font-style: normal;
  font-weight: 600;
  font-size: 20px;
  line-height: 30px;
  color: #ffffff;
}

.chat-zone.on-communication {
  position: relative;
  margin-top: 44px;
}

.chat-zone.on-communication .rotated-text {
  position: absolute;
  right: -70px;
  top: 50px;
  -webkit-transform: rotate(-90deg);
  transform: rotate(-90deg);
  font-family: "Poppins", sans-serif;
  font-style: normal;
  font-weight: 600;
  font-size: 20px;
  line-height: 30px;
  color: #ffffff;
}

.chat-zone-title {
  font-family: inherit;
  font-style: normal;
  font-weight: 600;
  font-size: 30px;
  line-height: 45px;
  color: #000000;
}

.chat-zone-subtitle {
  font-style: italic;
  font-weight: 600;
  font-size: 24px;
  line-height: 36px;
  font-family: inherit;
  color: #000000;
  text-transform: uppercase;
}

.chat-zone-info {
  margin-top: 46px;
  font-family: inherit;
  font-style: normal;
  font-weight: 500;
  font-size: 20px;
  line-height: 30px;
  color: #000000;
}

.chat-zone-chat {
  margin-top: 14px;
  padding: 46px 20px 21px 18px;
  background: #fad5e2;
  border-radius: 34px;
  height: 404px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}

.chat-zone-chat .wrapper {
  overflow-y: auto;
  max-height: calc(100% - 35px);
  scrollbar-width: thin;
  scrollbar-color: #e22276 transparent;
}

.chat-zone-chat .wrapper::-webkit-scrollbar {
  background: transparent;
  margin: 0;
  width: 4px;
}

.chat-zone-chat .wrapper::-webkit-scrollbar-thumb {
  background: #e22276;
  border-radius: 3px;
}

.chat-zone-chat-msg {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  margin-bottom: 15px;
}

.chat-zone-chat-msg .user {
  -webkit-box-flex: 0.1;
  -ms-flex: 0.1;
  flex: 0.1;
  padding: 0 20px 0 0;
  font-family: "Poppins", sans-serif;
  font-style: normal;
  font-weight: 600;
  font-size: 16px;
  line-height: 24px;
  color: #000000;
  text-transform: uppercase;
}

.chat-zone-chat-msg .user-msg {
  -webkit-box-flex: 0.9;
  -ms-flex: 0.9;
  flex: 0.9;
  padding-right: 30px;
  font-family: "Roboto", sans-serif;
  font-style: normal;
  font-weight: normal;
  font-size: 12px;
  line-height: 14px;
  color: #000000;
}

.chat-zone-chat .form-group {
  -ms-flex-item-align: end;
  align-self: flex-end;
  margin-bottom: -6px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

.chat-zone-chat .form-group input[type="text"] {
  -webkit-box-flex: 0.9;
  -ms-flex: 0.9;
  flex: 0.9;
  height: 27px;
  background: #fff;
  margin-right: 7px;
  padding: 0 10px;
  color: #2f2f30;
  font-size: 14px;
  caret-color: #2f2f30;
}

.chat-zone-chat .form-group button {
  height: 27px;
  -webkit-box-flex: 0.1;
  -ms-flex: 0.1;
  flex: 0.1;
  border: 1px solid #2f2f30;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-radius: 7px;
  padding: 0 12px;
  background: transparent;
  font-family: "Poppins", sans-serif;
  font-style: normal;
  font-weight: 400;
  font-size: 14px;
  line-height: 21px;
  color: #2f2f30;
  text-transform: uppercase;
  cursor: pointer;
  -webkit-transition: all 0.2s linear;
  transition: all 0.2s linear;
}

.chat-zone-chat .form-group button:hover {
  background: #2f2f30;
  color: #fff;
}

/*Chat Global Css */
/******************************* Stage Page End *********************************/
/******************************* Social Zone Page Start *********************************/
.social-zone {
  background: #e22276;
  padding: 36px 44px;
  margin-top: 2px;
}

.social-zone-title {
  font-family: "Poppins", sans-serif;
  font-style: normal;
  font-weight: 700;
  font-size: 34px;
  line-height: 51px;
  color: #2f2f30;
  text-transform: uppercase;
  position: relative;
  margin-left: 42px;
}

.social-zone-title::after {
  position: absolute;
  content: "";
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  right: 152px;
  height: 1px;
  width: 61vw;
  background: rgba(255, 255, 255, 0.6);
}

.social-zone-container {
  display: -ms-grid;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
}

.social-zone-container-left {
  padding-top: 37px;
  -ms-grid-column: 1;
  -ms-grid-column-span: 1;
  grid-column: 1 / 2;
}

.social-zone-container-left img {
  width: 11.1vw;
  height: 9.3vw;
}

.social-zone-container-left .svg-1 {
  margin-left: 6vw;
}

.social-zone-container-left .svg-3 {
  margin-left: 40px;
}

.social-zone-container-center {
  margin-left: -10px;
  margin-top: -35px;
  position: relative;
  z-index: 2;
  -ms-grid-column: 2;
  -ms-grid-column-span: 1;
  grid-column: 2 / 3;
}

.social-zone-container-center img {
  -o-object-fit: cover;
  object-fit: cover;
  width: 70vmin;
}

.social-zone-container-right {
  padding-top: 37px;
  -ms-grid-column: 3;
  -ms-grid-column-span: 1;
  grid-column: 3 / 4;
}

.social-zone-container-right .svg-1 {
  margin-top: 20px;
}

.social-zone-container-right .svg-2 {
  -webkit-transform: translate(-30px, -40px);
  transform: translate(-30px, -40px);
}

.social-zone-container-right .svg-3 {
  -webkit-transform: translate(130px, -50px);
  transform: translate(130px, -50px);
}

.social-zone-container-right .svg-4 {
  -webkit-transform: translate(90px, -80px);
  transform: translate(90px, -80px);
}

.social-zone-container .workshops {
  -ms-grid-column: 1;
  -ms-grid-column-span: 2;
  grid-column: 1 / 3;
  margin-top: 10px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  position: relative;
  padding-left: 38px;
  grid-gap: 24px;
  max-width: 830px;
}

.social-zone-container .workshops .rotated-text {
  position: absolute;
  -webkit-transform: rotate(-90deg);
  transform: rotate(-90deg);
  left: -50px;
  bottom: 70px;
  font-family: "Poppins", sans-serif;
  font-style: normal;
  font-weight: 600;
  font-size: 20px;
  line-height: 30px;
  color: #ffffff;
  text-transform: uppercase;
}

.social-zone-container .workshops .workshop-card {
  font-family: "Poppins", sans-serif;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}

.social-zone-container .workshops .workshop-card:hover img {
  -webkit-transform: scale(1.25);
  transform: scale(1.25);
  -webkit-filter: saturate(2);
  filter: saturate(2);
}

.social-zone-container .workshops .workshop-card-title {
  background: #fff;
  font-style: normal;
  font-weight: bold;
  font-size: 18px;
  line-height: 27px;
  font-family: inherit;
  color: #e22276;
  padding: 0 7px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  height: 40px;
  text-transform: uppercase;
}

.social-zone-container .workshops .workshop-card-img {
  -ms-flex-item-align: center;
  align-self: center;
  margin-top: 12px;
  background: #2f2f30;
  border-radius: 32px;
  padding: 11px 13px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 100%;
  -webkit-transition: all 0.2s linear;
  transition: all 0.2s linear;
  overflow: hidden;
}

.social-zone-container .workshops .workshop-card-img img {
  -o-object-fit: cover;
  object-fit: cover;
  border-radius: 32px;
  width: 100%;
  height: 100%;
  -webkit-transition: all 0.2s linear;
  transition: all 0.2s linear;
}

/******************************* Social Zone Page End *********************************/
/******************************* Communication Page Start *********************************/
.communication {
  background: url(../../assets/background.png) no-repeat;
  background-size: cover;
  height: 903px;
  display: -ms-grid;
  display: grid;
  grid-template-columns: repeat(12, 1fr);
}

.communication .buttons {
  -ms-grid-column: 1;
  -ms-grid-column-span: 2;
  grid-column: 1/3;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  padding: 0 0 0 80px;
}

.communication .buttons .btn-return {
  width: 160px;
  height: 21px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  font-family: "Poppins", sans-serif;
  font-style: normal;
  font-weight: 600;
  font-size: 14px;
  line-height: 21px;
  margin-top: 25px;
  color: #ffffff;
  background: transparent;
  -webkit-transition: all 0.2s linear;
  transition: all 0.2s linear;
  cursor: pointer;
  padding: 8px 20px;
  text-decoration: none;
}

.communication .buttons .btn-return img,
.communication .buttons .btn-return p {
  -webkit-transition: all 0.2s linear;
  transition: all 0.2s linear;
}

.communication .buttons .btn-return:hover {
  -webkit-box-pack: start;
  -ms-flex-pack: start;
  justify-content: flex-start;
}

.communication .buttons .btn-return:hover img {
  -webkit-transform: translateX(-30px);
  transform: translateX(-30px);
  opacity: 0;
}

.communication .buttons .btn-return:hover P {
  -webkit-transform: translateX(-10px);
  transform: translateX(-10px);
}

.communication .buttons .press-for-live {
  width: 264px;
  margin-left: 15px;
  height: 73px;
  background: #e22276;
  padding: 0 50px;
  color: #fff;
  font-family: "Poppins", sans-serif;
  font-style: normal;
  font-weight: 600;
  font-size: 16px;
  line-height: 24px;
  margin-top: 110px;
  -webkit-transition: all 0.2s linear;
  transition: all 0.2s linear;
  cursor: pointer;
  position: relative;
  z-index: 2;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  text-align: center;
  text-decoration: none;
}

.communication .buttons .press-for-live::after {
  position: absolute;
  content: "";
  background: #fff;
  width: 100%;
  display: inline-block;
  top: 0;
  left: 0;
  z-index: -1;
  height: 0;
  -webkit-transition: all 0.2s linear;
  transition: all 0.2s linear;
}

.communication .buttons .press-for-live:hover {
  color: #e22276;
  background: transparent;
}

.communication .buttons .press-for-live:hover::after {
  height: 100%;
}

.communication .chat {
  -ms-grid-column: 8;
  -ms-grid-column-span: 4;
  grid-column: 8/12;
  margin-left: 9.3vw;
}

.communication .chat .user_v {
  margin-top: 20px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}

.communication .chat .user_v img:last-child {
  margin-top: -30px;
}

.communication .chat .user_v img:last-child {
  width: 381px;
  height: 211px;
}

.communication .chat .user_v img:first-child {
  width: 397px;
  height: 221px;
}

/******************************* Communication Page End *********************************/
.responsive-slider .stores-link {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.responsive-slider .swiper-slide {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 88px;
  height: 120px;
}

.responsive-slider .swiper-container {
  height: 158px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

.responsive-slider .swiper-pagination-bullet {
  display: inline-block;
  width: 24px;
  height: 1px;
  border-radius: 0;
  background: #fff;
}

.responsive-slider .swiper-pagination-bullet-active {
  opacity: 1;
  height: 3px;
}

.responsive-slider .swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet {
  margin: 0 12px;
}

.responsive-view {
  max-width: 500px;
  width: 100%;
  margin: 70px auto 0;
}

.responsive-view-svgs-1 img:first-child {
  -webkit-transform: translate(30px, 40px);
  transform: translate(30px, 40px);
  width: 214px;
  height: 175px;
}

.responsive-view-svgs-1 img:last-child {
  -webkit-transform: translate(0, -50px);
  transform: translate(0, -50px);
  width: 186.6px;
  height: 155.89px;
}

.responsive-view-svgs-2 img:nth-child(2) {
  width: 196px;
  height: 161px;
  -webkit-transform: translate(10px, -70px);
  transform: translate(10px, -70px);
}

.responsive-view-svgs-2 img:nth-child(1) {
  width: 223px;
  height: 182px;
  -webkit-transform: translate(70px, 60px);
  transform: translate(70px, 60px);
}

.responsive-view-svgs-2 img:last-child {
  width: 227px;
  height: 189px;
  -webkit-transform: matrix(-1, 0, 0, 1, 0, 0) translate(-220px, -10px);
  transform: matrix(-1, 0, 0, 1, 0, 0) translate(-220px, -10px);
}

.responsive-view-svgs-3 img {
  width: 196px;
  height: 161px;
  -webkit-transform: translate(0, -70px);
  transform: translate(0, -70px);
}

.responsive-view-svgs-4 img:first-child {
  width: 238px;
  height: 195px;
  -webkit-transform: translate(40px, -20px) matrix(-1, 0, 0, 1, 0, 0);
  transform: translate(40px, -20px) matrix(-1, 0, 0, 1, 0, 0);
}

.responsive-view-svgs-4 img:last-child {
  -webkit-transform: translate(-20px, -150px);
  transform: translate(-20px, -150px);
  width: 228px;
  height: 175px;
}

.responsive-view-svgs-5 img {
  width: 228px;
  height: 175px;
  transform: translate(120px, 0);
}

@media screen and (min-width: 722px) {
  .responsive-menu,
  .navbar-brand {
    display: none;
  }
}

.responsive-menu {
  position: absolute;
  top: 0;
  right: -100%;
  bottom: 0;
  height: 100vh;
  background-color: #e22276;
  z-index: 4;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-transition: all 0.2s linear;
  transition: all 0.2s linear;
}

.responsive-menu.active {
  left: 0;
  right: 0;
}

.responsive-menu-header {
  -ms-flex-item-align: start;
  align-self: flex-start;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: end;
  -ms-flex-pack: end;
  justify-content: flex-end;
  position: absolute;
  right: 39px;
  top: 22px;
}

.responsive-menu-header #btn-close {
  background-color: transparent;
  cursor: pointer;
  -webkit-user-select: none !important;
  -moz-user-select: none !important;
  -ms-user-select: none !important;
  user-select: none !important;
}

.responsive-menu ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

.responsive-menu ul li:not(:last-child) {
  margin-bottom: 60px;
}

.responsive-menu ul li {
  list-style: none;
}

.responsive-menu ul a {
  text-decoration: none;
  display: block;
  font-family: Poppins;
  font-style: normal;
  font-weight: 600;
  font-size: 16px;
  line-height: 24px;
  color: #ffffff;
}

/* Register Start */
.register-section {
  margin-top: 95px;
  margin-bottom: 230px;
  color: #fff;
  font-family: "Poppins";
}

/* Register End */
.register-section .register-wrapper {
  max-width: 800px;
  width: 100%;
  margin: 0 auto;
  padding: 0 20px;
}

.register-section .register-wrapper .register-title {
  text-align: center;
  font-family: "Poppins";
  font-style: normal;
  font-weight: 600;
  font-size: 34px;
  line-height: 49px;
  text-transform: uppercase;
  color: inherit;
}

.register-section .register-wrapper .register-form {
  margin-top: 80px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}

.register-section .register-wrapper .register-form .form-group {
  margin-bottom: 60px;
  position: relative;
}

.register-section .register-wrapper .register-form #btn_register {
  margin-top: 50px;
  width: 100%;
  background-color: #fff;
  font-family: "Poppins";
  font-style: normal;
  font-weight: 500;
  font-size: 18px;
  line-height: 22px;
  color: #2f2f30;
  mix-blend-mode: normal;
  padding: 19px;
  cursor: pointer;
  -webkit-transition: all 0.2s linear;
  transition: all 0.2s linear;
}

.register-section .register-wrapper .register-form #btn_register:hover {
  background-color: #2f2f30;
  color: #fff;
}

.register-section .register-wrapper .register-form .form-group .form-label {
  position: absolute;
  left: 0;
  -webkit-transition: all 0.2s linear;
  transition: all 0.2s linear;
  font-family: "Poppins";
  font-style: normal;
  font-weight: normal;
  font-size: 16px;
  line-height: 24px;
  color: #ffffff;
  -webkit-transition: all 0.3s linear;
  transition: all 0.3s linear;
  display: inline;
}

.register-section .register-wrapper .register-form .form-group .form-label.toTop {
  -webkit-transform: translateY(-15px);
  transform: translateY(-15px);
  font-size: 14px;
  line-height: normal;
}

.register-section .register-wrapper .register-form .form-group .form-input {
  background-color: transparent;
  width: 100%;
  padding: 8px 15px 8px 0;
  color: inherit;
  border-bottom: 1px solid;
  overflow: auto;
}

.checkbox {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  cursor: pointer;
  width: 100%;
}

.checkbox label {
  font-family: Poppins;
  font-style: normal;
  font-weight: 600;
  font-size: 16px;
  line-height: 24px;
  margin-left: 15px;
  color: inherit;
  cursor: pointer;
}

.checkbox input[type="checkbox"] {
  position: relative;
  opacity: 0;
  cursor: pointer;
  width: 28px;
  height: 28px;
}

.checkbox input[type="checkbox"] ~ span {
  position: absolute;
  width: 28px;
  height: 28px;
  background-color: #fff;
  cursor: pointer;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  z-index: -1;
  -webkit-transition: all 0.2s linear;
  transition: all 0.2s linear;
  border: 2px solid #fff;
}

.checkbox input[type="checkbox"]:checked ~ span {
  background-color: transparent;
  border: 2px solid #fff;
  color: #fff;
  background-image: url(../../assets/checkmark.png);
  background-position: center center;
  background-size: 15px;
  background-repeat: no-repeat;
}

/* Festival Calendar Start */

.festival-calendar-wrapper {
  padding: 0 80px;
  display: flex;
  justify-content: space-between;
  margin-bottom: 80px;
}

.festival-calendar-wrapper .festival-calendar-svg {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 1;
  margin-right: 100px;
}

.festival-calendar-wrapper .festival-calendar-svg img {
  width: 320px;
  height: 300px;
}

.festival-calendar-wrapper .festival-calendar {
  flex: 1;
}

.festival-calendar-wrapper .festival-calendar .calendar-info {
  font-family: "Poppins", sans-serif;
  color: #2f2f30;
}

.festival-calendar-wrapper .festival-calendar .calendar-info-title {
  width: 100%;
  height: 49px;
  background: #ffffff;
  display: flex;
  align-items: center;
  padding: 0 30px 0 31px;
  font-style: normal;
  font-weight: 600;
  font-size: 18px;
  line-height: 27px;
  font-family: inherit;
  color: inherit;
}

.festival-calendar-wrapper .festival-calendar .calendar-info-list {
  padding: 18px 0 0 47px;
}

.festival-calendar-wrapper .festival-calendar .calendar-info-list li {
  padding: 8px 0;
}

/* Festival Calendar End */

/* Azercell Start */

body.bg-color {
  background: #cc3366;
}

.header {
  padding: 80px 120px 30px 80px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.header .header-right {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.header .navbar-logo {
  width: 6.5vw;
  height: 6.5vw;
}

.header .header-right .fest-logo img {
  width: 30vw;
  height: 8.2vw;
}

.header .header-right .provider-logo img {
  width: 17vw;
  height: 5vw;
}

.header .header-right .header-divider {
  height: 9vw;
  background-color: #fff;
  width: 2px;
  margin: 0 30px;
}

.common-section {
  padding: 20px 120px 50px 80px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex: 1 1 100%;
  flex-basis: 100%;
}

.common-section .provider-side {
  flex: 0.4;
  display: flex;
  justify-content: center;
  flex-direction: column;
}

.common-section .provider-side #provider-img {
  width: 450px;
  margin-top: 70px;
}
.form-section {
  padding: 0 80px;
  display: flex;
  justify-content: space-between;
}

.form-section .provider-link {
  display: flex;
  align-self: start;
  margin-top: 80px;
}

.form-section .provider-link a {
  text-decoration: none;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 32px;
  color: #fff;
  font-weight: 500;
  font-family: "Poppins", sans-serif;
  transition: all 0.2s linear;
}

.form-section .provider-link a:hover {
  color: #2f2f30;
}

.form-section .provider-link img {
  width: 50px;
  margin-right: 12px;
}

.common-section .lottery-side {
  flex: 0.6;
  display: flex;
  flex-direction: column;
  margin-left: 40px;
}

.common-section .lottery-side .live {
  height: 32.7vw;
  width: 50vw;
  align-self: flex-end;
  background-color: #333333;
}

/* Lottery Form Start */
.lottery-form {
  width: 876px;
  padding: 20px 0 0 60px;
  user-select: none;
  margin: 50px auto 10px;
  display: flex;
  flex-direction: column;
}

.lottery-form .toggle-button {
  width: 550px;
  align-self: center;
  margin-right: -150px;
  background-color: #fff;
  color: #cc3366;
  font-size: 32px;
  letter-spacing: 4px;
  text-transform: uppercase;
  text-decoration: none;
  padding: 20px 38px;
  border-radius: 999px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 500;
  font-family: "Poppins", sans-serif;
  border: 2px solid #fff;
  transition: all 0.2s linear;
  cursor: pointer;
}

@media screen and (max-width: 1010px) {
  .lottery-form {
    width: 100vw;
    padding: 20px 40px 0 40px;
  }
  .lottery-form .toggle-button {
    width: 100%;
  }
}

.lottery-form .toggle-button:hover {
  background-color: #cc3366;
  color: #fff;
}

.lottery-form .form-wrapper {
  padding: 80px 0 0 0;
  /* margin-top: 200px; */
  height: 0;
  overflow-y: hidden;
  opacity: 0;
  visibility: hidden;
  -webkit-transition: all 0.3s linear;
  transition: all 0.3s linear;
}

.lottery-form .form-wrapper.show {
  margin-top: 20px;
  margin-bottom: 200px;
  height: auto;
  overflow-y: auto;
  opacity: 1;
  visibility: visible;
}

.lottery-form .form-wrapper .questions {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}

.lottery-form .form-wrapper .question {
  margin-bottom: 120px;
}

.lottery-form .form-wrapper .question .question-text {
  font-family: "Poppins";
  font-style: normal;
  font-weight: normal;
  font-size: 20px;
  line-height: 35px;
  margin-bottom: 40px;
  color: #ffffff;
}

.lottery-form .form-wrapper .question .answers {
  font-family: "Poppins";
  font-style: normal;
  font-weight: normal;
  font-size: 20px;
  line-height: 35px;
  color: #ffffff;
}

.lottery-form .form-wrapper .question .answers .answer {
  padding: 5px 0;
  cursor: pointer;
  margin-bottom: 5px;
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

.lottery-form .form-wrapper .question .answers .answer label {
  margin-left: 18px;
  cursor: pointer;
}

.lottery-form .form-wrapper .question .answers .answer input[type="radio"] {
  opacity: 0;
  border-radius: 50%;
  width: 29px;
  height: 29px;
}

.lottery-form .form-wrapper .question .answers .answer input[type="radio"] ~ span {
  position: absolute;
  display: block;
  background-color: transparent;
  border-radius: 50%;
  width: 29px;
  height: 29px;
  top: 50%;
  left: 0;
  border: 1px solid #fff;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  -webkit-transition: all 0.2s linear;
  transition: all 0.2s linear;
}

.lottery-form .form-wrapper .question .answers .answer input[type="radio"]:checked ~ span {
  background-color: #fff;
}

.lottery-form .form-wrapper .form-submit-btn {
  width: 395px;
  height: 46px;
  font-family: "Poppins";
  font-style: normal;
  font-weight: 600;
  font-size: 20px;
  line-height: 35px;
  color: #000000;
  background: #ffffff;
  -webkit-transition: all 0.3s linear;
  transition: all 0.3s linear;
  text-transform: uppercase;
  cursor: pointer;
}

.lottery-form .form-wrapper .form-submit-btn:hover {
  background-color: #2f2f30;
  color: #fff;
}

@media screen and (max-width: 510px) {
  .lottery-form {
    font-size: 14px;
    line-height: normal;
  }
  .lottery-form * {
    font-size: inherit;
    line-height: inherit;
  }
  .lottery-form .form-submit-btn {
    width: 100% !important;
  }
}

/* Lottery Form End */

/* Azercell End */

.modal-register {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 100vh;
  background-color: #643343b2;
  z-index: 10;
  transform: scale(0);
  opacity: 0;
  visibility: hidden;
}

.modal-register.open-modal {
  transform: scale(1);
  opacity: 1;
  visibility: visible;
}

.modal-register.open-modal .form-modal {
  opacity: 1;
}
.modal-register.open-modal .form-modal .provider-form {
  opacity: 1;
}

.modal-register .form-modal {
  width: 100vw;
  height: 100vh;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  transition: all 0.3s linear;
}

.modal-register .form-modal .provider-form {
  width: 100%;
  max-width: 1000px;
  height: 620px;
  margin: 0 auto;
  border-radius: 40px;
  background-color: #fff;
  opacity: 0;
  transition: all 0.3s linear;
}

.modal-register .form-modal .provider-form .modal-header {
  height: 90px;
  background-color: #cc3366;
  border: 7px solid #fff;
  border-radius: 40px;
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
}

.modal-register .form-modal .provider-form .modal-body {
  border: 7px solid #cc3366;
  height: 530px;
  border-top: 0;
  border-radius: 40px;
  border-top-left-radius: 0;
  border-top-right-radius: 0;
  padding: 40px 80px;
}

.modal-register .form-modal .provider-form .modal-body .field-wrapper {
  padding: 10px;
  background-color: #f2cad7;
  color: #cc3366;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  font-weight: 500;
  font-family: "Poppins", sans-serif;
  margin-bottom: 12px;
}

.modal-register .form-modal .provider-form .modal-body .field-wrapper .form-input {
  flex: 1;
  background-color: transparent;
  font-size: inherit;
  font-weight: inherit;
  font-family: inherit;
  color: inherit;
}

.modal-register .form-modal .provider-form .modal-body .field-wrapper .form-label {
  text-transform: uppercase;
  padding: 0 15px 0 0;
  font-family: inherit;
  font-size: inherit;
  font-weight: inherit;
}

.modal-register .form-modal .provider-form .modal-body .footer {
  margin-top: 70px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}

.modal-register .form-modal .provider-form .modal-body .footer .direct-link {
  text-decoration: none;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 24px;
  color: #cc3366;
  font-weight: 500;
  font-family: "Poppins", sans-serif;
  transition: all 0.2s linear;
  margin-bottom: 10px;
}
.modal-register .form-modal .provider-form .modal-body .footer .direct-link:hover {
  color: #2f2f30;
}

.modal-register .form-modal .provider-form .modal-body .footer .direct-link img {
  width: 34px;
  margin-right: 12px;
}

.modal-register .form-modal .provider-form .modal-body .footer .direct-text {
  font-size: 16px;
  font-weight: 400;
  font-family: "Poppins", sans-serif;
  color: #cc3366;
  margin-bottom: 15px;
}

.modal-register .form-modal .provider-form .modal-body .footer .btn-join {
  padding: 15px 20px;
  font-size: 28px;
  font-weight: 500;
  color: #fff;
  background-color: #cc3366;
  border-radius: 40px;
  max-width: 530px;
  width: 100%;
  margin: 0 auto;
  text-align: center;
  text-decoration: none;
  text-transform: uppercase;
  border: 2px solid #cc3366;
  font-family: "Poppins", sans-serif;
  transition: all 0.2s linear;
}

.modal-register .form-modal .provider-form .modal-body .footer .btn-join:hover {
  background-color: transparent;
  color: #cc3366;
}

body.modal_opened {
  height: 100vh;
  overflow-y: hidden;
}