main {
	margin: 8rem auto 5rem auto;
}
.intro {
	font-size: 1.5rem;
	font-weight: bold;
	color: var(--mainDark);
}
section {
	width: 70%;
	margin: 0 auto;
}
/*THE FOLLOWING HIDES THE RED LASTPASS ICON WHICH APPEARS WHEN THE DIVs ARE COLLAPSED*/
div[data-lastpass-icon-root="true"],
div[data-lastpass-infield="true"],
div[data-lastpass-icon-root] { 
  opacity: 0!important; 
}
h2 {
	margin-top: 4rem;
}
h2+p+p {
	margin-bottom: 4rem;
}
h5 {
	font-size: 1rem;
}
form p {
	line-height: 2;
}
fieldset {
	border: 1px solid var(--neutralLight);
	line-height: 1;
}
fieldset+fieldset {
	margin-top: 2rem;
}
fieldset:not(.payment):not(.insurance):not(.socialartisan) {
	height: 0;
	overflow: hidden;
	margin-bottom: 1.5rem;
	transition: .3s;
}
.visible {
	height: auto !important;
	overflow: auto !important;
	border: 1px solid var(--neutralDark);
}
.payment,
.insurance,
.socialartisan {
	border: 1px solid var(--neutralDark);
}
fieldset label {
	/*width: max-content;
	min-width: 14rem;
	max-width: 50rem;*/
	margin-bottom: 1rem;
}
fieldset label:has(+textarea) {
	width: 100%;
	margin-top: 1rem;
}
label+textarea {
     margin-bottom: 1rem; 
}
fieldset input {
	margin-right: 1rem;
}
fieldset input:not([type]), 
[type="email"], 
[type="tel"],
[type="number"] {
    margin-right: 0;
    /*width: 20rem;*/
    height: 1.5rem;
}
.pairs input:not(.tableStyle input):not([type="checkbox"]):not([type="radio"]) {
	width: 20rem;
}
.wide10 {
	display: inline-block;
	/*width: 10rem;*/
	min-width: initial;
	max-width: initial;
}
.stalls input[type="radio"]+label,
.stalls input[type="checkbox"]+label,
.stalls label,
.pairs label {
	display: inline-block;
}
.pairs label:not(.tableStyle label):not(label:has(+select)):not(label:has(+textarea)):not(label:has(+[type="radio"])):not(input[type="radio"]+label) {
    width: 15rem;
}
legend {
    font-size: 1.25rem;
    padding-left: 0;
    margin-left: 0;
    position: relative;
    cursor: pointer;
}
legend:not(.socialartisan legend):not(.insurance legend):not(.payment legend)::before {
    content: "\002b";
    font-size: 3rem;
    position: absolute;
    top: -.95rem;
    left: -1.5rem;
    color: var(--mainMid);
}
.visible legend::before {
    content: ""!important;
}
legend::after {
	content: " - click to expand";
	font-size: 1rem;
}
.socialartisan legend,
.insurance legend,
.payment legend {
	font-weight: bold;
}
.visible legend {
	font-weight: bold;
}
.visible legend::after {
	content: " - click to hide";
	color: var(--mainDark);
}
.payment legend::after,
.insurance legend::after,
.socialartisan legend::after {
	content: "";
}
textarea {
	width: 100%;
	height: 6rem;
}
fieldset span:not(.emphasis):not(.note):not(.description):not(.addToBasket):not(.price):not(.uploadInsurance) {
	display: inline-block;
	width: 7rem;
}
.emphasis {
	font-weight: bold;
}
.note {
	display: block;
}
.chooseOne {
	font-weight: bold;
	font-size: 2rem;
	text-align: center;
}
.mutuallyExclusive {
	border: 1px solid var(--neutralMid);
	margin-bottom: 1rem;
	padding: .25rem;
}
.mutuallyExclusive p {
	display: grid;
	grid-template-columns: 2fr 1fr auto;
}
.mutuallyExclusive span {
	margin-bottom: 1rem;
}
.price {
	text-align: center;
}
.mutuallyExclusive .addToBasket {
	background-color: var(--mainDark);
	color: var(--neutralLight);
	text-align: center;
	border: 5px solid var(--neutralLight);
	padding-right: .2rem;
	height: 3rem;
	cursor: pointer;
}
.uploadInsurance {
	background-color: var(--mainDark);
	color: var(--neutralLight);
	text-align: center;
	border: 5px solid var(--neutralLight);
	padding: .25rem;
	display: inline-block;
	margin-top: 2rem;
	cursor: pointer;
}
.tableStyle label,
.tableStyle input,
.tableStyle select {
	/*width: 10rem;*/
	margin-bottom: 1rem;
	/*min-width: initial;
	max-width: initial;*/
}
label[for*="close"],
label[for*="end"] {
    margin-left: 2rem;
}
.tableStyle [class*="pairs"] {
	display: grid;
	grid-gap: 1rem;
}
.tableStyle .pairs1 {
	grid-template-columns: 10rem auto;
}
.tableStyle .pairs2 {
    grid-template-columns: 10rem auto 10rem auto;
}
.tableStyle .pairs3 {
    grid-template-columns: 10rem 13rem 4rem 4rem 4rem 4rem;
}
@media only screen and (max-width: 1400px) {
	article>section {
		width: 80%;
	}
	.tableStyle {
		width: 100%;
	}
}
@media only screen and (max-width: 900px) {
	article>section {
		width: 90%;
	}
}
@media only screen and (max-width: 890px) {
	.tableStyle input,
	input[name="street"],
	input[name="suburb"] {
	    /*width: 20rem;*/
	}
}
@media only screen and (max-width: 820px) {
	.tableStyle .pairs1,
	.tableStyle .pairs2 {
	    grid-template-columns: 6rem auto;
	}
	.tableStyle .pairs3 {
	    grid-template-columns: 6rem 13rem 4rem 4rem 4rem 4rem;
	}
}
@media only screen and (max-width: 710px) {
    .tableStyle .pairs1, .tableStyle .pairs2, .tableStyle .pairs3 {
        grid-template-columns: repeat(1, 1fr);
        grid-gap: 0;
    }
    [class*="pairs"] label {
        /*margin-bottom: 0;*/
    }
}
@media only screen and (max-width: 395px) {
	fieldset label,
	.tableStyle label
	 {
		margin-bottom: 0;
		margin-top: 1rem;
	}
	.tableStyle input, 
	.tableStyle select {
		margin-top: 0;
	}
	label[for*="close"], 
	label[for*="end"] {
	    margin-left: 0;
	}
	label:has(+select) {
	    margin-bottom: 0;
	    display: block!important;
	}
	select {
		width: 50%;
		margin-bottom: 1rem;
	}
	.mutuallyExclusive span {
	    display: block;
	    width: 100%;
	     margin-bottom: 0; 
	}
	.mutuallyExclusive p:not(:last-of-type) {
	    border-bottom: 1px solid var(--neutralMid);
	}
	.mutuallyExclusive p {
		display: block;
	}
	.price {
		text-align: left;
	}
	.mutuallyExclusive .addToBasket {
	    width: 50%;
	    padding: .25rem;
	    margin: 0 auto;
	}
}
@media only screen and (max-width: 375px) {
	fieldset {
	    padding: .5rem .1rem;
	}
	.pairs label:not(.tableStyle label):not(label:has(+select)):not(label:has(+textarea)):not(label:has(+[type="radio"])):not(input[type="radio"]+label),
	.pairs input:not(.tableStyle input):not([type="checkbox"]):not([type="radio"])  {
	    width: 100%;
	}
}