/*
 ======================================================================================================
 
    @VERSION			: 1.0.32
    @CREATED			: 20 MAY 2017
    @MODIFIED			: 12 AUG 2024
    @DESIGNER			: Daniel C. K. Tan
    
    @FILE				: ~/custom_css.css
	@TYPE				: Style Sheet
	@DESCRIPTION		: Styles Overides
	   
 ======================================================================================================
*/

/* ----------------------------------------------------------------------------------------------------
   #1 BASE STYLES 
/* ----------------------------------------------------------------------------------------------------*/
/* Custom Fonts
/* ----------------------------------------------------------------------------------------------------*/
@import url(https://fonts.googleapis.com/css?family=Varela+Round);
@import url(https://fonts.googleapis.com/css?family=Oswald:400,300);


/* Viewport Styles
/* ----------------------------------------------------------------------------------------------------*/
@-ms-viewport { width: device-width; max-zoom: 1; min-zoom: 1; user-zoom: fixed; }
@-o-viewport  { width: device-width; max-zoom: 1; min-zoom: 1; user-zoom: fixed; }
@viewport     { width: device-width; max-zoom: 1; min-zoom: 1; user-zoom: fixed; }


/* Grid Smooth Animated Effect Styles
/* ----------------------------------------------------------------------------------------------------*/
[class="container"], [class="row"], [class="col"], [class^="col-"], #mainNav, .sidebar { transition: all .6s ease-in-out; }


/* Document Styles
/* ----------------------------------------------------------------------------------------------------*/
html, body { width: 100%; height: 100%; }
html { scroll-behavior: smooth; }
body { font-family: 'Varela Round', Arial, 'Microsoft YaHei', SimHei, STHeiti, sans-serif; font-weight: 400; line-height: 1.5; }

h1, h2, h3, h4, h5, h6 { font-family: inherit; font-weight: 500; }
.h1,h1 { font-size:2.5rem }
.h2,h2 { font-size:2rem }
.h3,h3 { font-size:1.875rem }
.h4,h4 { font-size:1.75rem }
.h5,h5 { font-size:1.5rem }
.h6,h6 { font-size:1.25rem }



/* ----------------------------------------------------------------------------------------------------
   #2 GENERAL SITE UI STYLES 
/* ----------------------------------------------------------------------------------------------------*/
/* Header Bar Styles
/* ----------------------------------------------------------------------------------------------------*/
#app-header { background-color: #666666; color: #fff; padding: 4px 0 5px; white-space: nowrap; }    
#app-header #topnavbar nav { background-color: #666666; }
#app-header #topnavbar nav a span,
#app-header #topnavbar nav a:hover span { background: none; color: #fff; }    
.header-nav li a { color: white; padding-top: 16px; }
[data-header-separator] { border-top: none;  }


/* Logo Styles
/* ----------------------------------------------------------------------------------------------------*/
#app-header h1 { margin: 10px 0; }
.header-branding { float: left; }
.header-branding h1 { text-align: left; }
.header-branding h1 a { display: block; }
.header-branding h1 a img { height: 60px; }

@media only screen
and (max-width: 992px) {	
	.header-branding { float: none; width: 100%; height:120px; }
	.header-branding .logo-customized { text-align: center; padding-bottom: 5px; }
	.header-branding .logo-customized img { width: 180px !important; height:auto; }
}


/* Header Menu Styles
/* ----------------------------------------------------------------------------------------------------*/
@media only screen
and (max-width: 992px) {	
	#header-menu { justify-content: center; }
}

#header-menu-container { padding-top: 25px; }
#header-menu-container > a { display: inline-block; margin-bottom: 0; font-weight: normal; text-align: center; vertical-align: middle; cursor: pointer; background-image: none;  border: 1px solid transparent; white-space: nowrap; padding: 5px 10px; font-size: 14px; line-height: 1.428571429; border-radius: 3px; -webkit-user-select: none;  color: #ffffff; }
#header-menu-container > a:hover { text-decoration: none !important; }

@media only screen
and (max-width: 992px) {	
	#header-menu-container { margin-bottom: 20px; }
	#header-menu-container > a { display: block; }
	#header-menu-container.pull-right { float: none !important; }
	#page-links { width: 100%; }
	#page-links .piped-list { width: 100%; }
	#page-links .piped-list .dropdown .dropdown-toggle { width: 100%; display: block; }
	#page-links .piped-list .dropdown .dropdown-menu { min-width: 100%; }
}


/* User Dropdown Menu Styles
/* ----------------------------------------------------------------------------------------------------*/
.dropdown-menu > li > a { color: #333 !important; display: block !important; font-size: 1.125em; }


/* Top Menu Styles
/* ----------------------------------------------------------------------------------------------------*/
#page-links { display: inline-block; margin-right: 15px; }

#page-links a { display: inline-block; padding: 5px 10px; font-size: 1.125em; color: #fff; text-decoration: none !important; }
#page-links a:hover { color: #99FF00; text-decoration: none !important; }

@media only screen
and (max-width: 1023px) {
	#page-links a { font-size: 1.125em !important; }
}

@media only screen
and (min-width: 1024px) and (max-width: 1200px) {
	#page-links a { font-size: 0.95em !important; }
}


/* Menu Styles
/* ----------------------------------------------------------------------------------------------------*/
.piped-list { padding-left: 0; list-style: none; margin-left: 0; }
.piped-list > li { display: inline-block; padding-left: 5px; padding-right: 5px; }

@media only screen
and (max-width: 992px) {
	.piped-list li { display: block; float: none; text-align: center !important; margin-bottom: 15px; }
}

@media only screen
and (max-width: 1200px) {
	.piped-list li { padding-left: 3px !important; padding-right: 3px !important; }
}

.piped-list li a i { font-size: 1em; }
#page-links .piped-list>li:before { display:none; margin-right:0; }


/* Login / Account Button Styles
/* ----------------------------------------------------------------------------------------------------*/
.btn-login { background-color: #66AD09; border-color: #66AD09; display: inline-block;  }
.btn-login a, .btn-login a:hover, .btn-login a:active, .btn-login a:visited { color: white !important; font-size: 1.125em !important; font-weight: bold !important; text-decoration: none !important;  }
.btn-login button[title="Show User Menu"] { background-color: #66AD09; border-color: #66AD09; color: white; font-size: 1em; font-weight: bold; line-height: 1.428571429; text-align: center; text-transform: uppercase; text-decoration: none; vertical-align: middle; padding: 10px 10px; border-radius: 3px; margin-bottom: 0; max-width: 150px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.btn-login button[title="Show User Menu"]:hover, .btn-login button[title="Show User Menu"]:focus { color: white; text-decoration: none; }


/* Account Menu Styles
/* ----------------------------------------------------------------------------------------------------*/
.user-menu-popover a {text-decoration: none; }


/* Catalogue Links Styles
/* ----------------------------------------------------------------------------------------------------*/
.navbar {
    margin-bottom: 0 !important; 
    border: none !important;

	-webkit-border-radius: 0px 0px 0px 0px;
       -moz-border-radius: 0px 0px 0px 0px;
		-ms-border-radius: 0px 0px 0px 0px;
		 -o-border-radius: 0px 0px 0px 0px;
			border-radius: 0px 0px 0px 0px;
}

.navbar-inverse {
    background-color: #66AD09;
    border-color: #66AD09;
}

.navbar-nav {
	font-size: 1.25em;
	text-align: center;
	width: 100%;
}

.navbar-nav > li {
	float: none;
	display: inline-block;
	/*width: 15%*/
}

.navbar-inverse .navbar-nav > li > a:hover, 
.navbar-inverse .navbar-nav > li > a:focus, 
.navbar-inverse .navbar-nav > li.active > a:hover, 
.navbar-inverse .navbar-nav > li.active > a:focus { background-color: #669900 !important; }

@media only screen
and (max-width: 992px) {	
	.navbar-nav { margin: 0 !important; }
	.navbar-inverse .navbar-nav > li { display: block; width: 100%; }
}


/* Search Styles
/* ----------------------------------------------------------------------------------------------------*/
form.search-form { text-align: center; }
.search-box-wrapper { text-align: left; }

form.search-form {
    text-align: center;
    width: 45%;
    margin: auto;
}

#search-form .search-form-filters { background-color: #fff; padding-bottom: 0 !important; }

@media (max-width: 992px) {	
	.search-box-wrapper,
	.search-form__actions.pull-right { display: block !important; float: none !important; }
	form.search-form,
	#search-form .search-box-wrapper { width: 100%; }
}


/* Footer Section Styles
/* ----------------------------------------------------------------------------------------------------*/
#app-footer { 
	background-color: white;
	color: #5b6c79;
	font-size: 0.875em; 
	text-align: center;
	margin-top: 30px; 
	padding: 5px 0 10px;
}

ul.logo-list {
	list-style-type: none;
	text-align: center !important; 
	margin: 0 0 20px 0;
	padding: 0;
}

#app-footer ul.logo-list li img { height: 55px; }

#app-footer a, 
#app-footer ul { color: #5b6c79; white-space: nowrap; }

#app-footer .piped-list { margin-top: 50px; }

#app-footer .piped-list > li:first-child::before {
    content: "";
    margin: 0;
}

#app-footer .piped-list > li:nth-child(4)::before {
    content: "";
    margin: 0;

}

#app-footer .piped-list > li::before {
    margin-right: 8px;
    content: "|";
    color: #5b6c79;
}

@media only screen
and (max-width: 992px) {
	#app-footer p { text-align: center; }
	#app-footer ul.logo-list { margin: 0 auto !important; text-align: center !important; }
	#app-footer ul.logo-list li { display: block; float: none; text-align: center !important; margin-bottom: 25px; }
	
	#app-footer .piped-list { margin-bottom: 50px; }
	#app-footer .piped-list li { display: block; float: none; text-align: center !important; margin-bottom: 15px; }
	#app-footer .piped-list > li::before { margin-right: 0; content: ""; }
}



/* ----------------------------------------------------------------------------------------------------
   #3 LANDING PAGE ELEMENTS STYLES 
/* ----------------------------------------------------------------------------------------------------*/

/* Carousel Styles
/* ----------------------------------------------------------------------------------------------------*/
/* Responsive Carousel Items */
.carousel-inner .item img { 
    display: block;    
    width: 100%;
    height: auto;
 }

/* Carousel Items Fade Effect */
.carousel-fade .carousel-inner .item { -webkit-transition-property: opacity; transition-property: opacity; }

.carousel-fade .carousel-inner .item,
.carousel-fade .carousel-inner .active.left,
.carousel-fade .carousel-inner .active.right { opacity: 0; }

.carousel-fade .carousel-inner .active,
.carousel-fade .carousel-inner .next.left,
.carousel-fade .carousel-inner .prev.right { opacity: 1; }

.carousel-fade .carousel-inner .next,
.carousel-fade .carousel-inner .prev,
.carousel-fade .carousel-inner .active.left,
.carousel-fade .carousel-inner .active.right { left: 0; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }

.carousel-fade .carousel-control { background-color: transparent; border: 0; font-size: 2.5rem; text-align: center; margin-top: 0; text-shadow: 0 1px 1px rgba(0,0,0,.4); z-index: 2; }

@media (max-width: 768px) {
	.carousel-fade .carousel-control { font-size: 1.5rem; }
}

.carousel-fade .carousel-control span { position: absolute; top: 50%; z-index: 5; display: inline-block; }

.carousel-control .fa-chevron-left, 
.carousel-control .fa-chevron-right, 
.carousel-control .icon-next, 
.carousel-control .icon-prev { position: absolute; top: 50%; z-index: 5; display: inline-block; margin-top: -10px; }

.carousel-control .fa-chevron-left, 
.carousel-control .icon-prev { left: 50%; margin-left: -10px; }

.carousel-control .fa-chevron-right, 
.carousel-control .icon-next { right: 50%; margin-right: -10px; }

.feature-region { background-image: none; }


/* Course Listing
/* ----------------------------------------------------------------------------------------------------*/

#course-listings { 
	background: url('https://assets.learnforlife.sg/img/bkg-div-course-listings.png');
    background-repeat: no-repeat;
    background-position: top;
	padding: 65px 0 30px 0; 
}

#course-listings .line { margin-top: 15px; margin-bottom: 25px; border-bottom: 1px solid #ccc; }

#course-listings h3 { 
	color: #F60;
	text-transform: uppercase;
	font-family: 'Varela Round', sans-serif;
	font-size: 1.375em;
	font-weight: 700;  
	margin: 10px 0 20px; 
}


/* Course Browse By
/* ----------------------------------------------------------------------------------------------------*/
#course-browse-by { padding: 0 0 35px 0; }

.courseBrowseBy.nav-tabs {
	position:relative;
	background-color: transparent;
	margin:0 auto;
	padding: 18px 0;
	width:100%;
	white-space:nowrap;
	border:none;
	box-shadow: none;

}

.courseBrowseBy.nav-tabs li {
	display:block;
	float:left;
	line-height:48px;
	height:48px;
	padding:0;
	margin:0;
	letter-spacing:.8px
}

.courseBrowseBy.nav-tabs > li > span { 
	display: block;
	color: #888888;
	font-size:1em;
	line-height: 2.3;
	text-align:center;
	margin-right: 2px;
	padding: 10px 15px;
	width:100%;
	height:100%;
}

.courseBrowseBy.nav-tabs > li > a,
.courseBrowseBy.nav-tabs li > a:hover {
    background-color: transparent;
	border:none; 
	border-radius: 30px;
	color: #888888;
	display:block;
	font-size:1.2em;
	font-weight: bold;
	line-height: 1.7;
	text-align:center;
	text-transform: uppercase;
	margin-right: 2px;
	width:100%;
	height:100%;
	
	-webkit-transition:color .28s ease;
	   -moz-transition:color .28s ease;
	    -ms-transition:color .28s ease;
	     -o-transition:color .28s ease;
	        transition:color .28s ease;
}
	
.courseBrowseBy.nav-tabs li.active > a,
.courseBrowseBy.nav-tabs li.active > a:hover,
.courseBrowseBy.nav-tabs li.active > a:focus { background-color: #66AD09; border-radius: 30px; color: #ffffff; }

.card-panel-courseBrowseBy {
	background-color:#efefef;
	border: 0 !important;
	border-radius:0 !important;
	box-shadow: none; 
    min-height: 150px;
	margin:0 0 1rem;
	padding:20px;
	position:relative;
	z-index:2;
}


/* Responsive Tab for Browse By Styles
/* ----------------------------------------------------------------------------------------------------*/
@media (max-width: 768px) {
	#course-browse-by .responsive-tabs-container .tab-content::before { 
		content: "Browse By:"; 
		color: #888888;
		text-transform: uppercase;
		font-family: 'Varela Round', sans-serif;
		font-size: 1.2em;
		font-weight: 700;  
		line-height: 2.3; 
		text-align:center; 
		margin: 10px 0 20px;  
	}
}

#course-browse-by .responsive-tabs { margin-top: 20px; }

#course-browse-by .responsive-tabs-container .tab-content {
	border: 1px solid #ddd;
	border-top: none;
	padding: 20px 20px 10px;
}

#course-browse-by .responsive-tabs-container[class*="accordion-"] .tab-pane { margin-bottom: 15px; }

#course-browse-by .responsive-tabs-container[class*="accordion-"] .accordion-link {
	background-color: #66AD09;
	border-radius: 30px;
	border: 0;
	color: #fff;
	display: none;
	margin-bottom: 10px;
	padding: 10px 15px;
}

#course-browse-by .responsive-tabs-container[class*="accordion-"] .accordion-link.active {
	background-color: #66AD09;
	border-radius: 30px;
	border: 0;
	color: #fff;
	text-decoration: none;
}

#course-browse-by .responsive-tabs-container[class*="accordion-"] .accordion-link:hover,
#course-browse-by .responsive-tabs-container[class*="accordion-"] .accordion-link.active:hover { text-decoration: none; }

@media (max-width: 767px) {
	#course-browse-by .responsive-tabs-container.accordion-xs .nav-tabs { display: none; }

	#course-browse-by .responsive-tabs-container.accordion-xs .accordion-link { display: block; }

	#course-browse-by .responsive-tabs-container .tab-content { border: none; }

	#course-browse-by .responsive-tabs-container[class*="accordion-"] .tab-pane {
		border: 0;
		margin-bottom: 10px;
		margin-top: -10px;
		padding: 10px 10px 0;
	}
}

@media (min-width: 768px) and (max-width: 991px) {
	#course-browse-by .responsive-tabs-container.accordion-sm .nav-tabs { display: none; }

	#course-browse-by .responsive-tabs-container.accordion-sm .accordion-link { display: block; }

	#course-browse-by .responsive-tabs-container .tab-content { border: none; }

	#course-browse-by .responsive-tabs-container[class*="accordion-"] .tab-pane {
		border: 0;
		margin-bottom: 10px;
		margin-top: -10px;
		padding: 10px 10px 0;
	}
}

@media (min-width: 992px) and (max-width: 1199px) {
	#course-browse-by .responsive-tabs-container.accordion-md .nav-tabs { display: none; }

	#course-browse-by .responsive-tabs-container.accordion-md .accordion-link { display: block; }
}

@media (min-width: 1200px) {
	#course-browse-by .responsive-tabs-container.accordion-lg .nav-tabs { display: none; }

	#course-browse-by .responsive-tabs-container.accordion-lg .accordion-link { display: block; }
}

@media only screen
and (max-width: 497px) {
	/* Responsive Tabs */
	.course-browse-by.nav-tabs { border-bottom: none; }
	.course-browse-by.nav-tabs > li { float:none; }
	
	.course-browse-by.nav-tabs > li a {
		margin-top: 0px;
		margin-bottom: 0px;
		
		-webkit-border-radius: 5px;
		   -moz-border-radius: 5px;
		        border-radius: 5px;
    }
}


/* Course Listing and Course Browse By
/* ----------------------------------------------------------------------------------------------------*/
.subj-name, .course-col, .browse-col { padding-top: 0px; }
.course-col ul, .browse-col ul { list-style: none; margin: 0; padding: 0; }
.course-col ul li, .browse-col ul li { padding-bottom: 10px; }

@media only screen
and (max-width: 992px) {	
	#course-listings, #course-browse-by { text-align: center; }
}


/* Product Tile
/* ----------------------------------------------------------------------------------------------------*/
.product-link:hover { 
	-webkit-box-shadow: 0px 0px 8px 0px rgba(0,0,0,0.75);
	   -moz-box-shadow: 0px 0px 8px 0px rgba(0,0,0,0.75);
		    box-shadow: 0px 0px 8px 0px rgba(0,0,0,0.75);
}

@media (min-width: 768px) {
	.product-tile .product-heading { min-height: 90px; overflow: hidden; }
  }

.product-tile .product-heading .product-title { font-size: 1.475rem; font-weight: bold; }
.product-tile .product-description { font-size: 1em; }
.product-account-image-wrapper { display:none; height: 50px; max-width: 100%; }
.product-tile .product-footer .learn-more .product-dates,
.product-tile .product-footer .learn-more .product-value { display: none; }
.product-tile .product-footer .product-dates { font-size: 1.25em; height: 20px; }

.product-tile .product-image .jqFlag { display: none; }
.jumbotron .product-image .jqFlag { display: none; }


/* Parallax
/* ----------------------------------------------------------------------------------------------------*/
.parallax { 
	width: 100%;
	height: 350px;
	margin:0 0 50px;
	padding: 80px 0 60px 0;
	position: relative;

	box-shadow: 0 -1px 10px rgba(0, 0, 0, .7);
	transform-style: inherit;

	-webkit-background-size: cover;
	   -moz-background-size: cover;
		 -o-background-size: cover;
			background-size: cover;
}

.parallax :before {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	left:0;
	right:0;
}

.parallax-catalogue { 
	background-image: url('https://assets.learnforlife.sg/img/divider-parallax.jpg');
	background-attachment: fixed; 
	background-position: 50% 50%;
	background-repeat: no-repeat;
}

 /* Turn off parallax scrolling for tablets and phones. 
    Increase/decrease the pixels if needed */
@media only screen
and (max-width: 992px) {
    .parallax-catalogue {
        background-attachment: scroll;
    }
} 



/* ----------------------------------------------------------------------------------------------------
   #4 COURSE LISTING CARDS STYLES 
/* ----------------------------------------------------------------------------------------------------*/

/* Course Highlights Background Styles
/* ----------------------------------------------------------------------------------------------------*/
#listings.container {
    background: url('https://assets.learnforlife.sg/img/bkg-div-dark.png');
    background-repeat: no-repeat;
    background-position: bottom;
    padding: 50px 0 150px;
}
	

/* Course Highlights Card Styles
/* ----------------------------------------------------------------------------------------------------*/
.ProductIcon__LargeCircle--course { background: #f16622; }
.ProductIcon__LargeCircle--program{ background: #0F52BA; }
.product-flag-free { background-color: #f16622; }
.product-footer { color:#f16622 !important; }
.product-results { box-shadow: 0 -1px 10px rgba(0, 0, 0, .7); }
.product-results .product-tile:hover {
    box-shadow:  0px -5px 0px #f16622 inset;
    -moz-box-shadow:   0px -5px 0px #f16622 inset;
    -webkit-box-shadow:   0px -5px 0px #f16622 inset;
 }

/*change enroll / pay / etc button colours */
.btn-info {
    color: white;
    background-color: #4caf50;
    border-color: #4caf50;
}



/* ----------------------------------------------------------------------------------------------------
   #5 COURSE PAGE STYLES 
/* ----------------------------------------------------------------------------------------------------*/

/* Remove Cart Styles
/* ----------------------------------------------------------------------------------------------------*/
#bulk-checkout-divider-hero,
#add-to-bulk-checkout-hero,
#bulk-checkout-divider-footer,
#add-to-bulk-checkout-footer { display: none; }
#cart {  display:none; }
#add-to-cart-hero {  display:none; }
#add-to-cart-footer  {  display:none; }


/* Product Page Styles
/* ----------------------------------------------------------------------------------------------------*/
#product-page #feature { 
	padding-top: 0 !important; 
	background-color: #f0f0f0;
}

.hero-region.jumbotron {
    background: url('https://assets.learnforlife.sg/img/bkg-course-header.png');
    background-repeat: no-repeat;
    background-position-x: right;
    background-position-y: 85%;
}

.hero-head.h1 { margin: 0 0 20px !important; }

.hero-region p { display: none; }
.hero-region > div:nth-of-type(2) > p:nth-of-type(3) { display: block !important; }
.hero-region p.hero-action { display: block !important; }

.hero-action {  }

.product-account-logo { display: none; }

.ProductEnrollment__Notice { color: #a23891; display: none; }

/*product page description formatting*/
.sect_header { border-bottom: 3px solid grey; }

.Product__AssociatedProductsFoldButton { color: #333; background-color: #fff; border-color: #ccc; padding: 6px 12px; }
.Product__AssociatedProductsFoldButton:hover { color: #333; background-color: #e6e6e6; border-color: #adadad; }

#support-bar,
footer.callout-region {
    background-color: #ffcc33 !important;
    background: url('https://assets.learnforlife.sg/img/bkg-div-info.png');
    background-repeat: no-repeat;
    background-position-x: 50%;
	background-position-y: 50%;
	margin:0 0 50px;
	padding: 50px 0;;
}

footer.callout-region p.support-bar-copyright {
    color: #000000;
	font-size: 70%;
	margin: 50px 0 0 0;
}


/* Course Description Tab Styles
/* ----------------------------------------------------------------------------------------------------*/
.course-desc.nav-tabs {
	position:relative;
	background-color:#fff;
	margin:0 auto;
	width:100%;
	white-space:nowrap;
	border:none;
	box-shadow:0 2px 5px 0 rgba(0,0,0,.16),0 2px 10px 0 rgba(0,0,0,.12)

}

.course-desc.nav-tabs li {
	display:block;
	float:left;
	line-height:48px;
	height:48px;
	padding:0;
	margin:0;
	letter-spacing:.8px
}

.course-desc.nav-tabs > li > a {
    border:none; 
	border-bottom:3px solid #ffa000;
	border-top:3px solid #ffa000;
	border-radius: 0;
	color: #fff;
	display:block;
	font-size:1em;
	line-height: 1.42857143;
	text-align:center;
	margin-right: 2px;
	width:100%;
	height:100%;
	
	-webkit-transition:color .28s ease;
	   -moz-transition:color .28s ease;
	    -ms-transition:color .28s ease;
	     -o-transition:color .28s ease;
	        transition:color .28s ease;
}

.course-desc.nav-tabs li > a:hover { background-color:#ffa000; border:none; border-top:3px solid #ffa000; border-bottom:3px solid #fff; border-radius: 0; color:#fff; }
	
.course-desc.nav-tabs li.active > a { background-color:#fff; border:none; border-top:3px solid #ff6600; border-bottom:3px solid #fff; border-radius: 0; color:#333; }
.course-desc.nav-tabs li.active > a:hover { background-color:#fff; border:none; border-top:3px solid #ff6600; border-bottom:3px solid #fff; border-radius: 0; }
.course-desc.nav-tabs li.active > a:focus { background-color:#fff; border:none; border-top:3px solid #ff6600; border-bottom:3px solid #fff; border-radius: 0; }

.tabs-5 li { width:20%; }
.tabs-4 li { width:25%; }
.tabs-3 li { width:33.3%; }
.tabs-2 li { width:50%; }

.course-desc.tabs-grey { background-color:#546e7a; }
.course-desc.tabs-grey li a.active { border-color:#fff; }

.course-desc.tabs-cyan { background-color:#00bcd4; }
.course-desc.tabs-cyan li a.active { border-color:#ffeb3b; }

.course-desc.tabs-pink { background-color:#ec407a; }
.course-desc.tabs-pink li a.active { border-color:#673ab7; }

.course-desc.tabs-orange { background-color:#ffa000; }
.course-desc.tabs-orange li a.active { border-color:#e53935; }

.course-desc.tabs-green { background-color:#7cb342; }
.course-desc.tabs-green li a.active { border-color:#1565c0; }

.course-desc.tabs-primary { background-color:#4285F4; }
.course-desc.tabs-primary li a.active { border-color:#fff; }

.tab-content { font-size: 1.125em; }

.card-panel {
	background-color:#fff;
	border-radius:0;
	box-shadow:0 2px 5px 0 rgba(0,0,0,.12),0 2px 5px 0 rgba(0,0,0,.12),-5px 2px 5px 0 rgba(0,0,0,.12); 
    min-height: 400px;
	margin:0 0 1rem;
	padding:20px;
	position:relative;
	transition:box-shadow .25s;
	z-index:2;
}

@media only screen
and (max-width: 497px) {
	/* Responsive Tabs */
	.course-desc.nav-tabs { border-bottom: none; }
	.course-desc.nav-tabs > li { float:none; }
	
	.course-desc.nav-tabs > li a {
		/*border: 1px solid #ddd;*/

		margin-top: 0px;
		margin-bottom: 0px;
		
		-webkit-border-radius: 5px;
		   -moz-border-radius: 5px;
		        border-radius: 5px;
    }
}


/* Responsive Tab Styles
/* ----------------------------------------------------------------------------------------------------*/

.responsive-tabs { margin-top: 20px; }

.responsive-tabs-container .tab-content {
	border: 1px solid #ddd;
	border-top: none;
	padding: 20px 20px 10px;
}

.responsive-tabs-container[class*="accordion-"] .tab-pane { margin-bottom: 15px; }

.responsive-tabs-container[class*="accordion-"] .accordion-link {
	background-color:#ffa000;
	border-radius: 0;
	border: 1px solid #ffa000;
	color: #fff;
	display: none;
	text-decoration: none;
	margin-bottom: 10px;
	padding: 10px 15px;
	
}

.responsive-tabs-container[class*="accordion-"] .accordion-link.active {
	background-color:#ffa000;
	border: 1px solid #ffa000;
	text-decoration: none;
}

.responsive-tabs-container[class*="accordion-"] .accordion-link:hover,
.responsive-tabs-container[class*="accordion-"] .accordion-link.active:hover { text-decoration: none; }

@media (max-width: 767px) {
	.responsive-tabs-container.accordion-xs .nav-tabs { display: none; }

	.responsive-tabs-container.accordion-xs .accordion-link { display: block; }

	.responsive-tabs-container .tab-content { border: none; }

	.responsive-tabs-container[class*="accordion-"] .tab-pane {
		border: 1px solid #ddd;
		border-top: none;
		border-top-left-radius: 0;
		border-top-right-radius: 0;
		border-width: medium 1px 1px;
		margin-bottom: 10px;
		margin-top: -10px;
		padding: 10px 10px 0;
	}
}

@media (min-width: 768px) and (max-width: 991px) {
	.responsive-tabs-container.accordion-sm .nav-tabs { display: none; }

	.responsive-tabs-container.accordion-sm .accordion-link { display: block; }

	.responsive-tabs-container .tab-content { border: none; }

	.responsive-tabs-container[class*="accordion-"] .tab-pane {
		border: 1px solid #ddd;
		border-top: none;
		border-top-left-radius: 0;
		border-top-right-radius: 0;
		border-width: medium 1px 1px;
		margin-bottom: 10px;
		margin-top: -10px;
		padding: 10px 10px 0;
	}
}

@media (min-width: 992px) and (max-width: 1199px) {
	.responsive-tabs-container.accordion-md .nav-tabs { display: none; }

	.responsive-tabs-container.accordion-md .accordion-link { display: block; }
}

@media (min-width: 1200px) {
	.responsive-tabs-container.accordion-lg .nav-tabs { display: none; }

	.responsive-tabs-container.accordion-lg .accordion-link { display: block; }
}


/* User Profile Styles
/* ----------------------------------------------------------------------------------------------------*/
.trainer-profile { position: relative; padding: 0 20px; }

@media (min-width: 400px) and (max-width: 991px) {
	.trainer-profile { text-align: center !important; padding: 0 !important; }
	.username { text-align: center !important; padding: 0 !important; }
}

.username {
    bottom: 0;
    color: #ffffff;
    padding: 0 15px 10px;
    position: absolute;
    width: 100%;
    text-shadow: 1px 1px 2px #000000;
}

.profile-photo { border-radius: 4px; }

.username > h2 {
    font-family: oswald;
    font-size: 1.75em;
    font-weight: lighter;
    margin: 31px 0 4px;
    position: relative;
    text-shadow: 1px 1px 2px #000000;
    text-transform: uppercase;
}

.username > h2 small {
    color: #ffffff;
    font-family: open sans;
    font-size: 0.8125em;
    font-weight: 400;
    position: relative;
}

.username .fa{
    color: #ffffff;
    font-size: 0.875em;
    margin: 0 0 0 4px;
    position: static;
}


/* Offered By Styles
/* ----------------------------------------------------------------------------------------------------*/
.offered-title { margin-top: 55px; margin-bottom: 15px; margin-left: 25px; padding-bottom: 5px; font-size: 0.875em; color:#999; border-bottom: #999 1px solid; }
.offered-logo { margin-left: 25px; width: 90%; }


/* Responsive Video Embeds Styles
/* ----------------------------------------------------------------------------------------------------*/
.video-container {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 35px;
    height: 0;
    overflow: hidden;
}

.video-container iframe,
.video-container object,
.video-container embed {
    position: absolute;
    top:0;
    left: 0;
    width: 100%;
    height: 100%;
}


/* Panel Styles
/* ----------------------------------------------------------------------------------------------------*/
.panel {
  background-color: #fff;
  border: #eeeeee;
  
  margin-bottom: 20px;
  
  -webkit-box-shadow: 0 1px 5px rgba(0, 0, 0, .5);
     -moz-box-shadow: 0 1px 5px rgba(0, 0, 0, .5);
          box-shadow: 0 1px 5px rgba(0, 0, 0, .5);

  -webkit-border-radius: 4px;
     -moz-border-radius: 4px;
	      border-radius: 4px;
}

.panel-body {
  padding: 15px;
}

.panel-heading {
  padding: 10px 15px;
  font-weight: bold !important;
  font-size: 1.125em;
  border-bottom: 1px solid transparent;
  border-top-right-radius: 3px;
  border-top-left-radius: 3px;
  border-radius: 4px 4px 0 0;
  -webkit-border-radius: 4px 4px 0 0;
     -moz-border-radius: 4px 4px 0 0;
}

.panel-heading > .dropdown .dropdown-toggle {
  color: inherit;
}

.panel-title {
  font-size: 1em;
  font-weight: normal;
  color: inherit;
  margin-top: 0;
  margin-bottom: 0;
}

.panel-title > a,
.panel-title > small,
.panel-title > .small,
.panel-title > small > a,
.panel-title > .small > a {
  color: inherit;
}

.panel-footer {
  background-color: #e6e9ed;
  border-top-color: #e6e9ed;
  padding: 10px 10px;
          border-radius: 0 0 4px 4px;

  -webkit-border-radius: 0 0 4px 4px;
     -moz-border-radius: 0 0 4px 4px;
}

.panel > .list-group,
.panel > .panel-collapse > .list-group {
  margin-bottom: 0;
}
.panel > .list-group .list-group-item,
.panel > .panel-collapse > .list-group .list-group-item {
  border-width: 1px 0;
  border-radius: 0;
}
.panel > .list-group:first-child .list-group-item:first-child,
.panel > .panel-collapse > .list-group:first-child .list-group-item:first-child {
  border-top: 0;
  border-top-right-radius: 3px;
  border-top-left-radius: 3px;
}
.panel > .list-group:last-child .list-group-item:last-child,
.panel > .panel-collapse > .list-group:last-child .list-group-item:last-child {
  border-bottom: 0;
  border-bottom-right-radius: 3px;
  border-bottom-left-radius: 3px;
}
.panel > .panel-heading + .panel-collapse > .list-group .list-group-item:first-child {
  border-top-right-radius: 0;
  border-top-left-radius: 0;
}
.panel-heading + .list-group .list-group-item:first-child {
  border-top-width: 0;
}
.list-group + .panel-footer {
  border-top-width: 0;
}

.panel .list-group {
  -webkit-box-shadow: none;
     -moz-box-shadow: none;
          box-shadow: none;
}

.panel .list-group-item:first-child {
  border-top: 1px solid #e6e9ed;
}

.panel > .table,
.panel > .table-responsive > .table,
.panel > .panel-collapse > .table {
  margin-bottom: 0;
}
.panel > .table caption,
.panel > .table-responsive > .table caption,
.panel > .panel-collapse > .table caption {
  padding-left: 15px;
  padding-right: 15px;
}
.panel > .table:first-child,
.panel > .table-responsive:first-child > .table:first-child {
  border-top-right-radius: 3px;
  border-top-left-radius: 3px;
}
.panel > .table:first-child > thead:first-child > tr:first-child,
.panel > .table-responsive:first-child > .table:first-child > thead:first-child > tr:first-child,
.panel > .table:first-child > tbody:first-child > tr:first-child,
.panel > .table-responsive:first-child > .table:first-child > tbody:first-child > tr:first-child {
  border-top-left-radius: 3px;
  border-top-right-radius: 3px;
}
.panel > .table:first-child > thead:first-child > tr:first-child td:first-child,
.panel > .table-responsive:first-child > .table:first-child > thead:first-child > tr:first-child td:first-child,
.panel > .table:first-child > tbody:first-child > tr:first-child td:first-child,
.panel > .table-responsive:first-child > .table:first-child > tbody:first-child > tr:first-child td:first-child,
.panel > .table:first-child > thead:first-child > tr:first-child th:first-child,
.panel > .table-responsive:first-child > .table:first-child > thead:first-child > tr:first-child th:first-child,
.panel > .table:first-child > tbody:first-child > tr:first-child th:first-child,
.panel > .table-responsive:first-child > .table:first-child > tbody:first-child > tr:first-child th:first-child {
  border-top-left-radius: 3px;
}
.panel > .table:first-child > thead:first-child > tr:first-child td:last-child,
.panel > .table-responsive:first-child > .table:first-child > thead:first-child > tr:first-child td:last-child,
.panel > .table:first-child > tbody:first-child > tr:first-child td:last-child,
.panel > .table-responsive:first-child > .table:first-child > tbody:first-child > tr:first-child td:last-child,
.panel > .table:first-child > thead:first-child > tr:first-child th:last-child,
.panel > .table-responsive:first-child > .table:first-child > thead:first-child > tr:first-child th:last-child,
.panel > .table:first-child > tbody:first-child > tr:first-child th:last-child,
.panel > .table-responsive:first-child > .table:first-child > tbody:first-child > tr:first-child th:last-child {
  border-top-right-radius: 3px;
}
.panel > .table:last-child,
.panel > .table-responsive:last-child > .table:last-child {
  border-bottom-right-radius: 3px;
  border-bottom-left-radius: 3px;
}
.panel > .table:last-child > tbody:last-child > tr:last-child,
.panel > .table-responsive:last-child > .table:last-child > tbody:last-child > tr:last-child,
.panel > .table:last-child > tfoot:last-child > tr:last-child,
.panel > .table-responsive:last-child > .table:last-child > tfoot:last-child > tr:last-child {
  border-bottom-left-radius: 3px;
  border-bottom-right-radius: 3px;
}
.panel > .table:last-child > tbody:last-child > tr:last-child td:first-child,
.panel > .table-responsive:last-child > .table:last-child > tbody:last-child > tr:last-child td:first-child,
.panel > .table:last-child > tfoot:last-child > tr:last-child td:first-child,
.panel > .table-responsive:last-child > .table:last-child > tfoot:last-child > tr:last-child td:first-child,
.panel > .table:last-child > tbody:last-child > tr:last-child th:first-child,
.panel > .table-responsive:last-child > .table:last-child > tbody:last-child > tr:last-child th:first-child,
.panel > .table:last-child > tfoot:last-child > tr:last-child th:first-child,
.panel > .table-responsive:last-child > .table:last-child > tfoot:last-child > tr:last-child th:first-child {
  border-bottom-left-radius: 3px;
}
.panel > .table:last-child > tbody:last-child > tr:last-child td:last-child,
.panel > .table-responsive:last-child > .table:last-child > tbody:last-child > tr:last-child td:last-child,
.panel > .table:last-child > tfoot:last-child > tr:last-child td:last-child,
.panel > .table-responsive:last-child > .table:last-child > tfoot:last-child > tr:last-child td:last-child,
.panel > .table:last-child > tbody:last-child > tr:last-child th:last-child,
.panel > .table-responsive:last-child > .table:last-child > tbody:last-child > tr:last-child th:last-child,
.panel > .table:last-child > tfoot:last-child > tr:last-child th:last-child,
.panel > .table-responsive:last-child > .table:last-child > tfoot:last-child > tr:last-child th:last-child {
  border-bottom-right-radius: 3px;
}
.panel > .panel-body + .table,
.panel > .panel-body + .table-responsive,
.panel > .table + .panel-body,
.panel > .table-responsive + .panel-body {
  border-top: 1px solid #dddddd;
}
.panel > .table > tbody:first-child > tr:first-child th,
.panel > .table > tbody:first-child > tr:first-child td {
  border-top: 0;
}
.panel > .table-bordered,
.panel > .table-responsive > .table-bordered {
  border: 0;
}
.panel > .table-bordered > thead > tr > th:first-child,
.panel > .table-responsive > .table-bordered > thead > tr > th:first-child,
.panel > .table-bordered > tbody > tr > th:first-child,
.panel > .table-responsive > .table-bordered > tbody > tr > th:first-child,
.panel > .table-bordered > tfoot > tr > th:first-child,
.panel > .table-responsive > .table-bordered > tfoot > tr > th:first-child,
.panel > .table-bordered > thead > tr > td:first-child,
.panel > .table-responsive > .table-bordered > thead > tr > td:first-child,
.panel > .table-bordered > tbody > tr > td:first-child,
.panel > .table-responsive > .table-bordered > tbody > tr > td:first-child,
.panel > .table-bordered > tfoot > tr > td:first-child,
.panel > .table-responsive > .table-bordered > tfoot > tr > td:first-child {
  border-left: 0;
}
.panel > .table-bordered > thead > tr > th:last-child,
.panel > .table-responsive > .table-bordered > thead > tr > th:last-child,
.panel > .table-bordered > tbody > tr > th:last-child,
.panel > .table-responsive > .table-bordered > tbody > tr > th:last-child,
.panel > .table-bordered > tfoot > tr > th:last-child,
.panel > .table-responsive > .table-bordered > tfoot > tr > th:last-child,
.panel > .table-bordered > thead > tr > td:last-child,
.panel > .table-responsive > .table-bordered > thead > tr > td:last-child,
.panel > .table-bordered > tbody > tr > td:last-child,
.panel > .table-responsive > .table-bordered > tbody > tr > td:last-child,
.panel > .table-bordered > tfoot > tr > td:last-child,
.panel > .table-responsive > .table-bordered > tfoot > tr > td:last-child {
  border-right: 0;
}
.panel > .table-bordered > thead > tr:first-child > td,
.panel > .table-responsive > .table-bordered > thead > tr:first-child > td,
.panel > .table-bordered > tbody > tr:first-child > td,
.panel > .table-responsive > .table-bordered > tbody > tr:first-child > td,
.panel > .table-bordered > thead > tr:first-child > th,
.panel > .table-responsive > .table-bordered > thead > tr:first-child > th,
.panel > .table-bordered > tbody > tr:first-child > th,
.panel > .table-responsive > .table-bordered > tbody > tr:first-child > th {
  border-bottom: 0;
}
.panel > .table-bordered > tbody > tr:last-child > td,
.panel > .table-responsive > .table-bordered > tbody > tr:last-child > td,
.panel > .table-bordered > tfoot > tr:last-child > td,
.panel > .table-responsive > .table-bordered > tfoot > tr:last-child > td,
.panel > .table-bordered > tbody > tr:last-child > th,
.panel > .table-responsive > .table-bordered > tbody > tr:last-child > th,
.panel > .table-bordered > tfoot > tr:last-child > th,
.panel > .table-responsive > .table-bordered > tfoot > tr:last-child > th {
  border-bottom: 0;
}
.panel > .table-responsive {
  border: 0;
  margin-bottom: 0;
}
.panel-group {
  margin-bottom: 20px;
}
.panel-group .panel {
  margin-bottom: 0;
  border-radius: 4px;
}
.panel-group .panel + .panel {
  margin-top: 5px;
}
.panel-group .panel-heading {
  border-bottom: 0;
}
.panel-group .panel-heading + .panel-collapse > .panel-body,
.panel-group .panel-heading + .panel-collapse > .list-group {
  border-top: 1px solid #dddddd;
}
.panel-group .panel-footer {
  border-top: 0;
}
.panel-group .panel-footer + .panel-collapse .panel-body {
  border-bottom: 1px solid #dddddd;
}

.panel-default {
  border-color: #eeeeee;
}
.panel-default > .panel-heading {
  color: #212121;
  background-color: #ddd;
  border-color: #ddd;
}
.panel-default > .panel-heading + .panel-collapse > .panel-body {
  border-top-color: #f5f5f5;
}
.panel-default > .panel-heading .badge {
  color: #f5f5f5;
  background-color: #212121;
}
.panel-default > .panel-footer + .panel-collapse > .panel-body {
  border-bottom-color: #f5f5f5;
}
.panel-primary {
  border-color: #4a89dc;
}
.panel-primary > .panel-heading {
  color: #ffffff;
  background-color: #4a89dc;
  border-color: #4a89dc;
}
.panel-primary > .panel-heading + .panel-collapse > .panel-body {
  border-top-color: #4a89dc;
}
.panel-primary > .panel-heading .badge {
  color: #4a89dc;
  background-color: #ffffff;
}
.panel-primary > .panel-footer + .panel-collapse > .panel-body {
  border-bottom-color: #4a89dc;
}
.panel-success {
  border-color: #8cc152;
}
.panel-success > .panel-heading {
  color: #ffffff;
  background-color: #8cc152;
  border-color: #8cc152;
}
.panel-success > .panel-heading + .panel-collapse > .panel-body {
  border-top-color: #8cc152;
}
.panel-success > .panel-heading .badge {
  color: #8cc152;
  background-color: #ffffff;
}
.panel-success > .panel-footer + .panel-collapse > .panel-body {
  border-bottom-color: #8cc152;
}
.panel-info {
  border-color: #3bafda;
}
.panel-info > .panel-heading {
  color: #ffffff;
  background-color: #3bafda;
  border-color: #3bafda;
}
.panel-info > .panel-heading + .panel-collapse > .panel-body {
  border-top-color: #3bafda;
}
.panel-info > .panel-heading .badge {
  color: #3bafda;
  background-color: #ffffff;
}
.panel-info > .panel-footer + .panel-collapse > .panel-body {
  border-bottom-color: #3bafda;
}
.panel-warning {
  border-color: #f6bb42;
}
.panel-warning > .panel-heading {
  color: #ffffff;
  background-color: #f6bb42;
  border-color: #f6bb42;
}
.panel-warning > .panel-heading + .panel-collapse > .panel-body {
  border-top-color: #f6bb42;
}
.panel-warning > .panel-heading .badge {
  color: #f6bb42;
  background-color: #ffffff;
}
.panel-warning > .panel-footer + .panel-collapse > .panel-body {
  border-bottom-color: #f6bb42;
}
.panel-danger {
  border-color: #da4453;
}
.panel-danger > .panel-heading {
  color: #ffffff;
  background-color: #da4453;
  border-color: #da4453;
}
.panel-danger > .panel-heading + .panel-collapse > .panel-body {
  border-top-color: #da4453;
}
.panel-danger > .panel-heading .badge {
  color: #da4453;
  background-color: #ffffff;
}
.panel-danger > .panel-footer + .panel-collapse > .panel-body {
  border-bottom-color: #da4453;
}

.panel-primary > .panel-heading > .panel-title, .panel-success > .panel-heading > .panel-title, .panel-info > .panel-heading > .panel-title, .panel-warning > .panel-heading > .panel-title, .panel-danger > .panel-heading > .panel-title {
  color: white;
}
.panel > .list-group:first-child .list-group-item:first-child, .panel > .table:first-child, .panel > .table-responsive:first-child > .table:first-child {
          border-radius: 4px 4px 0 0;

  -webkit-border-radius: 4px 4px 0 0;
     -moz-border-radius: 4px 4px 0 0;
}
.panel > .list-group:last-child .list-group-item:last-child {
          border-radius: 0 0 4px 4px;

  -webkit-border-radius: 0 0 4px 4px;
     -moz-border-radius: 0 0 4px 4px;
}
.panel > .table:first-child > thead:first-child > tr:first-child td:first-child, .panel > .table-responsive:first-child > .table:first-child > thead:first-child > tr:first-child td:first-child, .panel > .table:first-child > tbody:first-child > tr:first-child td:first-child, .panel > .table-responsive:first-child > .table:first-child > tbody:first-child > tr:first-child td:first-child, .panel > .table:first-child > thead:first-child > tr:first-child th:first-child, .panel > .table-responsive:first-child > .table:first-child > thead:first-child > tr:first-child th:first-child, .panel > .table:first-child > tbody:first-child > tr:first-child th:first-child, .panel > .table-responsive:first-child > .table:first-child > tbody:first-child > tr:first-child th:first-child {
          border-radius: 4px 0 0 0;

  -webkit-border-radius: 4px 0 0 0;
     -moz-border-radius: 4px 0 0 0;
}
.panel > .table:first-child > thead:first-child > tr:first-child td:last-child, .panel > .table-responsive:first-child > .table:first-child > thead:first-child > tr:first-child td:last-child, .panel > .table:first-child > tbody:first-child > tr:first-child td:last-child, .panel > .table-responsive:first-child > .table:first-child > tbody:first-child > tr:first-child td:last-child, .panel > .table:first-child > thead:first-child > tr:first-child th:last-child, .panel > .table-responsive:first-child > .table:first-child > thead:first-child > tr:first-child th:last-child, .panel > .table:first-child > tbody:first-child > tr:first-child th:last-child, .panel > .table-responsive:first-child > .table:first-child > tbody:first-child > tr:first-child th:last-child {
          border-radius: 0 4px 0 0;

  -webkit-border-radius: 0 4px 0 0;
     -moz-border-radius: 0 4px 0 0;
}
.panel > .table:last-child, .panel > .table-responsive:last-child > .table:last-child {
          border-radius: 0 0 4px 4px;

  -webkit-border-radius: 0 0 4px 4px;
     -moz-border-radius: 0 0 4px 4px;
}
.panel > .table:last-child > tbody:last-child > tr:last-child td:first-child, .panel > .table-responsive:last-child > .table:last-child > tbody:last-child > tr:last-child td:first-child, .panel > .table:last-child > tfoot:last-child > tr:last-child td:first-child, .panel > .table-responsive:last-child > .table:last-child > tfoot:last-child > tr:last-child td:first-child, .panel > .table:last-child > tbody:last-child > tr:last-child th:first-child, .panel > .table-responsive:last-child > .table:last-child > tbody:last-child > tr:last-child th:first-child, .panel > .table:last-child > tfoot:last-child > tr:last-child th:first-child, .panel > .table-responsive:last-child > .table:last-child > tfoot:last-child > tr:last-child th:first-child {
          border-radius: 0 0 0 4px;

  -webkit-border-radius: 0 0 0 4px;
     -moz-border-radius: 0 0 0 4px;
}
.panel > .table:last-child > tbody:last-child > tr:last-child td:last-child, .panel > .table-responsive:last-child > .table:last-child > tbody:last-child > tr:last-child td:last-child, .panel > .table:last-child > tfoot:last-child > tr:last-child td:last-child, .panel > .table-responsive:last-child > .table:last-child > tfoot:last-child > tr:last-child td:last-child, .panel > .table:last-child > tbody:last-child > tr:last-child th:last-child, .panel > .table-responsive:last-child > .table:last-child > tbody:last-child > tr:last-child th:last-child, .panel > .table:last-child > tfoot:last-child > tr:last-child th:last-child, .panel > .table-responsive:last-child > .table:last-child > tfoot:last-child > tr:last-child th:last-child {
          border-radius: 0 0 4px 0;

  -webkit-border-radius: 0 0 4px 0;
     -moz-border-radius: 0 0 4px 0;
}
.panel > .panel-body + .table, .panel > .panel-body + .table-responsive {
  border-top-color: #e6e9ed;
}


.panel-image {
    position: relative;   
}
.panel-image img {
    width: 100%;
	border-radius: 0 4px 0 0;
}

.panel-heading ~ .panel-image img {
	border-radius: 0px;
}

.panel-body {
   overflow: hidden;
}

.panel-body ul li,
.panel-body ol li {
   margin-bottom: 20px;
}

.panel-image ~ .panel-footer a,
.panel-image ~ .panel-footer a:hover {
	font-size: 1.125em;
	color: #333;
	text-decoration: none;
}

.panel-footer a,
.panel-footer a:hover {
	font-size: 1.125em;
	color: #333;
	text-decoration: none !important;
}


/* Video Transcript Styles
/* ----------------------------------------------------------------------------------------------------*/
i.indicator {  }
/* Make Bootstrap accordion collapse when clicking div
http://jsfiddle.net/Tcgyx/15/ 
http://stackoverflow.com/questions/19236717/how-to-make-bootstrap-accordion-collapse-when-clicking-div */
#video-transcript .panel-default .panel-heading { cursor: pointer; } 

#video-transcript .panel { box-shadow: none !important; }
#video-transcript .panel-default { border: none !important; border-radius: 0; }
#video-transcript .panel-default .panel-heading { border: none !important; border-top-right-radius: 0; border-top-left-radius: 0; padding: 0 !important; }

#video-transcript .panel-default > .panel-heading + .panel-collapse .panel-body { border: none !important; }

#video-transcript h4.panel-title { font-size: 0.9em; margin: 0; position: relative; width: 100%; text-transform: capitalize; }
#video-transcript h4.panel-title a { text-decoration: none; display: block !important; padding: 15px; }
#video-transcript h4.panel-title a:hover { text-decoration: none; }
#video-transcript h4.panel-title a i.indicator { position: absolute; top: 15px; right: 10px; }


/* Tags Styles
/* ----------------------------------------------------------------------------------------------------*/
.tags { display: none; }



/* ----------------------------------------------------------------------------------------------------
   #6 STATIC PAGE STYLES 
/* ----------------------------------------------------------------------------------------------------*/

/* Page Header Styles
/* ----------------------------------------------------------------------------------------------------*/
.header { background-color: #f0f0f0; }

.hero-head.h1 { 
	color: #333;
	font-family: inherit;
	font-size: 2.25em; 
	font-weight: 700;
	word-wrap: break-word;
	width: 100%;
	margin: 48px 0;
}

/* Back to Top
/* ----------------------------------------------------------------------------------------------------*/
#toTop {
	background:#ddd;
	cursor:pointer;
	display:none;
	color:#444;
	font-size: 2.8em;
	
	text-align:center;
	text-transform: capitalize;
	padding:0;
	position:fixed;
	bottom:35px;
	right:35px;
	z-index: 10;
	width:60px;
	height:60px;
	
	-webkit-border-radius: 5px !important;
       -moz-border-radius: 5px !important;
            border-radius: 5px !important;
	
	opacity:0.3;
    -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=30)";
	    filter: alpha(opacity=30);
}

#toTop i { 
	padding: 8px 0 0; 
	width:60px;
	height:60px;
}



/* ----------------------------------------------------------------------------------------------------
   #8 ENROLLMENT STYLES
/* ----------------------------------------------------------------------------------------------------*/

/* Modify Enrollment Panel to Remove Registration Form
/* ----------------------------------------------------------------------------------------------------*/
.RegistrationPanel, .RegistrationForm { text-align: center !important; }
.RegistrationPanel, .RegistrationForm .RegistrationHeader__Title { margin-bottom: 30px; }
.RegistrationPanel, .RegistrationForm ul { list-style: none !important; margin-bottom: 30px; }
.RegistrationPanel, .RegistrationForm .RegistrationHeader__DateInfo { margin-bottom: 50px; }
.RegistrationPanel, .RegistrationForm .RegistrationHeader__AuthenticationStatus { margin-bottom: 50px; }
.RegistrationPanel, .RegistrationForm .RegistrationHeader__AuthenticationStatus a { text-decoration: none !important; }

.Registration__SwitchAccountContainer_Button { display: none; }
.Registration__Captcha { display: none; }


/* Course Enrolment Panel
/* ----------------------------------------------------------------------------------------------------*/
#registration .panel { padding: 15px; }



/* ----------------------------------------------------------------------------------------------------
   #9 DASHBOARD STYLES 
/* ----------------------------------------------------------------------------------------------------*/

/* eCampus Banner
/* ----------------------------------------------------------------------------------------------------*/
.banner { background-color: #ddd; }


/* Hide Dashboard Tabs
/* ----------------------------------------------------------------------------------------------------*/
a[aria-controls="dashboard-not-completed-tab-panel"]{  display:none; }



/* ----------------------------------------------------------------------------------------------------
   #10 HELPER STYLES - Extend Bootstrap Components and Elements
/* ----------------------------------------------------------------------------------------------------*/

/* Customised Button Styles - http://codepen.io/danielcktan/pen/wJBrwp
/* ----------------------------------------------------------------------------------------------------*/
.btn {
  outline: 0;
  outline-offset: 0;
  border: 0;
  border-radius: 2px;
  
  -webkit-box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.12), 0 1px 2px 0 rgba(0, 0, 0, 0.24);
  	 -moz-box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.12), 0 1px 2px 0 rgba(0, 0, 0, 0.24);
  		  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.12), 0 1px 2px 0 rgba(0, 0, 0, 0.24);
		  
  -webkit-transition: all 0.15s ease-in-out;
  	 -moz-transition: all 0.15s ease-in-out;
  	   -o-transition: all 0.15s ease-in-out;
  		  transition: all 0.15s ease-in-out;
}

.btn:active,
.btn.active,
.btn:active:focus,
.btn.active:focus {
  outline: 0;
  outline-offset: 0;
  
  -webkit-box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
 	 -moz-box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
  		  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
		  
  -webkit-box-shadow: none;
  	 -moz-box-shadow: none;
  		  box-shadow: none;
}

.btn:hover {
  -webkit-box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
 	 -moz-box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
 		  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);		  
}

.btn-primary {
    color: white;
    background-color: #337ab7;
    border-color: #2e6da4;
}

.btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary.active {
    color: #fff;
    background-color: #204d74;
    border-color: #122b40;
}


/* Margins, Paddings, Borders and Alignments
/* ----------------------------------------------------------------------------------------------------*/
.no-border  { border:  0 !important; }
.no-padding { padding: 0 !important }
.no-margin 	{ margin:  0 !important; }

.margin-btm-5  { margin-bottom:5px 	!important; }
.margin-btm-10 { margin-bottom:10px !important; }
.margin-btm-15 { margin-bottom:15px !important; }
.margin-btm-20 { margin-bottom:20px !important; }
.margin-btm-30 { margin-bottom:30px !important; }
.margin-btm-40 { margin-bottom:40px !important; }
.margin-btm-50 { margin-bottom:50px !important; }
.margin-btm-60 { margin-bottom:60px !important; }

.margin-top-5  { margin-top:5px  !important; }
.margin-top-10 { margin-top:10px !important; }
.margin-top-15 { margin-top:15px !important; }
.margin-top-20 { margin-top:20px !important; }
.margin-top-30 { margin-top:30px !important; }
.margin-top-40 { margin-top:40px !important; }
.margin-top-50 { margin-top:50px !important; }
.margin-top-60 { margin-top:60px !important; }

.padding-5  { padding: 5px !important; }
.padding-10 { padding: 10px !important; }
.padding-15 { padding: 15px !important; }

.verticle-top 		{ vertical-align: top; }
.verticle-middle	{ vertical-align: middle; }
.verticle-bottom 	{ vertical-align: bottom; }

.tab-1 { 
	white-space: pre-wrap;
	
	-webkit-tab-size: 4;
	   -moz-tab-size: 4;
		 -o-tab-size: 4;
			tab-size: 4;
}

.tab-2 { 
	white-space: pre-wrap;
	
	-webkit-tab-size: 8;
	   -moz-tab-size: 8;
		 -o-tab-size: 8;
			tab-size: 8;	
}				  
		

/* Text Formating and Typography
/* ----------------------------------------------------------------------------------------------------*/
.text-justify		{ text-align: justify !important; }
.text-right			{ text-align: right !important; }
.text-center		{ text-align: center !important; }

.text-underline,
   ins, u, .insert			{ text-decoration: underline; }
.text-delete, strike,
   del, s, .cancel			{ text-decoration: line-through; }
.text-highlight, mark		{ background: #ffffdd; padding: 1px 5px; }
.text-highlight-yellow 		{ background: #d7df20; padding: 1px 5px; }

.text-bold					{ font-weight: bold !important; }
.text-italic, em, 			{ font-style: italic !important; }
.text-upper, text-caps		{ text-transform: uppercase; }							   

.text-font-xs 				{ font-size: 0.85em; }
.text-font-sm 				{ font-size: 0.9em; }
.text-font-md 				{ font-size: 1.2em; }
.text-font-lg 				{ font-size: 1.6em; }

.text-century-gothic 		{ font-family: "Century Gothic", Futura, AppleGothic, sans-serif; }
.text-handwritten 			{ font-family: LazyDogRegular, Arial, sans-serif; }
.text-sans-serif 			{ font-family: Trebuchet, Tahoma, Arial, Helvetica, sans-serif; }
.text-serif 				{ font-family: Georgia, Times, "Times New Roman", serif }
.text-code, samp, kbd, code	{ font-family: Consolas, "Lucida Console", Monaco, "Courier New", Courier, monospace; }


.dropcap {
	color: #333;
	display: block;
	float: left;
	font: 60px/40px Georgia, Times, serif;
	padding: 7px 8px 0 0;
}

[draggable] { cursor: move; }

.textwrap {
    word-wrap:break-word;
    word-break:break-all;
}	


/* Material Design Colours
/* ----------------------------------------------------------------------------------------------------*/

/* -- Background Colours -------------------------------- */
.bg-red 			{ background-color: #f44336; }
.bg-pink 			{ background-color: #e91e63; }
.bg-purple			{ background-color: #9c27b0; }
.bg-purple-deep		{ background-color: #673ab7; }
.bg-indego			{ background-color: #3f51b5; }
.bg-blue 			{ background-color: #2196f3; }
.bg-blue-light		{ background-color: #03a9f4; color: #333; }
.bg-cyan 			{ background-color: #00bcd4; color: #333; }
.bg-teal 			{ background-color: #009688; }
.bg-green			{ background-color: #4caf50; color: #333; }
.bg-green-light		{ background-color: #8bc34a; color: #333; }
.bg-lime			{ background-color: #cddc39; color: #333; }
.bg-yellow 			{ background-color: #ffeb3b; color: #333; }
.bg-amber 			{ background-color: #ffc107; color: #333; }
.bg-orange 			{ background-color: #ff9800; color: #333; }
.bg-orange-deep 	{ background-color: #ff5722; }
.bg-brown 			{ background-color: #795548; }
.bg-grey 			{ background-color: #9e9e9e; }
.bg-grey-blue 		{ background-color: #607d8b; }
.bg-black 			{ background-color: #000000; }

/* -- Font Colours -------------------------------- */
.text-red 			{ color: #f44336; }
.text-pink 			{ color: #e91e63; }
.text-purple		{ color: #9c27b0; }
.text-purple-deep	{ color: #673ab7; }
.text-indego		{ color: #3f51b5; }
.text-blue 			{ color: #2196f3; }
.text-blue-light	{ color: #03a9f4; }
.text-cyan 			{ color: #00bcd4; }
.text-teal 			{ color: #009688; }
.text-green			{ color: #4caf50; }
.text-green-light	{ color: #8bc34a; }
.text-lime			{ color: #cddc39; }
.text-yellow 		{ color: #ffeb3b; }
.text-amber 		{ color: #ffc107; }
.text-orange 		{ color: #ff9800; }
.text-orange-deep 	{ color: #ff5722; }
.text-brown 		{ color: #795548; }
.text-grey 			{ color: #9e9e9e; }
.text-grey-vlight	{ color: #eeeeee !important; }
.text-grey-blue 	{ color: #607d8b; }
.text-black 		{ color: #000000 !important; }
.text-white 		{ color: #ffffff !important; }