/*<meta />*/

/* Local stylesheet to add underline to the "Video" link and restructure the page as needed.
Apply this stylesheet through the topic file properties for the video category page only.
This is for use when there is one video page only. */

a#Topics:link,
a#Topics:visited
{
	border-bottom: 2px solid transparent;
	mc-hidden: hidden;
}

a#Topics:active,
a#Topics:hover
{
	border-bottom: 2px solid var(--Green-InEight);
	/*CornFlower blue replaces Green*/
	mc-hidden: hidden;
}

a#Videos:link,
a#Videos:visited
{
	border-bottom: 2px solid var(--Green-InEight);
	/*CornFlower blue replaces Green*/
	mc-hidden: hidden;
}

nav.sidenav-wrapper
{
	visibility: hidden;
	display: none;
}

div.three-column-layout > div:nth-child(1),
div.three-column-layout > div:nth-child(3)
{
	display: none;
}

div.three-column-layout > div:nth-child(2)
{
	width: 100%;
	border-color: transparent;
	mc-hidden: hidden;
}

div.HelpHomeButton
{
	margin-bottom: 20px;
}

div#ToolbarTable
{
	display: none;
}

div.breadcrumbs
{
	display: none;
}

/* Container for Wistia videos. */

div.video-container
{
	background-color: var(--White);
	padding: 1%;
	margin-bottom: 25px;
	margin-top: 50px;
	margin-left: auto;
	margin-right: auto;
}

div.video-problem
{
	font-family: var(--Font-Header-SemiBold);
	font-size: 16pt;
	line-height: 24pt;
	color: var(--Gray-Medium);
	text-align: center;
	max-width: 500px;
	height: 200px;
	position: relative;
	top: 100px;
	margin: auto;
	z-index: 5;
	-webkit-animation-name: FadeInText;
	animation-name: FadeInText;
	animation-duration: 3s;
	animation-delay: 3s;
	animation-fill-mode: both;
}

/* Fade in note if videos are blocked. */

@-webkit-keyframes FadeInText
{
	0% 
	{
		opacity: 0;
	}
	
	100% 
	{
		opacity: 1;
	}
		
} 

@keyframes FadeInText 
{
	0% {opacity: 0;}
	100% {opacity: 1;}
		
} 

div.video-carousel
{
	position: relative;
	top: -200px;
	z-index: 10;
}

/* tablet mode */

@media only screen and (max-width: 1179px)
{
	div.topic-layout
	{
		max-width: none;
	}
}