*{
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  margin: 0;
  padding: 0;
  -webkit-transition: all 0.5s ease-in-out;
  -o-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out;
}
.container-fluid{
  margin:0 ;
  padding: 0 ;
}
.row{
    margin: auto;
    padding: 0 ;
}
a{
  text-decoration: none;
}
a:hover, a:focus{
  text-decoration: underline;
}
.text-center{
  width: 100%;
}
.text-left{
  width: 100%;
}
.text-right{
  width: 100%;
}
@font-face {
   font-family: Quango;
  src: url(fonts/Quango.otf);
}
body{
 /* font-family: 'Sniglet', cursive; 
  
 font-family: Quango; */
     background-color: #1f2121;
    color: #fff;
    font-size: 20px;
}
#myBtn {
  display: none;
  position: fixed;
  bottom: 50px;
  right: 10px;
  z-index: 99;
  cursor: pointer;
  height: 50px;
  width: 50px;
  padding: 0;
  outline: none;
  border: 0;
  opacity:0.5;
  background-color: transparent;
}
#myBtn:hover{
    opacity: 1;
}
#myBtn img{
    width: 80%;
}
li{
    list-style-type: none;
}
.comingsoon h1 {
    font-family: fantasy;
    color: #fff;
    margin-bottom: 0;
    background-color: #545454;
    padding: 1.5em;
    font-size: 64px;
    letter-spacing: 0.5em;
}
.mypadding{
  padding: 7em 4em;
}
.smypadding{
  padding: 2em 2em;
}


.sticky.is-sticky {
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    z-index: 1000;
    width: 100%;
    background-color: #141618 !important;
}
#collapsibleNavbar {
    -webkit-box-pack: end;
        -ms-flex-pack: end;
            justify-content: flex-end;
    place-items: center;
}
nav li {
    margin: 0 0.3em;
    position: relative;
    cursor: pointer;
}
.bg-dark {
    background-color: #14161833 !important;
    padding: 0em 2em;
    border-bottom: 1px solid #ffffff26;
}
.navbar-dark .navbar-nav .nav-link.active{
  color: #ffffff80;
  text-shadow: 1px 1px 2px #000;
}
.navbar-dark .navbar-nav .nav-link:focus, .navbar-dark .navbar-nav .nav-link:hover {
    color: #ffffff80;
}
.navbar-dark .navbar-nav .nav-link{
    color: #fff;
    text-transform: uppercase;
    padding: 1em 0.5em;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: -webkit-max-content;
    width: -moz-max-content;
    width: max-content;
    place-items: center;
    text-shadow: 1px 1px 2px #000;
}
.navbar-dark .navbar-nav .nav-link svg {
    font-size: 0.8em;
    margin-left: 5px;
}
.sub_menu {
    position: absolute;
    background-color: #ffffff;
    top: 100%;
    left: 7px;
    padding: 10px 0px 10px;
    width: 270px;
    display: none;
    /* border-top: 5px solid #f44b4d; */
    -webkit-box-shadow: 0 0 5px 0 #000;
    box-shadow: 0 0 5px 0 #000;
}
.sub_menu:before {
        content: "";
    position: absolute;
    left: 0%;
    top: -26px;
    border: 2rem solid;
    border-width: 0.8rem 1rem;
    border-color: transparent transparent #ffffff;
}
.sub_menu2 {
    left: 100%;
    top: 0;
    width: 300px;
    border-top: 0;
    border-left: 5px solid #d9494d;

}
.sub_menu2:before {
    left: -35px;
    top: 0;
    border: 1rem solid;
    border-width: .8rem 1rem;
    border-color: transparent #d9494d transparent transparent;
}
.sub_menu ul{
  border: 0;
  display: block;
  padding-left: 0 !important;
}
.sub_menu ul li svg{
  font-size: 0.8em;
  margin-left: 5px;
}
.sub_menu ul li{
  list-style-type: none;
  padding: 0 1em;
    margin: 0 5px;
    -webkit-transition: unset;
    -o-transition: unset;
    transition: unset;
}
.sub_menu ul li:hover {
    background-color: #414141;
    margin: 0 6px;
    color: #fff;
    -webkit-transition: unset;
    -o-transition: unset;
    transition: unset;
}
.sub_menu ul li:hover > a {
    color: #fff;
}
.sub_menu ul li a{
    border-bottom: 2px solid #edeef0;
    color: #414141;
    display: block;
    padding: 0;
    padding-bottom: 2px;
    text-align: left;
    text-transform: uppercase;
}
.sub_menu ul li:last-child a {
    border-bottom: 0;
}
.services_menu:hover .services_sub_menu{
  display: block !important;
}
.shaping_menu:hover .shaping_sub_menu{
  display: block !important;
}
.styling_menu:hover .styling_sub_menu{
  display: block !important;
}
.color_menu:hover .color_sub_menu{
  display: block !important;
}
.addn_menu:hover .addn_sub_menu{
  display: block !important;
}
nav ul{
  place-items: center;
}
header{
    z-index: 9;
    position: absolute;
    width: 100%;
    font-size: 16px;
}
.carousel-item img{
  width: 100%;
  height: 100vh;
  -o-object-fit: cover;
     object-fit: cover;
}
.carousel {
    position: relative;
    width: 100%;
}
.nav_media {
    border-left: 1px solid #ffffff26;
    padding-left: 1.5em;
    margin-left: 3em;
    padding: 2.5em;
    padding-right: 0;
}
.nav_media ul{
  margin-bottom: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.nav_media ul a, .nav_media ul a svg{
  color: #fff;
  -webkit-transition: unset;
  -o-transition: unset;
  transition: unset;
}
.nav_media ul a:hover, .nav_media ul a:hover svg{
  color: #ffffff80;
}
.slider{
  position: relative;
}
.slider_info{
  position: absolute;
  top: 60%;
  left: 50%;
  margin: auto;
  -webkit-transform: translate(-50%,-50%);
      -ms-transform: translate(-50%,-50%);
          transform: translate(-50%,-50%);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.slider_info img{
  width: 86%;
  margin: auto;
}
.tracks_full {
    position: relative;
    margin-bottom: -10px;
}
.tracks_full img{
    width: 100%;
}
.sounds{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
}
.sounds h3 {
    margin-bottom: 12em;
}
.sounds_all {
    background-color: #f1f3f4;
    width: 70%;
    margin: auto;
    padding: 10px;
    border-radius: 5px;
    max-height: 175px;
    overflow: auto;
}
.sounds_inner{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    place-items: center;
    border-bottom: 1px solid #c3c5c5;
    padding-bottom: 5px;
    margin-bottom: 5px;
}
.sounds_inner:last-child{
  margin-bottom: 0;
  padding-bottom: 0;
  border: 0;
}
.sounds_inner audio{
  width: 50%;
  height: 30px;
}
.sounds_inner audio:focus{
  outline: unset;
  border: 0;
}
.sounds_inner img {
    width: 4%;
    height: auto;
}
.sounds_inner h6 {
    width: 46%;
    margin-bottom: 0;
    font-size: 0.8em;
    padding-left: 1em;
    color: #333;
}
.about{
  background-image: url(../images/quote.PNG);
      background-repeat: no-repeat;
  color: #fff;
  background-position: center;
  
  text-align: center;
}
/*.about.row.mypadding {*/
/*    padding: 30em 2em 0.5em;*/
/*}*/
.about h3{
  margin-bottom: 0.7em;
}
.about p{
  padding: 0 4em;
  margin-bottom: 1em;
}
.row.aboutus1.mypadding {
    padding: 2em 2em;
}
.about a{
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin: auto;
  text-transform: uppercase;
  padding: 0.5em 2em;
  border: 2px solid #fff;
  color: #fff;
  font-size: 0.9em;
}
.about a:hover{
  background-color: #fff;
  color: #101213;
  text-decoration: none;
  font-weight: bold;
}

.services img{
  width: 100%;
}
.services .col-sm-12{
  padding: 0;
  position: relative;
  cursor: pointer;
  overflow: hidden;
}
.services .overlay {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  background-color: transparent;
  overflow: hidden;
  height: 100%;
  width: 100%;
  -webkit-transition: .3s ease;
  -o-transition: .3s ease;
  transition: .3s ease;
  opacity: 0;
}
.services .col-sm-12:hover .overlay {
  background-color: #0000009e;
  opacity: 1;
}
.overlay_text {
  color: white;
  width: 100%;
  font-size: 20px;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  text-align: center;
  opacity: 0;
  -webkit-transition: 0.1s ease;
  -webkit-transition: 0.2s ease;
  -o-transition: 0.2s ease;
  transition: 0.2s ease;
  -webkit-transition-delay: 0.3s;
       -o-transition-delay: 0.3s;
          transition-delay: 0.3s;
  text-align: center;
}
.services .col-sm-12:hover .overlay_text {
  opacity: 1;
}
.services .col-sm-12:hover img {
  -webkit-transform: scale(1.1);
  -ms-transform: scale(1.1);
  transform: scale(1.1);
} 
.services .overlay a{
    display: block;
    width: 100%;
    height: 100%;
}
.overlay_info svg{
  font-size: 0.8em;
}
.overlay_info h3 {
    font-size: 2.5em;
    font-weight: bold;
    padding: 0 1em;
}
.overlay_info p{
  font-size: 0.8em;
}
#thumbnail-slider2 .slider-image {
    height: auto !important;
    width: 100% !important;
    padding: 0 2em;
    display: block !important;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    background-color: transparent;
    border-radius: 10px;
}
#thumbnail-slider2{
    width: 100%;
    border-radius: 0 0 10px 10px;
    background-color: transparent;
    padding: 1em 4em;
}
#thumbnail-slider2 section{
    padding: 0;
    margin-bottom: 0;
}
.testimonials{
  background-color: #141618;
  color: #fff;
  padding: 2em 0;
}
#thumbnail-slider .slider-image {
    height: auto !important;
    width: 100% !important;
    padding: 0 2em;
    display: block !important;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    background-color: transparent;
    border-radius: 10px;
}
#thumbnail-slider{
    width: 100%;
    border-radius: 0 0 10px 10px;
    background-color: transparent;
    padding: 1em 4em;
}
#thumbnail-slider section{
    padding: 0;
    margin-bottom: 0;
}
.testimonial_info p{
  margin-bottom: 0;
    text-align: center;
    font-style: italic;
}
#thumbnail-slider .slick-prev, #thumbnail-slider .slick-next{
  display: none !important;
}
.slick-dots li.slick-active button:before, .slick-dots li button:hover:before {
    opacity: 1;
    color: #fff;
    font-size: 8px;
}
.slick-dots li button:before{
    opacity: 1;
    color: #868788;
}
.slick-dots li{
  margin: 0;
}
footer{
  background-color: #101213;
  color: #fff;
}
footer .col-md-6{
  text-align: center;
}
footer a{
  color: #fff;
}
footer a:hover{
    color: #0cb4ce;
    text-decoration: none;
}
.footer_bottom{
  background-color: #141618;
  padding: 1.5em 2em;
  color: #fff;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  place-items: center;
}
.footer_bottom p{
  margin-bottom: 0;
  font-size: 0.8em;
}
.footer_bottom ul{
  margin-bottom: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin: auto 0 auto auto;
}
.footer_bottom ul a, .footer_bottom ul a svg{
  color: #fff;
  -webkit-transition: unset;
  -o-transition: unset;
  transition: unset;
}
.footer_bottom ul a:hover, .footer_bottom ul a:hover svg{
  color: #ffffff80;
}
.footer_bottom li {
    margin: 0 0.5em;
    position: relative;
    cursor: pointer;
}
.footer_bottom::after{
  content: '';
  display: table;
  clear: both;
}
.inner_page {
    padding-top: 10em !important;
}
.contact{
  padding: 2em 4em;
  background-size: cover;
  padding-top: 2em !important;
}
.contact a {
    color: #fff;
}
.contact a:hover {
    color: #0cb4ce;
}
.contact_div{
  width: 75%;
  margin: auto;
  background-color: #000000ba;
  padding: 2em;
}
.contact form .btn{
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin: auto;
  text-transform: uppercase;
  padding: 0.5em 2em;
  border: 2px solid #fff;
  color: #fff;
  background-color: #101213;
}
.contact form .btn:hover, .contact form .btn:focus{
  background-color: #fff;
  color: #101213;
  text-decoration: none;
  font-weight: bold;
  box-shadow: none;
}
.contact .mobile, .contact .subject{
  margin-bottom: 2em !important;
}
.contact .form-control {
    border: 0;
    border-bottom: 2px solid #d9d9d9;
    border-radius: 0;
    -webkit-box-shadow: unset;
    box-shadow: unset;
    font-weight: bold;
    background-color: transparent;
    color: #fff;
}
.contact .form-group {
    width: 45%;
    float: left;
    margin: 2.5%;
}
.contact .form-control::-webkit-input-placeholder{
  color: #b6b6b6;
}
.contact .form-control:-ms-input-placeholder{
  color: #b6b6b6;
}
.contact .form-control::-ms-input-placeholder{
  color: #b6b6b6;
}
.contact .form-control::placeholder{
  color: #b6b6b6;
}
.contact form{
  padding: 0 4em;
}
.contact .form-group:last-child {
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    float: unset;
    margin: auto;
    clear: both;
}
.contact p.mt-10{
    margin-top: 1em;
    text-transform: capitalize;
}
.banner{
  position: relative;
}
.banner img{
  width: 100%;
  height: 100vh;
  object-fit: cover;
}
.banner_info{
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
}
.banner_info h3{
  color: #fff;
  text-shadow: 2px 2px 2px #000;
  font-size: 2.5em;
}
.aboutus{
  text-align: center;
}
.why_us img{
    width: 100%;
    height: 100%;
}
.why_us{
    text-align: left;
}
.why_us .col-lg-6{
    padding: 0;
}
.studio_info{
  background-image: url('../images/slider1.jpg');
  background-size: cover;
}
.why_us_txt{
  background-color: #141618eb;
  padding: 2em !important;
  color: #fff;
}
.studio_info_txt{
  background-color: #141618eb;
  padding: 4em !important;
  color: #fff;
}
.why_us_txt h3, .studio_info_txt h3{
  text-transform: uppercase;
  margin-bottom: 1em;
  border-bottom: 2px solid #fff;
  width: fit-content;
}
.audios_page .banner img{

}
.audios_page .banner_info{
  top: 60%;
  left: 50%;
  width: 80%;
  place-items: center;
}
.audios_page .banner_info h3{
  font-weight: bold;
}
.audios_page .banner_info p{
  color: #fff;
  text-shadow: 2px 2px 2px #000;
  font-size: 1.3em;
}
.btn_style{
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  text-transform: uppercase;
  padding: 0.5em 2em;
  border: 2px solid #fff;
  color: #fff;
  background-color: #101213;
}
.btn_style:hover, .btn_style:focus{
  background-color: #fff;
  color: #101213;
  text-decoration: none;
  font-weight: bold;
  box-shadow: none;
  border: 2px solid #101213;
}
.banner_video svg {
    background-color: #101213;
    width: 6em !important;
    height: 6em;
    color: #fff;
    padding: 25px;
    border-radius: 50%;
    border: 2px solid #fff;
    margin: auto;
    display: flex;
    margin-bottom: 0.5em;
}
.banner_video:hover svg{
    transform: scale(1.2);
}
.banner_video{
  text-align: center;
}
.banner_video p{
  font-size: 0.9em !important;
  text-transform: uppercase !important;
}
.banner_video:hover{
  text-decoration: none;
}
.audio_content_info{
  padding: 4em 2em;
  color: #fff;
  height: 100%;
  border-radius: 5px;
  background:linear-gradient(rgba(16, 18, 19, 0.68),rgba(16, 18, 19, 0.68)),url('../images/img1.png');
  background-size: cover;
}
.audio_content_info2{
  padding: 4em 2em;
  color: #fff;
  height: 100%;
  border-radius: 5px;
  background:linear-gradient(rgba(16, 18, 19, 0.68),rgba(16, 18, 19, 0.68)),url('../images/img_2.png');
  background-size: cover;
}
.audio_content_info3{
  padding: 4em 2em;
  color: #fff;
  height: 100%;
  border-radius: 5px;
  background:linear-gradient(rgba(16, 18, 19, 0.68),rgba(16, 18, 19, 0.68)),url('../images/img_3.png');
  background-size: cover;
}
.audio_content .col-md-6:last-child .audio_content_info{
  background:linear-gradient(rgba(16, 18, 19, 0.68),rgba(16, 18, 19, 0.68)),url('../images/img2.png');
  background-size: cover;
}
.collections{
  background-color: #191b1c;
  color: #fff;
}
.collections .col-md-4{
  margin-bottom: 2em;
}
.collections_heading{
  display: flex;
  place-items: center;
  width: 100%;
  margin-bottom: 1em;
  padding: 0 1em;
}
.collections_info a{
  color: #fff;
}
.collections_heading a{
  margin: auto 0 auto auto;
  color: #fff;
}
.collections_heading h3{
  margin-bottom: 0;
}
.collections img{
  width: 100%;
}
.collections .row{
  width: 100%;
  justify-content: center;
}
.collections .col-md-4:hover img{
  transform: scale(1.1);
}
.collections .collections_info{
  overflow: hidden;
  border-radius: 10px;
  position: relative;
}
.collections_text{
  position: absolute;
  bottom: 0;
  padding: 1em;
}
.collections_text span{
  background-color: #101213;
  color: #fff;
  padding: 3px 5px;
  text-transform: uppercase;
  margin-bottom: 5px;
  display: flex;
  width: fit-content;
  font-size: 0.8em;
  letter-spacing: 1px;
}
.collections_text h4{
  text-shadow: 1px 1px 2px #000;
  margin-bottom: 0;
}
.collections_text p{
  text-shadow: 1px 1px 2px #000;
  margin-bottom: 0;
}
.tracks_heading{
  display: flex;
  place-items: center;
  width: 100%;
  margin-bottom: 1em;
}
.tracks_heading a{
  margin: auto 0 auto auto;
  color: #101213;
}
.tracks_heading h3{
  margin-bottom: 0;
}
.all_tracks{
  clear: both;
}
.single_track{
  display: flex;
  place-items: center;
    padding-bottom: 10px;
    border-bottom: 1px solid #e5e5e5;
    margin-bottom: 10px;
}
.single_track:last-child{
  padding-bottom: 0;
  margin-bottom: 0;
  border-bottom: 0;
}
.track_img img{
  width: 100%;
  border-radius: 5px;
}
.single_track span {
    width: 5%;
}
.track_img {
  width: 10%;
  position: relative;
}
.track_icons {
    width: 10%;
}
.track_info{
  width: 75%;
  padding: 0 1em;
}
.track_info p, .track_info h5{
  margin-bottom: 0;
}
.track_info p{
  color: #575656;
}
.track_icons svg {
    margin: 0 5px;
}
.track_icons a{
  color: #101213;
}
.track_img_play{
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  display: none;
}
.track_img_play svg {
    background-color: #101213;
    width: 2em !important;
    height: 2em;
    color: #fff;
    padding: 7px;
    border-radius: 50%;
    border: 2px solid #fff;
}
.single_track:hover .track_img_play{
  display: block;
}
.track_img_play a{
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    place-items: center;
}
.audio_fixed{
  padding: 4em;
  background:linear-gradient(rgba(16, 18, 19, 0.68),rgba(16, 18, 19, 0.68)),url('../images/sounds_bg.jpg');
  background-size: cover;
  background-attachment: fixed;
  text-align: center;
  color: #fff;
}
.audio_fixed .btn_style{
  margin: auto;
}
.gallery_photos{
    background-color: #eeeff0;
    padding: 2em 4em;
}
.gallery_info img{
    width: 100%;
    cursor: pointer;
    height: 100%;
    object-fit: cover;
}
.gallery_info {
    overflow: hidden;
    position: relative;
    height: auto
}
.gallery_info img:hover{
    transform: scale(1.1);
}
.gallery_photos .col-md-4{
    margin-bottom: 2em;
    overflow: hidden;
}
.gallery_txt {
    position: absolute;
    width: 100%;
    height: 100%;
    display: flex;
    top: 0;
    place-items: center;
    justify-content: center;
    border: 5px double #0cb4ce;
}
.gallery_txt h4 {
    padding: 0 1em;
    text-align: center;
    color: #fff;
    font-size: 2em;
}
.gallery_txt:hover .img-responsive{
    transform: scale(1.1);
}

/*Photo Gallery Effect*/
.demo-gallery > ul {
  margin-bottom: 0;
}
.demo-gallery > ul > li {
    float: left;
    margin-bottom: 15px;
    width: 200px;
  -webkit-transition: -webkit-transform 0.15s ease 0s;
  -moz-transition: -moz-transform 0.15s ease 0s;
  -o-transition: -o-transform 0.15s ease 0s;
  transition: transform 0.15s ease 0s;
}
.demo-gallery > ul > li a {
    height:100%;
  border: 5px double #0cb4ce;
  border-radius: 3px;
  display: block;
  overflow: hidden;
  position: relative;
  float: left;
  -webkit-transition: -webkit-transform 0.5s ease 0s;
  -moz-transition: -moz-transform 0.5s ease 0s;
  -o-transition: -o-transform 0.5s ease 0s;
  transition: transform 0.5s ease 0s;
}
.demo-gallery > ul > li a > img {
  -webkit-transition: -webkit-transform 0.5s ease 0s;
  -moz-transition: -moz-transform 0.5s ease 0s;
  -o-transition: -o-transform 0.5s ease 0s;
  transition: transform 0.5s ease 0s;
  -webkit-transform: scale3d(1, 1, 1);
  transform: scale3d(1, 1, 1);
  height: 100%;
  width: 100%;
}
.demo-gallery > ul > li a:hover > img {
  -webkit-transform: scale3d(1.1, 1.1, 1.1);
  transform: scale3d(1.1, 1.1, 1.1);
}
.demo-gallery > ul > li a:hover .demo-gallery-poster > img {
  opacity: 1;
}
.demo-gallery > ul > li a .demo-gallery-poster {
  background-color: rgba(0, 0, 0, 0.1);
  bottom: 0;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
  -webkit-transition: background-color 0.15s ease 0s;
  -o-transition: background-color 0.15s ease 0s;
  transition: background-color 0.15s ease 0s;
}
.demo-gallery > ul > li a .demo-gallery-poster > img {
  left: 50%;
  margin-left: -10px;
  margin-top: -10px;
  opacity: 0;
  position: absolute;
  top: 50%;
  -webkit-transition: opacity 0.3s ease 0s;
  -o-transition: opacity 0.3s ease 0s;
  transition: opacity 0.3s ease 0s;
}
.demo-gallery > ul > li a:hover .demo-gallery-poster {
  background-color: rgba(0, 0, 0, 0.5);
}
.demo-gallery .justified-gallery > a > img {
  -webkit-transition: -webkit-transform 0.15s ease 0s;
  -moz-transition: -moz-transform 0.15s ease 0s;
  -o-transition: -o-transform 0.15s ease 0s;
  transition: transform 0.15s ease 0s;
  -webkit-transform: scale3d(1, 1, 1);
  transform: scale3d(1, 1, 1);
  height: 100%;
  width: 100%;
}
.demo-gallery .justified-gallery > a:hover > img {
  -webkit-transform: scale3d(1.1, 1.1, 1.1);
  transform: scale3d(1.1, 1.1, 1.1);
}
.demo-gallery .justified-gallery > a:hover .demo-gallery-poster > img {
  opacity: 1;
}
.demo-gallery .justified-gallery > a .demo-gallery-poster {
  background-color: rgba(0, 0, 0, 0.1);
  bottom: 0;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
  -webkit-transition: background-color 0.15s ease 0s;
  -o-transition: background-color 0.15s ease 0s;
  transition: background-color 0.15s ease 0s;
}
.demo-gallery .justified-gallery > a .demo-gallery-poster > img {
  left: 50%;
  margin-left: -10px;
  margin-top: -10px;
  opacity: 0;
  position: absolute;
  top: 50%;
  -webkit-transition: opacity 0.3s ease 0s;
  -o-transition: opacity 0.3s ease 0s;
  transition: opacity 0.3s ease 0s;
}
.demo-gallery .justified-gallery > a:hover .demo-gallery-poster {
  background-color: rgba(0, 0, 0, 0.5);
}
.demo-gallery .video .demo-gallery-poster img {
  height: 48px;
  margin-left: -24px;
  margin-top: -24px;
  opacity: 0.8;
  width: 48px;
}
.demo-gallery.dark > ul > li a {
  border: 3px solid #04070a;
}
.home .demo-gallery {
  padding-bottom: 80px;
}
.single_video {
    padding: 1em;
    border-radius: 5px;
    box-shadow: 0 0 5px 0;
    height: 100%;
    text-align: center;
}
.single_video a{
    margin: auto;
        display: inline-block;
    padding: 6px;
}
.instrument_inner .col-md-4{
    margin-bottom: 2em;
}
.instrument_inner .row{
    width: 100%;
}
.instrument_inner h3{
    margin-bottom: 1em;
    padding-left: 10px;
}
.graphic_inner img{
    width: 100%;
    cursor: pointer;
}
.graphic_inner{
    position: relative;
    border: 5px ridge #0cb4ce;
}
.graphic_info{
    position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  background-color: #000000e0;
  overflow: hidden;
  width: 100%;
  height: 100%;
  -webkit-transform: scale(0);
  -ms-transform: scale(0);
  transform: scale(0);
}
.graphic_inner:hover .graphic_info{
  -webkit-transform: scale(1);
  -ms-transform: scale(1);
  transform: scale(1);
}
.graphic_txt{
  width: 90%;
  color: #2e3746;
  font-size: 20px;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  text-align: center;
}
.graphic_txt p {
    font-size: 0.9em;
    color: #fff;
}
.event_info {
    display: flex;
    margin: auto;
    width: 80%;
    border-bottom: 1px solid #ccc;
    padding-bottom: 0.5em;
    margin-bottom: 0.5em;
    place-items: center;
}
.event_info:last-child{
    margin-bottom: 0;
    border-bottom: 0;
    padding-bottom: 0;
}
.events h3{
    margin-bottom: 1em;
}
.event_info h5,.event_info p {
    margin-bottom:0;
}
.event_date {
    margin: auto 0 auto auto;
    background-color: #141618;
    color: #fff;
    padding: 5px 10px;
}
.inner_services .col-md-3{
  margin-bottom: 2em;
  flex: 0 0 20%;
    max-width: 20%;
}
.inner_services img{
  width: 100%;
}
.inner_services .col-md-3:hover img{
  transform: scale(1.1);
}
.inner_services .inner_services_info{
  overflow: hidden;
  border-radius: 10px;
  position: relative;
}
.inner_services_text{
  position: absolute;
  bottom: 0;
  padding: 1em;
  width: 100%;
  text-align: center;
}
.inner_services_text h4{
  text-shadow: 1px 1px 2px #000;
  margin-bottom: 0;
  color: #fff;
}

/*Loader*/

.cube:nth-child(1),
.cube:nth-child(1) div {
  z-index: 1;
  animation-delay: 0.08333s;
}

.cube:nth-child(2),
.cube:nth-child(2) div {
  z-index: 2;
  animation-delay: 0.16667s;
}

.cube:nth-child(3),
.cube:nth-child(3) div {
  z-index: 3;
  animation-delay: 0.25s;
}

.cube:nth-child(4),
.cube:nth-child(4) div {
  z-index: 4;
  animation-delay: 0.33333s;
}

.cube:nth-child(5),
.cube:nth-child(5) div {
  z-index: 5;
  animation-delay: 0.41667s;
}

.cube:nth-child(6),
.cube:nth-child(6) div {
  z-index: 6;
  animation-delay: 0.5s;
}

.cube:nth-child(7),
.cube:nth-child(7) div {
  z-index: 7;
  animation-delay: 0.58333s;
}

.cube:nth-child(8),
.cube:nth-child(8) div {
  z-index: 8;
  animation-delay: 0.66667s;
}


.preloader {
  background-color: #323036;
  position: fixed;
  width: 100%;
  height: 100vh;
  padding: 0;
  margin: 0;
  display: table;
  z-index: 99999;
}

#vignette {
  display: block;
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  z-index: 4;
  background-image: -webkit-radial-gradient(50% 50%, ellipse cover, transparent, rgba(0, 0, 0, 0.5));
  background-image: -moz-radial-gradient(50% 50%, ellipse cover, transparent, rgba(0, 0, 0, 0.5));
}

#pos {
  width: 304px;
  margin: 0 auto;
}

#container {
  width: 100%;
  perspective: 2200px;
  padding: 20px 60px;
  position: relative;
  display: table-cell;
  vertical-align: middle;
}

.cube {
  width: 30px;
  height: 150px;
  position: relative;
  margin-right: 8px;
  float: left;
  transform-style: preserve-3d;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);
  animation: animCube;
  /* Safari and Chrome */
  animation-iteration-count: infinite;
}

.cube div {
  position: absolute;
  display: block;
  width: 30px;
  height: 150px;
}

.cube .center {
  width: 30px;
  box-shadow: 0 0 3px rgba(0, 0, 0, 0.3), inset 0 1px rgba(255, 255, 255, 0.05);
  animation: animCenter;
  animation-iteration-count: infinite;
}

.cube .bottom {
  width: 30px;
  height: 10px;
  bottom: 0;
  transform: rotateX(90deg);
  transform-origin: center bottom;
  animation: animBottom;
  animation-iteration-count: infinite;
}

.cube .left {
  left: 0;
  transform: rotateY(90deg);
  transform-origin: left center;
  animation: animSide;
  animation-iteration-count: infinite;
}

.cube .right {
  right: 0;
  transform: rotateY(-90deg);
  transform-origin: right center;
  animation: animSide;
  animation-iteration-count: infinite;
}

.cube .left,
.cube .center,
.cube .right,
.cube .bottom,
.cube {
  animation-duration: 1s;
  animation-timing-function: ease-in-out;
}

.left,
.right {
  background-color: #2b2830;
  background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0));
}

.center {
  background-color: #2b2830;
  background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0));
}

.bottom {
  background-color: #1f1d23;
  background-image: linear-gradient(to top, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0));
}

@keyframes animCube {
  30% {
    transform: translateZ(150px) translatex(0) translateY(0) rotatex(3deg) rotatey(0deg) rotateZ(0deg);
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.5), 0 12px 20px 1px rgba(0, 0, 0, 0.5);
  }
  100% {
    transform: translateZ(0px) rotatez(0deg);
    box-shadow: 0 0 30px rgba(0, 0, 0, 0.5), 0 0 0 0 transparent;
  }
}
@keyframes animSide {
  30% {
    width: 100px;
    background-color: #1d1c1f;
  }
  95% {
    width: 10px;
  }
}
@keyframes animBottom {
  30% {
    height: 100px;
  }
  95% {
    height: 10px;
  }
}
@keyframes animCenter /* Safari and Chrome */ {
  20% {
    background-color: #6a6371;
    box-shadow: 0 0 3px rgba(255, 255, 255, 0.15), inset 0 1px rgba(255, 255, 255, 0.5);
  }
  65% {
    box-shadow: 0 0 3px rgba(255, 255, 255, 0), inset 0 1px rgba(255, 255, 255, 0.25);
  }
}


/*Loader*/

.audio_content, .inner_services {
    background-color: #fff;
}
.studio_page_instruments{
    padding: 0 4em 2em;
}    
.studio_page_instruments h4{
    color: #0cb4ce;
}
.studio_page_instruments .col-lg-4{
    margin-bottom: 2em;
}
.studio_page_instruments h3{
    margin-bottom: 1em;
}



/*Mobile CSS*/

@media only screen and (max-width: 600px){
    
body{
    font-size: 16px;
}
.comingsoon h1 {
    font-size: 34px;
}
.mypadding{
  padding: 1em;
}
.studio_page_instruments{
    padding: 0 1em 2em;
} 
.bg-dark {
    padding: 1em 2em;
    background-color: #141618c4 !important;
}
.navbar-dark .navbar-toggler{
  color: #fff;
  border-color: #fff;
}
.sub_menu{
    position:inherit;
}
.nav_media {
    border-top: 1px solid #ffffff26;
    margin-left: 0;
    padding: 1em 0 0 0;
    width: 100%;
    border-left: 0;
}
.nav_media ul {
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
}
.navbar-dark .navbar-nav .nav-link{
  padding: 0.5em;
}
.slider_info{
  width: 80%;
}
.sounds_all{
  width: 100%;
}
.about p {
    padding: 0 1em;
    margin-bottom: 1em;
    text-align: justify;
}
#thumbnail-slider{
  padding: 1em 0;
}
.testimonial_info p{
  text-align: justify !important;
}
footer img {
    width: 70%;
    margin-top: 1em;
    margin-bottom: 1em;
}
.footer_bottom{
  display: block;
}
.footer_bottom p {
    margin-bottom: 0.5em;
}
.services .overlay{
    background-color: #0000009e;
    opacity: 1;
}
.services .overlay_text {
    opacity: 1;
}
.contact{
  padding: 0;
  padding-bottom: 2em;
}
.contact_div {
    width: 85%;
    padding: 2em 1em;
}
.contact form {
    padding: 0;
}
.contact .form-group {
    width: 100%;
}
.contact .mobile, .contact .subject {
    margin-bottom: 0.5em !important;
}
.aboutus {
    text-align: justify;
}
.why_us_txt, .studio_info_txt {
    padding: 2em !important;
    text-align: justify;
}
.audios_page .banner img {
    height: 100vh;
}
.audios_page .banner_info{
  width: 90%;
}
.audios_page .banner_info p{
  font-size: 1em;
}
.audios_page .banner_info h3 {
    font-size: 2em;
}
.banner_video svg{
  width: 4em !important;
  height: 4em;
  padding: 15px;
}
.audios_page .banner_info .btn_style{
  margin-bottom: 1.5em;
}
.audio_content_info {
    padding: 2em 1em;
}
.audio_content .col-md-6, .collections .col-md-4, .tracks .col-lg-6{
  margin-bottom: 2em;
  padding: 0;
}
.collections_heading, .tracks_heading{
  display: block;
}
.collections_heading a, .tracks_heading a {
    float: right;
}
.tracks_heading{
  margin-bottom: 3em;
}
.single_track span {
    width: 10%;
}
.track_info {
    width: 80%;
    padding: 0 1em;
}
.track_icons {
    width: 100%;
    display: flex;
    justify-content: flex-end;
}
.audio_fixed{
  padding: 4em 2em;
}
.inner_services .col-md-3{
  flex: 0 0 100%;
    max-width: 100%;
}





}

/*Tablet CSS*/

@media only screen and (min-width: 601px) and (max-width:1000px){

.mypadding{
  padding: 2em;
}
.navbar-dark .navbar-nav .nav-link{
  padding: 1em 0em;
    font-size: 0.8em;
}
.studio_page_instruments{
    padding: 0 2em 2em;
} 
.nav_media{
  display: none;
}
.bg-dark {
    background-color: #14161891 !important;
    padding: 1em 2em;
    border-bottom: 1px solid #ffffff26;
}
.carousel-item img {
    width: 100%;
    height: 50vh;
    -o-object-fit: cover;
       object-fit: cover;
}
.sounds_all {
    width: 95%;
}
#thumbnail-slider .slider-image{
  padding: 0;
}
.services .overlay{
    background-color: #0000009e;
    opacity: 1;
}
.services .overlay_text {
    opacity: 1;
}
.contact_div {
    width: 100%;
}
.contact form {
    padding: 0;
}
.banner img {
    height: 40vh;
}
.audios_page .banner img {
    height: 50vh;
}
.audio_content_info{
  padding: 2em;
}
.collections .col-md-4 {
    flex: 0 0 50%;
    max-width: 50%;
    margin-bottom: 2em;
}
.tracks .col-lg-6{
  margin-bottom: 2em;
  padding-bottom: 1em;
  border-bottom: 1px solid #ccc;
}
.tracks .col-lg-6:last-child{
  margin-bottom: 0;
  padding-bottom: 0;
  border-bottom: 0;
}



}