html,
body {
  height: 100%;
}

.navbar {
  padding: 1rem 2.6rem !important;
}

.gumroad .cart-button {
  position: fixed;
  top: .5rem !important;
  right: .5rem !important;
  display: none !important;
}

body {
  font-family: 'Lato', sans-serif;
  /*font-weight: lighter;*/
  font-size: 1.15rem;
}

author-byline {
  display: none !important;
}


.mainHeader {
  padding-bottom: 0.3rem;
  margin-bottom: 1rem;
  /*border-bottom: 1px solid grey;*/
}

.quizArea {
  /*width: 60vw;*/
  /*max-width: 90%;*/
  /*background-color: white;*/
  border-radius: 5px;
  padding: 10px;
  /*box-shadow: 0 0 10px 2px;*/
}

.buttonArea {
  display: grid;
  grid-template-columns: repeat(2, auto);
  gap: 10px;
  margin: 20px 0;
}


.start {
  font-size: 1.5rem;
  font-weight: bold;
  padding: 10px 20px;
  margin: 10px 0px;
  color: #fff;
  background-color: #0fb675;
  border-color: #0fb675;
}

.start:hover {
  font-size: 1.5rem;
  font-weight: bold;
  padding: 10px 20px;
  margin: 10px 0px;
  color: #fff;
  background-color: #079960;
  border-color: #079960;
}


.btn-game {
  font-size: 1.2rem;
  padding: 10px 20px;
  margin: 10px 0px;
  color: #fff;
  background-color: #0fb675;
  border-color: #0fb675;
}

.btn-game:hover {
  font-size: 1.2rem;
  padding: 10px 20px;
  margin: 10px 0px;
  color: #fff;
  background-color: #079960;
  border-color: #079960;
}

.btn-red {
  color: #FFFFFF;
  background-color: #b81616;
  background-image: none;
  border-style: dotted;
  border-width: 1px;
  border-color: #ffffff;
}

.btn-red:hover {
  color: #FFFFFF;
  background-color: #780b0b;
  background-image: none;
  border-style: dotted;
  border-width: 1px;
  border-color: #ffffff;
}

.btn-aqua {
  color: #FFFFFF;
  background-color: #00C1FC;
  background-image: none;
  border-color: #00C1FC;
}

.btn-aqua:hover {
  color: #FFFFFF;
  background-color: #1ABC9C;
  background-image: none;
  border-color: #1ABC9C;
}

.btn-blue {
  color: #FFFFFF;
  background-color: #6972f9;
  background-image: none;
  border-color: #6972f9;
}

.btn-blue:hover {
  color: #FFFFFF;
  background-color: #3c4299;
  background-image: none;
  border-color: #3c4299;
}

.btn-grey {
  color: #FFFFFF;
  background-color: #111;
  background-image: none;
  border-color: #111;
}

.btn-grey:hover {
  color: #FFFFFF;
  background-color: #555;
  background-image: none;
  border-color: #555;
}

.btn-yellow {
  color: #FFFFFF;
  background-color: #ffae00;
  background-image: none;
  border-color: #ffae00;
}

.btn-yellow:hover {
  color: #FFFFFF;
  background-color: #b98a3a;
  background-image: none;
  border-color: #b98a3a;
}

.center {
  display: block;
  margin-left: auto;
  margin-right: auto;
}


.controls {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}

.hide {
  display: none;
}

.scoresList {
  text-decoration: none;
  list-style-type: none;
  margin: 0.3rem 0;
}

#highScoresList {
  margin: 1rem 0;
}

#scoreArea {
  padding-bottom: 1rem;
  /*border-bottom: 1px solid grey;*/
}

#init {
  margin-top: 0.7rem;
}
#initials {
  margin: 0.3rem;
}

#save-btn {
  margin: 0.7rem;
}

#showScoresButton {
  margin-top: 0.3rem;
}

@media only screen and (max-width: 768px) {
  /* For mobile phones: */
  .buttonArea {
    display: grid;
    grid-template-columns: none;
    gap: 10px;
    margin: 20px 0;
  }
}














/* Social Locker */

/*    html, body {
        font-family: "Trebuchet MS", Helvetica, sans-serif;
        padding: 50px;
        background: #f7f8f9;
    }*/
    #sociallocker {
        background-color: black;
        text-align: center;
        position: relative;
        max-width: 500px;
        height: 120px;
        display: flex;
        align-items: center;
        justify-content: center;
        overflow: hidden;
        border-radius:10px;
    }
    #sociallocker-overlay {
        background-color: rgba(49, 49, 49, 0.83);
        font-size: 20px;
        font-weight: bold;
        color: white;
        transition: all 0.2s ease;
            padding: 23px;
    }
    #sociallocker-overlay i {
        margin-right: 10px;
    }
    #sociallocker:hover #sociallocker-overlay {
        top: -100%;
        transition: all 0.2s linear;
    }
    #sociallocker:hover #sociallocker-content {
        top: 100%;
        transition: all 0.2s linear;
    }
    #sociallocker-content a {
        display: inline-block;
        text-decoration: none;
        padding: 10px 20px;
        background-color: #777777;
        color: #f9f9f9;
        border-radius: 4px;
        font-weight: bold;
    }
    #sociallocker-overlay,
    #sociallocker-content,
    #sociallocker-links{
        position: absolute;
        width: 100%;
        height: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
        top: 0;
        left: 0;
    }
    #sociallocker-content {
        background-color: black;
        transition: all 0.2s ease;
    }
    .social-1 {
      text-decoration: none;
        color: #ffffff;
        display: inline-block;
        width: 60px;
        height: 60px;
        overflow: hidden;
      margin-right: 5px;
    }
    .social-1 i {
      display: flex;
        align-items: center;
        justify-content: center;
        height: 100%;
    }
    .social-1:hover i {
      background-color: rgba(0,0,0,0.1);
        transform: scale(1.2);
        transition: all 0.2s;
    }
    .fb { background-color: #4561A8; }
    .tw { background-color: #17ADEA; }
    .gp { background-color: #BF3B28; }
    .in { background-color: #1679B1; }
    .pi { background-color: #D9303C; }
    .su { background-color: #3ee675; }

/* Social locker */


.list-group-item {
background-color: rgba(255, 255, 255, 0);
}

.card{

position: relative;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
min-width: 0;
word-wrap: break-word;
background-color: #332f32;
background-clip: border-box;
border: 1px solid rgba(219, 219, 219, 0.13);
border-radius: .25rem;
}

.chord {
    background-color: #63c5ff;
    padding: 20px 4px 4px 4px;
    border-radius: 4px;
    margin-top: 30px;
}


.bottom-bar {
    background-color: #2d2c28;
    width: 100%;
    text-align: center;
    color: whitesmoke;
    padding: 16px;
    /* border-top: 1px solid whitesmoke; */
}

.bottom-bar-fixed-violet{
    /* background-color: #9501e0; */
    background: rgb(1,49,97);
    background: linear-gradient(34deg, rgb(0, 14, 77) 0%, rgb(111, 2, 147) 39%, rgb(228, 3, 55) 100%);
    position: fixed;
    bottom: 0;
    width: 100%;
    z-index: 9999999;
    text-align: center;
    color: whitesmoke;
    padding: 16px;

  }


.bottom-bar-fixed-christmas{
  /* background-color: #9501e0; */
  background: rgb(1,49,97);
  background: linear-gradient(34deg, rgb(196, 144, 0), rgb(223, 4, 228) 52.52%, rgb(0, 90, 184));
  position: fixed;
  bottom: 0;
  width: 100%;
  z-index: 9999999;
  text-align: center;
  color: whitesmoke;
  padding: 16px;

}  


  .bottom-bar-fixed-green{
    background-color: #65e001;
    position: fixed;
    bottom: 0;
    width: 100%;
    z-index: 9999999;
    text-align: center;
    color: whitesmoke;
    padding: 16px;

  }


.top-bar-fixed {
    position: sticky;
    background-color: #2a2c2e;
    top: 0;
    z-index: 1000;
    text-align: center;
    color: whitesmoke;
    padding: 22px;
    height: 90px;
      width:max-content;
  margin-left:auto;
  }


.bottom-bar-fixed-blue{
/*    background-color: #2196f3;*/
    position: fixed;
    font-weight: bolder;
    bottom: 0;
    width: 100%;
    z-index: 1000;
    text-align: center;
    color: black;
    padding: 16px;
    background: url(../img/summer-sale-footer.png) no-repeat; 
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
  }

  .bottom-bar-fixed-pict{
/*    background-color: #2196f3;*/
    position: fixed;
    font-weight: bolder;
    bottom: 0;
    width: 100%;
    z-index: 1000;
    text-align: center;
    color: black;
    padding: 16px;
    background: url(../img/summer-sale-footer.png) no-repeat; 
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
  }
  
  

.bottom-bar-fixed-blue .a.link {
  background-color: red;
  border-color: rgb(255, 87, 0);

}


.dropdown-item {
  border-bottom: 1px solid #ececec;
  padding: .55rem 4rem .55rem 1.1rem;
}

.dropdown-item-last {
  border-bottom: 0px solid #ececec;
  padding: .55rem 4rem .4rem 1.1rem;
}

.videoWrapper {
  position: relative;
  padding-bottom: 56.25%; /* 16:9 */
  padding-top: 25px;
  height: 0;
}
.videoWrapper iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}


.hero-home {
  height: 680px;
  background-color: #2c99ea; 
  color: white; 
}

h1 {
  /*font-weight: lighter !important;*/
  text-transform: uppercase;
}

p {
  /*font-weight: lighter !important;*/
}

.offer-panel {
  background-color: #2b2929;
  padding: 5%;
  color: #a2a2a2;
  border-radius: 5px;
  border: 1px solid #444444;
}

.hero-row {
  padding: 15% 0px 0px 0px;
}


.canvas {
  padding: 90px 10% 150px 10%;
}

.canvas-2 {
  padding: 20px 10% 20px 10%;
}

.footer {
  padding: 30px 0 40px 0;
  color: gray !important;
  -webkit-box-shadow: inset 0px 17px 24px -13px rgba(0,0,0,1);
  -moz-box-shadow: inset 0px 17px 24px -13px rgba(0,0,0,1);
  box-shadow: inset 0px 17px 24px -13px rgba(0,0,0,1);  
}

.canvas-bottom-cero {
  padding: 90px 0 0 0;
}

.canvas-air {
  padding: 10% 0 10% 0;
}

.air-top {
  margin-top: 40px;
}

.air-top-lg {
  margin-top: 140px;
}
.air-bottom-sm {
  margin-bottom: 20px;
}

.air-bottom-lg {
  margin-bottom: 70px;
}

.air-bottom-xlg {
  margin-bottom: 140px;
}

.air-bottom {
  margin-bottom: 40px;
}

.air-top-lg {
  margin-top: 120px;
}

.features{
font-size: 5em;
padding-top: 40px;

}

.h1Big {
  font-size: 6vh;
  font-weight: 300;
  padding: 5vh 0 5vh 0;
}

.h1Med {
  font-size:4.5vh;
  font-weight: 300;
  padding: 0 0 2vh 0;
}


.canvas-invert {
  color: white;
}

.canvas-gray {
background-color: #F4F4F4;

}


.canvas-midgray {
background-color: #212529;

}

.canvas-dimgray {
background-color: rgb(217, 217, 217);
}

.intemListCol {
border-radius: 6px;
border: 1px solid rgb(222, 222, 222);
background-color: rgb(238, 238, 238);
}

.table .td .table th{
  vertical-align: text-top !important;
}


@media screen and (max-width: 600px) {
  .mobile_hidden {
    visibility: hidden;
    clear: both;
    float: left;
    margin: 10px auto 5px 20px;
    width: 28%;
    display: none;
  }
}


.btn-border-inverse {
border: 1px solid white;
border-radius: 2px;
color: white;
padding: 5px 8px 5px 8px;
margin:20px 0px 40px 0px; 
text-decoration: none;

}

.btn-border-inverse:hover {
border: 1px solid whitesmoke;
border-radius: 2px;
color: whitesmoke;
padding: 5px 8px 5px 8px;
margin:20px 0px 40px 0px; 
text-decoration: none;

}

.btn-border-inverse:focus {
border: 1px solid whitesmoke;
border-radius: 2px;
color: whitesmoke;
padding: 5px 8px 5px 8px;
margin:20px 0px 40px 0px; 
text-decoration: none;

}

.canvas-darkgray {
background-color: #2C2C2C;

}

.canvas-dark {
background-color: rgb(31, 31, 31);
}





.bar-line {
  border-bottom: 1px solid rgba(240, 248, 255, 0.2)
}





.suit73-gradient {
background: rgb(48,6,80);
background: -moz-radial-gradient(circle, rgba(48,6,80,1) 0%, rgba(2,0,36,1) 95%);
background: -webkit-radial-gradient(circle, rgba(48,6,80,1) 0%, rgba(2,0,36,1) 95%);
background: radial-gradient(circle, rgba(48,6,80,1) 0%, rgba(2,0,36,1) 95%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#300650",endColorstr="#020024",GradientType=1);
}

.canvas-gradient-14 {
background: rgb(19,66,19);
background: radial-gradient(circle, rgba(19,66,19,1) 0%, rgba(14,29,1,1) 46%, rgba(12,29,0,1) 100%); 
}



.canvas-gradient {
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#023b77+0,000000+92,000000+92 */
background: #023b77; /* Old browsers */
background: -moz-radial-gradient(center, ellipse cover, #023b77 0%, #000000 92%, #000000 92%); /* FF3.6-15 */
background: -webkit-radial-gradient(center, ellipse cover, #023b77 0%,#000000 92%,#000000 92%); /* Chrome10-25,Safari5.1-6 */
background: radial-gradient(ellipse at center, #023b77 0%,#000000 92%,#000000 92%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#023b77', endColorstr='#000000',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */ 
}

.canvas-gradient-10{

/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#c9040d+0,8f0222+44,210002+100 */
background: #c9040d; /* Old browsers */
background: -moz-radial-gradient(center, ellipse cover, #c9040d 0%, #8f0222 44%, #210002 100%); /* FF3.6-15 */
background: -webkit-radial-gradient(center, ellipse cover, #c9040d 0%,#8f0222 44%,#210002 100%); /* Chrome10-25,Safari5.1-6 */
background: radial-gradient(ellipse at center, #c9040d 0%,#8f0222 44%,#210002 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c9040d', endColorstr='#210002',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
}

.canvas-gradient-3 {
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#030707+0,2d2d2d+44,000000+100 */
background: #030707; /* Old browsers */
background: -moz-linear-gradient(45deg, #030707 0%, #2d2d2d 44%, #000000 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(45deg, #030707 0%,#2d2d2d 44%,#000000 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(45deg, #030707 0%,#2d2d2d 44%,#000000 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#030707', endColorstr='#000000',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
}

.canvas-gradient-2{
background: #b5bdc8; /* Old browsers */
background: -moz-linear-gradient(-45deg,  #b5bdc8 0%, #828c95 36%, #28343b 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, right bottom, color-stop(0%,#b5bdc8), color-stop(36%,#828c95), color-stop(100%,#28343b)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(-45deg,  #b5bdc8 0%,#828c95 36%,#28343b 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(-45deg,  #b5bdc8 0%,#828c95 36%,#28343b 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(-45deg,  #b5bdc8 0%,#828c95 36%,#28343b 100%); /* IE10+ */
background: linear-gradient(135deg,  #b5bdc8 0%,#828c95 36%,#28343b 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b5bdc8', endColorstr='#28343b',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */

}

.canvas-gradient-4{

/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#2b2b2b+0,212121+25,000000+100 */
background: #2b2b2b; /* Old browsers */
background: -moz-radial-gradient(center, ellipse cover, #2b2b2b 0%, #212121 25%, #000000 100%); /* FF3.6-15 */
background: -webkit-radial-gradient(center, ellipse cover, #2b2b2b 0%,#212121 25%,#000000 100%); /* Chrome10-25,Safari5.1-6 */
background: radial-gradient(ellipse at center, #2b2b2b 0%,#212121 25%,#000000 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2b2b2b', endColorstr='#000000',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */

}

.canvas-gradient-markus{

/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#2b2b2b+0,212121+25,000000+100 */
background: #2b2b2b; /* Old browsers */
background: -moz-radial-gradient(center, ellipse cover, #2b2b2b 0%, #212121 25%, #000000 100%); /* FF3.6-15 */
background: -webkit-radial-gradient(center, ellipse cover, #2b2b2b 0%,#212121 25%,#000000 100%); /* Chrome10-25,Safari5.1-6 */
background: radial-gradient(ellipse at center, #2b2b2b 0%,#212121 25%,#000000 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2b2b2b', endColorstr='#000000',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */

}


.canvas-gradient-9 {
background: rgb(33,31,4);
background: -moz-radial-gradient(circle, rgba(33,31,4,1) 0%, rgba(26,28,24,1) 100%);
background: -webkit-radial-gradient(circle, rgba(33,31,4,1) 0%, rgba(26,28,24,1) 100%);
background: radial-gradient(circle, rgba(33,31,4,1) 0%, rgba(26,28,24,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#211f04",endColorstr="#1a1c18",GradientType=1);
}

.canvas-gradient-drumbada {
background: rgb(47,45,42);
background: -moz-radial-gradient(circle, rgba(47,45,42,1) 0%, rgba(45,40,29,1) 34%, rgba(15,15,12,1) 100%);
background: -webkit-radial-gradient(circle, rgba(47,45,42,1) 0%, rgba(45,40,29,1) 34%, rgba(15,15,12,1) 100%);
background: radial-gradient(circle, rgba(47,45,42,1) 0%, rgba(45,40,29,1) 34%, rgba(15,15,12,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#2f2d2a",endColorstr="#0f0f0c",GradientType=1);
}

.canvas-gradient-skywaves {
background: rgb(37,48,48);
background: radial-gradient(circle, rgba(37,48,48,1) 0%, rgba(19,29,29,1) 64%, rgba(11,24,24,1) 100%);
}

.canvas-gradient-scaper {
background: rgb(100,0,113);
background: -moz-linear-gradient(39deg, rgba(100,0,113,1) 0%, rgba(194,76,89,1) 54%, rgba(139,0,0,1) 100%);
background: -webkit-linear-gradient(39deg, rgba(100,0,113,1) 0%, rgba(194,76,89,1) 54%, rgba(139,0,0,1) 100%);
background: linear-gradient(39deg, rgba(100,0,113,1) 0%, rgba(194,76,89,1) 54%, rgba(139,0,0,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#640071",endColorstr="#8b0000",GradientType=1);
}





.canvas-gradient-tronic {
  background: rgb(1,49,97);
  background: linear-gradient(34deg, rgb(8, 8, 8) 0%, rgb(33, 33, 33) 39%, rgb(12, 12, 12) 100%);}


.canvas-gradient-tronic-2 {

  background: rgb(1,49,97);
  background: linear-gradient(34deg, rgba(1,49,97,1) 0%, rgb(147, 2, 147) 39%, rgb(181, 0, 0) 100%);
}

.canvas-blackfriday {
 background-image: url("../img/black-fondo.png");
 background-color: #000000;
 background-size: cover;
}

.canvas-holiday {
 background-image: url("../img/holiday.jpg");
 background-color: #000000;
 background-size: cover;
}

.elements-cont {
  margin: 0px 0px 30px 0px;
}


.elements {
  color: white;
  border-radius: 4px;
  border: 1px solid white;
  padding: 7px;
  margin: 10px 10px 10px 0;
  font-size: 1.1em;
  line-height: 1.2em;
  display: inline-block;
}


/*.navbar-brand,
.navbar-nav li a {
    line-height: 70px;
    height: 70px;
    padding-top: 0;
}*/

.section-header {
padding:40px 0 110px 0;
}

.custom-brand{
  width: 190px;
  margin-top: 15px;
}


/*.form-control {
  height: 47px !important;
}*/

.center-text-mobile {
  font-size: 64px;
}

/*.navbar-inverse-custom {
  background-color: #2394E8;
  border-color: #2c99ea;
}*/

.mobile-phone {
  display: none;
}

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

    .hero-row {
      padding: 8% 0 8% 0;
    }

    .mobile-image {
        display: none;
    }
    .center-text-mobile {
        text-align: left;
        color:white;
        font-size: 3em !important;
        margin-top: 40%;
    }
/*    .hero-home {
        height: 100%;
    }*/
    .mobile-phone{
      display: block;
    }
}

.text-gray {
  color: gray;
}

.img-bkg1 {

  background: url(../img/brush-drums-background-dark.jpg) no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}



.img-bkg-brushify-light {

  background: url(../img/brush-drums-background-light.jpg) no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}


.img-bkg-brushify-dark {

  background: url(../img/brush-drums-background-dark.jpg) no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}


.img-bkg1-fire {

  background: url(../img/stage-pianobass.jpg) no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}



.img-bkg-melodica {

  background: url(../img/melox-melodica-free-vst.jpg) no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}


.img-bkg-electric-piano-tines {

  background: url(../img/electric-piano-back.jpg) no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}



.img-bkg-prepiano{

  background: url(../img/tines-electric-piano-circuit.jpg) no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}



.img-bkg-electric-piano {

  background: url(../img/electric-piano.jpg) no-repeat center center; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}



.img-bkg-stage-new {

  background: url(../img/back_stage_new.jpg) no-repeat center center; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}


.img-bkg-half {

  background: url(../img/back_ele-piano.jpg) no-repeat center center; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}


.img-bkg-zp {

  background: url(../img/zp2.gif) no-repeat center center; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}


.img-bkg-studio {

  background: url(../img/studio.jpg) no-repeat center center; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}


.img-bkg-open {

  background: url(../img/melodica-open.jpg) no-repeat center center; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}


.img-bkg-brush-fingers {

  background: url(../img/brush-fingers-back.jpg) no-repeat center center; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

.img-bkg-melox-2 {

  background: url(../img/back_melox-pro.jpg) no-repeat center center; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

.img-bkg-markus-1 {

  background: url(../img/tines-electric-piano-vst-markus-glam.jpg) no-repeat center center; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

.img-bkg-markus-2 {

  background: url(../img/electric-piano-reed-tines.jpg) no-repeat center center; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

.img-bkg-model-t {

  background: url(../img/neon-2-crop-model-T-front-small.gif) no-repeat center center; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}


.img-bkg-model-t-neon {

  background: url(../img/neon1.jpg) no-repeat center center; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}


.img-bkg-dyno {

  background: url(../img/dyno-background.jpg) no-repeat center center; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

.img-bkg-reed200 {

  background: url(../img/reed200-background.png) no-repeat center center; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

.img-bkg-reed200-b {

  background: url(../img/reed200-background-3.jpg) no-repeat center center; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}



.img-bkg-synth1 {

  background: url(../img/fur-violin.jpg) no-repeat center center; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}


.img-bkg-synth2 {

  background: url(../img/fur-white.jpg) no-repeat center center; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

.img-bkg-synth3 {

  background: url(../img/fur-green.jpg) no-repeat center center; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

.img-bkg-glassy {

  background: url(../img/glassy.jpg) no-repeat center center; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

.img-bkg-glassy-light {

  background: url(../img/studio-light.jpg) no-repeat center center; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

.img-bkg-glassy-circuitry {

  background: url(../img/circuitry.jpg) no-repeat center center; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}


.img-bkg-modules {

  background: url(../img/modules-back-new.jpg) no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

.img-bkg-SUB {

  background: url(../img/SUB-Background-2.jpg) no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

.img-bkg-SUB-dark {

  background: url(../img/SUB-Background.jpg) no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}


.img-bkg-1959-dark{

  background: url(../img/1959-back-dark.jpg) no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}


.img-bkg-1959-light{

  background: url(../img/1959-back-light.jpg) no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}



.img-bkg-push {

  background: url(../img/push-back.jpg) no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}


.img-bkg-suit {

  background: url(../img/suit73v2-back.jpg) no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}


.img-bkg-suit-2 {

  background: url(../img/suit73-back.jpg) no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}


.img-bkg-organ {

  background: url(../img/organ-bkg.jpg) no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}


.img-bkg-electronylon {

  background: url(../img/electronylonback.jpg) no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}


.img-bkg-electronylon-top {

  background: url(../img/electronylon-top.jpg) no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

.img-bkg-electronylon-front {

  background: url(../img/electronylon-front.jpg) no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}


.img-bkg-electronylon-topleft {

  background: url(../img/electronylon-topleft.jpg) no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}


.img-bkg-klavee {

  background: url(../img/klavee-bkg.jpg) no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}


.img-bkg-klavee2 {

  background: url(../img/klavee-bkg2.jpg) no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

.img-bkg-klavee3 {

  background: url(../img/klavee-bkg3.jpg) no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

.img-bkg-klavee4 {

  background: url(../img/klavee-bkg4.jpg) no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

.img-bkg-affiliate {

  background: url(../img/affiliate-img.jpg) no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

.img-bkg-reed-day {

  background: url(../img/reed106-day.jpg) no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

.img-bkg-reed-night {

  background: url(../img/reed106-night.jpg) no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

.img-bkg-reed-sunset {

  background: url(../img/reed106-sunset.jpg) no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

.img-bkg-reed200v2 {

  background: url(../img/reed200back1.jpg) no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}


.img-bkg-grandpiano1 {

  background: url(../img/grandpiano-back1.jpg) no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

.img-bkg-grandpiano2 {

  background: url(../img/grandpiano-back2.jpg) no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

.img-bkg-alienize {

  background: url(../img/alienize-bkg.jpg) no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}


.img-bkg-alienize-2 {

  background: url(../img/alienize-bkg-2.jpg) no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

.img-bkg-alienize-3 {

  background: url(../img/alienize-bkg-3.jpg) no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

.img-bkg-bundle {

  background: url(../img/bundle-bg.jpg) no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}


.img-bkg-sandstorm-1 {

  background: url(../img/sandstorm-bkg1.jpg) no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}


.img-bkg-sandstorm-2 {

  background: url(../img/sandstorm-bkg2.jpg) no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}



.img-bkg-sandstorm-3 {

  background: url(../img/sandstorm-bkg3.jpg) no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}


/*.img-bkg-overheat-1 {

  background: url(../img/overheat-bkg1.jpg) no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}*/

.img-bkg-overheat-2 {

  background: url(../img/overheat-bkg2.jpg) no-repeat center center fixed;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;  
  
}

.img-bkg-overheat-3 {

  background: url(../img/overheat-bkg4.jpg) no-repeat center center fixed;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;  
  
}

.img-bkg-overheat-4 {

  background: url(../img/overheat-bkg4.jpg) no-repeat center center fixed;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;  
  
}

.img-bkg-overheat-1 {

  background: url(../img/overheat-bkg1.jpg) no-repeat center center fixed;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;    
  


}


.img-bkg-skywaves-1 {

  background: url(../img/skywaves-bkg1.jpg) no-repeat center center fixed;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;    
  


}

.img-bkg-skywaves-2 {

  background: url(../img/skywaves-bkg2.jpg) no-repeat center center fixed;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;    
  


}


.img-bkg-haptic-1 {

  background: url(../img/haptic-bkg1.jpg) no-repeat center center fixed;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;    
  
}


.img-bkg-haptic-2 {

  background: url(../img/haptic-bkg2.jpg) no-repeat center center fixed;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;    
  
}

.img-bkg-haptic-3 {

  background: url(../img/haptic-bkg3.jpg) no-repeat center center fixed;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;    
  
}

.img-bkg-haptic-4 {

  background: url(../img/haptic-bkg4.jpg) no-repeat center center fixed;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;    
  
}



.img-bkg-haptic-5 {

  background: url(../img/haptic-bkg5.jpg) no-repeat center center fixed;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;    
  
}


.img-bkg-haptic-6 {

  background: url(../img/haptic-bkg6.jpg) no-repeat center center fixed;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;    
  
}

.img-bkg-haptic-7 {

  background: url(../img/haptic-bkg7.jpg) no-repeat center center fixed;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;    
  
}


.img-bkg-drumbada-1 {

  background: url(../img/drumbada-img-bk1.jpg) no-repeat center center fixed;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;    
  
}

.img-bkg-drumbada-2 {

  background: url(../img/drumbada-img-bk2.jpg) no-repeat center center fixed;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;    
  
}


.img-bkg-drumbada-3 {

  background: url(../img/drumbada-img-bk3.jpg) no-repeat center center fixed;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;    
  
}


.img-bkg-drumbada-4 {

  background: url(../img/drumbada-img-bk4.jpg) no-repeat center center fixed;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;    
  
}

.img-bkg-drumbada-5 {

  background: url(../img/drumbada-img-bk5.jpg) no-repeat center center fixed;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;    
  
}

.img-bkg-scaper-1 {

  background: url(../img/scaper-back1.jpg) no-repeat center center fixed;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;    
  
}

.img-bkg-scaper-2 {

  background: url(../img/scaper-back2.jpg) no-repeat center center fixed;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;    
  
}

.img-bkg-scaper-3 {

  background: url(../img/scaper-back3.jpg) no-repeat center center fixed;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;    
  
}

.img-bkg-scaper-4 {

  background: url(../img/scaper-back4.jpg) no-repeat center center fixed;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;    
  
}

.img-bkg-collab-1 {

  background: url(../img/collab3-bkg.webp) no-repeat center center fixed;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;    
  
}

.img-bkg-collab-2 {

  background: url(../img/collab3-v2-back.webp) no-repeat center center fixed;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;    
  
}

.img-bkg-tronic-1 {
  background: url(../img/tronic-bkg1.jpg) no-repeat center center fixed;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;    
  
}


.img-bkg-tronic-2 {

  background: url(../img/tronic-bkg2.jpg) no-repeat center center fixed;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;    
  
}

.img-bkg-exclusive {

  background: url(../img/exclusive-bg.jpg) no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

.img-bkg-bf2024 {

  background: url(../img/black-friday/fondo.png) no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  background-attachment:scroll;
  background-attachment:fixed;
}

.img-bkg-hl2024 {

  background: url(../img/holiday_background_image.jpg) no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  background-attachment:scroll;
  background-attachment:fixed;
}



/* Video play */

.thumb {
  position: absolute;
  top: 90%; left: 50%;

  transform: translate(-50%,-50%);
  width: 90%;
}




/* Video Background */


.video-container {
    height: 500px;
    width: 100%;
    position: relative;
}

.video-container video {
  width: 100%;
  height: 100%;
  position: absolute;
  object-fit: cover;
  z-index: 0;
}

.content_center {
  display: flex;
  justify-content: center;
  align-items: center; 
  width: 250px;
  height: 150px;
  border : 1px solid black;
}


/* Just styling the content of the div, the *magic* in the previous rules */
.video-container .caption {
  z-index: 1;
  position: relative;
  text-align: center;
  color: #dc0000;
  padding: 10px;
}


/* Login */

.login-signup {

  margin-left: 3px;
  font-weight: 400;
  font-size: 15px;

}


/* Animated Image Alpha */

#cf {
  position:relative;
/*  height:281px;
  width:450px;*/
  margin:0 auto;
  padding-bottom: 40vh;
}

#cf img {
  position:absolute;
  left:0;
  -webkit-transition: opacity 1s ease-in-out;
  -moz-transition: opacity 1s ease-in-out;
  -o-transition: opacity 1s ease-in-out;
  transition: opacity 1s ease-in-out;
}

  @keyframes cf3FadeInOut {
  0% {
  opacity:1;
  }
  15% {
  opacity:1;
  }
  65% {
  opacity:0;
  }
  100% {
  opacity:0;
  }
}

#cf img.top {
animation-name: cf3FadeInOut;
animation-timing-function: ease-in-out;
animation-iteration-count: infinite;
animation-duration: 2s;
animation-direction: alternate;
}

  .responsive-container {
    max-width: 100%;
    font-family: "Open Sans", sans-serif;
  }

  @media (min-width: 768px) {
    .responsive-container {
      max-width: 70%;
    }
  }

.shopify-custom_btn {
    background-color: #e6004e; /* Cambia a tu color preferido */
    color: whitesmoke !important; /* Cambia el color del texto */
    border: none; /* Elimina el borde */
    border-radius: 3px; /* Redondea las esquinas */
    padding: 10px 20px; /* Ajusta el tamaño del botón */
    font-size: 16px; /* Ajusta el tamaño de la fuente */
    font-weight: bold; /* Hace el texto más grueso */
    cursor: pointer; /* Cambia el cursor a un puntero */
    transition: background-color 0.3s ease; /* Añade una transición suave */
    font-family: Open Sans, sans-serif;
    font-size: 18px;
    font-weight: 400;
    padding: 16px 3rem;
}

/* Animated Image Alpha Tronic sin fade */

#cf-tronic {
  position: relative;
  /*  height:281px;
      width:450px;*/
  margin: 0 auto;
  padding-bottom: 40vh;
}

#cf-tronic img {
  position: absolute;
  left: 0;
  /* Eliminamos las transiciones de opacidad */
}

@keyframes cf3FadeInOut {
  0% {
    opacity: 1;
  }
  49% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 0;
  }
}

#cf-tronic img.top {
  animation-name: cf3FadeInOut;
  animation-timing-function: steps(1, end);
  animation-iteration-count: infinite;
  animation-duration: 4s;
  animation-direction: normal;
}




.shopify-custom_btn:hover {
    background-color: #cf0046; /* Color de fondo al pasar el mouse */
    color: #f1f1f1; /* Cambia el color del texto en hover */
    text-decoration: none !important;
}

.shopify-custom_btn:active {
    background-color: #e6004e; /* Color al hacer clic */
    transform: scale(0.98); /* Efecto de clic */
}


.footer-bs {
    background-color: #3c3d41;
  padding: 60px 40px;
  color: rgba(255,255,255,1.00);
  /*margin-bottom: 20px;*/
  border-bottom-right-radius: 6px;
  border-top-left-radius: 0px;
  /*border-bottom-left-radius: 6px;*/
}
.footer-bs .footer-brand, .footer-bs .footer-nav, .footer-bs .footer-social,  .footer-bs .footer-ns { padding: 10px 25px; }
.footer-bs .footer-nav, .footer-bs .footer-social, .footer-bs .footer-social-1, .footer-bs .footer-ns { border-color: transparent; }
.footer-bs .footer-brand h2 { margin:0px 0px 10px; }
.footer-bs .footer-brand p { font-size:12px; color:rgba(255,255,255,0.70); }

.footer-bs .footer-nav ul.pages { list-style:none; padding:0px; }
.footer-bs .footer-nav ul.pages li { padding:5px 0px;}
.footer-bs .footer-nav ul.pages a { color:rgba(255,255,255,1.00); font-weight:bold; text-transform:uppercase; }
.footer-bs .footer-nav ul.pages a:hover { color:rgba(255,255,255,0.80); text-decoration:none; }
.footer-bs .footer-nav h4 {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 3px;
  margin-bottom:10px;
}

.footer-bs .footer-nav ul.list { list-style:none; padding:0px; }
.footer-bs .footer-nav ul.list li { padding:5px 0px;}
.footer-bs .footer-nav ul.list a { color:rgba(255,255,255,0.80); }
.footer-bs .footer-nav ul.list a:hover { color:rgba(255,255,255,0.60); text-decoration:none; }

.footer-bs .footer-social ul { list-style:none; padding:0px; }
.footer-bs .footer-social h4 {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 3px;
}
.footer-bs .footer-social li { padding:5px 4px;}
.footer-bs .footer-social a { color:rgba(255,255,255,1.00);}
.footer-bs .footer-social a:hover { color:rgba(255,255,255,0.80); text-decoration:none; }

.footer-bs .footer-social-1 ul { list-style:none; padding:0px; }
.footer-bs .footer-social-1 h4 {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 3px;
}
.footer-bs .footer-social-1 li { padding:5px 4px;}
.footer-bs .footer-social-1 a { color:rgba(255,255,255,1.00);}
.footer-bs .footer-social-1 a:hover { color:rgba(255,255,255,0.80); text-decoration:none; }

.footer-bs .footer-ns h4 {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 3px;
  margin-bottom:10px;
}
.footer-bs .footer-ns p { font-size:12px; color:rgba(255,255,255,0.70); }

@media (min-width: 768px) {
  .footer-bs .footer-nav, .footer-bs .footer-social, .footer-bs .footer-ns { border-left:solid 1px rgba(255,255,255,0.10); }
}

.titulos-home {
color: whitesmoke;
font-size: 1em;
margin-top: 41px;
opacity: 70%;
letter-spacing: 7px;
padding-bottom:40px;
}


.row .col {
        border: 1px solid #000;
        width: 100%;
      }
	  
	  
.btn-bundle	  {
    color: #fff;
    background-color: #da3720;
}

.btn-bundle:hover	  {
    color: #d54e3b;
    background-color: #fff;
}

.btn-bf  {
    color: #fff;
    background-color: #00c9d3;
}

.btn-bf:hover	  {
    color: #fff;
    background-color: #FF76CE;
}

.btn-black  {
    color: #fff;
    background-color: #000000;
}

.btn-black:hover	  {
    color: #000000;
    background-color: #ffffff;
}

.btn-exclusive {
    color: #fff;
    background-color: #ae905e;
}

.btn-exclusive:hover	  {
    color: #fff;
    background-color: #00e0d8;
}

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

.container-valign {
  position: relative;
  height: 400px;
}

.centered-element {
  margin: 0;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}

  .max-width50 {
    max-width: 50%;
  }
  
  .max-width40 {
    max-width: 40%;
  }
@media only screen and (max-width: 768px) {
  /* For mobile phones: */
  .max-width50 {
    max-width: 100%
  }
  
   .max-width40 {
    max-width: 100%
  }
}