/*--------------------------------------------------*/
/* General Setup                                    */

	* {
		padding: 0;
		margin: 0;
	}

	html {
		background: #EBE9E6;
		color: #484848;
	}

	body {
		font-family: verdana, arial, helvetica, sans-serif;
		font-size: 0.8em;
	}

	article, aside, figcaption, figure, footer,
	header, hgroup, main, nav, section {
		display: block;
	}

	a {
		color: #20287A;
	}

	a img {
		border: 0;
	}

	abbr {
		border: 0;
		text-decoration: none;
	}

	p,
	h1,
	h2,
	h3 {
		margin: 0 0 10px 0;
	}

	h1 {
		font-size: 1.2em;
		font-weight: normal;
		color: #A7A08E;
	}

	h2,
	h3 {
		font-size: 1.05em;
		font-weight: normal;
		color: #484848;
	}

	h2.bold,
	h3.bold {
		font-weight: bold;
	}

	h1.breadCrumbNav {
		font-size: 1.2em;
		font-weight: bold;
		color: #20287A;
	}

	hr.divide {
		border: 0;
		border-top: 1px solid #191D58;
		margin: 2em 0;
	}

	ul,
	ol {
		margin: 0 0 10px 2em;
	}

	table {
		font-size: 1em; /* IE5 WIN: does not inherit the font size correctly */
	}

	table thead {
		display: table-header-group; /* IE6: Wont repeat table headers over multiple printed pages */
	}

	fieldset {
		margin: 0;
		border: 0;
	}

	form input.inline {
		vertical-align: middle;
	}

	input {
		font-size: 1em; /* FF: keep font size consistent, by default it is increased by 0.1em */
	}

	select option {
		padding-right: 5px; /* FF: The star rule above for removing the padding also effects the select option's  */
	}

	select optgroup option {
		padding-left: 20px; /* FF: The star rule above for removing the padding also effects the select opt-groups  */
	}

	@media only screen and (max-width: 990px) {
		input[type=text],
		input[type=search],
		input[type=tel],
		input[type=email],
		input[type=password],
		input[type=number],
		select,
		textarea {
			font-size: 16px !important; /* iOS: Don't auto zoom when selecting a form field */
			max-width: 85%;
		}
	}

/*--------------------------------------------------*/
/* Generic Classes                                  */

	.offScreen {
		position: absolute;
		left: -5000px;
	}

	.warning,
	.warning a,
	.basicForm .error,
	.basicForm .error_list,
	.searchForm .error_list,
	.singleLineForm .error_list,
	.basicForm .row strong.important,
	#approveForm .error_list,
	#pAdminJobsEdit .row[data-urgent="true"] .label {
		color: #D00;
		background: inherit;
		font-weight: bold;
	}

	span.warning {
		font-weight: normal;
	}

	.warning_info .info {
		color: #D00;
		background: inherit;
	}

	strong.notice {
		color: #0000CC;
		background: inherit;
	}

	.noticeBox {
		border: 3px solid #AA0000;
		padding: 20px;
		margin: 0 0 10px 0;
		background: #fff5f5;
	}

	.noticeBox p {
		margin: 0;
	}

/*--------------------------------------------------*/
/* Page Frame                                       */

	/*--------------------------------------------------*/
	/* Server status                                    */

		#pageServerStatus {
			border: 5px solid #F00;
			color: #000;
			background: #FFF;
			padding: 10px;
			text-align: center;
		}

		#pageServerStatus p {
			margin: 0;
		}

	/*--------------------------------------------------*/
	/* Wrapper                                          */

		#pageWrapper {
			width: 990px;
			margin: 0 auto;
			padding: 10px 0 0 0;
			background: #FFF;
			color: #484848;
		}

	/*--------------------------------------------------*/
	/* Page Title                                       */

		#pageTitle {
			width: 960px;
			margin: 0 auto;
		}

	/*--------------------------------------------------*/
	/* Content                                          */

		#pageContent {
			width: 960px;
			margin: 0 auto;
			padding: 10px 0 0 0;
			overflow: auto;
		}

	/*--------------------------------------------------*/
	/* Footer                                           */

		#pageFooter {
			clear: both;
			overflow: auto;
			width: 100%; /* IE5+6 WIN: does not understand the overflow auto to hold floats */
			border-top: 1px dotted #737373;
		}

		#pageFooter h2 {
			position: absolute;
			left: -5000px;
		}

		#pageFooter p {
			float: left;
			padding: 10px 15px;
			margin: 0;
		}

		#pageFooter ul {
			float: right;
			padding: 10px 10px;
			margin: 0;
		}

		#pageFooter ul li {
			list-style: none;
			padding: 0 5px;
			float: left;
			border-right: 1px solid #737373;
		}

		#pageFooter ul li.lastChild {
			border-right: 0;
		}

		#pageFooter span,
		#pageFooter a {
			background: #FFF;
			color: #484848;
			text-decoration: none;
			font-size: 0.8em;
		}

		#pageFooter span a {
			font-size: 1em;
		}

		#pageFooter a:hover,
		#pageFooter a:active,
		#pageFooter a:focus {
			text-decoration: underline;
		}

	/*--------------------------------------------------*/
	/* Responsive                                       */

		@media only screen and (max-width: 990px) {

			body.responsive #pageWrapper,
			body.responsive #pageTitle,
			body.responsive #pageContent {
				width: auto;
			}

			body.responsive #pageTitle img {
				width: 75%;
				height: auto;
				margin: 0 auto 1em;
				display: block;
			}

			body.responsive #pageTitle,
			body.responsive #pageContent {
				padding: 0 10px;
			}

		}

/*--------------------------------------------------*/
/* Basic Form                                       */

	.basicForm {
		margin: 30px auto;
	}

		#pHome .basicForm,
		#pStoreCheckout .basicForm,
		#pStoreAddCard .basicForm,
		#pPayment .basicForm,
		#pLoginOxford .basicForm,
		#pLoginCranfield .basicForm,
		#pLoginInternational .basicForm,
		#pLoginSidney .basicForm,
		#pLoginCatBall .basicForm {
			width: 40em;
		}

		@media only screen and (max-width: 990px) {
			body.responsive#pHome .basicForm,
			body.responsive#pStoreCheckout .basicForm,
			body.responsive#pStoreAddCard .basicForm,
			body.responsive#pPayment .basicForm {
				width: auto;
			}
		}

	.basicForm fieldset {
		padding: 20px 0 10px 0;
	}

		.basicNavChild .basicForm fieldset {
			padding: 0;
			margin: 0 10px;
			width: auto;
		}

		.basicNavChild .basicForm fieldset fieldset {
			padding-bottom: 20px;
			margin: 0;
		}

	.basicForm h2 {
		padding: 0;
		clear: both;
	}

	.basicForm div.row + h2,
	.basicForm div.row_widget + h2 {
		padding-top: 20px;
	}

	.basicForm div.row + hr {
		margin: 3em 0;
	}

	.basicForm h2 + div.row.check {
		margin-top: -10px;
	}

	.basicForm .row {
		padding: 5px 0 0 16.5em;
		clear: both;
		overflow: hidden; /* Was auto, but Safari was showing scroll bars on some input fields, e.g. /admin/extra/archive/edit/?id=150997 */
	}

		.basicNavChild .basicForm .row {
			padding-left: 23.5em;
		}

		@media only screen and (max-width: 990px) {
			.basicForm .row {
				padding-left: 10px;
			}
		}

	.basicForm .row .label,
	.basicForm .row.input_first .input {
		float: left;
		width: 16em;
		margin: 2px 0 0 -16.5em;
		text-align: right;
		display: inline;
	}

		.basicNavChild .basicForm .row .label,
		.basicNavChild .basicForm .row.input_first .input {
			width: 23em;
			margin-left: -23.5em;
		}

		@media only screen and (max-width: 990px) {
			.basicForm .row .label,
			.basicForm .row.input_first .input {
				float: none;
				width: auto;
				margin: 2px 0 0 0;
				text-align: left;
				display: block;
			}
		}

	.basicForm .row.input_first .input {
		margin-top: 0;
	}

	.basicForm .row.input_first .label {
		float: none;
		display: block;
		width: auto;
		margin: 2px 0 0 0;
		text-align: left;
	}

		@media only screen and (max-width: 990px) {
			.basicForm .row .label,
			.basicForm .row.input_first .input {
				float: none;
				width: auto;
				margin: 2px 0 0 0;
				text-align: left;
				display: block;
			}
		}

	.basicForm .row .input,
	.basicForm .row .info,
	.basicForm .row .format {
		float: left;
	}

		@media only screen and (max-width: 990px) {
			.basicForm .row .input,
			.basicForm .row .info,
			.basicForm .row .format {
				float: none;
			}
		}

	.basicForm .row.info .input,
	.basicForm .row.image .input,
	.basicForm .row.radio .input,
	.basicForm .row.radios .input,
	.basicForm .row.select .input,
	.basicForm .row.check .input,
	.basicForm .row.checkboxes .input,
	.basicForm .row .info,
	.basicForm .row .format {
		padding: 2px 0 0 0;
	}

	.basicForm .row.info .input,
	.basicForm .row.radios .input,
	.basicForm .row.checkboxes .input {
		float: none;
		display: block;
	}

		#pAdminOrders .row.radios .input,
		#pAdminJobsEditBreakdown .row.radios .input {
			float: left;
			padding: 2px 1em 0 0;
		}

	.basicForm .row.checkboxes .input .info,
	.basicForm .row.radios .input .info {
		float: none;
		padding: 0;
	}

	.basicForm .row.checkboxes .input.option_disabled label,
	.basicForm .row.radios .input.option_disabled label {
		text-decoration: line-through;
	}

	.basicForm .row.table .input table {
		margin: 0;
	}

	.basicForm .row .info,
	.basicForm .row .format {
		padding: 2px 0 0 5px;
	}

	.basicForm .row.radios .info {
		padding: 5px 0 0 0;
	}

	.basicForm .row .info input.autoFill {
		margin: -3px 0;
	}

	.basicForm .row.input_first.check .input {
		display: inline; /* IE6 Win: double margin bug */
	}

		#pAdminCardsEditImages .basicForm .row.input_first.check .label span.text {
			display: block;
			padding: 0 0 3px 0;
		}

		@media only screen and (max-width: 990px) {
			.basicForm .row.input_first.check .label {
				display: inline;
			}
		}

	.basicForm .row.text .input input,
	.basicForm .row.email .input input,
	.basicForm .row.url .input input,
	.basicForm .row.password .input input,
	.basicForm .row.postcode .input input,
	.basicForm .row.number .input input,
	.basicForm .row.date .input input,
	.basicForm .row.time .input input,
	.basicForm .row.currency .input input,
	.basicForm .row.textarea .input textarea,
	.default_input input,
	#namesForm .client_notes input,
	#pAdminOrdersDispatch .customs_item input,
	#pAdminOrdersDispatch .row.size input,
	#pAdminProductsPostageCosts .textareaForm .input textarea,
	#pAdminProductsPostageSurcharges .textareaForm .input textarea {
		border: 1px solid #000;
		padding: 2px;
		background: #EFF0F5;
	}

		.basicForm .row.textarea .input textarea[disabled] {
			border-color: #C3C4C7;
			background-color: #F7F8FC;
		}

		.basicForm .row.caution .input input {
			background: #e7d7f5;
		}

		.basicForm .row.danger .input input {
			background: #f5d7d7;
		}

	.basicForm .row .help {
		float: left;
		padding: 2px 0 0 5px;
	}

	.basicForm .row .submit input {
		margin-left: 5px;
	}

	.basicForm .row.text input,
	.basicForm .row.email input,
	.basicForm .row.url input,
	.basicForm .row.password input {
		width: 18em;
	}

		.basicForm .row.text input[type="submit"], /* e.g. create order page */
		.basicForm .row.autoWidthInput input {
			width: auto;
		}

	.basicForm .row.textarea textarea {
		width: 30em;
	}

		.basicNavChild .basicForm .row.text input,
		.basicNavChild .basicForm .row.email input,
		.basicNavChild .basicForm .row.url input,
		.basicNavChild .basicForm .row.password input,
		.basicNavChild .basicForm .row.textarea textarea {
			/* width: auto; ... removed for the /admin/client/edit/ page */
		}

	.basicForm .row.long input,
	#namesForm .client_notes input {
		width: 34em; /* Match 60 col textarea, ref client admin in names */
	}

	.basicForm .row.select select {
		max-width: 400px;
	}

	.basicForm .row.js_multiple_file_inputs .input {
		float: none;
	}

	.basicForm .row.js_multiple_file_inputs .input input[type="file"] {
		display: block;
		margin: 0 0 5px 0;
	}

	.basicForm .row.js_multiple_file_inputs .input label {
		position: absolute;
		left: -5000px;
	}

	.basicForm .row.image img {
		border: 1px solid #191D58;
		background: #EFF0F5;
	}

	.basicForm .row.date .input input,
	.basicForm .row.time .input input {
		text-align: center;
	}

		.basicForm .row.date .input input[type="number"]::-webkit-inner-spin-button {
			-webkit-appearance: none;
		}

		.basicForm .row.date .input input[type="number"] {
			-moz-appearance: textfield;
		}

		.basicForm .row.date .input input[type="number"] {
			width: 4em;
		}

		.basicForm .row.date .input input[type="number"][max="31"],
		.basicForm .row.date .input input[type="number"][max="12"] {
			width: 2em;
		}

	.basicForm .row.numberRow .input,
	.basicForm .row.numberRow .input input {
		display: inline-block;
		width: 7em;
		text-align: right;
	}

	.basicForm .row.numberRow .info {
		float: none;
		display: inline;
	}

	.basicForm .row.numberRow.currency .input input {
		width: 95%;
		text-align: right;
	}

	.basicForm .submit {
		padding-top: 10px;
		padding-bottom: 10px;
	}

		.basicForm .row.text .submit {
			padding: 0; /* On the admin order add page, this causes a scroll bar */
		}

		#pAdminAccountsEdit .row.text .input input {
			width: 35em;
		}

	.basicForm .tableForm {
		margin: 20px 0 10px 0;
	}

	.basicForm .tableFormNarrow {
		width: auto;
		margin: 20px 0 10px 23.5em;
	}

	.basicForm .tableForm .field .label,
	.basicForm .tableForm .field.postage .other label {
		position: absolute;
		left: -5000px;
	}

	.basicForm .tableForm .field {
		text-align: center;
	}

	.basicForm .tableForm .field.date {
		text-align: left;
	}

	.basicForm .tableForm .field.date input {
		text-align: center;
	}

	.basicForm .tableForm .field.dateandnote {
		text-align: left;
	}

	.basicForm .tableForm .field.dateandnote .dateinput {
		padding-bottom: 4px;
	}

	.basicForm .tableForm .field .input.radio {
		display: block;
	}

	.basicForm .tableForm .field input[max="9999"] {
		width: 4em;
	}

	.basicForm .tableForm .field .dateinput input {
		text-align: center;
	}

	.basicForm .tableForm .field.weight input,
	.basicForm .tableForm .field.price input {
		text-align: right;
	}

	.basicForm .tableForm .field.customs {
		text-align: left;
	}

	.basicForm .tableForm .field.customs fieldset {
		padding: 0 0 0 0.5em;
	}

	.basicForm .tableForm .field.customs fieldset + fieldset {
		margin-top: 0.5em;
	}

	.basicForm .tableForm .field.customs fieldset legend {
		margin-left: -0.5em;
	}

	.basicForm .tableForm .field.postage {
		text-align: left;
	}

	.basicForm .tableForm .field.postage .input {
		padding-bottom: 2px;
	}

	.basicForm .tableForm .field.postage .other {
		display: block;
		padding: 4px 0 2px 1.5em;
	}

	.basicForm .tableForm .field.delete,
	.basicForm .tableForm .field.add {
		width: auto;
	}

	.basicForm .submit.right,
	.basicForm .tableForm.fullWidth + .submit {
		margin-top: 0;
		text-align: right;
	}

	.basicForm .submit + .basicTable,
	.basicForm .row + .basicTable {
		margin-top: 2em;
	}

	.basicForm .tableForm + .submit,
	.basicForm .submit.left {
		padding-left: 0;
		text-align: left;
	}

/*--------------------------------------------------*/
/* Single line form                                 */

	.singleLineForm {
		margin: 30px auto;
	}

	.singleLineForm.withCheckbox .row {
		padding-bottom: 1em;
	}

/*--------------------------------------------------*/
/* Order table                                      */

	.orderTable {
		margin: 0 0 10px 0;
		border: 0;
		border-top: 1px solid #BBBBD5;
		border-left: 1px solid #BBBBD5;
		background: #EDEDED;
	}

	.orderTable.wideTable {
		width: 100%;
	}

	.orderTable th {
		color: #20287A;
		font-size: 0.9em;
	}

	.orderTable th,
	.orderTable td {
		border: 0;
		padding: 5px;
		border-right: 1px solid #BBBBD5;
		border-bottom: 1px solid #BBBBD5;
		text-align: center;
	}

	.orderTable td.quantity a {
		display: block;
	}

/*--------------------------------------------------*/
/* Order review                                     */

	.orderReview {
		border: 0;
		margin: 0 0 10px 0;
	}

	.orderReview td {
		padding: 2px 15px 2px 0;
		border: 0;
	}

	.orderReview td.tallyValue {
		text-align: right;
	}

/*--------------------------------------------------*/
/* Account login                                    */

	.accountLogin {
		border: 1px solid #191D58;
		padding: 2px;
		background: #EFF0F5;
		margin: 3em auto -1em auto;
		width: 51em;
		padding: 1em;
		text-align: center;
	}

		@media only screen and (max-width: 990px) {
			body.responsive .accountLogin {
				width: auto;
			}
		}

/*--------------------------------------------------*/
/* Small nav                                        */

	p.pagination,
	.smallNav {
		float: right;
		margin: 0 0 10px 0;
		list-style: none;
	}

		#galleryPageLinks p.pagination,
		#galleryPageLinks .smallNav {
			float: none;
		}

	p.pagination li,
	.smallNav li {
		display: inline;
	}

/*--------------------------------------------------*/
/* Important Message                                */

	div.importantMessage,
	p.importantMessage {
		border: 2px solid #F00;
		margin: 1em 0 2em 0;
		padding: 5px;
	}

	#pageContent div.importantMessage p {
		margin: 0;
		padding: 0 0 5px 0;
	}

	#pageContent div.importantMessage p.mainBody {
		padding: 10px 0 15px 20px;
	}

	#pageContent div.importantMessage p:last-child {
		padding-bottom: 0;
	}

	p.importantMessage strong {
		display: block;
		margin: 0 0 5px 0;
	}

	p.importantMessage a {
		font-weight: bold;
	}

/*--------------------------------------------------*/
/* Preview                                          */

	#pStorePreview #preview {
		padding: 20px 0;
		text-align: center;
	}

	#pStorePreview #preview .inlineButtons span {
		padding: 0 1em;
	}

	@media only screen and (max-width: 990px) {

		#pStorePreview #preview .inlineButtons.single {
			font-size: 1.3em;
		}

		#pStorePreview #preview .inlineButtons.double {
			font-size: 0.9em;
		}

		#pStorePreview #preview .inlineButtons span {
			padding: 0;
		}

		#pStorePreview #preview #image-inline img {
			width: 100%;
		}

		#pStorePreview #preview #image-zoom-wrapper {
			margin-left: 0;
			margin-right: 0;
		}

	}

/*--------------------------------------------------*/
/* Checkout                                         */

	#pStoreCheckout #mainOrderSelect form {
		margin: 0 0 2em 0;
	}

	@media only screen and (max-width: 990px) {
		#pStoreCheckout .row.optIn {
			padding-top: 1.5em;
			padding-bottom: 1em;
		}
	}

	#pStoreCheckout h2 {
		font-weight: bold;
	}

	#pStoreCheckout div.next {
		padding-top: 1em;
		text-align: right;
	}

	#pStoreCheckoutSorry .contact p {
		margin-top: 2em;
	}

	#pStoreCheckoutSorry .contact ul {
		list-style: none;
		margin: 0 0 3em 1em;
	}

	#pStoreCheckoutSorry .contact ul li {
		margin-top: 1em;
	}

/*--------------------------------------------------*/
/* Client messages                                  */

	#pMessage .row.textarea textarea {
		width: 50em;
		height: 40ex;
	}

	#pMessage .row.info + .row.response,
	#pMessage .row.info + .row.files,
	#pMessage .row.info + .row.confirm {
		margin-top: 2em;
	}

	@media only screen and (max-width: 990px) {

		#pMessage .basicForm {
			margin: 0;
		}

		#pMessage .row {
			margin: 0 0 1.5em 0;
			padding: 0;
		}

		#pMessage .row span.label {
			display: block;
			margin: 0 0 0.5em 0;
		}

		#pMessage .row.message span.label {
			display: none;
		}

		#pMessage .row.textarea span {
			display: block;
		}

		#pMessage .row.textarea span textarea {
			width: 100%;
			height: 30ex;
		}

	}
