:root {
	--cellecta-yellow: #fcee4f;
	--cellecta-red: #d23b2b;
	--cellecta-grey: #5b5b5b;
	--cellecta-green: #006600;
	--table-header: #006600;
	--table-even: #f2f2f2;
	--table-caption: #5b5b5b;
	--table-odd: #dcdcdc;
	--table-cell-padding: 10px
}
html, body {
	margin: 0 !important;
	font-family: 'Helvetica', sans-serif !important;
	font-size: 14px !important;
	background: var(--cellecta-grey) !important;
	max-width: 100%;
	overflow-x: hidden;
}
h1, h2, h3 { color: var(--cellecta-red); font-size: 130% !important; text-transform: uppercase; margin: 20px 0 20px 0 !important }
.wrapper { background: #f2f2f2; padding: 0 0 0 50px }
.content { max-width: 1500px; margin: auto; background: white }
/*
HACKS!
These will need changing in the new canvas CSS!!
*/
header .cell:nth-child(1) { padding-left: 60px }
fieldset .calendar { 	margin: 0 !important }
/*
END of hacks +++++++++++++++++++++++++++++++++++
*/
fieldset { padding: 10px; background-color: #f2f2f2; border: 1px solid #b2b2b2; margin-bottom: 10px }
label { display: inline-block; box-sizing: border-box; padding: 0 10px 10px 10px; vertical-align: bottom }
label input[type=text],
label input[type=time],
label textarea,
label select { margin: 5px 0 0 0; width: 100%; box-sizing: border-box }
.form_1 label { width: 100%; padding-left: 0; padding-right: 0 }
.form_2 label { width: calc(100%/2) }
.form_2 label:nth-child(2n+1) { padding-left: 0 }
.form_2 label:nth-child(2n+2) { padding-right: 0 }
.form_3 label { width: calc(100%/3) }
.form_3 label:nth-child(3n+1) { padding-left: 0 }
.form_3 label:nth-child(3n+3) { padding-right: 0 }
.form_4 label { width: calc(100%/4) }
.form_4 label:nth-child(4n+1) { padding-left: 0 }
.form_4 label:nth-child(4n+4) { padding-right: 0 }
.form_5 label { width: calc(100%/5) }
.form_5 label:nth-child(5n+1) { padding-left: 0 }
.form_5 label:nth-child(5n+5) { padding-right: 0 }
.form_6 label { width: calc(100%/6) }
.form_6 label:nth-child(6n+1) { padding-left: 0 }
.form_6 label:nth-child(6n+6) { padding-right: 0 }
// Responsive tables
.responsive_table table, .responsive_table caption, .responsive_table tbody, .responsive_table tfoot, .responsive_table thead, .responsive_table tr, .responsive_table th, .responsive_table td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
	border-collapse: collapse;
}
.responsive_table {
	padding-bottom: 20px !important
}
.responsive_table table {
	width: 100% !important;
	margin: 0;
}
.responsive_table table tfoot tr th,
.responsive_table table thead tr th {
	background: var(--cellecta-grey);
	color: white;
	font-weight: normal;
	text-align: left;
}
.responsive_table table caption {
	padding: var(--table-cell-padding);
	background: var(--table-caption);
	color: white;
	font-weight: normal;
	text-align: left;
	border: none;
	margin-bottom: 1px
}
.responsive_table table th {
	background-color: var(--cellecta-grey);
	color: white;
	font-weight: normal;
	text-align: left
}
.responsive_table table td,
.responsive_table table th {
	border: 1px solid var(--cellecta-grey);
	vertical-align: middle;
	padding: var(--table-cell-padding) !important
}
.responsive_table table tr:nth-child(odd) td {
	background: var(--table-odd)
}
.responsive_table table tr:nth-child(even) td {
	background: var(--table-even)
}
.responsive_table table tr:hover td {
	background: rgba(249, 127, 114, 0.169)
}
.responsive_table {
	overflow-x: auto;
	box-sizing: border-box;
	background-origin: content-box;
	padding: 0
}
/*
Form elements
*/
.button,
.button:visited,
.paging a,
.paging a:visited,
input[type=file],
input[type=text],
input[type=password],
input[type=submit],
input[type=time],
input[type=number],
select,
textarea {
	outline: none;
	appearance: none;
	box-sizing: border-box;
	padding: 10px;
	font-size: inherit;
	font-family: inherit;
	border: 1px solid #b2b2b2;
	-webkit-border-radius: 0;
	border-radius: 0;
	-webkit-box-shadow: none;
	box-shadow: none;
	resize: none;
	background-color: white;
}
textarea {
	height: 100%;
	box-sizing: border-box;
	field-sizing: content;
}
input[type=submit],
.button,
.paging a {
	background: var(--cellecta-red);
	border-color: var(--cellecta-red);
	color: white;
	text-transform: uppercase;
	transition: .25s;
	margin-top: 10px;
}
input[type=submit]:hover,
.button:hover,
.paging a:hover {
	background-color: maroon !important;
	border-color: maroon !important;
	cursor: pointer;
}
.button,
.button:visited {
	background: var(--cellecta-red) !important;
	color: white !important;
	border-color: var(--cellecta-red) !important
}
select {
	background-image: url("data:image/svg+xml;utf8,<svg fill='grey' height='35' viewBox='0 0 24 24' width='35' xmlns='http://www.w3.org/2000/svg'><path d='M7 10l5 5 5-5z'/><path d='M0 0h24v24H0z' fill='none'/></svg>");
	background-repeat: no-repeat;
	background-position-x: 100%;
	background-position-y: -1px;
	margin-right: 2rem;
	padding-right: 2rem;
}
input[type=text]:required,
input[type=password]:required,
select:required,
textarea:required { background-color: rgb(253, 242, 241) !important; }
label input[type=time] { padding: 8px }
.submit_green { background: var(--cellecta-green) !important; border-color: var(--cellecta-green) !important }
.is_nbs td {
	background: #592d5e !important;
	color: white !important
}
.is_nbs a,
.is_nbs a:visited {
	color: yellow;
	text-decoration: none;
}
.target_table tr:nth-child(2) td { background-color: rgb(137, 137, 137) !important }
.target_table tr:nth-child(1) td { background-color: rgb(57, 57, 57) !important }
.top_menu { padding: 20px 0 20px 0 }
.top_menu .button { margin-right: 10px; }
.paging { display: block; padding: 30px 0 10px 0
 }
@media only screen and (max-width: 1024px) {
	label { width: 100% !important; padding-left: 0; padding-right: 0 }
}