.hide {
	display: none;
}

html,
body {
	height: 100%;
}

.simpletable {
	border-collapse: collapse;
}

.simpletable td,
.simpletable th {
	text-align: center;
	border: 1px solid #000
}

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

.disabledbutton {
	background-color: grey !important;
}

.disabledrow td {
	background-color: grey;
}

.validationerror {
	border: 2px solid red;
	border-radius: 5px;
	padding: 10px 30px 10px 30px;
	position: relative;
}

.validationerror::after {
	content: attr(data-error);
	display: block;
	color: red;
	font-size: 0.9rem;
	margin-top: 6px;
}

/* fancytableotherhover outer table */
/* fancytable inner table */
/* Table styles */
.fancytable,
.fancytableotherhover {
	border-collapse: collapse;
	width: 100%;
}

.fancytable td,
.fancytable th,
.fancytableotherhover td,
.fancytableotherhover th {
	border: 1px solid #ddd;
	padding: 8px;
}

.fancytable:not(.noalternatingbackgrounds) tr:nth-child(even) {
	background-color: #eee;
}

.fancytable tr:hover {
	background-color: #ccc;
}

.fancytableotherhover:not(.noalternatingbackgrounds) tr:nth-child(even):hover {
	background-color: #ccc;
}

.fancytable th,
.fancytableotherhover th {
	padding-top: 12px;
	padding-bottom: 12px;
	text-align: left;
	background-color: #4CAF50;
	color: white;
}

.fancytablered th {
	background-color: #da1a31;
}

.fancytablepink th {
	background-color: #FCC0C6;
	color: black;
}

.backgrey {
	background-color: grey;
}

.indentedtable {
	padding-left: 40px !important;
}

.thpadding {
	padding-left: 10px;
	padding-right: 10px;
}

/* Fancy radio buttons */
/* The container */
.fancyradio {
	display: block;
	position: relative;
	padding-left: 35px;
	margin-bottom: 12px;
	cursor: pointer;
	font-size: 22px;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

/* Hide the browser's default radio button */
.fancyradio input {
	position: absolute;
	opacity: 0;
	cursor: pointer;
}

.handpointer {
	cursor: pointer;
}

.red {
	color: red;
}

.green {
	color: #008000;
}

.paleblue {
	color: #00c4ff;
}

.amber {
	color: #ffbf00;
}

.purple {
	color: #310c52;
}

/* Create a custom radio button */
.checkmark {
	position: absolute;
	top: 0;
	left: 0;
	height: 25px;
	width: 25px;
	background-color: #eee;
	border-radius: 50%;
}

/* On mouse-over, add a grey background color */
.fancyradio:hover input~.checkmark {
	background-color: #bbb;
}

/* When the radio button is checked, add a blue background */
.fancyradio input:checked~.checkmark {
	background-color: #2196F3;
}

/* Create the indicator (the dot/circle - hidden when not checked) */
.checkmark:after {
	content: "";
	position: absolute;
	display: none;
}

/* Show the indicator (dot/circle) when checked */
.fancyradio input:checked~.checkmark:after {
	display: block;
}

/* Style the indicator (dot/circle) */
.fancyradio .checkmark:after {
	top: 9px;
	left: 9px;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: white;
}

.largecheckbox {
	width: 20px;
	height: 20px;

}

.hidden {
	display: none;
}

/* Sticky footer */
html {
	position: relative;
	min-height: 100%;
}

footer {
	position: absolute;
	bottom: 0;
	width: 100%;
	background-color: #f5f5f5;
	text-align: center;
}

/* Generically sets all tables with this class ot have a white background to stand out against the grey background of the pages */
table.backwhite {
	background-color: white;
	border-collapse: collapse;
}

table.backwhite td,
table.backwhite th,
table.backgrey td,
table.backgrey th {
	padding: 1px;
	border: solid grey 1px;
}

table.backwhite td,
table.backgrey td {
	border-left: solid black 1px;
	border-right: solid black 1px;
}

table.backwhite th,
table.backgrey th {
	border: solid black 1px;
}

table.backwhite tr:last-child td,
table.backgrey tr:last-child td {
	border-bottom: solid black 1px;
}

.tablesorter-default .header,
.tablesorter-default .tablesorter-header {
	background-image: url(data:image/gif;base64,R0lGODlhFQAJAIAAACMtMP///yH5BAEAAAEALAAAAAAVAAkAAAIXjI+AywnaYnhUMoqt3gZXPmVg94yJVQAAOw==);
	background-position: center right;
	background-repeat: no-repeat;
	cursor: pointer;
	white-space: normal;
	padding: 4px 20px 4px 4px;
}

.tablesorter-default thead .headerSortUp,
.tablesorter-default thead .tablesorter-headerSortUp,
.tablesorter-default thead .tablesorter-headerAsc {
	background-image: url(data:image/gif;base64,R0lGODlhFQAEAIAAACMtMP///yH5BAEAAAEALAAAAAAVAAQAAAINjI8Bya2wnINUMopZAQA7);
	border-bottom: #000 2px solid;
}

.tablesorter-default thead .headerSortDown,
.tablesorter-default thead .tablesorter-headerSortDown,
.tablesorter-default thead .tablesorter-headerDesc {
	background-image: url(data:image/gif;base64,R0lGODlhFQAEAIAAACMtMP///yH5BAEAAAEALAAAAAAVAAQAAAINjB+gC+jP2ptn0WskLQA7);
	border-bottom: #000 2px solid;
}

.tablesorter-default thead .sorter-false {
	background-image: none;
	cursor: default;
	padding: 4px;
}

.select2-container li {
	color: black;
}

.select2-close-mask {
	z-index: 2000;
}

.select2-dropdown {
	z-index: 3000;
}

.ace_editor {
	height: 600px;
}

.ace_editor_mini {
	height: 100px;
}

.aceeditor {
	font-size: 14px;
	resize: vertical;
	overflow: auto;
}


#judgingnav a {
	color: black;
}

.carousel-control-prev-icon {
	background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23000' viewBox='0 0 8 8'%3E%3Cpath d='M5.25 0l-4 4 4 4 1.5-1.5-2.5-2.5 2.5-2.5-1.5-1.5z'/%3E%3C/svg%3E") !important;
}

.carousel-control-next-icon {
	background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23000' viewBox='0 0 8 8'%3E%3Cpath d='M2.75 0l-1.5 1.5 2.5 2.5-2.5 2.5 1.5 1.5 4-4-4-4z'/%3E%3C/svg%3E") !important;
}

.stickytable th {
	position: sticky;
	top: 50px;
	/* Don't forget this, required for the stickiness */
	box-shadow: 0 2px 2px -1px rgba(0, 0, 0, 0.4);
	background-color: white;
}

.stickyblock {

	position: sticky;
	top: 55px;
	/* Don't forget this, required for the stickiness */
	border-radius: 5px;
	padding: 5px;
	z-index: 1010;
	background-color: white;
	border-bottom: 1px solid #dddddd;
}

.table-header-rotated th.row-header {
	width: auto;
}

.table-header-rotated td {
	width: 40px;
	border-top: 1px solid #dddddd;
	border-left: 1px solid #dddddd;
	border-right: 1px solid #dddddd;
	vertical-align: middle;
	text-align: center;
}

.table-header-rotated th.rotate-45 {
	height: 80px;
	width: 40px;
	min-width: 40px;
	max-width: 40px;
	position: relative;
	vertical-align: bottom;
	padding: 0;
	font-size: 12px;
	line-height: 0.8;
}

.table-header-rotated th.rotate-45>div {
	position: relative;
	top: 0px;
	left: 40px;
	/* 80 * tan(45) / 2 = 40 where 80 is the height on the cell and 45 is the transform angle*/
	height: 100%;
	-ms-transform: skew(-45deg, 0deg);
	-moz-transform: skew(-45deg, 0deg);
	-webkit-transform: skew(-45deg, 0deg);
	-o-transform: skew(-45deg, 0deg);
	transform: skew(-45deg, 0deg);
	overflow: hidden;
	border-left: 1px solid #dddddd;
	border-right: 1px solid #dddddd;
	border-top: 1px solid #dddddd;
}

.table-header-rotated th.rotate-45 span {
	-ms-transform: skew(45deg, 0deg) rotate(315deg);
	-moz-transform: skew(45deg, 0deg) rotate(315deg);
	-webkit-transform: skew(45deg, 0deg) rotate(315deg);
	-o-transform: skew(45deg, 0deg) rotate(315deg);
	transform: skew(45deg, 0deg) rotate(315deg);
	position: absolute;
	bottom: 30px;
	/* 40 cos(45) = 28 with an additional 2px margin*/
	left: -25px;
	/*Because it looked good, but there is probably a mathematical link here as well*/
	display: inline-block;
	width: 85px;
	/* 80 / cos(45) - 40 cos (45) = 85 where 80 is the height of the cell, 40 the width of the cell and 45 the transform angle*/
	text-align: left;
}

.judgingsummarytable td,
.judgingsummarytable th {
	text-align: center;
}

.nav-tabs .nav-item.show .nav-link,
.nav-tabs .nav-link.active {
	border-top-color: black !important;
	border-right-color: black !important;
	border-left-color: black !important;
}

.buttonfullwidth {
	width: 100%;
}

#judgingnav .nav-item {
	background-color: #999;
}

#judgingnav active {
	background-color: #ccc
}

.badformelement {
	background-color: #f05050;
}

/*
 * Bootstrap 4 styles ported over to current Boostrap 5
 */

.form-group {
	margin-bottom: 1rem;
}

.navbar {
	padding: 0.5rem 1rem;
}



/* Split.js */
.split,
.gutter.gutter-horizontal {
	float: left;
}

.split,
.gutter.gutter-horizontal {
	height: 360px;
}

.gutter {
	cursor: w-resize;
	height: 360px;
}

.gutter.gutter-horizontal {
	background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAeCAYAAADkftS9AAAAIklEQVQoU2M4c+bMfxAGAgYYmwGrIIiDjrELjpo5aiZeMwF+yNnOs5KSvgAAAABJRU5ErkJggg==');
}

.split {
	overflow-y: scroll;
	overflow-x: hidden;
}

.simpletable,
.simpletable th,
.simpletable td {
	border: 1px solid black;
	border-collapse: collapse;
}

.dropContainer {
	background-color: #f9f9f9;
	border: #ccc 4px dashed;
	text-align: center;
	padding: 12px;

}

.shortlistimage {
	max-height: 70vh;
}

.numberinputbox1 {
	width: 60px;
}

.numberinputbox2 {
	width: 12px;
}

.numberinputbox3 {
	width: 180px;
}

.rightalign {
	text-align-last: right;
}

#plannertooltip {
	position: absolute;
	background: #333;
	color: #fff;
	padding: 4px 8px;
	border-radius: 4px;
	font-size: 12px;
	display: none;
	pointer-events: none;
	z-index: 9999;
}

#plannercontainer {
	margin-top: 20px;
	width: 1150px;
	height: 680px;
	overflow-y: scroll;
	overflow-x: scroll;
}

#unassignedseats {
	max-height: 100vh;
	overflow-y: scroll;
}

#seatingplannerheader {
	z-index: 1020;
	top: 56px
}

.disableclicks {
	pointer-events: none;
}

.entryimagethumb {
	max-height: 80px;
	max-width: 200px;
}

.entryimagemedium {
	max-height: 500px;
}

.entryimagefullish {
	max-height: 80vh;
	max-width: 100%;
}

.imagefullview,
.judgeimagefullview {
	cursor: pointer;
}

#viewImageContent {
	text-align: center;
}

.judgeformdiv,
.judgeformdiv th,
.judgeformdiv td {
	background-color: #eee;
}

.judgeformdiv {

	border-radius: 10px;
	margin-bottom: 80px;

}

.selectedoption {
	border: 5px solid blue;
}

.unselectedoption {
	margin-top: 5px;
}

#actondiv {
	height: 50px;
	border: 2px solid black;
	font-weight: bold;
	line-height: 40px;
	background-color: #45D4DA;
	color: #851D1D;
	padding: 3px;
}

.bootstrapblue {
	color: rgb(13, 110, 253);
}

.tel-cc-dropdown {
	position: absolute;
	top: 100%;
	left: 0;
	z-index: 1000;
}

.tel-cc-list {
	max-height: 300px;
	overflow-y: auto;
}

.tel-cc-option {
	display: flex;
	gap: 10px;
	padding: 6px 12px;
	cursor: pointer;
}

html {
	scroll-padding-top: 70px;
}

.notesbutton {
	background-color: transparent;
	border-radius: 8px;
	border: 3px solid #111111;
	display: inline-block;
	cursor: pointer;
	color: #111111;
	font-family: Verdana;
	font-size: 10px;
	font-weight: bold;
	padding: 5px;
	text-decoration: none;
}

.notesbutton:hover {
	background-color: #03a1fc;
	color: #ffffff;
}

.notesbutton:active {
	position: relative;
	top: 1px;
}