#semcolumns {display:grid; grid-template-columns:23.5% 23.5% 23.5% 23.5%;grid-column-gap: 2%;}

.sem {margin-bottom:40px;vertical-align:top;clear:both;}
.sem::after{clear:both;}
.sem p, .sem h2, .sem h3, h2.category{margin: 0 0 4px 0 !important;padding:0 !important;}
.sem h2 a, .sem h2 a:visited {color:#343848;}
.sem h3 {color:#db5f46;}
.sem a, input#submit.sem-register{cursor:pointer;}

.categorylist a {text-decoration: none;}
.categorylist a.selected {border-bottom: 1px solid #db5f46;}

.semfull {width:100%;height:auto;overflow:hidden;margin: 0px 0px 10px 0px;}
.semfull img {width:100%;}

.semright {max-width:60%;width:400px;height:auto;overflow:hidden;margin: 0px 0px 10px 10px;float:right;-moz-box-sizing: border-box;-webkit-box-sizing: border-box;box-sizing: border-box;}
.semright img {width:100%!important;object-fit: contain;}

.sem .attendees {font-style: italic;}
.sem .toofew {color:red;}
.sem a {text-decoration: underline;}
.sem p.cost {font-size:150%; color: #db5f46;margin-bottom: 0!important;}
.sem p.smallcost {font-size:90%; color: #db5f46;}
.sem p.smallcost a, .sem p.smallcost a:visited {color: #db5f46;}
.sem .available {color:#db5f46;}

/* Registration Form */
#semregistration {margin-bottom: 20px;scroll-margin-top: 60px;}
.sem .registration-form {width:40%;}
.sem_input {width:100%;border:1px solid #415063;-moz-box-sizing: border-box;-webkit-box-sizing: border-box;box-sizing: border-box;overflow:hidden;}
#semregistration .validator {margin-left: -999px;height:0;}
.sem div.inputlabel{margin: 6px 0 2px 0;}
.sem div.forminput{margin: 0;}
.sem input[type=text], .sem input[type=number], .sem select {-webkit-appearance: none;padding: 4px;font-family: inherit;font-size: inherit;height:auto!important;width: 100%;box-sizing: border-box;border: 1px solid #003e7e;background:#ffffff;}
.sem select {width: 3em;text-align: center;}
.sem .semsubmit {font-family: inherit;font-size: inherit;height:auto;width: 100%;box-sizing: border-box;line-height:normal;margin: 12px 0 3px 0;padding: 6px;background: #003e7e;color:#FFF;text-align: center;cursor: pointer;border:none;}
.sem .semsubmit:hover {background-color: #1A82C7;}

.sem #toomany {display:none; color:red; font-weight: 900; text-align: center;}

.sem .peoplenumbers {margin-top: 6px;}
.sem .peoplenumbers table {width:100%;border-collapse: collapse;}
.sem .peoplenumbers table td {padding:0 0 6px 8px; text-align: right;}
.sem .peoplenumbers table td:first-child {text-align: left;padding-left:0px;}

.sem .peoplenumbers .totalvalue {font-size: 1.2em; font-weight: 900;}
.sem .peoplenumbers .totalvalue td:last-child {text-align: left;}

.error_blurb { display: block;color: red;margin-bottom: 12px; }

#hidenames {display:none;}

.sem .registration-content {margin-bottom: 12px;}
.sem .thankyoutitle {color: #003e7e;font-weight: 900;font-size: 22px;margin-bottom: 12px;}
.sem .thankyoublurb {font-size: 18px;color: #1A82C7;}

/* Error */
.sem #error {display:none;color:red;font-weight: 900;}
.sem input[type=text].warning, .sem input[type=number].warning {border: 1px solid #db2032;}

/* Submitting Animation */
.sem_working_loading {font: 4em Impact;color: rgba(6, 115, 152, 1);text-align: right;line-height: 1em;}
.sem_buttons_working { display: none;width: 40%;}
.sem_working_loading:after {content: ' .';animation: dots 1s steps(5, end) infinite;color: rgba(6, 115, 152, 1);}

@keyframes dots {
	0%, 20% {
		color: rgba(6, 115, 152, 0);
		text-shadow:
			-.25em 0 0 rgba(6, 115, 152, 0),
			-.5em 0 0 rgba(6, 115, 152, 0);
	}
	40% {
		color: rgba(6, 115, 152, 0);
		text-shadow:
			-.25em 0 0 rgba(6, 115, 152, 0),
			-.5em 0 0 rgba(6, 115, 152, 1);
	}
	60% {
		color: rgba(6, 115, 152, 0);
		text-shadow:
			-.25em 0 0 rgba(6, 115, 152, 1),
			-.5em 0 0 rgba(6, 115, 152, 1);
	}
	80%, 100% {
		color: rgba(6, 115, 152, 1);
		text-shadow:
			-.25em 0 0 rgba(6, 115, 152, 1),
			-.5em 0 0 rgba(6, 115, 152, 1);
	}
}

.openmodal {margin-top: 12px;} 

/* The Modal */
#sem_help.modal, #sem_fees.modal, #sem_cutoff.modal {
	display: none;
	position: fixed;
	z-index: 1;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	overflow: auto;
	background-color: rgb(0,0,0);
	background-color: rgba(0,0,0,0.4);
}

/* Modal Content */
#sem_help .modal-content, #sem_fees .modal-content, #sem_cutoff .modal-content {
	background-color: #fefefe;
	margin: auto;
	padding: 12px;
	border: 1px solid #888;
	width: 80%;
	border-radius: 4px;
	position: relative;
	top: 50%;
	transform: translateY(-40%);
}

#sem_help .modal-content h2, #sem_fees .modal-content h2, #sem_cutoff .modal-content h2 {
	color: #343848; font-size: 20px; font-weight: 900;padding:0;margin:0;
}

/* The Close Button */
#sem_help .closemodal, #sem_fees .closefees, #sem_cutoff .closecutoff {
	color: #aaaaaa;
	float: right;
	font-size: 28px;
	font-weight: bold;
}

#sem_help .closemodal:hover,
#sem_help .closemodal:focus,
#sem_fees .closefees:hover,
#sem_fees .closefees:focus,
#sem_cutoff .closecutoff:hover,
#sem_cutoff .closecutoff:focus {
	color: #343848;
	text-decoration: none;
	cursor: pointer;
}

@media only screen and (max-width: 960px) {
	#semcolumns {grid-template-columns:32% 32% 32%;grid-column-gap: 2%;}
	.sem h2 {font-size:1.4em;}
	.sem h3 {font-size:1.2em;}
	.sem .registration-form {width:60%;}
}

@media only screen and (max-width: 600px) {
	#semcolumns {display:grid; grid-template-columns:49% 49%;grid-column-gap: 2%;}
	.semright {max-width:40%;width:300px;}
	.sem .registration-form {width:100%;}
}
/*
	Overrides
*/
.sem .hide { display: none !important; }