/* 
-----------------------------------------------------------------------------------
	GLOBAL ECO
	Registration Form Stylesheet
	https://globaleco.com.au/

	blue:         #216bb5    33,107,181
	green:        #84ad34    132,173,52
	orange:       #ed8123    237,129,35
-----------------------------------------------------------------------------------
*/

h4, * + h4 { font-size: 1.2rem; margin-top: 1.8rem; }

span, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, { border: 0; font-size: 100%; font: inherit; margin: 0; padding: 0; vertical-align: baseline; }

table { border-collapse: collapse; border-spacing: 0; }
th, td { padding: 0.25rem 0.5rem; }

/* this is needed to override the main style sheet */
main table tr > td:first-of-type { font-weight: normal; min-width: 0; }

main img { max-width: 195px; }

fieldset { padding-bottom: 3rem; border: none; }
fieldset legend { display: none; }
fieldset label { display: block; margin-top: 1rem; margin-bottom: 0.1rem; min-width: 3rem;}
fieldset p { margin-bottom: 0.5rem; }

input:not([type=submit]):not([type=file]):not([type=radio]):not([type=checkbox]), select, textarea { padding: 6px 10px; border: 2px solid #216bb5; width: 85%; }
input:not([type=submit]):not([type=file]):not([type=radio]):not([type=checkbox]):focus, select:focus, textarea:focus { background: rgba(33,107,181,0.1); }
input[type="submit"], button { cursor: pointer; }
button { border: none; font-size: 1rem; }

input[type=radio] {width:auto !important;}
input[type=radio]+label {display:inline-block;max-width:5rem;margin-top:0;}

input.locked { border: 2px solid #780000 !important; }

fieldset table { width: 100%; border: 2px solid #84ad34; margin-bottom: 1rem;}
fieldset table th, fieldset table td { border: 2px solid #84ad34; vertical-align: middle; }
fieldset table td label { display: inline; margin: 0; padding: 0; font-weight: normal; }
fieldset table select { margin-top: 0.5rem; }
fieldset table td.selector { border-right: none !important; text-align: center; vertical-align: middle; width: 4rem; }
fieldset table td.date { border-left: none !important; }
fieldset table td.label { border-left: none !important; }
fieldset table td.label em { display: block; font-size: 0.69rem; margin: 0; padding: 0; }
fieldset table td.price { width: 7rem; }
fieldset table td.price em { display: block; font-size: 0.69rem; margin: 0; padding: 0; }

.subtotal, .total { text-align: right; }
.subtotal label, .total label { color: #444; font-weight: bold; }
.subtotal input, .total input { width: 7rem !important; padding: 0.25rem 0.5rem !important; font-size: 1rem; margin-left: 3px; text-align: right;}

.chosen { background: rgba(33,107,181,0.1); }

.discounted { background-color: #ffcc99; }
input:not([type=submit]):not([type=file]):not([type=radio]):not([type=checkbox]):focus.discounted { background-color: #e8c29c; }

.choose-type { display: grid; grid-template-columns: 1fr 1fr 1fr; grid-template-rows: auto auto; grid-auto-flow: column; grid-template-areas: "option1 option2 option3" "toggle1 toggle2 toggle3" "description description description"; border-top: 2px solid #84ad34; border-left: 2px solid #84ad34; margin-bottom: 1rem; width: 100%; }
.choose-type > * { border-bottom: 2px solid #84ad34; border-right: 2px solid #84ad34; padding: 0.25rem 0.5rem; text-align: center; vertical-align: top; font-size: 0.83rem; overflow: hidden; position: relative; }
.choose-type img { width: 100%; height: auto; max-width: 300px; margin-left: auto; margin-right: auto; }
.choose-type h4 { margin-top: 0; font-size: 0.83rem; }
.choose-type input[type=radio]+label { display: block; cursor: pointer; background: top center no-repeat; padding-top: 300px; max-width: 100%; width: 100%; }

.choose-type--working input { display: none; }
.choose-type--working .choose-toggle { display: block; }

.choose-option { border-bottom: none; }
.choose-description { transition: height 0.5s; }

.choose-toggle { border-bottom: none; display: none; }
.choose-toggle label { display: block; cursor: pointer; max-width: 100%; width: 100%; font-size: 0.83rem; color: #216bb5; margin-top: 0.1rem; }

#choose-option-1 { grid-area: option1; }
#choose-option-2 { grid-area: option2; }
#choose-option-3 { grid-area: option3; }

#choose-option-1 label { background-image: url(/img/icon-individual.png); }
#choose-option-2 label { background-image: url(/img/icon-group-small.png); }
#choose-option-3 label { background-image: url(/img/icon-group-large.png); }

#choose-toggle-1 { grid-area: toggle1; }
#choose-toggle-2 { grid-area: toggle2; }
#choose-toggle-3 { grid-area: toggle3; }

.choose-description--compact { grid-area: description; height: 0; padding: 0; border-bottom: none; }
.choose-description--expanded { grid-area: description; width: 100%; padding: 1rem; }
.choose-toggle--compact { border-bottom: 2px solid #84ad34; }

@media (min-width: 62.5em) {
	.choose-type > * { font-size: 1rem; }
	.choose-type h4 { font-size: 1.2rem; }
	.choose-toggle label { font-size: 0.5rem; }
}

#reg-summary .subtotal label, #reg-summary .total label, #accept-photography label, #accept-conditions label { width: 60%; display: inline-block; text-align: left; border-bottom: 1px dotted; }
@media (min-width: 768px) {
    #reg-summary .subtotal label, #reg-summary .total label, #accept-photography label, #accept-conditions label { width: 78%; }
}

#reg-summary .total label { color: #000; font-size: 1.1rem; width: 50% !important; }
#reg-summary .total input { color: #000; font-size: 1.1rem; width: 8rem !important; }

fieldset ul { margin-bottom: 1.3rem; }
fieldset ul ul { margin-bottom: 0; }
fieldset ul li { margin-bottom: 0.2rem; }