main{ background-color: #fff; }
main section#bandmenu{ background: transparent; }

.default-margin{ margin-bottom: 1rem; }

.artist-profile-banner {
    background-size: cover!important;
    position: relative;
    z-index: 1;
    height: 720px;
    /*margin-top: -82px;*/
}

.artist-profile-banner .wrapper {
    position: absolute;
    bottom: 100px;
    left: 0;
    width: 100%;
    z-index: 2;
    color: #fff;
}

.artist-profile-banner .wrapper h1 {
    margin: 0 0 5px 0;
    line-height: 1;
}


.artist-profile-banner div.labels label {
    color: #eee;
    font-size: 18px;
    letter-spacing: 0.75px;
    line-height: 1.333333;  
    margin-right: 30px;
}


div.labels ul {
    display: inline-block;
}

div.labels ul li {
    display: inline-block;
    color: #eee;
    font-size: 18px;
    letter-spacing: 0.75px;
    line-height: 1.333333;
}

div.labels ul li:not(:last-child)::after {
    content: ",";
    display: inline-block;
    margin-right: 5px;
}

.dialog-banner .gradient::before {
    content: "";
    display: block;
    position: absolute;
    z-index: -2;
    background: #fff;
    width: 100%;
    height: 100%;
}

.dialog-banner .gradient,.dialog-banner .gradient > span {
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 720px;
    z-index: -1;
}

.artist-profile-banner .gradient,.artist-profile-banner .gradient > span {
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 720px;
    z-index: -1;
}

/*
#bandmenu {
    position: -webkit-sticky;
    position: sticky;
    top: 90px;
    z-index: 6;
}
*/
#bandmenu {
    padding: 0;
    margin-top: -40px;
}

#bandmenu .container {
    padding: 0;
    height: 80px;
    border: 1px solid #DDDEE5;
    border-radius: 5px;
    background-color: #FFFFFF;
    box-shadow: 0 3px 4px 0 rgba(0,0,0,0.03);
}

#bandmenu .container .navigation {
    padding: 0 30px;
    display: table;
    width: 100%;
    position: absolute;
}

#bandmenu .container .navigation li {
    display: block;
    float: left;
    line-height: 78px;
    margin-right: 50px;
}

#bandmenu .container .navigation li:last-child {
    margin-right: 0;
}

#bandmenu .container .navigation li a {
    color: #7C8390; display: inline;
}

#bandmenu .container .navigation li a.selected {
    color: #313844;
    border-bottom: 1px solid #bbb;
}

#bandmenu ul { display: flex; height: 78px; border-radius: 5px; align-items: center; }

#bandmenu ul.steps { text-transform: uppercase; align-items: start; }
#bandmenu ul.steps li{ padding: 20px 50px; height: calc(100% - 1px); text-align: center; opacity: .35; font-weight: 500; }
#bandmenu ul.steps li.selected{ background-color: var(--primary)!important; opacity: 1; color: #fff!important; border-radius: 5px; }
#bandmenu ul.steps li > small{ display: block; text-transform: uppercase; font-size: 12px; opacity: .5; }

section#Products button{ position: absolute; top: 0; right: 0; line-height: 44px; text-transform: none; }
section#Products div.col-lg-8{ position: relative; }

section#Products div.helper a.button{ display: block; padding: 0 25px; line-height: 44px; background-color: var(--blue); color: #fff; text-transform: none; }

#bandmenu .container div.actions {
    margin-top: 10px;
    padding-right: 30px;
}

#bandmenu .container div.actions a {
    float: left;
    margin-left: 11px;
}

div.actions{ position: absolute; top: 10px; right: 0; text-align: right;  }

.products .product { border: 1px solid #DDDEE5; border-radius: 5px; background-color: #FFFFFF; box-shadow: 0 3px 4px 0 rgba(0,0,0,0.03); padding: 0; overflow: hidden; }
.products .product + div.product { margin-top: 30px; }
.products .product div[class^="col-"]{ padding: 0; }

.products .product .actions .play{ right: 10px; }

.products .product .content{ padding: 18px 30px; position: relative; }
.products .product div.artist{ height: 100%; }

.products .product .content h4{ font-size: 18px; margin-bottom: 5px; }
.products .product .content .labels{ color: #84888F; margin-bottom: 15px;}
.products .product .content .labels label{ margin-right: 30px; }
.products .product .content a.circle-play{ color: #243046; line-height: 36px; }
.products .product .content a.circle-play i{ font-size: 36px; float: left; margin-right: 10px; }

.products .product .image{ height: 100%; padding-bottom: 73.5%; background-size: cover!important; background-repeat: no-repeat !important; }

.mobileonly {
    display: none;
}

.band-gallery {
    height: 480px;
    display: table;
}

.band-gallery > div {
    height: 480px;
    display: table-cell;
    padding-right: 30px;
}

.band-gallery > div img {
    height: 100%;
    width: auto;
    vertical-align: middle;
    opacity: 0.15;
    transition: all .5s ease;
}

.band-gallery > div.active img {
    opacity: 1;
    transition: all .3s ease;
}

.band-gallery-wrapper {
    overflow: hidden;
}

.band-gallery > div.video-iframe {
    opacity: 0.15;
    transition: all .5s ease;
}

.band-gallery > div.active.video-iframe {
    opacity: 1;
}

.band-gallery-wrapper .video-iframe iframe {
    width: 853px;
    height: 480px;
}

.band-gallery-wrapper .video-iframe label {
    display: block;
    text-align: center;
    color: #7C8390;
    font-size: 11px;
    font-weight: 700;
    line-height: 15px;
}


.pager{ display: table; margin-top: 30px; }
.pager a{ display: block; float: left; }
.pager span{ display: block; float: left; padding: 0 17px; opacity: 0.6; font-size: 12px; color: #0B143D; font-weight: 700; line-height: 36px; }
.pager .prev{ background: url(svg/ic_keyboard_arrow_left_black_18px.svg) center center no-repeat; }
.pager .next{ background: url(svg/ic_keyboard_arrow_right_black_18px.svg) center center no-repeat; }

#Biography div.h3 {
    margin-bottom: 30px;
    max-width: 63ch;
}

.text.two-column {
    column-count: 2;
    column-gap: 60px;
}


div.products div.product{ margin: 0; }
div.products div.checkbox { position: absolute; top: 20px; left: unset; right: 40px; }
div.products div.checkbox input{  opacity: 0; pointer-events: none; }
div.products div.checkbox div.content svg{ position: absolute; top: 15px; right: 15px; }

div.products div.checkbox div.labels > label{ padding: 0!important; }
div.products div.checkbox > label{ cursor: pointer; display: block; padding: 0; }
div.products div.checkbox input:checked + label div.content svg path{ fill: #007cb5; }
div.products div.checkbox input:hover + label div.content svg path{ fill: #007cb5; }
div.products div.checkbox input + label em{ display: none!important; }

form.box {
  background-color: #f3f3f3;
  padding: 30px;
  border-radius: 5px;
}

form.box input, form.box select,
form.box textarea {
  background-color: #fff;
  border-radius: 5px;
}

form.box div.field > label {
  display: block;
  text-transform: uppercase;
  font-size: 14px;
  font-weight: 700;
  margin-bottom: 6px;
}

form.box div.grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-gap: 20px;
  margin: 15px 0 20px 0;
}

div.checkboxlist{ display: flex; align-items: center; gap: 40px; }

div.checkboxlist > div.checkbox{ margin-top: 5px; }

div.disabled{ opacity: 0; pointer-events: none; }

form.box .field { margin-bottom: 0; }
form.box div.wrapper .field + .field{ margin-top: 20px; }

form.box div.wrapper div.row{ margin-top: 20px; margin-bottom: 20px; }
form.box div.wrapper div.row .field + .field { margin-top: 0; }

form.budget div.row{ margin: 0 -3px; }
form.budget div.row > div{ padding: 0 3px; }
form.budget span.dotted-line{ display: block; border-bottom: 1px dashed #aaa; margin-bottom: 4px;  }

form.budget div.row + div.row{ margin-top: 10px; }

form.budget input,
form.budget div.select select{
  line-height: unset;
  height: unset;
  padding: 0;
  background-color: unset;
  border: unset;
  padding-right: 40px;
  box-shadow: unset;
}

form.box div.checkbox-list .field + .field{ margin-top: 15px; }

div.helper {
    border-radius: 5px;
    border: 1px solid #DDDEE5;
    box-shadow: 0 1px 10px 0 rgba(0, 0, 0, 0.05);
    padding: 30px;
    background-color: #fff;
    z-index: 1;
    margin-bottom: 2rem;
}

div.helper.overview ul li { margin-bottom: 20px; } 

div.helper ul li > small {
    text-transform: uppercase;
    font-size: 12px;
    opacity: .5;
    font-weight: 500;
}

.theme1-gradient {
    background: linear-gradient(180deg, rgba(54,54,54,0) 0%, rgba(54,54,54,0.36) 23.72%, #363636 100%);
}

.theme2-gradient {
    background: linear-gradient(180deg, rgba(156,156,156,0) 0%, rgba(156,156,156,0.36) 23.72%, #9C9C9C 100%);
}

.theme3-gradient {
    background: linear-gradient(180deg, rgba(17,65,100,0) 0%, rgba(17,65,100,0.36) 23.72%, #114164 100%);
}

.theme4-gradient {
    background: linear-gradient(180deg, rgba(34,84,201,0) 0%, rgba(34,84,201,0.36) 23.72%, #2254C9 100%);
}

.theme5-gradient {
    background: linear-gradient(180deg, rgba(39,17,99,0) 0%, rgba(39,17,99,0.36) 23.72%, #271163 100%);
}

.theme6-gradient {
    background: linear-gradient(180deg, rgba(79,34,201,0) 0%, rgba(79,34,201,0.36) 23.72%, #4F22C9 100%);
}

.theme7-gradient {
    background: linear-gradient(180deg, rgba(71,19,24,0) 0%, rgba(71,19,24,0.36) 23.72%, #471318 100%);
}

.theme8-gradient {
    background: linear-gradient(180deg, rgba(199,54,66,0) 0%, rgba(199,54,66,0.36) 23.72%, #C73642 100%);
}

.theme9-gradient {
    background: linear-gradient(180deg, rgba(110,90,33,0) 0%, rgba(110,90,33,0.36) 23.72%, #6E5A21 100%);
}

.theme10-gradient {
    background: linear-gradient(180deg, rgba(213,175,64,0) 0%, rgba(213,175,64,0.36) 23.72%, #D5AF40 100%);
}

.theme11-gradient {
    background: linear-gradient(180deg, rgba(75,102,41,0) 0%, rgba(75,102,41,0.36) 23.72%, #4B6629 100%);
}

.theme12-gradient {
    background: linear-gradient(180deg, rgba(143,194,78,0) 0%, rgba(143,194,78,0.36) 23.72%, #8FC24E 100%);
}

.theme13-gradient {
    background: linear-gradient(180deg, rgba(52,105,79,0) 0%, rgba(52,105,79,0.36) 23.72%, #34694F 100%);
}

.theme14-gradient {
    background: linear-gradient(180deg, rgba(98,196,149,0) 0%, rgba(98,196,149,0.36) 23.72%, #62C495 100%);
}

div.helper.adaptive div.mobil{ display: none; }

@media (min-width: 1400px) {
    div.helper { margin-left: 80px; }
}

@media (max-width: 991px){

    section#Products{ z-index: 3; }
    section#Products div.helper.adaptive div.mobil a.button:last-child,
    section#Products div.helper.adaptive div.wrapper,
    section#Products div.helper.adaptive div.desktop{ display: none; }

    section#Products div.helper.adaptive{ position: fixed; bottom: 0; left: 0; width: 100%; padding: 0; border: none; margin: 0; }
    section#Products div.helper.adaptive div.mobil{ display: block; padding: 3px; }
    section#Products div.helper.adaptive div.mobil a.button{
        border-radius: 5px; line-height: 58px; font-size: 20px; background-color: #579600; border-color: #579600;
        box-shadow: 0px 15px 15px 0px rgba(0, 0, 0, 0.07);
    }

    section#Products div.helper.adaptive.open a.button:first-child{ display: none; }

    section#Products div.helper.adaptive.open div.wrapper span.x {
        width: 24px;
        height: 24px;
        right: 10px;
        background: url(black-x.svg) no-repeat;
        top: 10px;
    }

    section#Products div.helper.adaptive.open div.wrapper{
        border-radius: 5px;
        border: 1px solid #DDDEE5;
        box-shadow: 0 1px 10px 0 rgba(0, 0, 0, 0.05);
        padding: 30px;
    }

    section#Products div.helper.adaptive.open div.wrapper,
    section#Products div.helper.adaptive.open a.button:last-child{ display: block!important; }

    .text.two-column { column-count: 1; column-gap: 0px; }

}

@media (max-width: 767px){
    
    section.artist-profile-banner h1 { font-size: 26px; }

  .artist-profile-banner div.labels label,
  .dialog-banner div.labels label,
  div.labels ul li{ font-size: 12px!important; }
  .artist-profile-banner .emsemble{ display: none; }

	/*.products .product .content{ font-size: 12px; line-height: 16px; }*/

	.members .member { width: 100%; margin: 0; float: none; }

	.artist-profile-banner .wrapper h1{ margin-right: 0!important; float: none; display: block!important; }
	.artist-profile-banner .wrapper .labels ul { display: block; margin: 0; }
	
	.artist-profile-banner .wrapper.before-sticky .image img { top: 5px; }	
	.artist-profile-banner .wrapper.before-sticky { bottom: 55px; }

	.band-gallery{ height: 400px; }
	.band-gallery > div{ height: 400px; padding-right: 15px; }
	.band-gallery-wrapper .video-iframe iframe { width: 600px; height: 337px; }	
	
	#Videos .pager,
	#Gallery .pager{ margin-left: auto; margin-right: auto; }

}

@media (max-width: 575px){

    .artist-profile-banner, .artist-profile-banner .gradient, .artist-profile-banner .gradient > span {
        height: 360px;
    }

    .artist-profile-banner .wrapper {
        bottom: 50px;
    }


    div.helper{ padding: 15px; }

  .product .desc{ display: none; }
  .product .mobileonly{ display: block; padding: 15px; border-top: 1px solid #DDDEE5; background: #F8F9FA; }
  .products .product .content .labels { margin: 10px 0; }
  .products .product .content .labels label { display: block;  margin: 0; }
  
  .products .product .content { padding: 15px 30px 0 30px; }

  .band-info .band-gallery.item1{ height: auto; display: block; }

  .band-gallery{ height: 200px; }
  .band-gallery > div{ height: 200px; padding-right: 15px; }
  .band-gallery-wrapper .video-iframe iframe { width: 300px; height: 168px; }

  .band-gallery.item1 > div.video-iframe { overflow: hidden; padding-top: 56.25%; position: relative; height: auto!important; width: calc(100% - 30px); margin: 0 15px; display: block; }
  .band-gallery.item1 > div.video-iframe iframe { border: 0; height: 100%; left: 0; position: absolute; top: 0; width: 100%; }
  
    
    #Biography div.h3 { font-size: 20px; }


}