
body, 
html body, 
body .container-fluid, 
body .container-fluid .container, 
body .container-fluid .container nav
body .container-fluid .container nav ul.navbar-nav, 
body .container-fluid .container nav ul.navbar-nav li a,
body .container-fluid .container p, 
#accordion_inside, 
#accordion_inside div {
    font: 15px / 1.5em 'Nunito', Arial, Helvetica, Verdana, sans-serif;
    /*color: #555;*/
}

body, 
html body, 
body .container-fluid, 
body .container-fluid .container {
	color: #555;	
}


/*
body, 
html body, 
body .container-fluid, 
body .container-fluid .container, 
*/

body .container-fluid .container button, 
body .container-fluid .container input[type="button"], 
body .container-fluid .container input[type="submit"],
body .detailsExpanded .courseNumber p  {
    font-family: 'Nunito', Arial, Helvetica, Verdana, sans-serif;
}


#accordion_inside div h3 {
	font-weight: bold;
}


body .container-fluid .container .btn, 
body .container-fluid .container .btn-primary, 
body .container-fluid .container .btn-secondary, 
body .container-fluid .container input.btn,
body .container .btn, 
body .container .btn-primary, 
body .container .btn-secondary, 
body .container input.btn,
.modal-content button,
.modal-content .btn, 
.modal-content .btn-primary, 
.modal-content .btn-secondary, 
.modal-content input.btn {
	font-weight: bold;
	border-radius: 6px;
	/*border: none !important;*/
	border: none;
	color: white;
}


body .container-fluid .container .green { color: #009530; }
body .container-fluid .container .litegreen { color: #4FA600; }
body .container-fluid .container .yellowgreen { color: #87D300; }
body .container-fluid .container .gray { color:#626469; }
body .container-fluid .container .litegray { color:#9FA0A4; }
body .container-fluid .container .yellow { color: #FFD100; }
body .container-fluid .container .orange { color: #E47F00; }
body .container-fluid .container .red { color: #B10043; }
body .container-fluid .container .blue { color: #42B4E6; }

/*
body {
    font: 15px / 1.5em 'Nunito', Arial, Helvetica, Verdana, sans-serif;
    color: #555;	
}
*/

a:link,
a:visited {
	color: #027db3;
}



h6 {
	font-size: 14px;
}



#container-fluid-main {
	color: #f8f9fa;
	background: #626469;
    padding: 15px;
}

.white {
	color: white !important;
}

#banner_nav span.pipe {
	color: #777; display: inline-block; margin:0 10px
}
#banner_nav span.dashboard_term {
	color: #f0ad4e;
}
#banner_nav nav.navbar_icon {
	float:right; position: relative; top:-2px; margin-left:10px;
}

div.portalName a {
	/*color: #42B4E6;*/
	color: #eee;
	transition:  all .3s;
}
div.portalName a:hover {
	/*color: #0275d8;*/
	/*color: #42B4E6;*/
	color: #FFD100;
	text-decoration: none;
}
div.portalName a img {
	margin-right: 8px;	
}



#banner_nav a.StudentInitials {
	font-weight: bold;
	color: white; 
	float:right;
}




@media (max-width: 992px) {	
	#container-fluid-main {
		/*padding: 15px 0;*/
	}

	div.container-fluid > div.container {
		width: 100%;
		max-width: 100%;
		margin: 0;
		padding: 0 5px;
	}

	div#banner_nav {
		padding: 0 15px;
	}
}


a {
	color: #42B4E6;
}
a:hover {
	color: #0275d8;
}


#container-fluid-navbar {
	/*background: #9E9FA3;*/
	background-color: #999;
}

@media (max-width: 576px) { 

	div#container-fluid-main {
		padding: 10px 15px;
	}

	div#banner_nav {
		padding: 0;
	}

}





.dropdown:hover .dropdown-menu{
    display: block;
}
.dropdown-menu{
    margin-top: 0 !important;
}





.slick-prev, 
.slick-next {
	display: none;
	width: 40px;
	height: 35px;
	background-color: transparent;
	position: absolute;
	top: 0;
	right: 5px;
	overflow: hidden;

	border: none;
	outline: 0;
	text-decoration: none;
}
.slick-prev {
	right: 40px;
}
@media (max-width: 576px) { 

	div.container-fluid div.slick-list div.vid_thumb_preview, 
	div.container div.vid_thumb_preview {
		/*width: 170px;*/
		/*height: 110px;*/

		width: 160px;
		height: 100px;
	}
	.slick-next {
		/*right: -10px;*/
		right: 0;
		top: -7px;
	}
	.slick-prev {
		/*right: 25px;*/
		right: 35px;
		top: -7px;
	}
}

.slick-prev:before,
.slick-next:before {
	cursor: pointer;
	display: block;
	background: url('../images/icons/arrow-left-circle.svg') no-repeat top left;
	background-size: cover;
	content: ' ';
	width: 30px;
	height: 30px;
	opacity: 0.5;
}
.slick-next:before {
	background: url('../images/icons/arrow-right-circle.svg') no-repeat top left;
	background-size: cover;
}
.slick-prev:hover:before,
.slick-prev:focus:before,
.slick-next:hover:before,
.slick-next:focus:before {
	border: none;
	outline: 0;
}
.slick-slide {
	transition: all ease-in-out .3s;
	padding: 0px 5px;
	margin: 0;
	border-right: 1px solid #eee;
}
.slick-slide img {
  /* width: 100%;
  height: 150px; */
  margin: 0 0 10px 0;
  border: 1px solid red;
}

/*.check-certification*/

button, .btn {
	cursor: pointer;
	outline: none;
}


div.container .btn-secondary {
	background: rgba(98, 100, 105, .7);
	transition: .2s;
}
div.container .btn-secondary:hover {
	background: rgba(98, 100, 105, 1);
}

div.container .btn-sm {
	line-height: 1em;
	padding: 6px;
}



.modal-content {
	border: none;
	border-radius: 5px;
	box-shadow: 0 0 10px #555;
}

.modal-header {
	background-color: #9E9FA3;
	color: #f8f9fa;
}

button.close {
	color: #fff;	
} 


.toggleall {
	margin: 0;
	padding: 0;
}

.toggleall span {
	font-size: 14px;
	cursor: pointer;
	color: #0275d8;
}



/*
.modal-content .checkboxes {
	line-height: 1.1em;
	margin: 10px 0;
	padding: 0;
}
*/

.modal-content .modal-title, 
.modal-content h4 {
	font-weight: bold;
}

.modal-content .checkboxes,
.checkboxes {
	line-height: 1.1em;
	margin: 10px 0;
	padding: 0;
}

.modal-content .checkboxes label,
.checkboxes label {
	margin: 0;
	padding: 5px 5px 3px 0;
	font-size: 15px;
}

.modal-content .checkboxes input[type="checkbox"],
.checkboxes input[type="checkbox"] {
	display: block;
	float: left;
	width: 15px;
	margin-right: 5px;
	position: relative;
	top: 2px;
}

.modal-content .checkboxes label span,
.checkboxes label span {
	display: block;
	float: left;
	max-width: calc(100% - 20px);
}


.modal-body iframe {
	max-width: 100%;
	height: 280px;
}




.headerSection {
	background-color: #626469;
	padding: 10px 15px;
	margin: 0 0 15px 0;
	border-radius: 5px;
	line-height: 1em;
	font-size: 16px;
	font-weight: bold;
	color: rgba(255, 255, 255, 0.9);
}




.vidRecommend .checkboxes label {
	text-transform: capitalize;
}

@media (max-width: 992px) { 
	#upcoming_courses {
		margin-top: 60px;
	}
}










@media screen and (max-width: 640px) {
    iframe {
        max-width: 100% !important;
        max-height: 100% !important;
/*        
		width: auto !important;
        height: auto !important;
*/    
	}
}


#circle {
	width: 35px;
	height: 35px;
	background: #9E9FA3;
	border-radius: 50%;
	float: right;
	text-align: center;
	font-size: 14px;
	padding: 3px;
}
.responsive {
  width: 100%;
  height: auto;
}


.container h1, 
#VideoPlayerFrame h1 {
	font-size: 2em;
	line-height: 1.2em;
	font-weight: bold;
	/*padding: 1em 0;*/
	padding: 20px 0;
	margin: 0;
}

#VideoPlayerFrame h1:first-of-type {
	padding-top: 0;
}

.container h2, 
#VideoPlayerFrame h2 {
	font-size: 1.7em;
	line-height: 1.2em;
	padding-top: 1em;
}


#VideoPlayerFrame h2:first-of-type {
	padding-top: 0;
}


.container h3, 
#VideoPlayerFrame h3 {
	font-size: 1.4em;
	line-height: 1.2em;
	padding-top: 1em;
}


.container h5 {
	line-height: 1.5em;
}

.strikethrough {
	text-decoration: line-through;
}


h1.lowpadtop {
	padding-top: 5px;
}



/*
@media (min-width: 768px) {
	.navbar-toggler {
		display: none;
	}
}

@media (max-width: 768px) {
	.navbar-expand-md {
		display: none;
	}
}*/



#navbarText {
	width: 100%;
}

#navbarText ul.navbar-nav {
	flex-grow: 1;
	width: 100%;

	margin-left: 0;

	font-size: 16px;	
}

body .container .navbar {
	padding-left: 0;
	flex-shrink: 0;
	flex-grow: 1;
	padding-right: 0;

	/*font: 15px / 1.5em 'Nunito', Arial, Helvetica, Verdana, sans-serif !important;	*/
}

body .container .navbar-dark .navbar-nav a.nav-link {
	color: rgba(255, 255, 255, 0.7);
	font-weight: bold;
	transition: all .2s;
}
body .container .navbar-dark .navbar-nav a.nav-link:hover {
	color: white;
	text-shadow: 1px 1px 3px #555;
}


.navbar li,
.navbar a {
	cursor: pointer;
}

#navbarText ul.navbar-nav > li:first-of-type, 
#navbarText ul.navbar-nav > li:first-of-type > a:first-of-type {
	margin-left: 0;
	padding-left: 0;
}

ul.navbar-nav ul.dropdown-menu {
	padding: 8px 0;
	margin: 0;
}
ul.navbar-nav ul.dropdown-menu li.nav-item {
	padding: 0;
	margin: 0;
}
ul.navbar-nav ul.dropdown-menu li.nav-item a {
	padding: 6px 16px 6px 13px;
	margin: 0;
	transition: all .3s;
	color: #444;
}
ul.navbar-nav ul.dropdown-menu li.nav-item a:hover {
	background: #f0f0f0;
}


ul.navbar-nav ul.dropdown-menu li.nav-item.first_nav_li {
	margin-left:0 !important; padding-left:0 !important;
}


p.questions_dropdown {
	padding:10px 10px 5px 16px; margin: 0; line-height: 1.2em;
}


ul.navbar-nav li.nav-item.questionsbtn {
	border-radius: 8px;
	background-color: #009530;

	padding: 8px;
}
ul.navbar-nav li.nav-item.questionsbtn > a {
	padding: 8px;
}


@media (min-width: 992px) {
	ul.navbar-nav li.nav-item.questionsbtn {
		transition: all .3s;

		position: absolute;
		right: 0;
	}
	ul.navbar-nav li.nav-item.questionsbtn:hover {
		background-color: #626469;	
	}
	ul.navbar-nav li.nav-item.questionsbtn:hover ul.dropdown-menu {
		position: absolute;
		right: 0;
		/*border: 1px solid red;*/
		/*top: 0;*/
		left: auto;
	}


	ul.navbar-nav li.nav-item.questionsbtn > a {
		color: #ddd;
	}

	ul.navbar-nav li.nav-item.questionsbtn:hover > a {
		color: white;
	}
}

/*
@media (min-width: 992px) {
	ul.navbar-nav li.nav-item.questionsbtn,
	ul.navbar-nav li.nav-item.questionsbtn > a {
		padding: 8px;
	}
}
*/




button.navbar-toggler {
	/*text-decoration: none;*/
	margin: 2px 1px 1px 1px;
	border: 1px solid #888;
	padding: 2px 10px;
}
button.navbar-toggler:hover {
	background-color:#333;
	margin: 2px 1px 1px 1px;
	border: 1px solid #888;
	padding: 2px 10px;
}

button.navbar-toggler:focus,
button.navbar-toggler:active {
	/*text-decoration: none;*/
	/*border: none;*/
	box-shadow: none;
	outline: 0;
	margin: 2px 1px 1px 1px;
	border: 1px solid #888;
	padding: 2px 10px;
}

#menutoggle {
	padding: 4px 12px;
	margin: 0 0 10px 0;
}

#menutoggle span {
	position: relative;
	padding-left: 20px;
}

#menutoggle svg {
	position: absolute;
	top: 1px;
	left: 0;
}



#learning-path-wrapper {
	margin-top: 10px;
}

#learning-path-list .wrapper {
	padding-top: 10px;
}

#learning-path-list .card-deck .card {
	margin:0 5px;
}

#learning-path-content iframe {
	max-width: 100%;
}

.hide {
	display: none;
}









@media (max-width: 992px) {	

	#learning-path-list {
		z-index: 1000;
		height: auto;
		width: auto;
		padding: 10px;
		position: absolute;
		overflow: none;
		transition: all .3s;
		border-radius: 4px;
		box-shadow: #555 0 0 8px;
	}

	#learning-path-list {
		transition: all 0.3s;
		margin: 5px;
	}

	#learning-path-list.showmenu {
		/*margin-left: 0;*/
		/*width: auto;*/
	}

	#learning-path-list.hidemenu {
		/*margin-left: -260px;*/
		/*width: 0;*/
		margin-left: -550px;
	}

}


@media (max-width: 576px) { 
	div.container-fluid > div.container {
		font-size: 16px;
		line-height: 1.4em;
	}

	.container h1, #VideoPlayerFrame h1 {
		font-size: 27px;
		/*padding-top: 15px;*/
		padding: 15px 0;
		margin: 0;
		/*padding-bottom: 0;*/
		/*margin-bottom: 0;*/
	}

	div#credits_count {
		padding-top: 0;
	}

	.container h2, #VideoPlayerFrame h2 {
		font-size: 22px;
	}

	.container h3, #VideoPlayerFrame h3 {
		font-size: 18px;
	}


	.courseCal > #accordion_inside > div {
		font-size: 14px;
		line-height: 1.4em;
	}
}


@media (max-width: 450px) { 
	div.container.logoc {
		padding: 0;
	}

	#main-content {
		padding-left: 0;
		padding-right: 0;
	}

	#main-content > .container {
		padding-left: 10px;
		padding-right: 10px;
	}
}
