/********** contact form **********/
.container.CONTACT {width: 86.0%; margin: 0% 0% 0% 0%; padding: 3% 7% 3% 7%;}

.CONTACT h2 {margin: 0% 0% 1% 0%; font-size: 170%; line-height: 1.2;}
.CONTACT p {margin: 0% 0% 2% 0%; font-size: 125%; line-height: 1.4;}
.CONTACT p.req {margin: 0% 0% 2% 0%; font-size: 125%; line-height: 1.4; font-style: italic;}


.CONTACT .span_1_of_1.first {width: 100%; margin: 0%; padding: 0%; text-align: center;}
.CONTACT .span_1_of_1.second {width: 100%; margin: 0%; padding: 0%;}

.CONTACT form {width: 60%; margin: 0% auto;}
.CONTACT .formRow {clear: both;}

label {width: 20%; margin: 0%; padding: .5% 2% .5% 0%; text-align: right; float: left; font: normal normal 125%/1.4 'Muli', sans-serif;}
.spacer {width: 20%; margin: 0%; padding: .5% 2% .5% 0%; float: left;}

input.text60, input.text30 {margin-bottom: 2%; padding: .5% 0% .5% 1%; border: 1px solid #aaa; float: left; font: normal normal 125%/1.4 'Muli', sans-serif;}
input.text60 {width: 60%;}
input.text30 {width: 30%;}
select {width: 45%; margin: 0% 0% 2% 0%; padding: .5% 0% .5% 0%; float: left; font: normal normal  125%/1.4 'Muli', sans-serif;}
textarea.textarea60 {width: 60%; height: 150px; margin: 0% 0% 2% 0%; padding: .5% 0% .5% 1%; border: 1px solid #aaa; float: left; font: normal normal  125%/1.4 'Muli', sans-serif;}

input.buttonSubmit, input.buttonReset {padding: 1% 3% 1% 3%; border: 1px solid #aaa; color: #555; cursor: pointer; float: left; font: bold normal  110%/1.4 'Muli', sans-serif; border-radius: 4px;}
input.buttonSubmit {margin: 0% 2% 2% 0%;}
input.buttonReset {margin: 0% 0% 2% 0%;}
input.buttonSubmit:hover, input.buttonReset:hover {border: 1px solid #bbb; color: #aaa;}

br.CONTACT_1680 {display: block;}
br.CONTACT_820 {display: none;}
br.CONTACT_520 {display: none;}



/***** TEXT 1200px ******/
@media only screen and (max-width: 1200px) {
.CONTACT form {width: 80%;}

.CONTACT h2 {font-size: 160%;}
.CONTACT p {font-size: 115%;}
.CONTACT p.req {font-size: 115%;}

label {font-size: 115%;}
input.text60, input.text30 {font-size: 115%;}
select {width: 47%; padding: .5% 0% .5% 1%; font-size: 115%;}
textarea.textarea60 {padding: .75% 0% .5% 1%; font-size: 115%;}
input.buttonSubmit, input.buttonReset {font-size: 110%;}
}



/***** TEXT 1000px ******/
@media only screen and (max-width: 1000px) {
.CONTACT h2 {font-size: 150%;}
.CONTACT p {font-size: 105%;}
.CONTACT p.req {font-size: 105%;}

label {font-size: 105%;}
input.text60, input.text30 {font-size: 105%;}
select {width: 54%; padding: .5% 0% 1% 1%; font-size: 105%;}
textarea.textarea60 {padding: .75% 0% .5% 1%; font-size: 105%;}

input.buttonSubmit, input.buttonReset {padding: .75% 4% 1.25% 4%; font-size: 105%;}
}



/***** 820px ******/
@media only screen and (max-width: 850px) {
br.CONTACT_820 {display: block;}
.CONTACT .span_1_of_1.first {margin: 0% 0% 2% 0%;}
}



/***** TEXT 800px ******/
@media only screen and (max-width: 800px) {
.CONTACT h2 {font-size: 140%;}
.CONTACT p {font-size: 102%;}
.CONTACT p.req {font-size: 102%;}

.CONTACT form {width: 80%;}
label {font-size: 102%;}
input.text60, input.text30 {padding: .75% 0% .75% 1%; font-size: 102%;}
select {width: 47%; padding: .5% 0% .60% 1%; font-size: 102%;}
textarea.textarea60 {width: 75%; padding: .75% 0% .5% 1%; font-size: 102%;}
input.buttonSubmit, input.buttonReset {padding: .75% 4% 1.25% 4%; font-size: 102%;}

br.CONTACT_1680 {display: block;}
}



/***** 740px ******/
@media only screen and (max-width: 740px) {
br.CONTACT_740 {display: block;}
}



/***** 720px ******/
@media only screen and (max-width: 720px) {
.CONTACT form {width: 100%;}
label {width: 19%;}
.spacer {width: 19%;}
}



/***** TEXT 600px ******/
@media only screen and (max-width: 600px) {
.CONTACT h2 {font-size: 130%;}
.CONTACT p {font-size: 90%;}
.CONTACT p.req {font-size: 90%;}

label {padding: .75% 3% .75% 0%; font-size: 90%;}
input.text60, input.text30 {font-size: 90%;}
select {width: 56%; padding: .5% 0% 1% .25%; font-size: 90%;}
textarea.textarea60 {width: 75%; padding: .75% 0% .5% 1%; font-size: 90%;}
input.buttonSubmit, input.buttonReset {padding: .75% 4% 1.25% 4%; font-size: 90%;}
}



/***** 520px ******/
@media only screen and (max-width: 520px) {
.CONTACT p.req {margin: 1% 0% 3% 0%;}

label {width: 99%; margin: 1% 0% 1% 0%; padding: 0% 0% 1% 0%; float: none; display: block; text-align: left;}
input.text60 {width: 80%; float: none;}
input.text30 {width: 35%; float: none;}
textarea.textarea60 {width: 98.5%; padding: .75% 0% .5% 1%; font-size: 90%;}
.spacer {display: none;}
input.buttonSubmit, input.buttonReset {padding: 1% 4% 1.25% 4%;}
input.buttonSubmit {margin: 1% 3% 0% 0%;}
input.buttonReset {margin: 1% 0% 0% 0%;}

br.CONTACT_820 {display: none;}
br.CONTACT_520 {display: block;}
}



/***** TEXT 400px ******/
@media only screen and (max-width: 400px) {
.CONTACT h2 {margin: 0% 0% 2% 0%; font-size: 120%;}
.CONTACT p {margin: 0% 0% 3% 0%; font-size: 85%;}
.CONTACT p.req {font-size: 80%;}

label {font-size: 85%;}
input.text60 {font-size: 85%; width: 98%;}
input.text30 {font-size: 85%; width: 50%;}
select {width: 80%; font-size: 85%;}
textarea.textarea60 {width: 98.5%; padding: .75% 0% .5% 1%; font-size: 85%;}
input.buttonSubmit, input.buttonReset {padding: 1.5% 5% 1.75% 5%;}
input.buttonSubmit {margin: 2% 4% 0% 0%;}
input.buttonReset {margin: 2% 0% 0% 0%;}
}