@import 'owl.carousel.css';
@import 'component.css';
@import url('https://fonts.googleapis.com/css?family=Poppins&display=swap');
@import url('https://fonts.googleapis.com/css?family=Montserrat:700&display=swap');


@font-face {
  font-family: 'kghappy';
  /* IE9 Compat Modes */
  src: url('../fonts/kghappy.ttf') format('truetype');
}

@font-face {
  font-family: 'kghappysolid';
  /* IE9 Compat Modes */
  src: url('../fonts/kghappysolid.ttf') format('truetype');
}

@font-face {
  font-family: 'kghappyshadows';
  /* IE9 Compat Modes */
  src: url('../fonts/kghappyshadows.ttf') format('truetype');
}

body {
  font-family: 'Poppins', sans-serif;
}

h1,
h2,
h3,
h4,
h5,
h6 {

  font-family: 'kghappy', cursive;
}
/* ------------------- mobile menu css ------------------*/
/* ------------------- mobile menu css ------------------*/
button#showLeft {
  background  : transparent;
  border-color: transparent;
}

button#showLeft img {
  width: 30px;
}

button#showLeft:focus {
  outline   : none;
  box-shadow: none;
}

button.cbpbtn {
  font-size   : 24px;
  font-weight : 600;
  margin      : 10px 15px;
  color       : #fff;
  background  : transparent;
  border-color: transparent;
}

.cbp-spmenu-left.cbp-spmenu-open {
  z-index: 1031;
}

button.cbpbtn:focus {
  box-shadow: none;
  outline   : none;
}

.slide-logo {
  padding  : 0.2rem 0.5rem !important;
  display  : block;
  max-width: 70px;
  position : absolute;
  top      : 8px;
  left     : 0;
  z-index  : 2;
}


.slide-category a:hover {
  background     : #eb3a68;
  color          : #fff;
  text-decoration: none;
}

.slide-link img {
  width: 20px;
  ;
}

.slide-link a {
  padding: 0rem 0.2rem 0rem;
}

.slide-link ul,
.slide-link h5 {
  padding-left: 1rem;
}

.slide-link h5 {
  color        : #fff;
  border-top   : 1px solid rgba(255, 255, 255, 0.2);
  padding-top  : 1rem;
  margin-bottom: 1rem;
}

ul.slide-contact {
  list-style-type: none;
}

.slide-contact i.btn-primary:focus {
  font-size: 0.8rem;
}

.slide-contact li {
  font-size    : 0.8rem;
  margin-bottom: 0.5rem;

  .whatsapp-btn a {
    background: #00d06b;
    color     : #fff;
    font-size : 13px;
  }
}

.test {
  padding: 2rem 0rem;
}

.testbox {
  padding: 2rem;
  border : 1px solid #ececec;
}

.testbox p {
  color      : #666666;
  text-align : justify;
  line-height: 1.9rem;
}

.testname {
  position: relative;
}

.testname::before {
  content   : '';
  position  : absolute;
  background: #000;
  width     : 30px;
  height    : 1px;
  left      : 100px;
  top       : 13px;
}

.testbox i.fas {
  color: #ef8632;
}

.cbp-spmenu-vertical a {
  /* border-bottom: 1px solid #258ecd; */
  padding         : 0.5rem 0.8rem;
}

#showLeft {
  display: none;

  @media (min-width:320px) and (max-width:768px) {
    display: block;
  }

}

#collapseExample {
  font-size: 10px;
}

.cbp-spmenu a:active {
  background: #eb3a68;  
  color     : #ffffff;
}

.cbp-spmenu a:hover {
  background: #eb3a68;
}


/* ------------------- mobile menu css ------------------*/

.site-header {
  position: relative;
  width   : 100%

}

.site-header figure {
  margin : 0;
  padding: 0
}

.site-header figure img {
  max-width: 100%
}

.site-header .header-bar {
  position  : absolute;
  top       : 0;
  left      : 0;
  z-index   : 99;
  width     : 100%;
  // padding: 20px 0
}

.header-bar .site-branding {
  margin-bottom   : 0;
  font-size       : 30px;
  // font-weight  : 800
}

.header-bar .site-branding a {
  color          : #fff;
  text-decoration: none
}

.hamburger-menu {
  position   : relative;
  width      : 100%;
  max-width  : 24px;
  height     : 22px;
  margin-left: auto;
  transition : .5s ease-in-out;
  cursor     : pointer
}

.hamburger-menu span {
  display      : block;
  position     : absolute;
  height       : 2px;
  width        : 100%;
  background   : #fff;
  border-radius: 10px;
  opacity      : 1;
  left         : 0;
  transition   : .25s ease-in-out
}

.hamburger-menu span:nth-child(1) {
  top: 2px
}

.hamburger-menu span:nth-child(2),
.hamburger-menu span:nth-child(3) {
  top: 10px
}

.hamburger-menu span:nth-child(4) {
  top: 18px
}

.hamburger-menu.open span:nth-child(1) {
  top  : 18px;
  width: 0;
  left : 50%
}

.hamburger-menu.open span:nth-child(2) {
  transform: rotate(45deg)
}

.hamburger-menu.open span:nth-child(3) {
  transform: rotate(-45deg)
}

.hamburger-menu.open span:nth-child(4) {
  top  : 18px;
  width: 0;
  left : 50%
}

.site-navigation {
  position  : absolute;
  top       : 7px;
  right     : -10px;
  z-index   : 9999;
  width     : 100%;
  height    : 22px;
  overflow  : hidden;
  list-style: none;
  transition: all .35s;
  color     : #fff;

  .fa-bars{
    color:#fff;
  }

  .cl-effect-3 a {
  padding: 8px 0;
}

.cl-effect-3 a::after {
  position          : absolute;
  top               : 100%;
  left              : 0;
  width             : 100%;
  height            : 2px;
  background        : #fcbe15;
  content           : '';
  opacity           : 0;
  -webkit-transition: opacity 0.3s, -webkit-transform 0.3s;
  -moz-transition   : opacity 0.3s, -moz-transform 0.3s;
  transition        : opacity 0.3s, transform 0.3s;
  -webkit-transform : translateY(10px);
  -moz-transform    : translateY(10px);
  transform         : translateY(10px);
}

.cl-effect-3 a:hover::after,
.cl-effect-3 a:focus::after {
  opacity          : 1;
  -webkit-transform: translateY(0px);
  -moz-transform   : translateY(0px);
  transform        : translateY(0px);
}
}

.site-navigation.show {
  height: auto
}

.site-navigation ul {
  position  : fixed;
  top       : 0;
  left      : -320px;
  z-index   : 9999;
  width     : 320px;
  height    : 100vh;
  overflow-x: scroll;
  padding   : 30px;
  margin    : 0;
  BACKGROUND: #ffffff40;
  transition: all .35s
}

.site-navigation.show ul {
  left: 0
}

.site-navigation ul li {
  display: block;
  padding: 15px 0
}

.site-navigation ul li a {
  position:relative;
  display        : block;
  color          : #fff;
  transition     : all .35s;
  text-decoration: none;
  font-size      : 15px;
  padding-left   : 30px;
  letter-spacing : 1px;
  font-family    : 'kghappysolid',
    cursive;
}

.nav-link {
  padding: 0;
}

@media screen and (min-width:992px) {
  .header-bar .site-branding {
    // margin-left: 35px
  }

  .site-navigation {
    position        : relative;
    top             : auto;
    right           : auto;
    height          : auto;
    // padding-right: 35px;
  }

  .site-navigation ul {
    display        : flex;
    flex-wrap      : wrap;
    justify-content: flex-end;
    align-items    : center;
    position       : relative;
    top            : auto;
    left           : auto;
    width          : 100%;
    height         : auto;
    padding        : 0;
    overflow       : auto;

  }

  .site-navigation ul li {
    padding: 0
  }

  .site-navigation ul li a {
    color: #fff
  }
}

.home-slider {
  // .owl-nav {
  //   position : absolute;
  //   width    : 100%;
  //   top      : 35%;
  //   color    : #fff;
  //   font-size: 33px;

  //   .owl-prev {
  //     left    : 50px;
  //     position: absolute;
  //     outline : none;

  //     span {
  //       font-size: 100px;
  //       color    : #ffffff54;
  //     }
  //   }

  //   .owl-next {
  //     position: absolute;
  //     right   : 50px;
  //     outline : none;

  //     span {

  //       font-size: 100px;
  //       color    : #ffffff54;
  //     }
  //   }
  // }
   .owl-dots {
   text-align: center;
   position  : absolute;
   bottom    : 10px;
   left      : 47%;
 }

 button.owl-dot {
   background: #dc3545;
   width     : 7px;
   height    : 7px;
   border    : none;
   padding   : 0.4rem !important;
   margin    : 10px;
   outline   : none;
   box-shadow: none;
   border-radius:50%;
 }

 button.owl-dot.active {
   background: #f09d12;
 }

}

.joinus {
  li {
    display           : inline-block;
    font-size         : 1em;
    list-style-type   : none;
    // padding        : 1em;
    text-transform    : uppercase;
    text-align        : center;
    color             : #fff;



  }

  .borderlf {
    position: relative;

    &:before {
      height      : 80px;
      display     : block;
      width       : 1px;
      background  : #ffffff;
      border-right: 1px #fff;
      top         : 30px;
      right       : -34px;
      position    : absolute;
      content     : '';
       @media (min-width:320px) and (max-width:786px) {
   height: 71px;
   top   : 23px;
   right : -20px;

 }
    }

   
  }

  li span {
    display  : block;
    font-size: 4.2rem;

    @media (min-width:320px) and (max-width:786px) {
      font-size: 3.2rem;
    }
  }

  .BGprime {
    padding         : 0;
    max-width       : 49% !important;
    margin-right    : 2%;
    min-height      : 8.35em;
    background-color: #bd2871;

    @media (min-width:320px) and (max-width:786px) {
      max-width   : 100% !important;
      margin-right: 0%;
      min-height  : 7.35em;
    }

  }

  .BGsecondary {
    max-width       : 49% !important;
    background-color: #ff9000;
    transition      : all 0.3s ease-in-out;
    min-height      : 8.35em;

    &:hover {
      background-color: #273034;
    }

    @media (min-width:320px) and (max-width:786px) {
      max-width: 100% !important;
      min-height : 7.35em;
    }
  }


  .join {
    display       : block;
    background    : url(../img/plus.png) no-repeat 44px center;
    position      : absolute;
    top           : 0;
    left          : 0;
    right         : 0;
    bottom        : 0;
    padding       : 0 0.5em 0 2.2em;
    font-size     : 3.9em;
    // font-weight: 700;
    line-height   : 2.3em;
    color         : #FFF;
    text-align    : left;
    width         : 100%;
    height        : 100%;


     @media (min-width:320px) and (max-width:1024px){
         
      background: none;    
      font-size: 2.6em;
      line-height: 0em;    
      text-align:center;
      padding:0px;
      display: flex;
      align-items: center;
      justify-content: center;
    }
  }
}

.aboutus {
  background-size: cover;

  p {
    color      : #0a0a0a;
    line-height: 26px;
    font-size  : 0.9rem;
  }

  .borderleft {
    border-left: 3px solid #ff9000;
  }
}

.feature-boxes {
  background         : url(../img/img1.jpg);
  background-position: inherit;
  background-size    : cover;
  background-repeat  : no-repeat;
  position           : relative;
  padding            : 8rem 0rem 4rem;

  .bg-overlay {
    position        : absolute;
    width           : 100%;
    height          : 100%;
    left            : 0;
    top             : 0;
    background-color: rgba(43, 43, 43, 0.42);
  }

  .featureBox {
    background-color: rgba(255, 255, 255, 0.9);
    position        : relative;
    border-width    : 1px;
    border-style    : solid;
    border-color    : #FFF;
    padding         : 1.65em 1.3em 1.5em;
    transition      : 0.35s all ease;
    min-height      : 363px;
    border-bottom   : 4px solid #ff9000;

    p {
      FONT-SIZE  : 0.9rem;
      line-height: 25px;
    }

    &:hover {
      background-color: #fff;
      box-shadow      : 0 2px 3px 0 rgba(0, 0, 0, 0.3);

      .sqaureIconPrime {
        background: #bd2871;
        box-shadow: 0 0 0 0.26em rgba(189, 40, 113, 0.5);
      }

    }

    .featureBox .absolute {
      top: -0.85em;
    }

    .features .absolute.more {
      top   : auto;
      bottom: -0.85em;
    }

    .featureBox::hover .sqaureIconPrime {
      opacity: 1;
    }

    .sqaureIconPrime {
      display   : inline-block;
      font-size : 1.50em;
      width     : 1.65em;
      height    : 1.65em;
      text-align: center;
      transform : rotate(45deg);
    }

    .sqaureIconPrime i,
    i {
      color    : #fff;
      transform: rotate(-45deg);
      margin   : 0 auto;
      font-size: 40px;
    }

    .sqaureIconPrime {
      font-size : 3em;
      position  : absolute;
      top       : -0.84em;
      margin    : 0 auto;
      left      : 0;
      right     : 0;
      z-index   : 9;
      background: #ff9000;
      box-shadow: 0 0 0 0.26em rgba(255, 144, 0, 0.5);
    }
  }

}

.gallery-slider {
   .entry-title p {
   font-size:1.4rem;
 }

  .gallery-view .owl-nav {
    margin-top: 10px;
    text-align: center;
  }

  .owl-nav button.owl-next,
  .owl-nav button.owl-prev {
    font-size    : 12px;
    background   : #000;
    color        : #fff;
    padding      : 17px;
    width        : 32px;
    height       : 32px;
    border-radius: 0;
    margin       : 6px;
  }

  .owl-nav [class*=owl-]:hover,
  .owl-nav [class*=owl-]:focus {
    background: #ea5e6b;
    color     : #fff;
    box-shadow: none;
    outline   : none;
  }

  .featured-image {
    display : block;
    margin  : 0;
    position: relative
  }

  .featured-image img {
    display: block;
    width  : 100%
  }

  .entry-content {
    position       : absolute;
    top            : 0;
    left           : 0;
    z-index        : 99;
    width          : 100%;
    height         : 100%;
    padding        : 30px;
    text-align     : center;
    background     : rgba(0, 0, 0, .75);
    text-decoration: none;
    transition     : all .5s;
    opacity        : 0;
    visibility     : hidden
  }

  .featured-image:hover .entry-content {
    opacity   : 1;
    visibility: visible
  }

  .entry-content h3 {
    font-size: 44px;
    position : absolute;
    top      : 44%;
    left     : 22%;
    color    : #fff
  }

  .entry-content p {
    font-size: 14px;
    color    : #fff
  }
}

.artists {
  background         : url(../img/middle-cover.jpg);
  background-size    : inherit;
  background-position: unset;
   .entry-title p {
   font-size: 1.4rem;
 }

  .lineup-artists .lineup-artists-description-container {
    position  : relative;
    padding   : 50px;
    background: #fff;
    box-shadow: 50px 40px 115px rgba(0, 0, 0, .1);
  }

  @media screen and (min-width: 768px) {
    .lineup-artists .lineup-artists-description-container {
      position: absolute;
      z-index : 99;
      top     : 56px;
      left    : -35px;
      width   : calc(100% + 75px);
    }
  }

  @media screen and (min-width: 768px) {
    .lineup-artists .lineup-artists-wrap:nth-of-type(even) .lineup-artists-description-container {
      right: -44px;
      left : auto;
    }
  }

  .lineup-artists-wrap .box-link {
    position: absolute;
    margin  : 0;
    padding : 0;
    top     : -24px;
    right   : 50px;
    z-index : 999;
  }

  @media screen and (min-width: 768px) {
    .lineup-artists .lineup-artists-wrap:nth-of-type(even) .box-link {
      right: auto;
      left : 50px;
    }
  }

  .entry-content p {
    color      : #716f6f;
    line-height: 26px;
    font-size  : 0.9rem;
  }
}

.schedule {
  background-image   : url(../img/schedule-bg.jpg);
  background-size    : cover;
  background-repeat  : no-repeat;
  background-position: bottom;
  padding            : 7rem 0rem 4rem;
  position           : relative;

  .bg-overlay {
    position        : absolute;
    width           : 100%;
    height          : 100%;
    left            : 0;
    top             : 0;
    background-color: rgba(29, 29, 29, 0.9);
  }

  .purple {
    transition: all 0.3s ease-in-out;

    .sqaureIconPrime {
      background: #eb3a68 !important;
      box-shadow: 0 0 0 0.26em rgba(235, 58, 104, 0.5) !important;
    }

    &:hover {
      border          : 1px solid #eb3a68 !important;
      background-color: #292929;

      .childborder {
        outline: 1px solid #eb3a68 !important;
      }
    }
  }

  .childborder {
    padding       : 3rem;
    outline       : rgba(255, 255, 255, 0.2) 1px solid;
    outline-offset: -8px;

    h3 {
      padding-top   : 0.5em;
      padding-bottom: 0.5em;
      margin-top    : 0;
      border-bottom : 1px solid rgba(255, 255, 255, 0.1);
      font-family   : 'kghappysolid',
        cursive;
    }

    p {

      font-size: 1.3rem;
    }

    .sqaureIconPrime {
      display   : inline-block;
      font-size : 1.50em;
      width     : 1.5em;
      height    : 1.5em;
      text-align: center;
      transform : rotate(45deg);
    }

    .sqaureIconPrime i,
    i {
      color    : #fff;
      transform: rotate(-45deg);
      margin   : 0 auto;
      font-size: 40px;
    }

    .sqaureIconPrime {
      font-size : 3em;
      position  : absolute;
      top       : -0.7em;
      margin    : 0 auto;
      left      : 0;
      right     : 0;
      z-index   : 9;
      background: #ff9000;
      box-shadow: 0 0 0 0.26em rgba(255, 144, 0, 0.5);
    }
  }

  .dblBorder {
    border    : rgba(255, 255, 255, 0.2) 1px solid;
    transition: all 0.3s ease-in-out;

    &:hover {
      border          : 1px solid #ff9000;
      background-color: #292929;

      .childborder {
        outline: 1px solid #ff9000;
      }
    }

  }

  .btn {
    background-color: rgba(202, 202, 202, 0.3);
    transition      : 0.35s all ease;

    &:hover {
      background-color: #ff9000;
    }
  }
}



.stat {
  background-image: url(../img/counter_bg.jpg);
  padding         : 30px 0px;
  text-align      : center;

  .stat-box {
    text-align: center;
  }

  .stat-box i {
    color    : #26c6da;
    font-size: 39px;
  }

  .stat-box h6 {
    color        : #fff;
    margin-bottom: 10px;
    font-size    : 21px;
    margin-top   : 10px;
    font-family  : 'Poppins',
      sans-serif;
  }

  .stat-box h4,
  p {
    color: #fff;
    font-family: 'Poppins',
      sans-serif;

  }

  .statheading p {
    margin-bottom: 40px;
  }

  .statheading h2 {
    color     : #fff;
    text-align: center;
    font-family: 'kghappysolid',
      cursive;
    // font-weight: 700;
  }
}

.footer {

  .team h3,
  .team h4 {
    color         : #212121;
    // font-weight: 700;
  }

  .team p {
    color        : #848484;
    font-size    : 15px;
    line-height  : 25px;
    padding-right: 50px;
  }

  .team ul,
  .get-in ul {
    list-style-type: none;
    padding-left   : 0px;
  }

  .team i {
    font-size    : 25px;
    padding-right: 10px;
    color        : #212121;
  }

  .team h4 {
    color    : #212121;
    font-size: 18px;
  }

  .ublogo {
    margin-top: 0px;
  }

  .get-in i {
    font-size: 25px;
    color    : #212121;
  }

  .team ul,
  .get-in ul {
    list-style-type: none;
    padding-left   : 0px;
  }

  .team li,
  .get-in li {
    color    : #848484;
    font-size: 18px;
    padding  : 10px 0px;
  }

  .get-in a {
    color: #848484;
  }

  .team span {
    margin-left: 35px;
  }

  .get-in span {
    margin-left: 52px;
  }

  .ublogo img {
    width: 290px;
  }

  .get-in .thumbnail {
    width        : 40px;
    height       : 40px;
    padding-top  : 10px;
    color        : #fff;
    background   : #000;
    border-color : #000;
    border-radius: 3px;
    margin-bottom: 0px;
    font-size    : 16px;
    text-align   : center;
    margin-right : 10px;
  }

  .ulffooter {
    background: #212121;
    text-align: center;
    color     : #fff;
    padding   : 15px;
  }

  .ulffooter p {
    margin: 0;
  }

  .geticon {
    float        : left;
    margin-bottom: 12px;
  }

  .getext {
    font-size: 15px;
  }
}

.ulffooter {
  background: #212121;
  text-align: center;
  color     : #fff;
  padding   : 15px;
}

.buyonline {
  background: #ff9000;

  a {
    color: #000;
  }
  h2{
    img{
      width:55px;
      @media (min-width:320px) and (max-width:768px) {
   width:30px;
}
    }
  @media (min-width:320px) and (max-width:768px){
    font-size:15px;  
  }
  }
}