form {
	margin : 1em 0;
}

div.form-row-narrow {
	display : none;
}

div.form-indent {
	margin-left : 10%;
}

div.form-indent p {
	margin-top    : 3%;
	margin-bottom : 2%;
}

.required {
	color       : #CC0000;
	font-weight : bold;
}

/*
 * =============================================================================
 * BUTTONS AND BUTTON LINKS
 * =============================================================================
 */
button {
	font-family   : robotolight, Verdana, Helvetica, sans serif;
	font-weight   : normal !important;
	font-size     : 110%;
	color         : white;
	padding       : 0.5em;
	border        : none;
	margin        : 1em 0;
	background    : #007AAE;
	transition    : background-color 0.5s ease;
	border-radius : 5px;
}

a.button {
	border          : none;
	color           : white;
	display         : inline-block;
	text-decoration : none !important;
	text-shadow     : none !important;
	transition      : background-color 0.5s ease;
	padding         : 0.4em 0.5em;
	font-weight     : normal;
	font-size       : 110%;
	clear           : none;
	margin-top      : 0.75em;
	border-radius   : 5px;
	background      : #007AAE !important;
}

button:hover,
a.button:hover {
	background : #00A4E8 !important;
	color      : white !important;
}

button:focus,
a.button:focus {
	outline : none;
}

ul#nav-menu li a.button.member {
	padding : 2px;
}

button.tableToggle,
button#tableHideButton {
	margin    : 0;
	font-size : 100%;
}

button.tableToggle {
	width         : 100%;
	margin-bottom : 1em;
	font-size     : 150%;
}

@media only screen and (max-width : 750px) {
	button, a.button {
		margin-left : 1em;
	}
}

/*
 * ============================================================================
 * SITE-WIDE
 * ============================================================================
 */
select {
	font-size     : 90%;
	font-weight   : normal;
	padding       : 3px;
	font-family   : robotolight, Verdana, Helvetica, sans serif;
	border        : 1px solid #CCCCCC;
	width         : 51.8%;
	margin-bottom : 2%;
}

textarea {
	font-size     : 110%;
	font-weight   : normal;
	padding       : 5px;
	font-family   : robotolight, Verdana, Helvetica, sans serif;
	margin-bottom : 2%;
	width         : 50%;
	overflow      : auto;
	resize        : none;
}

textarea.tall {
	height : 6em;
}

ul.links input[type=checkbox] {
	display       : block;
	margin-top    : 0.5em;
	margin-right  : 1em;
	margin-bottom : 0.5em;
	float         : left;
}

ul.links label,
ul.links input[type=checkbox]:hover {
	cursor : pointer;
}

ul.links label {
	display     : block;
	margin-left : 1.5em;
}

/*
 * ============================================================================
 * SPECIFIC FORMS
 * ============================================================================
 */

form.enquiry label {
	display        : inline-block;
	width          : 20%;
	text-align     : right;
	vertical-align : top;
	padding-right  : 2%;
}

form.enquiry input {
	width         : 50%;
	padding       : 5px;
	font-size     : 90%;
	margin-bottom : 2%;
	border        : 1px solid #CCCCCC;
}

form.enquiry textarea {
	width   : 50%;
	padding : 5px;
	border  : 1px solid #CCCCCC;
}

@media only screen and (max-width : 750px) {
	form.enquiry label {
		width : 25%;
	}

	form.enquiry input {
		width : 60%;
	}

	form.enquiry textarea {
		width : 60%;
	}

	form.enquiry select {
		width : 62%;
	}

}

@media only screen and (max-width : 520px) {
	form.enquiry label {
		width       : 88%;
		text-align  : left;
		margin-left : 1em;
	}

	form.enquiry input {
		width       : 88%;
		margin-left : 1em;
	}

	form.enquiry textarea {
		width       : 88%;
		margin-left : 0.9em;
	}

	form.enquiry select {
		width       : 90%;
		margin-left : 1em;
	}
}

@media (-webkit-min-device-pixel-ratio : 1.25), (min-resolution : 120dpi) {
	select {
		-webkit-appearance : menulist-text;
		margin-left        : 1em;
	}
}

button#searchswitch {
	display        : none;
	width          : 30px;
	height         : 30px;
	border         : none;
	text-indent    : -9999px;
	vertical-align : top;
	margin         : 29px 0 0 2em;
	background     : url(../images/search_icon.png) center center no-repeat;
}

button#searchswitch:hover {
	cursor     : pointer;
	background : url(../images/search_icon.png) center center no-repeat !important;
}

form#site-search {
	background     : white;
	overflow       : auto;
	display        : inline-block;
	vertical-align : top;
	margin         : 29px 0 0 1.5em;
	padding        : 0;
}

div#searchwrapper {
	display     : inline-block;
	border      : 1px solid #888888;
	padding     : 0;
	line-height : 0.5;
}

form#site-search button {
	display       : inline-block;
	border        : none;
	border-radius : 0;
	width         : 27px;
	height        : 27px;
	background    : url(/images/search_icon.png) center center no-repeat white !important;
	text-indent   : -9999px;
	margin        : 0;
}

form#site-search button:hover {
	background : url(/images/search_icon.png) center center no-repeat white !important;
	cursor     : pointer;
}

form#site-search input {
	display   : block;
	float     : left;
	width     : 220px;
	/*width     : 340px;*/
	padding   : 5px 6px 2px;
	font-size : 90%;
	border    : none;
}

/* Do not group these rules for placeholders, it will break them. */
form#site-search input::-webkit-input-placeholder {
	color : #888888;
}

form#site-search input:-moz-placeholder {
	/* FF 4-18 */
	color : #888888;
}

form#site-search input::-moz-placeholder {
	/* FF 19+ */
	color   : #888888;
	opacity : 1;
}

form#site-search input:-ms-input-placeholder {
	/* IE 10+ */
	color   : #888888;
	opacity : 1;
}

form#site-search button#searchbutton {
	float : right;
}

/* GENERIC SUB-SITE SEARCH */
form.subsite-search {
	background : white;
	display    : block;
	margin     : 15px 0 20px;
	padding    : 0;
	text-align : center;
}

form.subsite-search.spotlight {
	margin-bottom : 0;
}

@media only screen and (max-width : 800px) {
	form.subsite-search.spotlight {
		margin-bottom : 1em;
	}
}

form.subsite-search select {
	display        : inline-block;
	margin         : 0;
	vertical-align : top;
}

form.subsite-search div.searchwrapper {
	display     : inline-block;
	border      : 1px solid #CCCCCC;
	padding     : 0;
	line-height : 0.5;
}

form.subsite-search button {
	display     : inline-block;
	border      : none;
	width       : 27px;
	height      : 27px;
	background  : url(../images/search_icon.png) center center no-repeat;
	text-indent : -9999px;
	margin      : 0;
}

form.subsite-search button:hover {
	background : url(../images/search_icon.png) center center no-repeat !important;
	cursor     : pointer;
}

form.subsite-search input {
	display   : block;
	float     : left;
	width     : 300px;
	padding   : 5px 6px 2px;
	font-size : 90%;
	border    : none;
}

span.form-join-text {
	display        : inline-block;
	margin         : 0 0.75em 0;
	vertical-align : top;
	font-size      : 120%;
}

/*############################################################################*/

form#nav-login {
	width       : 30%;
	padding     : 1em 0 0 1em;
	border-left : 1px solid #E2E3DF;
	float       : right;
	margin      : 0 0 0 1em;
}

form#nav-login h3 {
	text-align  : left;
	color       : #00A4E8;
	font-weight : bold;
	margin      : 0 0 0.6em 0;
}

form#nav-login label {
	display   : block;
	/*width     : 25%;*/
	margin    : 0 0 0.25em 0;
	font-size : 90%;
}

form#nav-login input {
	display : inline-block;
	padding : 3px;
	margin  : 0 0 0.75em 0;
	width   : 92.5%;
	border  : 1px solid #A1A2A2;
}

form#nav-login button {
	float  : right;
	margin : 0 1em 1em 0
}

form#nav-login a.button:hover,
form#nav-login button:hover {
	background : #00A4E8;
}

@media (-webkit-min-device-pixel-ratio : 1.25), (min-resolution : 120dpi) {
	form#nav-login input {
		padding   : 5px;
		height    : 25px;
		font-size : 100%;
	}
}

/*############################################################################*/

form#nav-enquiry {
	width       : 50%;
	padding     : 1em 0 0 1em;
	border-left : 1px solid #E2E3DF;
	float       : right;
	margin      : 0 0 0 1em;
}

form#nav-enquiry h3 {
	text-align  : left;
	color       : #00A4E8;
	font-weight : bold;
	margin      : 0 0 0.6em 0;
}

form#nav-enquiry label {
	display        : block;
	margin         : 0 0 0.25em 0;
	font-size      : 90%;
	vertical-align : top;
}

form#nav-enquiry input {
	display : inline-block;
	padding : 3px;
	margin  : 0 0 1em 0;
	width   : 95.5%;
	border  : 1px solid #A1A2A2;
	/*float:right;*/
}

form#nav-enquiry button {
	float  : right;
	margin : 0 1em 1em 0
}

form#nav-enquiry a.button:hover,
form#nav-enquiry button:hover {
	background : #00A4E8;
}

form#nav-enquiry textarea {
	width  : 94.75%;
	height : 100px;
	margin : 0 0 1em 0;
	border : 1px solid #A1A2A2;
}

form#testing-text textarea {
	width  : 98.5%;
	height : 100px;
	margin : 0;
}

/*############################################################################*/

form#article-lock {
	display    : block;
	width      : 50%;
	padding    : 1em 0 0 1em;
	margin     : 0 auto;
	text-align : center;
}

form#article-lock label {
	display    : block;
	margin     : 0 0 0.25em 0;
	font-size  : 90%;
	text-align : left;
}

form#article-lock input {
	display : block;
	padding : 3px;
	margin  : 0;
	width   : 100%;
	border  : 1px solid #A1A2A2;
}

form#article-lock button {
	margin : 0;
}

form#article-lock a.button:hover,
form#article-lock button:hover {
	background : #00A4E8;
}

/*############################################################################*/

form.enquiry p.checkbox-note {
	font-size   : 80%;
	margin-left : 23%;
	width       : 50%;
}

form.enquiry input.enquiry-checkbox {
	width       : 2%;
	margin-left : 23%;
}

form.enquiry label.enquiry-checkbox {
	display       : inline;
	font-size     : 80%;
	padding-right : 2%;
	text-align    : left !important;
}

form.enquiry label.enquiry-checkbox.highlight {
	font-size    : 100%;
	padding-left : 0.5em;
}

@media only screen and (max-width : 750px) {
	form.enquiry p.checkbox-note {
		width : 60%;
	}

	form.enquiry input.enquiry-checkbox,
	form.enquiry p.checkbox-note {
		margin-left : 27%;
	}
}

@media only screen and (max-width : 520px) {
	form.enquiry p.checkbox-note {
		width : 92%;
	}

	form.enquiry input.enquiry-checkbox,
	form.enquiry p.checkbox-note {
		margin-left : 1em;
	}

	form.enquiry label.enquiry-checkbox {
		margin-left : 0.5em;
	}
}

@media (-webkit-min-device-pixel-ratio : 1.25), (min-resolution : 120dpi) {

	input[type=checkbox] {
		/* All browsers except webkit*/
		transform         : scale(2);
		/* Webkit browsers*/
		-webkit-transform : scale(2);
	}

	form.enquiry p.checkbox-note, form.enquiry label.enquiry-checkbox {
		font-size : 100%;
	}
}

form.enquiry input.tc-confirm {
	width         : 2%;
	margin-left   : 5%;
	margin-bottom : 5%;
}

form.enquiry label.tc-confirm {
	display       : inline;
	font-size     : 100%;
	padding-right : 2%;
	margin-bottom : 5%;
	text-align    : left !important;
}

form.enquiry p.label {
	margin-left   : 22%;
	margin-bottom : 0.5em;
	width         : 50%;
}

@media (-webkit-min-device-pixel-ratio : 1.25), (min-resolution : 120dpi) {
	form.enquiry p.label {
		margin-left : 1em;
		width       : 80%;
	}
}

@media only screen and (max-width : 750px) {
	form.enquiry p.label {
		margin-left : 27%;
	}
}

@media only screen and (max-width : 520px) {
	form.enquiry p.label {
		margin-left : 1em;
	}
}

span.admin-checkbox {
	display : block;
	clear   : left;
}

span.admin-checkbox input {
	margin-left : 23%;
	width       : 2%;
}

span.admin-checkbox label {
	text-align : left;
	width      : 50%;
}

div#tipDiv {
	background-color : #FBF4B5;
	border           : 1px solid #CCCCCC;
	box-shadow       : 5px 5px 10px #AAAAAA;
	color            : black;
	font-size        : 11px;
	line-height      : 1.6;
	padding          : 8px;
	width            : 250px;
}

div.form-row img.tooltip {
	margin         : -3px 0 0 1em;
	vertical-align : middle;
}

/*
 * Spinner hacks:
 * Remove the ugly spinners when using type="number" in desktop browsers.
 */
form.enquiry input[type=number] {
	-moz-appearance : textfield;
}

form.enquiry input::-webkit-outer-spin-button,
form.enquiry input::-webkit-inner-spin-button {
	-webkit-appearance : none;
	margin             : 0;
}

/*
 * End spinner hacks.
 */

/* =============================================================================
 *  * GFD form
 *   */

div.form-row-checkbox {
	text-align    : left;
	margin-bottom : 1em;
}

div.form-row-checkbox p {
	margin-left   : 22%;
	margin-bottom : 0;
}

div.form-row-checkbox input {
	width        : auto;
	margin-left  : 22%;
	margin-right : 2%;
	display      : inline-block;
}

div.form-row-checkbox label {
	font-size  : 90%;
	text-align : left;
	display    : inline-block;
	width      : 45%;

}

@media only screen and (max-width : 750px) {

	div.form-row-checkbox input {
		width        : 2em !important;
		margin-left  : 1em !important;
		margin-right : 1em !important;
	}

	div.form-row-checkbox label {
		margin-left : 0 !important;
		width       : 75% !important;
	}

	div.form-row-checkbox p {
		margin-left : 1em !important;
		width       : 75% !important;
	}
}


/* =============================================================================
 *  * Customer survey form
 *   */
p.survey-question {
	font-weight   : bold;
	margin-bottom : 1em;
}

span.admin-checkbox.survey {
	margin-bottom : 2em;
}

span.admin-checkbox input.survey-inline {
	width : 35%;
}

/* =============================================================================
 *  * Test Method "Add to cart" form (single button)
 *   */
form.cart-button {
	display      : inline-block;
	margin-right : 10px;
}

