.mglms {
	
}
.mglms *, .lmsReview * {
	box-sizing: border-box;
}
.mglms h3 {
	
}
.mglms h3 span {
	vertical-align: middle;
}
.mglms div {

}
.mglms div span {
	
}
.mglmstabs {
	box-shadow: 0 0 20px 1px #e1e1e1;
}
.mglmscontainer {
	margin: 10px 0px 0px 0px !important;
	box-shadow: 0 0 20px 1px #e1e1e1;
	padding: 15px;
}
.mglmscontainer:hover {
	box-shadow: 0 0 20px 1px #e1e1e1;
}
.mglmscontainer > .mglmsheader > .mglmssubheader {
	
}
.mglmscontainer > .mglmsheader > .mglmsprogress {
	float: right;
	font-size: 14px;
}
.mglmscontainer > .mglmsheader > .mglmsname {
	font-size: 20px;
}
.mglmslessons {
	padding: 0 !important;
}
.mglmslessons > ul {
	padding: 0;
	margin: 0;
	list-style: none;
}
.mglmslessons > ul li {
	
}
.mglmslessons > ul li a, .mglmslessons > ul li div.lesson, .mglmslessons .mglmssectiondesc {
	display: block;
	padding: 15px 20px;
	text-decoration: none;
}
.mglmslessons > ul li a:hover {
	background-color: #dedede;
}
.mglmslessons .mglmssectiondesc p:last-child {
	margin-bottom: 0px;
}
/* A Flowplayer Menu Sits at bottom:-100% with height:0 While it is Closed, so its Options Hang Out of the Bottom of the Player. Harmless on a Page, but Inside a Section Panel it Scrolls */
.fp-menu {
	overflow: hidden;
}
/* The Section Panels are Built with heightStyle "content", so They Never Need to Scroll. JQuery UI Sets overflow:auto on Every Panel Regardless */
.mglms > .mglmscontainer > .ui-accordion-content {
	overflow: visible;
}
.mglmslessons > ul li div.lesson_complete {
	font-size: 18px;
}
.mglmslessons > ul li div.lesson_number {
	float: left;
	padding-right: 10px;
}
.mglmslessons > ul li div.lesson_title {
	width: calc(100% - 150px);
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	float: left;
}
.mglmslessons > ul li a span, .mglmslessons > ul li span {
	display: inline-block;
	padding-right: 10px;
}
.mglmsbarcontainer {
	padding: 10px;
	border-radius: 6px;
	background: #efefef;
	box-shadow: 0 0 20px 1px #e1e1e1;
	margin: 10px 0px 20px 0px;
}
.mglmsbarcontainer span {
	font-weight: bold;
}
.mglmsbarheader {
	padding: 10px 0px;
}
.mglmsbar {
	background: #dedede;
	height: 22px;
	border-radius: 5px;
}
.mglmsbar div {
	background: green;
	height: 100%;
	border-radius: 5px;
}
.mglms-retake {
	text-align: center;
}
.mglmsbuttons {
	clear: both;
	padding: 10px 0px;
	border: none;
	outline: none;	
}
.mglmsbuttons a {
	width: 100%;
	display: block;
	box-sizing: border-box;
}
.mglmsbutton, a.mglmsbutton, input.mglmsbutton, button.mglmsbutton {
	padding: 10px 30px;
	background: #4F8AC5;
	color: white;
	text-align: center;
	text-decoration: none;
	border-radius: 6px;
	border: none;
	transition: ease-in 0.25s all;
	font-size: initial;
	font-weight: initial;
	display: inline-block;
	margin: 2px 5px;
}
.mglmsbutton.mglmserrorbutton, a.mglmsbutton.mglmserrorbutton, input.mglmsbutton.mglmserrorbutton, button.mglmsbutton.mglmserrorbutton {
	background: #dc3545;
}
.mglmsbutton.mglmserrorbutton:hover, a.mglmsbutton.mglmserrorbutton:hover, input.mglmsbutton.mglmserrorbutton:hover, button.mglmsbutton.mglmserrorbutton:hover {
	background: #cc656f;
}
.mglmsbutton.mglmsinfobutton, a.mglmsbutton.mglmsinfobutton, input.mglmsbutton.mglmsinfobutton, button.mglmsbutton.mglmsinfobutton {
	background: #007bff;
}
.mglmsbutton.mglmsinfobutton:hover, a.mglmsbutton.mglmsinfobutton:hover, input.mglmsbutton.mglmsinfobutton:hover, button.mglmsbutton.mglmsinfobutton:hover {
	background: #4797ec;
}
.mglmsreviewquiz {
	width: 100%;
}
.courseReviewItem {
	padding: 15px;
}
.courseReviewItem .courseImage {
	margin: 0 auto;
	text-align: center;
	padding-right: 10px;
}
.courseReviewItem .courseTease a.tease_headline {
	padding: 0px 0px 10px 0px;
}
.courseReviewReturn {
	display:none;
}
.courseSessionContainer .sectionHeader, .quizSessionContainer .sectionHeader {
	font-weight: bold;
	background-color: #efefef;
}
.courseSessionContainer > div, .quizSessionContainer > div {
	display: grid;
}
.teamResults, .teamQuizResults, .teamAssignments {
	display: none;
}
.dashboardbutton {
	padding: 10px 0px;
	float: right;
	margin: 5px 0px;
	padding-bottom: 10px !important;
}
/* The Degree Back Link is Moved Below the Tabs and Centred, Reading as the Way Out of the Course the Same Way the
   Course Outline Button Does at the Foot of a Lesson. It Keeps the Plain mglmsbutton Styling of Every Other Button
   on the Page, so the Clear is All it Needs to Sit Clear of the Tab Widget */
.mglmsdegreenav {
	clear: both;
	padding: 20px 0px;
	text-align: center;
}
.mglms-startcourse {
	padding: 10px;
	text-align: center;
	display: flex;
	justify-content: center;
}
.contentGrid > div {
	border: 1px solid #e1e1e1;
	border-radius: 6px;
	padding: 5px;
	box-shadow: 0 0 20px 1px #e1e1e1;
}
.contentGrid > div img {
	border-top-left-radius: 6px;
	border-top-right-radius: 6px;
}
.contentGrid a.tease_headline {
	clear: both;
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	line-height: 24px;
	max-height: 34px;
	min-height: 34px;
	-webkit-line-clamp: 1;
	-webkit-box-orient: vertical;
	padding: 5px;
	font-weight: bold;
	font-size: 1.1em;
	box-sizing: border-box;
}
.contentGrid div.portalbyline {
	text-align: center;
	padding: 5px;
	font-size: 1em;
}
.mglmsdetails, .mglmsbuttons {
	padding: 10px;
}
.mglmsdetails p {
	line-height: 16px;
	max-height: 64px;
	min-height: 64px;
	text-overflow: ellipsis;
	overflow: hidden;
	margin: 10px 0px;
	-webkit-line-clamp: 4;
	-webkit-box-orient: vertical;
	text-align: left;
}
.mglmsinfo {
	float: right;
	padding: 5px;
}
.mglmstooltip {
	display: none;
}
.mglmsduration {
	padding-right: 10px;
	padding-top: 4px;
}
/* Degree CSS */
.mglmsdegree .contentGridContainer .contentGrid {
	max-width: 520px;
}
.mglmsdegree .contentGridContainer .contentGrid > div {
	display: flex;
	flex-direction: column;
}
.mglmsdegree .contentGridContainer .contentGrid > div .mglmsbuttons {
	flex-grow: 1;
	position: relative;
	height: 64px;
}
.mglmsdegree .contentGridContainer .contentGrid > div .mglmsbuttons a {
	position: absolute;
	bottom: 10px;
	width: calc(100% - 20px);
}
.mglmsdegree .contentGridContainer .contentGrid img {
	max-height: initial;
}
/* Course CSS */
.mglmscoursebuttons {
	
}
.mglmscoursebuttons div {
	
}
.mglmscoursebuttons .course_prev {
	text-align: left;
	float:left;
	width: 33%
}
.mglmscoursebuttons .course_outline {
	text-align: center;
	margin:auto;
	width: 33%;
	float:left;
}
.mglmscoursebuttons .course_next {
	text-align: right;
	float:right;
	width: 33%;
}
.mglmscoursebuttons div a {
	transition:ease-in 0.25s all;
	background-color: #4F8AC5;
	display: block;
	padding: 8px 10px;
	margin: 30px;
	margin-left: 11%;
	margin-right: 11%;
	text-align: center;
	color: #ffffff;
	text-decoration: none;
	border-radius:8px;
}
.mglmscoursebuttons div a:hover {
	background:#00aaff;
}
/* Quiz CSS */
.quizContainer {
	margin: 20px auto;
	box-shadow: 0 0 20px 1px #e1e1e1;
	width: 100%;
	clear: both;
	border: 1px solid #efefef;
	border-radius: 5px;
}
.quizQuestion {
	padding-bottom: 10px;
}
.question_progress {
	padding: 10px;
	background: #4F8AC5;
	color: #ffffff;
	text-align: right;
	border-radius: 5px 5px 0px 0px;
}
.question_progress .editQuiz {
	float:left;
}
.question_progress .editQuiz a {
	color: #ffffff !important;
}
.question_progress .editQuiz a:hover {
	color: #ffffffaa !important;
}
.question_headline {
	background: #dedede;
	color: #222222;
	padding: 10px;
	font-weight: bold;
	font-size: 18px;
}
.question_headline .editQuestion {
	float:right;
}
.question_description, .question_solution {
	padding: 10px 15px 5px 15px;
}
.question_description .score {
	padding: 5px;
}
.question_description .result {
	padding: 5px;
}
.question_answers {
	padding: 10px 20px 10px 20px;
}
.question_answers > label.ui-button {
	text-align: left;
}
.question_answers input, .question_answers select, .question_answers textarea {
	padding: 0.4em 1em;
	border-radius: 3px;
	border: 1px solid #a9a9a9;
	width: unset;
}
.question_answers textarea {
	width: 100%;
}
.question_answer {
	
}
.q_answer_incorrect {
	color: #a94442 !important;
	font-size: 1.2em;
}
.q_answer_correct {
	color: #3c763d !important;
	font-size: 1.2em;
}
.q_answer_correct_option {
	color: #9cc38c !important;
	font-size: 1.2em;
}
.question_solution div {
	padding: 5px;
	border: 1px dashed;
	border-radius: 5px;
}
.question_buttons {
	padding-bottom: 10px;
	display: flex;
	margin: auto;
}
.question_buttons > div {
	flex-basis: 100%;
	padding: 10px;
}
.question_buttons div.left {
	text-align: left;
}
.question_buttons div.right {
	text-align: right;
}
.question_buttons > div > div {
	
}
.question_submit, a.question_submit {
	z-index: 9999;
}
.question_blank {
	width: 40%;
}
.question_submit_left, a.question_submit_left {
	display: inline-block;
}
.question_submit_right, a.question_submit_right {
	display: inline-block;
}
.error {
	
}
.errorHide {
	display: none !important;
}
.answer_type_4 .errorHide, .answer_type_5 .errorHide {
	display: inline-block !important;
	color: red;
}
.errorShow {
	display: block !important;
}
.lms_results_header {
	cursor: pointer;
}
.lms_results_header i {
	-moz-transition: all .3s linear;
    -webkit-transition: all .3s linear;
    transition: all .3s linear;
}
.lms_results_header.rotate i {
    -ms-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}
.lms_results_grid {
	display: none;
}
.lms_results_grid > div {
	overflow-y: hidden;
}
/* MG Tutor Box */
.mgtutor {
	border-radius: 6px;
	box-shadow: 0 0 20px 1px #e1e1e1;
	margin-top: 25px;
}
.mgtutor .name {
	padding: 15px;
	font-weight: bold;
	border-top-left-radius: 6px;
	border-top-right-radius: 6px;
}
.mgtutor .picture div {
	padding: 20px;
	text-align: center;
}
.mgtutor .bio div {
	padding: 20px;
}
.tutorbyline {
	display: inline;
}
.tutorbyline .tutorimg, .tutorbyline .tutorname {
	display: inline;
	padding: 1px 2px;
}
.tutorbyline .tutorimg img {
	max-width: 50px;
	border-radius: 50%;
}
/* MG Resources Box */
.mgresources {
	border-radius: 6px;
	box-shadow: 0 0 20px 1px #e1e1e1;
	margin: 25px 0px 20px 0px;
}
.mgresources .name {
	padding: 15px;
	font-weight: bold;
	border-top-left-radius: 6px;
	border-top-right-radius: 6px;
}
.mgresources .resources {
	padding: 10px 20px;
}
.mgresources .resources > div > div {
	padding: 5px 20px;
}
/* MG Certificate Box */
.mgcertificate {
	border-radius: 6px;
	box-shadow: 0 0 20px 1px #e1e1e1;
	margin: 25px 0px;
	clear: both;
}
.mgcertificate .name {
	padding: 15px;
	font-weight: bold;
	border-top-left-radius: 6px;
	border-top-right-radius: 6px;
}
.mgcertificate .thumb {
	padding: 20px;
	text-align: center;
}
.mgcertificate .thumb img {
	border: 1px solid #222222;
}
.mgcertificate .mgcoursecontainer {
	padding: 20px;
}
.mgcertificate .mgcoursedetails {
	padding: 10px;
}
.mgcertificate .mgcoursedetails .header {
	font-weight: bold;
}
.mgcertificate .mgcoursedetails .detail {

}
.mgcertificate .mgcoursedetails .button {
	padding: 10px;
	text-align: center;
}
/* JQuery UI CSS */
.ui-state-active {
	outline: none !important;
}
/* Media CSS */
.mgvideo0wrap, .mgaudio0wrap, .mglmstabs {
	clear: both;
}
.mg0wrapper .fp-context-menu {
	display: none !important;
}
/* Dashboard CSS */
.lmsStats {
	padding: 10px 5px 20px;
}
.lmsProgress {
	text-align: center;
	padding: 10px 5px;
	font-weight: bold;
	font-size: 0.8rem;
}
.lmsProgress > div {
	padding: 10px 5px;
}
.lmsProgress div div {
	text-align: center;
	font-size: 2rem;
	font-weight: bold;
}
.lmsProgress span {
	font-size: 1rem;
	font-weight: normal;
}
.lmsProgress canvas {
	max-width: 500px;
	margin: 0 auto;
}
.mglmslessondetails {
	padding-top: 3px;
	text-align: center;
}
.mglmslessondetails div {
	padding: 3px;
}
.mglmslessondetails div.mglmsbuttoncontainer {
	padding-top: 10px;
}
.mglmslessondetails div span {
	font-weight: bold;
}
.mglmslessondetails div a.mglmsbutton {
	padding: 5px 20px;
	display: inline-block;
	width: initial;
}
/* Ribbon */
@import url(https://fonts.googleapis.com/css?family=Lato:700);
.mglmsribbon {
  width: 100px;
  height: 100px;
  overflow: hidden;
  position: absolute;
}
.mglmsribbon span {
  position: absolute;
  display: block;
  width: 175px;
  padding: 8px 0;
  background-color: #3498db;
  box-shadow: 0 5px 10px rgba(0,0,0,.1);
  color: #fff;
  font: 700 11px/1 'Lato', sans-serif;
  text-shadow: 0 1px 1px rgba(0,0,0,.2);
  text-transform: uppercase;
  text-align: center;
}
.mglmsribbon.inactive span {
	background-color: #a94442;
}
/* top left*/
.mglmsribbon-top-left::before {
  top: 0;
  right: 0;
}
.mglmsribbon-top-left::after {
  bottom: 0;
  left: 0;
}
.mglmsribbon-top-left span {
  right: -25px;
  top: 30px;
  transform: rotate(-45deg);
}
/* Mass Completion */
.massCompleteAll a.completeCourse {
	padding: 0.25rem;
    font-size: .6rem;
    line-height: 1.5;
    border-radius: 0.2rem;
	color: #fff;
    background-color: #218838;
    border-color: #1e7e34;
	text-decoration: none;
	margin: 0px 2px;
	width: 25px;
	display: inline-block;
}
.massCompleteAll a.incompleteCourse {
	background-color: #dc3545;
    border-color: #dc3545;
}
.massCompleteAll a.completeCourse span {
	max-width: 0;
	-webkit-transition: max-width 1s;
	transition: max-width 1s;
	display: inline-block;
	vertical-align: top;
	white-space: nowrap;
	overflow: hidden;
}
.massCompleteAll a.completeCourse:hover span {
	max-width: 7rem;
  }
/* SCORM LMS */
.scorm-container {
	width: 100%;
	max-width: 1024px;
	margin: 0 auto;
	padding-top: 10px;
}
.scorm-toolbar {
	display: flex;
	justify-content: flex-end;
	margin-bottom: 10px;
}
.scorm-fullscreen-btn {
	padding: 6px 12px;
	font-size: 14px;
	cursor: pointer;
	border: 1px solid #ccc;
	border-radius: 4px;
	background: #fff;
	color: #333;
}
.scorm-fullscreen-btn:hover {
	background: #e6e6e6;
	border-color: #adadad;
}
.scorm-frame {
	width: 100%;
	height: 720px;
	border: none;
	display: block;
	border-radius: 8px;
	box-shadow: 0 2px 8px rgba(0,0,0,.15);
}
.scorm-frame:fullscreen {
	width: 100vw;
	height: 100vh;
	border-radius: 0;
}
.scorm-frame:-moz-full-screen {
	width: 100vw;
	height: 100vh;
}