/* || Colors */

:root {
	/* ------------------------------------------------------------ */
	/* Variations of Arroyo Roble colors. */
	--brown-500: rgb(100, 47, 3);
	--gold-500: rgb(203, 147, 61);
	--pink-500: #eebbbb;
	--green-500: #138052;
	--red-500: #b31b1b;
	--gray-100: #e7e5e3;
	--gray-300: #BFCEC2;
	--gray-800: #272523;
	/* ------------------------------------------------------------ */
	/* Arroyo Roble main, default colors */
	--brown-default: var(--brown-500); /* Primary color. */
	--gold-default: var(--gold-500); /* Primary color. */
	--pink-default: var(--pink-500);
	--green-default: var(--green-500);
	--red-default: var(--red-500);
	--gray-light: var(--gray-100);
	--gray-dark: var(--gray-800);
}


body {
	color: var(--gray-dark);
	font-family: 'Open Sans', Helvetica, Arial, sans-serif;
	font-size: 1em;
	font-weight: normal;
	margin-bottom: 0;
}

h1, h2 {
	font-family: Volkhov, 'Times New Roman', serif;
	font-weight: normal;
	color: var(--brown-default);
}

h1 {
	font-size: 1.6em;
	text-transform: uppercase;
}

h2 {
	font-size: 1.4em;
	text-transform: uppercase;
}

h3, h4 {
	font-family: Volkhov, 'Times New Roman', serif;
	font-weight: normal;
	color: var(--brown-default);
}

h3 {
	text-transform: uppercase;
	font-size: 1.3em;
}

h4 {
	font-size: 1.2em;
}

h5, h6 {
	font-family: Volkhov, 'Times New Roman', serif;
	font-weight: normal;
	color: var(--gray-dark);
}

h5 {
	font-size: 1.1em;
}

h6 {
	font-size: 1.05em;
}

h2, h3, h4 {
	bottom: 1rem;
	margin-top: 1.5rem;
}

a {
	color: var(--brown-default);
	text-decoration: underline;
}

	a:hover {
		color: var(--brown-default);
		text-decoration: underline;
	}

.graybar {
	min-height: 7px;
	background-color: var(--gold-default);
}

.noBorders {
	border: none;
}

.navbar {
	background-color: var(--brown-default);
}

.navbar-text .text-dark {
	font-family: Volkhov, 'Times New Roman', serif;
	font-weight: normal;
	font-size: .95rem;
	color: white !important;
}

	.navbar-text .text-dark:hover, .navbar-text .text-dark:focus, .navbar-text .text-dark:active {
		color: var(--gold-default) !important;
		opacity: .8;
	}

a.nav-link {
	text-decoration: none;
}

.mainBody {
	min-height: 35em;
}

.footer {
	position: relative;
	overflow: hidden;
}

.footerBkgd {
	background-color: var(--brown-default);
}

.footerContent {
	min-height: 75px;
}

.footerCopyrightBkgd {
	background-color: var(--brown-default);
	line-height: 20px;
	padding: 10px 0;
}

.footerCopyrightContent {
	font-size: 12px;
	color: var(--gold-default);
	text-align: center;
}

.btn, .k-button {
	border-radius: .25em;
	margin: 3px;
}

.k-button-sm {
	font-size: 0.875em;
	padding: 4px 8px;
}

.rules > li {
	margin-bottom: 10px;
}

.textDisabled {
	color: var(--gray-300);
}

/* Tables */
.table {
	border: 1px solid var(--gold-default);
}
	.table thead th {
		background-color: var(--gold-default);
		color: white;
		font-weight: bold;
	}
		.table thead th.border-left {
			border-left: 1px solid white !important;
		}
	.table td.border-left {
		border-left: 1px solid var(--gold-default) !important;
	}

/* Telerik Button */
.k-button:hover {
	background-color: var(--gold-default);
}
/* End of Telerik Button */

/* Telerik Calendar */

/* This hides dates from previous and next months in the current month calendar. */
.k-other-month {
	visibility: hidden;
}
/* This defines the disabled date display. */
.k-calendar-td.k-disabled {
	background-color: var(--pink-default);
}

/* End of Telerik Calendar */

.calendarKeyUnavailable {
	height: 20px;
	width: 20px;
	min-height: 20px;
	min-width: 20px;
	background-color: var(--pink-default);
}

/* Telerik Tabstrip */
.k-tabstrip-item.k-item {
	font-weight: bold;
}
.k-tabstrip-item.k-item.k-state-default {
	color: white;
	background-color: var(--brown-default);
}
.k-tabstrip-item.k-item.k-state-active {
	color: var(--brown-default);
}
.k-tabstrip-top > .k-content {
	border-top-width: 1px;
}
/* End of Telerik Tabstrip */

/* Telerik Dialog */
.k-dialog-wrapper .k-dialog {
	max-width: 700px;
	padding: 10px 20px;
}
/* End of Telerik Dialgo */
/*.btn:hover, .btn:active, .k-button:hover, .k-button:active {
	background-color: rgb(203, 147, 61);
}
*/
/*@font-face {
	font-family: "Volkhov";
	src: url("../fonts/Volkhov-Regular.ttf") format("truetype");
}

@font-face {
	font-family: "'Open Sans'";
	src: url("../fonts/'Open Sans'-Regular.ttf") format("truetype");
}
*/
strong {
	font-weight: 700;
}

/* This is used to totally disable the Blazor warnings.
.components-reconnect-show, .components-reconnect-failed, .components-reconnect-rejected {
	display: none;
}
*/
.components-reconnect-failed, .components-reconnect-rejected {
	display: none;
}

#mapper {
	display: block;
	position: relative;
}
area {
	display: block;
}
area:hover {
	cursor: pointer;
}
canvas {
	pointer-events: none; /* make the canvas transparent to the mouse - needed since canvas is position infront of image */
	position: absolute;
}

/* Identity CSS ---------------------------------------------------------------------------------------------------- */

.container {
	max-width: 1140px;
}

input:-internal-autofill-selected {
	background-color: var(--gray-300) !important;
}

.btn-primary {
	background-color: var(--brown-default);
	border-color: var(--brown-default);
	border-radius: .25em;
}

	.btn-primary:hover, .btn-primary:active, .btn-primary:focus,
	.btn-primary:not(:disabled):not(.disabled).active, .btn-primary:not(:disabled):not(.disabled):active, .show > .btn-primary.dropdown-toggle {
		background-color: var(--brown-default);
		border-color: var(--brown-default);
		box-shadow: none;
	}

.btn-link, .nav-pills .nav-link {
	color: var(--brown-default);
	background-color: transparent;
	border: 1px solid transparent;
}

	.btn-link:hover, .nav-pills .nav-link:hover {
		color: var(--brown-default);
		background-color: transparent;
	}

	.nav-pills .nav-link:hover {
		border: 1px solid var(--brown-default);
	}

	.nav-pills .nav-link.active, .nav-pills .show > .nav-link {
		color: white;
		background-color: var(--brown-default);
		border-color: var(--brown-default);
		border-radius: .25em;
	}

/* To fix LoginPartial link formatting... */
#logout {
	margin: 0;
	border: none;
}

/* End of Identity CSS ---------------------------------------------------------------------------------------------------- */

/* Bootstrap overrides ---------------------------------------------------------------------------------------------------- */
/* These are not taken care of by the Telerik theme builder, so they need to be added here. */

.alert-primary {
	color: white;
	background-color: var(--brown-default);
	border-color: var(--brown-default);
}

.alert-secondary {
	color: var(--brown-default);
	background-color: var(--gray-light);
	border-color: var(--gray-light);
}

.alert-success {
	color: white;
	background-color: var(--green-default);
	border-color: var(--green-default);
}

.alert-warning {
	color: white;
	background-color: var(--gold-default);
	border-color: var(--gold-default);
}

.alert-danger {
	color: white;
	background-color: var(--red-default);
	border-color: var(--red-default);
}

.alert-info {
	color: white;
	background-color: var(--brown-default);
	border-color: var(--brown-default);
}

.alert-light {
	color: var(--brown-default);
	background-color: var(--gray-light);
	border-color: var(--gray-light);
}

.alert-dark {
	color: white;
	background-color: var(--brown-default);
	border-color: var(--brown-default);
}

.alert-link {
	color: white;
	text-decoration: underline;
}

	.alert-link:hover {
		color: white;
	}

/* End of Bootstrap overrides ---------------------------------------------------------------------------------------------------- */