/* CSS Document */

body {
	font-family: 'Open Sans', sans-serif; 
	font-size:1.75em;
}

.commonFrontPageOuterBox {
	display: flex;
	flex-direction: column;
	padding: 20px;
	min-width: 600px;
	width: 100%;
	background-color: #fafafa;
}

.commonFrontPageIntermediateBox {
	display: flex;
	flex-direction: column;
	align-items: center;
}

.commonFrontPageUpperBox {
	width: 100%;
	max-width: 1150px;
	min-height: 100px; /* so header lays out properly if javascript is disabled */
}

.commonFrontPageLowerBox {
	width: 100%;
	margin-top: 20px;
	max-width: 1150px;
	display: flex;
	flex-direction: row;
	column-gap: 20px;
}

.commonFrontPagePresentationsBox {
	flex: 1;
	background-color:white;
	border: 1px solid #ddd;
}
.commonFrontPageMenuBox {
	flex: 0 0 300px;
	background-color:white;
	border: 1px solid #ddd;
	font-size: 0.8em;
	padding: 10px;
}

.frontPageMenuItem {
	margin-bottom: 10px;
}

.loading_blocker {
	position: fixed;
	top:0;
	bottom:0;
	left:0;
	right:0;
	background: black;
	z-index: 99;
	opacity: 0.7;
}

.loading_message {
	position: fixed;
	width: 100%;
	height: 100%;
	z-index: 100;
	text-align: center;
	padding-top: 2em;

}

.loading_message span {
	font-size: 2em;
	color:white;
	background-color:black;
	-webkit-border-radius: 15px;
	-moz-border-radius: 15px;
	border-radius: 15px;
	padding: 0.3em;
}

/* classes to be used by elements that wish to be different
depending on whether or not js is enabled */
.js-disabled-warning {
	font-size:0.8em;
	color:red;
	border:1px solid red;
	margin:10px;

}

.js-disabled-warning-small {
	font-size:0.7em;
	margin:10px;
	text-align:justify;
}

/* classes to be used by elements that wish to be on/off
depending on whether or not js is enabled */
.main-page-hide-content {
	display: none !important;
}

.main-page-show-content {
	display: inherit !important;
}

.main-page-header-wrapper {
	position: relative;
}

.main-page-header {
	position:absolute;
	left:0;
	right:0;
	display:flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: flex-start;
	color:white;
	z-index: 3;
}

.main-page-header-cell {

}

.main-page-header-cell-center {
}

.main-page-header-icon {
	flex: 0 0 50%;
}

.main-page-header-icon img {
	width: 100%;
	filter: drop-shadow(0 0px 3px rgba(255, 255, 255, 0.7));
}

.main-page-header-right {
	color: white;
	margin: 10px;
	display: flex;
	column-gap: 20px;
	flex-direction: row;
}

.main-page-header-right div {
	cursor: pointer;
	filter: drop-shadow(0 0px 6px rgba(0, 0, 0, 0.1));
	background-color: rgba(0,0,0,0.1);
	box-shadow: 0px 0px 7px 5px rgb(0 0 0 / 10%);
}

.main-page-header-right img {
	padding-right: 5px;
}

.main-page-header-right a {
	text-decoration: none;
	color: white;
}

.be-notified-link {
	white-space: nowrap;
}
.be-notified-link * {
	white-space: normal;
}

.rss-feed-link a img {
	/* for some reason, spacing with the rss icon was looking off compared to the others... */
	padding-right: 0px;
	padding-bottom: 2px;
}

.contact-link {

}

.main-page-header-title {
	font-size:2em;
	text-align:center;
}

.main-page-header-title-small
{
	font-size: 0.6em;
	color: #888;
}

.main-page-topcontent {
	border-bottom: 1px solid #eee;
	padding: 10px;
}

.main-page-instructions {
	font-size:0.8em;
	margin-top:0.2em;
}

.main-page-quick-filter {
	float:right;
	padding-left:1em;
	padding-bottom:0.5em;
}

/* only on mobile, increase the font-size of the filter pulldown */
.main-page-quick-filter-mobile ul {
	font-size: 1.2em;
}

.quick-filter-dropdown{
	text-align:right;
}

.quick-filter-item {
	text-align:left;
}

.match-count {
	font-size:0.8em;
}

.main-page-custom-search {
	margin-top:10px;
	max-width:600px;
	margin-bottom:10px;
}

.main-page-custom-search .custom-search-label {
	display:inline;
	font-size:0.8em;
}

.main-page-footer {
	display:flex;
	justify-content: center;
	flex-wrap: wrap;
}

.main-page-footer div {
	text-align: center;
	margin: 0px 15px 10px 15px;
}

.container {
	width:100%;/* to make bootstrap grid entries be 'full width' */
}

.row {
}

.presentation-entry-row
{
	border-bottom:1px solid #ddd;
	display: flex;
	flex-direction: row;
	align-items: center;
	column-gap: 20px;
}

.presentation-entry-icon
{
	margin-top:10px;
	flex: 0 0 33%;
	margin-bottom: 10px;
}

.presentation-entry-icon img
{
	width: 100%;
}

.presentation-entry-icon-small
{
	display:none;
}

.presentation-entry-title
{
	font-size:1.3em;
	font-weight:bold;
}

.presentation-entry-description
{
	flex: 1;
	margin-top: 10px;
	margin-bottom: 10px;
}

.presentation-entry-date
{
}

.presentation-entry-posted 
{
	font-size:0.7em;
}

.presentation-entry-link
{
	font-size:1.3em;
	font-weight:bold;
}

.presentation-entry-navigable
{
}

.sidebar_separator {
	margin-top: 30px;
	border-top: 1px solid #efefef;
}

@media all and (max-width: 55em) {

	.presentation-entry-icon
	{
		display:none;
	}
	
	.presentation-entry-icon-small
	{
		float:left;
		display:inline;
		padding-right:0.3em;
	}
	
	.presentation-entry-icon-small img
	{
		max-width:100px;
	}

	.presentation-entry-title {
		font-size: 1.0em;
	}

	.presentation-entry-date {
		font-size: 0.8em;
	}
	.main-page-topcontent {
		padding:1em;
	}

	.main-page-header-right {
		zoom: 0.85;
	}
}

/* really narrow widths  */
/* 700px = 43.75em */
@media all and (max-width: 43.75em) {
	.cramped
	{
		display:none;
	}

	.main-page-header-right {
		zoom: 0.7;
	}
}

/* 600px = 37.5em (phone portrait) */
@media all and (max-width: 37.5em) {
	.commonFrontPageOuterBox
	{
		min-width: auto;
		font-size: 0.9em;
		padding: 0px;
	}

	.commonFrontPageLowerBox {
		margin-top: 0px;
	}

	.commonFrontPageMenuBox {
		display: none;
	}

	.main-page-header-right {
		flex-direction: column;
	}

	.main-page-header-icon {
		flex: 0 0 60%;
	}
}


.load-more-button {
	width: 100%;
	text-align: center;
	padding:2em;
}

.btn {
	border: 1px solid #ccc;
}

.btn-custom {
  background-color: hsl(0, 0%, 16%) !important;
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#5b5b5b", endColorstr="#282828");
  background-image: -khtml-gradient(linear, left top, left bottom, from(#5b5b5b), to(#282828));
  background-image: -moz-linear-gradient(top, #5b5b5b, #282828);
  background-image: -ms-linear-gradient(top, #5b5b5b, #282828);
  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #5b5b5b), color-stop(100%, #282828));
  background-image: -webkit-linear-gradient(top, #5b5b5b, #282828);
  background-image: -o-linear-gradient(top, #5b5b5b, #282828);
  background-image: linear-gradient(#5b5b5b, #282828);
  border-color: #282828 #282828 hsl(0, 0%, 11%);
  color: #fff !important;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.33);
  -webkit-font-smoothing: antialiased;
}

.white-caret {
	border-top: 4px solid white;
}

/* ------------ SOCIAL MEDIA ----------------*/

.socialMediaLinks {
	display: flex;
	flex-direction: column;
	row-gap: 6px;
	margin-top: 5px;
	margin-bottom: -7px;
}

.socialMediaLinks .fb-like {
	margin-left: -6px;
}

.socialMediaLinks .fb-like span {
	height: 30px !important;
}

.socialMediaLinks .fb-like iframe {
	height: 30px !important;
}


/* ------------ COMMON DIALOG (duplicate of css in common_m.css) -----------------*/

/* override for bootstrap modal backdrop opacity */
.jal-modal-backdrop-in {
	opacity: 0.85 !important;
}

.jal-contact-dialog {
	font-size: 14px;
}

.jal-contact-dialog .contact-dialog-form .control-label {
	text-align:left !important;
}

.jal-contact-dialog .form-horizontal .control-label {
	padding-top:5px;
}

.jal-contact-dialog .contact-dialog-form textarea {
	width:100%;
	resize:vertical;
	height:9em;
	border:1px solid #bbb;
}

.jal-contact-dialog .modal-body {
	background-color: #f7f7f7;
}

/* font-weight on labels: override bootstrap.min default */
.jal-contact-dialog label {
	font-weight:normal;
}

.jal-contact-dialog .modal-footer {
	margin-top:0;
}

.jal-contact-dialog .contact-form-error {
	background-color: #ffe7e7;
	padding-bottom: 12px;
	border: 1px solid #ffaaaa;
	margin-top: 3px;
}

.jal-contact-dialog .alert {
	margin-bottom:0px;
	border-radius:0px;
}

.jal-contact-dialog .contact-form-error-message {
	color: red;
	font-weight:bold;
}

.jal-contact-dialog .sequence-image {
	vertical-align:middle;
	margin-left: 7px;
	margin-bottom:3px;
	border:1px solid #ccc;
}

.jal-contact-dialog .contact-submit-in-progress img {
	width: 1.2em;
}

.jal-contact-dialog .contact-message-sent {
	position:absolute;
	top:0;
	left:0;
	right:0;
	bottom:0;
	background-color:#f7f7f7;
}

.jal-contact-dialog .contact-message-sent div {
	width:100%;
	text-align:center;
	margin-top:100px;

}

.jal-contact-dialog .contact-message-sending {
	opacity: 0.95;
}

.jal-contact-dialog .contact-message-sending div {
	opacity: 1.0;
}