.product-hero-container {
  background: #080C0D;
}

.product-hero-container .container {
  padding-left: 0;
  padding-right: 0;
}

.hero-wrapper>img {
  margin-bottom: 0;
}

#features .bg-darkgrey {
  background: #59616C;
  width: 100vw;
  height: 25vw;
  max-height: 260px;
  display: none;
}

.features-contents .bg-darkgrey {
  background: #59616C;
  width: 100%;
  height: 25%;
  max-height: 260px;
  display: none;
}

/*.bg-darkgrey {
  background: #59616C;
  width: 100vw;
  height: 25vw;
  max-height: 260px;
  display: none;
}*/

#features .row>.col-xs-12 img.img_icon,
.features-contents .row>.col-xs-10 img.img_icon {
  float: left;
  max-width: 40%;
  padding-bottom: 40px;
}

#features .section_connectivity img.img_icon,
.features-contents .section_connectivity .row>.col-xs-10 img.img_icon {
  padding-bottom: 30px;
}

.section_overlay>div {
  background: rgba(42, 91, 88, 1) !important;
  color: #fff !important;
}

.section_overlay .feature-header,
.section_overlay .feature-subheader,
.section_overlay p {
  color: #fff !important;
}

.section_overview .row>div {
  color: #fff;
}

#features .section_overview {
  padding-top: calc(100vw / 2560 * 1457);
}

.features-contents .section_overview {
  padding-top: calc(100% / 2560 * 1457);
}

#features .section_audio {
  padding-top: calc(100vw / 2560 * 994);
}

.features-contents .section_audio {
  padding-top: calc(100% / 2560 * 994);
}

#features .section_design {
  padding-top: calc(100vw / 2560 * 1200);
}

.features-contents .section_design {
  padding-top: calc(100% / 2560 * 1200);
}

#features .section_allbass {
  padding-top: calc(100vw / 800 * 741);
}

.features-contents .section_allbass {
  padding-top: calc(100% / 800 * 741);
}

#features .section_connectivity {
  padding-top: calc(100vw / 2560 * 1029);
}

.features-contents .section_connectivity {
  padding-top: calc(100% / 2560 * 1029);
}

.section_overview {
  background: #59626C url('./overview-image.jpg') no-repeat left top;
  background-size: 100% auto;
  height: auto;
}

.section_audio {
  background: #000 url('./tweeter.jpg') no-repeat left top;
  background-size: 100% auto;
  height: auto;
}

.section_design {
  background: url('./themes.jpg') no-repeat center top;
  background-size: 100% auto;
  height: auto;
}

.section_allbass {
  background: #000 url('./basxport-image-mobile.jpg') no-repeat;
  background-size: 100% auto;
  height: auto;
}

.section_connectivity {
  background: #000 url('./connectivity-image.jpg') no-repeat left top;
  background-size: 100% auto;
  height: auto;
}

.section_overlay>div {
  width: 100% !important;
  padding: 0px 118px !important;
  position: static !important;
}

.section_audio p,
.section_allbass p,
.section_connectivity p {
  color: #7c7c7c !important;
}

@media(min-width:768px) {

  .hero-wrapper {
    top: auto;
    bottom: 0;
    width: 110%;
  }
  .section_overview_header {
    margin-bottom: 0;
    margin-top: -59px;
    position: relative;
    z-index: 1;
  }
  .section_audio_header,
  .section_design_header,
  .section_connectivity_header {
    margin-bottom: 0;
    margin-top: -71px;
    position: relative;
    z-index: 1;
  }
  .section_design.section_overlay>div {
    background: rgba(42, 91, 88, 0.9) !important;
  }
}

@media(min-width: 992px) {
  .hero-wrapper {
    width: 100%;
  }
}

@media (min-width: 1200px) {

  .section_overview_header {
    margin-bottom: -157px;
  }
  .section_audio_header,
  .section_design_header,
  .section_connectivity_header {
    margin-bottom: -145px;
  }

  .bg-darkgrey {
    display: block !important;
  }
  .features-contents .bg-darkgrey {
  width: 100vw !important;
  height: 25vw !important;
}
  .section_overview_header {
    top: -280px;
  }
  .section_overview_header .feature-header {
    color: #fff !important;
  }
  .section_design_header .feature-header {
    color: #A1A1A1 !important;
  }
  
  .section_allbass h4 {
    margin-top: 0;
  }
  .section_allbass {
    background: #000 url('./basxport-image.jpg') no-repeat !important;
    background-size: 100% auto !important;
    height: calc(100vw / 2560 * 1197);
    padding-top: 0 !important;
    min-height: 500px !important;
  }
  .section_allbass .row>div {
    max-width: 400px;
    left: 65%;
    height: calc(100vw * 1197 / 2560);
    min-height: 500px !important;
  }
  #features .row>.col-xs-12 img.img_icon,
  .features-contents .row>.col-xs-10 img.img_icon {
    max-width: 70%;
  }
  .section_overview p {
    margin-top: 0;
  }
  .section_overview .row>div {
    max-width: 1170px;
    left: 0;
    right: 0;
    margin-left: auto !important;
    margin-right: auto !important;
    top: -130px;
  }
  .section_overview {
    background-size: cover;
    height: calc(100vw * 1457 / 2560);
    padding-top: 0 !important;
  }
  .section_overview,
  .section_overview .row.breakout {
    overflow: visible !important;
  }
  .section_audio {
    background-size: cover;
    height: calc(100vw * 994 / 2560);
    padding-top: 0 !important;
    min-height: 550px;
  }
  .section_audio .col-lg-3 {
    height: calc(100vw * 994 / 2560);
    width: 30%;
    max-width: 500px;
    min-height: 550px;
  }
  .section_design>div {
    text-align: center;
  }
  .section_connectivity {
    background-size: cover;
    height: calc(100vw * 1029 / 2560);
    padding-top: 0 !important;
  }
  .section_connectivity .col-lg-3 {
    height: calc(100vw * 1029 / 2560);
  }
  .knob-text,
  .section_connectivity .row > div {
    max-width: 450px !important;
  }

  #features .section_connectivity .row>.col-xs-12 img.img_icon,
  .features-contents .section_connectivity .row>.col-xs-10 img.img_icon {
    padding-bottom: 0px !important;
  }
}

@media (min-width: 1200px) and (max-width: 1439px) {
  .features-contents .section_design {
  padding-top: calc(100vw / 2560 * 1200) !important;
  }
}
@media (min-width: 1440px) {
  .section_design {
    background-size: 2560px auto;
    min-height: 1200px;
    padding-top: 0 !important;
  }
  .section_overlay>div,
  .section_overlay .row>div {
    width: 60% !important;
    max-width: 750px !important;
  }
  .section_overlay .row>div {
    padding-top: 30px !important;
    padding-bottom: 30px !important;
    padding-left: 120px !important;
    padding-right: 120px !important;
    left: 0;
    right: 0;
    margin-left: auto !important;
    margin-right: auto !important;
  }
}