/*
Theme Name: BDP Solutions Maintain 2.3.317.4
PHP, HTML, & CSS © Wild Thunder
Author: Wild Thunder
Version: 2025.07.2.3.317.4
Date: 21.07.25
Changelog: Added 'image/jpeg' fix from 2.3.348.
*/

@charset "UTF-8";

/* ================================================================= */
/* ------------------ */
/* TABLE OF CONTENTS: */
/* ------------------ */
/*
## RESET
## WP ADMIN BAR
## CORE
## BASE & TYPOGRAPHY
## PAGE PARTS
	# Header
	# Footer
	# Custom Buttons & Inputs
## PAGE SPECIFIC
	# Login Page
	# Front Page
	# Submissions Pages
	# Job & Edit Pages
	# Form Pages
*/
/* ================================================================= */

/* ================================================================= */
/* ## RESET */
/* ================================================================= */

html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline}body{line-height:1}button{outline:0}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}q{display:inline;font-style:italic}q:before{content:'"';font-style:normal}q:after{content:'"';font-style:normal}textarea,input[type="text"],input[type="button"],input[type="submit"],input[type="reset"],input[type="search"],input[type="password"]{-webkit-appearance:none;appearance:none;border-radius:0}table{border-collapse:collapse;border-spacing:0}th,td{padding:2px}big{font-size:120%}small,sup,sub{font-size:80%}sup{vertical-align:super}sub{vertical-align:sub}dd{margin-left:20px}kbd,tt{font-family:courier;font-size:12px}ins{text-decoration:underline}del,strike,s{text-decoration:line-through}dt{font-weight:bold}address,cite,var{font-style:italic}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
.sticky{}.bypostauthor{}.wp-caption{}.wp-caption-text{}.gallery-caption{}.alignright{}.alignleft{}.aligncenter{}.screen-reader-text{clip:rect(1px, 1px, 1px, 1px);position:absolute !important}

/* ================================================================= */
/* ## WP ADMIN BAR */
/* ================================================================= */

@media screen and (max-width: 782px) 
{
	#wpadminbar * {
		line-height: 0;
	}

    #wpadminbar li#wp-admin-bar-users {
        display: block;
		position: static;
    }
}

#wpadminbar #wp-admin-bar-users .ab-icon::before {
    content: "\f307";
	top: 1px;
}

#wpadminbar .quicklinks .menupop ul li .ab-item, 
#wpadminbar .quicklinks .menupop ul li a strong, 
#wpadminbar .quicklinks .menupop.hover ul li .ab-item, 
#wpadminbar .shortlink-input, 
#wpadminbar.nojs .quicklinks .menupop:hover ul li .ab-item {
	min-width: 60px;
}

#wpadminbar #wp-admin-bar-user-actions.ab-submenu,
#wpadminbar #wp-admin-bar-site-name-default.ab-submenu,
#wpadminbar #wp-admin-bar-users-default.ab-submenu {
	padding: 6px 0;
}

#wpadminbar #wp-admin-bar-user-actions > li {
	margin: 0;
}

/* ================================================================= */
/* ## CORE */
/* ================================================================= */

/*
* Prefixed by https://autoprefixer.github.io
* PostCSS: v7.0.29,
* Autoprefixer: v9.7.6
* Browsers: last 4 version
*/

* {
	-webkit-box-sizing: border-box;
	        box-sizing: border-box;
}

*,*:focus,*:hover{
	outline: none;
}

body {
	background-color: var(--bgCol);
}

#wrapper {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	position: relative;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	    -ms-flex-direction: column;
	        flex-direction: column;
	width: 100%;
	height: auto;
	min-height: calc( 100vh - var(--admin-height) );
	margin: auto;
	background-color: var(--bgCol);
}

#container {
	-webkit-box-flex: 1;
	    -ms-flex: 1 0 auto;
	        flex: 1 0 auto;
	padding: var(--globalMargin);
}

#container.formsContainer {
	padding-top: var(--globalMargin);
	padding-bottom: var(--globalMargin);
	padding-left: var(--formsMargin);
	padding-right: var(--formsMargin);
}

#container.inprogress {
	background-color: #FFF5F5;
}

#container.submitted {
	background-color: none;
}

#container.reviewed {
	background-color: #FFFBF1;
}

#container.finished {
	background-color: #F6FFF5;
}

#container.rejected {
	border: 10px dashed var(--bdpCol);
}

#container-front {
	-webkit-box-flex: 1;
	    -ms-flex: 1 0 auto;
	        flex: 1 0 auto;
	margin: 0;
}

.post-edit-link {
	display: none !important;
}

@media screen and (min-width: 1060px) 
{
	#content {
		width: var(--contentWidth);
		margin: 0 auto;
	}
}

/* ================================================================= */
/* ## BASE & TYPOGRAPHY */
/* ================================================================= */

html,
body,
h1,
h2,
h3,
h4,
h5,
h6,
p,
figcaption,
li,
a,
table,
tr,
td,
tbody,
form,
select,
option,
textarea,
input,
button,
label,
th,
td {
	font-family: var(--font);
	font-size: var(--body);
}

header h1 {
	width: 100%;
	text-align: center;
	display: block;
	font-size: var(--head) !important;
	font-weight: var(--blk) !important;
	margin-bottom: .5em;
}

@media screen and (max-width: 1024px) 
{
	header h1 span {
		display: block;
	}
}

h2  {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	width: 100%;
	height: var(--buttonHeight);
	color: var(--txtColAlt);
	background: var(--bdpGrad);
	font-size: var(--sub) !important;
	font-weight: var(--bld) !important;
	text-align: center;
}

p {
	margin-top: 1em;
}

form {
	height: 100%;
}

input,
select,
textarea {
	color: var(--inputColor);
	background: var(--inputBG);
	border: var(--inputBorder);
	border-radius: var(--inputRadius);
	-webkit-box-shadow: var(--inputBoxShadow);
	        box-shadow: var(--inputBoxShadow);
	width: var(--inputWidth);
	-webkit-transition: var(--inputTransition);
	-o-transition: var(--inputTransition);
	transition: var(--inputTransition);
	padding: var(--inputPadding);
	font-size: var(--inputTxt);
}

input[type="text"]:focus,
textarea:focus {
	border: var(--inputBorderFOCUS);
	-webkit-box-shadow: var(--inputBoxShadowFOCUS);
	        box-shadow: var(--inputBoxShadowFOCUS);
	background: var(--inputBGFOCUS);
}

/* Modified select display for Job/Edit page. */
.editTableValue select {
	/*https://codepen.io/vkjgr/pen/VYMeXp*/
	background-image: -o-linear-gradient(45deg, transparent 50%, var(--inputBorderCol) 50%), -o-linear-gradient(315deg, var(--inputBorderCol) 50%, transparent 50%), -o-linear-gradient(left, var(--inputBorderCol), var(--inputBorderCol));
	background-image: linear-gradient(45deg, transparent 50%, var(--inputBorderCol) 50%), linear-gradient(135deg, var(--inputBorderCol) 50%, transparent 50%), linear-gradient(to right, var(--inputBorderCol), var(--inputBorderCol));
	background-position: calc(100% - 22px) 22px, calc(100% - 17px) 22px, calc(100% - 2.5em) 10px;
	background-size: 5px 5px, 5px 5px, 1px 1.5em;
	background-repeat: no-repeat;
	-webkit-appearance: none;
	   -moz-appearance: none;
	        appearance: none;
	-webkit-transition: none;
	-o-transition: none;
	transition: none;
}

/* Modified select display for Submissions page. */
.dataTables_length select {
	/*https://codepen.io/vkjgr/pen/VYMeXp*/
	background-image: -o-linear-gradient(45deg, transparent 50%, var(--inputBorderCol) 50%), -o-linear-gradient(315deg, var(--inputBorderCol) 50%, transparent 50%);
	background-image: linear-gradient(45deg, transparent 50%, var(--inputBorderCol) 50%), linear-gradient(135deg, var(--inputBorderCol) 50%, transparent 50%);
	background-position: calc(100% - 15px) 22px, calc(100% - 10px) 22px;
	background-size: 5px 5px, 5px 5px, 1px 1.5em;
	background-repeat: no-repeat;
	-webkit-appearance: none;
	   -moz-appearance: none;
	        appearance: none;
	-webkit-transition: none;
	-o-transition: none;
	transition: none;
	width: 4em;
}

div#status,
#submissionsSubheading {
	text-align: center;
	font-size: var(--large);
	font-weight: bold;
	margin-bottom: 1em;
}

div#status.statusAdmin {
	color: var(--bdpCol);
}

div#status.statusEngineer {
	color: var(--reviewed);
}

div#status.statusReviewed {
	color: var(--reviewed);
}

div#status.statusFinished {
	color: var(--finished);
}

div#status.statusInprogress {
	color: var(--inprogress);
}

/* ================================================================= */
/* ## PAGE PARTS */
/* ================================================================= */

/* ------------------------------------------------ */
/* # Header */
/* ------------------------------------------------ */

header#header {
	padding: var(--globalMargin);
	background-color: var(--bdpCol);
	background: var(--bdpGrad);
}

#headerInner {
	position: relative;
	height: 90px;
	width: 100%;
	margin: 0 auto;
}

#header.loggedOut #headerInner {
	height: 150px;
	text-align: center;
	padding-top: 1em;
	padding-bottom: 1em;
}

#logoWrapper,
#bdpLogoWrapper {
	height: 100%;
}

#bdpLogo {
	height: 100%;
	width: auto;
}

@media screen and (min-width: 1025px) 
{
	#headerInner {
		height: 120px;
		width: var(--contentWidth);
	}

	#header.loggedOut #headerInner {
		height: 200px;
		padding: 0;
	}
}

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

footer#footer {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
	-ms-flex-negative: 0;
	    flex-shrink: 0;
	width: 100%;
	height: 90px;
	background-color: var(--bdpCol);
	background: var(--bdpGrad);
	color: var(--txtColAlt);
}

#footerInner {
	display: grid;
	grid-template-columns: auto;
	grid-template-rows: auto;
	gap: 1em;
}

#footer.loggedOut #footerInner {
	grid-template-columns: auto;
}

#copyright {
	text-align: center;
}

#footer.loggedOut #copyright {
	text-align: center;
}

#currentUser {
	text-align: center;
}

@media screen and (min-width: 1060px) 
{
	#footerInner {
		width: var(--contentWidth);
		grid-template-columns: auto auto;
		gap: 0;
	}

	#copyright {
		text-align: left;
	}

	#currentUser {
		text-align: right;
	}
}

/* ------------------------------------------------ */
/* # Custom Buttons & Inputs */
/* ------------------------------------------------ */

.input1 {
	color: var(--inputColor);
	background: var(--inputBG);
	border: var(--inputBorder);
	border-radius: var(--inputRadius);
	-webkit-box-shadow: var(--inputBoxShadow);
	        box-shadow: var(--inputBoxShadow);
	height: var(--inputHeight);
	width: var(--inputWidth);
	-webkit-transition: var(--inputTransition);
	-o-transition: var(--inputTransition);
	transition: var(--inputTransition);
	padding: var(--inputPadding);
	font-size: var(--inputTxt);
}

.input2 {
	color: var(--inputColor);
	background: transparent;
	border: 0;
	border-radius: var(--inputRadius);
	-webkit-box-shadow: var(--inputBoxShadow);
	        box-shadow: var(--inputBoxShadow);
	height: 100%;
	width: var(--inputWidth);
	-webkit-transition: var(--inputTransition);
	-o-transition: var(--inputTransition);
	transition: var(--inputTransition);
	padding: var(--inputPadding);
	font-size: 35vw;
	font-weight: bold;
	text-align: center;
}

.input2:focus {
	outline: none;
	border: 0;
	-webkit-box-shadow: none;
	        box-shadow: none;
	background: transparent;
}

.buttonWrapper {
	text-align: center;
	margin-bottom: 1em;
	height: var(--buttonHeight);
}

#submissionsWrapper .buttonWrapper {
	height: auto;
}

/* 19.03.23 */
#submissionsWrapper .buttonWrapper .button1-0 {
	display: flex;
	flex-direction: column;
	gap: 1em;
	align-items: center;
}

#submissionsWrapper .buttonWrapper .button1-0 a {
	width: 100%;
	max-width: 300px;
}

.submissionsNotice {
	text-align: center;
	margin-bottom: 1em;
}

#jobButtonWrapper.hidden {
	display: none;
}

#editButtonWrapper.buttonWrapper {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--inputGap);
	text-align: left;
}

#editButtonWrapper .updateButtonWrap .button1 {
	background: var(--finished);
}

#editButtonWrapper .updateButtonWrap .button1:hover {
	background: var(--finishedHOVER);
}

.button1 {
	font-size: var(--buttonTxt);
	display: -webkit-inline-box;
	display: -ms-inline-flexbox;
	display: inline-flex;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	background-color: var(--button);
	color: var(--txtColAlt);
	padding: var(--buttonPadding);
	text-decoration: none;
	-webkit-transition: var(--inputTransition);
	-o-transition: var(--inputTransition);
	transition: var(--inputTransition);
	height: var(--buttonHeight);
	border: 0;
}

.button1:hover,
.button1:focus,
.button1:active {
	background-color: var(--buttonHOVER);
	cursor: pointer;
}

.button1.currentPageButton {
	background-color: var(--active);
}

.button1.currentPageButton.all {
	background-color: var(--buttonHOVER);
}

.button1.currentPageButton.inprogress {
	background-color: var(--inprogress);
}

.button1.currentPageButton.submitted {
	background-color: var(--buttonHOVER);
}

.button1.currentPageButton.reviewed {
	background-color: var(--reviewed);
}

.button1.currentPageButton.finished {
	background-color: var(--finished);
}

.button1NA {
	font-size: var(--buttonTxt);
	display: -webkit-inline-box;
	display: -ms-inline-flexbox;
	display: inline-flex;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	background-color: var(--buttonNA);
	color: var(--txtColAlt);
	padding: var(--buttonPadding);
	text-decoration: none;
	-webkit-transition: var(--inputTransition);
	-o-transition: var(--inputTransition);
	transition: var(--inputTransition);
	height: var(--buttonHeight);
	width: 100%;
	border: 0;
}

.button1NA:hover {
	cursor: not-allowed;
}

.buttonWrapper3User .button1NA {
	width: auto;
}

#submissionsWrapper .button1:nth-last-of-type(1) {
	margin-right: 0;
}

#reviewedForm .button1 {
	background-color: var(--reviewed);
}

#reviewedForm .button1:hover,
#reviewedForm .button1:focus,
#reviewedForm .button1:active {
	background-color: var(--reviewedHOVER);
}

#finishedForm .button1 {
	background-color: var(--finished);
}

#finishedForm .button1:hover,
#finishedForm .button1:focus,
#finishedForm .button1:active {
	background-color: var(--finishedHOVER);
}

#downloadCLIENT.button1 {
	background-color: var(--finished);
}

#downloadCLIENT.button1:hover,
#downloadCLIENT.button1:focus,
#downloadCLIENT.button1:active {
	background-color: var(--finishedHOVER);
}

.button1-1 {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--inputGap);
	float: left;
	width: 100%;
}

.buttonWrapperUser .button1-1 {
	grid-template-columns: auto;
}

.button1-2 {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--inputGap);
	float: right;
	width: 100%;
	margin-top: 1em;
	margin-bottom: 1em;
	margin-left: 1em;
	text-align: right;
}

.buttonWrapperUser .button1-2 {
	margin-top: 0;
}

#editButtonWrapper .button1-1,
#editButtonWrapper .button1-2 {
	display: block;
	margin: 0;
}

#editButtonWrapper .button1-1 form,
#editButtonWrapper .button1-2 {
	width: 100%;
}

.button2 {
	display: -webkit-inline-box;
	display: -ms-inline-flexbox;
	display: inline-flex;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	background-color: var(--button);
	color: var(--bgCol);
	text-decoration: none;
	-webkit-transition: var(--inputTransition);
	-o-transition: var(--inputTransition);
	transition: var(--inputTransition);
	width: 100%;
	height: var(--buttonHeight);
	min-width: 65px;
	margin-bottom: 2px;
	padding: .8em;
}

.jobTableValue .button2 {
	display: -webkit-inline-box;
	display: -ms-inline-flexbox;
	display: inline-flex;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	background-color: var(--button);
	color: var(--bgCol);
	padding: var(--buttonPadding);
	text-decoration: none;
	-webkit-transition: var(--inputTransition);
	-o-transition: var(--inputTransition);
	transition: var(--inputTransition);
	height: 25px;
	min-width: 80px;
	width: auto;
}

.button2:hover,
.button2:focus,
.button2:active {
	background-color: var(--buttonHOVER);
	cursor: pointer;
}

.buttonWrapper3 {
	text-align: center;
}

.buttonWrapper3Edit {
	height: var(--buttonHeight);
}

.button3 {
	display: -webkit-inline-box;
	display: -ms-inline-flexbox;
	display: inline-flex;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	background-color: var(--button);
	color: var(--bgCol);
	padding: var(--buttonPadding);
	text-decoration: none;
	-webkit-transition: var(--inputTransition);
	-o-transition: var(--inputTransition);
	transition: var(--inputTransition);
	height: var(--buttonHeight);
	width: var(--buttonHeight);
	font-size: var(--buttonTxtLrg);
	border: 0;
}

.button3:hover,
.button3:focus,
.button3:active {
	background-color: var(--buttonHOVER);
	cursor: pointer;
}

.button3NA {
	display: -webkit-inline-box;
	display: -ms-inline-flexbox;
	display: inline-flex;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	background-color: var(--buttonNA);
	color: var(--bgCol);
	padding: var(--buttonPadding);
	text-decoration: none;
	-webkit-transition: var(--inputTransition);
	-o-transition: var(--inputTransition);
	transition: var(--inputTransition);
	height: var(--buttonHeight);
	font-size: var(--buttonTxtLrg);
}

.button3NA:hover {
	cursor: not-allowed;
}

.button3-1 {
	float: left;
	margin-bottom: 1em;
}

.button3-2 {
	float: right;
	margin-bottom: 1em;
}

.button3-1 .jobForms:nth-of-type(1) {
	margin-right: .15em;
}

.button3-2 .jobForms:nth-of-type(2) {
	margin-left: .15em;
}

.button3-3 {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	width: 100%;
}

.buttonWrapper3User .button3-3 {
	grid-template-columns: auto;
}

#submissionsWrapper .button3-3 {
	display: flex;
	flex-wrap: wrap;
}

#submissionsWrapper .button3-3 > form {
	flex: 1 0 auto;
}

#submissionsWrapper .button3-3 > form:nth-child(4),
#submissionsWrapper .button3-3 > form:nth-child(5) {
	min-width: 50%;
}

@media screen and (min-width: 416px) 
{
	#submissionsWrapper .button3-3 > form:nth-child(1),
	#submissionsWrapper .button3-3 > form:nth-child(2),
	#submissionsWrapper .button3-3 > form:nth-child(3) {
		min-width: 33.33%;
	}
}

#inprogressForm .button1 {
    background: var(--finished);
    border-radius: 50px;
    padding: 0 2em;
    width: auto;
    height: 50px;
	font-size: var(--buttonTxtLrg);
    color: var(--txtColAlt);
    -webkit-transition: var(--inputTransition);
    -o-transition: var(--inputTransition);
    transition: var(--inputTransition);
}

#inprogressForm .button1:hover {
	background: var(--finishedHOVER);
}

#inprogressForm .button1NA {
    border-radius: 50px;
    padding: 0 2em;
	font-size: var(--buttonTxtLrg);
}

.button1-1 .jobForms,
.button3-1 .jobForms,
.button3-2 .jobForms,
.button3-3 .jobForms {
	display: inline-block;
}

#subTable_wrapper {
	/* 2.3.94 */
	overflow: hidden;
}

#subTable_wrapper .dt-buttons button,
#subTable_wrapper .reset-filters button {
	display: -webkit-inline-box;
	display: -ms-inline-flexbox;
	display: inline-flex;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	background: var(--button);
	background-color: var(--button);
	color: var(--txtColAlt);
	padding: var(--buttonPadding);
	text-decoration: none;
	-webkit-transition: var(--inputTransition);
	-o-transition: var(--inputTransition);
	transition: var(--inputTransition);
	height: var(--buttonHeight);
	border: 0;
	border-radius: var(--inputRadius);
	font-size: var(--buttonTxt);
}

#subTable_wrapper .dt-buttons button:hover,
#subTable_wrapper .reset-filters button:hover {
	background-color: var(--buttonHOVER);
	-webkit-transition: var(--inputTransition);
	-o-transition: var(--inputTransition);
	transition: var(--inputTransition);
	cursor: pointer;
}

#subTable_wrapper .dt-buttons button:focus,
#subTable_wrapper .reset-filters button:focus {
	background-color: var(--buttonHOVER);
	text-shadow: none;
}

/* 21.04.23 */
#subTable_wrapper .reset-filters button {
	width: 100%;
}

#subTable_wrapper .buttons-columnVisibility {
	background: var(--button);
}

#subTable_wrapper .buttons-columnVisibility.active {
	background: var(--bdpCol);
}

#subTable_wrapper .dt-buttons .buttons-columnVisibility {
	height: 15px;
	margin-bottom: .25em;
}

#subTable_wrapper div.dt-buttons {
	display: grid;
	float: none;
	text-align: initial;
	margin-bottom: 1em;
}

#subTable_wrapper .buttons-colvis {
	margin-right: 0;
}

@media screen and (min-width: 374px) 
{
	#subTable_wrapper .buttons-colvis {
		margin-right: var(--inputGap);
	}
}

#subTable_wrapper .buttons-csv,
#subTable_wrapper .buttons-pdf {
	float: right;
	margin-right: 0;
}

#subTable td {
	white-space: nowrap;
}

/* // 21.04.23 */
#subTable tbody tr:nth-last-child(1) .button2 {
	margin-bottom: 0 !important;
}

.clearButtonWrapper {
	position: absolute;
	right: 148px;
}

.clearButton {
	display: -webkit-inline-box;
	display: -ms-inline-flexbox;
	display: inline-flex;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	background-color: transparent;
	color: var(--txtCol);
	padding: var(--buttonPadding);
	text-decoration: none;
	font-size: var(--buttonTxt);
	-webkit-transition: var(--inputTransition);
	-o-transition: var(--inputTransition);
	transition: var(--inputTransition);
	height: var(--buttonHeight);
	width: auto;
	border: none;
}

.clearButton:hover {
	color: var(--bdpCol);
	cursor: pointer;
}

.gpsButton,
.timeButton,
.searchButton,
.partsButton,
.addPartButton {
	display: -webkit-inline-box;
	display: -ms-inline-flexbox;
	display: inline-flex;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	background-color: var(--button);
	color: var(--txtColAlt);
	padding: var(--buttonPadding);
	text-decoration: none;
	font-size: var(--buttonTxt);
	-webkit-transition: var(--inputTransition);
	-o-transition: var(--inputTransition);
	transition: var(--inputTransition);
	height: var(--buttonHeight);
	width: 148px;
	border: none;
}

.partsButton {
	height: auto;
	width: auto;
	border-radius: 50px;
	margin: .25em;
}

.addPartButton {
	width: 85px;
}

.gpsButton:hover,
.gpsButton:focus,
.gpsButton:active,
.timeButton:hover,
.timeButton:focus,
.timeButton:active,
.searchButton:hover,
.searchButton:focus,
.searchButton:active,
.partsButton:hover,
.partsButton:focus,
.partsButton:active,
.addPartButton:hover,
.addPartButton:focus,
.addPartButton:active,
.valueArrows span:hover,
.valueArrows span:focus,
.valueArrows span:active {
	background-color: var(--buttonHOVER);
	cursor: pointer;
}

.gpsButton:focus,
.timeButton:focus,
.searchButton:focus,
.partsButton:focus,
.addPartButton:focus {
	border: 0;
	-webkit-box-shadow: none;
	        box-shadow: none;
}

.searchError {
	position: absolute;
	margin-top: 18px;
	margin-left: 67px;
	color: var(--inputError);
	font-size: var(--inputTxt);
}

@media (max-width: 355px) 
{
	.button1-2 {
		text-align: center;
	}
}

@media (min-width: 374px) 
{
	#subTable_wrapper div.dt-buttons {
		grid-template-columns: auto 1fr 1fr;
	}
}

@media (min-width: 430px) 
{
	#subTable_wrapper div.dt-buttons {
		display: block;
	}

	/* 21.04.23 */
	#subTable_wrapper .reset-filters button {
		width: auto;
		float: right;
		margin-right: 1em;
	}
}

@media screen and (min-width: 542px) 
{
	.buttonWrapper {
		grid-template-columns: auto;
	}

	.button1-2 {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: var(--inputGap);
	}

	.buttonWrapperUser .button1-2 {
		grid-template-columns: auto;
		justify-content: right;
	}

	.buttonWrapperUser #downloadCLIENT.button1 {
		width: 200px;
	}

	.button3-3 {
		gap: var(--inputGap);
	}

	#submissionsWrapper .button3-3 {
		display: grid;
		grid-template-columns: repeat(5, auto);
	}

	#subTable_wrapper .buttons-pdf {
		margin-right: 1em;
	}
}

@media screen and (min-width: 650px) 
{
	.buttonWrapper3 {
		display: grid;
		grid-template-columns: auto 1fr auto;
		gap: var(--inputGap);
	}

	.buttonWrapper3User {
		grid-template-columns: auto auto;
		height: var(--buttonHeight);
	}

	.button3-1 {
		order: 1;
		text-align: left;
	}

	.button3-2 {
		order: 3;
		text-align: right;
	}

	.button3-1, 
	.button3-2 {
		margin-bottom: 0;
	}

	.button3-3 {
		width: auto;
		order: 2;
	}

	#submissionsWrapper .button3-3 {
		display: grid;
	}

	#submissionsWrapper.maintenanceFormTable .button3-3 {
		/* https://stackoverflow.com/a/61240964 */
		grid-template-columns: repeat(5, minmax(0, 1fr));
	}

	#submissionsWrapper.tickSheetTable .button3-3 {
		/* https://stackoverflow.com/a/61240964 */
		grid-template-columns: repeat(5, minmax(0, 1fr));
	}

	#submissionsWrapper.vehicleInspectionTable .button3-3 {
		/* https://stackoverflow.com/a/61240964 */
		grid-template-columns: repeat(5, minmax(0, 1fr));
	}
}

@media screen and (min-width: 641px) 
{
	#editButtonWrapper.buttonWrapper {
		/* display: grid;
		grid-template-columns: auto auto; */
		gap: 15em;
	}

	#editButtonWrapper .button1-2 {
		margin: 0;
	}

	#subTable_wrapper .dt-buttons button {
		margin-bottom: 0;
	}
}

@media screen and (min-width: 832px) 
{
	.buttonWrapper {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 1em;
	}

	.buttonWrapper.buttonWrapperUser{
		grid-template-columns: auto;
	}
	
	#submissionsWrapper .buttonWrapper {
		grid-template-columns: auto;
		gap: var(--inputGap);
	}

	.button1-2 {
		margin: 0;
	}
}

@media screen and (min-width: 1025px) 
{
	.input2 {
		font-size: 360px;
	}

	.buttonWrapper {
		gap: 10em;
	}

	.buttonWrapper3 {
		gap: 5em;
	}

	.searchError {
		margin-top: 15px;
	}
}

/* ================================================================= */
/* ## PAGE SPECIFIC */
/* ================================================================= */

/* ------------------------------------------------ */
/* # Login Page */
/* ------------------------------------------------ */

.loginWrap#wrapper {
	background: 
		linear-gradient(
			rgba(255, 255, 255, 0.95), 
			rgba(255, 255, 255, 0.95), 
			rgba(255, 255, 255, 0.95)
		),
		url('assets/img/freighter-enhanced.jpg');
	background-repeat: no-repeat;
	background-size: cover;
}

.loginWrap #container {
	display: flex;
	justify-content: center;
}

.loginWrap #content {
	text-align: center;
	width: 100%;
	max-width: 500px;
	margin-top: 1em;
}

.loginWrap svg {
	max-width: 150px;
}

.loginWrap svg g path {
	fill: var(--bdpCol);
}

.loginWrap header {
	width: 90%;
	margin: auto;
}

.loginWrap header h1 {
	margin-top: 1rem;
	margin-bottom: .25em;
}

.loginWrap footer#footer {
	background: var(--bgCol);
	color: var(--txtCol);
}

.loginWrap #copyright a {
	color: var(--txtCol);
}

.loginWrap #copyright a:hover,
.loginWrap #copyright a:focus,
.loginWrap #copyright a:active {
	color: var(--bdpCol);
}

.loginWrap #nav {
	/* To match default WP. */
	margin: 24px 0 0;
	padding: 0 24px; 
}

.loginWrap #nav a {
	text-align: left;
	/* To match default WP. */
	color: #50575e !important;
}

.loginWrap #nav a:hover,
.loginWrap #nav a:focus {
	color: var(--txtColAltHOVER) !important;
	text-decoration: underline !important;
}

@media screen and (min-width: 420px) and (min-height: 656px) 
{
	.loginWrap svg {
		max-width: 220px;
	}
}

@media screen and (min-height: 656px) 
{
	.loginWrap #container {
		align-items: center;
	}
}

@media screen and (min-width: 1025px) and (min-height: 830px) 
{
	.loginWrap svg {
		max-width: 250px;
	}
}

/* ------------------------------------------------ */
/* # Front Page */
/* ------------------------------------------------ */

#header-front {
	height: var(--frontHeaderHeight);
	padding: var(--frontMargin);
	background-color: var(--bdpCol);
	background: var(--bdpGrad);
	text-align: center;
}

#headerInner-front {
	position: relative;
	height: 100%;
	width: 100%;
	margin: 0 auto;
}

#footer.front {
	height: var(--frontFooterHeight);
}

#footerInner.front {
	grid-template-columns: auto;
  }

#copyright.front {
	text-align: center;
}

#front-message-wrapper {
	margin: var(--frontMargin);
}

#front-message-wrapper h1 {
	font-size: 80px;
	font-weight: var(--blk);
	text-decoration: underline;
	text-decoration-thickness: 7px;
	text-underline-offset: inherit;
}

#front-message-wrapper p,
#front-message-wrapper a {
	font-size: 42px;
	font-weight: var(--bld);
	color: var(--txtCol);
	margin-top: .25em;
	text-decoration: none;
	transition: var(--linkTransition);
}

#front-message-wrapper a:hover,
#front-message-wrapper a:focus {
	color: var(--bdpCol);
}

#front-grid-wrapper {
	display: grid;
	grid-template-columns: 100%;
	grid-template-rows: repeat(4, minmax(0, 1fr));
	height: calc(100vh - var(--frontFullHeightCalc) - var(--admin-height));

	/* 19.03.23 - Fix for hover glitching white. */
	background: black;
}

#front-grid-wrapper.client-user {
	grid-template-rows: repeat(2, minmax(0, 1fr));
}

.front-grid-item-wrap {
	--front-grid-item1: var(--frontGradVar1);
	--front-grid-item2: var(--frontGradVar2);
	--front-grid-item3: var(--frontGradVar1);
	--front-grid-item4: var(--frontGradVar2);
	--front-grid-item5: var(--frontGradVar1);
	--front-grid-item6: var(--frontGradVar2);
	overflow: hidden;
}

#front-grid-all-submissions {
	display: none;
}

/* 26.03.23 */
.client-user #front-grid-maintenance-report-submissions,
.client-user #front-grid-tick-sheet-submissions {
	display: block;
}

#front-grid-vehicle-inspection-submissions {
	grid-area: 4 / 1 / 4 / 1;
}

#front-grid-forms .front-grid-item {
	background: var(--front-grid-item1), url('assets/img/forms-image.jpg');
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
}

#front-grid-maintenance-report-submissions .front-grid-item {
	background: var(--front-grid-item4), url('assets/img/maintenance-image.jpg');
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
}

#front-grid-tick-sheet-submissions .front-grid-item {
	background: var(--front-grid-item5), url('assets/img/tick-image.jpg');
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
}

#front-grid-vehicle-inspection-submissions .front-grid-item {
	background: var(--front-grid-item6), url('assets/img/vehicle-image.jpg');
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
}

.front-grid-item-wrap:hover .front-grid-item {
	--frontGradVar1: linear-gradient(0deg, rgba(10, 0, 0, 0.75), rgba(10, 0, 0, 0.75));
	--frontGradVar2: linear-gradient(0deg, rgba(20, 0, 0, 0.75), rgba(20, 0, 0, 0.75));
	--front-grid-item1: var(--frontGradVar1);
	--front-grid-item2: var(--frontGradVar2);
	--front-grid-item3: var(--frontGradVar1);
	--front-grid-item4: var(--frontGradVar2);
	--front-grid-item5: var(--frontGradVar1);
	--front-grid-item6: var(--frontGradVar2);
	
	transform: scale(1.2);
}

.front-grid-item {
	height: 100%;
	width: 100%;
	transition: var(--globalTransition);
}

.front-grid-item a {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;

	color: white;
	text-decoration: none;
	text-align: center;
	font-size: 24px;
	font-weight: var(--blk) !important;
	text-transform: uppercase;
	word-spacing: .1em;
	line-height: 1.2;
	transition: var(--globalTransition);
}

.front-grid-item a:focus {
	color: var(--bdpCol);
}

/* 10.11.22 - Dodgy browser support. */
.front-grid-item:has(a:focus),
.front-grid-item:has(a:active) {
	--frontGradVar1: linear-gradient(0deg, rgba(10, 0, 0, 0.75), rgba(10, 0, 0, 0.75));
	--frontGradVar2: linear-gradient(0deg, rgba(20, 0, 0, 0.75), rgba(20, 0, 0, 0.75));
	--front-grid-item1: var(--frontGradVar1);
	--front-grid-item2: var(--frontGradVar2);
	--front-grid-item3: var(--frontGradVar1);
	--front-grid-item4: var(--frontGradVar2);
	--front-grid-item5: var(--frontGradVar1);
	--front-grid-item6: var(--frontGradVar2);

	transform: scale(1.2);
}

.front-grid-item a div {
	display: inline;
}

.front-grid-item a div span {
	display: block;
}

@media screen and (min-width: 560px) 
{
	.front-grid-item a div {
		display: inline;
	}

	.front-grid-item a div span {
		display: inline;
	}
}

@media screen and (min-height: 600px) 
{
	.front-grid-item a {
		font-size: 28px;
	}
}

@media screen and (min-width: 768px) and (min-height: 768px) 
{
	#front-message-wrapper {
		margin: 3em;
	}

	.front-grid-item a {
		font-size: 36px;
	}
}

@media screen and (min-width: 1000px) and (min-height: 1000px) 
{
	.front-grid-item a {
		font-size: 48px;
	}
}

@media screen and (min-width: 1300px) and (min-height: 900px) 
{
	#front-grid-wrapper.client-user {
		grid-template-rows: repeat(2, minmax(0, 1fr));
	}

	#front-grid-maintenance-report-submissions,
	#front-grid-tick-sheet-submissions,
	#front-grid-vehicle-inspection-submissions {
		display: block;
	}

	#front-grid-all-submissions {
		display: none;
	}

	#front-message-wrapper h1 {
		font-size: 150px;
		text-decoration-thickness: 10px;
	}
	
	#front-message-wrapper p,
	#front-message-wrapper a {
		font-size: 60px;
	}
}

@media screen and (min-width: 1800px) and (min-height: 900px) 
{
	#front-message-wrapper {
		margin: 5em;
	}

	#front-grid-wrapper.client-user {
		grid-template-columns: repeat(1, minmax(0, 1fr));
		grid-template-rows: repeat(2, minmax(0, 1fr));
	}

	.client-user #front-grid-maintenance-report-submissions {
		grid-area: 1;
	}

	.client-user #front-grid-tick-sheet-submissions {
		grid-area: 2;
	}
}

/* ------------------------------------------------ */
/* # Submissions Pages */
/* ------------------------------------------------ */

.tableContainer {
	margin-top: 1em;
}

#subTable {
	border: 0;
	opacity: 1;
	-webkit-transition: var(--inputTransition);
	-o-transition: var(--inputTransition);
	transition: var(--inputTransition);
}

#subTable.loaded {
	display: none;
}

#subTable.processing {
	opacity: .15;
}

#subTable_processing.dataTables_processing {
	background: none;
	font-size: 3em;
	height: 105px;
	margin-top: -23px;
}

#subTable thead th {
	font-size: var(--tableth);
	vertical-align: middle;
	border-bottom: var(--inputBorder);
	white-space: nowrap;
}

/* // 21.04.23 */
#subTable tfoot th {
	padding: 2px;
	border-top: var(--inputBorder);
}

/* // 21.04.23 */
#subTable tfoot th input {
	text-align: center;
}

#subTable tbody tr {
	background-color: var(--tableBG);
}

#subTable tbody tr:hover,
#subTable tbody tr:focus,
#subTable tbody tr:active {
	background-color: var(--tableBGHOVER);
	cursor: pointer;
}

#subTable tbody tr.child:hover {
	cursor: auto;
}

#subTable tbody tr.highlightRowInprogress {
	background-color: var(--inprogressHighlight);
}

#subTable tbody tr.highlightRowInprogress:hover,
#subTable tbody tr.highlightRowInprogress:focus,
#subTable tbody tr.highlightRowInprogress:active {
	background-color: var(--inprogressHighlightHOVER);
}

#subTable tbody tr.highlightRowReviewed {
	background-color: var(--reviewedHighlight);
}

#subTable tbody tr.highlightRowReviewed:hover,
#subTable tbody tr.highlightRowReviewed:focus,
#subTable tbody tr.highlightRowReviewed:active {
	background-color: var(--reviewedHighlightHOVER);
}

#subTable tbody tr.highlightRowFinished {
	background-color: var(--finishedHighlight);
}

#subTable tbody tr.highlightRowFinished:hover,
#subTable tbody tr.highlightRowFinished:focus,
#subTable tbody tr.highlightRowFinished:active {
	background-color: var(--finishedHighlightHOVER);
}

#subTable tbody td.dtr-control {
	padding-left: 32px;
}

#subTable .dtr-control {
	display: table-cell !important; /* 22.04.23: Prevents first column from being hidden if there are no child elements. */
}

#subTable tbody td.dtr-control::before {
	top: 50%;
	-webkit-transform: translate(0, -50%);
	    -ms-transform: translate(0, -50%);
	        transform: translate(0, -50%);
	left: 6px;
	height: 1em;
	width: 1em;
	margin-top: 0;
	margin-left: 0;
	background-color: var(--bdpCol);
}

#subTable td {
	text-align: center;
	vertical-align: middle;
	padding: 0 5px 0 5px;
}

#subTable td:nth-last-of-type(1) {
	padding: 0;
}

#subTable td.engineer {
	max-width: 80px;
	-o-text-overflow: ellipsis;
	   text-overflow: ellipsis;
	overflow: hidden;
}

#subTable .child {
	text-align: left;
	white-space: normal;
	padding: 1em;
	background: var(--bgCol);
}

#subTable td.child:nth-last-of-type(1) {
	padding: 1em;
}

#subTable .child:hover,
#subTable .child:focus,
#subTable .child:active {
	background: var(--bgCol) !important;
}

#subTable .child ul {
	width: 100%;
}

#subTable .child .dtr-title {
	display: block;
	padding-bottom: .25em;
}

#subTable .child .dtr-data {
	white-space: pre-line;
	word-wrap: break-word;
}

#subTable .child ul li {
	border-bottom: 1px solid #ececec;
}

#subTable .child ul li:nth-last-of-type(1) {
	border-bottom: none;
}

#subTable_wrapper input {
	color: var(--inputColor);
	background: var(--inputBG);
	border: var(--inputBorder);
	border-radius: var(--inputRadius);
	-webkit-box-shadow: var(--inputBoxShadow);
	        box-shadow: var(--inputBoxShadow);
	height: var(--inputHeight);
	width: var(--inputWidth);
	-webkit-transition: var(--inputTransition);
	-o-transition: var(--inputTransition);
	transition: var(--inputTransition);
	padding: var(--inputPadding);
	font-size: var(--inputTxt);
}

#subTable_wrapper input:focus {
	border: var(--inputBorderFOCUS);
	-webkit-box-shadow: var(--inputBoxShadowFOCUS);
	        box-shadow: var(--inputBoxShadowFOCUS);
	background: var(--inputBGFOCUS);
}

#subTable_filter {
	margin: 0;
	margin-bottom: 1em;
	float: right;
}

#subTable_filter input {
	margin: 0;
}

#subTable_length {
	float: left;
	margin-bottom: 1em;
}

#subTable_length select {
	padding: var(--inputPadding);
	border-radius: var(--inputRadius);
	background-color: var(--inputBG);
}

#subTable_paginate .paginate_button.current {
	color: var(--txtColAlt) !important;
	background: var(--button);
	border: 0;
}

#subTable_paginate .paginate_button.current:hover,
#subTable_paginate .paginate_button.current:focus,
#subTable_paginate .paginate_button.current:active {
	background: var(--button);
	cursor: default;
}

#subTable_paginate .paginate_button {
	color: var(--txtCol) !important;
	background: var(--bgCol);
	border: 0;
	border-radius: 0;
	-webkit-transition: var(--inputTransition);
	-o-transition: var(--inputTransition);
	transition: var(--inputTransition);
}

#subTable_paginate .paginate_button:hover,
#subTable_paginate .paginate_button:focus,
#subTable_paginate .paginate_button:active {
	color: var(--txtColAlt) !important;
	background-color: var(--buttonHOVER);
	cursor: pointer;
}

#subTable_wrapper div.dt-button-collection {
	width: 100%;
}

/* 23.08.22 - When datatables is empty. */
.dataTables_empty {
	height: 50px;
	font-size: 20px;
}

@media screen and (min-width: 374px) 
{
	#subTable_wrapper div.dt-button-collection {
		width: 170px;
	}
}

/* ------------------------------------------------ */
/* # Job & Edit Pages */
/* ------------------------------------------------ */

/*Initial page, without any query string in url*/
.jobSearchForm input[type="submit"] {
	font-size: var(--buttonTxtLrg);
	width: 100%;
	margin-top: 1em;
}

.jobSearchForm input[type="text"]::-webkit-input-placeholder {
	font-size: .7em;
	color: rgba(0,0,0,.25);
}

.jobSearchForm input[type="text"]::-moz-placeholder {
	font-size: .7em;
	color: rgba(0,0,0,.25);
}

.jobSearchForm input[type="text"]:-ms-input-placeholder {
	font-size: .7em;
	color: rgba(0,0,0,.25);
}

.jobSearchForm input[type="text"]::-ms-input-placeholder {
	font-size: .7em;
	color: rgba(0,0,0,.25);
}

.jobSearchForm input[type="text"]::placeholder {
	font-size: .7em;
	color: rgba(0,0,0,.25);
}

/*Search on page with query string in url*/
.jobSearchForm2 {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	margin-top: 1em;
	margin-bottom: 1em;
	width: 100%;
}

.jobSearchForm2 input[type="submit"] {
	min-width: auto;
}

.jobSearchRadioWrapper {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
	margin-bottom: 1em;
}

.jobSearchRadioWrapper label {
	font-size: 24px;
	margin-right: 1em;
}

.jobSearchRadioWrapper label:last-child {
	margin-right: 0;
}

.jobSearchRadioWrapper label:hover,
.jobSearchRadioWrapper input:hover {
	cursor: pointer;
}

.jobSearchRadioWrapper input {
	height: 20px;
	width: 20px;
	accent-color: var(--bdpCol);
}

.jobTableOuterContainer {
	display: grid;
	gap: 1em;
	grid-template-columns: 1fr 1fr;
	width: 100%;
	height: 100%;
}

.jobTableOuterContainer.client {
	grid-template-columns: 1fr;
}

.jobTableInnerContainer:nth-of-type(1),
.jobTableInnerContainer:nth-of-type(2),
.jobTableInnerContainer:nth-of-type(3),
.jobTableInnerContainer:nth-of-type(4),
.jobTableInnerContainer:nth-of-type(5) {
	grid-column: 1/3;
}

.jobTableInnerContainer:nth-last-of-type(1) {
	width: 100%;
}

.jobTableWrap {
	display: table;
	padding: 1em 1em 0 1em;
}

.jobFileTitle {
	margin-bottom: 1em;
}

.jobFileWrap {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: .5em;
}

.jobFileWrap.full {
	grid-template-columns: auto;
}

.jobFileWrap img {
	width: 100%;
	max-height: 100%;
	height: auto;
}

.uploadedImageWrap {
	position: relative;
}

.uploadedImageWrap span {
	position: absolute;
	bottom: 5px;
	left: 5px;
	color: white;
	text-shadow: 1px 0 0 #000, 0 -1px 0 #000, 0 1px 0 #000, -1px 0 0 #000;
}

.uploadedImageFull {
	display: block;
	height: 100%;
}

.uploadedNoImageWrap {
	display: flex;
	position: relative;
	flex-direction: column;
	border: 5px solid red;
	margin: 0;
	bottom: 0;
}

.uploadedNoImageWrap span {
	margin: 5px;
	/* bottom: 0;
	position: absolute; */
}

.editTableWrap {
	display: -ms-grid;
	display: grid;
	-ms-grid-columns: auto;
	grid-template-columns: auto;
	gap: 1em;
	padding: 1em;
	width: 100%;
}

.jobTableInnerContainer .adminInfo .editTableRow {
	-ms-grid-column: 1;
	grid-column: 1;
}

.editTableWrap input, .editTableWrap select {
	width: 100%;
	height: var(--inputHeight);
	padding: var(--inputPadding);
}

.editTableWrap textarea {
	width: 100%;
	height: var(--inputHeight);
	padding: var(--inputPadding);
}

.editTableWrap textarea:focus {
	height: var(--inputHeightTextarea);
}

.editTableWrap input[type="checkbox"] {
	min-width: auto;
	width: auto;
	height: auto;
}

.inputsChangedAlert {
	display: none;
    font-weight: var(--bld);
    margin-bottom: 1em;
    text-align: center;
    font-size: var(--tableth);
    color: var(--active);
}

.checkboxFieldChanged {
	background-color: var(--active) !important;
	color: var(--txtColAlt) !important;
    padding: .3em .6em .3em .3em;
    border-radius: 20px;
    -webkit-transition: var(--globalTransition);
    -o-transition: var(--globalTransition);
    transition: var(--globalTransition);
}

.inputFieldChanged {
	background-color: var(--active) !important;
	color: var(--txtColAlt) !important;
}

select.inputFieldChanged {
	background-image: -o-linear-gradient(45deg, transparent 50%, var(--txtColAlt) 50%), -o-linear-gradient(315deg, var(--txtColAlt) 50%, transparent 50%), -o-linear-gradient(left, var(--txtColAlt), var(--txtColAlt)) !important;
	background-image: linear-gradient(45deg, transparent 50%, var(--txtColAlt) 50%), linear-gradient(135deg, var(--txtColAlt) 50%, transparent 50%), linear-gradient(to right, var(--txtColAlt), var(--txtColAlt)) !important;
}

.inputsChanged {
	background-color: var(--active) !important;
}

.inputsChanged:hover,
.inputsChanged:focus,
.inputsChanged:active {
	background-color: var(--activeHOVER) !important;
}

.jobTableRow {
	display: table-row;
}

.jobTableRowNA {
	color: var(--hidden);
}

.jobTableLabel, .jobTableValue {
	display: table-cell;
	padding-bottom: 1em;
}

.jobTableLabel, .editTableLabel {
	font-size: var(--body);
	font-weight: var(--bld);
	min-width: 117px;
}

.jobTableValue, .editTableValue {
	font-size: var(--body);
	/* 27.04.23 */
	white-space: pre-line;
	word-wrap: anywhere;
}

#editForm {
	display: grid;
	gap: 1em;
	grid-template-columns: auto;
	width: 100%;
	height: 100%;
}

/* 18.10.22 - Counteracts P global margin-top. */
.editTableValue p {
	margin-top: 0;
}

.editTableValue.twoCols {
	display: -ms-grid;
	display: grid;
	-ms-grid-columns: 1fr auto;
	grid-template-columns: 1fr auto;
}

.tickCheckRow .jobTableValue,
.tickSheetRow .jobTableValue {
	white-space: normal;
}

.jobTableValue a {
	margin-left: .2em;
}

.tickSheetRow .jobTableValue {
	width: 100%;
}

.tickSheetRow .jobTableValue a {
	display: block;
	margin-left: 0;
}

.tickSheetRow .jobTableValue ul {
	display: flex;
	flex-direction: column;
	gap: .5em;
}

.jobTableRow:nth-last-of-type(1) .jobTableLabel, .jobTableRow:nth-last-of-type(1) .jobTableValue {
	padding-bottom: 0;
}

.editTableLabel {
	padding-bottom: 10px;
}

.editTableValue ul li {
	padding-bottom: .5em;
	display: inline-block;
	margin-right: 1em;
}

.editTableTick .editTableValue ul li {
	display: block;
}

/*Hide DIV for Coordinates to be display on PDF*/
.pdfGEO,
.pdfMFRef {
	display: none;
}

.tickTableWrap .jobTableLabel,
.vehicleTableWrap .jobTableLabel {
	min-width: 152px;
}

.tickCheckRow .jobTableLabel {
	vertical-align: top;
}

.tickCheckRow ul {
	display: -ms-grid;
	display: grid;
	-ms-grid-columns: auto;
	grid-template-columns: auto;
	grid-gap: 1em;
}

.tickCheckRow li {
	display: -ms-grid;
	display: grid;
	-ms-grid-columns: auto .5em 1fr;
	grid-template-columns: auto 1fr;
	grid-gap: .5em;
}

.tickCheckRow i {
	font-size: 16px;
}

.fa-check-circle {
	color: var(--ticked);
}

.fa-times-circle {
	color: var(--crossed);
}

.optionTitle,
.optionDesc {
	display: block;
}

.optionTitle {
	font-weight: var(--bld);
}

.vehicleOptionWrapper {
	display: flex;
	align-items: center;
}

@media screen and (min-width: 520px) 
{
	.tickCheckRow i {
		font-size: 32px;
	}
}

@media screen and (min-width: 641px) 
{
	.editTableWrap {
		-ms-grid-columns: 1fr 1fr;
		grid-template-columns: 1fr 1fr;
	}

	.jobTableOuterContainer.admin .jobTableInnerContainer:nth-of-type(1) {
		grid-column: 1;
	}

	.jobTableOuterContainer.admin .jobTableInnerContainer:nth-of-type(2) {
		grid-column: 2;
	}

	.jobTableInnerContainer .adminInfo .editTableRow,
	.editTableArrival .editTableRow:nth-of-type(3),
	.editTableClient .editTableRow:nth-of-type(3),
	.editTableClient .editTableRow:nth-of-type(4),
	.editTableVisit .editTableRow:nth-of-type(1),
	.editTableDeparture .editTableRow:nth-of-type(3),
	.editTableTick .editTableRow:nth-of-type(1),
	.editTableTick .editTableRow:nth-of-type(2),
	.editTableFinish .editTableRow:nth-of-type(1) {
		-ms-grid-column: 1;
		-ms-grid-column-span: 2;
		grid-column: 1 / 3;
	}

	.tickJob .editTableWrap .editTableRow:nth-of-type(5) {
		-ms-grid-column: 1;
		-ms-grid-column-span: 2;
		grid-column: 1 / 3;
	}

	.tickJob .editTableWrap .editTableRow:nth-of-type(6) {
		-ms-grid-column: 1;
		-ms-grid-column-span: 2;
		grid-column: 1 / 3;
	}
}

@media screen and (min-width: 1025px) 
{
	.jobTableLabel, .editTableLabel {
		min-width: 132px;
	}

	.tickTableWrap .jobTableLabel,
	.vehicleTableWrap .jobTableLabel {
		min-width: 170px;
	}

	.tickCheckRow ul {
		-ms-grid-columns: auto 1em auto;
		grid-template-columns: auto auto;
	}

	.tickCheckRow i {
		font-size: 35px;
	}
}

/* ------------------------------------------------ */
/* # Form Pages */
/* ------------------------------------------------ */

.notice h2 {
	margin: 0 0 .5em 0;
}

.notice ul li {
	list-style: disc;
	list-style-position: inside;
	padding-left: 0;
	font-size: var(--tableth);
	margin: 0 0 .3em 0;
}

.notice p {
	font-size: var(--tableth);
	margin: 0 0 .3em 0;
}

.visitTypeContainer li:hover,
.visitTypeContainer label:hover,
.inprogressContainer li:hover,
.inprogressContainer label:hover,
.listcheckbox-container li:hover,
.listcheckbox-container label:hover {
	cursor: pointer;
}

.partsListContainer {
	margin-bottom: 10px !important;
}

.partsListHeading {
	font-size: 18px;
	line-height: 20px;
	font-weight: 700;
}

.partsListWrapper {
	margin-bottom: .5em;
}

.partsListWrapper details {
	width: 100%;
}

.partsListWrapper summary {
	font-size: 18px;
	color: var(--button);
}

.partsListWrapper details[open] summary {
	color: var(--buttonHOVER);
}

.partsListWrapper summary:hover,
.partsListWrapper summary:focus,
.partsListWrapper summary:active {
	color: var(--buttonHOVER);
	cursor: pointer;
}

.partsList {
	display: flex;
	flex-wrap: wrap;
	margin-top: 10px;
	margin-bottom: 10px;
}

/*Parts List - Add Part wrapper*/
.addPartInputWrapper {
	display: flex !important;
}

/*Parts List - Quantity field*/
.addPartQuantity {
	height: 50px !important;
	width: 50px !important;
	text-align: center;
}

/*REMOVE INPUT NUMBER FIELD BROWSER DEFAULT ARROWS*/
/*https://www.w3schools.com/howto/howto_css_hide_arrow_number.asp*/
/*Chrome, Safari, Edge, Opera*/
.addPartQuantity::-webkit-outer-spin-button,
.addPartQuantity::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/*REMOVE INPUT NUMBER FIELD BROWSER DEFAULT ARROWS*/
/*https://www.w3schools.com/howto/howto_css_hide_arrow_number.asp*/
/*Firefox*/
.addPartQuantity {
  -moz-appearance: textfield;
}

/*Parts List - Text field*/
.addPartText {
	height: 50px !important;
}

/*Custom number arrows*/
.valueArrows {
	width: 60px;
	display: grid;
	grid-template-columns: 1fr 1fr;
	background-color: var(--button);
	color: var(--txtColAlt);
}

.valuePlus, 
.valueMinus {
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
	width: 30px;
	font-size: 8px;
}