body {
	margin: 0px;
}

img {
	max-width: 100%;
}

#header {
	text-align: center;
}

#body-text {
	text-align: center;
	max-width: 840px;
	margin: auto;
	padding: 0px 20px;
}

p { 
	font-size: 22px;
	font-family: "effra", helvetica, sans-serif;
}

h2 {
	font-size: 15px;
	font-family: "effra", helvetica, sans-serif;
	color: #22376d;
}

a {
	color: #22376d;
}

#body-logos {
    max-width: 800px;
    margin: auto;
    margin-top: 40px;
    margin-bottom: 40px;
    text-align: center;
}

#body-logos > img {
	height: 30px;
	padding: 10px 15px;
	border-right: 2px solid #939394;
}

#body-logos > img:nth-of-type(4) {
	border-right: 0px !important;
}

#body-wrapper { 
	background-color: #72c48e;
}

#body-main {
	max-width: 1020px;
	margin: auto;
	padding-left: 20px;
}

#form {
	display: inline;
	float: left;
	width: 40%;
	padding-top: 20px;
}

form {
	margin-top: 20px;
}

input {
    border: 1px solid #22376d;
    color: #22376d;
    text-align: center;
    padding: 12px 10px;
    margin-bottom: 15px;
    min-width: 270px;
    font-family: "effra", helvetica, sans-serif;
}

select {
    border: 1px solid #22376d;
    color: #22376d;
    text-align: center;
    padding: 12px 10px;
    margin-bottom: 15px;
    min-width: 291px;
    font-family: "effra", helvetica, sans-serif;
}

label {
    font-family: "effra", helvetica, sans-serif;
    color: #22376d;
}

label#participant {
    font-weight: 500;
    margin-left: 5px;
}

label#leader{
    font-weight: 500;
}

label#terms {
	font-size: 12px;
	margin-left: 5px;
}

input#participant {
    min-width: 1px;
}

input#leader {
    min-width: 1px;
}

input#dofe_tcs, input#postalpermit, input#emailpermit, input#smspermit, input#over18 {
    min-width: 1px;
    display: inline-block;
    float: left;
}

label#terms {
    font-size: 12px;
    margin-left: 5px;
    display: inline-block;
    float: left;
    width: 85%;
}

input::placeholder {
	color: #22376d;
}

label.field-label {
	display: block;
	font-size: 14px;
	margin-bottom: 4px;
}

input#submit {
    color: #ffffff;
    background-color: #8400c5;
    border: 1px solid #8400c5;
    font-weight: 500;
    min-width: 220px;
    transition: ease 0.4s;
}

input#submit:hover {
	opacity: 0.7;
}

input#submit:disabled,
input#submit:disabled:hover {
	background-color: #9aa3b8;
	opacity: 0.6;
	cursor: not-allowed;
}

@keyframes dofe-spin {
	to { transform: rotate(360deg); }
}

.dofe-spinner {
	display: inline-block;
	width: 16px;
	height: 16px;
	border: 2px solid rgba(34, 55, 109, 0.25);
	border-top-color: #22376d;
	border-radius: 50%;
	animation: dofe-spin 0.7s linear infinite;
	margin-right: 8px;
	flex-shrink: 0;
}

/* Highlight applied to required/invalid fields when a blocked submit is attempted */
.field-error {
	border: 2px solid #c0392b !important;
	background-color: #fdecea !important;
}

#image {
	display: inline;
	float: right;
	width: 60%;
}

#image > img {
	display: block;
}

.clear {
	clear: both;
}

#footer-wrapper {
	background-color: #8400c5;
}

#footer-inner {
	max-width: 960px;
	margin: auto;
	text-align: center;
	padding: 30px;
}

.white {
	color: #ffffff;
	text-align: left;
}

#footer-logo {
	float: left;
	display: inline;
	width: 20%;
}

#footer-logos {
    float: left;
    width: 30%;
    display: inline;
}

#footer-text {
	margin: auto;
	float: right;
	display: inline;
	width: 70%;
	padding-top: 15px;
}

#footer-youth {
	float: left;
	display: inline;
	width: 20%;
}

#footer-logo > img {
	max-height: 50px;
}

#footer-youth > img {
	max-height: 80px;
}

#footer-text > p {
    margin: 0px;
    padding: 0px 20px;
}

#body-images {
    margin-bottom: -30px;
}

.terms {
    max-width: 1000px;
    margin: auto;
    padding: 0px 20px;
}

.terms > p {
    font-size: 12px;
    color: #000000;
    text-align: center;
}

.terms_label, .postal_label, .email_label, .sms_label {
    display: inline;
    float: left;
    margin-bottom: 20px;
    width: 90%;
}

.terms_click, .postal_click, .email_click, .sms_click {
    display: inline;
    float: left;
}

@media (max-width: 930px) and (min-width: 780px) {

	#form {
		width: 35%;
	}

	#image { 
		width: 65%
	}
	
	input {
	    margin-bottom: 10px;
	}
}

@media (max-width: 830px) and (min-width: 780px) {
	
	input {
	    padding: 10px;
	    min-width: 230px;
	}
}

@media (min-width: 780px) {

	.mobile {
		display: none !important;
	}
}
@media (max-width: 780px) {

	.desktop {
		display: none !important;
	}

	#image {
	    display: block;
	    float: none;
	    width: 100%;
	}

	#form {
	    display: block;
	    float: none;
	    width: 100%;
	    text-align: center;
	    max-width: 300px;
	    margin: auto;
	}

	#body-main {
	    padding: 0px;
	}

	#footer-logo {
	    display: block;
	    float: none;
	    width: 100%;
	    margin-bottom: 20px;
	}

	#footer-text {
	    display: block;
	    float: none;
	    width: 100%;
	    margin-bottom: 20px;
	}

	#footer-youth {
	    display: block;
	    float: none;
	    width: 100%;
	}

	#body-images {
	    margin-bottom: -50px;
	}

	#footer-logos {
	    display: block !important;
	    width: 50%;
	    text-align: center;
	    margin: auto;
	    float: none;
	}
}

@media (max-width: 460px) {
	#body-images {
	    margin-bottom: -35px;
	}
}

@media (max-width: 330px) {

	input {
		min-width: 100%;
		padding: 12px 0px;
	}

	#form {
	    padding: 0px 10px;
	}

	#body-images {
	    margin-bottom: -25px;
	}
}

@media (min-width: 1150px) {
	#body-images {
	    margin-bottom: -35px;
	}
}

@media (min-width: 1520px) {
	#body-images {
	    margin-bottom: -50px;
	}
}