body {
    padding-top: 78px;
    background-color: #f3f4f0;
	font-family: brandon-grotesque, sans-serif;
}
a, a:focus, a:hover {
    color: #ba2424;
    text-decoration: none;
}
.h1, .h2, .h3, h1, h2, h3 {
    margin-top: 20px;
    margin-bottom: 10px;
	font-weight: 600;
}
h2 { text-transform: uppercase; }
p {
  font-size: 22px;
  margin-top: 0;
  margin-bottom: 1rem;
}
.fa, .fas {
    font-weight: 900;
    font-size: 44px;
}
.bg-primary {
    background-color: #f3f4f0 !important;
}
.container {
	max-width: 97%;
}
.container-full {
    width: 100%;
    margin-right: auto;
    margin-left: auto;
}
.container-inner {
    width: 100%;
	padding: 35px 30px 15px;
	margin: 0;
}
.logged-in-main-content {
  margin: 4px 0;
  padding-left: 0;
}
.members-lounge-menu-col { padding-right: 0; }
.active-menu-item { }
.white_content h3 { color: #fff; }
.black_content h3 { color: #333; }
.playlist_sub_title { background-color: rgba(0,0,0,0.3); }
.playlist_sub_title p { color: #fff; text-align: center; }
.logged-in-joiner {
  border-top: 2px solid #ababab;
  border-bottom: 2px solid #ababab;
  border-left: 2px solid #ababab;
  width: 6%;
  float: left;
  clear: none;
  margin: 20px 0 0 10px;
  height: 100%;
}
.members-lounge-menu {
  list-style: none;
  padding: 20px 0;
  width: 90%;
  float: left;
}
.members-lounge-menu li {
  padding: 20px 0;
  font-size: 24px;
  background-color: #d8d8d8;
  margin-bottom: 20px;
}
.members-lounge-menu li.active-menu-item { background-color: #ababab; width: 105%; padding: 30px 0; }
.members-lounge-menu .fa, .members-lounge-menu .fas {
  font-size: 24px;
  width: 50px;
  text-align: center;
}
.first-element {
	margin-top: 40px;
}
.progress {
    width: 100%;
    margin: 20px auto;
    height: auto;
    border: none;
    background-color: #dadada;
    box-shadow: none
}

.progress .circle,
.progress .bar {
    display: inline-block;
    background: #fff;
    height: 40px;
    border-radius: 40px;
    border: 1px solid #d5d5da;
    padding: 0 10px 0 0
}

.progress .bar {
    position: relative;
    width: 15.5%;
    height: 6px;
    top: -3px;
    margin-left: -2px;
    margin-right: -1px;
    border-left: none;
    border-right: none;
    border-radius: 0;
    margin-top: 19px;
}

.progress .circle .label {
    display: inline-block;
    width: 32px;
    height: 32px;
    line-height: 32px;
    border-radius: 32px;
    margin-top: 3px;
    color: #b5b5ba;
    font-size: 17px;
    padding: 0 11px;
    margin: 3px 11px 0 4px
}

.progress .circle .title {
    color: #b5b5ba;
    font-size: 16px;
    text-transform: uppercase;
    line-height: 30px;
    margin-left: -12px
}


.progress .bar.done,
.progress .circle.done {
    background: #eee
}

.progress .bar.active {
    background: linear-gradient(to right, #EEE 40%, #FFF 60%)
}

.progress .circle.done .label {
    color: #FFF;
    background: #8bc435;
    box-shadow: inset 0 0 2px rgba(0, 0, 0, .2);
    margin: 3px 11px 0 4px
}

.progress .circle.done .title {
    color: #444
}

.progress .circle.active .label {
    color: #FFF;
    background: #ba2424;
    box-shadow: inset 0 0 2px rgba(0, 0, 0, .2);
    margin: 3px 11px 0 4px
}

.progress .circle.active .title {
    color: #333;
    font-size: 16px;
    font-weight: 700;
    text-transform: uppercase
}

#vat-details {
    display: none
}

#checkout-stages {
    width: 100%;
    float: left;
    margin: 20px 0
}

.checkout-stage {
    padding: 7px 17px;
    background-color: #e1e1e1;
    border: 2px solid #484848;
    -webkit-border-radius: 7px;
    -moz-border-radius: 7px;
    border-radius: 7px;
    text-transform: uppercase;
    float: left;
    clear: none
}

.current-stage {
    background-color: #efb817;
    font-weight: 700
}

.stage-divider {
    width: 30px;
    border-top: 2px solid #2c2c2c;
    float: left;
    margin: 19px 0 0 0
}
.update-card-form {
  padding: 1px 20px 20px;
  margin-bottom: 10px
}
.basket-holder {
    background-color: #dadada
}

.basket-holder h3 {
    font-weight: 300;
    font-size: 21px;
    padding-bottom: 5px;
    margin: 30px 0 10px;
    border-bottom: 1px solid #ddd;
    width: 300px;
    font-weight: 700
}

.basket-form-left {
    float: left;
    clear: left;
    width: 65%;
    background-color: #fff;
    padding: 20px 20px;
    border-radius: 7px;
    margin-bottom: 10px
}

.basket-form-right {
    float: right;
    clear: none;
    width: 34%;
    background-color: #fff;
    margin-left: 1%;
    padding: 20px 20px;
    border-radius: 7px;
    margin-bottom: 10px;
    text-align: right
}

.basket-form-bottom,
.basket-form-bottom2,
.basket-form-bottom3 {
    float: left;
    clear: none;
    width: 49.5%;
    background-color: #fff;
    padding: 20px 20px;
    border-radius: 7px;
    margin-bottom: 10px;
    text-align: center
}

.basket-form-bottom2 {
    margin-left: 1%
}

.basket-form-bottom3 {
    width: 65%
}

.basket-form-bottom h2,
.basket-form-bottom2 h2 {
    font-size: 28px
}

.secure-shopping-footer {
    float: left;
    clear: none;
    width: 100%;
    padding: 0;
    margin-bottom: 10px;
    text-align: center
}

.secure-shopping-footer h2 {
    font-size: 28px;
    color: #fff
}

.extrapadding {
    padding: 44px 0
}

.right-aligned-text {
    float: right;
    margin: 0;
	text-align: right;
}
.small-basket-text {
	line-height: 16px;
	font-size: 20px;
}
.basket-holder h3.right-aligned-text {
    margin: 20px 0 10px;
	float: right;
	text-align: right;
}

.basket-form-full {
    float: left;
    clear: left;
    width: 100%;
    background-color: #fff;
    padding: 20px 20px;
    border-radius: 7px
}

.table-header-item,
.table-header-item2 {
    float: left;
    clear: none;
    width: 15%;
    text-transform: uppercase;
    font-weight: 700;
    text-align: right;
    font-size: 18px;
    padding: 10px 0 30px
}

.table-body-item,
.table-body-item2 {
    float: left;
    clear: none;
    width: 15%;
    text-align: right;
    font-size: 24px;
    padding: 35px 0 30px;
    height: 250px
}

.table-body-item2,
.table-header-item2 {
    width: 30%;
    padding: 20px 0;
    height: auto
}

.responsive-title {
    display: none
}

.table-header-item2 {
    padding: 0 0 20px 0
}

.item-name {
    font-weight: 700;
    width: 85%;
    text-align: left;
    clear: left;
}
.item-name span {
    font-weight: 400;
}
.total-to-pay {
    font-size: 36px;
    font-weight: 700
}
.non_editable_input, .non_editable_input_fluid {
    border: none;
    background: 0 0;
    resize: none;
    text-align: right;
}
.checkout-summary {
    text-align: right;
    padding: 15px 0;
    border-bottom: 1px solid #eee
}

.checkout-summary-title {
    text-align: right;
    font-weight: 700;
    font-size: 28px;
    margin-top: 21px
}


.order-back-btn {
    padding: 7px 14px 3px;
    background-color: #989898;
    text-transform: uppercase;
    border-radius: 7px;
    clear: left;
    float: left;
    color: #eee;
    margin-top: 30px
}

.order-forward-btn {
    background-color: #AD1C17;
    text-transform: uppercase;
    border-radius: 7px;
    float: right;
    clear: none;
    margin-top: 30px;
    color: #fff;
    padding: 7px 14px 3px;
    border: 0
}

.order-back-btn:hover {
    background-color: #606060;
    color: #eee
}

.order-back-btn:visited,
.order-back-btn:focus {
    color: #eee
}

.order-forward-btn:hover {
    background-color: #781613;
    color: #fff
}

.order-forward-btn:visited,
.order-forward-btn:focus {
    color: #fff
}

.order-back-btn .fas,
.order-forward-btn .fas {
    font-size: 30px
}

.order-back-btn span,
.order-forward-btn span {
    bottom: 4px;
    position: relative;
    font-size: 19px;
    padding: 0 7px
}
.tight-icon-big {
    padding: 20px 0 0 0 !important;
    margin: 0 3px !important;
    width: auto !important;
    color: #ba2424;
    font-size: 56px;
}
/* #promo_code_button width removed — handled by .akm-btn */
#basket-form-lower, .basket-form-group {
    float: left;
    clear: left;
    padding: 10px;
    width: 100%;
}
#leftContentNoteScenes img, .basket-form-group, .twitter-item {
    margin-bottom: 10px;
}
.girl-headphones {
	background-image: url('/images/girl-headphones.jpg');
	background-size: cover;
	height: 500px;
}
.restaurant {
	background-image: url('/images/restaurant.jpg');
	background-size: cover;
	height: 500px;
}
.diagonal-text {
	background-image: url('/images/playlist-blurred.jpg');
	background-size: cover;
	/*height: 500px;*/
	background-attachment: fixed;
	background-position: center;
  height: 440px;
}
.diagonal-text2 {
	background-image: url('/images/playlist-blurred2.jpg');
	background-size: cover;
	/*height: 500px;*/
	background-attachment: fixed;
	background-position: center;
  /* height: 500px; */
}
.diagonal-text3 {
	background-image: url('/images/playlist-blurred3.jpg');
	background-size: cover;
	/*height: 500px;*/
	background-attachment: fixed;
	background-position: center;
  /* height: 500px; */
}
#blurred_playlist, #blurred_playlist2, #blurred_playlist3 { display: none; }
.bg-dark {
    background-color: #AD1C17 !important;
}
#logo {
    float: left;
    margin-left: 0;
    width: 100px;
}
#logo img {
    width: 100%;
}
.navbar-nav {
    text-transform: uppercase;
    text-align: right;
    margin-right: 2px;
}
.navbar-dark .navbar-nav .nav-link {
    color: rgb(255, 255, 255);
}
#mobile_detector {
    display: none
}
/* ── Audio player bar ───────────────────────────────────────────────────── */
#audioPlayer {
    width: 100%;
    position: fixed;
    bottom: 0;
    left: 0;
    z-index: 99999;
    display: none;
    background: #2a1840;
    border-top: 2px solid rgba(255,255,255,0.1);
    box-shadow: 0 -4px 20px rgba(0,0,0,0.4);
}

#jp_container_1 {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 1rem;
}

.jp-type-playlist { width: 100%; }

.jp-gui.jp-interface {
    display: flex;
    align-items: center;
    height: 70px;
    gap: 1rem;
}

/* Controls */
.jp-controls {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    align-items: center;
    gap: 0.25rem;
    flex-shrink: 0;
}

.jp-controls li { display: flex; align-items: center; height: 44px; }

.jp-controls a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    color: rgba(255,255,255,0.8);
    text-decoration: none;
    font-size: 0;
    transition: color 0.2s, background 0.2s;
    cursor: pointer;
}

.jp-controls a:hover {
    color: #fff;
    background: rgba(255,255,255,0.12);
}

/* FA icons via ::before */
.jp-controls a::before {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    font-size: 1rem;
    line-height: 1;
    display: block;
}

.jp-previous::before  { content: "\f048"; }
.jp-next::before      { content: "\f051"; }
.jp-play::before      { content: "\f04b"; font-size: 0.9rem; margin-left: 2px; }
.jp-pause::before     { content: "\f04c"; font-size: 0.85rem; }
.jp-play, .jp-pause   { color: #fff; width: 44px; height: 44px; background: rgba(255,255,255,0.15); border-radius: 50%; }
.jp-play:hover, .jp-pause:hover { background: rgba(255,255,255,0.25); }

/* Keep play+pause in a fixed 44px slot so toggling them causes no layout shift */
.jp-controls li:has(.jp-play),
.jp-controls li:has(.jp-pause) {
    width: 44px;
    height: 44px;
    flex-shrink: 0;
}
.jp-controls li:has(.jp-pause) {
    margin-left: calc(-44px - 0.25rem);
    pointer-events: none;
}
.jp-pause {
    pointer-events: auto;
}

#previous-ghost { display: none !important; }

/* Progress area */
.jp-progress-container {
    flex: 1;
    display: grid;
    grid-template-areas:
        "track track"
        "bar   bar"
        "time  dur";
    grid-template-columns: 1fr auto;
    gap: 3px 0.5rem;
    align-items: center;
    min-width: 0;
}

#jp-current-track {
    color: #fff;
    font-size: 0.8rem;
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    letter-spacing: 0.02em;
}

.jp-progress {
    width: 100%;
    height: 4px;
    background: rgba(255,255,255,0.2);
    border-radius: 2px;
    cursor: pointer;
    overflow: hidden;
}

.jp-seek-bar {
    width: 100%;
    height: 100%;
}

.jp-play-bar {
    height: 100%;
    background: #fff;
    border-radius: 2px;
    width: 0;
    transition: width 0.3s linear;
}

.jp-current-time,
.jp-duration {
    font-size: 0.7rem;
    color: rgba(255,255,255,0.6);
    white-space: nowrap;
}

#jp-current-track       { grid-area: track; }
.jp-progress            { grid-area: bar; }
.jp-current-time        { grid-area: time; }
.jp-duration            { grid-area: dur; text-align: right; }

/* Playlist (hidden by default, jPlayer manages) */
.jp-playlist { display: none; }

.jp-no-solution { display: none; }

#audioPlayerHeading {
    float: left;
    margin: 0;
    padding: 5px 0 0 20px
}
.home-titles {
	margin: 50px 15px;
}
.home-titles h1 {
	color: #ad1c17;
	text-transform: uppercase;
	font-weight: bold;
	font-size: 72px;
}
.home-titles h2 {
	color: #444444;
	text-transform: uppercase;
	font-size: 30px;
	padding: 10px 0;
	font-weight: 300;
}
.home-titles h3 {
	color: #444444;
	text-transform: uppercase;
	font-size: 30px;
	font-weight: bold;
	padding: 10px 0;
}
.subs-info {
	margin: 50px 5px;
  /*text-align: center;*/
}
.subs-info2 {
	margin: 10px 5px;
}
.normal-case { text-transform: none; }
.subs-info h1 {
	color: #ad1c17;
	text-transform: uppercase;
	font-weight: bold;
	font-size: 72px;
}
.subs-info h2, .subs-info2 h2  {
	font-weight: 300;
}
.subs-info h3 {
	color: #444444;
	text-transform: none;
	font-size: 30px;
	font-weight: bold;
	padding: 10px 0;
}
.info_or {
  color: white;
  font-size: 34px;
}
.yellow-band {
	background-color: #efb817;
	height: 10px;
	width: 300px;
}
.yellow-band-right {
	background-color: #efb817;
	height: 10px;
	width: 300px;
	float: right;
}
.yellow-band-small {
	background-color: #efb817;
	height: 5px;
	width: 100px;
}
.every-business { background-color: #212529; color: #fff; }
.every-business i { margin-top: 32px; }
.every-business h2 { margin-top: 5px; }
.continuous-music { background-color: #ad1c17; color: #fff; padding-bottom: 35px; }
.streams { padding-top: 40px; }
.right-aligned { text-align: right; }
.white-faded-bg { padding: 20px; background-color: rgba(255,255,255,0.8); }
.extra-top-margin100 { margin-top: 100px; }
.extra-bottom-margin30 { margin-bottom: 30px; }
.try-box { background-color: #efb817; border-radius: 10px; color: #3f3f3f; text-decoration: none; width: 100%; padding: 8px 20px 10px; margin: 20px 3px 35px; }
.signup-box { background-color: #212529; border-radius: 10px; color: #fff; text-decoration: none; width: 100%; padding: 30px 20px 10px; margin: 0 3px 20px; }
.try-box:hover { color: #3f3f3f; }
.signup-box:hover { color: #fff; }
.anthracite { color: #22252a !important; }
.playlist-grid-home {
  width: 1330px;
  margin: 0 auto;
}
.centered-text { text-align: center; }
ul.playlists, ul.playlist {
	margin-left: 0;
	padding: 0;
}
.playlists li {
	list-style: none;
	background-color: #efb817;
	float: left;
	clear: none;
	width: 380px;
  height: 380px;
	padding: 20px 18px;
	margin: 0 1.5% 3% 1.5%;
}
.playlist li {
	list-style: none;
	color: #AD1C17;
	float: left;
	clear: left;
	padding: 10px 0 5px 20px;
	/*margin: 0;*/
	font-weight: bold;
  border-bottom: 2px solid #ababab;
  text-transform: uppercase;
  width: 70%;
}
.playlists li.last_item_in_row { margin-right: 0; }
.playlists a {
	/*color: #333;*/
}
.playlists h3 {
	font-size: 30px;
	text-transform: uppercase;
	text-align: center;
}
.playlists .fa, .fas {
    font-size: 38px;
    opacity: 0.8;
    /*display: none;*/
}
.playlist_icons_home {
  position: relative;
  bottom: 10px; //-143px;
  background-color: rgba(0,0,0,0.3);
  height: 68px;
}
.playlist_icons {
  position: relative;
  bottom: -143px;
  background-color: rgba(0,0,0,0.3);
  height: 85px;
}
.playlist_icons_home a, .playlist_icons_home p, .playlist_icons_home fa, .playlist_icons_home fas, .playlist_icons a, .playlist_icons p, .playlist_icons fa, .playlist_icons fas {
  color: #fff;
}
.play_playlist, .pause_playlist, .play_playlist_preview {
	width: 33%;
	text-align: center;
	float: left;
	margin: 20px 0px;
}
.play_playlist_preview { width: 100%; }
.playlists_note { margin-left: 15px; }
.view_tracks {
	width: 33%;
	text-align: center;
	margin: 20px 0px;
	float: left;
  clear: none;
}
.audio_icon {
	color: #efb817;
	font-size: 40px;
}
.pausetrack {
	display: none;
}
.track_number {
	float: left;
	clear: none;
	font-size: 40px;
  width: 65px;
}
.track_name {
	float: left;
	clear: none;
	margin: 12px 0 0 20px;
	font-size: 24px;
    width: 450px;
}
.track_composer {
  float: left;
  clear: none;
  margin: 21px 0 0 20px;
  font-size: 18px;
  width: 150px;
  color: #212529;
  font-weight: normal;
}
.play_pause_icons {
	float: right;
	clear: none;
	margin: 14px 20px 0 0;
}
.playlist_title {
	float: left;
	width: auto;
}
.play_pause_icons_header {
	float: left;
	clear: none;
	margin: 23px 20px 0 20px;
}
.pause_playlist { display: none; }
.membership-details-header { text-align: center; padding: 20px; }
.membership-details-header h3 { font-size: 34px; }
.membership-details-body {
  text-align: center;
  padding: 22px 0 5px;
  background-color: #fff;
  font-size: 20px;
}
.membership-details-footer {
  color: #fff;
  padding: 20px;
  width: 100%;
  float: left;
  clear: left;
}
.members-lounge-main-header {
  margin: 20px 0 20px;
}
.members-lounge-pre-header {
  margin: 0;
  text-transform: uppercase;
}
.panel-orange {
  background-color: #efb817;
  margin-bottom: 20px;
  float: left;
  width: 100%;
}
.narrow-form { width: 280px; }
/* #contact-submit-btn width removed — handled by .akm-btn */
#loading-spinner {
  text-align: center;
  display: none;
}
.akm-spinner {
  width: 36px;
  height: 36px;
  border: 3px solid rgba(42,24,64,.15);
  border-top-color: #2a1840;
  border-radius: 50%;
  animation: akm-spin .7s linear infinite;
  margin: 0 auto;
}
@keyframes akm-spin { to { transform: rotate(360deg); } }
#form-complete-tick {
  text-align: center;
  width: 44px;
  background-color: rgba(47,107,79,.08);
  border: 1px solid rgba(47,107,79,.25);
  border-radius: 5px;
  padding: 8px 0 7px;
  color: var(--c-success);
  display: none;
}
.btn-primary-big, .btn-primary-very-big {
    color: #fff;
    background-color: #AD1C17;
    border-color: #AD1C17;
    font-size: 18px;
    font-weight: 300;
    padding: 10px 20px;
    text-transform: uppercase;
}
.btn-primary-big:visited { color: #fff; }
.btn-grey {
    color: #ababab;
    background-color: #d8d8d8;
    border-color: #d8d8d8;
    font-size: 18px;
    font-weight: 300;
    padding: 10px 20px;
    text-transform: uppercase;
}
.btn-main { color: #fff; font-size: 24px; text-decoration: none; background-color: #333; }
.btn-main:hover { color: #fff; text-decoration: none; background-color: #AD1C17; }
.subscribe_btn {
  color: #fff;
  background-color: #212529;
  border-radius: 10px;
  padding: 15px 25px;
  font-size: 25px;
}
.subscribe_btn2 {
    color: #fff;
    background-color: #efb817;
    border-radius: 10px;
    padding: 15px 25px 12px;
    font-size: 25px;
    text-transform: uppercase;
    position: absolute;
    left: 500px;
    top: 470px;
    z-index: 9999999999999999;
}
.subscribe_btn:hover { color: #fff; text-decoration: none; background-color: #212529; }
.subscribe_btn2:hover { color: #fff; text-decoration: none; background-color: #212529; }
.extratoppadding { padding-top: 20px; }
.full-width-content {
    text-align: left;
    float: left;
    clear: none;
    width: 100%;
    padding: 20px;
}
.floatrightclearright {
  float: right;
  clear: right;
}
.hidden-price, .hidden-field {
    display: none
}
#credit-card-button-holder {
    float: left;
    clear: left;
    margin-right: 10px
}

#paypal-button-holder {
    width: 300px
}

#vat_reg_question {
    font-size: 14px;
    font-weight: 700
}

#shippingCountry,
#vat_number {
    margin-top: 5px;
    text-align: right;
    border-radius: 7px;
    padding: 4px;
    font-size: 16px;
    box-shadow: 0 2px 0 #c6cacc inset;
    border: 1px solid #dedede;
    width: 70%;
    background-color: #edf1ee;
    height: 40px
}
.basket-form-group select {
    float: right;
}
#grand_total {
  width: 120px;
  font-weight: bold;
  color: #212529;
}
.removeBasketItem {
    font-size: 20px;
}
footer {
	clear: both;
	color: #fff;
	background-color: #212529;
}

label {
    font-weight: 400;
    clear: left;
    float: left;
    margin: 15px 0
}

.label-no-margin {
    margin: 3px 0!important
}

.field placeholder {
    color: #bbb!important
}

.visible-placeholder placeholder {
    color: #fff!important
}

.expiry_clue {
    float: left;
    color: #bbb;
    font-size: 18px;
    font-weight: 700
}

.invalid,
.field.StripeElement--invalid {
    background-color: rgb(222, 138, 135)!important
}
#payment_error {
  background-color: #ad1c17;
  color: white;
  padding: 15px 20px 1px;
  border-radius: 10px;
}
.error {
    color: #AD1C17;
    font-size: 18px;
    padding: 10px 20px;
    background-color: #dadada;
    margin: 10px 0 0;
    float: left;
    clear: left;
    display: none
}

.label {
    display: inline;
    padding: 0;
    font-size: 16px;
    font-weight: 400;
    line-height: 1;
    color: inherit;
    text-align: left
}

label span {
    width: 240px;
    padding: 12px 0 0
}

.float {
    float: left;
    clear: left
}

#bs-card {
    width: 100%
}

#postal-code-element {
    width: 120px
}

fieldset.checkout-form {
    width: 100%
}

fieldset .question {
    border: 2px solid transparent;
    clear: both;
    float: left;
    margin: 0 0 0 0;
    padding: 10px 0;
    position: relative;
    width: 100%
}

fieldset .question .section {
    float: left;
    padding: 12px 20px 0 0;
    width: 230px
}

fieldset .question .answer {
    float: left;
    font-family: 'Open Sans', sans-serif;
    font-size: 20px;
    line-height: 14px;
    padding: 0 0 0 20px;
    width: 300px
}

fieldset .question .answer input[type="date"],
fieldset .question .answer input[type="text"],
fieldset .question .answer input[type="password"],
fieldset .group .field {
    background-color: #edf1ee;
    border: 0;
    border-radius: 5px;
    box-shadow: 0 2px 0 #c6cacc inset;
    color: #566266;
    float: left;
    font-size: 15px;
    font-weight: 700;
    height: 50px;
    line-height: 14px;
    outline: none;
    padding: 0 15px;
    width: 280px
}

.styled-select {
    height: 50px;
    overflow: hidden;
    width: 280px;
    box-shadow: 0 2px 0 #c6cacc inset
}

.styled-select select {
    background: transparent;
    border: none;
    font-size: 14px;
    height: 50px;
    padding: 5px 10px;
    width: 280px;
    font-weight: 700
}

.styled-select.slate {
    background: url(http://i62.tinypic.com/2e3ybe1.jpg) no-repeat right center;
    height: 34px;
    width: 240px
}

.styled-select.slate select {
    border: 1px solid #ccc;
    font-size: 16px;
    height: 34px;
    width: 268px
}


.rounded {
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    border-radius: 20px
}

.semi-square {
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px
}

.blue {
    background-color: #edf1ee
}

.blue select {
    color: #566266
}

.question .error_messages,
.error_messages {
    display: none;
    color: #ae1a16;
    font-size: 14px;
    float: left;
    clear: none;
    padding: 14px 0 0 12px
}

#cvc_info i {
    font-size: 18px;
    float: left;
    clear: none;
    padding: 15px
}

.modal-button {
    margin-top: 5px
}
.modal-first-col {
    width: 130px;
    float: left
}
.checkbox_container,
.checkbox_container2 {
    display: block;
    position: relative;
    padding-left: 35px;
    margin-bottom: 12px;
    cursor: pointer;
    font-size: 22px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.checkbox_container2 {
    margin: 0 0 24px
}

.checkbox_container input,
.checkbox_container2 input {
    position: absolute;
    opacity: 0;
    cursor: pointer
}

.checkmark {
    position: absolute;
    top: 0;
    left: 0;
    height: 25px;
    width: 25px;
    background-color: #e0e0e0
}

.checkbox_container:hover input~.checkmark,
.checkbox_container2:hover input~.checkmark {
    background-color: #ccc
}

.checkbox_container input:checked~.checkmark,
.checkbox_container2 input:checked~.checkmark {
    background-color: #AD1C17
}

.checkmark:after {
    content: "";
    position: absolute;
    display: none
}

.checkbox_container input:checked~.checkmark:after,
.checkbox_container2 input:checked~.checkmark:after {
    display: block
}

.checkbox_container .checkmark:after,
.checkbox_container2 .checkmark:after {
    left: 9px;
    top: 4px;
    width: 7px;
    height: 15px;
    border: solid white;
    border-width: 0 3px 3px 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg)
}

.basket-form-group {
    border-bottom: 1px solid #E8E8E8
}

.standard-delivery {
    margin: 0;
    padding: 5px 0
}

#billing_details {
    display: none
}

.far {
    font-size: 32px;
    background-color: #fff;
    border-radius: 41px
}

.fas {
    font-size: 32px;
    border-radius: 41px
}
.basket-phone {
    font-size: 40px;
    color: #ba2424
}

.tight-icon {
    padding: 0!important;
    margin: 0 3px!important;
    width: auto!important;
    color: #ba2424;
    font-size: 50px
}

.tight-icon-big {
    padding: 20px 0 0 0!important;
    margin: 0 3px!important;
    width: auto!important;
    color: #ba2424;
    font-size: 56px !important;
}

.form-divider,
.form-divider2 {
    border-top: 2px solid #dadada;
    clear: left;
    margin: 40px 0;
    float: left;
    width: 100%
}

.form-divider2 {
    margin: 40px 0 5px
}

.form-divider3 {
    margin: 0 0 5px
}

#login_form_basket {
    display: none;
    border-top: 2px solid #dadada;
    border-bottom: 2px solid #dadada;
    padding: 10px 0 20px;
    margin: 10px 0 30px 0
}

.nomargin {
    margin: 0
}

.hide_on_desktop {
    display: none!important
}
.right-arrow {
	float: right;
	margin: 23px;
	font-size: 90px;
	color: #fff;
}
.gradient-image { float: right; margin: -28px 20px -10px; }
.gradient-image-mobile { display: none; }
.fab {
    font-size: 32px;
    background-color: #fff;
    padding: 18px;
    border-radius: 41px;
    width: 70px;
    color: #ad1c17;
}
.one-hundred-percent-width {
	max-width: 100%;
	margin: 0;
	padding: 20px;
}
.nopadding { padding: 0; }
.float-left-icon { float: left; font-size: 40px;  margin: 18px 13px 0 0 !important; }
.float-left-text { float: left; clear: none; }
.float-left-clear-text { float: left; clear: left; }
.largetextarea { width: 600px; height: 100px; padding: 10px; }
.playlist_thumbs {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
}
.playlist_thumbs div {
  background-color: #efb817;
  height: 117px;
  padding: 0 0 0;
  margin: 10px;
}
.playlist_thumbs div p {
  background-color: #efb817ba;
  padding: 35px 0 0;
  font-size: 18px;
  font-weight: 300;
  text-transform: uppercase;
}
.playlists li {
  	width: 30%;
}
.gridleftmargin { margin-left: 15% !important; }
.back-home { background-color: #ae1a16; border-radius: 8px; padding: 5px 10px; color: white; position: absolute; top: 110px;
  left: 5px; font-family: brandon-grotesque, sans-serif; font-size: 16px; }
.lounge_header {
  display: flex;
  justify-content: space-between;
}
.playlist_in_jukebox {
  position: relative;
  bottom: 108px;
  display: flex;
  width: 100%;
  background-color: rgba(0,0,0,0.3);
  padding: 4px 5px 0;
  justify-content: center;
}
#jukebox {
  display: flex;
  margin: -30px 0 20px;
  text-align: right;
  justify-content: end;
}
.jukebox_text {
  padding-top: 10px;
}
.jukebox_play {
  padding: 0;
  margin: 10px;
  float: none;
  text-transform: uppercase;
  width: 100%;
  display: block;
  text-align: right;
}
.jukebox_checks { display: none; }
.jukebox_checks i, .jukebox_unchecks i { background: none; color: white; }
.playlist_in_jukebox span {
  padding: 5px;
  /* font-weight: bold; */
  color: #fff;
}
.playlist_small {
  width: 22% !important;
  height: 210px !important;
}
.jukebox_shuffle {
  font-weight: bold;
  font-size: 20px;
}
.jukebox_shuffle_a {
  float: none;
}

@media (max-width:1420px) {
  .sign-up-text p { font-size: 20px !important; }
}
@media (max-width:1400px) {
	.playlist li {
		width: 100%;
	}
	.track_name {
		width: 55%;
	}
	.track_composer {
		width: 20%;
	}
  .continuous-music img {
    width: 100%;
  }
}
@media (max-width:1360px) {
  .gradient-image {
      float: right;
      margin: -17px 20px -10px;
  }
  .playlist-grid-home {
    padding: 20px 10px 15px;
    width: auto;
  }
}
@media (max-width:1230px) {
  .playlists li {
    width: 47%;
    height: 380px;
    background-size: cover;
  }
  .h2, h2 {
    font-size: 22px;
  }
  /*p {
    font-size: 20px;
  }*/
  .para-break2 { display: none; }
  .gradient-image { display: none; }
  .playlist_thumbs { grid-template-columns: 1fr 1fr 1fr; }
  .gridleftmargin { margin-left: 0 !important; }
}
@media (max-width:1024px) {
	.restaurant {
		height: 370px;
	}
	.home-titles { margin-top: 0px; }
	.home-titles h1 { font-size: 60px; }
	.home-titles h2 { font-size: 24px; }
	.home-titles h3 { font-size: 24px; }
  .gradient-image { display: none; }
  .gradient-image-mobile { display: block; width: 100%; border-radius: 10px; }
  .try-box, .signup-box {
    padding: 0px 0px 0px;
  }
  .subscribe_btn2 {
    padding: 9px 25px 6px;
    font-size: 21px;
    left: 400px;
    top: 375px;
  }
  #jukebox {
    width: 100%;
  }
}

@media (max-width:990px) {
  .logged-in-main-content {
      margin: 0 0 20px;
      padding-left: 15px;
  }
  .playlists h3 {
    font-size: 24px;
  }
  .right-aligned-text {
      float: left;
      margin: 0;
      text-align: left;
  }
  .right-aligned { text-align: left; }
  .every-business h2 {
    margin-top: 15px;
  }
  .list-inline-item:not(:last-child) {
      margin-right: 0;
  }
  .playlist li {
    padding: 10px 0 5px 0px;
  }
  .track_number {
    float: left;
    clear: none;
    font-size: 24px;
    width: 10px;
	}
  .track_name {
    font-size: 16px;
	margin: 9px 0 0 20px;
  }
  .track_composer {
    margin: 14px 0 0 20px;
    font-size: 12px;
  }
  .play_pause_icons {
	  margin: 3px 20px 0 0;
	}
  .jp-progress-container { display: grid; }
  #jp-current-track { font-size: 0.72rem; }
  .jp-current-time, .jp-duration { display: none; }
  .yellow-band-right {
    width: 150px;
    float: none;
  }
  .white-faded-bg {
    padding: 0 15px 30px;
    background: none;
  }
  .lounge_titles {
    display: none;
  }
}

@media (max-width:480px) {
  #jp_container_1 {
    padding: 0 0.65rem;
  }
  .jp-gui.jp-interface {
    height: 60px;
    gap: 0.5rem;
  }
  .jp-controls a {
    width: 30px;
    height: 30px;
  }
  .jp-play, .jp-pause {
    width: 38px;
    height: 38px;
  }
  .jp-controls li:has(.jp-play),
  .jp-controls li:has(.jp-pause) {
    width: 38px;
    height: 38px;
  }
  .jp-controls li:has(.jp-pause) {
    margin-left: calc(-38px - 0.25rem);
  }
}

@media (max-width:950px) {
    .basket-form-left {
        width: 100%
    }
    .basket-form-right {
        clear: left;
        width: 100%;
        margin-left: 0
    }
    .basket-form-bottom,
    .basket-form-bottom2 {
        width: 100%
    }
    .basket-form-bottom2 {
        margin-left: 0
    }
    .total-to-pay {
        font-size: 28px
    }
    .postage_box span {
        display: block
    }
    .progress .bar {
        position: relative;
        width: 5%
    }
	.basket-form-bottom3 {
		width: 100%
	}
}

@media (max-width:768px) {
    #mobile_detector {
        display: block;
    }
	.home-titles { margin-top: 35px; }
	.home-titles h1 { font-size: 50px; }
	.home-titles h2 { font-size: 20px; padding: 5px 0; }
	.home-titles h3 { font-size: 20px; padding: 5px 0; }
  .largetextarea { width: 100%; }
  .para-break { display: none; }
  .question .error_messages, .error_messages { clear: left; margin-left: 240px; }
  .playlist_thumbs { grid-template-columns: 1fr 1fr 1fr; }
  .subs-info h1 { font-size: 38px; }
  .diagonal-text, .diagonal-text2, .diagonal-text3 { height: auto; }
  .extra-bottom-margin30 { margin-bottom: 10px; }
  .restaurant {
    height: 420px;
  }
  .container-inner {
    padding: 20px 10px 15px;
  }
  #jukebox {
    display: block;
  }
  .jukebox_text h3 {
    font-size: 16px;
  }
  .jukebox_text p {
    /* display: none; */
  }
  .jukebox_play img {
    width: 120px;
  }
  .info_or {
    color: black;
    margin: 0;
  }
}
@media (max-width:615px) {
  .question .error_messages, .error_messages { margin-left: 0px; }
}
@media (max-width:600px) {
	fieldset .question .answer {
		padding: 0;
	}
	.progress .circle .title, .progress .circle.active .title {
		display: none;
	}
	.progress .circle, .progress .bar {
		padding: 0;
	}
	.progress .circle .label, .progress .circle.done .label, .progress .circle.active .label {
		margin: 3px 3px 0 3px;
	}
  .home-titles {
    margin: 0;
  }
  .home-titles h1 {
      font-size: 30px;
  }
  .home-titles h2 {
    font-size: 16px;
  }
  .home-titles h3 {
    font-size: 16px;
  }
  .yellow-band {
    width: 150px;
  }
  .every-business h2 {
    font-size: 22px;
  }
  .fas {
    font-size: 28px;
  }
  .diagonal-text, .diagonal-text2, .diagonal-text3 {
    background-image: none;
  }
  #blurred_playlist { display: block; width: 100%; }
  #blurred_playlist2 { display: block; width: 100%; }
  #blurred_playlist3 { display: block; width: 100%; }
  .extra-top-margin100 { margin-top: 0px; }
	.restaurant {
    background-position-x: -150px;
    height: 260px;
	}
  .subscribe_btn2 {
    top: 254px;
    left: 290px;
  }
}
@media (max-width:500px) {

  #shippingCountry,
  #vat_number {
      width: 200px
  }
  .vat_reg_box {
      padding: 0 7px
  }
  #vat_reg_question span {
      float: right;
      clear: both
  }
  .play_pause_icons_header {
		float: left;
		clear: left;
		margin: 0;
	}
	.track_name {
		width: 70%;
	}
	.track_composer {
		display: none;
	}

	.playlists li {
    width: 100%;
    height: 380px;
    background-size: cover;
    margin: 0 0 10px 0;
  }

.playlist_small {
  width: 100% !important;
  height: 190px !important;
}
  .playlists_note { margin-left: 0; font-size: 14px; }
  .playlist_thumbs { display: block; }
  .subscribe_btn2 {
    top: 310px;
    left: 20px;
    padding: 7px 17px 6px;
    font-size: 17px;
  }
  .item-name {
    font-size: 16px;
    width: 76%;
  }
  .small-basket-text {
    line-height: 20px;
    /* display: none; */
  }
  #basket-form-lower, .basket-form-group {
    padding: 0;
  }
  .basket-holder h3 {
    border-bottom: 0;
  }
  .basket-form-right {
    padding: 20px 8px;
  }
  .table-body-item, .table-body-item2 {
    height: 290px;
  }
  .table-header {
    display: none;
  }
  .playlist_icons_home {
    position: relative;
    bottom: 10px; //-143px;
    background-color: rgba(0,0,0,0.3);
    height: 65px;
  }
}
@media (max-width:360px) {
	fieldset .question .answer {
		width: auto;
	}
}