/**
 * @package    hubzero-cms
 * @copyright  Copyright (c) 2005-2020 The Regents of the University of California.
 * @license    http://opensource.org/licenses/MIT MIT
 */

/*

	-- -- -- -- -- -- --
	plg_courses_guide CSS
	-- -- -- -- -- -- --

*/

	@font-face {
		font-family: 'BloklettersBalpen';
		src: url('/core/plugins/courses/guide/assets/fonts/Blokletters-Balpen-webfont.eot');
		src: url('/core/plugins/courses/guide/assets/fonts/Blokletters-Balpen-webfont.eot?#iefix') format('embedded-opentype'),
		     url('/core/plugins/courses/guide/assets/fonts/Blokletters-Balpen-webfont.woff') format('woff'),
		     url('/core/plugins/courses/guide/assets/fonts/Blokletters-Balpen-webfont.ttf') format('truetype'),
		     url('/core/plugins/courses/guide/assets/fonts/Blokletters-Balpen-webfont.svg#BloklettersBalpen') format('svg');
		font-weight: normal;
		font-style: normal;
	}

	/* Disable fancybox lock to allow overlay to scroll with page */
	body.fancybox-lock {
		overflow: visible;
		position: relative;
	}

	#page_menu li .guide:before {
		content: "\f059";
	}

/* Overlay content */
	#guide-overlay {
		display: none;
	}
	.fancybox-opened #guide-overlay,
	.course_guide #guide-overlay {
		display: block;
	}
	#guide-content {
		margin-top: 50px;
	}
	#guide-content,
	#guide-content h2,
	#guide-content h3 {
		font-family: "BloklettersBalpen", "Comic Sans", "Comic Sans MS", cursive, sans-serif;
		color: #fff;
	}
	#guide-content .fancybox-skin {
		background: transparent;
		-webkit-border-radius: 0px;
		   -moz-border-radius: 0px;
		    -ms-border-radius: 0px;
		     -o-border-radius: 0px;
		        border-radius: 0px;
		color: #fff;
		text-shadow: 0 2px 3px rgba(0, 0, 0, 0.8);
		-webkit-box-shadow: none;
		   -moz-box-shadow: none;
		    -ms-box-shadow: none;
		     -o-box-shadow: none;
		        box-shadow: none;
	}
	#guide-content .fancybox-outer, 
	#guide-content .fancybox-inner {
		background: transparent;
	}
	.guide-onemorething {
		margin: 6em auto 0 auto;
		position: relative;
		width: 19em;
	}
	.guide-luck {
		font-size: 2.2em;
		line-height: 0.75;
		margin: 0;
	}
	.guide-luck:after {
		content: "\f087";
		font-family: "Fontcons";
		font-size: 2.5em;
		position: absolute;
		top: 0;
		right: 0;
	}

	.guide-instructions {
		padding: 1em;
		position: relative;
		margin: 0 auto 34px auto;
		width: 13em;
	}
	.guide-instructions:after {
		content: "\f059";
		font-family: "Fontcons";
		display: block;
		width: 1em;
		height: 1em;
		position: absolute;
		left: -1em;
		top: 1.5em;
		font-size: 2em;
	}
	.guide-instructions:before {
		content: "";
		display: block;
		height: 1px;
		position: absolute;
		left: -1.4em;
		top: 3.7em;
		right: 0;
		background: #fff;
		background: rgba(255, 255, 255, 0.4);
		box-shadow: 0 2px 3px rgba(0, 0, 0, 0.8);
	}

	.guide-instructions h2 {
		margin: 0;
		padding: 0;
	}
	.guide-nav ul {
		margin: 37px 0 0 0;
		padding: 0;
		list-style: none;
	}
	.guide-nav ul li {
		margin: 0 0 0 109px;
		padding: 19px 0;
		font-size: 1.5em;
		position: relative;
		line-height: 1;
	}
	.guide-nav ul li span {
		font-size: 0.7em;
		display: block;
		line-height: 1.5em;
		color: #e1e1e1;
		color: rgba(255, 255, 255, 0.8);
	}
	.guide-nav ul li:before {
		content: "";
		display: block;
		width: 60px;
		height: 60px;
		position: absolute;
		left: -110px;
		top: 10px;
		-webkit-border-radius: 50%;
		   -moz-border-radius: 50%;
		    -ms-border-radius: 50%;
		     -o-border-radius: 50%;
		        border-radius: 50%;
		background-image: -webkit-gradient(radial, center center, 0, center center, 141, from(rgba(255, 255, 255, 0.2)), to(transparent));
		background-image: -webkit-radial-gradient(center center, circle contain, rgba(255, 255, 255, 0.2) 0%, transparent 100%);
		background-image: -moz-radial-gradient(center center, circle contain, rgba(255, 255, 255, 0.2) 0%, transparent 100%);
		background-image: -ms-radial-gradient(center center, circle contain, rgba(255, 255, 255, 0.2) 0%, transparent 100%);
		background-image: -o-radial-gradient(center center, circle contain, rgba(255, 255, 255, 0.2) 0%, transparent 100%);
		background-image: radial-gradient(center center, circle contain, rgba(255, 255, 255, 0.2) 0%, transparent 100%);
	}
	.guide-nav ul li:after {
		content: "\2190";
		font-family: "Fontcons";
		display: block;
		width: 1em;
		height: 1em;
		position: absolute;
		left: -1.4em;
		top: 40%;
	}

	.guide-nav ul li strong:before {
		height: 1em;
		width: 1em;
		margin: 0;
		padding: 0;
		font-size: 24px;
		line-height: 1;
		font-family: "Fontcons";
		font-style: normal;
		font-weight: normal;
		text-indent: 0em;
		position: absolute;
		top: 28px;
		left: -88px;
		text-align: center;
		color: #ffc;
	}
	.course_guide .guide-nav ul li strong:before {
		color: #333;
	}
	.guide-nav ul li .outline:before { content: "\f0ae"; }
	.guide-nav ul li .members:before { content: "\f007"; }
	.guide-nav ul li .wiki:before { content: "\f072"; }
	.guide-nav ul li .announcements:before { content: "\f095"; }
	.guide-nav ul li .messages:before { content: "\2709"; }
	.guide-nav ul li .forum:before,
	.guide-nav ul li .discussions:before { content: "\f086"; }
	.guide-nav ul li .syllabus:before { content: "\f05a"; }
	.guide-nav ul li .wishlist:before { content: "\f078"; }
	.guide-nav ul li .calendar:before { content: "\f073"; }
	.guide-nav ul li .usage:before { content: "\f080"; }
	.guide-nav ul li .projects:before { content: "\f03f"; }
	.guide-nav ul li .progress:before { content: "\f012"; }
	.guide-nav ul li .dashboard:before { content: "\f083"; }
	.guide-nav ul li .notes:before { content: "\270D"; }
	.guide-nav ul li .pages:before { content: "\f05a"; }
	.guide-nav ul li .guide:before { content: "\f059"; }

/* Guide content */
	.course_guide .subject {
		border: none;
		padding: 0.7em 1em 1em 1em;
		background: none;
		border-bottom: 0;
		padding: 10px 0 0 0;
	}
	.course_guide .guide-menu {
		margin: 20px 0 -1px 20px;
		padding: 0;
		list-style: none;
		position: relative;
	}
	.course_guide .guide-menu:after {
		content: "";
		display: table;
		clear: left;
	}
	.course_guide .guide-menu p {
		margin: 0;
		padding: 0;
		position: absolute;
		top: -10px;
		right: 20px;
	}
	.course_guide .guide-menu ul {
		list-style: none;
		margin: 0 11em 0 0;
		padding: 0;
	}
	.course_guide .guide-menu li {
		position: relative;
		margin: 0;
		padding: 0;
		display: block;
		float: left;
	}
	.course_guide .guide-menu li a {
		color: #aaa;
		position: relative;
		display: block;
		background: none;
		padding: 0.5em 1em;
		border: 1px solid #e9e9e9;
		border-bottom: none;
	}
	.course_guide .guide-menu li a:hover {
		color: #444;
	}
	.course_guide .guide-menu li a:before {
		content: "\f059";
		font-family: 'Fontcons';
		color: #999;
		margin-right: 0.5em;
	}
	.course_guide .guide-menu li a.active:before,
	.course_guide .guide-menu li a:hover:before {
		color: #444;
	}
	.course_guide .guide-menu li a.active {
		color: #444;
		background: #f9f9f9;
	}

	.course_guide .guide-menu p {
		text-align: center;
	}

	.course_guide .guide-content {
		position: relative;
	}

	.course_guide .manager-options {
		list-style: none;
		margin: 0;
		padding: 0;
		position: absolute;
		top: 0px;
		right: 0px;
	}
	.course_guide .manager-options li {
		display: block;
		margin: 0;
		padding: 0;
		float: right;
	}
	.course_guide .manager-options a {
		display: block;
		font-size: 1.6em;
		width: 1em;
		height: 1em;
		overflow: hidden;
		border: none;
		margin-left: 0.5em;
		color: #bbb;
	}
	.course_guide .manager-options a:hover {
		color: #333;
	}

	.course_guide .embedded-plugin {
		background: url("/core/plugins/courses/guide/assets/img/checkered.png");
		text-align: center;
		vertical-align: middle;
	}
	.course_guide .embedded-plugin,
	.course_guide .embedded-plugin a {
		border: none;
	}
	.course_guide .embedded-plugin a {
		top: 50%;
		display: block;
		position: relative;
	}

	.guide-about {
		border: 1px solid #fff;
		margin: 19px 0 0 0;
		padding: 1em 2em;
		position: relative;
	}
	.guide-about a {
		color: #ffc;
	}
	.guide-dismiss {
		border-top: 1px solid #fff;
		border-top: 1px solid rgba(255, 255, 255, 0.4);
		margin-top: 2em;
		padding-top: 2em;
	}
	.guide-about:before,
	.guide-about:after {
		content: "";
		display: block;
		position: absolute;
		left: 50%;
		bottom: 0;
	}
	.guide-about:before {
		width: 1px;
		height: 25px;
		background-color: #fff;
		bottom: -25px;
	}
	.guide-about:after {
		border: 7.5px solid #fff;
		border-color: #fff transparent transparent transparent;
		bottom: -39px;
		margin-left: -7.5px;
	}
	.guide-nav ul {
		margin-top: 0;
	}

/* Instructions */
	#guide-introduction {
		width: 32em;
		margin: 3em auto;
		background-color: #fff;
		-webkit-box-shadow: 0 1px 3px rgba(25, 25, 25, 0.4);
		   -moz-box-shadow: 0 1px 2px rgba(25, 25, 25, 0.4);
		    -ms-box-shadow: 0 1px 3px rgba(25, 25, 25, 0.4);
		     -o-box-shadow: 0 1px 3px rgba(25, 25, 25, 0.4);
		        box-shadow: 0 1px 3px rgba(25, 25, 25, 0.4);
	}
	#guide-introduction .instructions {
		padding: 1em 1.4em;
	}
	#guide-introduction .questions {
		padding: 1em 1.4em;
		background-color: #f0f0f0;
	}
	#guide-introduction ol {
		list-style: decimal;
	}