@charset "utf-8";
/* CSS Document */
/* Martin  Heaps 1st December 2014 */
html {
	height:100% !important;
	}
body {
	font-size:16px;
	background-color: #F5EBAA;
	height: 100% !important;
}
/******************* HEADER *********************/
header {
	text-align: center;
	width:85%;
	max-width:1000px;
	margin:auto;
	background-color: #fff;
	border:#C00000 2px solid;
	padding:5px;
	}
header h1 {
	display:block;
	text-align: center;
	font-weight: bold;
	font-size: 2em;
	color:#400000;
	font-family:"Rockwell",Geneva, Arial, Helvetica, sans-serif;
	}
header h2{
	display:block;
	text-align: center;
	font-weight: bold;
	font-size: 1.5em;
	color:#800000;
	font-family:"Rockwell",Geneva, Arial, Helvetica, sans-serif;
	}
#reduce {
	/* This overwrites all the header details for non-index page files */
	border:#C00000 1px solid !important;
	padding:0 !important;
	width:70%;
	max-width:700px;
	border-bottom-left-radius: 8px;
	border-bottom-right-radius: 8px;
	/*margin-top:0.5em !important;*/
	border-top-color: #fff !important;
	}
#reduce h1 {
	margin:5px !important;
	font-size:1.5em !important;
	}
#reduce h2 {
	margin:5px !important;
	font-size:1.2em !important;
	padding-bottom:0.5em !important;
	}
/******************** MAIN **********************/
.contents {
	min-height: 100% !important;
	margin-bottom: -100px !important;
}
.contents:after {
	content: "";
	display: block;
	height:100px;
}

main {
	width:85%;
	min-width:360px;
	max-width:1000px;
	margin:auto;
	border:#C00000 1px solid;
	border-radius:8px;
	background-color: #fff;
	padding:3px;
}
main a:hover, main a:focus {
	text-decoration: none;
}
main h3 {
	margin-left:1em;
	color:#800000;
	}
.reduceMain {
	border:transparent 1px solid !important;
	background-color: transparent !important;
	}

main p {
	font-size:0.9em;
	padding:0 1rem !important;
}
main ul {
	width:90%;
	min-width: 300px;
	margin:auto;
}
main ul li {
	padding:0.5em 0;
	font-size:1em;

}
.tickbox input{
	width:1em !important;
}
.tickbox:hover {
	cursor: pointer;
	}

.menuset p {
	margin-left:30%;
	font-size:1em;
}
.menuset a {
	text-decoration: underline;
}
.menuset a:hover, .menuset a:focus {
	text-decoration: none;
}
 .loginRow a{
 	color:#FFE100;
	text-decoration: underline;
 	}
main p a:hover, main p a:focus, .loginRow a:hover, .loginRow a:focus {
	text-decoration: none;
	}
.centerP {
	text-align: center !important;
	}
.noticeBox {
	text-align:center;
	width:85%;
	min-width:260px;
	max-width:460px;
	margin:0.5em auto;
	border:#400000 1px solid;
	background-color:#EEE;
	color:#F00000;
	font-size:1.1em;
	padding:5px;
	}
.blackText {
	color:#000 !important;
	}
.redText {
	color:#C00000 !important;
	font-weight: bold;
	text-decoration: none;
	padding-top:0.75em !important;
}
.greyText {
	color:#333 !important;
}
.bottomLine {
	border-bottom:#C00000 2px solid !important;
}
.nudgeRight {
	padding-left:3em !important;
}
.tag {
	list-style: none;
	padding:0;
	margin:0;
}
.tag li{
	line-height: 1em;
	padding:4px 0px 4px 1em;
	text-indent: -.7em;
}
.tag li:before {
	content: "• ";
	color: #C00000;
}
/***************** NAVIGATION *******************/
nav {
	width:85%;
	min-width:260px;
	max-width:680px;
	margin:3px auto;
	text-align: center;
}
nav a {
	display:inline-block;
	text-decoration:none;
	color:#000;
	font-family:Geneva, Arial, Helvetica, sans-serif;
	padding:3px 5px;
	font-size:0.9em;
	font-weight: bold;
	line-height: 1em !important;
	border: transparent 1px solid;
	margin:3px 4px;
}
nav a:hover, nav a:focus {
	border:#000 1px solid;
	background-color: #fff;
}

.topBorderLine {
	border-top:#C00000 1px solid;
}
.formBaseButtons {
	text-align: center;
	margin:1em auto;
	font-size: 1rem;
	padding-bottom:3px;
	}
.formBaseButtons a, .formBaseButtons input  {
	/* Only input here should be the save button */
	padding:2px 10px;
	border: #8b1407 1px solid;
	color:#000;
	background-color: transparent;
	border-radius: 5px;
	transition: all 0.36s linear;
	text-decoration: none !important;
	margin:5px 0.5em;
	display: inline-block;
}
.formBaseButtons a:focus, .formBaseButtons a:hover, .formBaseButtons input:hover, .formBaseButtons input:focus{
	background-color: #8b1407;
	border:#fff 1px solid;
	color:#ffe100;
}
/***************** LOGIN BOX ********************/

.loginBox {
	width:85%;
	min-width:260px;
	max-width:460px;
	margin:10px auto;
	border:#400000 1px solid;
	}
.loginRow {
	background-color:#fff;
	padding:3px;
	text-align:center;
	}
.loginRow h3{
	color:#993030;
	font-family:Georgia, "Times New Roman", Times, serif;
	font-weight:bold;
	font-size:1.25em;
}
.loginRow input {
	width:200px;
	margin:auto;
	border:#400000 1px solid;
	padding:3px 2px;
	}
.loginRow input:hover, .loginRow input:focus {
	border:#800000 1px solid;
	}
.forgotten {
	font-size:0.8em !important;
}
.submitButton{
	width:50% !important;
	margin:auto;
	background-color:#cdcdcd;
	color:#400000;
	font-weight:bold;
}

.submitButton:hover, .submitButton:focus{
	border:#400000 1px solid !important;
	color:#000;
	background-color:#dcdcdc;
	}

.textContainer {
	display:inline-block;
	width:35%;
	min-width:110px;
	padding-left:5px;
	font-family:Geneva, Arial, Helvetica, sans-serif;
	font-size:0.9em;
	color:#fff;
	text-align:left;
	}
.revisionContainer {
	display:block;
	width:70%;
	min-width:300px;
	padding-left:0.5em;
	font-family:Geneva, Arial, Helvetica, sans-serif;
	font-size:0.9em;
	color:#000;
	text-align:left;
}
/***************** KEY SAFE CODE ******************/
.accTableRow.keySafe {
	padding: 1rem 0;
	line-height: 2;
}

#keycodeText {
	color: #6666FF;
	font-weight: bold;
	letter-spacing: 0.05rem;
	font-size: 1.35rem;
	display: block;
}
.keycodeText {
	color: #6666FF;
	font-weight: bold;
	letter-spacing: 0.05rem;
	font-size: 1.35rem;
}



/***************** PRICE TABLE ******************/
.dataTableHide {
	display:none;
}
@media print {
	.dataTableHide {
		display:none !important;
	}
}
.white {
	color: #fff !important;
	}
.priceTable {
	padding: 2px;
	width:70%;
	min-width:350px;
	max-width:900px;
	margin:auto;
	border-collapse: collapse;
	border-spacing: 1px;
	border: 1px solid transparent;
	font-size: 0.9em;
}
.priceTableNoBorder {
	border:none !important;
	}
.priceTable tr td {
	text-align: center;
	padding:3px 0px;
	}
.priceTable tr td sup {
	font-size: 0.75em;
	}
.priceTable tr th {
	background-color: #8B1407;
	text-align: center;
	font-weight: bold;
	}
.priceTable a {
	text-decoration: none;
}
.priceTable a:hover {
	text-decoration: underline;
}
.heavy {
	font-weight: bold;
	}
.RHSarrow {
	text-align: right;
	margin:0 3em 1em 0;
	font-size: 0.9em;
}
.RHSarrow a{
	color:#0000cc;
	font-weight: bold;
}
.RHSarrow a:hover, .RHSarrow a:focus {
	color:#721006 !important;
	text-decoration: underline;
}
#addYear {
	font-weight: bold;
}
#addYear:hover {
	cursor: pointer;
}
/*************** ACCOUNT  TABLE *****************/
.accTableRow {
	display:block;
	background-color: #d2d2d2;
	color:#993030;
	}
.accTableLeft {
	width:40%;
	min-width:130px;
	max-width:300px;
	display: inline-block;
	box-sizing: content-box;
	text-align: right;
	vertical-align: text-top;
	padding:3px 1px 2px 1px;
	}
.accTableRight {
	vertical-align: text-top;
	display: inline-block;
	padding:2px 3px 2px 3px;
	width:50%;
	}
.accTableRight > label > input {
	width:1em !important;
	}
.accTableRight > input, .accTableRight > textarea {
	min-width:160px;
	width:80%;
	margin:1px 2px;
	padding:1px 2px;
	}
.accTags {
	/* this is the row especially for member Tags
	taking up both columns */
	width:80%;
	margin:auto;
	display: block;
	font-size: 1em;
	min-height: 7em;
	max-height: 14em;
	height:14em;
	line-height: 1em;
	overflow-y: scroll;
	-webkit-overflow-scrolling: touch;
	overflow-x: hidden;

}
.accTags > label {
	display: inline-block;
	padding:1px 1px 2px 1px;
	min-width:45%;
	max-width:300px;
	border: #88F 1px solid;
	margin:2px 1px;
}

.accTags > label > input {
	position: relative;
	vertical-align: middle !important;
}

.accTags > label span {
	display: inline;
	padding:0 0.5em;
}
.accTags > label input:checked + span {
	color:#000;
}
.accTags > label:hover, .accTags input:hover, .accTags span:hover {
	cursor: pointer;
	background-color: #E2E2E2 !important;
}


.shortInputRow {
	width:78%;
	width:calc(80% - 1.1em) !important;
}
.accTableRight >textarea {
	height:7em;
	min-height: 5em;
	max-height: 10em;
	}
.tinyBottomMargin {
	margin-bottom: 0.5em !important;
	}
.mailerBox {
	width:86%;
	min-width:300px;
	max-width:800px;
	margin:auto;
	background-color: #E2E2E2;
	padding:0.25em;
}
.mailerBox .padBox {
	padding:0.25em;
	border-top:#000099 1px solid;

}
.mailerBox .checkboxDiv {
	background-color: #fff;
	margin-left:1em;
	padding-left:0.2em;
}
.mailerBox textarea {
	width:90%;
	margin: 0.2em auto;
	background-color: #fff;
	font-family:Arial, Helvetica, sans-serif;
	font-size:1em;
	padding:0.1em;
	height:12em;
}
.mailerBox .emailFont {
	font-family:Arial, Helvetica, sans-serif;
	font-size:1em;
	margin-left:1.5em;
}
.mailerBox .letter {
	margin-left:1em !important;
}
.letterAddr textarea{
	max-width:11em;
	min-width:11em;
	margin-left: calc(100% - 11em);
	text-align:right;
	display: block;
	height:7em !important;
	min-height: 7em !important;
	max-height: 7em !important;
}
.letterAddr {
	text-align: right;
	margin-right:10%;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 1em;

}
/************** SETTINGS BUTTONS ****************/
#listBox {
	width:80%;
	min-width:280px;
	max-width:500px;
	margin:auto;
	font-size:0.9em;
}
.buttonX {
	float:right;
	position:relative;
	top:+0.4em;
	width:50px;
	border:none;
	background-color: #fff;
	color:#C00;
	font-weight: bold;
	font-size: 1em;
	margin-left:5em;
	transition: all 0.36s linear;
}
.buttonX:focus, .buttonX:hover {
	background-color: #C00;
	color:#fff;
}
.buttonX::after {
	clear:both;
}
.editor {
	background-color: #fff;
	padding:2px;
	margin:2px;
	font-weight:bold;
	border:#000 1px solid;
	width:50%;
	max-width:400px;
	min-width:130px;
}
.editor:focus {
	background-color:#EEE;
}
/*************** SUBMIT BUTTONS *****************/
.addToBasket {
	padding:2px 10px;
	border: #8b1407 1px solid;
	color:#000;
	background-color: transparent;
	margin:0.5em 0 0.5em 60%;
	border-radius: 5px;
	font-weight: bold;
	transition: all 0.36s linear;
	}
.addToBasket:focus, .addToBasket:hover, .submitBasket:hover, .submitBasket:focus {
	background-color: #8b1407;
	border:#fff 1px solid;
	color:#ffe100;
}

/*************** MEMBER CHECKBOXES **************/
.checkboxDiv {
	display: block;
	font-size: 1em;
	min-height: 10.2em;
	max-height: 10.2em;
	height:10.2em;
	line-height: 1em;
	overflow-y: scroll;
	-webkit-overflow-scrolling: touch;
	width:85%;
	overflow-x: hidden;
}
.checkboxRow {
	display: block;
	font-size: 1em;
	line-height: 1em;
	width:85%;
	background-color: #fff;
	margin-left:1em;
	padding:0.2em 0 0.2em 0.2em;
	margin-bottom: 0.5em;
}
.checkboxDiv input, .checkboxRow input{
	position: relative;
	vertical-align: middle !important;
}
.checkboxDiv label, .checkboxRow label {
	display: block;
	padding:1px;
	min-width:100%;
}
.checkboxDiv > label:nth-of-type(even) {
	padding-top: 0.25rem;
	padding-bottom: 0.25rem;
	background-color: #f5f5f5;
}
.checkboxDiv label span , .checkboxRow label span{
	display: inline-block;
	min-width:85% !important;
	padding-left:0.5em;
	max-width: 90%;
}
.checkboxDiv input:checked + span , .checkboxRow input:checked+span {
	background-color:#E2E2E2;
	color:#000;
}
.checkboxDiv label:hover, .checkboxDiv input:hover, .checkboxRow input:hover, .checkboxRow label:hover {
	cursor: pointer;
}
/******************* FOOTER *********************/
footer {
	width:300px;
	margin:auto;
	text-align:center;
	color:#333;
	font-family:Geneva, Arial, Helvetica, sans-serif;
	font-size:0.7em;
	height:100px !important;
}
footer a{
	text-decoration:underline;
	color:#363636;
}
footer a:hover, footer a:focus{
	text-decoration:none;
	color:#DAAC00;
	text-shadow: -1px 0  #363636, 1px 0  #363636, 0 1px #363636, 0 -1px #363636;
}
.credit {
	padding-top:10px;
	}
/************************/
.gapPad {
	margin-top:0.5em !important;
	margin-bottom:0.5em !important;
}
.listofEmails {
	margin-right:20%;
	text-align: right;
}

.memberUnits {
	/***
	 * These are divs of member units on page:
	 * @members/memberPaymentUpdate.php
	 ***/
	display: block;
	border: 2px solid #C00000;
	border-radius: 0.9rem;
	width:92%;
	margin:0 auto 0.7rem;
	padding:0.6rem 0.2rem 0.4rem;
}
.memberUnits > strong, .memberUnitRow > strong {
	display: inline-block;
	padding-bottom:0.5rem;
}
.memberUnits > label > select {
	margin-left:1rem;
}
.memberUnits > label, .memberUnitRow > label {
	display:block;
	width:80%;
	margin:auto;
	padding-bottom:0.2rem;
}
.memberUnits > label > input[Type='text'] {
	min-width:55% !important;
	margin-left:1rem;
}
.memberUnits > label > textarea {
	min-width:55% !important;
	height:5rem;
	margin-left:1rem;
}
.memberUnits > label > .emclass {
	font-style: italic;
	padding-bottom:0.5rem;
	display:block;
}

#jumpFrom {
	margin:auto;
	text-align:left;
}
.choosers {
	display: block;
	width:auto;
	margin:auto;
	text-align: center;
}
.memberUnitRow {
    box-sizing: border-box;
	width: 80%;
    min-width:280px;
	margin:1rem auto;
    padding:0.25rem;
	border: none;
	display: block;
}
.memberUnitRow strong {
    margin-left:15%;
}
.memberUnitRow:nth-of-type(odd) {
	background-color: #dedede;
}
.memberUnitRow label:hover {
    cursor: pointer;
}
@media screen and (max-width: 760px) {
	.checkboxDiv,
	.checkboxRow {
		width: 95%;
	}
	.checkboxRow  > label > input[type=checkbox] {
		vertical-align: top !important;
	}
}