/*---------------------------------------

  CUSTOM PROPERTIES ( VARIABLES )             

-----------------------------------------*/

:root {

  --white-color: #ffffff;

  --primary-color: #f8cb2e;

  --secondary-color: #2445cd;

  --section-bg-color: #f0f8ff;

  --custom-btn-bg-color: #2445cd;

  --custom-btn-bg-hover-color: #ffffff;

  --dark-color: #000000;

  --p-color: #717275;

  --border-color: #7fffd4;

  --link-hover-color: #2445cd;



  --body-font-family: "Outfit", sans-serif;



  --h1-font-size: 74px;

  --h2-font-size: 46px;

  --h3-font-size: 32px;

  --h4-font-size: 28px;

  --h5-font-size: 24px;

  --h6-font-size: 22px;

  --p-font-size: 18px;

  --btn-font-size: 14px;

  --copyright-font-size: 16px;



  --border-radius-large: 100px;

  --border-radius-medium: 20px;

  --border-radius-small: 10px;



  --font-weight-light: 300;

  --font-weight-normal: 400;

  --font-weight-bold: 700;

}



body {

  background-color: var(--white-color);

  font-family: var(--body-font-family);

  font-size: 16px; line-height: 25px; margin-bottom: 10px; font-weight: 500; color: #1c1c1c;

  margin: 0;

}



/*---------------------------------------

  TYPOGRAPHY               

-----------------------------------------*/



h2,

h3,

h4,

h5,

h6 {

  color: var(--dark-color);

}



h1,

h2,

h3,

h4,

h5,

h6 {

  font-weight: var(--font-weight-bold);

}



h1 {

  font-size: var(--h1-font-size);

}



h2 {

  font-size: var(--h2-font-size);

}



h3 {

  font-size: var(--h3-font-size);

}



h4 {

  font-size: var(--h4-font-size);

}



h5 {

  font-size: var(--h5-font-size);

}



h6 {

  font-size: var(--h6-font-size);

}



p {

  color: var(--p-color);

  font-size: var(--p-font-size);

  font-weight: var(--font-weight-light);

}



ul li {

  color: var(--p-color);

  font-size: var(--p-font-size);

  font-weight: var(--font-weight-light);

}



a,

button {

  touch-action: manipulation;

  transition: all 0.3s;

}



a {

  display: inline-block;

  color: var(--primary-color);

  text-decoration: none;

}



a:hover {

  color: var(--link-hover-color);

}



b,

strong {

  font-weight: var(--font-weight-bold);

}



.link-fx-1 {

  color: var(--white-color);

  position: relative;

  display: inline-flex;

  align-items: center;

  height: 32px;

  padding: 0 6px;

  text-decoration: none;

  -webkit-font-smoothing: antialiased;

  -moz-osx-font-smoothing: grayscale;

}



.link-fx-1:hover {

  color: var(--link-hover-color);

}



.link-fx-1:hover::before {

  transform: translateX(17px) scaleX(0);

  transition: transform 0.2s;

}



.link-fx-1:hover .icon circle {

  stroke-dashoffset: 200;

  transition: stroke-dashoffset 0.2s 0.1s;

}



.link-fx-1:hover .icon line {

  transform: rotate(-180deg);

}



.link-fx-1:hover .icon line:last-child {

  transform: rotate(180deg);

}





.link-fx-1::before {

  content: "";

  position: absolute;

  bottom: 0;

  left: 0;

  width: 100%;

  height: 1px;

  background-color: currentColor;

  transform-origin: right center;

  transition: transform 0.2s 0.1s;

}



.link-fx-1 .icon {

  position: absolute;

  right: 0;

  bottom: 0;

  transform: translateX(100%) rotate(90deg);

  font-size: 32px;

}



.icon {

  --size: 1em;

  height: var(--size);

  width: var(--size);

  display: inline-block;

  color: inherit;

  fill: currentColor;

  line-height: 1;

  flex-shrink: 0;

  max-width: initial;

}



.link-fx-1 .icon circle {

  stroke-dasharray: 100;

  stroke-dashoffset: 100;

  transition: stroke-dashoffset 0.2s;

}



.link-fx-1 .icon line {

  transition: transform 0.4s;

  transform-origin: 13px 15px;

}



.link-fx-1 .icon line:last-child {

  transform-origin: 19px 15px;

}



/*---------------------------------------

  SECTION               

-----------------------------------------*/

.section-padding {

  padding-top: 100px;

  padding-bottom: 100px;

}



.section-bg {

  background-color: var(--section-bg-color);

}



.section-overlay {

  background-color: var(--dark-color);

  position: absolute;

  top: 0;

  left: 0;

  pointer-events: none;

  width: 100%;

  height: 100%;

  opacity: 0.35;

}



.section-overlay + .container {

  position: relative;

}



.tab-content {

  background-color: var(--white-color);

  border-radius: var(--border-radius-medium);

  padding: 45px;

}



.nav-tabs {

  background-color: var(--section-bg-color);

  border-radius: var(--border-radius-large);

  border-bottom: 0;

  padding: 15px;

}



.nav-tabs .nav-link {

  border-radius: var(--border-radius-large);

  border: 0;

  padding: 15px 25px;

  transition: all 0.3s;

}



.nav-tabs .nav-link:first-child {

  margin-right: 15px;

}



.nav-tabs .nav-item.show .nav-link,

.nav-tabs .nav-link.active,

.nav-tabs .nav-link:focus,

.nav-tabs .nav-link:hover {

  background: var(--white-color);

  box-shadow: 0 1rem 3rem rgba(0, 0, 0, 0.175);

  color: var(--primary-color);

}



.nav-tabs h5 {

  color: var(--p-color);

  margin-bottom: 0;

}



.nav-tabs .nav-link.active h5,

.nav-tabs .nav-link:focus h5,

.nav-tabs .nav-link:hover h5 {

  color: var(--primary-color);

}



/*---------------------------------------

  CUSTOM ICON COLOR               

-----------------------------------------*/

.custom-icon {

  color: var(--secondary-color);

}



/*---------------------------------------

  CUSTOM BUTTON               

-----------------------------------------*/

.custom-btn {

  background: var(--custom-btn-bg-color);

  border: 2px solid transparent;

  border-radius: var(--border-radius-large);

  color: var(--white-color);

  font-size: var(--btn-font-size);

  font-weight: var(--font-weight-bold);

  line-height: normal;

  transition: all 0.3s;

  padding: 10px 20px;

}



.custom-btn:hover {

  background: var(--custom-btn-bg-hover-color);

  color: var(--dark-color);

}



.custom-border-btn {

  background: transparent;

  border: 2px solid var(--custom-btn-bg-color);

  color: var(--custom-btn-bg-color);

}



.navbar-expand-lg .navbar-nav .nav-link.custom-btn:hover,

.custom-border-btn:hover {

  background: var(--custom-btn-bg-hover-color);

  border-color: transparent;

  color: var(--white-color);

}



.custom-btn-bg-white {

  border-color: var(--white-color);

  color: var(--white-color);

}



/*---------------------------------------

  VIDEO              

-----------------------------------------*/

.video-wrap {

  z-index: -100;

}



.custom-video {

  position: absolute;

  top: 0;

  left: 0;

  object-fit: cover;

  width: 100%;

  height: 100%;

}



/*---------------------------------------

  SITE HEADER              

-----------------------------------------*/

.site-header {

  background-color: var(--primary-color);

  padding-top: 12px;

  padding-bottom: 12px;

}



/*---------------------------------------

  NAVIGATION              

-----------------------------------------*/

.sticky-wrapper {

  position: absolute;

  top: 0;

  right: 0;

  left: 0;

  margin-top: 51px;

}



.sticky-wrapper.is-sticky .navbar {

  background-color: var(--dark-color);

}

.head-outer {

  background: #000;

}



.navbar {

  background: #00000000;

  z-index: 9;

}



.navbar-brand,

.navbar-brand:hover {

  color: var(--white-color);

  font-size: var(--h5-font-size);

  font-weight: var(--font-weight-bold);

}



.navbar-expand-lg .navbar-nav .nav-link {

  border-radius: var(--border-radius-large);

  margin: 10px;

  padding: 10px 20px;

}



.navbar-nav .nav-link {

  display: inline-block;

  color: var(--white-color);

  font-size: var(--p-font-size);

  font-weight: var(--font-weight-normal);

  position: relative;

  padding-top: 15px;

  padding-bottom: 15px;

}



.navbar-nav .nav-link.active,

.navbar-nav .nav-link:hover {

  color: var(--secondary-color);

}



.navbar-toggler {

  border: 0;

  padding: 0;

  cursor: pointer;

  margin: 0;

  width: 30px;

  height: 35px;

  outline: none;

}



.navbar-toggler:focus {

  outline: none;

  box-shadow: none;

}



.navbar-toggler[aria-expanded="true"] .navbar-toggler-icon {

  background: transparent;

}



.navbar-toggler[aria-expanded="true"] .navbar-toggler-icon:before,

.navbar-toggler[aria-expanded="true"] .navbar-toggler-icon:after {

  transition: top 300ms 50ms ease, -webkit-transform 300ms 350ms ease;

  transition: top 300ms 50ms ease, transform 300ms 350ms ease;

  transition: top 300ms 50ms ease, transform 300ms 350ms ease,

    -webkit-transform 300ms 350ms ease;

  top: 0;

}



.navbar-toggler[aria-expanded="true"] .navbar-toggler-icon:before {

  transform: rotate(45deg);

}



.navbar-toggler[aria-expanded="true"] .navbar-toggler-icon:after {

  transform: rotate(-45deg);

}



.navbar-toggler .navbar-toggler-icon {

  background: var(--white-color);

  transition: background 10ms 300ms ease;

  display: block;

  width: 26px;

  height: 2px;

  position: relative;

}



.navbar-toggler .navbar-toggler-icon:before,

.navbar-toggler .navbar-toggler-icon:after {

  transition: top 300ms 350ms ease, -webkit-transform 300ms 50ms ease;

  transition: top 300ms 350ms ease, transform 300ms 50ms ease;

  transition: top 300ms 350ms ease, transform 300ms 50ms ease,

    -webkit-transform 300ms 50ms ease;

  position: absolute;

  right: 0;

  left: 0;

  background: var(--white-color);

  width: 26px;

  height: 2px;

  content: "";

}



.navbar-toggler .navbar-toggler-icon::before {

  top: -8px;

}



.navbar-toggler .navbar-toggler-icon::after {

  top: 8px;

}

.menu-active {

  color: #2445cd !important;

}

.faq-txt p {

  margin-bottom: 22px;

 

}



/*---------------------------------------

  HERO        

-----------------------------------------*/

.hero-section {

  position: relative;

  overflow: hidden;

  padding-top: 0px;

  height: calc(100vh - 70px);

}



.hero-section small {

  color: var(--white-color);

  text-transform: uppercase;

}



.hero-section .section-overlay {

  z-index: 2;

  opacity: 0.8;

}



.hero-section .container {

  position: relative;

  z-index: 2;

  height: 100%;

  padding-bottom: 50px;

}



/* .hero-section .container .row {

  height: 100%;

} */



.contact-form {



  width: 50%;



  margin: 50px auto;



  padding: 20px;



  border: 1px solid #ccc;



  border-radius: 8px;



}



.contact-form h2 {



  text-align: center;



}



.form-field {



  margin-bottom: 15px;



}



.form-field input, .form-field textarea {



  width: 100%;



  padding: 10px;



  font-size: 16px;



  border: 1px solid #ccc;



  border-radius: 5px;



}



.form-field textarea {



  resize: vertical;



  height: 150px;



}



.form-field button {



  width: 100%;



  padding: 10px;



  background-color: #2445cd;



  color: white;



  font-size: 16px;



  border: none;



  border-radius: 5px;



}



.form-field button:hover {



  background-color: #384681;



}



.address {



  text-align: center;



  margin-top: 20px;



  font-size: 16px;



}



.message {



  text-align: center;



  font-size: 18px;



  padding: 20px;



}



.success {



  color: green;



}



.error {



  color: red;



}



.frequently1 p {

  margin-bottom: 20px;

  border-bottom: 1px #eaeaea solid;

  padding-bottom: 20px;

}

.frequently1 h4 {margin: 20px 0;}

/*---------------------------------------

  ABOUT              

-----------------------------------------*/

.about-section {

  background-image: url("../images/edward-unsplash-blur.jpg");

  background-color: #704010;

  background-repeat: no-repeat;

  background-size: cover;

  position: relative;

}



.about-image {

  border-radius: var(--border-radius-medium);

  display: block;

}



.about-text-wrap {

  position: relative;

}



.about-text-icon {

  background: var(--primary-color);

  border-radius: 100%;

  font-size: var(--h3-font-size);

  width: 70px;

  height: 70px;

  line-height: 70px;

  text-align: center;

}



.about-text-info {

  backdrop-filter: blur(5px) saturate(180%);

  -webkit-backdrop-filter: blur(5px) saturate(180%);

  background-color: rgba(255, 255, 255, 0.75);

  border-radius: var(--border-radius-medium);

  border: 1px solid rgba(209, 213, 219, 0.3);

  position: absolute;

  bottom: 0;

  right: 0;

  left: 0;

  margin: 20px;

  padding: 35px;

}



/*---------------------------------------

  TICKET               

-----------------------------------------*/

.ticket-section {

  background-image: url("../images/nicholas-green-unsplash-blur.jpg");

  background-repeat: no-repeat;

  background-size: cover;

  position: relative;

  padding-top: 130px;

}



.ticket-form {

  background: var(--white-color);

  border-radius: var(--border-radius-medium);

  padding: 50px;

}



.ticket-form .form-check {

  position: relative;

  min-height: 52px;

  padding-left: 35px;

}



.ticket-form .form-check .form-check-label {

  display: block;

  position: absolute;

  top: 50%;

  left: 50%;

  transform: translate(-50%, -50%);

  margin-top: 12px;

  margin-left: 35px;

  width: 100%;

  height: 100%;

}



/*---------------------------------------

  ARTISTS              

-----------------------------------------*/

.artists-thumb {

  position: relative;

  overflow: hidden;

  margin-bottom: 30px;

}



.artists-image {

  border-radius: var(--border-radius-medium);

  display: block;

  width: 100%;

}



.artists-thumb:hover .artists-hover {

  transform: translateY(0);

  opacity: 1;

}



.artists-hover {

  background-color: var(--primary-color);

  background-color: rgba(248, 203, 46, 0.75);

  border-radius: var(--border-radius-medium);

  backdrop-filter: blur(5px) saturate(180%);

  -webkit-backdrop-filter: blur(5px) saturate(180%);

  margin: 20px;

  padding: 35px;

  transition: all 0.5s ease;

  transform: translateY(100%);

  position: absolute;

  bottom: 0;

  right: 0;

  left: 0;

  opacity: 0;

}



.artists-hover p strong {

  color: var(--white-color);

  display: inline-block;

  min-width: 180px;

  margin-right: 20px;

}



.artists-hover p a {

  color: var(--secondary-color);

}



.artists-hover p a:hover {

  color: var(--white-color);

}



.artists-hover hr {

  margin: 1.5rem 0;

}



/*---------------------------------------

  SCHEDULE              

-----------------------------------------*/

.schedule-section {

  background-image: url("../images/nainoa-shizuru-unsplash-blur.jpg");

  background-color: #242424;

  background-repeat: no-repeat;

  background-position: center;

  background-size: cover;

}

.table-responsive {

  filter: drop-shadow(2px 2px 4px #606060);

}



.schedule-table {

  border-radius: var(--border-radius-medium);

  position: relative;

  overflow: hidden;

}



ul.hiring-bx {

  padding: 0;

  margin: 0;



  color: #fff;

  padding: 20px 0;

  padding-left: 30px;

}

.hiring-bx li {

  font-size: 22px;

  font-weight: 600;

  color: #fff;

  line-height: 40px;

}

.schedule-table .bg-warning {

  background: #f0a5a5 !important;

}



.schedule-table thead th {

  background-color: var(--secondary-color);

}



.schedule-table th,

.schedule-table tr,

.schedule-table td {

  border-bottom-color: #363a3e;

  padding: 30px;

}



.schedule-table tr:last-child th,

.schedule-table tr:last-child td {

  border-bottom-color: transparent;

}



.schedule-table thead th {

  border-right: 1px solid #c7460a;

  border-bottom-color: transparent;

}



.schedule-table th + td {

  border-bottom: 0;

}



.schedule-table thead th:last-child {

  border-right-color: transparent;

}



.schedule-table .pop-background-image {

  background-image: url("../images/artists/joecalih-UmTZqmMvQcw-unsplash.jpg");

}



.schedule-table .rock-background-image {

  background-image: url("../images/artists/abstral-official-bdlMO9z5yco-unsplash.jpg");

}



.schedule-table .country-background-image {

  background-image: url("../images/artists/soundtrap-rAT6FJ6wltE-unsplash.jpg");

}



.table-background-image-wrap {

  background-repeat: no-repeat;

  background-position: center;

  background-size: cover;

  box-shadow: none;

  position: relative;

}



.schedule-table h3,

.schedule-table p {

  color: var(--white-color);

  position: relative;

  z-index: 2;

}



/*---------------------------------------

  PRICING              

-----------------------------------------*/

.pricing-thumb {

  border: 5px dotted var(--dark-color);

  border-radius: var(--border-radius-medium);

  position: relative;

  padding: 50px;

}



.pricing-thumb h3 small {

  display: inline-block;

  font-size: var(--p-font-size);

  margin-right: 15px;

}



.pricing-list {

  column-count: 2;

  padding-left: 20px;

}



.pricing-list-item {

  line-height: normal;

  margin-right: 10px;

  margin-bottom: 10px;

}



.pricing-tag {

  background-color: var(--secondary-color);

  border-radius: var(--border-radius-large);

  color: var(--white-color);

  font-weight: var(--font-weight-bold);

  text-align: center;

  display: flex;

  flex-direction: column;

  justify-content: center;

  align-items: center;

  width: 120px;

  height: 120px;

  position: absolute;

  top: 0;

  right: 0;

  margin: 20px;

}



.pricing-tag span {

  font-size: 180%;

  line-height: normal;

}



.pricing-thumb .link-fx-1 {

  color: var(--primary-color);

}



.pricing-thumb .link-fx-1:hover {

  color: var(--link-hover-color);

}



/*---------------------------------------

  CONTACT               

-----------------------------------------*/

.google-map {

  border-radius: var(--border-radius-medium);

}



/*---------------------------------------

  CUSTOM FORM               

-----------------------------------------*/

.custom-form .form-control {

  color: var(--p-color);

  margin-bottom: 24px;

  padding-top: 13px;

  padding-bottom: 13px;

  outline: none;

}



.custom-form button[type="submit"] {

  background: var(--custom-btn-bg-color);

  border: none;

  border-radius: var(--border-radius-large);

  color: var(--white-color);

  font-size: var(--p-font-size);

  font-weight: var(--font-weight-medium);

  transition: all 0.3s;

  margin-bottom: 0;

}



.custom-form button[type="submit"]:hover,

.custom-form button[type="submit"]:focus {

  background: var(--custom-btn-bg-hover-color);

  border-color: transparent;

}



/*---------------------------------------

  SITE FOOTER              

-----------------------------------------*/

.site-footer {

  background-color: var(--dark-color);

  position: relative;

  overflow: hidden;

  padding-bottom: 0px;

}



.site-footer-top {

  background-color: var(--secondary-color);

  background-image: url("../images/nainoa-shizuru-NcdG9mK3PBY-unsplash.jpg");

  background-repeat: no-repeat;

  margin-bottom: 70px;

  padding-top: 30px;

  padding-bottom: 30px;

}



.site-footer-bottom {

  border-top: 1px solid #1f1c1c;

  margin-top: 25px;

}



.site-footer-title {

  color: var(--primary-color);

}

.site-footer-link,

.copyright-text {

  font-size: 14px;

}



.site-footer-link,

.copyright-text {

  color: var(--white-color);

}

p.copyright-text {

  padding: 0;

  margin: 0;

  font-size: 14px;

  padding-top: 5px;

}

.site-footer-links {

  padding-left: 0;

  padding: 0;

  margin: 0;

}



.site-footer-link-item {

  list-style: none;

  display: inline-block;

  margin-right: 15px;

}



.copyright-text {

  font-size: var(--copyright-font-size);

}

h2{font-size: 28px; font-weight: 600;}

h3{font-size: 24px; font-weight: 600;}

h4{font-size: 20px; font-weight: 600;}

h5{font-size: 18px; font-weight: 600;}

h6{font-size: 16px; font-weight: 600;}

ul.term-con li {font-size: 15px; line-height: 25px; margin-bottom: 10px; font-weight: 500; color: #1c1c1c;}

p{font-size: 16px; line-height: 25px; margin-bottom: 10px; font-weight: 500; color: #1c1c1c;}

/*---------------------------------------

  SOCIAL ICON               

-----------------------------------------*/

.social-icon {

  margin: 0;

  padding: 0;

}



.social-icon-item {

  list-style: none;

  display: inline-block;

  vertical-align: top;

}



.social-icon-link {

  background: var(--secondary-color);

  border-radius: var(--border-radius-large);

  color: var(--white-color);

  font-size: var(--copyright-font-size);

  display: block;

  margin-right: 10px;

  text-align: center;

  width: 35px;

  height: 35px;

  line-height: 36px;

  transition: background 0.2s, color 0.2s;

}



.social-icon-link:hover {

  background: var(--primary-color);

  color: var(--white-color);

}



.social-icon-link span {

  display: block;

}



.social-icon-link span:hover::before {

  animation: spinAround 2s linear infinite;

}



@keyframes spinAround {

  from {

    transform: rotate(0deg);

  }

  to {

    transform: rotate(360deg);

  }

}


.whats-footer img {
  width: 60px;
  height: auto;
}
.whats-footer {
  position: fixed;
  right: 15px;
  bottom: 20px;
  z-index: 9999;
  text-align: center;
}
.whats-footer span {
  display: block;
}
.whats-footer span {
  display: block;
  color: #fff;
  font-size: 10px;
}
/*---------------------------------------

  RESPONSIVE STYLES               



-----------------------------------------*/



@media screen and (max-width: 1400px) {

  .hero-section .container {

    height: auto;

  }

}

@media screen and (max-width: 1024px) {

  .navbar-expand-lg .navbar-nav .nav-link {

    border-radius: var(--border-radius-large);

    margin: 7px;

    padding: 10px 8px;

    font-size: 14px;

  }

}

@media screen and (max-width: 991px) {

  h1 {

    font-size: 26px;

  }



  h2 {

    font-size: 24px;

  }



  h3 {

    font-size: 22px;

  }



  h4 {

    font-size: 20px;

  }



  h5 {

    font-size: 18px;

  }



  h6 {

    font-size: 16px;

  }



  .section-padding {

    padding-top: 50px;

    padding-bottom: 50px;

  }



  .navbar {

    background-color: var(--dark-color);

  }



  .navbar-expand-lg .navbar-nav {

    padding-bottom: 30px;

  }



  .navbar-expand-lg .navbar-nav .nav-link {

    padding: 0;

  }

  .head-outer img {

    width: 170px;

}



  .hero-section {

    padding-top: 150px;

  }



  .pricing-thumb {

    padding: 35px;

  }



  .schedule-table h3 {

    font-size: 22px;

  }



  .schedule-table th {

    padding: 20px;

  }



  .schedule-table tr,

  .schedule-table td {

    padding: 25px;

  }



  .ticket-section {

    padding-top: 130px;

  }



  .ticket-form {

    padding: 30px;

  }

}



@media screen and (max-width: 767px) {

  .custom-btn {

    font-size: 11px;

    padding: 8px 5px;

  }

  .cbox1 img {

    width: 60px;

  }

  a.btn.earnbt {

    width: 100%;

    padding: 13px;

    font-size: 15px;

  }

  .site-footer-bottom .d-flex {

    flex-direction: column;

  }

  .site-footer .d-flex {

    flex-direction: column;

}

}



@media screen and (max-width: 480px) {

  h1 {

    font-size: 30px;

  }

  .hiring-bx li {

    font-size: 18px;

    font-weight: 600;

    color: #fff;

    line-height: 36px;

  }

  .contact-form {

    width: 100%;

    margin-top: 10px;

  }

  

}

