
html {
    background-color: #ececec;
    font-size: 10px;
	margin-top: 190px !important;
	margin-top: 200px !important;
}

@media screen and (max-width: 991px)
{
	html {
		margin-top: 165px !important;
		margin-top: 131px !important;
	}	
}

body {
    background-color: unset;
}

body>* {
    position: relative;
    z-index: 1;
}

hr {
    box-sizing: content-box;
    height: 0;
    overflow: visible;
	margin-top: 10px;
    margin-bottom: 10px;
}

h1, h2, h3, h4, input, li, option, p, td, textarea, th {
    color: #222;
    font-weight: 400;
    font-size: 14px;
    font-size: 1.4rem;
    line-height: 1.6em;
}

h2 {
    font-size: 22px;
    font-size: 2.2rem;
    font-weight: 400;
    margin: 0 0 2rem 0;
    line-height: 1.2em;
    /*text-transform: uppercase;*/
    letter-spacing: .1em;
}

body, input, li, option, p, td, textarea, th {
    color: #212121;
}

.main_bar {
	display: inline-block;
	max-width: calc(100% - 400px);
	max-width: unset;
	width: 100%;
	padding: 0 15px;
}

.side_bar {
	width: 400px;
	position: relative;
    float: right;
	padding: 0 15px;
}

.side_bar .jo-summary-item {
	width: 100%;
	float: none;
}

.side_bar .jo-summary-item.emptycart-item {
	min-height: 160px;
}

.deleteCartWrapper {
	display: flex;
    justify-content: end;
    padding: 8px 0 2px 0;
    font-size: 14px;
}

#modalSubCartCont .deleteCartWrapper {
    justify-content: start;
}

@media screen and (max-width: 768px)
{
	.main_bar {
		max-width: 100%;
	}
	
	.side_bar {
		display: none !important
	}
}

.join-online-image-header {
	margin-top: 0px;
}

.emptycart {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
}

.emptycart img {
    width: 100px;
    height: auto;
    margin-bottom: 15px;
    display: block;
    max-width: 100%;
    max-height: 100%;
    border: none;
    vertical-align: middle;
}

.emptycart span {
    font-size: 15px;
    font-weight: 600;
}

form:not(.login) p {
	margin: 0 0 2rem 0;
    margin-bottom: 2rem;
    position: relative;
    clear: right;
    text-align: left;
}

.iti {
	width: 100%;
}

b, strong {
    font-weight: bolder;
}

.join-online-form .row {
	width: 100%;
}

.join-online-form .row:not(.referred_box) {
	display: block;
}

/*.join-online-form .row:after {
    content: "";
    display: table;
    clear: both;
}*/

.join-online-form .container {
    display: inline-block;
    position: relative;
    padding-left: 35px;
    margin-bottom: 12px;
    cursor: pointer;
    font-size: 14px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    line-height: 25px;
    margin-right: 5px;
}

.join-online-form .button, a.button:not(.headerbutton), .join-online-form input[type=submit] {
    vertical-align: middle;
    display: inline-block;
    background-color: transparent;
    color: currentColor;
    border: 2px solid #222;
    font-size: 14px;
    font-size: 1.4rem;
    padding: 0.5em 1em;
    margin: 0.5em 0;
    max-width: 100%;
    box-sizing: border-box;
    text-align: center;
    text-decoration: none;
    text-transform: uppercase;
    font-weight: 400!important;
	-webkit-transition: all .1s linear;
	-moz-transition: all .1s linear;
    transition: all .1s linear;
    letter-spacing: .1em;
}

.join-online-form .button, a.button:not(.headerbutton), .join-online-form input[type=submit] {
    border-color: grey;
}

h4 {
    font-size: 18px;
    font-size: 1.8rem;
    font-weight: 400;
    margin: 0 0 2rem 0;
    line-height: 1.2em;
}

h1, h2, h3, h4 {
    color: #212121;
    border-color: #212121;
}

#modal, .jo-out-item {
    position: absolute;
    display: block;
    width: 100%;
    max-width: 768px;
    margin: 30px auto;
    padding: 1em;
    background-color: #fff;
    top: -100px;
    opacity: 0;
    transition-duration: .3s;
    -webkit-transition-duration: .3s;
}

#modal {
    max-height: 60vh;
    overflow: scroll;
}

.addon_box_parent {
	position: relative;
}

.popup_days {
	position: absolute;
	top: 7em;
    bottom: 0;
    left: 0;
    right: 0;
    border-bottom-left-radius: 87px;
	-webkit-transform: translateY(16px);
    transform: translateY(16px);
    -webkit-transition: -webkit-transform 500ms ease;
    transition: -webkit-transform 500ms ease;
    transition: transform 500ms ease;
    transition: transform 500ms ease, -webkit-transform 500ms ease;
    -webkit-transition: all 400ms ease-in-out;
    transition: all 400ms ease-in-out;
    opacity: 0;
	background-color: #b3a26c;
	display: block;
    align-items: center;
    justify-content: center;
	padding: 2rem 3.5rem 0 3.5rem;
	z-index: -1;
}

.popup_days.show {
	-webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1;
	z-index: 1;
}

.days_header {
	height: 47px;
    position: relative;
    font-weight: 600;
	color: white;
}

.days_header_message {
	display: none;
	font-size: 14px;
    font-weight: 100;
    color: white;
	text-decoration: underline;
	-webkit-transition: all 0.1s ease-in;
    -moz-transition: all 0.1s ease-in;
	transition: all 0.1s ease-in;
}

.days_table,
.days_table tr {
	margin: 0;
	padding: 0;
}

.days_table tr {
	height: 53px!important;
	display: table-row!important;
    vertical-align: inherit!important;
    border-color: inherit!important;
    border-top: none!important;
    border: none;
}

.days_table td {
	display: table-cell!important;
	vertical-align: middle;
	line-height: 14px;
	margin: 0;
	padding: inherit!important;
    border: 0!important;
	background: none!important;
}

.days_table td center {
	line-height: 1;
    font-size: 12px;
	margin: 2px;
    padding: 0;
	border: 2px solid white;
	border-radius: 6px;
	color: white;
    cursor: pointer;
	width: 38px;
    height: 38px;
    display: flex;
    align-items: center;
    justify-content: center;
	-webkit-transition: all 0.1s ease-in;
    -moz-transition: all 0.1s ease-in;
	transition: all 0.1s ease-in;
}

.days_table td center.hovered {
	background: white;
    color: #b3a26c;
    border-color: white;
}

.days_table td center:hover {
	background: white;
    color: #b3a26c;
    border-color: #333 !important;
}

.jo-details .different_address_section {
	display: none;
}
	
.grid_wrapper {
	display: flex;
	margin: 0;
	align-items: stretch;
}

.grid_cell {
	flex: 1 auto;
	text-align: center;
	align-items: center;
	align-content: center;
}

.grid_cell * {
    color: currentColor;
}
	
.grid_cell__100 {
	width: 100%;
}
	
.__hero_widget__ {
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center top;
	overflow: hidden;
	padding: 0!important;
	position: relative;
}

.__hero_widget__ {
    color: #fff;
}

.hero_sizer {
    width: 100%;
    padding-top: 35.7%;
    position: relative;
    font-size: 10px;
    font-size: 1rem;
}

.join-online-image-header .hero_sizer {
    padding-top: 20%;
}

.hero_overlay {
    position: absolute;
    right: 0;
    bottom: 10%;
    width: auto;
    min-width: 56em;
    text-align: left;
    z-index: 9;
}

.join-online-image-header .hero_overlay {
    left: 0;
    max-width: 600px;
    bottom: 30%;
    margin: 0 auto;
}

.join-online-image-header .hero_overlay {
    left: 0;
    max-width: 470px;
    bottom: 35%;
    margin: 0 auto;
    min-width: 0;
    width: 100%;
}

.hero_text {
    border-bottom: 3px solid #fff;
    padding-bottom: 2em;
}

.hero_text {
    border-color: #fff;
}

.join-online-image-header .hero_text {
    border-color: #b3a26c;
}

.animate_me {
    visibility: hidden;
    animation-duration: .5s;
    animation-timing-function: ease-in-out;
    -webkit-animation-duration: .5s;
    -webkit-animation-timing-function: ease-in-out;
}

.slideRight {
    visibility: visible!important;
    animation-name: slideRight;
}

.hero_text span {
    display: block;
    white-space: nowrap;
    line-height: 1em;
    vertical-align: text-bottom;
    margin-bottom: -0.1em;
    text-shadow: 0 0 4rem rgb(0 0 0 / 10%);
}

.hero_text span.hero_text__small_bold {
    font-size: 3em;
    font-weight: 700;
}

.join-online-image-header .hero_text span.hero_text__small_bold {
    text-align: center;
    text-transform: uppercase;
    color: #fff;
}

.join-online-wrapper {
    padding: 20px 0;
    background: #fff;
    position: relative;
	height: auto;
	min-height: calc(100% - 280px);
}

@media screen and (max-width: 480px)
{
	.join-online-wrapper {
		min-height: calc(100% - 240px);
	}
}

@media screen and (max-width: 767px)
{
	.join-online-wrapper {
		min-height: calc(100% - 255px);
	}
}

.jo-nav {
    /*max-width: 1300px;
    margin: 0 auto;*/
    position: fixed;
    width: 100%;
    overflow: hidden;
	z-index: 9;
    background: #111;
	left: 0;
    right: 0;
}

.wizardbar {
	display: none;
	padding-top: 40px;
    padding-bottom: 20px;
}

.slick-dots {
    display: none!important;
}

.slick-dots {
    position: absolute;
    left: 0;
    bottom: 3%;
    z-index: 9;
    width: 100%;
    text-align: center;
    margin: 0;
    padding: 0;
}

.jo-nav ul.slick-dots {
    position: relative;
    padding: 10px 0;
    bottom: 0;
    left: 0;
    right: 0;
    height: auto;
    overflow: auto;
    display: block!important;
    -webkit-font-smoothing: auto;
	max-width: 1300px;
    margin: 0 auto;
}

.prevented {
    pointer-events: none !important;
    background-color: #f3f3f3 !important;
	color: black !important;
}

.slick-dots li {
    display: inline;
    margin: 0!important;
}

.jo-nav .slick-dots li {
    width: 25%;
    float: left;
    padding: 8px 10px 8px 10px;
    position: relative;
    background-color: #ececec !important;
    cursor: pointer;
}

.jo-nav .slick-dots li.slick-active {
    background: #686868 !important;
}

.jo-nav .slick-dots li:first-child:before {
    content: "";
    position: absolute;
    width: 5px;
    background: #ececec;
	background: #111;
    left: 0;
    top: 0;
    bottom: 0;
}

.jo-nav .slick-dots li.slick-active:first-child:before {
    background: #686868;
}

.jo-nav .slick-dots li:first-child:after {
    content: "";
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    width: 0;
    height: 0;
    border-left: 15px solid #0000;
    border-right: 0 solid #fff;
    border-bottom: 20px solid #fff;
    border-top: 20px solid #fff;
	 border-right: 0 solid #111;
    border-bottom: 20px solid #111;
    border-top: 20px solid #111;
}

.jo-nav .slick-dots li:nth-child(n+2):before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 0;
    height: 0;
    border-left: 15px solid #fff;
    border-left: 15px solid #111;
    border-right: 20px solid #ececec;
    border-bottom: 18px solid #ececec;
    border-top: 20px solid #ececec;
}

.jo-nav .slick-dots li.slick-active:nth-child(n+2):before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 0;
    height: 0;
    border-left: 20px solid #fff;
    border-left: 20px solid #111;
    border-right: 20px solid #686868;
    border-bottom: 18px solid #686868;
    border-top: 20px solid #686868;
}

.jo-nav .slick-dots li:nth-child(n+2):after {
    content: "";
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    border-top: 20px solid #fff;
    border-bottom: 20px solid #fff;
	border-top: 20px solid #111;
    border-bottom: 20px solid #111;
    border-left: 15px solid #fff0;
    border-right: 0 solid #fff;
    border-right: 0 solid #111;
}

.jo-nav .slick-dots li:last-child:after {
    /*border-right: 0 solid #0000;
    border-top: 0 solid #0000;
    border-bottom: 0 solid #0000;
    border-left: 0 solid #0000;*/
}

a.jo-nav-item {
    font-size: 18px;
    font-weight: 400;
    margin: 0;
    padding: 0;
    position: relative;
	text-decoration: none;
}

.jo-nav .slick-dots li.slick-active .jo-nav-item {
    color: white !important;
}

.jo-summary {
    max-width: 1300px;
    margin: 0 auto;
    position: relative;
    width: 100%;
    overflow: hidden;
}

.jo-summary-item {
    margin-right: 15px;
    float: left;
    position: relative;
    background: #ececec;
    padding: 10px;
    transition-duration: .3s;
	margin-right: 1%;
	width: 19%;
	width: 30%;
}

.jo-summary-item .loaderWrapper {
    position: absolute !important;
}

#payment_view .jo-summary-item {
	width: 100%!important;
    background-color: #fff;
    max-width: 550px;
    padding: 0 2em;
    float: none;
    margin: 0 auto;
}

#payment_view .jo-summary-edit {
	display: none;
}

.jo-summary-item.hide {
    visibility: hidden;
    opacity: 0;
}

.summary_continue {
    display: none;
}

.add_direct_debit, .add_new_child, .child_summary .column .edit_child, .child_summary .column .remove_child, .confirmation-block .button_primary, .debit_summary .column .edit_debit, .debit_summary .column .remove_debit, .in_club div, .summary_continue button {
    padding: 10px 30px;
    background: #b3a26c;
    text-align: center;
    margin: 10px 0;
    font-weight: 700;
    font-size: 14px;
    cursor: pointer;
}

.add_direct_debit, .add_new_child, .in_club div, .summary_continue button {
    padding: 10px 40px;
    max-width: 280px;
    margin: 20px auto;
}

.jo-inner-wrapper, .join-online-slick {
    max-width: 1300px;
    margin: 0 auto;
    width: 100%;
    overflow: hidden;
}

.slick-track {
    /*display: flex!important;
    flex-direction: row;
    overflow-x: hidden;*/
	-webkit-transition: .4s ease-in;
    -moz-transition: .4s ease-in;
	transition: transform .4s ease-in;
}

.slick-slide {
    display: flex;
    height: auto!important;
    align-items: start !important;
    justify-content: center!important;
}

.slick-slide.jo_slick {
    display: none;
    min-height: 1px;
}

.slick-slide.jo_slick.slick-active {
    display: grid !important;
    grid-template-columns: calc(100% - 425px) 400px;
    gap: 25px;
}

.jo_header {
    text-align: left;
}

.interstitial-holder h1, .jo_slick h2 {
    display: inline-block;
    font-size: 25px;
    text-align: center;
    font-weight: 600;
    margin: 20px 0;
    letter-spacing: 0;
    border-bottom: 3px solid #686868;
}

.jo-location {
    width: 100%;
    position: relative;
    padding: 7px;
    background-color: #ececec;
    text-align: center;
    border-radius: 3px;
}

.jo-location-input {
    display: inline-block;
    position: relative;
}

#jo-validation-form {
	position: relative;
	margin-bottom: 0;
}

form .jo_slick .jo-location-input, form .jo_slick select {
    width: 100%;
    margin: 0;
    vertical-align: middle;
    max-width: 47%;
}

#jol_form_selectcoach {
	max-width: 200px;
	background-color: #ececec;
	cursor: pointer;
	font-size: 12px;
	padding: 0 6px 0 6px;
	position: relative;
    top: -2px;
	height: 25px;
	background-size: 15px;
	background-image: none;
}

input[type=email], input[type=search], input[type=submit], input[type=text], input[type=tel], textarea {
    -webkit-appearance: none;
    border-radius: 0;
}

form:not(.login) input[type=date], form:not(.login) input[type=email], form:not(.login) input[type=number], form:not(.login) input[type=password], form:not(.login) input[type=text], form:not(.login) input[type=tel], form:not(.login) input[type=time], form:not(.login) textarea, input[type=datetime-local] {
    border: 2px solid #fff;
    background-color: #fff;
    color: #000!important;
    font-size: 14px;
    font-size: 1.4rem;
    font-weight: 400;
    padding: 0.4em 0.75em 0.4em 0.75em;
    max-width: 100%;
	width: 100%;
    box-sizing: border-box;
    vertical-align: middle;
}

form:not(.login) .iti--allow-dropdown input, form:not(.login) .iti--allow-dropdown input[type=text] {
	padding-left: 52px !important;
}

input[type=date]:focus, input[type=email]:focus, input[type=password]:focus, input[type=text]:focus, input[type=tel]:focus, select:focus, textarea:focus {
    outline-offset: -2px;
    outline-width: 2px;
    outline-style: solid;
}

input[type=date]:focus, input[type=email]:focus, input[type=password]:focus, input[type=text]:focus, input[type=tel]:focus, select:focus, textarea:focus {
    outline: 0;
    border-bottom: 2px solid #b3a26c;
}

input[type=date]:focus, input[type=email]:focus, input[type=password]:focus, input[type=text]:focus, input[type=tel]:focus, select:focus, textarea:focus {
    outline-color: grey;
}

form input.search {
    background-repeat: no-repeat;
    background-size: auto 100%;
    background-position: 0;
    padding-left: 3em;
}

form input[type=date], form input[type=email], form input[type=number], form input[type=password], form input[type=text], form input[type=tel], form input[type=time], form textarea, input[type=datetime-local] {
    border: 1px solid #dadada;
}

.pac-target-input:not(:-webkit-autofill) {
    animation-name: endBrowserAutofill;
}

form .jo_slick .jo-location-input input {
    width: 100%;
}

.jo-location-input #autocomplete {
    padding-left: 5em;
}

.jo-location-input a.jo-geolocation {
    content: " ";
    position: absolute;
    left: 0;
    top: -8px;
    width: 50px;
    height: 50px;
    background-image: url(/wp-content/themes/holmes/assets/images/gold-location.svg);
    background-size: 50px;
    background-repeat: no-repeat;
}

.jo-location-input a.jo-submit-autocomplete {
    content: " ";
    position: absolute;
    right: 10px;
    top: 2px;
    width: 28px;
    height: 28px;
    background-image: url(/wp-content/themes/holmes/assets/images/gold-right-arrow.svg);
    background-size: 28px;
    background-repeat: no-repeat;
}

.jo-location span {
    padding: 0 20px;
    font-size: 16px;
    font-weight: 800;
    text-transform: uppercase;
}

form:not(.login) select {
    border: 0;
    background-color: #fff;
    color: #000!important;
    font-size: 14px;
    font-size: 1.4rem;
    font-weight: 400;
    padding: 0.25em 0.75em 0.25em 0.75em;
    max-width: 100%;
    height: 2.55em;
    box-sizing: border-box;
    width: 100%;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
    -webkit-appearance: none;
    -moz-appearance: none;
}

form .jo_slick select {
    background-image: url(/wp-content/themes/holmes/assets/images/dropdownarrows.svg);
    background-repeat: no-repeat;
    background-size: 18px;
    background-position: 98% center;
    border: 1px solid #dadada;
}

#jol_form_selectclub {
	font-weight: 600;
    font-size: 18px;
	cursor: pointer;
}

#jol_form_selectclub option {
	font-size: 16px;
}

form .jo-input select[id^=jol_form_child_title], select#jol_form_title {
    max-width: 100%;
    width: 140px;
    margin-right: 10px;
}

form .jo_slick select.addOnDropdown {
	margin: 10px 0 15px 0;
	background-color: transparent;
}

.jo-location-value {
    display: none;
}

#first-step-options {
    clear: both;
}

.promotion-code {
    width: 100%;
    text-align: center;
    display: none;
    background-size: 200% 100%;
    background-image: linear-gradient(to right,#bed60b 50%,#f3f3f3 50%);
    background-position: -100% 0;
    -webkit-transition: background-position 1s;
    -moz-transition: background-position 1s;
    transition: background-position 1s;
}

form label:not(.jo-module-box):not(.jo-options-box) {
    display: block;
    text-align: left;
    font-weight: 700;
    font-weight: 100;
}

.promotion-code > label {
    margin: 0 auto;
    display: inline-block;
    padding: 10px;
    font-size: 14px;
    vertical-align: middle;
}

.promotion-code label input {
    margin-left: 10px;
}

.promotion-code div.btn {
    display: inline-block;
    padding: 10px 20px;
    background-color: #b3a26c;
    vertical-align: middle;
    text-transform: uppercase;
    font-weight: 700;
    font-size: 14px;
    cursor: pointer;
    z-index: 2;
}

.promotion-code div.btn:hover {
    background-color: #9c8a50;
}

.promotion-code .discount-response {
    text-align: center;
    text-transform: uppercase;
    font-weight: 700;
    display: inline-block;
    color: red;
    left: -100px;
    z-index: 1;
    vertical-align: middle;
    margin: 0 0 0 20px;
}

.referred_box_parent {
	background: #ececec;
	display: none;
}

.referred_box {
    display: none;
    padding: 10px 10px 0 10px;
    width: 100%;
    margin: 0 !important;
	display: flex;
    justify-content: space-between;
}

.referred_box label {
    margin-bottom: 0;
    text-align: center;
	font-size: 1.4rem;
    line-height: 1.6em;
	font-weight: 400;
}

input#jol_form_referred {
    width: 100%;
}

.jo-container {
    text-align: center;
    max-width: 700px;
    margin: 0 auto;
	padding: 0 15px;
}

form .jo-container p {
    font-size: 16px;
}

#wellness-bundles {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 20px;
}

@media screen and (max-width: 991px)
{
	.wellness-bundles {
		grid-template-columns: 1fr;
		gap: 15px;
	}
}

.jo_slick h3 {
    text-transform: uppercase;
    font-weight: 400;
	font-size: 20px;
}

.jo-details {
    padding: 20px 30px;
    background: #f3f3f3;
    height: auto;
    overflow: auto;
    position: relative;
    display: block;
    margin-bottom: 40px;
}

@media screen and (max-width: 991px)
{
	.jo-details {
		padding: 5px 10px;
		margin-bottom: 30px;
	}
}

.jo-details .row {
    margin: 30px auto;
    text-align: left;
    position: relative;
}

.jo-details.details_checkboxes .row {
	margin: 7px auto;
    text-align: left;
    position: relative;
}

.break {
    display: block;
    margin: 10px auto;
    position: relative;
    height: 20px;
}

.jo-input {
    display: inline-block;
    position: relative;
    vertical-align: top;
}

form .jo-details label {
    font-size: 16px;
    font-weight: 400;
    margin-bottom: 5px;
}

.margin-left-10 {
    margin-left: 10px;
}

form .jo-input input, form .jo-input input[type=date], form .jo-input input[type=email], form .jo-input input[type=number], form .jo-input input[type=password], form .jo-input input[type=text], form .jo-input input[type=tel], form .jo-input input[type=time], form .jo-input select, form.jo-input textarea {
    border: 1px solid #dadada;
}

input#jol_form_firstname, input[name="jol_form_childfirstname[]"] {
    width: 100%;
    margin: 0;
}

input#jol_form_surname, input[name="jol_form_childsurname[]"] {
    width: 100%;
    margin-left: 10px;
}

input#jol_form_email {
    width: 100%;
    margin: 0;
}

input#jol_form_email_confirm {
    width: 100%;
    margin-left: 10px;
}

input#jol_form_password {
    width: 289px;
    margin-right: 10px;
    margin-bottom: 20px;
}

input#jol_form_confirmpassword, input#jol_form_mobile_code {
    width: 100%;
    margin-left: 0px;
}

form:not(.login) .iti.iti--allow-dropdown {
    margin-left: 10px;
}

input#jol_form_address {
	width: 100%;
    margin: 0;
}

input#jol_prefered_language {
	width: 100%;
    margin: 0;
}

input#jol_form_town {
	width: 100%;
    margin: 0;
}

input#jol_form_postalcode {
	width: 100%;
    margin-left: 10px;
}

form .jo-input select[id^=jol_form_child_gender] {
    width: 289px;
    margin-right: 10px;
    max-width: 100%;
}

select#jol_form_gender {
	width: 100%;
    margin-right: 0;
	margin-left: 0;
    max-width: 100%;
}

select#jol_form_ref {
	width: 100%;
    margin-right: 0;
	margin-left: 10px;
    max-width: 100%;
}

select#jol_form_country {
	width: 100%;
    margin-right: 0;
	margin-left: 10px;
    max-width: 100%;
}

select#jol_form_doy {
	width: 100%;
    margin-right: 0;
	margin-left: 10px;
    max-width: 100%;
}

#jol_form_address_number {
	width: 100%;
    margin-right: 0;
	margin-left: 10px;
    max-width: 100%;
}

.jo-details .jo-container .row .jo-input input {
	width: 100%;
    max-width: 100%;
}

.jo-details .jo-container .row .jo-input + .jo-input input {
	width: 100%;
    margin-right: 0;
	margin-left: 10px;
    max-width: 100%;
}

#jol_form_birthday {
    width: 75px;
    margin-right: 10px;
}

#jol_form_birthmonth {
    width: 150px;
    margin: 0 10px;
}

#jol_form_birthyear {
    margin-left: 10px;
    width: 100px;
}

@media screen and (max-width: 768px)
{
	#jol_form_birthday {
		width: 70px;
		margin-right: 10px;
	}
	
	#jol_form_birthmonth {
		width: 75px;
		margin: 0 10px;
	}

	#jol_form_birthyear {
		margin-left: 10px;
		width: 85px;
	}
}

@media screen and (max-width: 480px)
{
	#jol_form_birthday {
		width: 60px;
		margin-right: 10px;
	}

	#jol_form_birthmonth {
		width: 60px;
		margin: 0 10px;
	}

	#jol_form_birthyear {
		margin-left: 10px;
		width: 70px;
	}
}

#jo-validation-form .birthday_wrapper > span:not(:last-child):after {
    top: 32px;
	color: black;
}

#jol_form_join {
    width: 288px;
    margin-left: 10px;
    max-width: 100%;
}

.reset-buttons {
    text-align: center;
}

.open-modal, .reset-buttons a {
    cursor: pointer;
}

.reset-buttons a {
    margin: 10px;
}

.bundle_tac {
    display: none;
}

#loader, #modal-loader {
    padding: 50px;
    text-align: center;
}

.lds-ripple {
    display: inline-block;
    position: relative;
    width: 64px;
    height: 64px;
}

.lds-ripple div {
    position: absolute;
    border: 4px solid #b3a26c;
    opacity: 1;
    border-radius: 50%;
    animation: lds-ripple 1s cubic-bezier(0,.2,.8,1) infinite;
}

.lds-ripple div {
    position: absolute;
    border: 4px solid #b3a26c;
    opacity: 1;
    border-radius: 50%;
    animation: lds-ripple 1s cubic-bezier(0,.2,.8,1) infinite;
}

.lds-ripple div:nth-child(2) {
    animation-delay: -.5s;
}

.slick-disabled {
    display: none!important;
}

.jo-arrows {
    max-width: 1300px;
    margin: 30px auto;
    padding: 30px;
    position: relative;
    width: 100%;
    overflow: hidden;
}

.jo-arrow-prev, .jo-arrow-reset {
    position: absolute;
    padding: 15px 30px 15px 30px;
    background: white;
    font-size: 23px;
    font-weight: 400;
    letter-spacing: 1px;
    line-height: 30px;
    left: 0;
    cursor: pointer;
    top: 0;
	-webkit-transition: padding,transform ease 0.4s !important;
	-o-transition: padding,transform ease 0.4s !important;
	transition: padding,transform ease 0.4s !important;
}

.jo-arrow-prev:hover, .jo-arrow-reset:hover {
    transform: scale(1.05);
}

.jo-arrow-final, .jo-arrow-inside-next, .jo-arrow-next {
	display: none;
    position: absolute;
    padding: 15px 30px 15px 30px;
    background: white;
    font-size: 23px;
    font-weight: 400;
    letter-spacing: 1px;
    line-height: 30px;
    right: 15px;
    cursor: pointer;
    top: 0;
	-webkit-transition: padding,transform ease 0.4s !important;
	-o-transition: padding,transform ease 0.4s !important;
	transition: padding,transform ease 0.4s !important;
	text-align: center;
}

.side_bar .jo-arrow-next {
	margin: 20px 0 0 auto;
	float: none;
    position: unset;
	font-size: 17px;
    padding: 10px 20px 10px 20px;
    border-radius: 6px;
	color: black;
	width: 160px;
	text-align: center;
}

@media screen and (max-width: 768px)
{
	.jo-arrow-next {
		padding: 10px 20px 10px 20px;
		border-radius: 6px;
		font-size: 18px;
		display: block;
		text-align: center;
	}
}

.jo-arrow-final:hover, .jo-arrow-inside-next:hover, .jo-arrow-next:hover {
    transform: scale(1.05);
}

.jo-modules-out {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: rgba(0,0,0,.3);
    z-index: 9999;
    padding-top: 60px;
    display: none;
}

#modal, .jo-out-item {
    position: absolute;
    display: block;
    width: 100%;
    max-width: 768px;
    margin: 30px auto;
    padding: 1em;
    background-color: #fff;
    top: -100px;
    opacity: 0;
    transition-duration: .3s;
    -webkit-transition-duration: .3s;
}

.jo-out-item span.close {
    position: absolute;
    right: 20px;
    font-size: 40px;
    font-weight: 700;
    transform: rotate(45deg);
    color: #000;
    cursor: pointer;
}

.jo-out-item span.close:first-child {
    top: 10px;
}

.jo-out-item span.close:nth-child(2) {
    bottom: 10px;
}

.jo-bundles h3 {
    text-align: center;
}

.jo-modules-out h3 {
    font-weight: 700;
    text-align: center;
}

.jo-modules-out p {
    font-size: 16px;
}

.jo-bundles {
    text-align: center;
}

.jo-bundle {
    width: 75px;
    height: 75px;
    border-radius: 25px;
    display: inline-block;
    margin-right: 10px;
}

.club_group {
    margin-top: 20px;
	display: none;
}

.jo-childtype-box, .jo-member-option {
    float: left;
    display: block;
    width: 49%;
    margin-right: 1%;
    padding: 30px;
    background: #f3f3f3;
    position: relative;
    margin-bottom: 2%;
}

.clubs_wrapper {
	display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 25px;
}

@media screen and (max-width: 991px)
{
	.clubs_wrapper {
		grid-template-columns: 1fr;
		gap: 17px;
	}
}

.jo-options-box {
    float: left;
    display: block;
    width: 100%;
    margin-right: 0;
    padding: 0;
    background: #f3f3f3;
    position: relative;
    margin-bottom: 0%;
	border: solid 2px #686868;
	cursor: pointer;
	border-radius: 7px;
	min-height: 120px;
}

.jo-options-box.jo-box-selected * {
	color: white !important;
}

.jo-options-box:hover {
	box-shadow: 0 0 2px 0 rgb(19 26 31 / 12%), 0 2px 20px 0 rgb(19 26 31 / 22%);
}

.full_width_box {
	float: none !important;
    display: block;
    width: 100% !important;
	background: transparent !important;
}

#child_membership_content {
	display: grid;
    grid-template-columns: 1fr;
    gap: 20px;
}

.jo-options-box.payment-box {
	cursor: unset !important;
}

.payment_header {
	text-align: left !important;
    padding: 0 25px;
    font-size: 22px !important;
}

.jo-options-box.payment-box.ispaid .payment_header {
	color: #4BB543 !important;
}

.payment_header.recurringHeader {
	max-width: 65%;
    font-size: 17px !important;
}

.jo-options-box.payment-box.ispaid .plan-cost {
	display: none !important;
}

.jo-options-box.payment-box.ispaid .button_bl.payment_button {
	background: #4BB543 !important;
}

.jo-options-box.payment-box .jo-module-paid {
    position: absolute;
    top: 20px;
    right: 25px;
}

.header_ammount {
	float: right;
    font-size: 20px;
    font-weight: 600;
}

.header_ammount .slash,
.header_ammount .plan-cycle {
	font-size: 15px;
    font-weight: 400;
    text-decoration: none;
}

.payment_body {
	padding: 15px 25px;
	margin-bottom: 50px;
}

@media screen and (max-width: 768px)
{
	.jo-options-box.payment-box {
		padding: 0;
	}
}

.button_bl.payment_button {
	position: absolute;
    right: 15px;
    bottom: 15px;
    padding: 5px 15px;
    font-size: 15px;
	cursor: pointer;
	margin-bottom: 0;
	border-radius: 6px;
}

.jo_installments {
	margin-bottom: 25px;
}

.installments_label {
	padding-bottom: 7px;
    font-size: 17px;
    font-weight: 400;
}

#dropInstalments {
    font-weight: 600;
    font-size: 18px;
    cursor: pointer;
}

#dropInstalments option {
    font-size: 16px;
}

.button_bl.payment_button svg {
	padding-left: 5px;
}

.button_bl.payment_button:hover {
	border-color: #b0a273 !important;
}

.club_group .jo-options-box,
#child_membership_content .jo-options-box {
    text-align: center;
}

.jo-childtype-box h2, .jo-member-option h2, .jo_slick .jo-options-box h2 {
    display: block;
    border: none;
    margin-bottom: 0;
    font-size: 25px;
}

span.jo-box-subline {
    display: block;
    font-size: 16px;
    /*text-transform: uppercase;*/
    letter-spacing: 1px;
    margin-bottom: 0;
    text-align: left;
}

.cg_input {
    height: 1px;
    width: 1px;
    position: absolute;
    visibility: hidden;
}

.cg_label {
    display: inline-block !important;
    padding: 6px 15px;
    background: #000;
    color: #fff;
    font-size: 16px;
    text-transform: uppercase;
    cursor: pointer;
    max-height: 44px;
	margin-top: 0;
	border-radius: 6px;
}

.cg_label span:last-child {
    display: none;
	position: absolute;
    top: 10px;
    right: 10px;
}

.cg_label span:last-child * {
    margin: 4px;
    vertical-align: middle;
}

.options-box-header {
	padding: 10px 30px 10px 30px;
    background: #b3a26c;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}

.options-box-header > h2 {
	margin: 0;
}

.options-box-body {
	padding: 20px 30px 10px 30px;
}

.jo-options-box:nth-child(2n) {
    margin-left: 0;
    margin-right: 0;
}

.red-border-bottom {
	border-bottom: 2px solid red !important;
}

.jo-childform-box.jo-box-selected, .jo-childtype-box.jo-box-selected, .jo-member-option.jo-box-selected, .jo-options-box.jo-box-selected {
    background: #b0a273;
}

.cg_input:checked+.cg_label {
    background: 0 0;
    color: #000;
}

.cg_input:checked+.cg_label span:first-child {
    display: none;
}

.cg_input:checked+.cg_label span:last-child {
    display: inline-block;
}

.jo-options {
    display: block;
    position: relative;
    padding-top: 50px;
    height: auto;
    overflow: auto;
}

.jo-options-header {
    text-align: center;
}

.jo_slick .jo-options-header h2 {
    display: block;
    border: none;
    margin: 0 auto;
}

.jo_slick .jo-options-header span {
    text-transform: uppercase;
    font-size: 14px;
    font-weight: 700;
}

.jo_slick .jo-options-header p {
    font-size: 16px;
    text-align: center;
}

.jo-options-boxes, .jo-payoptions-boxes, .jo-payoptions2-boxes {
    display: flex;
    flex-wrap: wrap;
}

.jo-icons {
    margin: 0 auto;
    display: block;
}

.klarna_message p {
    margin: 0;
    font-weight: 700;
}

.jo_slick .jo-options-box p {
    text-align: center;
    font-size: 16px;
}

.klarna_message {
    margin: 0 auto;
    max-width: 400px;
}

div.klarna_message, div.pay_klarna {
    display: flex;
    padding: 10px 20px;
    align-items: center;
    justify-content: center;
}

.klarna_message img {
    height: 32px;
    margin: 0 0.75em;
}

.jo-options-selected {
    font-size: 18px;
    text-transform: uppercase;
    font-weight: 700;
    margin: 0 auto;
    width: 110px;
    opacity: 0;
    transition-duration: .3s;
}

.jo-options-selected img {
    margin-right: 3px;
}

.jo-box-icon label {
    font-size: 18px;
    text-transform: uppercase;
    width: 96px;
    margin: 0 auto;
    padding: 12px 20px 12px 20px;
    color: #fff;
    background: #000;
    cursor: pointer;
}

.jo-box-icon input {
    visibility: hidden;
    opacity: 0;
}

.jo-box-selected .jo-options-selected {
    opacity: 1;
}

form .jo-summary-item p {
    margin-bottom: 0;
}

.summary_location {
	border-bottom: solid 2px #686868;
    margin-bottom: 7px !important;
}

.starting_sidebar .firstStepHidden {
	display: none;
}

.jo-summary-item p > span {
    float: right;
}

a.jo-summary-edit {
    position: absolute;
    top: 5px;
    right: 5px;
    background-image: url(/wp-content/themes/holmes/assets/images/edit.svg);
    background-size: 15px;
    padding: 10px;
    background-repeat: no-repeat;
    background-position: center;
}

.jo-summary-item p.red_s b, .jo-summary-item p.red_s span {
    color: red;
}

.jo-module-box {
    display: block;
    position: relative;
    text-align: center;
    background-color: #ececec;
	cursor: pointer;
}

.jo-module-box:hover {
	box-shadow: 0 0 2px 0 rgb(19 26 31 / 12%), 0 2px 20px 0 rgb(19 26 31 / 22%);
}

#wellness-bundles .addon_box_parent > div,
#wellness-bundles .addon_box_parent > label {
	width: 100%;
    margin: 0;
    padding: 2.2em;
	border-top-right-radius: 90px;
    border-bottom-left-radius: 90px;
    border: solid 2px #686868;
}

.addon_box {
	min-height: 255px;
}

.bundle_main_content {
    display: flex;
	display: block;
    align-items: center;
    margin-bottom: 2em;
}

.bundle_main_content_image {
    margin-right: 10px;
}

.bundle_main_content_image img {
    max-width: 100%;
    width: 55px;
}

.jo-module-content h2 {
    font-size: 20px;
    text-transform: uppercase;
    display: block;
    border: none;
    margin: 10px 0;
}

.jo_slick .bundle_main_content_text h2 {
    font-size: 20px;
    margin: 0;
    padding: 0;
    text-align: left;
}

.bundle_main_content_text p {
    text-align: left;
    font-size: 12px;
    margin: 0;
}

.bundle_description p {
    margin: 0;
}

form .jo-module-content p {
    font-weight: 400;
	margin-bottom: 0.5rem;
}

.jo-module-selected {
    font-size: 18px;
    text-transform: uppercase;
    font-weight: 700;
    visibility: hidden;
}

.jo-modules label:not(.jo-module-box):not(.jo-options-box) {
    font-size: 16px;
    text-transform: uppercase;
    width: 100px;
    margin: 0 auto;
    padding: 6px 15px;
    color: #fff;
    background: #000;
    cursor: pointer;
    text-align: center;
}

input[name*=select_bundle].hidden {
    visibility: hidden;
}

.jo-arrow-prev {
    left: 140px;
    left: 0;
}

.jo-module-box.jo-selected {
    background: #686868;
}

.jo-module-box.jo-selected label {
    background: #686868;
    color: #000;
    text-transform: unset;
    text-decoration: underline;
}

.jo-module-box.jo-selected .jo-module-selected {
    visibility: visible;
}

.jo-module-box .jo-module-selected {
	position: absolute;
    top: 10px;
    left: 15px;
}

.jo-module-box.jo-selected * {
	color: white !important;
}

#datepicker {
	width: 115px;
    text-align: center;
    border: none;
    font-size: 13px;
    font-weight: bold;
    background-color: #ececec;
    cursor: pointer;
    padding: 0 !important;
	height: 23px;
}

#ui-datepicker-div {
	/*left: calc(50% - 136px) !important;*/
	position: absolute !important;
}

.btn_mobile_text {
	display: none;
}

.btn_desktop_text {
	display: inline-block;
}

.btn_pay_text,
.summary_paynow_btn {
	display: none;
}

.ui-widget-header {
	border: 1px solid #111 !important;
	background: #111 !important;
	color: white !important;
	font-weight: 100 !important;
}

.ui-datepicker .ui-datepicker-next span {
	background-image: url(/wp-content/themes/holmes/assets/images/whitearrowright.png);
	background-position: center center;
	background-size: 100% 100%;
}

.ui-datepicker .ui-datepicker-prev span {
	background-image: url(/wp-content/themes/holmes/assets/images/whitearrowleft.png);
	background-position: center center;
	background-size: 100% 100%;
}

.ui-datepicker th {
	color: #686868;
}

.ui-state-default, .ui-widget-content .ui-state-default {
	border: 1px solid #111;
	background: #686868;
	font-weight: normal;
	color: white;
	border-radius: 3px;
}

a.ui-state-default:hover {
	border-color: #686868;
}

.ui-state-active, .ui-widget-content .ui-state-active {
	border: 1px solid #111;
	background: #111;
	font-weight: normal;
	color: #fff;
	border-radius: 3px;
}


.ui-state-highlight, .ui-widget-content .ui-state-highlight {
	border: 1px solid #111 !important;
	background: white !important;
	color: black !important;
}

#datepickerMobileLabel {
	width: 150px;
	background: transparent;
	color: white;
	padding-right: 15px;
	font-size: 13px !important;
	height: 2em;
	border: none !important;
	text-align: center;
	outline: none !important;
	cursor: pointer !important;
	display: block;
	margin: 0;
	position: relative;
	top: 4px;
}

.ui-datepicker-next-hover, .ui-datepicker-prev-hover {
	border: none !important;
	background: transparent !important;
}

.ui-datepicker .ui-datepicker-next-hover {
	top: 2px !important;
	right: 2px !important;
}

.ui-datepicker .ui-datepicker-prev-hover {
	top: 2px !important;
	left: 2px !important;
}

<!-- normal style -->






















@media screen and (max-width: 1500px)
{
	.join-online-image-header .hero_sizer {
		padding-top: 15%;
	}
}

@media screen and (max-width: 1320px)
{
	.jo-nav .slick-dots li {
		padding: 12px 20px 6px 20px;
	}
	
	a.jo-nav-item {
		font-size: 15px;
	}
	
	.jo_slick h3 {
		text-align: center;
	}
}

@media screen and (max-width: 1200px)
{
	.hero_overlay {
		font-size: 8px;
		font-size: .8rem;
	}
	
	form .jo_slick .jo-location-input, form .jo_slick select {
		display: block;
		text-align: left;
		margin: 0px auto;
	}
	
	#jol_form_birthmonth, #jol_form_birthyear, form .row select[id^=jol_child_form_birth], select#jol_form_birthday {
		display: inline-block;
	}
}

@media screen and (max-width: 992px)
{
	a.jo-nav-item {
		font-size: 13px;
	}
}
	
@media screen and (max-width: 860px)
{
	.grid_wrapper {
		flex-direction: column!important;
	}
		
	.grid_cell {
		flex: 1 auto!important;
		margin-right: 0!important;
		max-width: 100%;
	}
	
	.slick-dots {
		display: block!important;
	}
}
	
@media screen and (max-width: 850px)
{
	.jo-nav .slick-dots li {
		width: auto;
		min-width: 60px;
		float: none;
		display: inline-block;
	}
	
	a.jo-nav-item span {
		display: none;
	}
	
	.jo-nav .slick-dots li.slick-active a.jo-nav-item span {
		/*display: inline-block;*/
	}
	
	form .jo_slick .jo-location-input, form .jo_slick select {
		max-width: 100%;
		margin: 10px auto;
	}
	
	form .jo-details select, form .jo-input select {
		margin: 0 auto;
	}
}

@media screen and (min-width: 769px)
{
	.jo-summary {
		display: none;
	}
}

@media screen and (max-width: 768px)
{
	.join-online-image-header:not(.start-smart) {
		display: none;
	}
	
	.join-online-image-header .hero_sizer {
		padding-top: 50%;
	}
	
	.join-online-image-header .hero_text span.hero_text__small_bold {
		font-size: 30px;
	}
	
	.hidden_mobile {
		opacity: 0;
		pointer-events: none;
	}
	
	.jo-summary {
		max-width: 100%;
		width: 100%;
		height: 200%;
		position: fixed;
		background-color: rgba(0,0,0,.5);
		top: 60px;
		z-index: 9;
		-webkit-transition: ease-in-out .5s all;
		-moz-transition: ease-in-out .5s all;
		transition: ease-in-out .5s all;
	}
	
	.jo-summary.hidden_mobile {
		top: -200px;
	}
	
	.jo-summary-item {
		width: 100%!important;
		background-color: #fff;
		padding: 0 2em;
		float: none;
	}
	
	.jo-summary-item:first-child {
		padding-top: 2em;
	}
	
	.summary_continue {
		background-color: #fff;
		padding: 2em;
		text-align: center;
		display: block;
	}
	
	.summary_continue button {
		margin: 0 auto;
		border: none;
		text-transform: uppercase;
	}
	
	.promotion-code label {
		text-align: center;
		display: block;
	}
	
	.promotion-code label input {
		margin: 10px;
	}
	
	.promotion-code div.btn {
		margin-bottom: 10px;
	}
	
	.promotion-code p.discount-response {
		vertical-align: text-bottom;
	}
	
	.jo-input {
		display: block;
	}
	
	#jol_form_gender, #jol_form_ref, #jol_form_join, #jol_form_ref, form .jo-input select[id^=jol_form_child_gender], form .jo-input select[id^=jol_form_child_title], select#jol_form_title {
		max-width: 100%;
		width: 100%;
		margin-right: 0;
		margin: 10px 0 30px 0;
	}
	
	.margin-left-10 {
		margin-left: 0;
	}
	
	input#jol_form_firstname, input[name="jol_form_childfirstname[]"] {
		width: 100%;
		margin: 10px 0 30px 0;
	}
	
	input#jol_form_surname, input[name="jol_form_childsurname[]"] {
		width: 100%;
		margin-left: 0;
		margin: 10px 0 0 0;
	}
	
	input#jol_form_email {
		width: 100%;
		margin: 10px 0 30px 0;
	}

	input#jol_form_email_confirm {
		width: 100%;
		margin-left: 0;
		margin: 10px 0 0 0;
	}
	
	input#jol_form_address {
		width: 100%;
		margin: 10px 0 30px 0;
	}

	input#jol_prefered_language {
		width: 100%;
		margin: 10px 0 30px 0;
	}
	
	input#jol_form_town {
		width: 100%;
		margin: 10px 0 30px 0;
	}

	input#jol_form_postalcode {
		width: 100%;
		margin-left: 0;
		margin: 10px 0 0 0;
	}
	
	input#jol_form_confirmpassword {
		margin-left: 0;
	}
	
	select#jol_form_gender {
		width: 100%;
		margin: 10px 0 30px 0 !important;
	}
	
	select#jol_form_ref {
		width: 100%;
		margin-left: 0;
		margin-right: 0;
	}
	
	select#jol_form_country {
		width: 100%;
		margin-left: 0;
		margin-right: 0;
	}

	select#jol_form_doy {
		width: 100%;
		margin-left: 0;
		margin-right: 0;
	}
	
	#jol_form_address_number {
		width: 100%;
		margin-left: 0;
		margin-right: 0;
	}
	
	.jo-details .jo-container .row .jo-input + .jo-input input {
		width: 100%;
		margin-left: 0;
		margin-right: 0;
	}
	
	input#jol_form_mobile {
		width: 100%;
		margin-left: 0;
		margin: 10px 0 0 0;
	}
	
	.iti.iti--allow-dropdown {
		margin-left: 0;
	}
	
	#jol_form_ref {
		width: 100%;
		margin-right: 0;
		max-width: 100%;
	}
	
	#jol_form_join {
		width: 100%;
		margin-left: 0;
		max-width: 100%;
	}
	
	.jo-childtype-box, .jo-daypass-box, .jo-member-option, .jo-options-box, .jo-payoptions-box, .jo-payoptions1-box, .jo-payoptions2-box {
		margin-left: 0;
		margin-right: 0;
		width: 100%;
		padding: 25px 10px 0 10px;
	}
	
	.jo-options-box:nth-child(2n) {
		margin-left: 0;
		margin-right: 0;
	}
	
	.jo-options-boxes .jo-options-box {
		display: flex;
		justify-content: space-around;
	}
	
	.jo-options-boxes .jo-options-box>img {
		align-self: flex-start;
		margin: 2em;
		margin-left: 0;
	}
	
	.jo-options-boxes .jo-options-box .category_block_content {
		display: flex;
		align-items: baseline;
		flex-direction: column;
		width: 80%;
	}
	
	.jo-options-boxes .jo-options-box div.klarna_message {
		padding: 0;
		margin: 0;
	}
	
	.jo-options-selected {
		width: 110px;
	}
	
	.jo-options-boxes .jo-options-box .jo-options-selected {
		margin: 1em 0 0 0;
	}
	
	.jo-input {
		width: 100% !important;
	}
	
	.jo-summary-edit {
		display: none;
	}
}

	
@media screen and (max-width: 610px)
{
	.jo-container {
		padding: 0 20px;
	}
	
	/*.jo-arrow-reset {
		padding: 5px 10px 5px 10px;
		font-size: 18px;
	}
	
	.jo-arrow-next {
		font-size: 18px;
		padding: 5px 10px 5px 10px;
	}
	
	.jo-arrow-prev {
		left: 90px;
		left: 0;
		font-size: 18px;
		padding: 5px 10px 5px 10px;
	}*/
	
	.jo-arrow-prev {
		left: 70px;
		left: 0;
	}
	
	.jo-modules-out {
		overflow: auto;
	}
}
	
@media screen and (max-width: 500px)
{
	.jo-nav .slick-dots li {
		overflow: hidden;
	}
	
	.jo-nav .slick-dots li {
		padding: 5px 20px 0 20px;
	}
	
	.jo-nav .slick-dots li:first-child:after {
		content: "";
		position: absolute;
		right: 0;
		top: 0;
		bottom: 0;
		width: 0;
		height: 0;
		border-left: 14px solid #0000;
		border-right: 0 solid #fff;
		border-bottom: 14px solid #fff;
		border-top: 14px solid #fff;
		border-right: 0 solid #111;
		border-bottom: 14px solid #111;
		border-top: 14px solid #111;
	}
	
	.jo-nav .slick-dots li:nth-child(n+2):before {
		content: "";
		position: absolute;
		left: 0;
		top: 0;
		bottom: 0;
		width: 0;
		height: 0;
		border-left: 13px solid #fff;
		border-left: 13px solid #111;
		border-right: 0 solid #ececec;
		border-bottom: 13px solid #ececec;
		border-top: 13px solid #ececec;
	}
	
	.jo-nav .slick-dots li:nth-child(n+2):after {
		content: "";
		position: absolute;
		right: 0;
		top: 0;
		bottom: 0;
		border-top: 13px solid #fff;
		border-bottom: 13px solid #fff;
		border-top: 13px solid #111;
		border-bottom: 13px solid #111;
		border-left: 13px solid #fff0;
		border-right: 0 solid #fff;
		border-right: 0 solid #111;
	}
	
	a.jo-nav-item {
		font-size: 13px;
	}
	
	.jo-location-input #autocomplete {
		padding-left: 4em;
	}
	
	form .jo-wellness .jo-module-content img {
		padding-top: 16px;
	}
	
	.jo-nav .slick-dots li.slick-active:nth-child(n+2):before {
		content: "";
		position: absolute;
		left: 0;
		top: 0;
		bottom: 0;
		width: 0;
		height: 0;
		border-left: 13px solid #fff;
		border-right: 13px solid #686868;
		border-bottom: 13px solid #686868;
		border-top: 13px solid #686868;
	}
}

@media screen and (max-width: 425px)
{
	.join-online-image-header .hero_sizer {
		padding-top: 70%;
	}
	
	.jo_slick h2 {
		font-size: 30px;
		margin: 10px;
		padding-bottom: 0px;
		padding-left: 15px;
	}
	
	.jo-location-input #autocomplete {
		padding-left: 3.2em;
	}
	
	.promotion-code div.btn {
		padding-bottom: 10px;
	}
	
	.jo_slick .jo-options-box .category_block_content p {
		text-align: left;
	}
	
	.category_block_content .klarna_message {
		justify-content: flex-start;
		flex-wrap: wrap;
	}
	
	.category_block_content .klarna_message img {
		margin-left: 0;
	}
}

@media screen and (max-width: 390px)
{
	.join-online-image-header .hero_sizer {
		padding-top: 70%;
	}
	
	.join-online-image-header .hero_text span.hero_text__small_bold {
		font-size: 30px;
	}
	
	.jo-nav .slick-dots li {
		padding: 5px 0 0 0;
		min-width: 40px;
	}
	
	.jo-nav .slick-dots li.slick-active {
		/*padding: 5px 10px 0 5px;
		min-width: 160px;*/
	}
	
	a.jo-nav-item {
		font-size: 12px;
	}
	
	.jo-nav .slick-dots li:last-child {
		/*padding: 5px 10px 0 5px;*/
	}
	
	.ellipsis {
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}
	
	.jo-location-input #autocomplete {
		padding-left: 3.2em;
		padding-right: 3.2em;
	}
	
	.jo-arrows {
		overflow: visible;
	}
	
	.jo-arrow-final {
		max-width: 40%;
	}	
	
	.btn_mobile_text {
		display: inline-block;
	}

	.btn_desktop_text {
		display: none;
	}
}

@media screen and (max-width: 375px)
{
	form .jo_slick .jo-location-input, form .jo_slick select {
		max-width: 100%;
		margin: 10px 0!important;
		width: 100%!important;
	}
	
	#jol_form_birthmonth, #jol_form_birthyear, select#jol_form_birthday {
		/*display: block;
		width: 100%!important;*/
		font-size: 14px !important;
		padding-left: 0;
		padding-right: 15px;
	}
	
	.jo-arrow-prev, .jo-arrow-reset {
		padding: 15px 20px 15px 20px;
	}
	
	.jo-bundle {
		width: 25px;
		height: 25px;
	}

	.bundle_main_content {
		flex-wrap: wrap;
		justify-content: center;
		margin-bottom: 10px;
	}
	
	.jo_slick .bundle_main_content_text h2.jo-module-colour {
		margin-top: 15px;
		font-size: 17px;
	}
	
	form .jo_slick select {
		font-size: 13px !important;
		padding-left: 0px;
	}
	
	form .jo-wellness .jo-module-content img {
		padding-top: 0;
	}
	
	.jo_slick h3 {
		line-height: 1.2;
		margin-top: 0;
		margin-bottom: 2rem;
	}
	
	.bundle_description p {
		height: 90px;
	}
}

@media screen and (min-width: 768px)
{
	#wellness-bundles .addon_box_parent > div,
	#wellness-bundles .addon_box_parent > label {
		padding: 2.5em;
	}
	
	.bundle_main_content {
		justify-content: center;
	}
	
	form .jo-module-content .bundle_description p {
		text-align: left;
	}
}

@media screen and (max-width: 992px)
{
	.jo-input, .jo-details.details_checkboxes .row {
		padding: 0 10px;
	}
	input#jol_form_mobile{
		margin:0;
	}
	#jo-validation-form .birthday_wrapper > span:not(:last-child):after {
		top: 49px;
	}
	#span_birthmonth, #span_birthyear{	
		padding-left: 10px!important;
	}
	
	.jo-details .jo-input{
		margin:10px 0;
	}
	.jo-details .jo-input input{
		margin-top: 0!important;
		margin-bottom: 0!important;
	}
	.jo-input.phone_multi_input .iti.iti--allow-dropdown{
		margin-left:0;
	}
	
	.row .jo-input .whereFoundUsDropdown, .row .jo-input #jol_form_gender{
		margin-bottom: 0!important;
	}
	
}

@media screen and (max-width: 480px)
{
	
	#jo-validation-form .birthday_wrapper > span:not(:last-child):after {
		top: 32px;
	}
	
}

.StepCartCont{
	display:none;
	width: 50px;
    float: right;
	font-size: 24px;
	position: relative;
}	
	
.cartCounter {
	border-radius: 50%;
    background-color: #686868;
    color: white;
    font-size: 11px;
    position: absolute;
    width: 20px;
    height: 20px;
    text-align: center;
    top: -10px;
    left: 20px;
	display: none;
}
	
@media screen and (max-width: 768px)
{
	.jo-nav.wizardbar > ul.slick-dots{
		width: calc(100% - 50px);
		float: left;
	}
	
	.StepCartCont{
		display:block;
	}
	
	.jo-nav .slick-dots li.slick-active a.jo-nav-item span{
		display:none;
	}
	
	
	.jo-nav .slick-dots li {
		padding: 5px 20px 0 20px;
	}
	.jo-nav .slick-dots li:first-child:after {
		border-left: 14px solid #0000;
		border-right: 0 solid #111;
		border-bottom: 14px solid #111;
		border-top: 14px solid #111;
	}
	.jo-nav .slick-dots li:nth-child(n+2):before {
		border-left: 13px solid #111;
		border-right: 0 solid #ececec;
		border-bottom: 13px solid #ececec;
		border-top: 13px solid #ececec;
	}
	.jo-nav .slick-dots li:nth-child(n+2):after{
		border-top: 13px solid #111;
		border-bottom: 13px solid #111;
		border-left: 13px solid #fff0;
		border-right: 0 solid #111;
	}
	.jo-nav .slick-dots li.slick-active:nth-child(n+2):before {
		border-left: 13px solid #111;
		border-right: 13px solid #686868;
		border-bottom: 13px solid #686868;
		border-top: 13px solid #686868;
	}
	.join-online-wrapper .slick-slide.jo_slick.slick-active{
		grid-template-columns: 1fr;
	}
	
	.join-online-wrapper .main_bar > .club_group > h3{
		width: 100%!important;
		margin-right: 0!important;
	}
	
	.join-online-wrapper .main_bar .clubs_wrapper .options-box-header > h2 {
		margin: 0;
		font-size:22px;
	}
	
	.join-online-wrapper .main_bar .clubs_wrapper .jo-options-box.subscription_box .options-box-header{
		padding-left:10px;
		padding-right:10px;
	}
	
	#modalSubCart .jo-summary-item {
		background-color: #111;
	}
	
	#modalSubCart #modalSubCartCont .jo-summary-item.item-0 p {
		color: white;
		font-size: 13px !important;
	}
	
	#modalSubCartCont .referred_box_parent .row.referred_box > label,
	#modalSubCartCont .referred_box_parent .row.referred_box #datepickerModal {
		font-size: 14px !important;
	}
	
	#modalSubCart .referred_box_parent {
		background-color: #111;
		color: white;
	}
	
	#modalSubCart .row.referred_box {
		padding: 0;
		padding-top: 30px;
	}
	
	#modalSubCart #datepickerModal {
		color: white;
	}
	
	#modalSubCart .CloseMSCBtn {
		font-size: 14px;
		color: white;
	}
	
	#modalSubCart .emptycart {
		position: relative;
		margin-bottom: 20px;
	}
	
	#modalSubCartCont{
		margin: 0;
		width: calc(100vw - 40px);
		padding: 0 5px;
	}
	
	#modalSubCartCont .jo-arrow-next {
		margin: 20px 0 0 auto;
		float: none;
		position: unset;
		font-size: 15px;
		padding: 7px 10px 7px 10px;
		border-radius: 6px;
		color: black;
		width: 130px;
		position: unset;
		margin-top: 10px;
		text-align: center;
	}
	
	#modalSubCartCont #minicart_1.jo-summary-item.item-0 {
		padding: 0;
		display:inline-block;
	}
	
	#modalSubCartCont #datepickerModal{
		border: none;
		background: transparent;
	}
	
	#modalSubCartCont .jo-summary-item:first-child{
		padding:0;
	}
	
	.jo-container{
		max-width:100vw!important;
	}
	#wellness-bundles{
		grid-template-columns: 1fr;
	}
	
	form .jo-wellness .jo-module-content img{
		padding:0;
	}
	.bundle_main_content{
		padding-top: 8px;
	}
	
	
	.CloseMSCBtn{
		float: left;
		background:none;
		color:#000;
		font-weight: 600;
		text-transform: uppercase;
		letter-spacing: 1px;
		line-height: 30px;
		margin: 20px 0 0 auto;
		cursor: pointer;
		font-size: 17px;
		padding: 10px 20px 10px 20px;
		border-radius: 6px;
		width: 160px;
		position: unset;
		margin-top: 10px;
		
	}
}