/*
https://csfla.org/css/csf-responsive.css
The responsiveness stylesheet for the Christian Schools of Florida web site
by Engaging http://engaging.net
Last modified: 2020 Feb 24

/*******************
TABLET, DESKTOP ONLY --->>>
Some things we definitely only want for tablet, desktop
(Beginning steps towards mobile-first instead of mobile last)
********************/

@media only screen and (min-width: 750px)
{

	#about-info-box h2,
	#about-icon-close,
	#menu-icon-close,
	#main-services .icon-button-close {
		display: none;
	}

	#main h1.border-color-paynes-gray
	{
		text-shadow: -1px 0 #4B6876, 0 1px #4B6876, 1px 0 #4B6876, 0 -1px #4B6876;
	}
	#main h1.border-color-salmon
	{
		text-shadow: -1px 0 #BE6500, 0 1px #BE6500, 1px 0 #BE6500, 0 -1px #BE6500;
	}
	#main h1.border-color-orange
	{
		text-shadow: -1px 0 #FEA139, 0 1px #FEA139, 1px 0 #FEA139, 0 -1px #FEA139;
	}
	#main h1.border-color-mustard
	{
		text-shadow: -1px 0 #EDD42A, 0 1px #EDD42A, 1px 0 #EDD42A, 0 -1px #EDD42A;
	}
	#main h1.border-color-black
	{
		text-shadow: -1px 0 #000, 0 1px #000, 1px 0 #000, 0 -1px #000;
	}
	#main h1.border-color-white
	{
		text-shadow: -1px 0 #fff, 0 1px #fff, 1px 0 #fff, 0 -1px #fff;
	}

	#main-outer #main.fullscreen #title-holder.bg-color-black,
	#main-outer #main.homepage .title-holder.bg-color-black
	{
		background: rgba(0, 0, 0, 0.5);
	}
	#main-outer #main.fullscreen #title-holder.bg-color-white,
	#main-outer #main.homepage .title-holder.bg-color-white
	{
		background: rgba(255, 255, 255, 0.5);
	}
	#main.fullscreen #title-holder.color-mustard h1,
	#main.homepage .title-holder.color-mustard h1
	{
		color: #EDD42A; /* mustard */
	}
	#main.fullscreen #title-holder.color-salmon h1,
	#main.homepage .title-holder.color-salmon h1
	{
		color: #BE6500; /* salmon */
	}
	#main.fullscreen #title-holder.color-white h1,
	#main.homepage .title-holder.color-white h1
	{
		color: #fff; /* white */
	}
	#main.fullscreen #title-holder.color-paynes h1,
	#main.homepage .title-holder.color-paynes h1
	{
		color: #4B6876; /* paynes */
	}
	#main.fullscreen #title-holder.color-black h1,
	#main.homepage .title-holder.color-black h1
	{
		color: #222; /* black */
	}
	#main.fullscreen #title-holder h1.bg-color-black,
	#main.homepage .title-holder h2.bg-color-black
	{
		background: rgba(0,0,0,0.5);
	}
	#main.fullscreen #title-holder h1.bg-color-white,
	#main.homepage .title-holder h2.bg-color-white
	{
		background: rgba(255,255,255,0.5);
	}

	#main.fullscreen #title-holder.bg-color-black h1.bg-color-black,
	#main.fullscreen #title-holder.bg-color-black h2.bg-color-black,
	#main.fullscreen #title-holder.bg-color-black #blurb.bg-color-black p,
	#main.fullscreen #title-holder.bg-color-black h1.bg-color-white,
	#main.fullscreen #title-holder.bg-color-black h2.bg-color-white,
	#main.fullscreen #title-holder.bg-color-black #blurb.bg-color-white p,
	#main.homepage .title-holder.bg-color-black h1.bg-color-black,
	#main.homepage .title-holder.bg-color-black h2.bg-color-black,
	#main.homepage .title-holder.bg-color-black #blurb.bg-color-black p,
	#main.homepage .title-holder.bg-color-black h1.bg-color-white,
	#main.homepage .title-holder.bg-color-black h2.bg-color-white,
	#main.homepage .title-holder.bg-color-black #blurb.bg-color-white p
	{
		background: none;
	}

	#main.fullscreen #title-holder h1.bg-color-white,
	#main.fullscreen #title-holder h2.bg-color-white,
	#main.homepage .title-holder h1.bg-color-white,
	#main.homepage .title-holder h2.bg-color-white
	{
		background: rgba(255,255,255,0.5);
	}

	#main.fullscreen #title-holder h1.bg-color-dark,
	#main.fullscreen #title-holder h2.bg-color-dark,
	#main.homepage .title-holder h1.bg-color-dark,
	#main.homepage .title-holder h2.bg-color-dark
	{
		background: rgba(75,104,118,0.5);
	}

	#main.fullscreen #blurb.bg-color-black p,
	#main.homepage .blurb.bg-color-black p
	{
		background: rgba(0,0,0,0.5);
	}
	#main.fullscreen #blurb.bg-color-white p,
	#main.homepage .blurb.bg-color-white p
	{

		background: rgba(255,255,255,0.5);
	}
	#main.fullscreen #blurb.bg-color-dark p,
	#main.homepage .blurb.bg-color-dark p
	{
		background: rgba(75,104,118,0.5);
		border: 0;
	}

}

/*******************
* SMALLER DESKTOP <<<---
*********************/

/*******
Hide header tabs when screen too narrow and overwriting main-services menu
*******/


@media only screen and (max-width: 1350px)
{

	/*
	The huge payoff from doing everything in rems: we can maintain our full layout for a good while
	See also in csf-3rd-party-overrides.css
	*/

	html
	{
		font-size: 1.2vw;
	}

	#member-info-box,
	#admin-info-box
	{
		width: 61.8vw;
	}

	/* Because these niceties are not as obvious as some of the things that get ugly when tables are narrow */
	.consoles-display
	{
		margin: 1.5rem;
		padding: 0;
	}

		.console-inner
		{
			padding-left: 0.75rem;
			padding-right: 0.75rem;
		}
}

/*******
For portrait moda
*******/

@media only screen and (orientation : portrait)
{
	#main.fullscreen #hero-holder
	{
		min-height: 38.2%;
	}
}

/* Keep content readable at about 16px, the default size */
/* Shame there is no min-font-size but what to do */
/* Handle also the non-content exceptions to this within #content */
@media only screen and (max-width: 1200px)
{
	#main #blurb p,
	#main.fullscreen #blurb p,
	#main #content p,
	#main #content #dateline p,
	#main #content ul,
	#main #content ol,
	#main #content li,
	#main #content h2,
	#main #content #school-words-slideshow h3,
	#main #content .opportunity h2,
	#main #content .opportunity h3,
	#main #content #schools-words-slideshow .school .blurb p
	{
		font-size: 16px !important;
		line-height: 25.88px;
	}

	#about-info-box li,
	#main-services .info-box-content li,
	#main-services .info-box-content p
	{
	/*	font-size: 14px !important;
		line-height: 1.34 !important;
		margin-bottom: 0.75em;
	*/
	}

	#main-services .info-box-content li .school-name
	{
		font-size: 10px !important;
		line-height: 1 !important;
	}

	#main #content #school-and-legislative h2
	{
		font-size: 1.2vw !important;
	}

	#main-services .info-box-content li .event-title
	{
		font-weight: 400 !important;
	}

	#main-services ol
	{
		margin-left: 2.5em !important;
		padding-left: 0 !important;
	}

	#main-services ol li
	{
		text-indent: -2.75rem !important;
	}

	.console-title,
	fieldset legend,
	label,
	#main #content label h3
	{
		letter-spacing: 3.2px !important;
		line-height: 24px !important;
	}

	fieldset legend
	{
		font-size: 24px;
	}

	.form-holder p,
	.form-holder li,
	.form-holder input,
	textarea,
	.form-holder select
	{
		line-height: 24px;
	}

	#main #content blockquote p
	{
		width: auto;
	}

	#main #content h3
	{
		width: auto;
	}

	#main #content .opportunity h2
	{
		line-height: 20px;
	}

	#main #content #school-and-legislative h2
	{
		font-size: 1.125rem;
		line-height: 1.5rem;
	}

	/* font size within boxes a bit smaller even than at full size proportionately */
	#main #content .affiliation p,
	#main #content .affiliation ul,
	#main #content .affiliation li,
	#main #content .session p,
	#main #content .session ul,
	#main #content .session li,
	#main #content .opportunity p,
	#main #content .opportunity ul,
	#main #content .opportunity li,
	#main #content .school-news-item p,
	#main #content .school-news-item ul,
	#main #content .school-news-item li
	{
		font-size: 14px !important;
		line-height: 22.652px !important;
		width: auto !important;
	}

	#main.accreditation.explanatory-standards #content ol,
	#main.accreditation.explanatory-standards #content h2
	{
		width: 90%;
		max-width: 880px; /* from fullsize at 1201px */
	}

	/*************
	@MISSIONS
	*************/

	/* Removed #header-outer #member-info-box p from this after using iPad */
	#user-missions,
	.console,
	table.list.shrink p
	{
		font-size: 13px !important;
	}

	.console td .content-type
	{
		line-height: 1.15;
	}


	.console td .format
	{
		line-height: 13px;
	}

	.console-buttons .fa,
	.console .console-buttons p
	{
		font-size: 1rem !important;
	}

	.console-buttons
	{
		border-radius: 4px;
		margin-right: 4px;
		margin-top: 4px;
		width: 32px !important;
	}

	.maximized .console-buttons
	{
		top: 4px; /* required for sticky */
	}

	.console .console-buttons p,
	#main #content .console .console-buttons p
	{
		font-size: 4px;
	}

	.table-holder
	{
		padding-left: 0.75rem;
		padding-right: 0.75rem;
	}

	.console th p
	{
		font-size: 13px !important;
		line-height: 16.25px !important;
		letter-spacing: 1.3px !important;
	}


	/*************
	@FORMS
	*************/

	#main.forms,
	#main.views,
	.form-holder th
	{
		font-size: 16px !important;
	}

	#main.forms .form-holder,
	#main.views .form-holder
	{
		padding-bottom: 32px;
	}


	/*************
	@FIELDSET < FORMS
	*************/

	fieldset
	{
		width: auto;
		margin: 16px;
		min-width: 1rem !important;
	}

	/*************
	@FIELD < FIELDSET
	*************/

	.field
	{
		margin: 16px;
		margin-bottom: 32px;
	}

	/*************
	@LABEL < FIELD
	*************/

	label,
	#main #content label
	fieldset.left-labels label,
	fieldset.save
	{
		margin-left: 1rem;
		margin-right: 1rem;
		display: block;
		float: none;
		margin-bottom: 0.25rem;
		text-align: left;
		width: auto;
	}


	label h3,
	fieldset.left-labels label h3
	{
		float: none !important;
		width: auto !important;
		margin-left: 0 !important;
		margin-right: 0 !important;
		min-width: none !important;
	}

	.form-holder h3
	{
		font-size: 16px;
		line-height: 25.88px;
	}

	label p,
	label ul,
	label ol,
	fieldset.left-labels label p,
	fieldset.left-labels label ul,
	fieldset.left-labels label ol
	{
		float: none !important;
		width: auto !important;
		font-size: 16px;
		line-height: 20px !important;
		margin-left: 0;
		margin-right: 0 !important;
	}

	label li,
	fieldset.left-labels label li
	{
		line-height: 20px !important;
	}


	/*************
	@INPUT-HOLDER < FIELD
	*************/

	.input-holder
	{
		clear: left;
		display: block;
		width: auto;
		margin-left: 1rem;
		margin-right: 1rem;
	}

	fieldset.save 	.input-holder
	{
		display: inline-block;
	}

	#participants-list
	{
		width: auto;
		margin-left: 1rem;
		margin-right: 1rem;
	}

	select,
	textarea,
	input[type="text"]
	{
		font-size: 16px;
		line-height: 24px;
	}

	/*************
	@FIELDSET.SAVE < FORM
	*************/

	input[type="submit"],
	input[type="button"]
	{
		background: #FEA139;
		border-radius: 16px;
		font-size: 20px;
		height: 48px;
		line-spacing: 2px;
		margin: 16px;
		min-width: 160px;
		opacity: 1;
		padding: 8px 32px;
		transition: all 0.1s;
	}

	.server-response.system
	{
		font-size: 24px;
	}
}

/*******************
@MOBILE
*******************/

@media only screen and (max-width: 750px)
{

	html
	{
		font-size: 1rem;
		overflow-x: hidden;
	}

	body {
		overflow-x: hidden;
	}

	a:hover
	{
		cursor: pointer;
		color: inherit;
	}

	/*
	.info-box-holder {
		position: static;
	}

	#main-services .info-box-holder {
		position: relative;
	}
	*/

	#main #content .dropcap,
	#main .content .dropcap
	{
		margin-right: 0.05em;
	}

	.mobile-only
	{
		display: block;
	}

	.desktop-only,
	.mobile-hide
	{
		display: none;
	}

	#wrapper {
		padding-top: 0rem;
	}


	/*************
	@HEADER
	*************/

	#header-outer
	{
		height: auto;
	}

		#header {
			display: flex;
			flex-wrap: nowrap;
			justify-content: space-around;
			line-height: 1;
			transition: all 0.5s ease;
			height: 5rem; /* testing to fix wiggle */
		}

		#header #tabs #jobs-map-caller
		{
			display: none;
		}

		#header #tabs #menu-caller-holder {
			display: inline-block;
		}

		#header #tabs #map-caller,
		#header #tabs #menu-caller-holder
		{
			background: none;
		}

		#header #tabs #map-caller {
			margin-top: 0.5rem !important;
		}

		#header #tabs .mobile-menu:hover,
		#header #icons .mobile-menu:hover {
			cursor: pointer;
		/*	color: #EDD42A !important; */
		}


		#header #tabs #map-caller-text
		{
			display: none;
		}

		#header #tabs #map-caller-icon,
		#header #tabs #menu-caller
		{
			padding: 0;
			color: #fff;
			cursor: pointer;
			border-radius: 50%;
			width: 2.25rem;
			height: 2.25rem;
			text-align: center;
		}

		#header #tabs #map-caller-icon:hover
		{
			color: #EDD42A;
		}

	#header #icons-outer
	{
		top: auto;
		z-index: 20;
		max-height: 4rem;
	}

		#font-size-buttons {
			display: none;
		}

		#member
		{
			padding-right: 0.25rem;
			width: 100%;
			float: none;
			vertical-align: inherit;
		}

			#member .fa {
				padding: 0;
			}

			#member-info-box
			{
				text-align: center;
				left: auto;
			}

				#member-info-box .console
				{
					float: none;
				}

				#member {
					padding-right: 0;
				}

		#member-info-box-caller
		{
			top: 0.25rem;
		}

		#logged-in-person-name
		{
			float: right;
			clear: right;
			padding-top: 0.25rem;
			padding-right: 0.5rem;
			font-size: 0.9rem;
			line-height: 1.25;
		}

		#tabs-outer,
		#header #icons-outer
		{
			margin-top: 2rem;
			margin-top: 1.5rem;
			font-size: 1rem;
			border-spacing: 0;
			height: auto;
			max-height: 4rem;
			position: static;
		}

		#tabs-outer {
			order: 1;
			display: block;
			flex-grow: 2;
		}

		#header-inner {
			order: 2;
		}

		#header #icons-outer {
			order: 3;
			flex-grow: 2;
		}

			#roles-holder {
				display: none;
			}

			#tabs,
			#icons {
				display: flex;
			/*	height: 100%; */
				justify-content: space-evenly;
				align-items: center;
			}

				#tabs > div,
				#header-outer #icons > div
				{
					min-width: auto;
					padding: 0.5rem;
					/* border: 1px solid #fff; */
					border-radius: 0.5rem;
					width: 2rem;
					height: 2rem;
					text-align: center;
					margin-top: 0.5rem;
					margin-bottom: 0.5rem;

				}

				#menu-caller-holder {
					order: 1;
					margin-top: -2.5rem !important;
					margin-left: -0.75rem;
				}

				#map-caller {
					order: 2;
				}


					#tabs > div p,
					#header-outer  > div p {
						text-align: center;
						line-height: 1.125;
						line-height: 1;
					}

						#header-outer > div table.list p {
							text-align: left;
						}

						#header-outer #tabs .icon-tab .fa,
						#header-outer #icons .icon-button .fa
						{
							font-size: 1.75rem !important;
							width: 2rem; /* centers icons */
							line-height: 1.75rem !important;
						}

			#about-info-box-holder {
				text-align: right;
			}

				#header-outer #icons #about-button-holder {
					display: block;
					margin-top: 0.5rem !important;
					margin-bottom: 0 !important;
				}

					#about-button {
						cursor: pointer;
					}

			#tabs #map-caller {
				display: block;
				margin-top: 2rem !important;
				margin-bottom: 0 !important;
			}

		#header #menus-outer
		{
			top: auto;
			bottom: 0;
			left: 0;
		}

			#admin-info-box-caller
			{
				padding-left: 0;
			}

		#header-inner
		{
			max-width: none;
			padding-top: 0;
			padding-bottom: 0rem;
			padding-left: 0.5rem;
			padding-right: 0.5rem;
		}

		#header-inner #masthead-outer
		{
			padding: 0;
			display: block;
			width: auto;
			position: static;
			margin-left: 0;
			margin-right: 0;
		}

			#header-inner #masthead-outer #masthead
			{
				display: block;
				position: static;
			}

				#header-inner #masthead-outer #masthead > div
				{
					display: inline-block;
				}

				#header-inner #masthead-outer #masthead div#about-info-box-holder {
					display: none;
				}


					#header-inner #masthead-outer #masthead > div#sitename-holder,
					#header-inner #masthead-outer #masthead > div #about
					{
						display: none;
					}

					.crest-holder
					{
						padding-top: 0;
					}

						#header .crest
						{
							padding-top: 0;
						}

					#header-inner #masthead-outer #masthead #sitename-holder,
					#header-inner #masthead-outer #masthead #about-info-box-holder
					{
						with: auto;
					}

					#header-inner #masthead-outer #masthead #about-info-box-holder p
					{
						line-height: 1.34;
					}

			#header-inner #masthead-outer #masthead #logo-holder
			{
				padding: 0;
				display: block;
				margin-top: -0.75rem;
				margin-top: 0;
				margin-top: -0.025rem;
				margin-bottom: -0.75rem;
				margin-bottom: -1rem; /* looks better on phone */
				flex-direction: column;
				margin-bottom: -1.25rem; /* looks better on phone */
			}

				#header-inner #masthead-outer #masthead #logo-holder a {
				}

					#header-inner #masthead-outer #masthead #logo-holder a img
					{
						width: 4.625rem;
						margin-top: 1.75rem;
						margin-top: 1.25rem;
					}

				#search-box {
					top: -0.2rem;
					left: calc(-50vw + 2rem);
					text-align: center;
					margin-left: 0;
					margin-right: 0;
					width: 100vw;
				}

					#search-box input[type="text"] {
						text-align: left;
						width: 16rem;
						margin-left: auto;
						margin-right: auto;
						border-top: 0;
					}

					#search-icon {
						display: none;
						text-align: right;
					}


				#livesearch-results {
					margin-top: 4.5rem;
					margin-left: 0.5rem;
					width: calc(100vw - 3.5rem);
				}

					#livesearch-results .results-notice {
						text-align: center;
					}


			#header-inner #masthead-outer #masthead #sitename-holder h1
			{
				font-size: 1rem;
			}

			#header-inner #masthead-outer #masthead #about-info-box-holder p
			{
				font-size: 1rem;
			}

			/************
			@main-services
			*************/

			#header-inner #main-services
			{
				display: none;
				height: 0;
				margin-top: 1rem;
				opacity: 0;
				padding-top: 0.75rem;
				transition: all 0.5s ease;
			}

			#header-inner #main-services.on {
				display: block;
				opacity: 1;
				height: auto;
			}

				#main-services h2 {
					color: #4B6876 !important;
					margin-top: 0.5rem;
					margin-bottom: 1rem;
					text-align: left;
					width: auto;
					padding-left: 1.25rem;
					padding-top: 1rem !important;
					padding-bottom: 0;
					letter-spacing: 0.9px;
					text-transform: uppercase;
					font-size: 1.125rem;
					font-weight: 400;
					font-family: "Gotham SSm A", "Gotham SSm B", Arial, Helvetica, sans-serif;
				}

				#wrapper.reverse #main-services p .menu-spawner
				{
					color: #fff !important;
				}

				#main-services .menu-spawner:hover {
					cursor: pointer !important;
				/*	color: #EDD42A !important; */
				}


				#header-inner #main-services ul#top-level
				{
					display: block;
					padding-left: 0;
					margin-left: -9rem;
					margin-right: -9rem;
					margin-top: 0;
					margin-bottom: 1rem;
					padding-bottom: 0.75rem;
					border: 0.1rem solid #fff;
					border-radius: 0.5rem;
					z-index: 99;
					background: #4B6876;
				}

				#header-inner #main-services li.info-box-holder {
					padding-top: 0.5rem;
					margin: 0;
				}

				#header-inner #main-services ul#top-level > li
				{
					display: block;
					width: auto;
					text-align: center;
				}

					#main-services .info-box-caller {
						position: relative;
						cursor: pointer;
					}

						#header-inner #main-services ul#top-level > li p {
							padding-left: 1.25rem;
							padding-right: 1.25rem;
							font-size: 0.9rem;

						}

				#header-inner #main-services .spawned
				{
					z-index: 99 !important;
				}

					#header-inner #main-services ul#top-level li p.top-level
					{
						margin-top: 0.75rem;
						margin-bottom: 0;
						line-height: 1.34em;
						/* color: #fff; */
						text-align: center;
						min-height: 2.5rem; /* stop the bounce when selecting and a line goes away */

					}

				#main-services ol
				{
					margin-left: 1.5em !important;
				}

					#main-services ol li
					{
						text-indent: -1.75em !important;
					}

				#main-services .info-box {
					overflow: auto;
					top: 0;
					right: 0;
					left: 0;
					margin-left: 0;
					margin-top: 0;
					margin-right: 0;
					width: 100%;
					/*
					margin-left: 2rem;
					margin-right: 2rem;
					width: calc(100% - 4rem - 4px);
					height: 100vh;
					position: fixed;
					z-index: 999;
					*/
				}

				#main-services .icon-button-close {
					position: absolute;
					color: #EDD42A;
					z-index: 999;
					right: 0;
					font-size: 5rem;
				}

					#main-services .info-box-content
					{
						padding-top: 1rem;
					}
					#main-services .info-box-content.move-up
					{
						padding-top: 0;
					}

						#main-services .info-box-content li,
						#main-services .info-box-content p
						{
							-webkit-overflow-scrolling: touch;
							overflow: visible;
							font-size: 1rem !important;
						}

						#main-services .info-box-content h3 {
							margin-top: 0.75rem;
							margin-bottom: 0.75rem;
						}

	.info-box-caller
	{
		position: static;
	}

	/*************
	@INFO-BOX < HEADER
	*************/

	.info-box-holder {
		max-width: 100%;
	}

		.info-box
		{
			/*
			width: calc(100vw - 1rem) !important;
			width: 100% !important;
			right: auto !important;
			left: auto !important;
			top: 0 !important;
			padding: 0 !important;
			*/
			/* padding: 0.5rem !important; */
			border-width: 0.125rem;
			border-left-width: 0;
			border-right-width: 0;
			/*
			border-top-left-radius: 0;
			border-top-right-radius: 0;
			*/

			margin: 0;
			box-shadow: 0 0.25rem 0.75rem rgba(75, 104, 118, 0.7); /* Payne's Gray */
		}

			table.list
			{
				border-spacing: 0;
				margin-bottom: 1rem;
			}


	/*************
	@ABOUT-INFO-BOX < HEADER
	*************/

	#about-info-box {
		z-index: 21;
		right: 0 !important;
		border-top-width: 0;
		border-right-width: 0;
		width: auto !important;
		top: 0 !important;
		border-top-left-radius: 0;
		border-top-right-radius: 0;
		padding: 0 !important;
		width: 62%;
		position: fixed;


	/*	box-shadow: 0 0 0; */
	}

		#about-info-box h2 {
			color: #4B6876 !important;
			margin-top: 0;
			margin-bottom: 1rem;
			text-align: left;
			width: auto;
			padding-left: 1.25rem;
			padding-top: 0.75rem;
			padding-bottom: 0;
		}

		#about-info-box ul {
			margin-bottom: 1.5rem;
		}

		#header-inner #masthead-outer #masthead #about-info-box-holder p,
		#about-info-box li {
			text-align: left;
			font-size: 1rem !important;
			margin-bottom: 0.5rem !important;
		}

			#header-inner #masthead-outer #masthead #about-info-box-holder p#about-close {
				text-align: center;
				width: 3rem;
			}


	/*************
	@ADMIN-INFO-BOX < HEADER
	*************/

	#admin-info-box-holder
	{
	}

		#admin {
			position: fixed !important;
			bottom: 0.25vh;
			left: 0.125rem;
			background: #BE6500;
			background: #B23A48;
			background: #735f3d;
			border-radius: 50%;
			border: 0.125rem solid #eee;
			padding: 0.67rem;
			text-align: center;
		}

		#header-outer #admin.icon-button .fa {
			font-size: 1.5rem;
		}

		#admin-info-box.active {
			width: 100vw !important;
			z-index: 90;
			text-align: center;
		}

			#header-outer #menus #admin-close.icon-button-close {
				margin-top: 0 !important;
				margin-right: 0;
				height: 5rem;
				width: 3rem;
			}
				#admin-icon-close {
					margin-right: 0 !important;
					margin-top: 0 !important;
				}

					#admin-close .fa {
						color: #edd42a !important;
						font-size: 3.5rem !important;
						line-height: 3rem !important;
						border-radius: 50% !important;
					}

			#admin-info-box .info-box-content {
				padding-left: 0;
				padding-right: 0;
			}



				#admin-info-box .console {
					float: none;
					width: calc(100% - 2rem);
				}

				#admin-menu.console {
					margin-left: auto !important;
					margin-right: auto !important;
				}


		#jquery-live-search {
			max-width: 40vw;
			left: 0 !important;
			padding: 0;
		}

			#lookup-member-select {
				margin: 1rem;
				max-width: 100vw;
				overflow: hidden;
				padding-top: 0.5rem;
			}

				#lookup-member-select ul {
					max-width: 100vw;
				}

					.log-in-as-list li {
						padding-bottom: 1.5rem !important;
					}

						#lookup-member-select li p {
							line-height: normal;
							margin: 0;
						}

			#lookup-search-results-select {
				background: yellow;
			}

	/*************
	@MEMBER-INFO-BOX < HEADER
	*************/

	#member-info-box-holder {
		position: static;
		margin-top: -2.5rem !important;
		margin-right: -0.75rem;
	}

		#member-info-box {
			left: auto !important;
			right: 0 !important;
			width: calc(100vw) !important;
			top: 0 !important;
			border-left: 0;
			border-right: 0;
			margin-right: 0;
			margin-left: 0;
			margin-top: 0;
			border-top: 0;
			padding: 0;
			border-top-right-radius: 0;
			border-top-left-radius: 0;

			border-width: 0.125rem;
			border-left-width: 0;
			border-right-width: 0;
		}

		#header-outer #member-info-box p {
			/* font-size: 1rem; */
			line-height: 1.25;
		}

		h2#logged-in-as {
			font-size: 1rem;
		}

		#logged-in-person-name {
			display: none;
		}

		#member-info-box #my-roles p.position-title a {
			padding-left: 0.5em !important;
		}

		#member-info-box table.list {
		}

		#header-outer #icons #member-close.icon-button.icon-button-close
		 {
			/* Don't get why needed */
			right: 1rem !important;
			/* doesnt help
			text-align: center;
			background: #fff;
			border-radius: 50%;
			width:
			*/
		}

			#member-icon-close {
				width: 100%;
			}

		#member-info-box .console h2.console-title .fa {
			margin-top: -3rem;
		}
		#member-info-box .console h2.console-title .fa.fa-briefcase
		{
			margin-top: -3.5rem;
		}
		#member-info-box .console h2.console-title .fa.fa-user
		{
			margin-top: -4rem;
		}

		#log-in .field:first-of-type {
			margin-top: 0;
		}

		#member-info-box table.list tbody tr
		{
			border-top: 0;
		}

		#member-info-box #my-roles p.position-title a {
			padding-bottom: 0.375rem;
			padding-left: 1.25rem !important;
		}

		#member-info-box .console {
			padding: 0.5rem;
		}

	/*************
	@CONSOLE
	*************/

	.console
	{
		margin: 0.5rem;
		display: block;
		font-size: 1rem !important;
		padding-left: 0;
		padding-right: 0;
		/* border-radius: 0.67rem; */
		max-width: 100%;
	}

	.console.tighten
	{
		padding-left: 0.75rem;
		padding-right: 0.75rem;
	}

		.console-inner {
			width: auto;
			margin-bottom: 0;
		}

			.console-title .form-url-title {
				padding-top: 0;
			}

				.console .table-holder {
					width: 100%;
					padding-left: 0 !important;
					padding-right: 0 !important;

				}

	.console p,
	.info-box p,
	#header-outer #member-info-box p {
		font-size: 95% !important;
	}

	h2.console-title {
		font-size: 1.125rem;
		line-height: 1.125;
		padding-top: 1rem;
		margin-top: 0;
	}

		h2.console-title .form-url-title {
			margin-top: 0.25rem;
			font-size: 0.85rem !important;
			line-height: 1.25 !important;
		}

	.icon-button-close,
	#header-outer #icons .icon-button.icon-button-close,
	#member-close,
	#about-close,
	#menu-close {
		z-index: 99;
		position: absolute;
		text-align: center;
		top: -0.125rem !important;
		right: -0.5rem !important;
		margin-top: 0 !important;
		top: 0 !important;
		right: 0 !important;
	/*	z-index: 99; */
	}

	#menu-close {
		/* right: auto !important; */
		/* left: 1.5rem; !important; */

	}

		#header-outer #icons .icon-button.icon-button-close .fa,
		#member-close .fa,
		#about-close .fa,
		#menu-close .fa {
			border-radius: 50%;
			font-size: 3rem !important;
			line-height: 3rem !important;
			color: #EDD42A !important;
			margin: 0 !important;
		}

		table.list thead th {
			border-bottom: 0;
		}

		table.list tbody {
			border-left: 1px solid #000;
			border-right: 1px solid #000;
			border-bottom: 0;
		}

		table.list tbody tr td {
			border-top-color: #fff;
		}

		.table.list tr::before {

		}

		.table.list tr::after {

		}


	/*************
	@HOMEPAGE
	*************/

	#content {
		width: 100%;
		overflow: hidden;
	}

	.display-outer {
		padding-bottom: 1rem;
	}

		.display {
			width: auto;
			padding-bottom: 1rem;
		}

	#main.homepage #content #schools-words-slideshow .school .blurb p {
		text-align: left;
	}

	/*************
	@MASTHEAD < HOMEPAGE
	*************/

	#main.homepage #mobile-homepage-masthead {
		display: block !important;
		background: #4B6876;
		margin-left: 0 !important;
		margin-right: 0 !important;
		padding-top: 0.75rem;
		padding-bottom: 0.25rem;

		padding-bottom: 1.25rem;

	}

		#main.homepage #mobile-homepage-masthead h1 {
			color: #EDD42A !important;
			font-size: 1.34rem !important;
			line-height: 1.75rem !important;
			margin-bottom: 0;
			margin-left: 0.5rem !important;
			margin-right: 0.5rem !important;
		}

		#main.homepage #blurb {
			margin-left: 3.75rem !important;
			margin-right: 0.5rem !important;
			margin-top: 0;
		}

			#wrapper.homepage #blurb p {
				color: #fff;
				font-size: 1.125rem !important;
				font-weight: 300 !important;
				line-height: 1.5;
				margin-bottom: 0 !important;
				margin-top: 0rem !important;
				text-align: left;
			}

	/*************
	@NEWS < HOMEPAGE
	*************/

	#news-outer.display-outer {
		padding-bottom: 2rem;
	}

	#main.homepage #news {
		display: flex;
		flex-direction: column;
		width: auto;
		padding-top: 1.5rem;
		padding-bottom: 0;
	}

		#news-feed-link {
			display: none;
		}

		#news-slideshow-holder,
		#school-and-legislative {
			float: none;
			width: auto;
		}

		#news-slideshow-holder {
			order: 1;
			width: 100%;
		}

			.flickity-page-dots {
				display: none;
			}

			#news-slideshow .flickity-prev-next-button {
				top: 1.5rem;
				z-index: 99;
			}

			#news-slideshow .flickity-prev-next-button.previous {
				left: 0.5rem;
			}
			#news-slideshow .flickity-prev-next-button.next {
				right: 0.5rem;
			}

			#main.homepage #news-slideshow .news-item .title-holder {
				height: auto;
				margin-top: 0.25rem;
				margin-bottom: 1rem;
				margin-left: 3.75rem;
				margin-right: 3.75rem;
			}

				#main.homepage #news-slideshow .news-item .title-holder h3 {
					font-size: 1.618rem;
					font-size: 1.25rem;
					line-height: 1.125;
					line-height: 1.25;
					position: static;
					margin-top: -0.25rem;
				}

				#main.homepage #news-slideshow .news-item h3 a:hover,
				#main.homepage #news-slideshow .news-item a:hover h3 {
					color: inherit;
					text-decoration: none !important;
				}

			#news-slideshow .news-item .hero-holder {
				padding-top: 1rem;
			}

			#news-slideshow .news-item .hero-holder .blurb {
				height: auto;
				/* margin-left: 3rem; */
			}

				#main.homepage #content #news .blurb p {
					margin-left: 0.75rem !important;
					margin-right: 0.75rem !important;
					margin-top: 0 !important;
					margin-bottom: 0;
					padding-top: 0.25rem;
					padding-bottom: 0;
					line-height: 1.34;
					text-align: left;
					/* width: calc(100% - 4.5rem); */
				}

			#main.homepage #content .news-item a:hover .blurb p {
				text-decoration: none;
			}


		#school-and-legislative {
			order: 2;
			display: flex;
			flex-direction: row;
			margin-top: 2rem;
		}

			#main.homepage #school-news,
			#main.homepage #legislative-updates {
				float: none;
				width: 50%;
			}

				#school-news-inner {
					margin-left: 0.25rem;
					margin-right: 0.125rem;
				}

				#legislative-updates-inner {
					margin-left: 0.125rem;
					margin-right: 0.25rem;
				}


				#main #content #school-and-legislative h2 {
					font-size: 0.8rem !important;
					line-height: 1.34;
					margin-left: 1rem !important;
					margin-right: 1rem !important;
					height: auto;
				}

				#main #content #school-news h3,
				#main #content #legislative-updates h3 {
					margin-left: 0.875rem;
					margin-right: 0.875rem;
					margin-left: 0.5rem;
					margin-right: 0.5rem;
				}

				#main.homepage .school-news-item,
				#main.homepage .legislative-update {
					margin-bottom: 0.25rem;
					padding-left: 0.5rem;
					padding-right: 0.5rem;
				}

				#main #content #school-and-legislative h2 .fa {
					top: 0;
				}

	/*************
	@SCHOOLS < HOMEPAGE
	*************/

	#main.homepage #schools-outer {
	}

		#main.homepage #schools {
			display: flex;
			flex-direction: column;
			width: auto;
			padding-top: 1.5rem;
			padding-bottom: 0;
		}

			#schools-words-outer {
				order: 1;
				width: auto;
			}

				#schools-words {
					margin-left: 0;
				}

					#schools-words-inner {
						margin-left: 0;
						padding-bottom: 0;
					}

						#main #content #schools-words-inner h2 {
							text-align: left;
							margin-bottom: 0;
							padding-bottom: 0;
						}

						#homepage-map-caller {
							display: none;
						}

						#main #content #schools-words-slideshow .school h3 {
							padding-left: 1.382rem;
							padding-right: 1.382rem;
							padding-top: 0;
							width: auto;

							padding-left: 3.75rem;
							padding-right: 3.75rem;
							padding-top: 0.75rem;
							line-height: 1.5;
						}

						#main #content #schools-words-slideshow .school .blurb p {
							max-width: calc(100vw - 2rem) !important;
							margin-top: 0.75rem !important;
							margin-left: 1rem !important;
							margin-right: 1rem !important;
						}

			#schools-slideshow-outer {
				order: 2;
				float: none;
				width: auto;
			}

				#schools-words-slideshow {
					margin-top: 0;
					background: none;
				}

					#main #content #schools-words-slideshow .school h3 {
						color: #000;
					}

					#schools-words-slideshow .manage-membership-bg {
						background: none !important;
					}

					#schools-words-slideshow .flickity-prev-next-button {
						top: 2.25rem;
						background-color: #735f3d;
						color: #fff;
					}

						#schools-words-slideshow .flickity-prev-next-button .arrow
						{
							fill: #FEA139;
						}

					#schools-words-slideshow .flickity-prev-next-button.previous {
						left: 0.5rem;
						right: auto;
					}
					#schools-words-slideshow .flickity-prev-next-button.next {
						left: auto;
						right: 0.5rem;
					}

					#schools-words-slideshow figure {
						margin-top: 1rem;
						background-color: #735f3d;
						padding-top: 0.5rem;
						padding-top: 1.125rem;
						padding-top: 1.5rem;
						padding-bottom: 0.5rem;
						padding-bottom: 1.125rem;
						padding-bottom: 1.5rem;
						display: block !important;
					}

						#schools-words-slideshow figure img {
							width: 100%;
							height: auto;
							display: block;
						}

					#main #content #schools-words-slideshow .school .blurb {
						padding-bottom: 0;
					}

						#main.homepage #content #schools-words-slideshow .school .blurb p {
							color: #000;
							text-align: left;
							font-weight: 200;
							padding-top: 0.5rem;
							padding-bottom: 0;
						}

				#schools-slideshow {
					display: none;
					padding-top: 0;
					padding-bottom: 0;
				}

					.school-logo-holder {
						display: none;
					}

					#schools-slideshow img {
						width: 100%;
					}

	/*************
	@ABOUTS < HOMEPAGE
	*************/

	#main #about-outer {
	}

	#main #about .display-inner {
		margin-top: 0;
	}

		#main #about header {
			background: #4B6876;
			margin-top: 2rem;
			margin-bottom: 0;
		}

		#main #about header:first-of-type {
			margin-top: 1rem; /* close up gap with school slideshow */
		}

			#main #about h1 {
				color: #fff;
				font-size: 1.34rem !important;
				line-height: 1.25 !important;
				margin-bottom: 0;
				margin-top: 0;
				padding-top: 1.382rem;
				padding-bottom: 1.382rem;
			}


		.about-image-holder,
		.about-blurbs {
			margin-top: 0;
			width: auto;
			float: none;
		}

		.about-image-holder {
			margin-left: 1rem;
			margin-right: 1rem;
			margin-left: 0;
			margin-right: 0;
		}

			.about-image-holder-inner,
			#about-accreditation .about-image-holder-inner {
				margin-left: 0;
				margin-right: 0;
				padding-top: 0;
			}

			.about-blurbs {
				margin-top: 1rem;
			}

			.about-blurbs-inner {
				margin-left: 0;
			}

				#main #content #about p {
					margin-bottom: 1rem;
				}

			#about-accreditation {
				display: flex;
				flex-direction: column;
			}

				#about-accreditation h1 {
					order: 1;
				}

				#about-accreditation .about-image-holder {
					order: 2;
				}

				#about-accreditation .about-blurbs {
					order: 3;
				}

	/*************
	@OPPORTUNITIES < HOMEPAGE
	*************/

	#opportunities-outer {
		padding-top: 2rem;
		padding-left: 0.5rem;
		padding-right: 0.5rem;
	}

		#main.school.homepage #content #opportunities-outer .console-title .fa {
			margin-top: -2.5rem !important;
		}

		.console-buttons {
			position: relative;
		}

			.console-buttons .fa,
			.console .console-buttons p {
				font-size: 1.75rem !important;
			}

		#main #content .console .console-buttons p {
			margin-left: auto !important;
			margin-right: auto !important;
		}

		#opportunities-outer h1 {
			margin-bottom: 1.5rem;
		}

		#opportunities {
			padding-top: 0;
		}

			.opportunity {
				width: auto;
				padding-bottom: 0;
				-webkit-overflow-scrolling: touch;
				max-height: none;
				min-height: 0;
			}

				.console-inner {
					margin-top: 0.5rem;
				}


					#main.school #content .opportunity h2 {
						margin-bottom: 0.75rem;
					}

					#main.school #content .opportunity .dateline {
						text-align: center;
					}

					#main #content .opportunity p {
						margin-left: 0 !important;
						margin-right: 0 !important;
					}


	/*************
	@MAIN
	*************/

	#main-outer {
	/*	z-index: -2; */
	}

		#main {
			display: flex;
			flex-direction: column;
		}

			#item-buttons
			{
				display: none;
			}

			.consoles-display {
				margin: 0.5rem;
			}

				.console {
					font-size: 1rem;
				}

			#main .cols {
				width: 100%;
			}

				#main .col-2 {
					width: 50%;
				}

				#main #content .col p {
					width: auto;
				}

			#main h1,
			#main #content h2,
			#main #blurb,
			#main.fullscreen #blurb,
			#main #content p,
			#main #content #dateline p,
			#main #content ul,
			#main #content ol,
			#main #content li {

				margin-left: 1.382rem !important;
				margin-right: 1.382rem !important;
				max-width: calc(100vw - 2.764rem) !important;
				padding-left: 0 !important;
				padding-right: 0 !important;
				width: auto;
			}

			/*************
			@TITLE-HOLDER < MAIN
			*************/

			#main #title-holder,
			#main.fullscreen #title-holder
			{
				padding-bottom: 0;
				order: 2;
				position: static;
				margin-bottom: 0.5rem;
			}

				#main h1
				{
					text-align: left;
				}
				#main.fullscreen h1 {
					text-align: left;
					letter-spacing: -0.0125em;
				}
				#wrapper.news #main h1 {
					color: #BE6500;
				}
				#main.fullscreen #title-holder.color-salmon h1,
				#main.fullscreen #title-holder.color-white h1,
				#main.fullscreen #title-holder.color-mustard h1
				{
					color: #d67643 !important;
				}

				#main h1,
				#main.fullscreen h1
				{
					font-size: 1.618rem !important;
					font-weight: 500;
					line-height: 1.125 !important;
					letter-spacing: 0 !important;
					margin-top: 1.25rem;
					margin-bottom: 0.5rem;x
					margin-bottom: 0.125rem;
				}

					h1 .fa {
						padding-top: 1rem;
						font-size: 5rem;
					}

					#main h1 .sub-title,
					#main.accreditation.strands h1 .sub-title,
					#main.accreditation.explanatory-standards h1 .sub-title
					{
						font-size: 1.25rem;
						letter-spacing: 0 !important;
					}


			/*************
			@BLURB < MAIN
			*************/

			#main #blurb,
			#main.fullscreen #blurb
			{
				margin-top: 0rem;
			}

				#main #content #blurb p,
				#main #content .blurb p,
				#main #blurb p,
				#main.fullscreen #blurb p {
					text-align: left;
					padding: 0 !important;
					margin: 0 !important;
					margin-bottom: 1.25rem !important;
					color: #000;
					font-weight: 400;
					font-size: 1.25rem;
					width: auto;
					display: block;
					background: none !important;
				}

			/*************
			@HERO-HOLDER < MAIN
			*************/

			#main #hero-holder,
			#main.fullscreen #hero-holder
			{
				order: 1;
				margin-top: 0;
				margin-bottom: 0;
			/*	min-height: 200px; */
				position: relative;
				background: #4B6876;
				transition: all 0.5s ease;
			}

			#main #hero-holder,
			#main #hero-holder #hero-image,
			#main #hero-holder iframe
			{
				width: 100%;
				height: auto;
			}

			#main #hero-holder.padded {
				width: auto;
				padding: 0.75rem;
				padding-bottom: 0;
			}

				#main #hero-holder #photo-credit
				{
					font-size: 0.618rem;
					line-height: 1.25 !important;
					right: 0.5rem;
					bottom: 0.5rem;
					font-weight: 400 !important;
					margin-bottom: 0;
				}
				#main #hero-holder.padded #photo-credit
				{
					right: 1.25rem;
					bottom: 1.25rem;
				}

				#main #hero-holder #photo-credit br {
					line-height: 0 !important;
				}

			/*************
			@CONTENT < MAIN
			*************/

			#content {
				order: 3;
			}

				#main #content #dateline {
					margin-bottom: 0 !important;
				}

					#main #content #dateline p,
					#main #content #dateline.centered p
					{
						margin-top: 0.5rem;
						text-align: left;
						margin-bottom: 0rem;
						font-size: 0.845rem !important;
						line-height: 1.5 !important;
					}

				#main #content p,
				#main #content li
				{
					font-weight: 200;
					line-height: 1.618;
					font-size: 1rem;
				}
				#main #content p.action {
					line-height: 1.34 !important;
				}
				#wrapper.news #main #content p.first {
					margin-top: 0.75rem; /* cos of nearby dateline, bring them closer */
				}

				#main #content li
				{
					margin-left: 0;
					margin-right: 0;
					margin-left: 1.318rem !important;
					margin-right: 1.318rem !important;
				}
				#main #content #about li {
					margin-left: 0 !important;
					margin-right: 0 !important;
				}

					#main #content ol ol {
						margin-left: 0 !important;
						margin-right: 0 !important;
					}

					#main #content blockquote
					{
						width: auto;
						padding-top: 0.25rem;
						padding-bottom: 0.25rem;
					}

						#main #content blockquote p
						{
							margin-left: 0.5rem !important;
							margin-right: 0.5rem !important;
						}

					#main #content h2
					{
						margin-top: 1.5rem;
						margin-bottom: 1.5rem;
					}

					#main #content h3
					{
						margin-top: 1.5rem;
						margin-bottom: 0rem;
						margin-left: 1.382rem;
						margin-right: 1.382rem;
						padding: 0;
						font-size: 1.125rem;
					}
					#wrapper.professional-development.goals #content h3,
					#wrapper.code-of-ethics #content h3
					{
						margin-bottom: 0rem;
						margin-left: 1rem;
						margin-right: 1rem;
						margin-top: 1rem;
						text-align: center;
						font-size: 2rem;
						color: #D67643;
					}
					#main.school #content .opportunity h3 {
						margin-left: 0 !important;
						margin-right: 0 !important;
					}

					#main.school #content .opportunity ul {
						margin-left: 0 !important;
						margin-right: 0 !important;
					}

						#main.school #content .opportunity ul li {
							margin-left: 1rem !important;
						}

			/*************
			@DATE-AND-NEXT-PREVIOUS < MAIN
			*************/

			#date-and-next-previous {
				order: 4;
			}

				#text-date-holder
				{
					width: auto;
					padding-top: 0;
					padding-bottom: 2rem;
					padding-bottom: 0;
				}

					#text-date-holder p
					{
						padding-top: 0;
						margin-top: 0.25rem;
						margin-bottom: 2rem;
					}

				#next-previous {
					width: auto;
					display: block;
					background: #4B6876;
					padding: 0.75rem 0.5rem 1.5rem;
					margin-top: 1.25rem;
					display: flex;
					justify-content: space-between;
					border-bottom: 0.825rem solid #6f8691;
				}

					#next,
					#previous {
						width: 100%;
						margin: 0;
					}

					#previous {
						padding-right: 0.5rem;
					}
					#next {
						padding-left: 0.5rem;
					}

						#next-previous label {
							margin-left: 0;
						}

						#next-previous a {
							color: #FEA139;
							font-size: 1rem;
						}
						#next-previous a:hover {
							color: #EDD42A;
						}

						#next-previous p {
							width: auto;
							line-height: 1.25;
						}

							#next-previous p br.hard {
								display: none;
							}

						#next-previous label {
							width: auto;
							margin: 0;
							margin-bottom: 0.25rem;
							line-height: 1.25 !important;
						}

	/*************
	@ACCREDITATION
	*************/

	#main.accreditation.strands h1
	{
		font-size: 2rem;
		line-height: 1;
		letter-spacing: -0.05em;
	}



	#main.accreditation.strands #blurb,
	#main.accreditation.strands #content .blurb
	{
		margin: 0;
	}
		#main.accreditation.strands #blurb p,
		#main.accreditation.strands #content .blurb p
		{
			line-height: 1.25;
		}

		#main.accreditation.strands #content .blurb {
			margin-left: 1.382rem;
			margin-right: 1.382rem;
		}

	#main.accreditation.strands #content ol ol
	{
		width: auto;
	}

	#main.accreditation #content ol li ul > li
	{
		margin-top: 0.5rem;
	}

	#main.accreditation #content h2
	{
		margin-bottom: -1rem !important;
	}

	#main #content #strand-main-display li,
	#main #content .strand-main-display li
	{
		margin-left: auto !important;
		margin-right: auto !important;
	}

		#main.accreditation #content li li
		{
			position: relative;
			margin-top: 1rem;
			margin-left: 0 !important;
			margin-right: 0 !important;
		}
		#main #content .strand-with-standards li ol li,
		#main #content #explanatory-standards li ol li
		{
			margin-bottom: 0;
			position: relative;
		}
		#main.accreditation #content li li::before
		{
			position: absolute;
			top: -1.25rem;
			left: 0;
		}

			#main.accreditation #content p
			{
				margin-left: 0 !important;
				margin-right: 0 !important;
			}

			#main.accreditation #content li li p.action
			{
				margin-top: -0.5rem !important;
			}

			#main.all.accreditation .strand-with-standards li ol > li.explanatory:before
			{
				content: "ES " counter(strand-item) "." counters(item, ".") " ";
			}

	/*************
	@EXPLANATORY STANDARDS < ACCREDITATION
	*************/

	#main.accreditation.explanatory-standards h1 {
		margin-bottom: 1rem;
	}

	#main.accreditation.explanatory-standards #content h2 {
		margin-top: 1rem;
		margin-bottom: 0.75rem !important;
	}

	#main.accreditation.explanatory-standards #content ol {
		margin-left: 0 !important;
		margin-bottom: 0 !important;
	}

	#main.accreditation.explanatory-standards ul {
		margin-bottom: 1.5rem;
	}

	/*************
	@SCHOOL
	*************/

	#main.school #title-holder {
		margin-top: 0.25rem;
		margin-bottom: 0;
	}

		#main.school h1 {
			margin-bottom: 0.75rem;
		}

		#main.school #blurb p {
			margin-top: 0.25rem;
			margin-bottom: 0.75rem;
		}

		#accreditation-status {
			position: static;
			text-align: left;
			transform: none;
			font-size: 0.82rem;
			width: auto;
			text-align: left;
			padding-left: 0.34rem;
			padding-top: 0.25rem;
		}

	#school-news-outer,
	#opportunities-outer {
		padding: 0.5rem;
		padding-bottom: 1rem;
		margin-top: 2rem;
	}

		#wrapper.schools #school-news,
		#opportunities {
			padding-top: 0.75rem !important;
			padding-bottom: 0.75rem !important;
		}

		#main #school-news-outer h1,
		#main #opportunities-outer h1 {
			text-align: center;
			margin-bottom: 1rem;
		}

			#main #school-news.consoles-display,
			#main #opportunities.consoles-display {
				padding-bottom: 1rem;
				margin: 0;
				padding: 0.5rem;
			}

				#wrapper.schools .school-news-item,
				#wrapper.schools .opportunity {
					width: auto;
					height: auto;
					max-height: inherit;
					min-height: inherit;
					overflow: auto;
					margin: 0;
					margin-bottom: 1rem;
					padding-left: 0.25rem;
					padding-right: 0.25rem;
					padding-bottom: 0;
				}
				#wrapper.schools .school-news-item:first-of-type,
				#wrapper.schools .opportunity:first-of-type
				{
					margin-top: 0;
				}
				#wrapper.schools .school-news-item:last-of-type,
				#wrapper.schools .opportunity:last-of-type {
					margin-bottom: 0;
				}

					#wrapper.schools .school-news-item img {
						width: 100%;
					}

					#wrapper.schools #main #content .school-news-item .school-news-item-inner {
						border: none;
						margin-bottom: 0;
					}

						#wrapper.schools #main #content #school-news h3 {
							margin-left: 0;
							margin-right: 0;
						}

						#wrapper.schools #content .school-news-item p {
							font-size: 1rem !important;
						}

						#wrapper.schools #main #content .school-news-item p,
						#wrapper.schools #main #content .opportunity p {
							margin-left: 0 !important;
							margin-right: 0 !important;
						}
						#wrapper.schools #main #content .school-news-item p:last-of-type{
							margin-bottom: 0;
						}

						#wrapper.schools #main #content .school-news-item p.read-more.system {
							text-align: right;
							font-weight: 100 !important;
						}

	#staff-and-students.display {
		padding-bottom: 0.5rem;
	}

		#staff p:first-of-type,
		#students p:first-of-type {
			margin-top: 0;
		}

		#special-programs {
			margin-top: 0;
		}

			#special-programs p.system {
				margin-top: 0;
			}

	#main.school #content #opportunities-outer {
		margin-top: 0;
	}

		#main.school #content #opportunities-outer h1 {
			margin-top: 1rem;
			margin-bottom: 0.75rem;
		}

			#main.school #content #opportunities-outer .fa {
				padding-top: 0;
			}

		#main.school #content .opportunity .dateline {
			margin-top: 0;
		}

		#main.school #content .opportunity .contact {
			margin-bottom: 0;
		}

		#wrapper.schools #content .opportunity p {
			font-size: 1rem !important;
		}


	/*************
	@STRAND
	*************/

	#main #content #strand-main-display > ol,
	#main #content #strand-main-display > ol > ol {

	}


	/*************
	@STAFF
	*************/

	#staff-outer {
		margin-top: 1rem;
		padding: 0.5rem;
	}

		#main #content #staff-outer h2 {
			margin-top: 0.5rem;
			margin-bottom: 1rem;
		}

		#staff,
		#committee {
			margin: 0;
			padding-top: 0.25rem;
			padding-bottom: 0.25rem;
		}

			.staffer {
				width: auto;
				padding-top: 0;
				min-height: 0;
				max-height: none;
			}

				#main #content .staffer .title {
				}

					#main #content .staffer h3.staffer-title {
						margin-left: 1rem;
						margin-right: 1rem;
						min-height: 0;
						margin-top: 1rem;
						margin-bottom: 1rem;
					}

				#main #content .staffer .pic-holder {
					margin-left: 0;
					margin-right: 0;
					margin-top: 0;
					width: auto;
					/* border: 1rem solid #BE6500; */
				}

					#main #content .staffer .pic-holder img {
						width: 100% !important;
					}

					#main #content .staffer h3 {
						font-size: 1.125rem !important;
						line-height: 1.5 !important;
					}

					#main #content .staffer h3.staffer-name
					{
						color: #fff;
						font-size: 1rem !important;
						margin: 0;
						min-height: auto;
						padding: 0.25rem 0.75rem;
						position: absolute;
						right: 0;
						top: -4.5rem;
						z-index: 99;
					}

				#main #content .staffer .part-2 {
					border-bottom: 0;
				}

					#main #content .staffer .part-2 p,
					#main #content .staffer .part-2 ul {
						margin-left: 1rem !important;
						margin-right: 1rem !important;
					}

				#main #content .staffer p,
				#main #content .staffer li {
					font-size: 1rem !important;
					line-height: 1.618 !important;
				}

		#main #content #staff-outer h2#exec-committee-header {
			margin-top: 1rem;
		}

	/*************
	@AFFILIATIONS < ABOUT
	*************/

	#affiliations-outer {
		margin-top: 1rem;
		padding: 0.5rem;
	}

		#affiliations {
			padding-top: 0;
		}

			.affiliation {
				margin: 0.5rem;
				width: auto;
				min-height: 0;
				max-height: none;
				opacity: 0.9;
			}

				.affiliation .logo-holder {
					margin-top: 1rem;
				}

				#main #content .affiliation p,
				#main #content .affiliation li {
					font-size: 1rem !important;
					margin-left: 1rem !important;
					margin-right: 1rem !important;
				}

	/*************
	@MEETINGS
	*************/

	#main.meeting #title-holder p.date {
		font-size: 1rem;
		text-align: left;
		margin-left: 1.618rem;
		margin-right: 1.618rem;
	}

	#main.meeting h2 {
		display: none;
	}

	#hosting-and-lodging.display {
		padding-bottom: 0;
	}

	#main.meeting .cols {
		width: auto;
	}

		#main.meeting .col {
			float: none;
			width: auto;
		}

		#main.meeting #content #host-school img {
			line-height: 1rem;
		}

		#main.meeting .contact-info {
			clear: none;
		}

		#main.meeting #content #lodgings {
			margin-top: 1.5rem;
		}

			#main.meeting #content .col-2-of-2 p {
				text-align: left;
			}

			#main.meeting #lodgings .organization-name {
				margin-top: 0;
				margin-bottom: 0;
			}

			#main.meeting #lodgings #lunch {
				text-align: left;
			}

	#sessions-outer {
		padding: 0;
		padding-bottom: 0.5rem;
	}

		#main.meeting #sessions-outer h1 {
			text-align: center;
			margin-bottom: 1rem;
			padding-top: 1.75rem;
		}

		#sessions {
			padding: 0;
			padding-top: 0.25rem;
			padding-bottom: 0.5rem;
		}

			.session {
				min-height: 0;
				max-height: none;
				padding: 0;
				width: auto;
			}

				.session .console-inner {
					margin-bottom: 0;
				}

				#main.meeting #content p.link-to-session
				{
					width: 40% !important;
				}

					#main #content #sessions .session ul {
						margin-left: 1rem !important;
						margin-right: 1rem !important;
					}



					#main #content #sessions .session p,
					#main #content #sessions .session li
					{
						margin-left: 0 !important;
						margin-right: 0 !important;
						padding-bottom: 0;
					}


	/*************
	@ROLE SCREEN
	*************/

	#main.roles h1 {
		font-size: 1rem !important;
		line-height: 1.25;
	}

		#main.roles h1 #position-title {
			font-size: 1.125rem !important;
			line-height: 1.25;
		}

	#user-missions-menu {
		margin-left: 1.318rem;
		margin-right: 1.318rem;
		margin-top: 0.5rem;
		margin-bottom: 0.5rem;
		width: calc(100vw - 2.636rem);
		overflow: hidden;
		overflow-x: scroll;
		display: block;
	}

		#user-missions-menu #top-level {
			width: auto;
			display: block;
			padding-left: 0;
			margin-top: 0;
		}

		#user-missions-menu .user-mission-title {
			font-size: 0.85rem;
			line-height: 1.34 !important;
		}

	.user-mission-area h2.grid-title {
		margin-top: 1rem;
		margin-bottom: 1rem;
		font-size: 1.25rem;

	}

	/*************
	@VIEW  / @FORM
	*************/

	#main.forms .form-holder {
		padding-left: 0;
		padding-right: 0;
	}

		fieldset {
			margin-left: 0;
			margin-right: 0;
			padding-left: 1rem;
			padding-right: 1rem;
		}

			.field {
				margin-left: 0;
				margin-right: 0;
			}

				label {
					margin-left: 0;
					margin-right: 0;
				}

					label p,
					.field.left-labels label p,
					fieldset.left-labels label p {
						margin-top: 0;
						margin-left: 0;
						margin-bottom: 0;
					}

				.input-holder {
					margin-left: 0;
					margin-right: 0;
				}

					.read-only .for-read-only {
						margin-left: 0;
					}

					.read-only .for-read-only p {
						margin-left: 1rem;
						margin-right: 1rem;
					}


	/*************
	@MAP
	*************/

	#map-stuff-holder
	{
		margin: 0.5rem;
		display: flex;
		flex-direction: column;
	}

		#map-listing-holder
		{
			order: 2;
			max-width: 100%;
		}

			#map-listing-holder .table-holder .school-name-holder
			{
				max-width: none !important;
			}

			#main #content #map-listing-holder p {
				margin-left: 0 !important;
				margin-right: 0 !important;
			}

			#main #map-listing-holder .city-holder p
			#main #map-listing-holder .city-holder p
			{
				line-height: 1rem;
			}

			#map-listing-holder table.list tbody {
				border-width: 0;
			}

			#header-outer > div #map-listing-holder table.list p.map-key {
				text-align: center;
			}

			#header-outer > div p.map-key {
				line-height: 1.75rem;
			}

		#map-holder
		{
			order: 1;
			padding: 0.5rem;
			height: calc(100vh - 2rem);
			width: calc(100vw - 3rem);
			margin-top: 3rem;
		}
		#main #map-holder {
			margin-top: 0;
		}

			#map-holder .school-name img
			{
				max-width: none;
				width: 85%;
				height: auto;
			}

			#main #content #map-holder .gm-style p
			{
				line-height: normal;
			}


	/*************
	@FOOTER
	*************/

	#footer-outer #the-end-holder
	{
		padding-top: 1.5rem;
	}

		#the-end-holder #the-end
		{
			display: flex;
			align-items: center;
			width: 100%;
			font-size: 0.9rem;
		}

			#latin,
			#the-end .crest-holder,
			#english
			{
				display: inline-block;
				min-width: 0;
				margin-bottom: 0;
				padding-top: 0;
				padding-bottom: 0;
			}

			#the-end .crest-holder
			{
				min-width: 6rem;
			}

				#the-end .crest-holder .crest
				{
					margin-top: 0;
					margin-bottom: 0;
				}

	#footer-inner
	{
		max-width: none;
	}

		#footer h3
		{
			padding-left: 0;
			text-align: center;
			font-size: 0.9rem;
			margin-bottom: 1rem;
			margin-top: 1.25rem;
		}

		#footer #affiliations-logos h3 {
			margin-top: 0;
		}

		#footer-inner #contact-and-follow,
		#footer-inner #staff-names,
		#footer-inner #affiliations-logos
		{
			width: auto;
			display: block;
			margin: 0 auto;
		}

			#footer-inner #staff-names ul
			{
				padding-left: 0;
			}


			#footer-inner #staff-names li
			{
				min-width: 0;
				text-align: center;
				font-size: 0.9rem;
				line-height: 1.34em;
			}

			#footer-inner #affiliations-logos ul
			{
				text-align: center;
			}

			#footer-inner #affiliations-logos ul li
			{
				width: 30vw;
				margin-right: 0;
			}
			#footer-inner #affiliations-logos ul li:nth-child(odd)
			{
				margin-right: 1rem;
			}

		#footer-inner #notices
		{
			padding-top: 1.5rem;
			padding-bottom: 2.25rem;
			clear: both;
		}

			#footer-inner #notices p
			{
				font-size: 0.9rem !important;
				line-height: 1.5em !important;
			}


			#footer-inner #notices .chunk
			{
				display: inline-block;
			}


		#contact-and-follow {
			overflow-x: hidden;
		}

	#to-the-top-top,
	#to-the-top-left,
	#to-the-top-right
	{
		display: none !important;
	}

	/*******************
	@TYPOGRAPHY < MOBILE
	*******************/

	#main #content .school-name {
		white-space: normal;
	}


}

/* Mobile vertical */
@media only screen and (max-width: 450px)
{
	.mobile-vertical-hide
	{
		display: none;
	}

	#footer-inner #affiliations-logos ul li
	{
		width: 42.5vw;
		height: 26.3vw;
		margin-right: 0;
	}

}