:root {

	--pj-b1: #f5f8fc;

	--pj-color-primary: #007AC9;
	--pj-color-primary-alt: #05669B;

	--pj-white: #FFF;
	--pj-black: #000;
	--pj-disabled: #999999;

	--pj-gray: #888;
	--pj-gray-dark: #333;

	--pj-a-color: var(--pj-gray-dark);
	--pj-a-color-hover: var(--pj-color-primary);
}

body {
	background-color: var(--pj-b1);
	font-family: "Source Sans Pro", Helvetica, Arial, sans-serif;
}

label,
.form-floating>.form-select,
.form-floating>.form-select~label {
	color: var(--pj-black);
}

.pj-box {
	padding: 1.5rem !important;
	background-color: var(--pj-white);
	border-radius: 5px;
	-webkit-box-shadow: 0 3px 16px rgba(0, 80, 154, .25);
	box-shadow: 0 3px 16px rgba(0, 80, 154, .25);
}

.pj-box-top {
}

.pj-box-top h1 {
	color: var(--pj-black);
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size: 30px;
	font-style: normal;
	font-weight: 700;
	line-height: 1.2em;

	padding-right: 1rem !important;
	padding-left: 1rem !important;
}

.pj-box-top p {
	color: var(--pj-black);
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size: 20px;
	font-style: normal;
	font-weight: 400;
	line-height: 1.4em;

	padding-left: 1rem !important;
	padding-right: 1rem !important;
	margin-top: .5rem !important;
	margin-bottom: 0 !important;

}

.pj-box-stats {

	border-radius: 10px;
	background: #B3D0E2;

	min-height: 130px;

	font-size: 20px;
	font-style: normal;
	font-weight: 400;
	line-height: 20px;
}

.pj-box-stats p {

	color: #397396;
	font-size: 16px;
	font-weight: 700;
}

.pj-box-stats b {

	color: #68A2C6;
	font-size: 36px;
}

.pj-details {
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size: 14px;
	font-style: normal;
	font-weight: 400;
	line-height: normal;
}

@media only screen and (max-width: 520px) {
	.pj-top-box h1 {
		font-size: 24px;
	}
}

/* Colors */

.pj-color-primary {
	color: var(--pj-color-primary);
}

.pj-color-gray {
	color: var(--pj-gray);
}

.pj-bold {
	font-weight: 700;
}

/* Mouse Pointers */

.pj-pointer {
	cursor: pointer;
}

/* Buttons */

.pj-btn-one {
	background-color: var(--pj-color-primary);
	color: var(--pj-white);
	border: 2px solid var(--pj-color-primary) !important;
	border-radius: 5px;

	padding: 0.780rem 1.25rem;

	font-weight: normal;
	min-width: 12.5em;

}

.pj-btn-one:hover {
	background-color: var(--pj-color-primary-alt);
	color: var(--pj-white);

}

.pj-btn-one:active,
.btn-pj-one:target,
.btn-pj-one:active:focus {
	color: var(--pj-color-primary);

}

.pj-btn-two {
	background-color: var(--pj-white);
	color: var(--pj-color-primary);
	border: 2px solid var(--pj-color-primary) !important;
	border-radius: 30px;

	padding: 0.780rem 1.25rem;

	font-weight: normal;
	min-width: 12.5em;


}

.pj-btn-two:hover {
	color: var(--pj-color-primary);

}

.pj-btn-two:active,
.btn-pj-one:target,
.btn-pj-one:active:focus {
	color: var(--pj-color-primary);

}

/* Forms input ect.. */

.form-control,
.form-select {
	border: 1px solid var(--pj-gray);
	background-color: var(--pj-white);
}

.form-floating>.form-select~label::after {

	background-color: transparent;

}

input:disabled {
	background-color: var(--pj-disabled) !important;
}

.form-check-input:checked {
	background-color: var(--pj-color-primary);
	border-color: var(--pj-color-primary);
}

/* Bootstrap Overwrites */

.table {
	--bs-table-bg: var(--pj-white);
	--bs-table-color: var(--pj-c5);
	--bs-table-border-color: var(--pj-c3);
	--bs-table-striped-bg: var(--pj-color-primary);
	--bs-table-striped-color: var(--bs-table-color);
	--bs-table-hover-bg: var(--pj-c3);
	--bs-table-hover-color: var(--pj-white);

}

.navbar {

	--bs-navbar-color: var(--pj-a-color);
	--bs-navbar-hover-color: var(--pj-a-color-hover);
	--bs-navbar-brand-color: var();
	--bs-navbar-brand-hover-color: var(--pj-white);
	background-color: var(--pj-white);

	-webkit-box-shadow: 0 3px 16px rgba(0, 80, 154, .25);
	box-shadow: 0 3px 16px rgba(0, 80, 154, .25);
}