/*
	main stylesheet



	TODO: when all layout/design decisions are finalized, refactor and clean up !
	TODO: when all layout/design decisions are finalized, refactor and clean up !
	TODO: when all layout/design decisions are finalized, refactor and clean up !
	TODO: when all layout/design decisions are finalized, refactor and clean up !



*/




/*############################################################################*/
/*############################################################################*/
/* GENERAL STYLING */

html
	{
	width: 100%;
	overflow-x: hidden;
	}

body
	{
	max-width: 1920px;
	margin: auto;
	background: #ccc;
	background: #fff;
	overflow-x: hidden;
	font-size: 16px;
	line-height: 1.5;
	/* font-family:  OpenSansRegular, verdana, sans-serif; */
	font-family:  OpenSans, verdana, sans-serif;
	}

a
	{
	color: #2C63A8;
	}


p, h1, h2, h3, h4
	{
	max-width: 44em;
	}

li
	{
	max-width: 42em;
	}

blockquote
	{
	max-width: 40em;
	}



h1, h2, h3, h4,
strong
	{
	font-weight: bold;
	font-family:  OpenSansBold, verdana, sans-serif;
	}


blockquote
	{
	color: #888;
	}



/*============================================================================*/
/* SKIP TO MAIN CONTENT */
/* for accessibility */

body
	{
	position: relative;
	}

.skiptomaincontent
	{
	position: absolute;
	left: -10000px;
	width: 1px;
	height: 1px;
	overflow: hidden;
	}

.skiptomaincontent:focus,
.skiptomaincontent:active
	{
	position: static;
	left: 0px;
	width: auto;
	height: auto;
	overflow: visible;
	text-decoration: underline;
	}


/*============================================================================*/
/* FONTS */


@media screen, print
	{

	@font-face
		{
		font-family: OpenSans;
		src:
			local("OpenSans"),
			local("OpenSans"),
			url(/wp-content/themes/AuthorCenter2020/fonts/OpenSans/Open_Sans/OpenSans-Regular.ttf);
		}

	@font-face
		{
		font-family: OpenSansRegular;
		src:
			local("OpenSans-Regular"),
			local("OpenSans Regular"),
			url(/wp-content/themes/AuthorCenter2020/fonts/OpenSans/Open_Sans/OpenSans-Regular.ttf);
		font-weight: 400;
		}

	@font-face
		{
		font-family: OpenSansBold;
		src:
			local("OpenSans-Bold"),
			local("Open Sans Bold"),
			url(/wp-content/themes/AuthorCenter2020/fonts/OpenSans/Open_Sans/OpenSans-Bold.ttf);
		font-weight: 700;
		}

	@font-face
		{
		font-family: OpenSansSemiBold;
		src:
			local("OpenSans-SemiBold"),
			local("OpenSans SemiBold"),
			url(/wp-content/themes/AuthorCenter2020/fonts/OpenSans/Open_Sans/OpenSans-SemiBold.ttf);
		font-weight: 500;
		}

	@font-face
		{
		font-family: OpenSansItalic;
		src:
			local("OpenSans-Italic"),
			local("OpenSans Italic"),
			url(/wp-content/themes/AuthorCenter2020/fonts/OpenSans/Open_Sans/OpenSans-Italic.ttf);
		font-weight: 400;
		}

	}



/*############################################################################*/
/*############################################################################*/
/* IEEE STYLES */

/*============================================================================*/
/* General IEEE items */
.xplore
	{
	font-style: italic;
	}


/*============================================================================*/
/* IEEE meta-nav header */

.ieeemeta
	{
	position: relative;
	height: 63px;
	height: 57px;
	height: 54px;
	font-size: 12px;
	line-height: 12px;
	}

									.ieeemeta	{ background: #444; }
/* .AC_hub.home						.ieeemeta	{ background: transparent; } */
body.page-template-T-home-mainhub	.ieeemeta	{ background: transparent; }

.ieeemeta *
	{
	}

.ieeemeta nav
	{
	position: absolute;
	top: 24px;
	top: 21px;
	left: 31px;
	left: 20px;
	}

.ieeemeta nav li
	{
	display: inline-block;
	}

.ieeemeta nav li,
.ieeemeta nav li a
	{
	color: #FFFFFF;
	}

.ieeemeta nav li + li::before
	{
	content: "|";
	}

.ieeemeta .ieeejoin,
.ieeemeta .techrxiv-submit,
.ieeemeta nav li a
	{
	padding: 0 4px;
	}

/*
.AC_hub.home .ieeemeta .ieeejoin,
.AC_hub.home .ieeemeta nav li a
*/

body.page-template-T-home-mainhub	.ieeemeta .ieeejoin,
body.page-template-T-home-mainhub	.ieeemeta .techrxiv-submit,
body.page-template-T-home-mainhub	.ieeemeta nav li a
	{
	background: rgba(14,28,64, 0.7);
	/* offset-x | offset-y | blur-radius | spread-radius | color */
	box-shadow: 0px 0px 2px 3px rgba(14,28,64, 0.5);
	}

.ieeemeta .ieeejoin
	{
	position: absolute;
	top: 21px;
	right: 150px;
	color: #fff;
	}

.ieeemeta .techrxiv-submit
	{
	position: absolute;
	top: 21px;
	right: 226px;
	color: #fff;
	}

.ieeemeta .masterbrand
	{
	position: absolute;
	top: 15px;
	top: 12px;
	right: 30px;
	right: 20px;
	height: 30px;
	}

/*----------------------------------------------------------------------------*/
/* FLEXIBLE LAYOUT */
/*----------------------------------------------------------------------------*/
@media (max-width: 500px)
	{

	.ieeemeta
		{
		height: 50px;
		}

	.ieeemeta .masterbrand
		{
		top: 10px;
		right: 18px;
		height: 28px;
		}

	.ieeemeta nav.ieeemeta-nav-minimal
		{
		display: block;
		}

	.ieeemeta nav.ieeemeta-nav-regular,
	.ieeemeta .techrxiv-submit,
	.ieeemeta .ieeejoin
		{
		display: none;
		}

	}

/*----------------------------------------------------------------------------*/
@media (min-width: 501px) and (max-width: 650px)
	{

	.ieeemeta nav.ieeemeta-nav-minimal
		{
		display: block;
		}

	.ieeemeta nav.ieeemeta-nav-regular,
	.ieeemeta .techrxiv-submit,
	.ieeemeta .ieeejoin
		{
		display: none;
		}

	}

/*----------------------------------------------------------------------------*/
@media (min-width: 651px) and (max-width: 905px)
	{
	.ieeemeta nav li + li::before
		{
		padding: 0 0.4em 0 0.3em;
		padding: 0 1px 0 0px;
		color: #888;
		}

	.ieeemeta nav.ieeemeta-nav-minimal
		{
		display: none;
		}

	.ieeemeta nav.ieeemeta-nav-regular
		{
		display: block;
		}

	.ieeemeta .techrxiv-submit,
	.ieeemeta .ieeejoin
		{
		display: none;
		}

	}

/*----------------------------------------------------------------------------*/
@media (min-width: 751px)
	{

	.ieeemeta nav li + li::before
		{
		padding: 0 0.6em 0 0.5em;
		padding: 0 3px 0 2px;
		}

	.ieeemeta nav li + li::before
		{
		color: #ccc;
		}

	.ieeemeta nav.ieeemeta-nav-minimal
		{
		display: none;
		}

	.ieeemeta nav.ieeemeta-nav-regular
		{
		display: block;
		}

	}

/*----------------------------------------------------------------------------*/
@media (min-width: 1025px)
	{
	.ieeemeta nav li + li::before
		{
		padding: 0 2em;
		padding: 0 1.4em;
		}

	}



/*############################################################################*/
/*############################################################################*/
/*############################################################################*/



/*############################################################################*/
/* HEADER LAYOUT */




#AuthorCenter
	{
	/* z-index: 2; */
	Xborder: 5px solid #dc9;
	background: #fff;
	display: grid;
	position: relative;
	overflow-y: visible;
	}

#AuthorCenter.AC_menu_open,
#AuthorCenter.menu_click
	{
	z-index: 4;
	}

/* .AC_hub.home #AuthorCenter */
body.page-template-T-home-mainhub	#AuthorCenter
	{
	background: transparent;
	background: rgba(255,255,255,0.9);
	}


#AuthorCenter > div
	{
	display: block;
	}

/*----------------------------------------------------------------------------*/

#AC_logo				{ grid-area: ga-ac-logo; }
#AC_nav					{ grid-area: ga-ac-nav; }


/*============================================================================*/
/* FLEXIBLE LAYOUT */
/*============================================================================*/



/*----------------------------------------------------------------------------*/
/*
	1/col layout:
	logo
	AC_nav	(hamburger sticks up over logo area though
*/
/*----------------------------------------------------------------------------*/

@media (min-width: 301px) and (max-width: 500px)
	{

	/* regular and subsite home */
	#AuthorCenter
		{
		grid-template-columns:
			calc( (100vw - 300px) *   25 / 200 + 15px)	/* 15 - 40 */
			1fr
			40px
			calc( (100vw - 300px) *   25 / 200 + 15px)	/* 15 - 40 */
			;


		grid-template-rows: 140px ;

		grid-template-areas:
			"	.	ga-ac-logo		ga-ac-nav		.	"
			;
		}

	}


/*----------------------------------------------------------------------------*/
@media (min-width: 501px) and (max-width: 700px)
	{

	/* regular and subsite home */
	#AuthorCenter
		{
		grid-template-columns:
			calc( (100vw - 500px) *  60 / 200 +  20px)	/*  20 -  80 */
			calc( (100vw - 500px) *  40 / 200 + 245px)	/* 245 - 285 */
			calc( (100vw - 500px) *  40 / 200 +  20px)	/*  20 -  60 */
			1fr
			calc( (100vw - 500px) * 100 / 200 +  20px)	/*  20 - 120 */
			;

		grid-template-rows: 156px ;

		grid-template-areas:
			"	.	ga-ac-logo		.				ga-ac-nav		.	"
			;
		}

	}


/*----------------------------------------------------------------------------*/
@media (min-width: 701px) and (max-width: 800px)
	{

	/* regular and subsite home */
	#AuthorCenter
		{
		grid-template-columns:
			calc( (100vw - 700px) *  25 / 100 + 15px)	/* 15 -  40 */
			285px
			/* calc( (100vw - 700px) * 120 / 100 + 20px) */	/* 20 - 140 */
			calc( (100vw - 700px) *  50 / 100 + 20px)	/* 20 -  70 */
			1fr
			calc( (100vw - 700px) *  25 / 100 + 15px)	/* 15 -  40 */
			;

		grid-template-rows: 122px ;

		grid-template-areas:
			"	.	ga-ac-logo	.	ga-ac-nav		.	"
			;
		}

	}



/*----------------------------------------------------------------------------*/
@media (min-width: 801px) and (max-width: 1200px)
	{

	/* regular and subsite home */
	#AuthorCenter
		{
		grid-template-columns:
			calc( (100vw - 800px) *  20 / 400 + 20px)	/* 20 -  40 */
			335px
			/* calc( (100vw - 800px) * 120 / 400 + 20px) */	/* 20 - 140 */
			calc( (100vw - 800px) *  70 / 400 + 20px)	/* 20 - 90 */
			1fr
			calc( (100vw - 800px) *  25 / 400 + 15px)	/* 15 -  40 */
			;

		grid-template-rows: 122px ;

		grid-template-areas:
			"	.	ga-ac-logo	.	ga-ac-nav		.	"
			;
		}

	}


/*----------------------------------------------------------------------------*/
@media (min-width: 1201px) and (max-width: 1400px)
	{

	/* regular and subsite home */
	#AuthorCenter
		{
		grid-template-columns:
			calc( (100vw - 1200px) * 40 / 200 +  40px)	/*  40 -  80 */
			335px
			calc( (100vw - 1200px) * 30 / 200 + 90px)	/* 90 - 120 */
			1fr
			calc( (100vw - 1200px) * 10 / 200 +  90px)	/*  90 - 100 */
			;

		grid-template-rows: 122px ;

		grid-template-areas:
			"	.	ga-ac-logo	.	ga-ac-nav		.	"
			;
		}

	}


/*----------------------------------------------------------------------------*/
@media (min-width: 1401px) and (max-width: 1920px)
	{

	/* regular and subsite home */
	#AuthorCenter
		{
		grid-template-columns:
			calc( (100vw - 1400px) *  70 / 520 + 80px)	/* 80 - 150 */
			335px
			calc( (100vw - 1400px) * 120 / 520 + 30px)	/* 30 - 150 */
			1fr
			calc( (100vw - 1400px) *  50 / 520 + 100px)	/* 100 - 150 */
			;

		grid-template-rows: 122px ;

		grid-template-areas:
			"	.	ga-ac-logo	.	ga-ac-nav		.	"
			;
		}

	}


/*----------------------------------------------------------------------------*/

@media (min-width: 1921px)
	{

	/* regular and subsite home */
	#AuthorCenter
		{
		grid-template-columns:
			150px
			335px
			150px
			1fr
			150px
			;

		grid-template-rows: 122px ;

		grid-template-areas:
			"	.	ga-ac-logo	.	ga-ac-nav		.	"
			;
		}

	}






/*############################################################################*/
/* LOGO */

#AC_logo
	{
	align-self: center;			/* center in the header grid, so centers over nav */
	justify-self: center;		/* center in the header grid, so centers over nav */
	Xpadding-top: 15px;
	}

#AC_logo a
	{
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	align-items: flex-end;

	max-width: 285px;
	}

#AC_logo img,
#AC_logo .ACtagline
	{
	display: block;
	}

#AC_logo .AClogo img
	{
	width: 100%;
	}

#AC_logo .ACtagline
	{
	color: hsl(280, 3%, 40%);
	font-size: 16px;
	line-height: 1;
	height: 16px;
	margin-top: 6px;
	}



/*----------------------------------------------------------------------------*/

@media (min-width: 301px) and (max-width: 500px)

	{

	#AC_logo a
		{
		width:	calc( (100vw - 300px) *  40 / 200 + 245px);	/* 245 - 285 */
		align-items: center;
		}

	#AC_logo .ACtagline br
		{
		line-height: 1.2;
		}

	}


/*----------------------------------------------------------------------------*/

@media (min-width: 501px) and (max-width: 600px)

	{

	#AC_logo a
		{
		width:	calc( (100vw - 500px) *  40 / 100 + 245px);	/* 245 - 285 */
		align-items: center;
		}

	#AC_logo .ACtagline br
		{
		line-height: 1.2;
		}

	}


/*----------------------------------------------------------------------------*/
@media (min-width: 601px)

	{

	#AC_logo .ACtagline br
		{
		display: none;
		}

	}






/*############################################################################*/
/* AC NAV */

#AC_nav
	{
	Xz-index: 2;
	}

#AC_nav nav li
	{
	font-size: 16px;
	line-height: 1;
	text-transform: uppercase;
	}

#AC_nav nav li.menu-item-home
	{
	}

						#AC_nav nav li					a
	{
	color: #3c3a3d;
	white-space: nowrap;
	}

						#AC_nav nav li.menu-item-home	a
	{
	background: #EC901E;
	color: #fff;
	}



/*----------------------------------------------------------------------------*/
/* /new-authors/ directory stand-in for newauthors subsite


/* the "HOME" link when in /new-authors/ */

body.page-id-4911		#AC_nav nav li.menu-item-home	a,
body.parent-pageid-4911	#AC_nav nav li.menu-item-home	a
	{
	color: green;
	color: #3c3a3d;
	background: #efd;
	background: transparent;
	}


/*****
4886 is menu item for NEW AUTHORS on staging site
body.page-id-4911		#AC_nav nav li.menu-item-4886	a,
body.parent-pageid-4911	#AC_nav nav li.menu-item-4886	a
*****/
body.page-id-4911		#AC_nav nav li.menu-item-4887	a,
body.parent-pageid-4911	#AC_nav nav li.menu-item-4887	a
	{
	background: #EC901E;
	color: #fff;
	}



/*----------------------------------------------------------------------------*/









#AC_nav nav li a:hover
	{
	background: #EC901E;	/* CURRENT LOCATION */
	}

/*----------------------------------------------------------------------------*/

#AC_nav nav .closebox,
#AC_nav nav .hamburger
	{
	border-radius: 2px;
	height: 38px;
	width: 38px;
	}

#AC_nav nav .closebox
	{
	display: block;
	background: #ec901e;
	background: lavender;
	}

#AC_nav nav .hamburger
	{
	display: none;	/* default, for most window widths */
	background: #fff;
	border: solid #ec901e;
	border-width: 18px 10px;
	}

#AC_nav nav .hamburger::before,
#AC_nav nav .hamburger::after
	{
	position: absolute;
	border-radius: 2px;
	background: #fff;
	height: 2px;
	width: 18px;
	content: "";
	}

#AC_nav nav .hamburger::before
	{
	top: -8px;
	}

#AC_nav nav .hamburger::after
	{
	bottom: -8px;
	}


/*----------------------------------------------------------------------------*/
/*----------------------------------------------------------------------------*/
/*----------------------------------------------------------------------------*/

/*----------------------------------------------------------------------------*/
/* FLEXIBLE LAYOUT */
/*----------------------------------------------------------------------------*/
@media (min-width: 301px) and (max-width: 500px)
	{
/* HAMBURGER */

	#AC_nav
		{
		position: relative;
		}

	/*------------------------------------------------------------------------*/
	/* opener container */

	#AC_nav nav
		{
		position: relative;
		Xleft: -120px;
		margin-top: 77px;
		Xmargin-left: 12px;
		Xbackground: #dfe;
		}

	#AC_nav nav li,
	#AC_nav nav li a
		{
		display: block;
		line-height: 1;
		}

	#AC_nav nav li a
		{
		padding: 5px 12px;
		margin: 1px 0px;
		}


	/*------------------------------------------------------------------------*/
	/* opener "hamburger" */

	#AC_nav nav .closebox,
	#AC_nav nav .hamburger
		{
		position: relative;
		Xleft: 80px;
		Xfloat: right;
		display: block;
		}


	/*------------------------------------------------------------------------*/
	/* togglable menu */


	#AC_nav nav
		{
		Xleft: calc( (100vw - 300px) *  110 / 200 -  130px );	/* -130 - -20 */
		width: 40px;
		}

	#AC_nav nav div
		{
		clear: right;
		position: absolute;
		width: 200px;
		right: 0;
		top: 50px;
		display: none;
		background: rgba(250,250,250,0.95);
		background: #eee;
		box-shadow: 1px 3px 6px 3px rgba(0,0,0,0.4);
		}

	#AC_nav nav div ul
		{
		position: relative;
		display: grid;
		display: block;
		}



	/*========================================================================*/
	/* HAMBURGER TOGGLE (small screen) */

	#AC_nav nav#AC_nav_menu
		{
		Xborder: 5px solid #d0d;
		}

	#AC_nav nav#AC_nav_menu > div
		{
		Xborder: 5px solid #dd0;
		Xbackground: #ffe;
		display: none;
		}

	body.noJS	#AC_nav nav#AC_nav_menu											> div,
				#AC_nav nav#AC_nav_menu.menu_mouseover:not(.menu_touchstart)	> div,
				#AC_nav nav#AC_nav_menu.menu_click								> div
		{
		display: block;
		}

	body.noJS	#AC_nav nav#AC_nav_menu,
				#AC_nav nav#AC_nav_menu.menu_mouseover:not(.menu_touchstart),
				#AC_nav nav#AC_nav_menu.menu_click
		{
		left: -130px;
		width: 170px;
		height: 80px;
		}

	body.noJS	#AC_nav nav#AC_nav_menu	.closebox,
	body.noJS	#AC_nav nav#AC_nav_menu	.hamburger,
				#AC_nav nav#AC_nav_menu.menu_mouseover:not(.menu_touchstart)	.closebox,
				#AC_nav nav#AC_nav_menu.menu_mouseover:not(.menu_touchstart)	.hamburger,
				#AC_nav nav#AC_nav_menu.menu_click	.closebox,
				#AC_nav nav#AC_nav_menu.menu_click	.hamburger
		{
		left: 130px;
		}





	/*========================================================================*/




	}



/*----------------------------------------------------------------------------*/
@media (min-width: 501px) and (max-width: 700px)
	{
/* ONE COLUMN */

	#AC_nav nav
		{
		margin: 5px auto auto auto;
		Xwidth: 170px;
		}

	#AC_nav nav #subsite_menu_open
		{
		display: none;
		}

	#AC_nav nav ul
		{
		display: flex;
		justify-content: space-between;
		flex-direction: column;
		}

	#AC_nav nav li
		{
		flex-basis: min-content;
		}

	#AC_nav nav li,
	#AC_nav nav li a
		{
		display: block;
		line-height: 1;
		}

	#AC_nav nav li a
		{
		width: 100%;
		padding: 2px 10px 4px;
		margin: 1px 0px;
		}

	}



/*----------------------------------------------------------------------------*/

@media (min-width: 701px) and (max-width: 1400px)
	{

	#AC_nav nav ul
		{
		display: grid;
		}

	#AC_nav nav ul li:nth-child(1)	{ grid-area: ACn1; }
	#AC_nav nav ul li:nth-child(2)	{ grid-area: ACn2; }
	#AC_nav nav ul li:nth-child(3)	{ grid-area: ACn3; }
	#AC_nav nav ul li:nth-child(4)	{ grid-area: ACn4; }
	#AC_nav nav ul li:nth-child(5)	{ grid-area: ACn5; }
	#AC_nav nav ul li:nth-child(6)	{ grid-area: ACn6; }
	}

/*----------------------------------------------------------------------------*/
@media (min-width: 701px) and (max-width: 940px)
	{
/* TWO COLUMN */

	#AC_nav nav
		{
		margin: 14px 0 auto auto;
		padding-left: calc( (100vw - 700px) * 60 / 240 +  0px);	/* 0 - 60 */
		}

	#AC_nav nav #subsite_menu_open
		{
		display: none;
		}

	#AC_nav nav li
		{
		display: block;
		padding: 2px;
		}

	#AC_nav nav li a
		{
		display: block;
		padding: 5px;
		}


	#AC_nav ul
		{
		grid-template-columns:
			min-content minmax(10px,40px) min-content ;

		grid-template-rows:  max-content 3px max-content 3px max-content;

		grid-template-areas:
			"	ACn1	.	ACn2	"
			"	.		.	.		"
			"	ACn3	.	ACn4	"
			"	.		.	.		"
			"	ACn5	.	ACn6	"
			;
		}

	}


/*----------------------------------------------------------------------------*/
@media (min-width: 941px) and (max-width: 1400px)
	{
/* THREE COLUMN */

	#AC_nav nav
		{
		margin: 27px auto auto auto;
		padding-left: calc( (100vw - 940px) * 80 / 480 +  0px);	/* 0 - 80 */
		}

	#AC_nav nav #subsite_menu_open
		{
		display: none;
		}

	#AC_nav nav li
		{
		display: block;
		padding: 2px;
		}

	#AC_nav nav li a
		{
		display: block;
		padding: 5px;
		}


	#AC_nav ul
		{
		grid-template-columns:
			min-content minmax(10px,30px) min-content minmax(10px,30px) min-content;

		grid-template-rows:  max-content 10px max-content;

		grid-template-areas:
			"	ACn1	.	ACn2	.	ACn3	"
			"	.		.	.		.	.		"
			"	ACn4	.	ACn5	.	ACn6	"
			;
		}

	}


/*----------------------------------------------------------------------------*/
@media (min-width: 1401px) and (max-width: 1920px)
	{
/* SIX COLUMN */

	#AC_nav nav
		{
		margin: 40px 0 auto auto;
		}

	#AC_nav nav #subsite_menu_open
		{
		display: none;
		}

	#AC_nav nav ul
		{
		display: flex;
		justify-content: space-between;
		}

	#AC_nav nav li,
	#AC_nav nav li a
		{
		display: inline-block;
		}

	#AC_nav nav li a
		{
		height: auto;
		padding: 12px 12px 12px;
		}

	}



/*----------------------------------------------------------------------------*/
@media (min-width: 1921px)
	{

	#AC_nav nav
		{

		margin: 40px 0 auto auto;
		}

	#AC_nav nav #subsite_menu_open
		{
		display: none;
		}

	#AC_nav nav ul
		{
		display: flex;
		justify-content: space-between;
		}

	#AC_nav nav li,
	#AC_nav nav li a
		{
		display: inline-block;
		}

	#AC_nav nav li a
		{
		height: auto;
		padding: 12px 12px 12px;
		}

	}







/*############################################################################*/
/*############################################################################*/
/*############################################################################*/
/* SUBSITE PAGE LAYOUT - BELOW THE AuthorCenter Header */
/* (includes search, section nav, and main content) */
/* (and possibly second subsite nav) */

#subsite_page
	{
	z-index: 1;
	Xborder: 5px solid #9cd;
	background: #fff;
	display: grid;
	position: relative;
	}

/* .AC_hub.home #subsite_page */
body.page-template-T-home-mainhub	#subsite_page
	{
	background: transparent;
	}

#subsite_page > div,
#subsite_page > main
	{
	display: block;
	}




/*============================================================================*/
/* FLEXIBLE LAYOUT */
/*============================================================================*/



/*----------------------------------------------------------------------------*/
/*
	1/col layout:
	search (horizontal)
	nav (hidden)
	content
*/
/*----------------------------------------------------------------------------*/

@media (min-width: 301px) and (max-width: 600px)
	{

	/* regular and subsite home */
	#subsite_page
		{
		grid-template-columns:
			calc( (100vw - 300px) * 75 / 300 + 15px)	/* 15 - 90 */
			1fr
			calc( (100vw - 300px) *  110 / 300 +  40px)	/* 40 - 150 */
			calc( (100vw - 300px) * 75 / 300 + 15px)	/* 15 - 90 */
			;
		}

	/* hub home */
	/* .AC_hub.home #subsite_page */
	body.page-template-T-home-mainhub	#subsite_page
		{
		grid-template-columns:
			calc( (100vw - 300px) * 25 / 300 + 15px)	/* 15 - 40 */
			1fr
			calc( (100vw - 300px) *  110 / 300 +  40px)	/* 40 - 150 */
			calc( (100vw - 300px) * 25 / 300 + 15px)	/* 15 - 40 */
			;
		}



									#subsite_page	{ grid-template-rows: 15px 42px 15px auto 15px	auto auto auto; }
/* .AC_hub.home						#subsite_page	{ grid-template-rows: 15px auto 15px				auto auto auto; } */
body.page-template-T-home-mainhub	#subsite_page	{ grid-template-rows: 15px auto 15px				auto auto auto; }



	#subsite_page
		{
		grid-template-areas:
			"	.	.				.				.	"
			"	.	ga-searchform	ga-searchform	.	"
			"	.	.				.				.	"
			"	.	ga-mainmenu		ga-mainmenu		.	"
			"	.	.				.				.	"
			"	.	ga-main			ga-main			.	"
			"	.	ga-newsletter	ga-newsletter	.	"
			"	ga-AC_nav_bottom	ga-AC_nav_bottom	ga-AC_nav_bottom	ga-AC_nav_bottom	"
			;
		}

	/* .AC_hub.home	#subsite_page */
	body.page-template-T-home-mainhub	#subsite_page
		{
		grid-template-areas:
			"	.	.				.				.	"
			"	.	ga-searchform	ga-searchform	.	"
			"	.	.				.				.	"
			"	.	ga-main			ga-main			.	"
			"	.	ga-newsletter	ga-newsletter	.	"
			"	ga-AC_nav_bottom	ga-AC_nav_bottom	ga-AC_nav_bottom	ga-AC_nav_bottom	"
			;
		}



	/* all sites: mobile */
	#subsite_page div#AC_nav_bottom
		{
		display: block;
		}


	/*----------------------------------------------------------------------------*/

	#searchform				{ grid-area: ga-searchform; }
	#mainmenu				{ grid-area: ga-mainmenu; }
	main					{ grid-area: ga-main; }
	#newsletter				{ grid-area: ga-newsletter; }
	#AC_nav_bottom			{ grid-area: ga-AC_nav_bottom; }

	#subsite_page::before
		{
		content: " ";
		grid-row: 1/6;
		grid-column: 1/5;
		background: #000;
		}

	/* .AC_hub 							#subsite_page::before */
	body.page-template-T-home-mainhub	#subsite_page::before,
	body.page-template-T-inner-NOnav	#subsite_page::before,
	body.AC_hub.search-results			#subsite_page::before
		{
		content: " ";
		grid-row: 1/5;
		grid-column: 1/5;
		background: #000;
		}

	/* .AC_hub.home #subsite_page::before */
	body.page-template-T-home-mainhub	#subsite_page::before
		{
		display: none;
		}

	}




/*----------------------------------------------------------------------------*/
/*
	2-col/1/col layout:
		search (horizontal)
		nav (hidden)
		content
	(uses same layout cols though)
*/
/*----------------------------------------------------------------------------*/

@media (min-width: 601px) and (max-width: 800px)
	{

	/* regular and subsite home */
	#subsite_page
		{
		grid-template-columns:
			calc( (100vw - 600px) * 80 / 200 + 40px)	/* 40 - 120 */
			285px
			calc( (100vw - 600px) * 70 / 200 + 20px)	/* 20 - 90 */
			1fr
			calc( (100vw - 600px) * 80 / 200 + 40px)	/* 40 - 120 */
			;
		}

	/* hub home */
	/* .AC_hub.home #subsite_page */
	body.page-template-T-home-mainhub	#subsite_page
		{
		grid-template-columns:
			calc( (100vw - 600px) * 80 / 200 + 40px)	/* 40 - 120 */
			285px
			calc( (100vw - 600px) * 70 / 200 + 20px)	/* 20 - 90 */
			1fr
			calc( (100vw - 600px) * 80 / 200 + 40px)	/* 40 - 120 */
			;
		}



									#subsite_page	{ grid-template-rows: 15px 36px 15px auto 15px	auto auto; }
/* .AC_hub.home						#subsite_page	{ grid-template-rows: 15px auto 15px				auto auto; } */
body.page-template-T-home-mainhub	#subsite_page	{ grid-template-rows: 15px auto 15px				auto auto; }



	#subsite_page
		{
		grid-template-areas:
			"	.	.				.				.				.	"
			"	.	ga-searchform	ga-searchform	ga-searchform	.	"
			"	.	.				.				.				.	"
			"	.	ga-mainmenu		ga-mainmenu		ga-mainmenu		.	"
			"	.	.				.				.				.	"
			"	.	ga-main			ga-main			ga-main			.	"
			"	.	ga-newsletter	ga-newsletter	ga-newsletter	.	"
			;
		}

	/* .AC_hub.home	#subsite_page */
	body.page-template-T-home-mainhub	#subsite_page
		{
		grid-template-areas:
			"	.	.				.				.				.	"
			"	.	ga-searchform	ga-searchform	ga-searchform	.	"
			"	.	.				.				.				.	"
			"	.	ga-main			ga-main			ga-main			.	"
			"	.	ga-newsletter	ga-newsletter	ga-newsletter	.	"
			;
		}



	/* all sites > mobile */
	#subsite_page div#AC_nav_bottom
		{
		display: none;
		}

	/*----------------------------------------------------------------------------*/

	#searchform				{ grid-area: ga-searchform; }
	#mainmenu				{ grid-area: ga-mainmenu; }
	main					{ grid-area: ga-main; }
	#newsletter				{ grid-area: ga-newsletter; }
	/* (Bottom version of ac-nav only appears in mobile, so not in grid layouts) */

	#subsite_page::before
		{
		content: " ";
		grid-row: 1/6;
		grid-column: 1/6;
		background: #000;
		}

	/* .AC_hub							#subsite_page::before */
	body.page-template-T-home-mainhub	#subsite_page::before,
	body.page-template-T-inner-NOnav	#subsite_page::before,
	body.AC_hub.search-results			#subsite_page::before
		{
		content: " ";
		grid-row: 1/5;
		grid-column: 1/6;
		background: #000;
		}

	/* .AC_hub.home #subsite_page::before */
	body.page-template-T-home-mainhub	#subsite_page::before
		{
		display: none;
		}

	}



/*----------------------------------------------------------------------------*/
/*
	2-col layout:
	mainnav,	search
	"",			content
*/
/*----------------------------------------------------------------------------*/

@media (min-width: 801px) and (max-width: 1200px)
	{

	/* regular and subsite home */
	#subsite_page
		{
		grid-template-columns:
			calc( (100vw - 800px) * 20 / 400 + 20px)	/* 20 - 40 */
			335px
			calc( (100vw - 800px) * 70 / 400 + 20px)	/* 20 - 90 */
			1fr
			calc( (100vw - 800px) * 70 / 400 + 20px)	/* 20 - 90 */
			;
		}

	/* hub home */
	/* .AC_hub.home #subsite_page */

	/* .AC_hub							#subsite_page */
	body.page-template-T-home-mainhub	#subsite_page,
	body.page-template-T-inner-NOnav	#subsite_page,
	body.AC_hub.search-results			#subsite_page

		{
		grid-template-columns:
			calc( (100vw - 800px) * 70 / 400 + 20px)	/* 20 - 90 */



			calc( (100vw - 800px) * 40 / 400 + 50px)	/* 50 - 90 */
			calc( (100vw - 800px) * -40 / 400 + 235px)	/* 235 - 195 */



			calc( (100vw - 800px) * 70 / 400 + 20px)	/* 20 - 90 */



			1fr
			calc( (100vw - 800px) * 40 / 400 + 50px)	/* 50 - 90 */



			calc( (100vw - 800px) * 70 / 400 + 20px)	/* 20 - 90 */
			;
		}



				#subsite_page	{ grid-template-rows: 30px 36px 30px auto auto; }
/* .AC_hub.home	#subsite_page	{ grid-template-rows: 30px auto 30px auto auto; } */

/* .AC_hub								#subsite_page	{ grid-template-rows: 30px auto 30px auto auto; } */
body.page-template-T-home-mainhub		#subsite_page	{ grid-template-rows: 30px auto 30px auto auto; }
body.page-template-T-inner-NOnav		#subsite_page	{ grid-template-rows: 30px auto 30px auto auto; }
body.AC_hub.search-results				#subsite_page	{ grid-template-rows: 30px auto 30px auto auto; }



	#subsite_page
		{
		grid-template-areas:
			"	.	.			.	.				.	"
			"	.	ga-mainmenu	.	ga-searchform	.	"
			"	.	ga-mainmenu	.	.				.	"
			"	.	ga-mainmenu	.	ga-main			.	"
			"	.	ga-mainmenu	.	ga-newsletter	.	"
			;
		}

	/* .AC_hub.home	#subsite_page */

	/* .AC_hub							#subsite_page */
	body.page-template-T-home-mainhub	#subsite_page,
	body.page-template-T-inner-NOnav	#subsite_page,
	body.AC_hub.search-results			#subsite_page
		{
		grid-template-areas:
			"	.	.				.				.				.				.				.	"
			"	.	.				ga-searchform	ga-searchform	ga-searchform	.				.	"
			"	.	.				.				.				.				.				.	"
			"	.	.				ga-main			ga-main			ga-main			.				.	"
			"	.	ga-newsletter	ga-newsletter	ga-newsletter	ga-newsletter	ga-newsletter	.	"
			;
		}



	/* all sites > mobile */
	#subsite_page div#AC_nav_bottom
		{
		display: none;
		}

	/*----------------------------------------------------------------------------*/

	#searchform				{ grid-area: ga-searchform; }
	#mainmenu				{ grid-area: ga-mainmenu; }
	main					{ grid-area: ga-main; }
	#newsletter				{ grid-area: ga-newsletter; }
	/* (Bottom version of ac-nav only appears in mobile, so not in grid layouts) */

	#subsite_page::before
		{
		content: " ";
		grid-row: 1/4;
		grid-column: 1/6;
		background: #000;
		}

	/* .AC_hub							#subsite_page::before */
	body.page-template-T-home-mainhub	#subsite_page::before,
	body.page-template-T-inner-NOnav	#subsite_page::before,
	body.AC_hub.search-results			#subsite_page::before
		{
		content: " ";
		grid-row: 1/4;
		grid-column: 1/8;
		background: #000;
		}

	/* .AC_hub.home #subsite_page::before */
	body.page-template-T-home-mainhub	#subsite_page::before
		{
		display: none;
		}

	}




/*----------------------------------------------------------------------------*/

@media (min-width: 1201px) and (max-width: 1400px)
	{

	/* regular and subsite home */
	#subsite_page
		{
		grid-template-columns:
			calc( (100vw - 1200px) * 40 / 200 + 40px)	/* 40 -  80 */
			335px
			calc( (100vw - 1200px) * 10 / 200 + 90px)	/* 90 - 100 */
			1fr
			calc( (100vw - 1200px) * 10 / 200 + 90px)	/* 90 - 100 */
			;
		}

	/* hub home */
	/* .AC_hub.home #subsite_page */

	/* .AC_hub 							#subsite_page */
	body.page-template-T-home-mainhub	#subsite_page,
	body.page-template-T-inner-NOnav	#subsite_page,
	body.AC_hub.search-results			#subsite_page
		{
		grid-template-columns:
			calc( (100vw - 1200px) * 10 / 200 + 90px)	/* 90 - 100 */


			calc( (100vw - 1200px) * 90 / 200 + 90px)	/* 90 - 180 */
			/* 180px */
			/* 105px */
			calc( (100vw - 1200px) * -90 / 200 + 195px)	/* 195 - 105 */


			calc( (100vw - 1200px) * 10 / 200 + 90px)	/* 90 - 100 */


			1fr
			/* 180px */
			calc( (100vw - 1200px) * 90 / 200 + 90px)	/* 90 - 180 */


			calc( (100vw - 1200px) * 10 / 200 + 90px)	/* 90 - 100 */
			;
		}



				#subsite_page	{ grid-template-rows: 30px 36px 30px auto auto; }
/* .AC_hub.home	#subsite_page	{ grid-template-rows: 30px auto 30px auto auto; } */

/* .AC_hub							#subsite_page	{ grid-template-rows: 30px auto 30px auto auto; } */
body.page-template-T-home-mainhub	#subsite_page	{ grid-template-rows: 30px auto 30px auto auto; }
body.page-template-T-inner-NOnav	#subsite_page	{ grid-template-rows: 30px auto 30px auto auto; }
body.AC_hub.search-results			#subsite_page	{ grid-template-rows: 30px auto 30px auto auto; }



	#subsite_page
		{
		grid-template-areas:
			"	.	.			.	.				.	"
			"	.	ga-mainmenu	.	ga-searchform	.	"
			"	.	ga-mainmenu	.	.				.	"
			"	.	ga-mainmenu	.	ga-main			.	"
			"	.	ga-mainmenu	.	ga-newsletter	.	"
			;
		}

	/* .AC_hub.home	#subsite_page */

	/*.AC_hub							#subsite_page */
	body.page-template-T-home-mainhub	#subsite_page,
	body.page-template-T-inner-NOnav	#subsite_page,
	body.AC_hub.search-results			#subsite_page
		{
		grid-template-areas:
			"	.	.				.				.				.				.				.	"
			"	.	.				ga-searchform	ga-searchform	ga-searchform	.				.	"
			"	.	.				.				.				.				.				.	"
			"	.	.				ga-main			ga-main			ga-main			.				.	"
			"	.	ga-newsletter	ga-newsletter	ga-newsletter	ga-newsletter	ga-newsletter	.	"
			;
		}



	/* all sites > mobile */
	#subsite_page div#AC_nav_bottom
		{
		display: none;
		}

	/*----------------------------------------------------------------------------*/

	#searchform				{ grid-area: ga-searchform; }
	#mainmenu				{ grid-area: ga-mainmenu; }
	main					{ grid-area: ga-main; }
	#newsletter				{ grid-area: ga-newsletter; }
	/* (Bottom version of ac-nav only appears in mobile, so not in grid layouts) */

	#subsite_page::before
		{
		content: " ";
		grid-row: 2/5;
		grid-row: 1/4;
		grid-column: 1/6;
		background: #000;
		}

	/* .AC_hub							#subsite_page::before */
	body.page-template-T-home-mainhub	#subsite_page::before,
	body.page-template-T-inner-NOnav	#subsite_page::before,
	body.AC_hub.search-results			#subsite_page::before
		{
		content: " ";
		grid-row: 1/4;
		grid-column: 1/8;
		background: #000;
		}

	/* .AC_hub.home #subsite_page::before */
	body.page-template-T-home-mainhub	#subsite_page::before
		{
		display: none;
		}




	}






/*----------------------------------------------------------------------------*/

@media (min-width: 1401px) and (max-width: 1920px)
	{

	/* regular and subsite home */
	#subsite_page
		{
		grid-template-columns:
			calc( (100vw - 1400px) *  70 / 520 +  80px)	/*  80 - 150 */
			335px
			calc( (100vw - 1400px) * 100 / 520 + 100px)	/* 100 - 200 */
			1fr
			calc( (100vw - 1400px) *  50 / 520 + 100px)	/* 100 - 150 */
			;
		}

	/* hub home */
	/* .AC_hub.home #subsite_page */

	/* .AC_hub								#subsite_page */
	body.page-template-T-home-mainhub	#subsite_page,
	body.page-template-T-inner-NOnav	#subsite_page,
	body.AC_hub.search-results			#subsite_page
		{
		grid-template-columns:
			calc( (100vw - 1400px) *  50 / 520 + 100px)	/* 100 - 150 */
			180px
			105px
			calc( (100vw - 1400px) * 100 / 520 + 100px)	/* 100 - 200 */
			1fr
			180px
			calc( (100vw - 1400px) *  50 / 520 + 100px)	/* 100 - 150 */
			;
		}



				#subsite_page	{ grid-template-rows: 30px 36px 30px auto auto; }
/* .AC_hub.home	#subsite_page	{ grid-template-rows: 30px auto 30px auto auto; } */

/* .AC_hub								#subsite_page	{ grid-template-rows: 30px auto 30px auto auto; } */
body.page-template-T-home-mainhub	#subsite_page	{ grid-template-rows: 30px auto 30px auto auto; }
body.page-template-T-inner-NOnav	#subsite_page	{ grid-template-rows: 30px auto 30px auto auto; }
body.AC_hub.search-results			#subsite_page	{ grid-template-rows: 30px auto 30px auto auto; }



	#subsite_page
		{
		grid-template-areas:
			"	.	.			.	.				.	"
			"	.	ga-mainmenu	.	ga-searchform	.	"
			"	.	ga-mainmenu	.	.				.	"
			"	.	ga-mainmenu	.	ga-main			.	"
			"	.	ga-mainmenu	.	ga-newsletter	.	"
			;
		}

	/* .AC_hub.home	#subsite_page */

	/* .AC_hub							#subsite_page */
	body.page-template-T-home-mainhub	#subsite_page,
	body.page-template-T-inner-NOnav	#subsite_page,
	body.AC_hub.search-results			#subsite_page
		{
		grid-template-areas:
			"	.	.				.				.				.				.				.	"
			"	.	.				ga-searchform	ga-searchform	ga-searchform	.				.	"
			"	.	.				.				.				.				.				.	"
			"	.	.				ga-main			ga-main			ga-main			.				.	"
			"	.	ga-newsletter	ga-newsletter	ga-newsletter	ga-newsletter	ga-newsletter	.	"
			;
		}



	/* all sites > mobile */
	#subsite_page div#AC_nav_bottom
		{
		display: none;
		}

	/*----------------------------------------------------------------------------*/

	#searchform				{ grid-area: ga-searchform; }
	#mainmenu				{ grid-area: ga-mainmenu; }
	main					{ grid-area: ga-main; }
	#newsletter				{ grid-area: ga-newsletter; }
	/* (Bottom version of ac-nav only appears in mobile, so not in grid layouts) */

	#subsite_page::before
		{
		content: " ";
		grid-row: 2/5;
		grid-row: 1/4;
		grid-column: 1/6;
		background: #000;
		}

	/* .AC_hub							#subsite_page::before */
	body.page-template-T-home-mainhub	#subsite_page::before,
	body.page-template-T-inner-NOnav	#subsite_page::before,
	body.AC_hub.search-results			#subsite_page::before
		{
		content: " ";
		grid-row: 1/4;
		grid-column: 1/8;
		background: #000;
		}

	/* .AC_hub.home #subsite_page::before */
	body.page-template-T-home-mainhub	#subsite_page::before
		{
		display: none;
		}




	}



/*----------------------------------------------------------------------------*/

@media (min-width: 1921px)
	{

	/* regular and subsite home */
	#subsite_page
		{
		grid-template-columns:
			150px
			335px
			200px
			1fr
			150px
			;
		}

	/* hub home */
	/* .AC_hub.home #subsite_page */

	/* .AC_hub						#subsite_page */
	body.page-template-T-home-mainhub	#subsite_page,
	body.page-template-T-inner-NOnav	#subsite_page,
	body.AC_hub.search-results			#subsite_page
		{
		grid-template-columns:
			150px
			180px
			105px
			200px
			1fr
			180px
			150px
			;
		}



				#subsite_page	{ grid-template-rows: 30px 36px 30px auto auto; }
/* .AC_hub.home	#subsite_page	{ grid-template-rows: 30px auto 30px auto auto; } */

/* .AC_hub							#subsite_page	{ grid-template-rows: 30px auto 30px auto auto; } */
body.page-template-T-home-mainhub	#subsite_page	{ grid-template-rows: 30px auto 30px auto auto; }
body.page-template-T-inner-NOnav	#subsite_page	{ grid-template-rows: 30px auto 30px auto auto; }
body.AC_hub.search-results			#subsite_page	{ grid-template-rows: 30px auto 30px auto auto; }



	#subsite_page
		{
		grid-template-areas:
			"	.	.			.	.				.	"
			"	.	ga-mainmenu	.	ga-searchform	.	"
			"	.	ga-mainmenu	.	.				.	"
			"	.	ga-mainmenu	.	ga-main			.	"
			"	.	ga-mainmenu	.	ga-newsletter	.	"
			;
		}

	/* .AC_hub.home	#subsite_page */

	/* .AC_hub							#subsite_page */
	body.page-template-T-home-mainhub	#subsite_page,
	body.page-template-T-inner-NOnav	#subsite_page,
	body.AC_hub.search-results			#subsite_page
		{
		grid-template-areas:
			"	.	.				.				.				.				.				.	"
			"	.	.				ga-searchform	ga-searchform	ga-searchform	.				.	"
			"	.	.				.				.				.				.				.	"
			"	.	.				ga-main			ga-main			ga-main			.				.	"
			"	.	ga-newsletter	ga-newsletter	ga-newsletter	ga-newsletter	ga-newsletter	.	"
			;
		}



	/* all sites > mobile */
	#subsite_page div#AC_nav_bottom
		{
		display: none;
		}

	/*----------------------------------------------------------------------------*/

	#searchform				{ grid-area: ga-searchform; }
	#mainmenu				{ grid-area: ga-mainmenu; }
	main					{ grid-area: ga-main; }
	#newsletter				{ grid-area: ga-newsletter; }
	/* (Bottom version of ac-nav only appears in mobile, so not in grid layouts) */

	#subsite_page::before
		{
		content: " ";
		grid-row: 2/5;
		grid-row: 1/4;
		grid-column: 1/6;
		background: #000;
		}

	/* .AC_hub							#subsite_page::before */
	body.page-template-T-home-mainhub	#subsite_page::before,
	body.page-template-T-inner-NOnav	#subsite_page::before,
	body.AC_hub.search-results			#subsite_page::before
		{
		content: " ";
		grid-row: 1/4;
		grid-column: 1/8;
		background: #000;
		}

	/* .AC_hub.home #subsite_page::before */
	body.page-template-T-home-mainhub	#subsite_page::before
		{
		display: none;
		}




	}








/*############################################################################*/
/*############################################################################*/
/* SITE HEADER */

/* body.AC_hub.home */
body.page-template-T-home-mainhub
	{
	background-repeat: no-repeat;
	}

/*----------------------------------------------------------------------------*/
/* FLEXIBLE LAYOUT */
/*----------------------------------------------------------------------------*/


@media (max-width: 500px)
	{
	/* body.AC_hub.home */
	body.page-template-T-home-mainhub
		{
		background-image:
			linear-gradient(rgba(0,0,0,0.45),rgba(0,0,0,0.45))
			,
			url(/wp-content/themes/AuthorCenter2020/images/AC_hub_home_BG_small.png)
			;
		}
	}

/*----------------------------------------------------------------------------*/
@media (min-width: 501px)
	{
	/* body.AC_hub.home */
	body.page-template-T-home-mainhub
		{
		background-image:
			linear-gradient(rgba(0,0,0,0.45),rgba(0,0,0,0.45))
			,
			url(/wp-content/themes/AuthorCenter2020/images/AC_hub_home_BG.jpg)
			;
		}
	}


/*----------------------------------------------------------------------------*/




@media (max-width: 500px)
	/* { body.AC_hub.home { background-size: 100% 365px; } } */
	{ body.page-template-T-home-mainhub	 { background-size: 100% 365px; } }

@media (min-width: 501px) and (max-width: 600px)
	/* { body.AC_hub.home { background-size: 100% 385px; } } */
	{ body.page-template-T-home-mainhub	 { background-size: 100% 385px; } }

@media (min-width: 601px) and (max-width: 700px)
	/* { body.AC_hub.home { background-size: 100% 420px; } } */
	{ body.page-template-T-home-mainhub	 { background-size: 100% 420px; } }

@media (min-width: 701px) and (max-width: 800px)
	/* { body.AC_hub.home { background-size: 100% 390px; } } */
	{ body.page-template-T-home-mainhub	 { background-size: 100% 390px; } }

@media (min-width: 801px)
	/* { body.AC_hub.home { background-size: 100% 450px; } } */
	{ body.page-template-T-home-mainhub	 { background-size: 100% 450px; } }






/*############################################################################*/
/* SEARCH BAR */
/*############################################################################*/

#searchform
	{
	position: relative;
	}

#searchform form
	{
	display: flex;
	}



#searchform label
	{
	display: none;
	}

#searchform input
	{
	padding: 0 15px;
	-webkit-appearance: none;	/* fix bug in safari */
	}

#searchform input::placeholder
	{
	color: #999;
	}

#searchform input:focus::placeholder
	{
	color: #ddd;
	}

#searchform button[type=submit]
	{
	background: hsl(33, 84%, 52%);	/* 33,84%,52% is same as EC901E */
	color: white;
	text-transform: uppercase;
	font-weight: bold;
	}



/*----------------------------------------------------------------------------*/
/* SEARCHFORM FLEXIBLE LAYOUT */
/*----------------------------------------------------------------------------*/

@media (min-width: 301px) and (max-width: 600px)
	{

	#searchform form
		{
		flex-direction: row;
		width: 100%;
		justify-content: space-between;
		}


	#searchform input,
	#searchform button[type=submit]
		{
		height: 42px;
		}

	#searchform input
		{
		width: calc( 100% - 42px - 2px);
		}

	#searchform button[type=submit]
		{
		width: 42px;
		padding: 5px;
		}

	#searchform button[type=submit] span
		{
		display: none;
		}

	#searchform button[type=submit] svg
		{
		width: 32px;
		height: 32px;
		fill: #fff;
		}

	#searchform input
		{
		margin-bottom: 6px;
		}

	/*------------------------------------------------------------------------*/

	/* .AC_hub.home #searchform */
	body.page-template-T-home-mainhub	 #searchform
		{
		padding-top: 30px;
		padding-bottom: 54px;
		}

	}


/*----------------------------------------------------------------------------*/
@media (min-width: 601px)
	{

	#searchform form
		{
		flex-direction: row;
		width: 100%;
		}

	#searchform input,
	#searchform button[type=submit]
		{
		height: 36px;
		}

	#searchform input
		{
		flex-grow: 1;
		margin-right: 2px;
		}


	#searchform button[type=submit]
		{
		width: auto;
		padding: 0		calc( (100vw - 800px) *  20 / 1120 +  18px);	/* 18 - 38 */
		}

	#searchform button[type=submit] svg
		{
		display: none;
		}

	/*------------------------------------------------------------------------*/

	/* .AC_hub.home #searchform */
	body.page-template-T-home-mainhub	 #searchform
		{
		padding-top: 54px;
		padding-bottom: 110px;
		padding-top: 30px;
		padding-bottom:  55px;
		}

	/* .AC_hub.home #searchform form */
	body.page-template-T-home-mainhub	 #searchform form
		{
		background: rgba(255,255,255,0.75);
		padding: 30px 52px;
		border-radius: 4px;
		}


	}

/*----------------------------------------------------------------------------*/
/* @media (min-width: 801px) and (max-width: 1920px) */

@media (min-width: 801px)
	{

	/* .AC_hub.home #searchform */
	body.page-template-T-home-mainhub	 #searchform
		{
		padding-bottom:  80px;
		}

	}

/*----------------------------------------------------------------------------*/
@media (min-width: 1921px)
	{

	#searchform button[type=submit]
		{
		padding: 0		38px;
		}

	}




/*############################################################################*/
/* MAIN SITE MENU */
/*############################################################################*/

div#mainmenu
	{
	}



nav#main_site_menu
	{
	border-radius: 4px;
	color: #fff;
	background: #2C63A8;
	height: auto;
	}

nav#main_site_menu li
	{
	line-height: 1.1;
	}

nav#main_site_menu a
	{
	Xcolor: hsl(33, 70%, 85%);	/* 33,84%,52% is same as EC901E */ /* new link on bluebar */
	color: #fff;
	font-size: 12px;
	font-size: 15px;
	}

nav#main_site_menu div a:hover
/*
nav#main_site_menu li.current_page_item a:hover,
nav#main_site_menu li.current_page_ancestor a:hover
*/
	{
	color: #EC901E;
	color: hsl(33, 84%, 52%);	/* 33,84%,52% is same as EC901E */
	color: hsl(33, 75%, 85%);	/* 33,84%,52% is same as EC901E */
	color: hsl(33, 95%, 90%);	/* 33,84%,52% is same as EC901E */ /* new hover on blue */
	color: hsl(33, 99%, 85%);	/* 33,84%,52% is same as EC901E */ /* new hover on bluebar */
	}

nav#main_site_menu .current_page_item > a
	{
	cursor: default;	/* still is actually clickable though */
	pointer-events: none;
	}


nav#main_site_menu h2,
nav#main_site_menu > div
	{
	padding-left: 12px;
	padding-right: 12px;
	}



/*============================================================================*/
/* MENU TOGGLE (small screen) */

/*
	Cannot use CSS hover in conjunction with open/close toggling,
	due to incorrect browser implementation of hover for non-cursor devices.
	Instead, use events to set classes, and do the logic here in CSS.
*/

nav#main_site_menu h2
	{
	border-radius: 4px 4px 0 0 ;

    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
	
	}





/*****

nav#main_site_menu.menu_evertouch			> h2::before
	{ content: "TOUCHED "; }

nav#main_site_menu.menu_touchfirst			> h2::after
	{ content: "TOUCH first "; }

nav#main_site_menu.menu_mousefirst			> h2::after
	{ content: "MOUSE first "; }

nav#main_site_menu.menu_mouseafter			> h2::after
	{ content: "MOUSE after "; }

nav#main_site_menu.menu_touchstart			> h2
	{ color: red; }

nav#main_site_menu.menu_mouseover			> h2
	{ font-style: italic; }

nav#main_site_menu.menu_click				> h2
	{ transform: rotate(5deg); }

nav#main_site_menu:not(.menu_mouseover)		> h2
	{ font-style: normal; }

nav#main_site_menu:not(.menu_touchstart)	> h2
	{ color: #8f8; }

*****/



/*============================================================================*/



nav#main_site_menu h2,
nav#main_site_menu h2 a
	{
	font-size: 24px;
	}

/* WP-generated container for the nav ul */
nav#main_site_menu > div
	{
	border-radius: 0 0 4px 4px ;
	padding-bottom: 30px;
	}

nav#main_site_menu > div > ul
	{
	padding-top: 24px;
	}

nav#main_site_menu ul.sub-menu
	{
	}

nav#main_site_menu > div > ul > li
	{
	margin-top: 34px;
	}

nav#main_site_menu > div > ul > li:first-child
	{
	margin-top: 0;
	}

nav#main_site_menu > div > ul > li.menu-item-has-children > a::before
/* normal section heads with child pages show an arrow to imply they can be opened */
	{
	display: block;
	float: left;
	content: "►";
	width: 20px;
	border-bottom: 10px solid transparent;
	}

/* current section-head in a white "current section is open" box has no "close" arrow */
/* (since we don't close the section the user is currently in) */
nav#main_site_menu > div > ul > li.menu-item-has-children.current_page_ancestor > a::before,
nav#main_site_menu > div > ul > li.menu-item-has-children.current_page_item > a::before
	{
	display: block;
	float: left;
	content: " ";
	width: 6px;
	}

/* top-level single pages (white on blue) line up with regular top-level section heads */
nav#main_site_menu > div > ul > li:not(.menu-item-has-children) > a::before
	{
	display: block;
	float: left;
	content: " ";
	width: 20px;
	border-bottom: 10px solid transparent;
	}

/* top-level single pages (white on blue) line up with regular top-level section heads */
nav#main_site_menu > div > ul > li:not(.menu-item-has-children) > a::before
	{
	width: 20px;
	}

/*--------*/
/* submenu (closed) */

nav#main_site_menu ul.sub-menu
	{
	display: none;
	}

/*--------*/
/* submenu (opened) */


nav#main_site_menu > div > ul > li.current_page_item,
nav#main_site_menu > div > ul > li.current_page_ancestor
	{
	background: #fff;
	padding: 14px;
	border-radius: 4px;
	}

nav#main_site_menu > div > ul > li.current_page_item > a,
nav#main_site_menu > div > ul > li.current_page_ancestor > a
	{
	font-weight: bold;
	font-family:  OpenSansBold, verdana, sans-serif;
	}

nav#main_site_menu > div > ul > li:hover.menu-item-has-children > a::before
	{
	content: "►";
	color: #fff;
	}

nav#main_site_menu > div > ul > li li
	{
	margin-top: 16px;
	padding-left: 20px;
	}

nav#main_site_menu > div > ul > li li li
	{
	margin-top: 9px;
	padding-left: 24px;
	}

nav#main_site_menu > div > ul > li li li ul
	{
	margin-left: 16px;
	}

nav#main_site_menu > div > ul > li li li li
	{
	margin-top: 9px;
	color: #2C63A8;
	list-style-type: disc;
	list-style-position: outside;
	padding-left: 0;
	}

nav#main_site_menu li.current_page_item a,
nav#main_site_menu li.current_page_ancestor a
	{
	color: #2C63A8;
	}


nav#main_site_menu > div > ul > li > a:hover
	{
	color: #EC901E;		/* top level links on blue don't get darkened */
	color: hsl(33, 84%, 52%);	/* 33,84%,52% is same as EC901E */
	color: hsl(33, 75%, 85%);
	color: hsl(33, 84%, 90%);
	color: hsl(33, 99%, 85%);	/* 33,84%,52% is same as EC901E */ /* new hover on bluebar */
	}

nav#main_site_menu li.current_page_item a:hover,
nav#main_site_menu li.current_page_ancestor a:hover
	{
	color: hsl(33, 84%, 45%);	/* Darken orange link text slightly */
	}

nav#main_site_menu li.current_page_ancestor > a
	{
	}

nav#main_site_menu li.current_page_item > a
	{
	color: #EC901E;
	color: hsl(33, 84%, 45%);	/* Darken orange link text slightly */
	font-weight: 500;
	}

nav#main_site_menu > div > ul > li.current_page_item,
nav#main_site_menu > div > ul > li.current_page_ancestor
	{
	display: block;
	}

nav#main_site_menu li.current_page_item ul.sub-menu,
nav#main_site_menu li.current_page_ancestor ul.sub-menu
	{
	display: block;
	height: auto;
	}



/*----------------------------------------------------------------------------*/
/* FLEXIBLE LAYOUT */
/*----------------------------------------------------------------------------*/
@media (min-width: 301px) and (max-width: 600px)
	{

	nav#main_site_menu h2
		{
		font-size: 16px;
		text-align: center;
		padding-top: 15px;
		padding-bottom: 15px;
		padding-top: 12px;
		padding-bottom: 12px;
		cursor: pointer;
		}

	nav#main_site_menu h2::after
		{
		display: inline-block;
		content: "►";
		padding-left: 14px;
		}



	/*========================================================================*/
	/* MENU TOGGLE (small screen) */

	nav#main_site_menu > div
		{
		display: none;
		}

	body.noJS	nav#main_site_menu										> div,
				nav#main_site_menu.menu_mouseover:not(.menu_touchstart)	> div,
				nav#main_site_menu.menu_click							> div
		{
		display: block;
		}

	body.noJS	nav#main_site_menu										> h2::after,
				nav#main_site_menu.menu_mouseover:not(.menu_touchstart)	> h2::after,
				nav#main_site_menu.menu_click							> h2::after
		{
		content: "▼";
		}

	/*========================================================================*/



	}



/*----------------------------------------------------------------------------*/
@media (min-width: 601px) and (max-width: 800px)
	{

	nav#main_site_menu h2
		{
		padding-top: 15px;
		padding-bottom: 15px;
		padding-top: 12px;
		padding-bottom: 12px;
		cursor: pointer;
		}

	nav#main_site_menu h2
		{
		font-size: 24px;
		text-align: center;
		}

	nav#main_site_menu h2::after
		{
		display: inline-block;
		content: "►";
		padding-left: 14px;
		}

	/*========================================================================*/
	/* MENU TOGGLE (small screen) */

	nav#main_site_menu > div
		{
		display: none;
		}

	body.noJS	nav#main_site_menu										> div,
				nav#main_site_menu.menu_mouseover:not(.menu_touchstart)	> div,
				nav#main_site_menu.menu_click							> div
		{
		display: block;
		}

	body.noJS	nav#main_site_menu										> h2::after,
				nav#main_site_menu.menu_mouseover:not(.menu_touchstart)	> h2::after,
				nav#main_site_menu.menu_click							> h2::after
		{
		content: "▼";
		}

	/*========================================================================*/


	}



/*----------------------------------------------------------------------------*/
@media (min-width: 801px) and (max-width: 1920px)
	{

	nav#main_site_menu
		{
		margin-bottom: 20px;
		}

	nav#main_site_menu h2
		{
		padding-top: 9px;
		}

	}



/*----------------------------------------------------------------------------*/
@media (min-width: 1921px)
	{

	nav#main_site_menu
		{
		margin-bottom: 20px;
		}

	nav#main_site_menu h2
		{
		padding-top: 9px;
		}

	}



/*############################################################################*/
/* MAIN CONTENT */
/*############################################################################*/

main
	{
	z-index: 2;		/* same as hamburger dropdown so it doesn't go over video */
	position: relative;
	min-height: 400px;
	padding-bottom: 0px;
	font-size: 16px;
	line-height: 1.6;
	}

/* .AC_hub.home main */
body.page-template-T-home-mainhub	 main
	{
	padding-top: 0;
	}

/*
	H1	Page title
	H2	Nav header
	H3	seems to be the first level of header used in body copy
	H4	used rarely
*/

main h1,
main h2,
main h3,
main h4
	{
	color: #3C3A3D;
	line-height: 1.2em;
	}

main h1		/* the page title */
	{
	font-size: 27px;
	margin-bottom: 24px;
	}

/* unused in regular page copy */
main h2
	{
	font-size: 24px;
	margin-bottom: 21px;
	}

main h3		/* pre-existing page content uses h3 for section headers in copy */
	{
	font-size: 21px;
	margin-top: 24px;
	margin-bottom: 21px;
	}

main h4
	{
	font-size: 18px;
	margin-top: 18px;
	margin-bottom: 15px;
	}

main ul,
main ol
	{
	padding-left: 1.2em;
	}

main p,
main ul,
main ol
	{
	margin-bottom: 1em;
	}



/*----------------------------------------------------------------------------*/
/* FLEXIBLE LAYOUT */
/*----------------------------------------------------------------------------*/

@media (min-width: 301px) and (max-width: 400px)
	{
	main
		{
		}

	main
		{
		padding-top: 20px;
		}

	/* .AC_hub.home main */
	body.page-template-T-home-mainhub	 main
		{
		top: -30px;
		}

	}


/*----------------------------------------------------------------------------*/
@media (min-width: 401px) and (max-width: 800px)
	{
	main
		{
		}

	main
		{
		padding-top: 20px;
		}

	/* .AC_hub.home main */
	body.page-template-T-home-mainhub	 main
		{
		top: -37px;
		}

	}


/*----------------------------------------------------------------------------*/
@media (min-width: 801px) and (max-width: 1920px)
	{

	main
		{
		}

	main
		{
		padding-top: 40px;
		}

	/* .AC_hub.home main */
	body.page-template-T-home-mainhub	 main
		{
		top: -60px;
		}

	}


/*----------------------------------------------------------------------------*/
@media (min-width: 1921px)
	{

	main
		{
		}

	main
		{
		padding-top: 40px;
		}

	/* .AC_hub.home main */
	body.page-template-T-home-mainhub	 main
		{
		top: -60px;
		}

	}



/*============================================================================*/
/* ANCHOR LINKS */

nav#page_anchors
	{
	max-width: max-content;
	background: #eee;
	border-radius: 4px;
	padding: 1em;
	}

nav#page_anchors a
	{
	display: block;
	}


main a[href="#maincontent"]
	{
	display: block;
	text-align: right;
	}



/* ==================== */
/* Off-site links icon */


			a[href*="//"]:not([href*="ieeeauthor"])::after

	{
	content: "";

	background-image: url("data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-38 -50 88 88' %3E %3Cg stroke-width='6' fill='none' %3E %3Cpath d='M0 0L47 -47' stroke='rgb(44,99,168)' /%3E %3Cpath d='M20 -47L47 -47 47 -20' stroke='rgb(44,99,168)' /%3E %3Cpath d='M0 -35L-25 -35   Q-35 -35 -35 -25   L-35 25     Q-35 35 -25 35   L25 35   Q35 35 35 25   L35 0' stroke='rgb(44,99,168)' /%3E %3C/g%3E %3C/svg%3E ");

	background-size: 100% 100%;
	background-origin: content-box;
	background-repeat: no-repeat;
	display: inline-block;
	width:  0.9em;
	height: 0.9em;


	margin: 0 0.2em 0 0.5em ;

	vertical-align: -0.06em;
	}



/*
Don't display offsite icon for any specified links,
ieee meta (top) nav, or...
*/

			a[href*="//"]:not([href*="ieeeauthor"]).no_offsite_icon::after,
.ieeemeta	a[href*="//"]:not([href*="ieeeauthor"])::after,
.getstarted	a[href*="//"]:not([href*="ieeeauthor"])::after,
.bluebar	a[href*="//"]:not([href*="ieeeauthor"])::after,
			a[href*="//"]:not([href*="ieeeauthor"]).newsletter_button::after

	{
	content: "";
	background-image: none;
	display: none;
	}



/* Different color icons in footer */
footer		a[href*="//"]:not([href*="ieeeauthor"])::after
	{
	background-image: url("data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-38 -50 88 88' %3E %3Cg stroke-width='6' fill='none' %3E %3Cpath d='M0 0L47 -47' stroke='rgb(255, 255, 255)' /%3E %3Cpath d='M20 -47L47 -47 47 -20' stroke='rgb(255, 255, 255)' /%3E %3Cpath d='M0 -35L-25 -35   Q-35 -35 -35 -25   L-35 25     Q-35 35 -25 35   L25 35   Q35 35 35 25   L35 0' stroke='rgb(255, 255, 255)' /%3E %3C/g%3E %3C/svg%3E ");
	}




a[href$=".pdf"]::after
	{
	color: red;
	content: "";
	background-image: url("/wp-content/uploads/PDFicon.svg");
	background-size: 100% 100%;
	background-origin: content-box;
	background-repeat: no-repeat;
	display: inline-block;
	width:  15px;
	height: 18px;


	margin: 0 0.2em 0 0.5em ;

	vertical-align: -0.06em;
	}



/*============================================================================*/
/* BREADCRUMBS */

.breadcrumb
	{
	color: #555;
	font-size: 14px;
	margin-bottom: 15px;
	}

.breadcrumb a,
.breadcrumb span
	{
	white-space: nowrap;
	}

.breadcrumb a
	{
	color: #2C63A8;
	}

.breadcrumb a::after
	{
	Xcontent: ' » ';
	Xcolor: #2C63A8;
	}









/*============================================================================*/
/* LIST CHILDREN OF CURRENT PAGE */

#list_children
	{
	margin-top: 2em;
	background: #eee;
	padding: 2em;
	border-radius: 0.5em;
	}

#list_children h3
	{
	border-top: 1px solid #ddd;
	padding-top: 0.5em;
	}

#list_children h3 ~ h3
	{
	margin-top: 2em;
	}






/*############################################################################*/
/* CONTENT - HUB HOME PAGE */

/*============================================================================*/
/* HUB CIRCLES 1 2 3 */

.hub_circles
	{
	position: relative;
	background: transparent;
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	}

ol.hub_circles
	{
	padding-left: 0;
	margin-bottom: 0;
	}

.hub_circles li
	{
	background: #EC901E;
	text-align: center;
	color: #fff;
	line-height: 1;
	text-transform: uppercase;
	border-radius: 50%;
	}

.hub_circles li a
	{
	display: block;
	color: #fff;
	border-radius: 50%;
	font-weight: bold;
	font-family:  OpenSansBold, verdana, sans-serif;
	}

.hub_circles li a span
	{
	display: block;
	}

.hub_circles li:hover
	{
	background: #fff;
	color: #3C3A3D;
	}

.hub_circles li:hover a
	{
	color: #3C3A3D;
	}




/*----------------------------------------------------------------------------*/
/* FLEXIBLE LAYOUT */
/*----------------------------------------------------------------------------*/

@media (min-width: 301px) and (max-width: 400px)
	{

	.hub_circles
		{
		height: 86px;
		}

	.hub_circles li
		{
		height: 86px;
		width: 86px;
		border: 3px solid #EC901E;
		font-size: 11px;
		}

	.hub_circles li a
		{
		height: 80px;
		width: 80px;
		border: 3px solid #EC901E;
		}

	.hub_circles li:hover a
		{
		border: 3px solid #fff;
		}


	.hub_circles li a span
		{
		font-size: 24px;
		padding: 5px 0 5px;
		}

	}



/*----------------------------------------------------------------------------*/
@media (min-width: 401px) and (max-width: 800px)
	{

	.hub_circles
		{
		height: 108px;
		}

	.hub_circles li
		{
		height: 108px;
		width: 108px;
		border: 3px solid #EC901E;
		font-size: 13px;
		}

	.hub_circles li a
		{
		height: 102px;
		width: 102px;
		border: 3px solid #EC901E;
		}

	.hub_circles li:hover a
		{
		border: 3px solid #fff;
		}


	.hub_circles li a span
		{
		font-size: 27px;
		padding: 15px 0 6px;
		}

	}



/*----------------------------------------------------------------------------*/
@media (min-width: 801px)
	{

	.hub_circles
		{
		height: 164px;
		}

	.hub_circles li
		{
		box-shadow: 0px 3px 6px rgba(0,0,0,0.3);
		height: 164px;
		width: 164px;
		border: 11px solid #fff;
		font-size: 16px;
		}

	.hub_circles li a
		{
		height: 140px;
		width: 140px;
		border: 4px solid #EC901E;
		}

	.hub_circles li:hover a
		{
		border: 4px solid #EC901E;
		}


	.hub_circles li a span
		{
		font-size: 40px;
		padding: 15px 0 15px;
		}

	}




/*============================================================================*/
/* (CONTENT - HUB HOME PAGE) */



/*----------------------------------------------------------------------------*/
/* hubtop */

.hubtop
	{
	display: flex;
	justify-content: space-between;
	}



/*----------------------------------------------------------------------------*/
/* FLEXIBLE LAYOUT */
/*----------------------------------------------------------------------------*/
@media (min-width: 301px) and (max-width: 800px)
	{

	.hubtop
		{
		flex-direction: column;
		margin-top: 12px;
		margin-bottom: 52px;
		}

	}



/*----------------------------------------------------------------------------*/
@media (min-width: 801px) and (max-width: 1920px)
	{

	.hubtop
		{
		flex-direction: row;
		Xheight: 77px;
		align-items: center;
		margin-top: 20px;
		margin-bottom: 52px;
		}

	.hubtop h1,
	.hubtop p
		{
		padding: 0 40px;
		margin: 0;
		}

	.hubtop h1
		{
		white-space: nowrap;
		}

	.hubtop p
		{
		border-left: 1px solid #3C3A3D;
		}

	}



/*----------------------------------------------------------------------------*/
@media (min-width: 1921px)
	{

	.hubtop
		{
		flex-direction: row;
		Xheight: 77px;
		align-items: center;
		margin-top: 20px;
		margin-bottom: 52px;
		}

	.hubtop h1,
	.hubtop p
		{
		padding: 0 40px;
		margin: 0;
		}

	.hubtop h1
		{
		white-space: nowrap;
		}

	.hubtop p
		{
		border-left: 1px solid #3C3A3D;
		}

	}






/*############################################################################*/
/* CONTENT - SUBSITE HOME PAGE */

/*----------------------------------------------------------------------------*/
/* subsitetop */

.subsitetop
	{
	display: grid;
	}

.subsitetop div.rotator	{ grid-area: sst-d; }
.subsitetop h1			{ grid-area: sst-h; }
.subsitetop p			{ grid-area: sst-p; }

/*----------------------------------------------------------------------------*/
/* FLEXIBLE LAYOUT */
/*----------------------------------------------------------------------------*/
@media (min-width: 301px) and (max-width: 1200px)
	{
/* SINGLE COLUMN */

	.subsitetop h1
		{
		}

	.subsitetop img
		{
		width: 400px;
		max-width: 100%;
		height: auto;
		}

	.subsitetop p
		{
		padding-top: 16px;
		}


	.subsitetop { grid-template-columns: auto auto auto ; }

	.subsitetop	{ grid-template-rows: auto auto auto; }

	.subsitetop
		{
		grid-template-areas:
			"	sst-h	"
			"	sst-d	"
			"	sst-p	"
			;
		}

	}


@comment---------------------------------------
{
			calc( (100vw - 300px) * 75 / 300 + 15px)	/* 15 - 90 */
			1fr
			calc( (100vw - 300px) *  110 / 300 +  40px)	/* 40 - 150 */
			calc( (100vw - 300px) * 75 / 300 + 15px)	/* 15 - 90 */
}




/*----------------------------------------------------------------------------*/
@media (min-width: 1201px) and (max-width: 1400px)
	{
/* IMAGE GROWS */

	.subsitetop h1,
	.subsitetop p
		{
		padding-left: 16px;
		}

	.subsitetop img
		{
		width: calc( (100vw - 1200px) * 100 / 200 +  300px);	/* 300 - 400 */
		}



	.subsitetop { grid-template-columns: auto auto ; }

	.subsitetop	{ grid-template-rows: min-content 1fr; }

	.subsitetop
		{
		grid-template-areas:
			"	sst-d	sst-h	"
			"	sst-d	sst-p	"
			;
		}

	}

/*----------------------------------------------------------------------------*/
@media (min-width: 1401px) and (max-width: 1920px)
	{
/* FIXED WIDTHS */

	.subsitetop h1,
	.subsitetop p
		{
		padding-left: 16px;
		}

	.subsitetop img
		{
		width: 400px;
		}



	.subsitetop { grid-template-columns: auto auto ; }

	.subsitetop	{ grid-template-rows: min-content 1fr; }

	.subsitetop
		{
		grid-template-areas:
			"	sst-d	sst-h	"
			"	sst-d	sst-p	"
			;
		}

	}



/*----------------------------------------------------------------------------*/
@media (min-width: 1921px)
	{

	.subsitetop h1,
	.subsitetop p
		{
		padding-left: 16px;
		}

	.subsitetop img
		{
		width: 400px;
		}



	.subsitetop { grid-template-columns: auto auto ; }

	.subsitetop	{ grid-template-rows: min-content 1fr; }

	.subsitetop
		{
		grid-template-areas:
			"	sst-d	sst-h	"
			"	sst-d	sst-p	"
			;
		}




	}








/*----------------------------------------------------------------------------*/
/* getstarted */
/*----------------------------------------------------------------------------*/

.getstarted
	{
	clear: both;
	margin-bottom: 20px;
	margin-top: 24px;
	border-top: 1px solid #ddd;
	min-height: 20px;		/* so an empty getstarted still pushes blue bar down below nav */
	}

.getstarted > h2
	{
	margin-top: 12px;
	margin-bottom: 24px;
	}

.getstarted > div a
	{
	color: #3C3A3D;
	font-size: 18px;
	font-weight: 500;
	font-weight: bold;
	}




.getstarted > div
	{
	display: flex;
	}


.getstarted > div a
	{
	Xflex-grow: 1;
	flex-basis: max-content;
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: start;
	margin-bottom: 34px;
	}

.getstarted > div img
	{
	max-height: 58px;
	}

.getstarted > div span
	{
	flex-shrink: 0;
	line-height: 1.1;
	margin-left: 20px;
	}



/*----------------------------------------------------------------------------*/
/* FLEXIBLE LAYOUT */
/*----------------------------------------------------------------------------*/
@media (min-width: 301px) and (max-width: 1200px)
	{

	.getstarted > div
		{
		flex-direction: column;
		justify-content: start;
		}

	.getstarted > div a
		{
		}

	.getstarted > div img
		{
		flex-basis: 70px;
		flex-shrink: 0;
		}

	.getstarted span br
		{
		display: none;
		}

	}


/*----------------------------------------------------------------------------*/
@media (min-width: 1201px)
	{

	.getstarted > div
		{
		flex-direction: row;
		justify-content: space-between;
		}

	.getstarted > div a
		{
		}

	}





/*############################################################################*/
/* BLUE BAR - both HUB HOME AND SUBSITE HOMES



/*----------------------------------------------------------------------------*/
/* (CONTENT - HUB HOME PAGE) */
/* bluebar */


.bluebar
	{
	z-index: 1;
	position: relative;
	}

.bluebar,
.bluebar::before,
.bluebar::after
	{
	background: #2C63A8;
	}

	.bluebar::before,
	.bluebar::after
		{
		position: absolute;
		top: 0px;
		width: 9999px;
		content: " ";
		height: 100%;
		}

	.bluebar::before
		{
		left: -9999px;
		}

	.bluebar::after
		{
		right: -9999px;
		}




.bluebar h2
	{
	color: #fff;
	padding: 9px 0;
	margin-bottom: 24px;
	}

.bluebar > div
	{
	display: flex;
	justify-content: space-between;
	}

.bluebar *
	{
	margin: 0;
	}

.bluebar div div
	{
	text-align: center;
	}

.bluebar h3
	{
	color: #EC901E;
	text-transform: uppercase;
	font-size: 18px;
	padding-bottom: 12px;
	}

.bluebar h3 a
	{
	color: #fff;
	color: hsl(33, 70%, 85%);	/* 33,84%,52% is same as EC901E */ /* new link on bluebar */
	}

.bluebar h3 a:hover
	{
	color: hsl(33, 75%, 85%);	/* 33,84%,52% is same as EC901E */ /* prev hover TOO LIGHT??? */
	color: hsl(33, 95%, 90%);	/* 33,84%,52% is same as EC901E */ /* new hover on bluebar */
	color: hsl(33, 99%, 85%);	/* 33,84%,52% is same as EC901E */ /* new hover on bluebar */
	color: #fff;
	color: hsl(33, 84%, 52%);	/* 33,84%,52% is same as EC901E */ /* prev hover TOO LIGHT??? */
	}


.bluebar p
	{
	color: #fff;
	}




/*----------------------------------------------------------------------------*/
/* FLEXIBLE LAYOUT */
/*----------------------------------------------------------------------------*/
@media (min-width: 301px) and (max-width: 800px)
	{

	.bluebar
		{
		padding: 24px 24px 24px;
		}

	.bluebar h2
		{
		padding: 0 0 20px 0;
		}

	.bluebar div div + div
		{
		padding-top: 30px;
		position: relative;
		}

	.bluebar div div + div::before
		{
		content: " ";
		display: block;
		position: absolute;
		width: 100%;
		height: 1px;
		top: 15px;
		border-top: 1px solid #fff;
		}

	/* .AC_hub.home */
	.bluebar > div
		{
		flex-direction: column;
		}

	}



/*----------------------------------------------------------------------------*/
@media (min-width: 801px) and (max-width: 1400px)
	{

	.bluebar
		{
		padding-top: 24px;
		padding-bottom: 24px;
		}

	.bluebar h2
		{
		padding: 0 0 10px 0;
		}

	.bluebar h3
		{
		padding: 20px 0 40px;
		}

	.bluebar > div
		{
		flex-direction: row;
		align-items: flex-start;
		align-items: stretch;
		}

	.bluebar > div div
		{
		}

	.bluebar div div + div
		{
		padding-left: calc( (100vw - 800px) * 84 / 600 +  40px);	/* 40 - 124 */
		position: relative;
		}

	.bluebar div div + div::before
		{
		content: " ";
		display: block;
		position: absolute;
		width: 18px;
		height: calc( 100% - 18px );
		top: 9px;
		left: calc( (100vw - 800px) * 47 / 600 +  2px);	/* 2 - 49 */
		left: calc( (100vw - 800px) * 23 / 600 +  2px);	/* 2 - 25 */
		border: solid #fff;
		border-width: 0 1px 1px 0 ;

		transform: skew(0, -45deg);
		}

	/* .AC_hub.home .bluebar div div + div::before */
	body.page-template-T-home-mainhub	 .bluebar div div + div::before
		{
		top: 9px;
		}


	}






/*----------------------------------------------------------------------------*/
@media (min-width: 1401px) and (max-width: 1920px)
	{

	.bluebar
		{
		padding-top: 24px;
		padding-bottom: 24px;
		}

	.bluebar h2
		{
		padding: 0 0 10px 0;
		}

	.bluebar h3
		{
		padding: 20px 0 40px;
		}

	.bluebar > div
		{
		flex-direction: row;
		align-items: flex-start;
		align-items: stretch;
		}

	.bluebar > div div
		{
		}

	.bluebar div div + div
		{
		padding-left: 124px;
		position: relative;
		}

	.bluebar div div + div::before
		{
		content: " ";
		display: block;
		position: absolute;
		width: 18px;
		height: calc( 100% - 18px );
		top: 9px;
		left: 9px;
		border: solid #fff;
		border-width: 0 1px 1px 0 ;

		transform: skew(0, -45deg);
		}

	/* .AC_hub.home .bluebar div div + div::before */
	body.page-template-T-home-mainhub	 .bluebar div div + div::before
		{
		top: 9px;
		}



	}



/*----------------------------------------------------------------------------*/
@media (min-width: 1921px)
	{

	.bluebar
		{
		padding-top: 24px;
		padding-bottom: 24px;
		}

	.bluebar h2
		{
		padding: 0 0 10px 0;
		}

	.bluebar h3
		{
		padding: 20px 0 40px;
		}

	.bluebar > div
		{
		flex-direction: row;
		align-items: flex-start;
		align-items: stretch;
		}

	.bluebar > div div
		{
		}

	.bluebar div div + div
		{
		padding-left: 124px;
		position: relative;
		}

	.bluebar div div + div::before
		{
		content: " ";
		display: block;
		position: absolute;
		width: 18px;
		height: calc( 100% - 18px );
		top: 9px;
		left: 9px;
		border: solid #fff;
		border-width: 0 1px 1px 0 ;

		transform: skew(0, -45deg);
		}

	/* .AC_hub.home .bluebar div div + div::before */
	body.page-template-T-home-mainhub	 .bluebar div div + div::before
		{
		top: 9px;
		}



	}


/*############################################################################*/
/* ROTATOR - SUBSITE HOMES */

.rotator
	{
	position: relative;
	}

.rotator img
	{
	position: relative;
	display: block;
	opacity: 0;
	animation-iteration-count: infinite;
	border: 1px solid #ccc;
	}

.rotator img ~ img
	{
	position: absolute;
	top: 0;
	left: 0;
	}

.rotator img:nth-child(1)	{ animation-delay:  0.0s; }
.rotator img:nth-child(2)	{ animation-delay:  6.0s; }
.rotator img:nth-child(3)	{ animation-delay: 12.0s; }
.rotator img:nth-child(4)	{ animation-delay: 18.0s; }
.rotator img:nth-child(5)	{ animation-delay: 24.0s; }
.rotator img:nth-child(6)	{ animation-delay: 30.0s; }
.rotator img:nth-child(7)	{ animation-delay: 36.0s; }
.rotator img:nth-child(8)	{ animation-delay: 42.0s; }
.rotator img:nth-child(9)	{ animation-delay: 48.0s; }

.rotator img:first-child:nth-last-child(2), .rotator img:first-child:nth-last-child(2) ~ img { animation-name: fade2; animation-duration: 12s; }
.rotator img:first-child:nth-last-child(3), .rotator img:first-child:nth-last-child(3) ~ img { animation-name: fade3; animation-duration: 18s; }
.rotator img:first-child:nth-last-child(4), .rotator img:first-child:nth-last-child(4) ~ img { animation-name: fade4; animation-duration: 24s; }
.rotator img:first-child:nth-last-child(5), .rotator img:first-child:nth-last-child(5) ~ img { animation-name: fade5; animation-duration: 30s; }
.rotator img:first-child:nth-last-child(6), .rotator img:first-child:nth-last-child(6) ~ img { animation-name: fade6; animation-duration: 36s; }
.rotator img:first-child:nth-last-child(7), .rotator img:first-child:nth-last-child(7) ~ img { animation-name: fade7; animation-duration: 42s; }
.rotator img:first-child:nth-last-child(8), .rotator img:first-child:nth-last-child(8) ~ img { animation-name: fade8; animation-duration: 48s; }
.rotator img:first-child:nth-last-child(9), .rotator img:first-child:nth-last-child(9) ~ img { animation-name: fade9; animation-duration: 54s; }






.rotator img:only-child
	{
	opacity: 1;
	}

@keyframes fade2
	{
	from	{ opacity: 0; }
	25%		{ opacity: 1; }
	50%		{ opacity: 1; }
	75%		{ opacity: 0; }
	}

@keyframes fade3
	{
	from	{ opacity: 0; }
	16.667%	{ opacity: 1; }
	33.333%	{ opacity: 1; }
	50%		{ opacity: 0; }
	}

@keyframes fade4
	{
	from	{ opacity: 0; }
	12.5%	{ opacity: 1; }
	25%		{ opacity: 1; }
	37.5%	{ opacity: 0; }
	}

@keyframes fade5
	{
	from	{ opacity: 0; }
	10%		{ opacity: 1; }
	20%		{ opacity: 1; }
	30%		{ opacity: 0; }
	}

@keyframes fade6
	{
	from	{ opacity: 0; }
	 8.333%	{ opacity: 1; }
	16.667%	{ opacity: 1; }
	25%		{ opacity: 0; }
	}

@keyframes fade7
	{
	from	{ opacity: 0; }
	 7.143%	{ opacity: 1; }
	14.286%	{ opacity: 1; }
	21.429%	{ opacity: 0; }
	}

@keyframes fade8
	{
	from	{ opacity: 0; }
	 6.25%	{ opacity: 1; }
	12.5%	{ opacity: 1; }
	18.75%	{ opacity: 0; }
	}

@keyframes fade9
	{
	from	{ opacity: 0; }
	 5.555%	{ opacity: 1; }
	11.111%	{ opacity: 1; }
	16.666%	{ opacity: 0; }
	}



/*############################################################################*/
/*############################################################################*/
/* CONTENT - SEARCH RESULTS */


.result_subhead
	{
	color: #555;
	line-height: 1;
	margin: -10px 0 35px 0;
	}


.search-results p,
.search-results h2
	{
	max-width: 60em;
	}


body.search-results article {
	border: 0;
	padding: 0;
	margin: 0em 0 2em 0;
}

body.search-results article:last-child {
	margin: 0;
}

body.search-results article h2 {
	padding-bottom: 5px;
}


body.search-results article h2		/* size as h3 in main content */
	{
	font-size: 21px;
	margin-top: 4px;		/* but not these */
	margin-bottom: 4px;
	}

body.search-results article h3		/* size as h4 in main content */
	{
	font-size: 18px;
	margin-top: 18px;
	margin-bottom: 15px;
	}

body.search-results article section
	{
	margin-top: 0px;	/* closer than default */
	}


body.search-results span.sitename
	{
	font-size: 0.8em;
	font-weight: bold;
	font-family:  OpenSansBold, verdana, sans-serif;
	color: #888;
	}

body.search-results article p strong {
	Xfont-weight: bold;
	Xfont-size: 1.1em;
	color: #000
}

body.search-results article footer {
	display: none;
}


/*----------------------------------------------------------------------------*/

body.search-results ul.pagination
	{
	padding: 0;
	display: flex;
	justify-content: space-between;
	width: 300px;
	}

body.search-results ul.pagination li
	{
	}

body.search-results ul.pagination li:empty
	{
	display: none;
	}



/*############################################################################*/
/*############################################################################*/
/* VIDEO TUTORIALS */

/*----------------------------------------------------------------------------*/
/*----------------------------------------------------------------------------*/
/*----------------------------------------------------------------------------*/

/* content blocks */

.video_blocks
	{
	width: 100%;

	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: flex-start;

	margin-bottom: 2em;
	}

.video_blocks > iframe,
.video_blocks > div
	{
	margin-bottom: 1.5rem;
	}

/* content block images */

.video_blocks		> div > a > img
	{
	display: block;
	width: 384px;
	max-width: 100%;
	height: 216px;
	height: auto;
	margin-bottom: 0.5em;

	}

/* module responsiveness */
@media (min-width: 1024px)
	{
	/* revisit layout when > 2 pubs */


	.video_blocks > iframe,
	.video_blocks > div
		{
		display: inline-block;
		}

	}

@media (max-width: 1023px)
	{
	}


.video_blocks span.runtime
	{
	display: block;
	position: absolute;
	right: 0;
	bottom: 0;
	background: rgba(0,0,0,0.8);
	box-sizing: border-box;
	height:20px;
	padding: 2px 6px 0;
	}

.video_blocks a::after
	{
	display: none;
	}


.video_blocks
	{
	padding-top: 15px;
	padding-top: 10px;
	}

.video_blocks .runtime
	{
	color: #ccc;
	font-style: italic;
	font-size: 0.7rem;
	}





/* ==================== */
/* popup videos */

.video
	{
	position: relative;
	display: inline-block;
	max-width: 256px;
	margin-right: 2em;
	}

.video img
	{
	display: block;
	max-width: 256px;
	height: auto;

	}

.video .player
	{
	display: none;
	}

.video *
	{
	z-index: 0;
	}

.video input
	{
	display: none;
	}

.video [type=checkbox]+label
	{
	margin-left: 0;
	margin-right: 0;
	cursor: pointer;
	}

.video input:checked ~ label
	{
	}

.video input ~ label .video_title
	{
	display: block;
	}

.video input ~ label .video_title,
.video input ~ label .close
	{
	/* style video titles similar to an H4 */
	font-size: 1.1rem;
	line-height: 1.2;
	padding-top: 0.5em;
	}

.video input ~ label .close
	{
	color: rgb(128, 179, 208);
	}

.video input ~ label .video_title
	{
	color: #2C63A8;
	}

.video input ~ label .close
	{
	display: none;
	display: block;
	}

.video input:checked ~ label .close
	{
	z-index: 2;
	position: fixed;
	top:0; right:0; bottom:0; left:0;
	margin: 0; padding: 0; border: 0;
	background: rgba(55,55,55,0.95);
	background: rgb(55,55,55);
	}

.video input ~ label .close span
	{
	display:none;
	}


.video input:checked ~ label .close span
	{
	display:inline;
	position: absolute;
	top: 0; right: 0;
	background: rgba(255,255,255,0.5);
	color: #000;
	padding: 0.3rem 0.5rem;
	border-bottom-left-radius: 0.2rem;
	}

.video input:checked ~ label .close span::after
	{
	content: "\2715";
	content: "\a0d";
	content: "\274e";
	content: "\d7";

	margin-left: 1rem;
	}



.video input:checked ~ .player
	{
	Xborder: 2px solid green;
	z-index: 2;
	position: fixed;
	display: block;

	/* padding-bottom: 56.25%; */
	left: 1rem;
	right: 1rem;
	top: 3rem;
	bottom: 1rem;
	}

.video input:checked ~ .player iframe
	{
	Xborder: 2px solid red;

	display: block;
	width: 1600px;
	height: 900px;


	/* 177.78  56.25 */

	max-width:	 100% ;
	max-height:	 100% ;
	max-width:	min( calc( (100vh - 4rem) * 1.7778 ), 100% );
	max-height:	min( calc( (100vw - 2rem) * 0.5625 ), 100% );
	margin-left: auto;
	margin-right: auto;

	}

span.video-thumb
	{
	display: block;
	position: relative;
	}



/*----------------------------------------------------------------------------*/
/*----------------------------------------------------------------------------*/
/*----------------------------------------------------------------------------*/







/*############################################################################*/
/*############################################################################*/
/* NEWSLETTER */

#newsletter
	{
	}

#newsletter > a.newsletter_button
	{
	font-weight: bold;
	color: #fff;
	display: block;
	background: #EC901E;
	margin: 20px auto 20px auto;	/* top margin uses footer padding instead */
	border-radius: 2px;
	text-align: center;
	width: 320px;
	padding: 16px 36px;
	line-height: 1;
	font-size: 16px;
	}

/*----------------------------------------------------------------------------*/

@media (min-width: 301px) and (max-width: 400px)
	{

	#newsletter > a.newsletter_button
		{
		width: calc( (100vw - 300px) * 60 / 100 +  260px);	/* 260 - 320 */
		padding-left: calc( (100vw - 300px) * 20 / 100 +  16px);	/* 16 - 36 */
		padding-right: calc( (100vw - 300px) * 20 / 100 +  16px);	/* 16 - 36 */
		}

	}






/*############################################################################*/
/*############################################################################*/
/* ASDF */

/*----------------------------------------------------------------------------*/








/*############################################################################*/
/*############################################################################*/
/* BOTTOM AC_NAV */

#AC_nav_bottom
	{
	}

#AC_nav_bottom nav.subsite_menu
	{
	display: block;
	padding: 22px 30px;
	background: #444;
	}

#AC_nav_bottom nav.subsite_menu a
	{
	color: #fff
	}

/*----------------------------------------------------------------------------*/





/*############################################################################*/
/*############################################################################*/
/* FOOTER */

footer
	{
	background: #fff;
	}

footer > div.ieeefooter
	{
	padding: 22px 30px;
	}

footer > div.ieeefooter
	{
	background: #000;
	color: #fff;
	}

footer ul
	{
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: space-between;
	margin: 0 -20px;
	}

footer li
	{
	display: inline-block;
	text-transform: uppercase;
	list-style-type: none;
	font-size: 16px;
	font-size: 12px;
	margin: 0 15px;
	line-height: 3.0em;
	}

footer li + li
	{
	}

footer p
	{
	line-height: 1.9;
	margin-top: 0.9em;
	font-size: 12px;
	max-width: 100%;
	}

footer a
	{
	color: #fff;
	}




/*----------------------------------------------------------------------------*/
/* FLEXIBLE LAYOUT */
/*----------------------------------------------------------------------------*/
@media (min-width: 301px) and (max-width: 600px)
	{
	footer ul
		{
		flex-direction: column;
		}

	}


/*----------------------------------------------------------------------------*/
/* @media (min-width: 601px) and (max-width: 1920px) */
@media (min-width: 601px)
	{
	footer ul
		{
		flex-direction: row;
		}

	}


/*----------------------------------------------------------------------------*/





/*############################################################################*/
/*############################################################################*/
/* ASDF */

/*----------------------------------------------------------------------------*/



