    
@import url('https://fonts.googleapis.com/css2?family=Barlow:wght@200;400&display=swap');

@font-face {
    font-family:'AG';
    font-weight:normal;
    font-style:normal;
    src:    url('ag-regular.woff') format('woff'),
            url('ag-regular.ttf') format('truetype');
}

@font-face {
    font-family:'AG';
    font-weight:bold;
    font-style:normal;
    src:    url('ag-bold.woff') format('woff'),
            url('ag-bold.ttf') format('truetype');
}

b, strong {
    font-weight: 500;
    }
    
/*#5 column hack*/

.col-xs-5ths,
.col-sm-5ths,
.col-md-5ths,
.col-lg-5ths {
    position: relative;
    min-height: 1px;
    padding-right: 10px;
    padding-left: 10px;
}

.col-xs-5ths {
    width: 20%;
    float: left;
}

.dropdown-menu {
  padding-top: 40px;
}


#songkick {
margin-left: -15px;
}


@media (min-width: 768px) {
    .col-sm-5ths {
        width: 20%;
        float: left;
    }

    #mobile-banner { display: none; }
}

@media (min-width: 992px) {
    .col-md-5ths {
        width: 20%;
        float: left;
    }
}

@media (min-width: 1200px) {
    .col-lg-5ths {
        width: 20%;
        float: left;
    }
}


* {
    border-radius: 0 !important;
}


body {
    font-family:'AG', sans-serif;
    line-height: 1.7rem;
    background: #fff;
    color: #000;
}


.nav-trail {
  text-transform: capitalize;
  margin: 0 0 30px 0;
  font-size: 1rem;
}

.nav-trail small{
display: inline-block!important;
padding: 0 5px;
}


#db-footer {
  text-transform: uppercase;
  font-size: 0.7rem;
}

.page-header {
    margin: 0;
    padding: 0;
    border: none;
}

.content { padding-bottom: 6rem; }

.tab-content:empty {
  display: none;
}

.row.nhs500 {
    background-color: #9ED0F1;
    /* background-image: url(/custom/img/nhs500blur.jpg); */
    margin: 0;
    margin-bottom: 40px;
}


.nhs500-video {
    margin-top: 5px;
}


.social-stuff {
  float: right;
  text-align: right;
  display: block;
  position: absolute;
  top: 0;
  right: 0;
}

.social-stuff a div {
    height:22px;
    display:inline-block;
}

.social-stuff a {
font-size: 15px;
font-weight: bold;
color: #db3b7f;
margin-left: 5px;
text-decoration: none;
}

.social-stuff a:hover {
    text-decoration: none;
}

.social-stuff a.education {
    color: #3fbdbe;
}

.social a div, .social-faq a div {
    height:22px;
    display:inline-block;
}
.social-faq a div {
    position:relative;
    top:5px;
    margin-right:5px;
}
.s-facebook div {
    width:22px;
    background:url('/custom/img/s_facebook.png');
    background-size:22px 44px;
}
.s-twitter div {
    width:26px;
    background:url('../img/s_twitter.png');
    background-size:26px 44px;
}
.s-instagram div {
    width:21px;
    background:url('../img/s_instagram.png');
    background-size:21px 44px;
}
.s-youtube div {
    width:31px;
    background:url('../img/s_youtube.png');
    background-size:31px 44px;
}
.s-spotify div {
    width:22px;
    background:url('../img/s_spotify.png');
    background-size:22px 44px;
}
.s-tiktok div {
    width:22px;
    background:url('../img/s_tiktok.png');
    background-size:22px 44px;
}


.social-stuff a:hover div{
    background-position:0 -22px;
}

    .thumbnails-static img.img-responsive {
  margin-bottom: 5px;
}

    .thumbnails-static img.img-circle {
    border-radius: 50%!important;
}


#toggle-filters {
  border: none;
  background: none;
}

.main {
    padding-top: 2rem;
}


#product-types, #product-sizes, .clickable.heading br, .clickable.heading + .pager-list.btn-group {
    display: inline-block;
}
/*
#product-sizes {
    margin-left: 40px;
}
*/
.product-pagination {
/*! width: 100%; */
text-align: right;
float: right;
margin-left: 10px;
margin-right: -45px;
}

.btn-group.product-label-dropdown {
  margin-left: 20px;
}


ul#product-types {
  list-style-type: none;
  margin: 0 0 0 -15px;
  padding: 0;
}

ul#product-types > li > a {
  text-transform: capitalize;
  font-size: 0.9rem;
}


div#product-images a.MagicZoom {
margin-bottom: 5px;
}

.thumbnails-static {
    position: unset;
    width: 120px;
    float: left;
    /*! margin-left: -85px; */
    bottom: 45px;
}

.table > tbody > tr > td, .table > tbody > tr > th, .table > tfoot > tr > td, .table > tfoot > tr > th, .table > thead > tr > td, .table > thead > tr > th {
  border-top: 1px solid transparent;
}

.panel-body {
  padding: 15px 0;
}


p { 
    margin: 0 0 0.625rem; 
}

.clickable.heading {

    display: block;
    height: 100px;
}

.form-toggle-container.filter {
    margin: 0 40px;
}

body.page-databeats .clickable.heading  {
    display: block;
    height: 100px;
}

body.page-product .clickable.heading  {
    display: block;
    height: 50px;
}



/*#content pages */

div#anti-racist-resources a

{
  color: #3fbdbe;
}

.small-link {
 font-weight:400;
 font-size:14px
}
.anti-racism__banner {
 width:100%;
 margin:40px 0 20px
}
.anti-racism__list {
 margin:0 -5px;
 display:flex;
 flex-wrap:wrap;
 list-style:none;
 padding:0;
 box-sizing:border-box;
 padding:40px 0;
 text-align:center
}
.anti-racism__list li {
 padding:5px;
 box-sizing:border-box;
 width:100%
}
@media(min-width:745px) {
 .anti-racism__list li {
  width:50%;
  font-size:20px
 }
}
.anti-racism__list a {
 background:#3fbdbe;
 display:flex;
 padding:20px;
 color:#fff !important;
 font-weight:700;
 /*! height:calc(100% - 40px); */
 align-items:center;
 justify-content:center;
 text-decoration: none;
}
.anti-racism__list a:hover {
 background:#4c4c4c;
 color: #fff;
}
.anti-racism__section {
 border-top:5px solid #f2f2f2;
 padding:40px 0
}
.anti-racism__section h2 {
 margin:0 0 40px;
 font-size:28px;
 line-height:32px
}
@media(min-width:745px) {
 .anti-racism__padding {
  padding:0 80px
 }
}
@media(min-width:1145px) {
 .anti-racism__padding {
  padding:0 160px
 }
}
.anti-racism__back-to-sections {
 margin:20px 0 0;
 display:inline-block
}








/*#region Headings */
    h1, h2, h3, h4, h5, h6 {
    font-family: 'Barlow', sans-serif;
        text-rendering: optimizeLegibility;
}
    
    h1 {
  
    }
    h2 {
        font-size: 1.7rem;
        font-weight: 400;
        margin: 0 0 1.5rem 10px;
        text-transform: capitalize;
    }
    h3 {
        font-size: 1.25rem;
        margin: 2rem 0;
        /*text-transform: capitalize;*/
        font-family: 'Barlow', sans-serif;
    }

h3#filter-header {
  font-size: 1.15rem;
  margin: 10px 0 2rem 0;
  text-transform: unset;
}

h3#filter-header span.selected-filter {
  text-transform: capitalize;
  font-size: 120%;
}

    h4 {
    font-size: 1.2rem;
    margin: 1.2rem 0 1rem;
}

    h4.thumbnail-item-sizes,h4.thumbnail-item-price {
    font-size: 0.7em;
    margin: 10px 0 0 0;
            font-family: 'Barlow', sans-serif;
}

    h4.thumbnail-item-price {
        float: left;
        font-size: 0.7em;
        margin: 10px 0 0 0;
        font-family: 'Barlow', sans-serif;
        width: 40%;
}

    h4.thumbnail-item-format{
            float:  right;
            font-size: 0.7em;
            margin: 10px 10px 0 0;
            font-family: 'Barlow', sans-serif;
            text-transform: uppercase;
            color: silver;
}
    
        h4.thumbnail-item-sizes {
float: right;
margin-right: 10px;
color: silver;
}

h4.thumbnail-item-cat {
  position: absolute;
  top: -19px;
  right: 0;
  color: white;
  background-color: #555;
  padding: 4px 6px;
  font-size: 0.9rem;
  font-weight: 800;
  filter: drop-shadow(1px 1px 1px #ccc);
}

    h5 {
        font-size: 0.8rem;
        font-weight: normal;
        margin: 0 0 0.625rem;
        text-transform: capitalize;
    }
    h2.group em { font-size: 60%; 
      text-transform: capitalize;}

h2.artists {
  margin: 10px 0 20px 0!important;
  color: #3fbdbe;
font-weight: 400;
}

    h2.group {
color: #3fbdbe;
font-weight: 400;
float: left;
margin-left: -10px;
margin-top: 0;
    }

h2.page-heading {
    margin-left: 0;
    color: #3fbdbe;
    }
   
    body.page-databeats h2.group {
margin-left: 0;
    }

    .h1 .small, .h1 small, .h2 .small, .h2 small, .h3 .small, .h3 small, .h4 .small, .h4 small, .h5 .small, .h5 small, .h6 .small, .h6 small, h1 .small, h1 small, h2 .small, h2 small, h3 .small, h3 small, h4 .small, h4 small, h5 .small, h5 small, h6 .small, h6 small {
        color: inherit;
        opacity: 1;
        display: block;
        margin-top: 0.2em;
        margin-top: 4px;
        text-transform: capitalize;
        color: #959393;
        font-size: 85%;
    }

.caption.discount .caption-heading {
    font-size: 0.8rem;
}



h3.artist-heading {
  font-size: 1.2rem !important;
  line-height: 1rem;
  font-weight: bold;
    color: #3fbdbe;
}


/*#endregion */

/*#region Links */
    a {
        transition: all 0.15s;
        color: #3fbdbe;
    }
    a:hover,a:focus {
        color: #0a0a0a;
    }
/*#endregion */

/* #region Buttons */
    button {
        transition: all 0.15s;
    }
    .btn {
        text-transform: uppercase;
        box-shadow: none;
        /*font-weight: 600;*/
        letter-spacing: 0.0625rem;
        font-size: 0.7rem;
        line-height: 1.25rem;
        transition: all 0.15s;
    }
    .btn-default {
        background-color: #eee;
        color: #303030;
    }
    .btn-default:hover,.btn-default:focus {
        background-color: #fff;
        color: #222;
    }
    .btn-default.active, .btn-default:active, .open > .dropdown-toggle.btn-default {
        background-color: #fff;
        box-shadow: none;
    }

    div.filter  .btn-default.active, div.filter  .btn-default:active{
        background-color: #3fbdbe;
        box-shadow: none;
        color: #fff;
    }


    .btn-primary {
        background-color: #3fbdbe;
        border: 1px solid #3fbdbe;
        color: #fff;
    }
    .btn-primary:hover,.btn-primary:focus {
        background-color: #424242;
        border-color: #424242;
        color: #fff;
    }
    .btn-primary.active.focus, .btn-primary.active:focus, .btn-primary.active:hover, .btn-primary:active.focus, .btn-primary:active:focus, .btn-primary:active:hover, .open > .dropdown-toggle.btn-primary.focus, .open > .dropdown-toggle.btn-primary:focus, .open > .dropdown-toggle.btn-primary:hover {
        background-color: #424242;
        border-color: #424242;
        color: #fff;
    }
    .btn-primary.active, .btn-primary:active, .open > .dropdown-toggle.btn-primary {
        background-color: #424242;
        border-color: #424242;
        color: #fff;
    }
    .btn-primary.disabled.focus, .btn-primary.disabled:focus, .btn-primary.disabled:hover, .btn-primary[disabled].focus, .btn-primary[disabled]:focus, .btn-primary[disabled]:hover, fieldset[disabled] .btn-primary.focus, fieldset[disabled] .btn-primary:focus, fieldset[disabled] .btn-primary:hover {
        background-color: #424242;
        border-color: #424242;
        color: #ccc;
    }
    
.btn-cart.enabled {
  background-color: #3fbdbe;
  color: #fff;
}
.btn-cart.enabled:hover, .btn-cart.enabled:focus {
  background-color: #2d8788;
  color: #fff;
}

.btn-view-more-products {
  margin: 40px 0 0 0;
}

a.btn-colours {
    text-align: left;
    padding: 5px 0 0 10px;
    background-color: #fff;
    line-height: 0.9rem;
}

a.btn-colours > span {
    filter: drop-shadow(1px 1px 1px #ccc);
    font-size: 1.2rem;
    vertical-align: sub;
    line-height: 1.3rem;
    margin-right: 5px;
}

/*a.btn-colours > .fa-solid.fa-circle-check.pull-right {
  font-size: 1rem;
  padding-top: 2px;
  display: none;
}

a.btn-colours.active > .fa-solid.fa-circle-check.pull-right {
    display: block;
}*/

a.btn-colours.active, a.btn-types.active  {
    font-weight: 800!important;
}

a.filter-all {
    font-size: 0.8rem;
    margin-left: 10px;
    text-decoration: none;
    opacity: 0.5;
}

.btn-sizes {
  font-family: 'Barlow', sans-serif;
  font-size: 12px;
  color: #000;
  letter-spacing: 1px;
  line-height: 15px;
  border: 1px solid #000;
  border-radius: 40px !important;
  background: transparent;
  margin: 5px;
}

.btn-sizes:hover, .btn-sizes.active {
  color: #FFF;
  background: #000;
  border: 1px solid #000;
}




#product-colours, #product-sizes {
  margin-left: -10px;
  margin-bottom: 40px;
}

/* #endregion */

/*#region Lists */


ul.collapse.in {
    background-color: #fff;
}


ul#product-categories, ul#product-colours {
  list-style-type: none;
  margin: 0 0 40px -16px;
  padding: 0;
  /*! border: 1px solid silver; */
  border-bottom: none;
  /*! background-color: #f7f7f7; */
  /*! border-radius: 25px; */
}
ul#product-categories ul {
    list-style-type: none;
  margin: 0;
  padding: 0;
}


ul#product-categories li {
  list-style: none;
  /*! border-bottom: 1px solid silver; */
  padding: 2px 0 2px 10px;
}
ul#product-categories li>a {
  text-transform: uppercase;
  text-decoration: none;
  display: block;
  font-weight: 800;
  font-family: Barlow, sans-serif;
  /*! border-bottom: 1px solid #eaeaea; */
}

ul#product-categories ul li>a, ul#product-colours li>a {
      font-family: Barlow, sans-serif;
  text-transform: capitalize;
  text-decoration: none;
  display: block;
  font-weight: 200;
}

ul#product-colours li>a {
  text-transform: capitalize;
font-size: 0.9rem;
line-height: 1.5rem;
}



    .list-social {
        margin: 0;
        padding: 0;
        list-style: none;
        text-align: center;
    }
    .list-social li {
        display: inline;
    }
    .list-social a {
        padding: 0;
        display: inline-block;
        font-size: 1rem;
        line-height: 2rem;
        width: 2rem;
        height: 2rem;
        background-color: #888;
        color: #fff;
        border-radius: 50% !important;
        text-align: center;
    }
    .list-social a:hover, .list-social a:focus {
        background-color: #0a0a0a;
    }
/*#endregion */


/* #region Carousel */
    .carousel {
        margin-bottom: 40px;
        /*margin-top: -21px;*/
        overflow: hidden;
        padding: 5px;
        padding-bottom: calc( 1.5rem + 2px );
    }


    .carousel-caption {
    background: rgba(0, 0, 0, 0.6);
    position: absolute;
    bottom: 0;
    margin: 0;
    padding: 14px 20px 10px 20px;
    display: inline-block;
    width: 100%;
    color: #fff;
    left: 0;
    right: 0;
    text-align: left;
    display: none;
}
    .carousel-caption::before,
    .carousel-caption::after {
        display: table;
        content: " ";
    }
    .carousel-caption::after {
        clear: both;
    }
    .carousel-caption h2 {
    margin: 0;
    float: left;
    width: calc( 100% - 9.375rem );
    color: #fff;
    display: none;
}
    .carousel-caption .btn {
        float:right;
        color: #333332;
        background-color: #B34334;
        border-color: #B34334;
        border-width: 1px;
    }
    .carousel-caption .btn,.carousel-caption .btn:focus {
        color: #fff;
        background-color: #3FBDBE;
        border-color: #3FBDBE;
    }
    .carousel-controls {
    
    }
    .carousel-control {
        top: 17%;
        bottom: auto;
        font-size: 4em;
        width: 10%;
    }
    .carousel-control.left,.carousel-control.right {
    background: transparent;
    margin-top: 215px;
}
    .carousel-indicators {
        margin: 0 -1px;
        left: 0;
        right: 0;
        bottom: 0;
        width: auto;
        display: none;
        
        width: auto;
    }
    .carousel-indicators li {
        border: none;
        justify-content: space-around;
        flex-grow: 1;
        border-radius: 0;
        background-color: #4f4943;
        height: 1.5rem !important;
        margin: 0 1px;
        opacity: 0.5;
    }
    .carousel-indicators li:hover {
       opacity: 1;
    }
    .carousel-indicators li.active {
        background-color: #3FBDBE;
        border: none;
        opacity: 1;
    }
/* #endregion */


/*#region Header */
    .site-header {
    background-color: #fff;
    text-align: center;
    padding: 4rem 0 1rem;
}
    .site-header > .container {
        position: relative;
    }
    .header-logo {
    display: block;
    height: 80px;
}
    .header-logo img {
height: 25px;
    }

    .header-social {
        margin-top: 1.5rem;
    }
    .header-links {
        margin: 1.5rem 0 0;
        padding: 0;
        list-style: none;
        text-align: center;
    }
    .header-links li {
        display: inline;
    }

    .header-actions {
        
    }
    .actions-container {

    padding: 0 !important;
    }

    .nav-user {
        margin: 0;
        padding: 0;
        list-style: none;
        /*position: absolute;
        top: 3.75rem;*/
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 2.5rem;
        background-color: #fff;
        z-index: 1032;
    }
    .nav-user > li, .btn-search-toggle, .btn-close-search, .navbar-toggle {
        position: absolute;
        
    }
    .nav-user > li > a, .btn-search-toggle, .btn-close-search, .navbar-toggle {
        font-size: 0.9rem;
        line-height: 2.4rem;
        height: 2.5rem;
        width: 2.5rem;
        padding: 0;
        margin: 0;
        border: none;
        background: transparent;
        color: #000;
        display: block;
        outline: none;
        text-transform: uppercase;
    }
    .nav-user > li > a:hover, .btn-search-toggle:hover, .btn-close-search:hover, .navbar-toggle:hover,
    .nav-user > li > a:focus, .btn-search-toggle:focus, .btn-close-search:focus, .navbar-toggle:focus {
        background-color: #e2e2e2;
        color: #000;
        text-decoration: none;
    }
    .nav-account {
        right: 5rem;
        top: 0;
    }

    .btn-search-toggle {
        right: 2.5rem;
    }
    li.nav-basket a {
        padding: 0 1rem;
        width: auto;
    }
    li.nav-basket a.enabled {

    }

    .header-search {
        /*position: absolute;
        top: 3.75rem;*/
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        z-index: 1034;
    }
    #search {
        display: none;
        position: relative;
    }
    .searchbox {
        border:none;
        padding: 0 3rem 0 1rem;
        margin:0;
        line-height: 2.5rem;
        width: 100%;
        outline: none;
        background-color: #f5f5f5;
    }
    .btn-close-search {
        right: 0;
        top: 0;
        color: #999;
        font-size: 2rem;
    }
    .btn-close-search:hover, .btn-close-search:focus {
        background: #eee;
        color: #000;
    }
/*#endregion */

/* #region Panels */
    .panel {
        background-color: transparent;
    }
    .panel,.panel-group .panel {
        border: none;
        border-radius: 0;
    }
    .panel-heading {
        margin-top: 0;      
    }
    .panel-default > .panel-heading {
        background-color: transparent;
        color: inherit;
        border: none;
        border-radius: 0;
        border-bottom: 1px solid rgba(0,0,0,0.03);
    }
    .panel-footer {
        padding: 15px;
        background-color: transparent;
        border: none;
        border-radius: 0;
        font-family: barlow, sans-serif;
    }   

.panel-format > .panel-body, .panel-tracklist > .panel-body {
padding: 15px;
font-family: barlow, sans-serif;
}

th.format-name {
  padding-left: 10px !important;
}

/* #endregion */

/*#region Modals */
    .modal h3 {
        margin-top: 0;
    }
/*#endregion */

/* #region Thumbnail items */
    .thumbnail {
        background-color: rgba(255,255,255,0.2);
        border: 1px dotted rgba(0,0,0,0.3);
        border-radius: 0;
    }
    a.thumbnail.active, a.thumbnail:focus, a.thumbnail:hover {
        border: 1px solid #000;
    }
    a.thumbnail.MagicZoomPlus.active, a.thumbnail.MagicZoomPlus:focus, a.thumbnail.MagicZoomPlus:hover {
        border: 1px solid rgba(0,0,0,0.3);
    }

    .thumbnail-item {
        margin: 0;
        /*! display: block; */
    }
    .thumbnail-item-caption {
        padding: 1rem 0;
        /*! text-align: center; */
        min-height: 100px;
    }

/*    h3.thumbnail-item-heading:first-line { font-size: 1rem; font-weight: 400; }*/


    .thumbnail-item-heading, .media-view .media-heading {
    margin: 0;
    font-size: 0.8rem;
    font-weight: 200;
    /* min-height: 3.5rem; */
    color: #262626;

}
    
.artist-header .page-heading {
  color: #3fbdbe;
}

.thumbnail-item-caption.artists {
  min-height: unset !important;
}
    
    .owl-carousel .owl-item, .artwork-view.col-md-3, .artwork-view.col-md-4, .artwork-view.col-lg-3, .artwork-view.col-lg-2 {
    padding: 5px;
    border: 1px solid transparent;
    margin-bottom: 20px;
    /*! display: block; */
}
    
    .owl-controls {
        padding-right: 15px;
        text-align: left;
    }
    .owl-stage-outer + .owl-controls {
        display: none;
    }
    .owl-controls > div {
        font-size: 2rem;
        height: 2.5rem;
        width: 2.5rem;
        line-height: 2.5rem;
        text-align: center;
        background-color: #eee;
        color: #444;
        cursor: pointer;
        display: inline-block;
        transition: all 0.15s;
    }
    .owl-controls > div .fa {
        line-height: inherit;
    }
    .owl-controls > div:hover,.owl-controls > div:focus {
        background-color: #ddd;
        color: #222;
    }
    .owl-next {
        margin-left: 3px;
    }

    .js .thumbnail-item-actions {
    
        background-color: #181818c7;
}

.caption.preorder, .pre-order {
    background-color: #d277a4 !important;
    color: #fff !important;
}


/* #endregion */

/* #region Sidebar */


ul#store_labels > li > a {
  font-size: 0.8em;
  font-weight: 200;
  text-transform: uppercase;
  /*! margin-top: 0; */
}

.group.nhs500 {
    width: 100%;
    display: block;
}

    .navbar-fixed-top {
        position: static;
        min-height: 0;
        margin: 0;
    }
    #sidebar {
        position: fixed;
        z-index: 1033;
        top: 2.5rem;
        width: 100%;
        /*! background-color: #fff; */
        /*! box-shadow: 0 3px 3px rgba(0,0,0,.3); */
        background: #e2e2e2;
        min-height: 46px;
    }
    .sidebar-items {
        margin: 0 -15px;
        padding: 0;
        background: #eee;
    }
    .navbar-fixed-top .navbar-collapse {
        position: fixed;
        left: 0;
        top: 2.5rem;
        width: 100%;
        background: #eee;
        z-index: 1033;
        padding: 0;
    }
    .navbar-brand  {
        display: none !important;
    }

    .sidebar-item h2 {
        display: none;
    }
    .sidebar-link-list {
        margin: 0 0 1.5em;
        padding: 0;
        list-style: none;
    }
    .sidebar-link-list a {
    padding: 0 1rem;
    display: block;
    font-size: 20px;
    font-weight: 800;
    line-height: 2rem;
    border-top: 1px dotted rgba(0,0,0,0.15);
    text-transform: capitalize;
    color: #4c4c4c;
}
    .sidebar-link-list a:hover,.sidebar-link-list a:focus, .sidebar-link-list li.active a{
        color: #3fbdbe;
        text-decoration: none;
    }

    .sidebar-toggle {
        padding: 0;
        position: absolute;
        right: 0;
        top: -2.5rem;
        z-index: 1033;
        width: 2.5rem;
        height: 2.5rem;
        text-indent: 200%;
        white-space: normal;
        border: none;
        background: #fff0;
        color: #000;
    }
    .sidebar-toggle:hover, .sidebar-toggle:focus {
        background-color: #e2e2e2;
        color: #000;
    }
    .sidebar-toggle::before {
        font-family: FontAwesome;
        content: "\f0c9";
        font-size: 1rem;
        color: #000;
        position: absolute;
        left: 0;
        top: 0;
        width: 2.5rem;
        height: 2.5rem;
        line-height: 2.5rem;
        text-indent: 0;
    }
/* #endregion */

/*#region jPlayer */
    a.jp-button { color: #3fbdbe; }
    a.jp-button:hover,a.jp-button:focus { color: #0a0a0a; }
    .jp-play-bar { background-color: rgba(63, 189, 190, 0.31); }


    td.track, td.icon {
  vertical-align: middle !important;
}


table#tracks tr {
  background-color: #e2e2e270;
  border-bottom: 2px solid white;
}

table.product-formats tr {
  background-color: #e2e2e270;
  border-bottom: 2px solid white;
}



table.product-formats tr th, table.product-formats tr td {
  vertical-align: middle !important;
}


span.catnum {
font-size: 0.8rem;
margin-left: 5px;
color: #000;
background-color: #e2e2e270;
padding: 2px 5px;
}


/*#endregion */

/*#region Tabs */
    .tab-content {
        border: 1px solid #ddd;
        border-top: none;
        padding: 1.5rem 1rem 1rem;
        background-color: #fff;
        color: #222;
    }
    .modal .tab-content {
        border: none;
    }
/*#endregion */

@media (min-width: 768px){

    .container { width: 100%; }
    
    .main {
        padding: 0rem 0;
        position: relative;
    }
    .sidebar-nav .navbar-header {
        float: none;
    }

    .header-logo img {
        max-width: 100%;
        height: 68px;
        position: absolute;
        top: 0;
        z-index: 200;
        /* display: none; */
    }

    .nav-basket {
        right: 220px;
        top: 0;
    }

    .header-actions {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        z-index: 1034;
        height: 2.5rem;
        background: #fff;
    }
    .nav-user {
        position: relative;
        top: 0;
        left: 0;
    }
    .nav-user > li > a {
        padding: 0 1rem;
        width: auto;
    }
    .nav-account {
        right: 2.5rem;
    }

    .header-search {
        position: relative;
        top: 0;
        left: 0;
    }
    .btn-search-toggle {
        right: 0;
    }
    #search {
        position: absolute;
        width: 100%;
    }

    .navbar-toggle {
        display: none;
    }
    .navbar-fixed-top .navbar-collapse {
        position: static;
        background: transparent;
    }
    .sidebar-collapse,.sidebar-items {
        display: block;
        height: auto !important;
    }

    .sidebar .container {
        background: #616161;
        /*! box-shadow: 0 3px 3px rgba(0,0,0,.3); */
        background: #e2e2e2;
        min-height: 46px;
        /*! width: ; */
    }


    #sidebar {
        position: -webkit-sticky;
        position: sticky;
        top: 36px;
        z-index: 1034;
        margin-bottom: 30px;
    }
    .sidebar-items {
        margin: 0;
        background-color: transparent;
    }
    .sidebar-link-list {
        margin: 6px 0 0 -14px;
        padding: 0;
        list-style: none;
        text-align: left;
    }
    .sidebar-link-list li {
        display: inline;
    }
    .sidebar-link-list a {
        padding: 0 15px 0;
        display: inline-block;
        border-top: none;
        text-transform: capitalize;
        font-size: 1.3rem;
    }
}
@media (min-width: 992px){

        .container {  width: 100%;padding: 0 30px; background: #fff; }
        
    .owl-controls {
        margin-top: 0;
        text-align: right;
    }

        .social-stuff { right: 40px; }


#store_labels {
  float: right;
  margin-top: -30px;
}

}

@media (max-width: 1080px){
    #store_labels {
    display: none;
}
}

@media (max-width: 991px){




        .container {  width: 100%;padding: 0 30px; background: #fff; }


        .social-stuff { display: none; }

        .form-toggle-container.filter {
  margin: 10px 0;
}



}

@media (min-width: 1200px){
}
@media (min-width: 1440px){
        .container {
        width: 1660px;
        background: #fff;
        padding: 0 30px;
    }

        .page-mproduct .content .col-md-5 { width: 40%; }
    .page-mproduct .content .col-md-7 { width: 60%; }


}
@media (max-width: 767px){

#mobile-banner {
  height: calc(100vh - 85px);
  width: calc(100vw + 2px);
  overflow: hidden;
  padding: 0 0 50px 0;
  z-index: 1000;
  position: relative;
  top: -50px;
  margin: 0 -30px 0 -30px;
}
    

#ioss_banner {
  margin-top: 50px;
  margin-bottom: -25px;
  font-size: 0.9rem;
}

.owl-carousel .owl-item, .artwork-view.col-md-3, .artwork-view.col-md-4, .artwork-view.col-lg-3, .artwork-view.col-lg-2 {
margin-bottom: 0;

}


.content-item.row.artwork {
margin-top: 50px;
}


body.page-databeats2::-webkit-scrollbar { width: 0 !important }

body.page-databeats2 {
    overflow: -moz-scrollbars-none; 
 -ms-overflow-style: none;
}


body.page-databeats2 {
  /*FireFox*/
  scrollbar-width: none;
  /*IE10+*/
  -ms-overflow-style: -ms-autohiding-scrollbar;
}
body.page-databeats2::-webkit-scrollbar {
  /*Chrome, Safari, Edge*/
  display: none;
}


body.page-databeats .clickable.heading {
display: block;
height: 10px;
}

#store_labels {
display: block;
}

.header-logo {
display: block;
height: 0;
}

.product-pagination {

float: right;
}

.btn-group.product-label-dropdown {
float: right;
margin-right: -10px;
}


.page-mproduct .content .col-md-5 { width: 100%; }
.page-mproduct .content .col-md-7 { width: 100%; }

.content {
padding-top: 40px;
}

.header-logo img {
max-width: 100%;
width: 150px;
height: auto;
z-index: 1050;
position: fixed;
margin-left: -14px;
}
.main {
padding-top: 0;
}
.site-header {
padding: 3.2rem 0 0;
}

.social-stuff { display: none; }

.nav-basket {
/*        right: 130px;*/
top: 0;
}

.clickable.heading {
margin: 2rem 0 1rem 0;
}

.form-toggle-container.filter {
margin-top: 10px;
float: left !important;
margin-left: -10px;
}

.thumbnails-static {display: none;}

h2.group {
margin-top: 0;
margin-bottom: 40px;
margin-left: -10px;
margin-top: -40px;
}

.sidebar-link-list a { 
color: #000; 
text-align: right; 
padding: 5px 25px;}

.carousel {
display: block;
margin: 50px -15px 0 -15px;
/*! margin-left: -15px; */
padding-bottom: 0;
}

.carousel .item {
height: 190px;
}

h2.page-heading {
font-size: 1rem!important;
margin-top: 20px;
}

.panel-body, .panel-heading, .panel-footer {
padding: 0 !important;
}

ul#product-colours li > a {
float: left;
}

a.btn-colours > span {
    margin-right: 0;
}



}