/*  Equalizer */

.bar-c {
  overflow: hidden;
  height: 38px;
  width: 40px;
  margin: 0 auto 20px;
  position: relative;
  cursor: pointer;
}
.bar {
  height: 1px;
  width: 2px;
  display: inline-block;
  background-color: #000;
  bottom: 0;
  /* box-shadow: 0 0 10px 1px rgba(0, 0, 0, 0.5); */
  position: absolute;
  -webkit-animation-duration: 500ms;
  -webkit-animation-play-state: running;
  -webkit-animation-direction: alternate;
  -webkit-animation-timing-function: linear;
  -webkit-animation-iteration-count: infinite;
}
.bar.noAnim {
  -webkit-animation: none;
  -webkit-animation-name: none;
}
.bar#bar-1 {
  left: 8px;
  -webkit-animation-name: danceHeight1;
  -webkit-animation-delay: 0ms;
}
.bar#bar-2 {
  left: 12px;
  -webkit-animation-name: danceHeight2;
  -webkit-animation-delay: 300ms;
}
.bar#bar-3 {
  left: 16px;
  -webkit-animation-name: danceHeight3;
  -webkit-animation-delay: 600ms;
}
.bar#bar-4 {
  left: 20px;
  -webkit-animation-name: danceHeight4;
  -webkit-animation-delay: 900ms;
}
.bar#bar-5 {
  left: 24px;
  -webkit-animation-name: danceHeight5;
  -webkit-animation-delay: 1200ms;
}
.bar#bar-6 {
  left: 28px;
  -webkit-animation-name: danceHeight6;
  -webkit-animation-delay: 1500ms;
}
@-webkit-keyframes danceHeight1 {
  from {
    height: 1px;
  }
  to {
    height: 22px;
  }
}
@-webkit-keyframes danceHeight2 {
  from {
    height: 1px;
  }
  to {
    height: 15px;
  }
}
@-webkit-keyframes danceHeight3 {
  from {
    height: 1px;
  }
  to {
    height: 30px;
  }
}
@-webkit-keyframes danceHeight4 {
  from {
    height: 1px;
  }
  to {
    height: 20px;
  }
}
@-webkit-keyframes danceHeight5 {
  from {
    height: 1px;
  }
  to {
    height: 15px;
  }
}
@-webkit-keyframes danceHeight6 {
  from {
    height: 1px;
  }
  to {
    height: 15px;
  }
}

/* .fadeInLeft
  animation-name: fadeInLeft
  
@keyframes fadeInLeft
  from
    opacity: 0
    transform: translate3d(-100%, 0, 0)
  to
    opacity: 1
    transform: none */

.animated {
  animation-duration: 1s;
  animation-fill-mode: both;
}

.animated.infinite {
  animation-iteration-count: infinite;
}

@keyframes fadeInLeft {
  from {
    opacity: 0;
    transform: translate3d(-100%, 0, 0);
  }

  to {
    opacity: 1;
    transform: none;
  }
}

.fadeInLeft {
  animation-name: fadeInLeft;
}

#discount_slider .custom_dots_wrapper{
    width: 80px !important;
}


/*
Magic - Ver 1.2.0 - https://minimamente.com
Licensed under the MIT license
Copyright (c) 2016 Christian Pucci
*/
.magictime {
    animation-duration: 1s;
    animation-fill-mode: both;
}

#bgs .item{
    /* animation-duration: 1s; */
    /* animation-fill-mode: both; */
    opacity: 0;
    transform-origin: 50% 50%;
    transform: scale(1.2, 1.2);
    filter: blur(55px);
    transition: all 1s ease;
}

#bgs .item.vanish_manually {
    transform-origin: 50% 50%;
    transform: scale(1, 1);
    filter: blur(0px);
    opacity: 1 !important;
    /* animation-duration: 1s; */
    /* animation-fill-mode: both; */
    transition: all .55s ease;
}



.vanishIn {
  animation-name: vanishIn;
  opacity: 1 !important;
  animation-duration: 2s;
}
@keyframes vanishIn {
  0% {
    opacity: 0;
    transform-origin: 50% 50%;
    transform: scale(2, 2);
    filter: blur(90px);
  }

  100% {
    opacity: 1;
    transform-origin: 50% 50%;
    transform: scale(1, 1);
    filter: blur(0px);
  }
}





@media all and ( max-width: 768px ){
 
  #header {
    padding-bottom: 0  !important;
  }
  #footer{
    position: relative !important;
    padding-top: 15px;
  }
  #discount_slider .custom_dots_wrapper{
      width: 80px !important;
  }

}









*::selection {background:#00c2ff;color:#fff;text-shadow:none; /* Safari */}
*::-moz-selection {background:#00c2ff;color:#fff;text-shadow:none; /* Firefox */}

#navbar .logo, #header .quaternion .item .btn_default, .fixed_panel{
  -webkit-user-select: none;
  -moz-user-select: none;     
  -ms-user-select: none;      
  user-select: none;      
}





#discount_slider .btn_default {
  display: inline-block;
  position: absolute;
  left: 100px;
  bottom: 50px;
  z-index: 3; }
#discount_slider .btn_default .name{
  font-family: "Roboto Condensed", sans-serif;
  font-weight: bold;
}

  

#discount_slider .close {
  color: white;
  -webkit-transition: color .35s ease;
  -o-transition: color .35s ease;
  transition: color .35s ease; }
  #discount_slider .close:hover {
    color: #00c2ff;
    -webkit-transition: color .35s ease;
    -o-transition: color .35s ease;
    transition: color .35s ease; }

#discount_slider #slider_outer {
  display: block;
  position: relative;
  text-align: center; }

#discount_slider #slider_inner {
  display: block;
  position: relative;
  text-align: center;
  background-color: #000; }
  #discount_slider #slider_inner .item {
    display: block;
    position: relative; }
    #discount_slider #slider_inner .item img {
      display: block;
      position: relative;
      margin: 0 auto;
      max-width: 100%; }

#discount_slider.modal .modal-dialog {
    margin-bottom: 120px;
}

.modal-backdrop.in {
    filter: alpha(opacity=90)!important;
    opacity: .90!important;
}


#discount_slider .custom_dots_wrapper {
  display: block;
  position: absolute;
  right: 0;
  top: -2px;
  bottom: -2px;
  width: 250px;
  background-image: -webkit-gradient(linear, left top, right top, from(rgba(255, 255, 255, 0)), to(rgba(0, 0, 0, 0.78)));
  background-image: -webkit-linear-gradient(left, rgba(255, 255, 255, 0), rgba(0, 0, 0, 0.78));
  background-image: -o-linear-gradient(left, rgba(255, 255, 255, 0), rgba(0, 0, 0, 0.78));
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0), rgba(0, 0, 0, 0.78)); }
  #discount_slider .custom_dots_wrapper .custom_dots {
    display: block;
    position: relative;
    padding-right: 10px;
    float: right;
    top: 50%;
    -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
            transform: translateY(-50%); }
    #discount_slider .custom_dots_wrapper .custom_dots .slick-dots li .line {
      background-color: #fe0404;
      color: #fe0404; }
    #discount_slider .custom_dots_wrapper .custom_dots .slick-dots li .number {
      color: #fe0404; }
    #discount_slider .custom_dots_wrapper .custom_dots .slick-dots li:hover .line {
      background-color: #00c2ff; }
    #discount_slider .custom_dots_wrapper .custom_dots .slick-dots li:hover .number {
      color: #00c2ff; }



#modal_consult .modal-dialog .modal-body {
    padding-left: 100px;
    padding-right: 100px;
}









#header .quaternion #art .btn_default .name{
  min-width: inherit !important;
  text-align: center;
}

#header .quaternion #event .btn_default .name{
  min-width: inherit !important;
  text-align: center;
}

#header .quaternion #franchise .btn_default .name{
  min-width: inherit !important;
  text-align: center;
}

#header .quaternion #shop .btn_default .name{
  min-width: inherit !important;
  text-align: center;
}




































/* MEDIA */
@media (min-width: 1200px){
  #modal_consult .modal-dialog, #email_to_director .modal-dialog, #join_the_lesson .modal-dialog{
    min-width: 1180px;
  }
}




@media (max-width: 1200px){
  #discount_slider .btn_default {
      left: 50px;
      bottom: 30px;
  }
}

@media (min-width: 1200px){
  #discount_slider .modal-dialog {
      min-width: 1100px;
  }  
}

@media (max-width: 992px){
  #discount_slider .modal-dialog {
      width: 90%;
  }

#header .quaternion #art .btn_default .name {
  min-width: 220px;
  padding-left: 20px;
  text-align: left;
}
#header .quaternion #event .btn_default .name {
  min-width: 220px;
  padding-left: 20px;
  text-align: left;
}

#header .quaternion #franchise .btn_default .name {
  min-width: 220px; }

#header .quaternion #shop .btn_default .name {
  min-width: 140px; }

} /* < 992 */

@media (min-width: 768px){
  #discount_slider.modal .modal-dialog {
      display: inline-block;
      text-align: left;
      vertical-align: middle;
  }
  #discount_slider.modal::before {
      content: "";
      display: inline-block;
      height: 100%;
      margin-right: -4px;
      vertical-align: middle;
  }
}



@media (max-width: 768px){
  #discount_slider .modal-dialog {
      width: initial;
  }
  #modal_consult .modal-dialog {
    width: initial;
  }

  #header .quaternion #art .btn_default .name {
    min-width: 260px !important;
    padding-left: 0;
    text-align: left;
  }
  #header .quaternion #event .btn_default .name {
    min-width: 260px !important;
    padding-left: 0;
    text-align: left;
  }

  #header .quaternion #franchise .btn_default .name {
    min-width: 260px !important;
    text-align: left;
  }

  #header .quaternion #shop .btn_default .name {
    min-width: 260px !important;
    text-align: left;
  }


}

@media all and ( max-width: 600px ){

  #modal_consult .modal-dialog .modal-body {
      padding-left: 35px;
      padding-right: 35px;
  }

}






@media (max-width: 480px){
  #header .quaternion #art .btn_default .name {
    min-width: 180px !important;
    padding-left: 0;
    text-align: left;
  }
  #header .quaternion #event .btn_default .name {
    min-width: 180px !important;
    padding-left: 0;
    text-align: left;
  }

  #header .quaternion #franchise .btn_default .name {
    min-width: 180px !important;
    text-align: left;
  }

  #header .quaternion #shop .btn_default .name {
    min-width: 180px !important;
    text-align: left;
  }
}





@media (max-width: 460px){
  #modal_consult .modal-dialog .modal-body {
      padding-left: 15px;
      padding-right: 15px;
  }
}

@media (max-width: 420px){
  #modal_consult .modal-dialog .btn_default .name {
      font-size: 16px;
      min-width: initial;
  }
  #modal_consult .btn_default .circle{
    margin-right: 8px;
  }
}


@media (max-width: 380px){

#header .quaternion #event .btn_default .name{
    font-size: 21px !important;
    min-width: 160px !important;
  }
#header .quaternion #franchise .btn_default .name{
    font-size: 21px !important;
    min-width: 160px !important;
  }
#header .quaternion #shop .btn_default .name{
    font-size: 21px !important;
    min-width: 160px !important;
  }
#header .quaternion #art .btn_default .name{
    font-size: 21px !important;
    min-width: 160px !important;
  }

}



#discount_slider .close {
      color: #c2c2c2!important;
}

#discount_slider #slider_inner .item:hover{
  cursor: pointer;
}

@media all and (min-width:768px){
    ::-webkit-scrollbar{
      width:17px
    }
    ::-webkit-scrollbar-track{
      /* background:#f5f5f5; */
      background: #e7e7e7;
    }
    ::-webkit-scrollbar-thumb{
      border-radius:0;
      background:#ababab;
      height:60px;
    }
    ::-webkit-scrollbar-thumb:hover{
      background: #e52130;
    }
  }