/* Parameter Key 

Defaults:
0.   Font-Family
1.   Background-Colour
2.   Font-Size
    
Masthead
3.   Background Colour 
6.   Border Color 
4.   Current Role Tab Text Color / Login Bar Text Color
5.   Current Role Tab Background Color  / Login Bar Background Color
    7.   Other Role Tab Text Color (DELETE)??
    8.   Other Role Tab Background Color  (DELETE)??

7.    learnerButtonHoverColor
8.    learnerButtonBgHoverColor

Buttons    
9.   Text Color 
10.   Background Color 

Tabs
30.   Selected  Tab Background Colour
33.   Selected  Tab Text Colour
31.   Unselected  Tab Background Colour
32.   Unselected  Tab Text Colour

Main Menu 
11.   Text Color
12.   Background Color
13.   Current Menu Item Text Color
14.   Current Menu Item Background Color 
37.   Menu Bar Item Separator

Content Boxes
15.   Background Color 
16.   Title Background Color
17.   Border Color 

Forms
18.   Fieldset Legend Text Color 
19.   Fieldset and Legend Background Color 
20.   Fieldset and Legend Border Color 

Tables 
21.   Table Header Background Color
22.   Table Sub Header Background Color
23.   Table Sub Sub Header Background Color 
24.   Table Sub Sub Sub Header Background Color 
25.   Table Content Row 0 Background Color
26.   Table Content Row 1 Background Color
27.   Table Row Dividers Background Color 
38.   Table Header Text Color
39.   Table Sub Header Text Color
40.   Table Sub Sub Header Text Color
41.   Table Sub Sub Sub Header Text Color
42.   Table Row 0 Text Color
43.	  Table Row 1 Text Color

Sections backgrounds
112.  Catalogue Menu Background image
45.   My Agenda Menu Background image
46.	  My Courses Menu Background image
47.   My Competency Maps Menu Background image
48.	  My Communications Menu Background image
113.  Glossary Menu Background image
49.   My Learners Menu Background image
44.	  Forums Menu Background image
50.	  Chat Menu Background image
51.   Mailbox Menu Background image
52.   learnerContentBoxTitleTextColor
114.  My Profile Menu Background image

Login
53.   loginBackground image

Home
54.   contentPagesBackground

Links
28.   Text Color 
29.   Font weight 

Headings
34.   Heading 1
35.   Heading 2
36.   Heading 3

Course Masthead:
55.   Logo Image (Param passed to the template)
56.   Background Colour
57.   Text Colour
58.   Back Icon
59.   Next Icon 
60.   Exit Icon 

Course Menu Flyout:
61.   Background Colour
62.   Course Background Color
63.   Text Colour
64.   Show Course Menu (SCO List) (Param passed to the template)

Status Icons:
65.   Not Started Icon
66.   In Progress Icon
67.   Completed and Passed Icon
68.   Completed and Failed Icon
69.   Completed (no success is being tracked) Icon

Resource Icons:
70.   Audio Icon
71.   Blogger Icon
72.   Book Icon
73.   Delicious Icon
74.   Excel Icon
75.   Facebook Icon
77.   Flash Icon
78.   Flickr Icon
79.   Document (unknown type) Icon
80.   Image Icon
81.   LinkedIn Icon
82.   PDF Icon
83.   Photobucket Icon
84.   Powerpoint Icon
85.   Slideshare Icon
86.   Twitter Icon
87.   Video Icon
88.   Vimeo Icon
89.   Website Icon
90.   Wikipedia Icon
91.   Word Icon
92.   Wordpress Icon
93.   Youtube Icon

Assessments:
93.	  Question Text Color

Answer Choices:
94.   Answer Choice Text Color
95.   Answer Choice Background Color
96.   Answer Choice Border Color
97.   Answer Hover Selected Text Color
98.   Answer Hover Selected Background Color
99.   Answer Hover SelectedBorder Color
100.  Correct Choice Text Color
101.  Correct Choice Background Color
102.  Correct Choice Border Color
103.  Incorrect Choice Text Color
104.  Incorrect Choice Background Color
105.  Incorrect Choice Border Color

Feedback Messages:
106.  Answered Correctly Text Color
107.  Answered Correctly Background Color
108.  Answered Correctly Border Color
109.  Answered Incorrectly Text Color
110.  Answered Incorrectly Background Color
111.  Answered Incorrectly Border Color

Footer:
115:  Background Color
116:  Background Text Color
*/
/*declare here the rest of the LESS variables making sure the names are unique and change the css below to use the LESS variable instead of parameter*/
/* #99199 LANDMINE: the text-color vars are intentionally "swapped" - #ffffff (unselectedTabTextColor) feeds the
   Selected var - compensating the cross-placed admin controls in ContentLayout.aspx. Net render is correct;
   stored property names are semantically inverted on ~28 edited domains. Do not un-swap alone - see the
   FormatResource.cs comment above the #333333/#ffffff args (un-swap only with a client data migration). */
/* Defaults */

/*body.modal for iframed body.modal (body with a .modal class) only, not for a regular modals!!!*/

body.modal {
  display: block;
  position: absolute;
  height: 100%;
  width: 100%;
  overflow: unset;
}
body.modal.questionnaire {
  overflow-y: auto !important;
}
body.modal #log_in_bar,
body.modal #masthead,
body.modal #footer {
  display: none;
}
body {
  margin: 0px;
  padding: 0px;
  background-color: white;
  font-family: 'Arial', 'sans-serif';
  font-size: 10pt;
  line-height: 1.5em;
}
body.Login {
  background-image: url('https://partner-schools.english.britishcouncil.org/FormatResource.ashx/programLearnerView_62a4499f-0607-4987-b864-4082d77e341d/loginBackground.gif');
}
body.page {
  background-image: url('https://partner-schools.english.britishcouncil.org/FormatResource.ashx/programLearnerView_62a4499f-0607-4987-b864-4082d77e341d/contentPagesBackground.gif');
}
body form,
body textarea,
body input,
body select {
  font-family: 'Arial', 'sans-serif';
}
a {
  color: #5900c1;
  font-weight: normal;
  text-decoration: underline;
}
a:hover {
  text-decoration: none;
}
/* Custom Colours	*/

div.pageHeaderStudent {
  background-color: #5900c1;
}
/* Login	*/

div.loginFooterStudent {
  width: 100%;
  height: 10px;
  border-top: solid 6px #5900c1;
}
div.loginContentStudent {
  float: left;
  border-left: solid white 70px;
  border-right: solid white 1px;
  background-color: white;
  width: 263px;
  height: 276px;
}
div.loginLogoStudent {
  background-color: white;
  height: 276px;
  overflow: hidden;
}
/* Header (AKA Masthead) */

#masthead,
#header {
  background-color: #5900c1;
}
/* border:solid 1px #5900c1;*/

#masthead #login_info,
#login_info.bar {
  color: #4e4e4e;
  background-color: white;
}
/* border-bottom:solid 1px #5900c1;*/

#masthead #login_info span.left_corner,
#masthead #login_info span.right_corner {
  background-color: #5900c1;
}
#masthead #login_info span.tab:hover {
  color: #4e4e4e;
  background-color: white;
}
#masthead #login_info a,
#login_info.bar a {
  color: #4e4e4e;
}
#masthead #login_info a.btn.log_in,
#login_info.bar a.btn.log_in,
#login_info.bar a.btn,
#masthead #login_info a.btn {
  color: white;
}
#masthead #main_menu_tabs a.tab {
  color: #333333;
  background-color: white;
}
/* border-bottom:solid 1px #5900c1;*/

#masthead #search a {
  background-color: #5900c1;
  color: white;
}
/* border-bottom:solid 1px #5900c1;*/

#masthead #main_menu_tabs a.tab span.left_corner,
#masthead #main_menu_tabs a.tab span.right_corner,
#masthead #search.tab span.left_corner,
#masthead #search.tab span.right_corner {
  background-color: #5900c1;
}
#masthead #main_menu_tabs a.tabCurrent {
  color: #333333;
  background-color: #f0f3f5;
  border-bottom: solid 1px #f0f3f5;
}
#masthead #main_menu_tabs a.tab:hover {
  color: #333333;
  background-color: #f0f3f5;
}
button.search-close svg.fa-magnifying-glass {
  display: none;
}
button.search-btn svg.fa-circle-x {
  display: none;
}
#masthead #main_menu_bar {
  background-color: white;
}
#masthead #main_menu_bar a.tab {
  color: #333333;
  background-color: Transparent;
}
#masthead #main_menu_bar span.separator {
  color: white;
}
#masthead #main_menu_bar a.tabCurrent {
  color: #333333;
}
#masthead #main_menu_bar a.tab:hover {
  color: #333333;
}
/*Content Page*/

#content_page,
#login_page,
#login_page_slideshow,
#content.container {
  background-color: white;
}
/* border:solid 1px #ffffff;*/

#content_page div.submenu_container.right {
  border-left: solid 1px #f0f3f5;
}
#content_page div.submenu_container.left {
  border-right: solid 1px #f0f3f5;
}
h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6 {
  font-family: 'Arial', 'sans-serif';
}
h1 {
  color: #27004c;
}
h2 {
  color: #27004c;
}
h3 {
  color: #333333;
}
#login_page span.login_form div.dividerLabel span {
  color: #27004c;
}
div.note {
  color: #27004c;
}
/*#content_page button, #content_page select, #content_page th, #content_page td,  {font-family:'Arial', 'sans-serif'; font-size:10pt; line-height:1.5em;}*/

hr {
  background-color: #f0f3f5;
  color: #f0f3f5;
}
#catalogue #slideshow div.features {
  background-color: #5900c1;
  color: white;
}
select.cohort-select {
  margin: 0px 10px 0px 0px;
}
/*Login*/

#login_page span.logo {
  background-color: #5900c1;
}
/*#login_page span.login_form {background-color:#ffffff}*/

#login_page span.login_form form div span input,
#login_page_slideshow span.login_form form div span input {
  border: solid 1px #f0f3f5;
}
#login_page span.login_form form div span.button input,
#login_page_slideshow span.login_form form div span.button input {
  border: none 0px Transparent;
}
#slideshow .container div.index span.current {
  color: #27004c;
}
/*TILES*/

#domain_stats_tile {
  border-top: solid 1px #f0f3f5;
  border-bottom: solid 1px #f0f3f5;
}
body.page div.domain_wall_tile {
  border: solid 1px #f0f3f5;
}
#custom_features_tile ul li {
  border-bottom: solid 1px #eeeeee;
  border-top: solid 1px #eeeeee;
}
.metadata.cloud-tag .label {
  width: auto;
  font-weight: bold;
  opacity: 0.8;
  display: inline-block;
  color: rgba(0, 0, 0, 0.6);
}
.metadata.cloud-tag .label:nth-of-type(odd) {
  color: rgba(0, 0, 0, 0.7);
}
/*Buttons*/

#content_page span.button,
#login_page span.button,
#searchCourses span.button {
  background-color: #5900c1;
  color: white;
}
#content_page span.button span.topleft_corner,
#content_page span.button span.bottomleft_corner,
#content_page span.button span.topright_corner,
#content_page span.button span.bottomright_corner,
#login_page span.button span.topleft_corner,
#login_page span.button span.bottomleft_corner,
#login_page span.button span.topright_corner,
#login_page span.button span.bottomright_corner,
#searchCourses span.button span.topleft_corner,
#searchCourses span.button span.bottomleft_corner,
#searchCourses span.button span.topright_corner,
#searchCourses span.button span.bottomright_corner {
  background-color: white;
}
#search.bar #searchCourses span.button span.topleft_corner,
#search.bar #searchCourses span.button span.bottomleft_corner,
#search.bar #searchCourses span.button span.topright_corner,
#search.bar #searchCourses span.button span.bottomright_corner {
  background-color: white;
}
#content_page span.buttonSpacing span.button.Disabled {
  background-color: #bbddeb;
  cursor: default;
}
#content_page span.button.disabled,
#login_page span.button.disabled {
  background-color: #c1dae5;
  color: #f3f7f9;
}
#content_page span.dropdown span.dropdown_arrow {
  background-color: #5900c1;
  color: white;
}
#content_page input[type=submit],
#content_page input[type=button],
#content_page input.input_button,
#content_page input.button,
#login_page span.button input {
  background-color: #5900c1;
  color: white;
}
#content_page div.button_container {
  text-align: right;
  clear: both;
  height: 35px;
}
#content_page div.button_container.left {
  text-align: left;
  clear: both;
  height: 35px;
}
#content_page div.button_container span.button {
  margin-left: 10px;
}
#content_page div.button_container.left span.button {
  float: none;
  margin-right: 10px;
}
#content_page div.button_container input.button {
  background-color: #5900c1;
  color: white;
  border: none;
}
#content_page span.button.Disabled {
  background-color: #dddddd;
}
/*Tabs
Tabs
30.   Selected  Tab Background Colour
32.   Selected  Tab Text Colour
31.   Unselected  Tab Background Colour
33.   Unselected  Tab Text Colour*/

#content_page #tabs {
  border-bottom: solid 1px #5900c1;
}
#content_page #tabs span.tab {
  color: white;
  background-color: white;
  border-bottom: solid 1px white;
}
#content_page #tabs span.tab span.left_corner,
#content_page #tabs span.tab span.right_corner {
  background-color: white;
}
#content_page #tabs span.currentTab {
  color: #333333;
  background-color: #5900c1;
  border-bottom: solid 1px #5900c1;
}
#content_page #tabs span.tab:hover {
  color: #333333;
  background-color: #5900c1;
}
/*Tables*/

#content_page table thead th,
#content_page table tr.tableHeader td {
  background-color: #5900c1;
  color: white;
  border-bottom: solid 1px #f0f3f5;
  border-right: solid 1px white;
}
#content_page table tbody tr.tableSubHeader {
  background-color: #cccccc;
  color: white;
  border-bottom: solid 1px #f0f3f5;
}
#content_page table tbody tr.tableSubSubHeader {
  background-color: white;
  color: #003366;
  border-bottom: solid 1px #f0f3f5;
}
#content_page table tbody tr.tableRow1,
#content_page table tbody tr.tableRow:nth-child(even) {
  background-color: #f6f9fb;
  color: #333333;
  border-bottom: solid 1px #f0f3f5;
}
#content_page table tbody tr.tableRow0,
#content_page table tbody tr.tableRow:nth-child(odd) {
  background-color: white;
  color: #333333;
  border-bottom: solid 1px #f0f3f5;
}
#content_page table tbody td {
  border-right: solid 1px white;
}
div#mycourse div.box div.wrapper {
  background-color: #f6f9fb;
  color: #333333;
}
/*fieldsets*/

#content_page fieldset {
  border: solid 1px #f0f3f5;
  background-color: white;
}
#content_page fieldset legend {
  color: #333333;
  background-color: white;
}
#content_page fieldset div:hover,
#content_page #CustomMetadata_FieldTable tbody tr:hover {
  background-color: white;
}
#content_page fieldset span.label,
#content_page span.label,
#content_page #MyForums #section_menu li div h4,
.label {
  color: #333333;
}
#content_page fieldset #openIDLoginDiv div.dividerLabel span {
  background-color: white;
}
#content_page fieldset table.optionsgrid td.dividerLabel span {
  background-color: white;
}
/*Login*/

#login_page span.login_form {
  background-color: white;
}
#login_page p.login_welcome_text {
  color: #333333;
}
/*My Agenda*/

#content_page div.dateHeader {
  background-color: #5900c1;
  color: white;
  border-bottom: solid 1px #f0f3f5;
}
#content_page ol.eventList li.dateHeader {
  background-color: #cccccc;
  color: white;
  border-bottom: solid 1px #f0f3f5;
}
#content_page ol.eventList li.event {
  border-bottom: solid 1px #f0f3f5;
}
#content_page ol.eventList li.row0 {
  background-color: white;
}
#content_page ol.eventList li.row1 {
  background-color: #f6f9fb;
}
/*Catalogue
25.   Table Content Row 0 Background Color
26.   Table Content Row 1 Background Color
9.    Button Text Color 
10.   Button Background Color */

#catalogue #categories li.item1,
#catalogue #courses li.item1,
#catalogue #course_details li.item1 {
  background-color: white;
}
#catalogue #categories li.item0,
#catalogue #courses li.item0,
#catalogue #course_details li.item0 {
  background-color: #f6f9fb;
}
#catalogue #categories li.item0:hover,
#catalogue #courses li.item0:hover,
#catalogue #course_details li.item0:hover,
#catalogue #categories li.item1:hover,
#catalogue #courses li.item1:hover,
#catalogue #course_details li.item1:hover {
  background-color: #eeeeee;
}
#catalogue #courses li div.type,
#catalogue #course_details li div.type,
#content_page #MyForums #section_menu li span.type,
#content_page #Courses ol.course_list li.course > div.type {
  background-color: #5900c1;
  color: white;
}
/*My Courses*/

#content_page #MyCourses #tabs {
  border-bottom: solid 1px #5900c1;
}
#content_page #MyCourses #tabs span.tab {
  color: #333333;
  background-color: white;
  border-bottom: solid 1px white;
}
#content_page #MyCourses #tabs span.tab span.left_corner,
#content_page #MyCourses #tabs span.tab span.right_corner {
  background-color: white;
}
#content_page #MyCourses #tabs span.currentTab {
  color: white;
  background-color: #5900c1;
  border-bottom: solid 1px #5900c1;
}
#content_page #MyCourses #tabs span.tab:hover {
  color: white;
  background-color: #5900c1;
}
#content_page #Courses div.program {
  border-bottom: solid 1px #f0f3f5;
  background-color: #5900c1;
  color: white;
}
#content_page #Courses ol.course_list {
  border-bottom: solid 1px #f0f3f5;
}
/* background-color:#5900c1;*/

/*#content_page #Courses ol.course_list li.course {}border-bottom:solid 1px #f0f3f5;*/

#content_page #Courses ol.course_list li.course:hover {
  background-color: #eeeeee;
}
#content_page #Courses ol.course_list li.course span.details {
  border-left: solid 1px #f0f3f5;
}
#content_page #Courses ol.course_list li.row0 {
  background-color: white;
}
#content_page #Courses ol.course_list li.row1 {
  background-color: #f6f9fb;
}
#content_page #Courses ol.course_list li div span.disabled {
  background-color: #dddddd;
}
#content_page #Courses ol.course_list li.course div span.label {
  color: #333333;
}
/*ecommerce
	#progress_bar {border-bottom:dotted 1px #f0f3f5;}*/

span.instructions {
  color: #333333;
}
#progress_bar span.arrow {
  color: #5900c1;
}
#progress_bar span.step {
  color: #5900c1;
}
#progress_bar span.step.current {
  color: #5900c1;
}
#progress_bar span.step.completed {
  color: #5900c1;
}
#progress_bar span.step span.number {
  background-color: #5900c1;
  color: white;
}
/*  30.   Selected  Tab Background Colour
    33.   Selected  Tab Text Colour
        
    31.   Unselected  Tab Background Colour
    32.   Unselected  Tab Text Colour*/

/*My Learning Paths*/

#content_page #LearningPaths div.program {
  border-bottom: solid 1px #f0f3f5;
  background-color: #5900c1;
  color: white;
}
#content_page #LearningPaths ol.learningPath_list {
  border-bottom: solid 1px #f0f3f5;
  background-color: #5900c1;
  color: white;
}
#content_page #LearningPaths ol.learningPath_list li.course {
  border-bottom: solid 1px #f0f3f5;
}
#content_page #LearningPaths ol.learningPath_list li.row0 {
  background-color: white;
}
#content_page #LearningPaths ol.learningPath_list li.row1 {
  background-color: #f6f9fb;
}
#content_page #LearningPaths ol.learningPath_list li div span.disabled {
  background-color: #dddddd;
}
#content_page #Courses ol.course_list li ol.objectives_list li.objective > h3 {
  background-color: #cccccc;
  color: white;
  border-bottom: solid 1px #f0f3f5;
}
#content_page #Courses ol.course_list li div.LP_details_overlay ol.objectives_list li.highlight,
#content_page #Courses ol.course_list li div.LP_details_overlay ol.objectives_list li.last.highlight,
#mycourse div.LP_details_overlay ol.objectives_list li.highlight,
#mycourse div.LP_details_overlay ol.objectives_list li.last.highlight {
  background-color: #eeeeee;
}
/*Transcript*/

#content_page #CourseReport {
  background-color: white;
}
#content_page #ProgressOverview {
  background-color: white;
}
body.Transcript .learner-info .custom-field {
  margin-bottom: 10px;
}
body.Transcript .learner-info .custom-field label {
  width: auto;
  font-weight: bold;
  margin-right: 5px;
  margin-bottom: 0px;
}
body.Transcript .learner-info .md-values .md-value {
  margin-right: 5px;
}
/*My Agenda*/

#content_page #References div.dateHeader {
  border-bottom: solid 1px #f0f3f5;
  background-color: #5900c1;
  color: white;
}
#content_page #References ul li.referenceHeader {
  border-bottom: solid 1px #f0f3f5;
  background-color: #cccccc;
}
#content_page #References ul li.reference {
  border-bottom: solid 1px #f0f3f5;
}
#content_page #References ul li.row0 {
  background-color: white;
}
#content_page #References ul li.row1 {
  background-color: #f6f9fb;
}
/*Forums*/

#forum_threads li.votes-high,
#one_post li.votes-high {
  background-color: #333333;
  color: white;
  border: solid 1px #333333;
}
#forum_threads li.votes-high h3,
#one_post li.votes-high h3 {
  color: white;
}
#forum_threads li.votes-low,
#one_post li.votes-low {
  background-color: white;
  color: #333333;
  border: solid 1px #333333;
}
#forum_threads li.votes-low h3,
#one_post li.votes-low h3 {
  color: #333333;
}
#forum_threads li.answers-high,
#one_post li.answers-high {
  background-color: #333333;
  color: white;
  border: solid 1px #333333;
}
#forum_threads li.answers-high h3,
#one_post li.answers-high h3 {
  color: white;
}
#forum_threads li.answers-low,
#one_post li.answers-low {
  background-color: white;
  color: #333333;
  border: solid 1px #333333;
}
#forum_threads li.answers-low h3,
#one_post li.answers-low h3 {
  color: #333333;
}
#forum_threads li.views-high,
#one_post li.views-high {
  background-color: #333333;
  color: white;
  border: solid 1px #333333;
}
#forum_threads li.views-high h3,
#one_post li.views-high h3 {
  color: white;
}
#forum_threads li.views-low,
#one_post li.views-low {
  background-color: white;
  color: #333333;
  border: solid 1px #333333;
}
#forum_threads li.views-low h3,
#one_post li.views-low h3 {
  color: #333333;
}
li.question_details span.author_photo {
  border: solid 1px #f0f3f5;
}
li.question_details h4 {
  color: #333333;
}
#one_post ul li.question_details span.author_photo,
#one_post ul.original_post li.author span.author_photo {
  border: solid 1px #f0f3f5;
}
#userProfile img.bio_photo {
  border: solid 1px #f0f3f5;
}
#forum_details {
  background-color: white;
}
#forum_threads li.row0 {
  background-color: white;
}
#forum_threads li.row1 {
  background-color: #f6f9fb;
}
#one_post ul.original_post,
#one_post #post_reply_form {
  background-color: white;
}
#one_post ul.row0 {
  background-color: white;
}
#one_post ul.row1 {
  background-color: #f6f9fb;
}
#one_post ul ul {
  border-bottom: none;
}
#one_post ul li.stats ul li.vote_button {
  background-color: #333333;
  border: solid 1px #333333;
  color: white;
}
.author-pull-left .body {
  width: 100%;
  float: left;
  padding-left: 5px;
}
/*Footer*/

#footer div.copyright {
  color: white;
}
#footer.container,
#footer.container .copyright,
#footer.container a {
  color: white;
}
/* Buttons */

span.MyCalendar-tabSelected {
  background-color: #5900c1;
  display: inline-block;
  color: #333333;
  cursor: pointer;
  padding: 10px;
  margin: 10px 10px 0px 0px;
}
span.MyCalendar-tabNotSelected {
  background-color: white;
  display: inline-block;
  color: #333333;
  cursor: pointer;
  padding: 10px;
  margin: 10px 10px 0px 0px;
}
/* Breadcrumbs */

#breadcrumbs a,
#breadcrumbs li > *,
#breadcrumbs li > a {
  color: #5900c1;
  font-size: 0.8em;
  font-weight: normal;
  line-height: 1.1em;
  text-decoration: none;
  cursor: hand;
}
#breadcrumbs a:hover {
  color: #5900c1;
  text-decoration: underline;
}
/* Menu and Section Header Box Styles */

/* Content Header (Contains the top corners and page title or menu box title and includes the shorter background image) 	*/

#contentBox1Student div.contentHeader,
#menuBox1Student div.contentHeader,
#contentBox2Student div.contentHeader,
#menuBox2Student div.contentHeader,
#contentBox3Student div.contentHeader,
#menuBox3Student div.contentHeader,
#contentBox4Student div.contentHeader,
#menuBox4Student div.contentHeader,
#contentBox5Student div.contentHeader,
#menuBox5Student div.contentHeader,
#contentBox6Student div.contentHeader,
#menuBox6Student div.contentHeader,
#contentBox7Student div.contentHeader,
#menuBox7Student div.contentHeader,
#contentBoxCustom div.contentHeader,
#menuBoxCustom div.contentHeader {
  background-color: white;
  margin: 0px 0px 0px 0px;
  border-top: solid 1px white;
  border-right: solid 1px white;
}
/* Content background (Defines the left and right borders and background colour) */

#contentBox1Student div.contentBG,
#menuBox1Student div.contentBG,
#contentBox2Student div.contentBG,
#menuBox2Student div.contentBG,
#contentBox3Student div.contentBG,
#menuBox3Student div.contentBG,
#contentBox4Student div.contentBG,
#menuBox4Student div.contentBG,
#contentBox5Student div.contentBG,
#menuBox5Student div.contentBG,
#contentBox6Student div.contentBG,
#menuBox6Student div.contentBG,
#contentBox7Student div.contentBG,
#menuBox7Student div.contentBG,
#contentBoxCustom div.contentBG,
#menuBoxCustom div.contentBG {
  background-color: white;
  padding: 10px 10px 40px 10px;
  margin: 0px 0px 0px 0px;
  border-left: solid 1px white;
  border-right: solid 1px white;
}
/* Content Bottom (Contains the bottom corners and page title or menu box title and includes the shorter background image) 	*/

#contentBox1Student div.contentBottom,
#menuBox1Student div.contentBottom,
#contentBox2Student div.contentBottom,
#menuBox2Student div.contentBottom,
#contentBox3Student div.contentBottom,
#menuBox3Student div.contentBottom,
#contentBox4Student div.contentBottom,
#menuBox4Student div.contentBottom,
#contentBox5Student div.contentBottom,
#menuBox5Student div.contentBottom,
#contentBox6Student div.contentBottom,
#menuBox6Student div.contentBottom,
#contentBox7Student div.contentBottom,
#menuBox7Student div.contentBottom,
#contentBoxCustom div.contentBottom,
#menuBoxCustom div.contentBottom {
  background-color: white;
  border-bottom: solid 1px white;
  border-left: solid 1px white;
  border-right: solid 1px white;
  margin: 0px 0px 0px 0px;
}
#contentBox4Student table {
  display: inline-block;
}
/* Form Colours for fieldsets and legends (form section titles) */

#contentBox1Student fieldset,
#contentBox2Student fieldset,
#contentBox3Student fieldset,
#contentBox4Student fieldset,
#contentBox5Student fieldset,
#contentBox6Student fieldset,
#contentBox7Student fieldset,
#contentBoxCustom fieldset {
  background-color: white;
  border-style: solid;
  border-color: #f0f3f5;
  width: 95%;
  border-width: 1px 0px 1px 0px;
  margin: 20px 0px 20px 0px;
  padding: 0px 10px 10px 10px;
  display: block;
  position: relative;
  font-size: 1em;
}
/* Legends */

#contentBox1Student legend,
#contentBox2Student legend,
#contentBox3Student legend,
#contentBox4Student legend,
#contentBox5Student legend,
#contentBox6Student legend,
#contentBox7Student legend {
  background-color: white;
  border-width: 1px 1px 1px 1px;
  border-style: solid;
  border-color: #666666;
  color: #333333;
  font-weight: bold;
  letter-spacing: 2px;
  font-size: 1em;
  padding: 2px 5px;
  margin: 0px 0px 10px 0px;
  top: -12px;
  position: relative;
}
/*Wizards*/

div.seriesCoursesWizardPages,
div.seriesCoursesLPInfoDiv {
  border: 1px solid #5900c1;
}
div.seriesCoursesWizardActionsDiv input.button,
#skipDiv input.button {
  background-color: #5900c1;
  border: 1px solid #5900c1;
  color: white;
}
seriesCoursesLPInfoDiv {
  color: #333333;
}
/* list rows (colors for rows) */

div.pageListHolder table.pageList thead th.tableHeader1,
thead tr.tableHeader1,
div.pageListHolder table.pageList thead th.tableHeader2,
thead tr.tableHeader2,
div.pageListHolder table.pageList thead th.tableHeader3,
thead tr.tableHeader3,
div.pageListHolder table.pageList thead th.tableHeader4,
thead tr.tableHeader4,
div.pageListHolder table.pageList thead th.tableHeader5,
thead tr.tableHeader5,
div.pageListHolder table.pageList thead th.tableHeader6,
thead tr.tableHeader6,
div.pageListHolder table.pageList thead th.tableHeader7,
thead tr.tableHeader7 {
  background-color: #5900c1;
  padding: 3px 5px 3px 5px;
  text-align: left;
}
div.pageListHolder table.pageList thead th.tableHeader1,
thead tr.tableHeader1 th div,
div.pageListHolder table.pageList thead th.tableHeader2,
thead tr.tableHeader2 th,
div.pageListHolder table.pageList thead th.tableHeader3,
thead tr.tableHeader3 th,
div.pageListHolder table.pageList thead th.tableHeader4,
thead tr.tableHeader4 th,
div.pageListHolder table.pageList thead th.tableHeader5,
thead tr.tableHeader5 th,
div.pageListHolder table.pageList thead th.tableHeader6,
thead tr.tableHeader6 th,
div.pageListHolder table.pageList thead th.tableHeader7,
thead tr.tableHeader7 th {
  text-align: left;
  padding: 3px 5px 3px 5px;
}
div.pageListHolder table.pageList tbody tr.tableSubHeader1,
div.pageListHolder table.pageList tbody tr.tableSubHeader2,
div.pageListHolder table.pageList tbody tr.tableSubHeader3,
div.pageListHolder table.pageList tbody tr.tableSubHeader4,
div.pageListHolder table.pageList tbody tr.tableSubHeader5,
div.pageListHolder table.pageList tbody tr.tableSubHeader6,
div.pageListHolder table.pageList tbody tr.tableSubHeader7 {
  background-color: #cccccc;
  height: 28px;
  font-weight: bold;
  text-align: left;
}
div.pageListHolder table.pageList thead tr.tableSubHeader1 th,
div.pageListHolder table.pageList thead tr.tableSubHeader2 th,
div.pageListHolder table.pageList thead tr.tableSubHeader3 th,
div.pageListHolder table.pageList thead tr.tableSubHeader4 th,
div.pageListHolder table.pageList thead tr.tableSubHeader5 th,
div.pageListHolder table.pageList thead tr.tableSubHeader6 th,
div.pageListHolder table.pageList thead tr.tableSubHeader7 th {
  text-align: left;
  padding: 3px 5px 3px 5px;
}
div.pageListHolder table.pageList tbody tr.tableSubSubHeader1,
div.pageListHolder table.pageList tbody tr.tableSubSubHeader2,
div.pageListHolder table.pageList tbody tr.tableSubSubHeader3,
div.pageListHolder table.pageList tbody tr.tableSubSubHeader4,
div.pageListHolder table.pageList tbody tr.tableSubSubHeader5,
div.pageListHolder table.pageList tbody tr.tableSubSubHeader6,
div.pageListHolder table.pageList tbody tr.tableSubSubHeader7 {
  background-color: white;
  height: 28px;
  font-weight: bold;
  text-align: left;
}
div.pageListHolder table.pageList thead tr.tableSubSubHeader1 th,
div.pageListHolder table.pageList thead tr.tableSubSubHeader2 th,
div.pageListHolder table.pageList thead tr.tableSubSubHeader3 th,
div.pageListHolder table.pageList thead tr.tableSubSubHeader4 th,
div.pageListHolder table.pageList thead tr.tableSubSubHeader5 th,
div.pageListHolder table.pageList thead tr.tableSubSubHeader6 th,
div.pageListHolder table.pageList thead tr.tableSubSubHeader7 th {
  text-align: left;
  padding: 3px 5px 3px 5px;
}
div.pageListHolder table.pageList tbody tr.tableSubSubSubHeader1,
div.pageListHolder table.pageList tbody tr.tableSubSubSubHeader2,
div.pageListHolder table.pageList tbody tr.tableSubSubSubHeader3,
div.pageListHolder table.pageList tbody tr.tableSubSubSubHeader4,
div.pageListHolder table.pageList tbody tr.tableSubSubSubHeader5,
div.pageListHolder table.pageList tbody tr.tableSubSubSubHeader6,
div.pageListHolder table.pageList tbody tr.tableSubSubSubHeader7 {
  background-color: #eeeeee;
  height: 28px;
  font-weight: bold;
  text-align: left;
}
/* Row Dividers */

div.pageListHolder table.pageList tbody td {
  border-bottom: solid 1px #f6f9fb;
}
div.pageListHolder table.pageList tbody tr.tableRow1-1 tr.tableRow1-0,
div.pageListHolder table.pageList tbody tr.tableRow1-1 tr.tableRow2-0,
div.pageListHolder table.pageList tbody tr.tableRow1-1 tr.tableRow3-0,
div.pageListHolder table.pageList tbody tr.tableRow1-1 tr.tableRow4-0,
div.pageListHolder table.pageList tbody tr.tableRow1-1 tr.tableRow5-0,
div.pageListHolder table.pageList tbody tr.tableRow1-1 tr.tableRow6-0,
div.pageListHolder table.pageList tbody tr.tableRow1-1 tr.tableRow7-0 {
  background-color: #f6f9fb;
  height: 28px;
}
div.pageListHolder table.pageList tbody tr.tableRow1-1,
div.pageListHolder table.pageList tbody tr.tableRow2-1,
div.pageListHolder table.pageList tbody tr.tableRow3-1,
div.pageListHolder table.pageList tbody tr.tableRow4-1,
div.pageListHolder table.pageList tbody tr.tableRow5-1,
div.pageListHolder table.pageList tbody tr.tableRow6-1,
div.pageListHolder table.pageList tbody tr.tableRow7-1 {
  background-color: white;
  height: 28px;
}
/* Row Dividers */

td.rowDivider1,
td.rowDivider2,
td.rowDivider3,
td.rowDivider4,
td.rowDivider5,
td.rowDivider6 {
  background-color: #f0f3f5;
}
#content_page ul.long_content.glossary {
  border-color: #f0f3f5;
}
#content_page ul.long_content.glossary > li {
  border-top: solid 1px #f0f3f5;
}
#content_page ul.long_content.glossary > li > div.definition > span.thumbnail > img,
#content_page ul.long_content.glossary > li > div.definition > span.zoomed_image > img {
  border: solid 1px #f0f3f5;
}
/*Feedback*/

#feedback li div.LikertScale span.spectrum {
  color: #333333;
}
/*Assessment Questions*/

body#tc-assessment {
  background-color: white;
  color: white;
}
#AssessmentQuestion,
#AssessmentQuestion #content_page {
  color: white;
  background-color: white;
  font-family: 'Arial', 'sans-serif';
}
#AssessmentQuestion h2 {
  color: white;
}
#AssessmentQuestion #mcq_answers a.answer {
  color: white;
  background-color: white;
  border: solid 1px white;
}
#AssessmentQuestion #mcq_answers a.answer:hover {
  color: white;
  background-color: white;
  border: solid 1px white;
}
#AssessmentQuestion #mcq_answers a.answer.correct {
  color: white;
  background-color: white;
  border: solid 1px white;
}
#AssessmentQuestion #mcq_answers a.answer.incorrect {
  color: white;
  background-color: white;
  border: solid 1px white;
}
/*#AssessmentQuestion #mcq_answers a.answer  span.topleft_corner, 
#AssessmentQuestion #mcq_answers a.answer  span.bottomleft_corner, 
#AssessmentQuestion #mcq_answers a.answer  span.topright_corner, 
#AssessmentQuestion #mcq_answers a.answer  span.bottomright_corner {background-color:#ffffff;}*/

#AssessmentQuestion ol.draganddrop {
  color: white;
}
#AssessmentQuestion ol.draganddrop span.drag,
#AssessmentQuestion ol.draganddropimage span.drag {
  color: white;
  background-color: white;
  border: solid 1px white;
}
#AssessmentQuestion ol.draganddrop span.drop,
#AssessmentQuestion ol.draganddropimage span.drop {
  color: white;
  background-color: white;
  border: solid 1px white;
}
#AssessmentQuestion ol.draganddrop span.correct,
#AssessmentQuestion ol.draganddropimage span.correct {
  color: white;
  background-color: white;
  border: solid 1px white;
}
#AssessmentQuestion ol.draganddrop span.incorrect,
#AssessmentQuestion ol.draganddropimage span.incorrect {
  color: white;
  background-color: white;
  border: solid 1px white;
}
#AssessmentQuestion #correctfb {
  color: white;
  background-color: white;
  border: solid 1px white;
}
#AssessmentQuestion #incorrectfb {
  color: white;
  background-color: white;
  border: solid 1px white;
}
.modal ul li {
  list-style-type: initial !important;
  display: list-item !important;
}
.modal ol li {
  list-style-type: decimal !important;
  display: list-item !important;
}
.fr-counter {
  visibility: hidden;
}
/* override new bootstrap margin*/

.checkbox .filterCB input[type=checkbox] {
  margin-left: 0px !important;
}
body.AdvancedSearch .metadataFilterDiv .checkbox,
body.AdvancedSearch .languagesFilterDiv .checkbox {
  margin-left: 20px !important;
}
/* override for lists in threads */

.thread ol {
  list-style-type: decimal;
}
.thread ul {
  list-style-type: disc;
}
/*#captcha > div{margin:40px auto;}*/

/*Course ratings*/

.tc.user-rating .fa {
  margin: 0px 0px 0px 5px;
  font-size: 1.5em;
}
.tc.user-rating .fa-frown-o.selected {
  color: red;
}
.tc.user-rating .fa-meh-o.selected {
  color: yellow;
}
.tc.user-rating .fa-smile-o.selected {
  color: green;
}
.tc.user-rating .fa-star {
  background-color: yellow;
}
.tc.user-rating .fa-thumbs-up.selected,
.tc.user-rating .fa-thumbs-down.selected {
  color: green;
}
/*Tables 
Assessments:
93.	  Question Text Color

Answer Choices:
94.   Answer Choice Text Color
95.   Answer Choice Background Color
96.   Answer Choice Border Color
97.   Answer Hover Selected Text Color
98.   Answer Hover Selected Background Color
99.   Answer Hover SelectedBorder Color
100.  Correct Choice Text Color
101.  Correct Choice Background Color
102.  Correct Choice Border Color
103.  Incorrect Choice Text Color
104.  Incorrect Choice Background Color
105.  Incorrect Choice Border Color

Feedback Messages:
106.  Answered Correctly Text Color
107.  Answered Correctly Background Color
108.  Answered Correctly Border Color
109.  Answered Incorrectly Text Color
110.  Answered Incorrectly Background Color
111.  Answered Incorrectly Border Color
*/

/*Resources*/

#resource-library .fa.checked {
  color: #5900c1;
}
#resource-library .fa {
  color: #5900c1;
}
#resource-library .filters .filter-type {
  margin: 0px 0px 15px 0px;
  padding: 0px;
}
#resource-library .count {
  border-bottom: solid 1px #eeeeee;
  margin-bottom: 15px;
  min-height: 3em;
}
#resource-library .pagination {
  margin: 0px;
}
#resource-library .filters i {
  line-height: 3em;
}
#resource-library .resources {
  background-color: #f6f6f6;
}
#resource-library .resources .search.input-group {
  margin-bottom: 15px;
}
#resource-library .resources .search.input-group .fa {
  color: white;
}
#resource-library .resources .count i {
  margin-top: 1em;
  display: inline-block;
}
#resource-library .resources .thumbnail {
  background-color: white;
  border: 0px;
  border-radius: 0px;
  padding: 5px;
}
#resource-library .resources .thumbnail .poster,
.media-preview.poster {
  background-color: #5900c1;
  padding: 5px;
  min-height: 140px;
}
#resource-library .resources .thumbnail .poster .fa,
.media-preview.poster .fa:before {
  font-size: 6em;
  color: white;
  margin: 20px;
}
#resource-library .resources .thumbnail .poster > span {
  width: 100%;
  height: 130px;
}
#resource-library .resources .thumbnail .poster img {
  width: 100%;
  height: 130px;
  object-fit: cover;
  object-position: center center;
  overflow: hidden;
}
#resource-library .resources .thumbnail .caption {
  text-align: left;
  padding: 5px 0px 0px 0px;
  min-height: 50px;
}
#resource-library .resources .thumbnail .caption .fa,
#resource-library .resources .thumbnail .caption svg {
  font-size: 0.8em;
  color: #36b3a8;
  display: inline-block;
  margin: 5px 5px 15px 0px;
  float: left;
}
#resource-library .resources .thumbnail .caption a {
  color: #5e5e5e;
}
#resource-library .resources .thumbnail .caption a:hover {
  color: #36b3a8;
}
#resource-library .resources .caption {
  height: 80px;
  text-overflow: ellipsis;
}
#resource-library .resources .caption .fa-download {
  margin-bottom: 50px !important;
}
.label.filter.filetype {
  cursor: pointer;
}
.media-preview.poster .fa:before {
  font-size: 50px;
  font-size: 15vw;
}
.media-preview {
  text-align: center;
}
.modal ol.no-list li {
  list-style-type: none !important;
}
ol.sessions li.session {
  margin: 0px 0px 5px 0px;
}
.course-row {
  margin: 0px 0px 5px 0px;
}
.speakers {
  margin: 5px 0px 0px 0px;
}
.speakers-agenda {
  margin: 0px 0px 10px 0px;
}
.custom-fields {
  margin: 10px 0px 0px 0px;
}
.custom-fields .custom-value {
  margin: 0px 0px 5px 0px;
}
.invalid.form-control {
  color: red;
}
.fullClassLabel {
  margin: 0px 10px 0px 0px;
  font-weight: bold;
}
.fullClassLabel.badge.badge-warning {
  background-color: #f0ad4e;
}
.seriesCoursesSeriesSelectionDiv input[type=radio] {
  margin-right: 15px !important;
}
table tbody td.code {
  word-break: break-all;
}
/*print css for transcripts*/

@media print {
  body.Course_Progress .label {
    width: 130px;
    border: none !important;
    font-weight: bold !important;
  }
  body.Course_Progress #masthead.container.hidden-print {
    display: none !important;
  }
  body.Course_Progress #footer .text-right.copyright {
    width: 100%;
    text-align: center !important;
  }
  body.Course_Progress h2 {
    font-size: 2em !important;
  }
  .fieldset_container div {
    margin: 5px 0px 15px 0px;
  }
}
.description-text {
  word-break: break-word;
}
.panel-default.search input {
  border: none;
  width: 200px;
  padding: 0px 5px 0px 5px;
  margin: 5px;
}
.panel-default.search datalist {
  width: 200px;
}
.panel-default.search datalist option {
  width: 200px;
  word-break: break-word;
  overflow: hidden;
}
/*   USER SURVEY   */

#ExternalTrainingModal li {
  margin-bottom: 10px;
  padding: 0px;
}
#ExternalTrainingModal .modal-dialog {
  width: 80%;
}
#ExternalTrainingModal .label {
  width: auto;
}
#ExternalTrainingModal ol,
#ExternalTrainingModal ol li {
  list-style-type: none !important;
  margin: 0px 0px 20px 0px;
}
#ExternalTrainingModal label {
  display: block;
  padding-left: 15px;
  text-indent: -15px;
}
#ExternalTrainingModal #feedbackHTML > div.col-md-12,
#ExternalTrainingModal #feedbackHTML ol {
  padding: 0px;
}
#ExternalTrainingModal textarea,
#ExternalTrainingModal select,
#ExternalTrainingModal input[type="text"] {
  width: 80%;
}
#ExternalTrainingModal input[type="checkbox"],
#ExternalTrainingModal input[type="radio"] {
  width: 13px;
  height: 13px;
  padding: 0;
  margin: 0 5px 0px;
  vertical-align: bottom;
  position: relative;
  top: -5px;
  *overflow: hidden;
}
/*Learner Notes*/

.modal-footer.learner-note {
  border: none !important;
}
.modal .wysihtml5-toolbar li {
  list-style-type: none !important;
}
.learner-note .fa-sticky-note {
  font-size: 1.2em;
}
.panel-body.badges img {
  width: 75px;
}
/* BADGES*/

.badge-criteria img {
  width: 75px;
}
.badge-panel {
  border: solid 1px #dddddd;
  padding: 0px !important;
  margin: 10px 3.7% 20px 3.7%;
}
.badge-panel .panel-heading {
  background-color: whitesmoke;
}
.badge-panel .media img {
  max-height: 90px !important;
  max-width: 100%;
}
.badge-panel .media {
  margin: 10px 0px 20px 0px;
}
.row-eq-height {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}
/* center forms*/

fieldset.col-md-8 {
  margin-left: 16%;
}
/*catalogue search*/

.search_container.catalogue,
.search_container.media {
  border: solid 1px #cccccc;
  display: inline-block;
  padding: 3px 5px;
  background-color: white;
  margin: 0px 0px 10px 0px;
  border-radius: 4px;
  width: 100%;
}
.search_container.catalogue button,
.search_container.media button {
  cursor: pointer;
  float: right;
  background-color: transparent;
  border: none 0px;
  border-collapse: collapse;
}
.search_container.catalogue input,
.search_container.media input {
  border: none 0px;
  margin: 0px 0px 0px 5px;
  color: #999999;
  width: 85%;
}
.search_container.catalogue input:focus,
.search_container.media input:focus {
  outline: none;
}
.media-container .back,
.media-container .next {
  cursor: pointer;
}
.media-container .fa.fa-file-word-o,
.media-container .fa-file-powerpoint {
  font-size: 125pt;
  margin-top: 20px;
  color: black;
}
#catalogueResults .highlight {
  background-color: yellow;
}
.media-filter-type .type-count {
  margin-left: 5px;
}
.panel-default.search .radio-inline input {
  width: auto !important;
  margin: 0px 0px 0px -20px !important;
}
.SupervisorView .filter-container ul {
  list-style-type: none;
  margin: 0px;
  padding: 0px;
}
*[data-file] img,
*[data-file] video {
  max-width: 300px;
}
.SupervisorView td.activity-type::first-letter {
  text-transform: uppercase;
}
/* course details ratings */

#catalogueResults .course-rating {
  margin-left: 8px;
}
#catalogueResults .course-rating[data-rating="0"],
#catalogueResults .course-rating[data-rating="undefined"] {
  display: none;
  visibility: hidden;
}
.page-header .course-rating .fa-star,
.page-header .course-rating .fa-star-half,
#catalogueResults .course-rating .fa-star,
#catalogueResults .course-rating .fa-star-half {
  font-size: 1.2em;
  color: #f5b507;
  margin: 0px 5px 0px 0px;
}
#catalogueResults .course-rating .fa-star,
#catalogueResults .course-rating .fa-star-half {
  margin: 0px 0px 0px 0px;
}
#catalogueResults .course-title {
  display: inline-block;
}
/* Added as per Isobel's request*/

#catalogueResults .tc-btn-group .btn {
  margin-bottom: 5px;
}
#MyForums li.page-item {
  cursor: pointer;
}
@media only screen and (min-device-width: 320px) and (max-device-width: 480px) {
  /* Styles */
  
  body.ForgotPassword.modal {
    font-size: 1em;
  }
  body.ForgotPassword fieldset > legend,
  body.ForgotPasswordfieldset > legend h1 {
    border: none;
  }
  body.ForgotPassword.modal p,
  body.ForgotPassword.modal h1,
  body.ForgotPassword.modal h2,
  body.ForgotPassword.modal {
    background-image: none;
    background-color: white;
    color: black;
    font-family: Arial, Helvetica, sans-serif;
  }
  body.ForgotPassword legend {
    display: none;
  }
  .label {
    width: 100% !important;
    font-size: 1em;
    font-weight: bold;
  }
  input[type="text"] {
    width: 100% !important;
  }
  .button_container {
    text-align: center;
  }
}
/*** credit categories*/

.cc-name {
  cursor: pointer;
  text-decoration: underline;
}
#catalogue_details .cc-name {
  cursor: default;
  text-decoration: none;
}
.cc-name:hover {
  text-decoration: none;
}
.credit-details .label {
  font-weight: bold;
  display: block;
}
.credit-details .modal-body div {
  margin-bottom: 5px;
}
.panel.objective-credits {
  padding: 0px 10px 10px 20px;
}
.panel.objective-credits label {
  font-weight: bold;
}
/* custom spinner */

.tc.tc-cog {
  font: normal normal normal 14px/1 FontAwesome;
  display: inline-block;
}
.tc.tc-cog:before {
  content: "\f013";
}
.tc-spinner {
  -webkit-animation: tc-spin 2s infinite linear;
  animation: tc-spin 2s infinite linear;
}
@-webkit-keyframes tc-spin {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(359deg);
    transform: rotate(359deg);
  }
}
@keyframes tc-spin {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(359deg);
    transform: rotate(359deg);
  }
}
/*HTML Editor Media display*/

.fr-wrapper .thumb.placeholder {
  display: none;
}
.vid-inline {
  max-width: 80%;
}
.audio-inline {
  display: block;
  margin: 5px 5px 10px 5px;
}
.word-inline:before {
  content: "\f1c2";
  margin: 0px 5px 0px 5px;
}
.ppt-inline:before {
  content: "\f1c4";
  margin: 0px 5px 0px 5px;
}
.pdf-inline:before {
  content: "\f1c1";
  margin: 0px 5px 0px 5px;
}
.excel-inline:before {
  content: "\f1c3";
  margin: 0px 5px 0px 5px;
}
.btn-group.obj-fb {
  position: absolute;
  bottom: 10px;
}
.credit-claiming label {
  width: auto !important;
}
/* hide the extra button for enrolled lp's*/

button[data-status="Active"][data-coursetype="learning path"] {
  display: none;
}
button[data-status="Completed"][data-coursetype="learning path"] {
  display: none;
}
#mycourse .activity-overview .activity_summary_info > .row > .credits {
  display: block;
  visibility: visible;
}
/* zen desk on help */

iframe#launcher {
  z-index: 100 !important;
}
/* sales force widget */

button.sf.widget {
  position: fixed;
  z-index: 100;
  display: block;
  bottom: 20px;
  right: 20px;
}
/* invalid text input */

input:invalid {
  color: red;
}
/* Feedback css */

.subQuestion {
  display: inline-block;
}
.feedbackControl {
  z-index: 1;
}
/* Adjust css as per Accessibility requirements */

.pagination > .disabled > a,
.pagination > .disabled > a:hover {
  color: black !important;
}
#searchHeading {
  font-size: 1.75rem;
  margin: 0px;
}
.missed-question h3 {
  color: red;
}
/* Adjust Button css*/

.button_container {
  margin-bottom: 40px;
}
/*#Tile-AgendaTile td.date{
                    min-width:200px;
                 }
#Tile-AgendaTile td.title {
    min-width: 220px;
}*/

#Tile-AgendaTile td.actions {
  padding: 4px;
}
#Tile-AgendaTile td.actions .btn {
  margin-right: 5px;
}
span.course-badge {
  height: 100%;
}
img.course-badge {
  height: 50px;
}
.activity_calendar_modal .modal-dialog {
  width: 800px;
}
.panel.activity[data-status="completed"] .btn.transfer {
  display: none;
}
.choices .radio {
  width: 100%;
  display: block;
  float: left;
  clear: both;
}
.choices .subQuestion {
  display: block;
  float: left;
  clear: both;
}
.SupervisorView .filter-container .panel-body {
  max-height: 250px;
  min-height: 180px;
  overflow-y: auto;
}
.panel-heading label {
  width: 100%;
}
.modal .dixa-messenger-namespace {
  display: none !important;
}
.modal-open .dixa-messenger-namespace {
  display: none !important;
}
a.btn.recommendations {
  margin-left: 20px;
}
.media-container .media .panel:nth-child(odd) {
  margin-right: 10px;
}
.media-container .media .panel button i {
  margin-left: 5px;
}
.media-container .media-filter-type {
  list-style: none;
  margin-left: 0px;
  padding-left: 0px;
}
.media-filter-type input {
  margin-right: 5px;
}
@page {
  margin: 0cm;
  size: A4 landscape;
}
@media print {
  #GOSHButton {
    display: none;
  }
  body.Transcripts #content.container {
    margin: 0px 5px 0px 5px;
    width: 100%;
  }
  html body.Transcripts #content.container {
    font-size: 12pt;
  }
  body.Transcript #content.container {
    margin: 0px 5px 0px 5px;
    width: 100%;
  }
  html body.Transcript #content.container {
    font-size: 1.2em;
  }
}
:root {
  /* Typography */
  --font-scale: 1;
  /* #97802: font size selector multiplies all learner-view font sizes by this */
  --typography-font-family: 'Arial', 'sans-serif';
  --typography-headers-font-family: 'Arial', 'sans-serif';
  --typography-size: 10pt;
  --typography-h1: #27004c;
  --typography-h2: #27004c;
  --typography-h3: #333333;
  --typography-links-color: #5900c1;
  --typography-link-weight: normal;
  /* Body */
  --body-background-colour: white;
  --body-login-background-image: https://partner-schools.english.britishcouncil.org/FormatResource.ashx/programLearnerView_62a4499f-0607-4987-b864-4082d77e341d/loginBackground.gif;
  /* Masthead */
  --masthead-background-colour: #5900c1;
  --masthead-current-role-tab-text-color: #4e4e4e;
  --masthead-current-role-tab-background-color: white;
  --masthead-border-color: #5900c1;
  --masthead-menu-item-text-color: #333333;
  --masthead-menu-item-background-color: white;
  --masthead-menu-item-active-text-color: #333333;
  --masthead-menu-item-active-background-color: #f0f3f5;
  /* Content */
  --content-background-color: white;
  --content-border-color: white;
  /* Buttons */
  --button-text-color: white;
  --button-background-color: #5900c1;
  --button-hover-text-color: white;
  --button-hover-background-color: #27004c;
  /* Forms */
  --forms-legend-text-color: #333333;
  --forms-legend-background-color: white;
  --forms-fieldset-border-color: #f0f3f5;
  /* Tables */
  --table-header-row-background-color: #5900c1;
  --table-header-text-color: white;
  --table-row-subheader-1-background-color: #cccccc;
  --table-row-subheader-1-text-color: white;
  --table-row-subheader-2-background-color: white;
  --table-row-subheader-2-text-color: #003366;
  --table-row-subheader-3-background-color: #eeeeee;
  --table-row-subheader-3-text-color: #333333;
  --table-row-border-color: #f0f3f5;
  --table-row-0-text-color: #333333;
  --table-row-0-background-color: #f6f9fb;
  --table-row-1-text-color: #333333;
  --table-row-1-background-color: white;
  /* Tabs */
  --tab-background-color: white;
  --tab-text-color: #333333;
  --tab-active-text-color: white;
  --tab-active-background-color: #5900c1;
  /*Supervisors*/
  --logins-text: #b32d6a;
  --logins-bg: rgba(138, 33, 85, 0.2);
  --completions-text: #1c7c46;
  --completions-bg: rgba(39, 104, 69, 0.2);
  --notifications-text: #d6ac00;
  --notifications-bg: rgba(204, 154, 0, 0.2);
  --enrollments-text: #0073a8;
  --enrollments-bg: rgba(0, 104, 140, 0.2);
  /* Footer */
  --footer-background-color: #5900c1;
  --footer-font-color: white;
}
/*************** #97802 font-scale: Bootstrap 3 typography follows the learner font selector ***************/

/* Values mirror js/cdn/bootstrap.min.3.36.css exactly - visually identical at --font-scale: 1 */

html {
  font-size: calc(10px * var(--font-scale, 1));
}
h1,
.h1 {
  font-size: calc(36px * var(--font-scale, 1));
}
h2,
.h2 {
  font-size: calc(30px * var(--font-scale, 1));
}
h3,
.h3 {
  font-size: calc(24px * var(--font-scale, 1));
}
h4,
.h4 {
  font-size: calc(18px * var(--font-scale, 1));
}
h5,
.h5 {
  font-size: calc(14px * var(--font-scale, 1));
}
h6,
.h6 {
  font-size: calc(12px * var(--font-scale, 1));
}
.lead {
  font-size: calc(16px * var(--font-scale, 1));
}
@media (min-width: 768px) {
  .lead {
    font-size: calc(21px * var(--font-scale, 1));
  }
}
.btn {
  font-size: calc(14px * var(--font-scale, 1));
}
.btn-group-xs > .btn,
.btn-xs {
  font-size: calc(12px * var(--font-scale, 1));
}
.btn-group-sm > .btn,
.btn-sm {
  font-size: calc(12px * var(--font-scale, 1));
}
.btn-group-lg > .btn,
.btn-lg {
  font-size: calc(18px * var(--font-scale, 1));
}
.form-control,
.input-group-addon,
output {
  font-size: calc(14px * var(--font-scale, 1));
}
.input-sm,
.input-group-sm > .form-control,
.input-group-sm > .input-group-addon,
.input-group-sm > .input-group-btn > .btn,
.input-group-addon.input-sm,
.form-group-sm .form-control,
.form-group-sm .form-control-static,
.form-horizontal .form-group-sm .control-label {
  font-size: calc(12px * var(--font-scale, 1));
}
.input-lg,
.input-group-lg > .form-control,
.input-group-lg > .input-group-addon,
.input-group-lg > .input-group-btn > .btn,
.input-group-addon.input-lg,
.form-group-lg .form-control,
.form-group-lg .form-control-static,
.form-horizontal .form-group-lg .control-label {
  font-size: calc(18px * var(--font-scale, 1));
}
.dropdown-menu {
  font-size: calc(14px * var(--font-scale, 1));
}
.dropdown-header {
  font-size: calc(12px * var(--font-scale, 1));
}
.badge {
  font-size: calc(12px * var(--font-scale, 1));
}
.tooltip {
  font-size: calc(12px * var(--font-scale, 1));
}
.popover,
.popover-title {
  font-size: calc(14px * var(--font-scale, 1));
}
.panel-title {
  font-size: calc(16px * var(--font-scale, 1));
}
.pagination-sm > li > a,
.pagination-sm > li > span {
  font-size: calc(12px * var(--font-scale, 1));
}
.pagination-lg > li > a,
.pagination-lg > li > span {
  font-size: calc(18px * var(--font-scale, 1));
}
legend,
.close {
  font-size: calc(21px * var(--font-scale, 1));
}
pre {
  font-size: calc(13px * var(--font-scale, 1));
}
blockquote {
  font-size: calc(17.5px * var(--font-scale, 1));
}
.progress-bar {
  font-size: calc(12px * var(--font-scale, 1));
}
/* #97802: let Bootstrap 3 form controls grow with the font instead of clipping it.
   height:auto computes to exactly 34/30/46px at --font-scale: 1 (padding + line-height + border) */

.form-control {
  height: auto;
}
.input-sm,
select.input-sm,
.form-group-sm .form-control,
.form-group-sm select.form-control,
.input-group-sm > .form-control,
.input-group-sm > .input-group-addon,
.input-group-sm > .input-group-btn > .btn,
select.input-group-sm > .form-control,
select.input-group-sm > .input-group-addon,
select.input-group-sm > .input-group-btn > .btn {
  height: auto;
}
.input-lg,
select.input-lg,
.form-group-lg .form-control,
.form-group-lg select.form-control,
.input-group-lg > .form-control,
.input-group-lg > .input-group-addon,
.input-group-lg > .input-group-btn > .btn,
select.input-group-lg > .form-control,
select.input-group-lg > .input-group-addon,
select.input-group-lg > .input-group-btn > .btn {
  height: auto;
}
html {
  height: 100%;
  min-height: 100%;
}
html body {
  height: auto;
  min-height: 100%;
  position: relative;
  background-color: white;
  font-family: 'Arial', 'sans-serif';
  font-size: calc(10pt * var(--font-scale, 1));
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility !important;
}
@media print {
  body {
    font-family: 'Arial', 'sans-serif';
    font-size: calc(10pt * var(--font-scale, 1));
  }
}
@media (min-width: 1200px) {
  body .row {
    margin-left: -15px;
  }
}
/*allows the survey to scroll within a modal */

html[data-pagename="SurveyFeedback"],
html[data-pagename="PreviewFeedback"] {
  overflow: scroll;
}
/*Allows the disclaimer to scroll*/

body.modal.Disclaimer {
  overflow-y: auto;
}
html body .modal {
  display: none;
}
html body .modal.in {
  display: inline-block;
}
/*not sure why we are using 2 different data names*/

html[data-pagename="design questionnaire"] {
  overflow: scroll;
}
html body.Login {
  background-image: url('https://partner-schools.english.britishcouncil.org/FormatResource.ashx/programLearnerView_62a4499f-0607-4987-b864-4082d77e341d/loginBackground.gif');
}
html body.fit_bg_to_page {
  background-size: cover;
  background-attachment: fixed;
  background-position: center center;
}
body.popup {
  padding-top: 15px;
  padding-bottom: 15px;
}
/*Log in bar*/

#masthead #login_info {
  background-color: white;
  color: #4e4e4e;
}
#log_in_bar.container {
  background-color: white;
  color: #4e4e4e;
}
#log_in_bar .login_in_bar_loginlinks_container {
  display: flex;
  justify-content: flex-end;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
}
/*Masthead*/

#masthead {
  background-color: #5900c1;
  border-bottom: solid 1px #5900c1;
  padding: 15px;
}
#masthead #logo {
  margin: 10px 0px;
}
.visible-print-inline-block.visible-inline-block {
  display: inline-block !important;
}
#masthead #login_info {
  width: auto;
  font-size: 0.9em;
  margin-top: 0.25em;
  color: #4e4e4e;
  background-color: white;
}
#masthead .keep_right #login_info {
  float: right;
  margin: 0px;
}
/*#masthead .keep_right #login_info #languageSelection .form-control {padding:7px 12px 6px 12px;}*/

#masthead .keep_right #search {
  clear: none;
  margin: 0px 0px 0px 10px;
}
#masthead .keep_right #search .search_container {
  margin: 0px;
  padding: 5px 12px 5px 12px;
}
#masthead #login_info .btn-group.profile-menu {
  margin: 0px 0px 0px 15px;
}
#masthead #login_info .btn-group.profile-menu .dropdown-header,
#masthead #login_info .btn-group.profile-menu li.dropdown-header .timezone {
  color: black;
}
#masthead #login_info .label.sr-only {
  display: none;
}
#masthead #login_info img.profile {
  float: right;
  margin-left: 5px;
  object-fit: cover;
}
#masthead #login_info .loggedinas img.profile {
  height: 35px !important;
  padding: 0px;
  border: none 0px;
}
#masthead #login_info > div > .loggedinas {
  margin-right: 0.5em;
}
#masthead #login_info > div > .username {
  margin-right: 1em;
}
#masthead #login_info > div > input#Password,
#log_in_bar input#Password {
  width: 100px !important;
}
#masthead #login_info span.separator,
#log_in_bar span.separator {
  margin: 0px 5px;
  color: #4e4e4e;
}
#masthead #login_info span.language_selector {
  text-transform: uppercase;
}
#log_in_bar #languageSelection,
.profile-menu #languageSelection {
  margin: 0 0 0 0.5em;
}
#masthead #login_info #languageSelection .form-control {
  height: auto;
  padding: 6px 12px;
}
#masthead #login_info .notloggedin .form-control {
  width: auto;
}
#masthead #login_info .notloggedin > *,
#log_in_bar .notloggedin > * {
  float: right !important;
  margin-left: 1em;
  margin-right: 0;
}
#masthead #log_in_bar a.home,
#login_info a.home,
#log_in_bar a.home {
  font-size: 2em;
  display: inline-block;
  padding: 2px 0px;
}
#log_in_bar .form-control {
  width: auto;
}
#log_in_bar .row > div > div.profile-menu {
  margin-right: 0;
}
#log_in_bar .row > div > div.profile-menu > * {
  float: right !important;
}
.profile-menu .dropdown-menu {
  min-width: 210px;
  font-size: 0.9em;
}
#log_in_bar .row > div > div.profile-menu > .profile-dropdown {
  float: right;
  margin-left: 15px;
}
#masthead #cart_icon {
  font-size: 2em;
  display: inline-block;
  position: relative;
  margin-right: 15px;
}
#masthead #cart_icon #cart_count {
  background-color: #e17a27;
  border-radius: 50%;
  width: 17px;
  height: 17px;
  display: inline-block;
  text-align: center;
  font-size: calc(12px * var(--font-scale, 1));
  line-height: 1.4167;
  position: absolute;
  top: -7px;
  left: 12px;
  color: white;
  background-color: #5900c1;
}
#masthead #cart_icon .svg-inline--fa {
  font-size: calc(24px * var(--font-scale, 1));
}
#masthead .profile_links #inbox_unread.badge {
  color: white;
  background-color: #5900c1;
  margin: -1em 0px 0px 3px;
  font-size: 0.8em;
}
#masthead #inbox_unread_menu.badge {
  color: white;
  background-color: #5900c1;
  margin-left: 7px;
  font-size: 0.8em;
}
#masthead #inbox_unread_menu.badge:empty {
  display: none;
}
#masthead .profile-inbox {
  margin-left: 10px;
}
.modal.purchase-alert .purchase-item {
  display: inline-block;
  width: 100%;
  margin: 15px 0px;
}
.modal.purchase-alert .purchase-item .marquee_wrap {
  margin-right: 15px;
  border: solid 1px #f6f6f6;
  float: left;
  min-height: 3em;
}
.modal.purchase-alert .purchase-item .purchase-title {
  font-weight: bold;
}
#masthead #login_info .profile_links > ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  align-items: center;
  align-content: stretch;
}
.profile-menu .caret {
  margin: 0 0 4px 6px;
}
.profile-menu li {
  text-align: left;
}
.profile-menu li.dropdown-header {
  text-transform: uppercase;
  font-size: 1em;
  min-height: 40px;
  color: black;
}
.profile-menu li img.profile,
#log_in_bar .profile-menu li img.profile {
  float: right;
  margin: 0 0.5em 0.5em 0;
  position: relative;
  top: auto;
  right: auto;
}
.profile-menu li .timezone {
  font-size: 1em;
}
.profile-menu li .fa,
.profile-menu li svg {
  margin-right: 10px;
  width: 15px;
  height: 15px;
  text-align: center;
}
.profile-menu li a {
  font-size: 1.1em;
}
#masthead #search {
  margin: 10px 0px;
  clear: right;
}
#masthead #search span.search_container,
#footer #search_tile span.search_container {
  border: solid 1px #cccccc;
  display: inline-block;
  padding: 3px 5px;
  background-color: white;
}
#masthead #search span.search_container button,
#masthead #search span.search_container span,
#footer #search_tile span.search_container span {
  cursor: pointer;
  cursor: hand;
  float: right;
  background-color: transparent;
  border: none 0px;
  border-collapse: collapse;
}
#masthead #search span.search_container input,
#footer #search_tile span.search_container input {
  border: none 0px;
  margin: 0px 0px 0px 5px;
  color: #999999;
  width: 160px;
}
#masthead #search span.search_container input:focus,
#footer #search_tile span.search_container input:focus {
  outline: none;
}
#footer #search_tile span.search_container input {
  width: 120px;
}
#masthead #search span.search_container,
#footer #search_tile span.search_container {
  border-radius: 4px;
  margin-top: 1em;
  padding: 6px 12px;
}
.sidebar-nav {
  padding: 9px 0;
}
.dropdown-menu {
  font-size: 1em;
}
.dropdown-menu .sub-menu {
  left: 100%;
  position: absolute;
  top: 0;
  visibility: hidden;
  margin-top: -1px;
}
.dropdown-menu li:hover .sub-menu {
  visibility: visible;
}
.dropdown > .dropdown-menu {
  display: none;
}
.dropdown:hover > .dropdown-menu {
  display: block;
}
.nav-tabs .dropdown-menu,
.nav-pills .dropdown-menu,
.nav .dropdown-menu {
  margin-top: 0;
}
.nav .sub-menu:before {
  border-bottom: 7px solid transparent;
  border-left: none;
  border-right: 7px solid rgba(0, 0, 0, 0.2);
  border-top: 7px solid transparent;
  left: -7px;
  top: 10px;
}
.nav .sub-menu:after {
  border-top: 6px solid transparent;
  border-left: none;
  border-right: 6px solid white;
  border-bottom: 6px solid transparent;
  left: 10px;
  top: 11px;
  left: -6px;
}
.navbar-default .navbar-nav > li > a {
  text-decoration: none;
}
.navbar-nav > li > .dropdown-menu {
  z-index: 1030;
}
.navbar-static-top {
  border-width: 0px;
  z-index: 99;
}
body > #viewCourseModal {
  background-color: white;
}
.dropdown-submenu {
  position: relative;
}
.dropdown-submenu > .dropdown-menu {
  top: 0;
  left: 100%;
  display: none !important;
  margin-top: -6px;
  margin-left: -1px;
  -webkit-border-radius: 0 6px 6px 6px;
  -moz-border-radius: 0 6px 6px;
  border-radius: 0 6px 6px 6px;
}
.dropdown-submenu:hover > .dropdown-menu {
  display: block !important;
}
.dropdown-submenu > a:after {
  display: block;
  content: " ";
  float: right;
  width: 0;
  height: 0;
  border-color: transparent;
  border-style: solid;
  border-width: 5px 0 5px 5px;
  border-left-color: #cccccc;
  margin-top: 5px;
  margin-right: -10px;
}
.dropdown-submenu:hover > a:after {
  border-left-color: white;
}
.dropdown-submenu.pull-left {
  float: none;
}
.dropdown-submenu.pull-left > .dropdown-menu {
  left: -100%;
  margin-left: 10px;
  -webkit-border-radius: 6px 0 6px 6px;
  -moz-border-radius: 6px 0 6px 6px;
  border-radius: 6px 0 6px 6px;
}
#masthead #main_menu_bar,
#masthead #main_menu_bar .navbar-default {
  background-color: white;
  border-color: #5900c1;
  margin-bottom: 0px;
}
#masthead #main_menu_bar .navbar-default {
  z-index: 1;
}
#masthead #main_menu_bar .navbar-default > .container {
  display: flex;
  align-content: stretch;
  align-items: flex-start;
}
#masthead .masthead_menu #main_menu_bar .navbar-default .container {
  width: auto;
  padding: 0px;
}
#masthead .masthead_menu #main_menu_bar .navbar-default > .container > .navbar-header,
#masthead .masthead_menu #main_menu_bar .navbar-default > .container > .navbar-collapse {
  float: left;
}
#masthead .masthead_menu #login_info,
#masthead .masthead_menu #search,
#masthead .masthead_menu #main_menu_bar {
  float: right;
  margin: 0px;
  clear: none;
}
#masthead .masthead_menu #search span.search_container {
  margin-top: 0px;
}
#masthead .masthead_menu #login_info .btn-group.profile-menu {
  margin: 0px;
}
/*#masthead .masthead_menu #login_info .btn-group.profile-menu .profile-dropdown,
    #masthead #login_info .btn-group.profile-menu .profile-dropdown,
    #masthead #login_info .btn-group.profile-menu .profile-inbox {
        margin-left: 10px;
    }*/

#masthead #login_info .btn-group.profile-menu .profile-inbox #inbox_unread {
  margin-left: 5px;
}
#masthead .masthead_menu #login_info .btn-group.profile-menu #languageSelection,
#masthead #login_info #languageSelection {
  margin: 0px;
}
#masthead .masthead_menu #login_info .btn-group.profile-menu #languageSelection .form-control,
#masthead #login_info #languageSelection .form-control {
  padding: 8px 12px;
}
#masthead .masthead_menu #login_info a.home {
  display: none;
}
#masthead > .row.menu + .row.breadcrumbs #breadcrumbs > .breadcrumb {
  border-radius: 0px;
  margin-bottom: 0px;
}
#masthead #login_info img.profile,
#log_in_bar img.profile {
  height: 40px !important;
}
#login_info .profile_links ul,
#log_in_bar .profile_links ul {
  display: inline-block;
  margin: 0px;
  padding: 0px;
}
#login_info .profile_links ul li,
#log_in_bar .profile_links ul li {
  display: inline-block;
  float: left;
  margin: 0px;
  padding: 0px 10px 0px 0px;
}
#login_info .profile_links ul li .fa,
#log_in_bar .profile_links ul li .fa,
#login_info .profile_links ul li .svg-inline--fa,
#log_in_bar .profile_links ul li .svg-inline--fa,
#masthead #login_info .dropdown-menu > li > a .svg-inline--fa,
#masthead #login_info .dropdown-menu > li > a svg {
  margin-right: 3px;
  width: 20px;
}
#login_info .profile_links ul li > a,
#log_in_bar .profile_links ul li > a,
#masthead #login_info .dropdown-menu > li > a {
  display: flex;
  align-items: center;
}
#login_info .login_details > span + span,
#log_in_bar .login_details > span + span {
  margin-left: 0.025em;
  line-height: calc(40px * var(--font-scale, 1));
}
#masthead #main_menu_bar .navbar-default .navbar-nav > li > a,
#masthead #main_menu_bar .navbar > .container .home.navbar-brand {
  color: #333333;
  background-color: white;
}
#masthead #main_menu_bar .navbar-default .navbar-brand {
  color: #333333;
}
#masthead #main_menu_bar .navbar-default .navbar-nav > .active > a,
#masthead #main_menu_bar .dropdown-menu > .active > a {
  color: #333333;
  background-color: #f0f3f5;
}
#masthead #main_menu_bar .navbar-default .navbar-nav > li > a:hover,
#masthead #main_menu_bar .navbar-default .navbar-nav > li > a:focus,
#masthead #main_menu_bar .navbar > .container .home.navbar-brand:hover,
#masthead #main_menu_bar .navbar > .container .home.navbar-brand:focus,
#masthead #main_menu_bar .dropdown-menu > .active > a:focus,
#masthead #main_menu_bar .dropdown-menu > .active > a:hover {
  color: #333333;
  background-color: #f0f3f5;
}
#masthead #main_menu_bar .navbar-default .navbar-nav > li.separator {
  color: white;
}
@media print {
  #masthead.container,
  #masthead.container .row:first-child,
  #masthead.container .row:first-child > div,
  #masthead.container .row:first-child > div #logo,
  #masthead.container .row:first-child > div #logo a.pageLogo {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    clear: both;
  }
  #masthead #logo > a.pageLogo[href]:after {
    content: none !important;
  }
  #masthead.container .row:first-child > div #logo a.pageLogo img {
    display: inline-block !important;
    visibility: visible !important;
    width: auto !important;
    height: 60px !important;
    clear: both;
    filter: invert(0%);
  }
}
/*Footer*/

#footer {
  /*position:absolute; bottom:0px; width:100%!important;*/
  margin-left: auto;
  margin-right: auto;
  background-color: #5900c1;
}
#footer.container {
  padding: 1em 15px;
}
#footer.container .copyright {
  line-height: calc(35px * var(--font-scale, 1));
}
#footer.container .tile {
  min-height: 80px;
}
#footer.container address {
  white-space: pre-line;
  display: inline-block;
}
#footer.container #contact_us_tile .glyphicon,
#footer.container #contact_us_tile .svg-inline--fa {
  margin: 2px 5px 0px 0px;
  float: left;
  width: 16px;
}
#footer.container #follow_us_tile.tile > div > a {
  margin: 0px 5px 5px 0px;
  display: inline-block;
}
#footer.container #follow_us_tile.tile > div > a img {
  max-width: 60px;
}
@media print {
  #footer.container .copyright {
    text-align: right;
  }
}
/*Content*/

.text-center {
  text-align: center;
}
body.Home > #content.container {
  padding: 0px 15px 20px 15px;
  background-color: white;
  border-color: white;
}
body > #content.container {
  padding: 0px 15px 15px 15px;
  background-color: white;
  border-color: white;
}
/*Defaults*/

/*h1 {font-size:1.5em; line-height:1.4em; font-weight:600; color:@Headings-h1;}
h2 {font-size:1.25em; line-height:1.4em; font-weight:600; color:@Headings-h2;}
h3 {font-size:1em; line-height:1.4em; font-weight:600; color:@Headings-h3; margin:0px;}
h3.link {cursor:pointer;  text-decoration:underline;}
h3.link:hover {cursor:pointer;  text-decoration:none;}
h4 {font-size:1em; line-height:1.5em; font-weight:600;}*/

body h1 {
  font-size: 2em;
  line-height: 1.4em;
  font-weight: 400;
  color: #27004c;
}
body h2 {
  font-size: 1.8em;
  line-height: 1.4em;
  font-weight: 400;
  color: #27004c;
}
body h3 {
  font-size: 1.5em;
  line-height: 1.4em;
  font-weight: 400;
  color: #333333;
  margin: 0px;
}
body h3.link {
  cursor: pointer;
  cursor: hand;
  text-decoration: underline;
}
body h3.link:hover {
  cursor: pointer;
  cursor: hand;
  text-decoration: none;
}
body table h3,
body table thead > tr > th {
  font-size: 1.1em;
  font-weight: 600;
}
body h4 {
  font-size: 1.2em;
  line-height: 1.5em;
  font-weight: 600;
}
body h5 {
  font-size: 1.1em;
  line-height: 1.2em;
  font-weight: 600;
}
body h6 {
  font-size: 1em;
  line-height: 1.2em;
  font-weight: 600;
}
a {
  color: #5900c1;
  font-weight: normal;
}
.breadcrumb li > span {
  font-size: 0.8em;
  line-height: 1.1em;
  text-decoration: none;
}
.breadcrumb > li * {
  margin: 0px;
  display: inline;
}
#content.container > .page-header h1 {
  font-size: 3em;
}
#content.container > .page-header h1 small {
  font-size: 0.3em;
  display: block;
  margin: 5px 0px 0px 0px;
}
body > #content.container p {
  margin-bottom: 1em;
}
ul.list-unstyled {
  margin: 1em;
}
ul.long_content li,
.description_links ul li,
ul.list-unstyled li {
  list-style-type: disc;
  display: list-item;
  margin-left: 15px;
}
img.no-image {
  display: none !important;
}
.img-64x64 {
  max-width: 64px;
  max-height: 64px;
}
span.padded {
  padding: 1em;
  display: inline-block;
}
.nowrap {
  white-space: nowrap;
}
th {
  font-weight: bold;
}
h3 > .glyphicon {
  margin-right: 0.25em;
  font-size: 0.75em;
}
/*Carousel/Slideshow*/

#myCarousel,
.carousel-inner > .item {
  max-height: 300px;
}
.carousel-inner > .item > img,
.carousel-inner > .item > a > img {
  width: 100%;
}
.carousel.slide.subobjective {
  min-height: 300px;
  height: auto;
}
.carousel-indicators {
  bottom: 0px;
}
.carousel-caption {
  bottom: 0px;
  width: 100%;
  left: 0px;
  right: 0px;
  background-color: rgba(0, 0, 0, 0.5);
}
.carousel-caption > h1 {
  color: white;
}
.carousel-caption > div {
  margin: 0 20px;
}
.carousel-caption > div > a {
  color: white;
}
/*Tabs*/

.nav-tabs:empty {
  border: none 0px;
}
.tab-content {
  padding: 15px;
}
#tabs {
  margin-bottom: 1em;
}
#tabs li.term,
#tabs li.noterm {
  width: 42px;
}
#tabs li.noterm a {
  text-decoration: none;
  color: #dddddd;
}
.tab-content .glossary li {
  margin-bottom: 15px;
  clear: both;
}
.tab-content .definition {
  display: inline-block;
  width: 100%;
}
#Courses .img-thumbnail,
#Category_Matches .img-thumbnail {
  float: left;
  margin: 0px 5px 5px 0px;
  max-width: 250px;
}
#Courses .img-thumbnail.zooms {
  cursor: pointer;
}
.zoomed_image {
  float: left;
  padding: 4px;
  margin: 0px 5px 5px 0px;
  max-width: auto;
  line-height: 1.428571429;
  background-color: white;
  border: 1px solid #dddddd;
  border-radius: 4px;
  -webkit-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}
.zoomed_image > img {
  max-width: 250px;
}
.thumbnail.bottom-space {
  margin: 0px 15px 15px 0px;
}
/*Tabs*/

.nav-tabs {
  border-color: #5900c1;
}
.nav-tabs > li > a {
  text-decoration: none;
  background-color: white;
  color: #333333;
  border-bottom: solid 1px #5900c1;
}
.nav-tabs > li > a:hover,
.nav-tabs > li > a:active,
.nav-tabs > li > a:focus {
  background-color: #5900c1;
  color: white;
  border-bottom: solid 1px #5900c1;
}
.nav-tabs > li.active > a,
.nav-tabs > li.active > a:hover,
.nav-tabs > li.active > a:focus,
.nav-tabs > li > a.active,
.nav-tabs > li > a.active:hover,
.nav-tabs > li > a.active:focus {
  background-color: #5900c1;
  color: white;
  border-bottom: solid 1px #5900c1;
}
.nav-tabs > li.disabled > span {
  text-decoration: none;
  background-color: white;
  color: #333333;
  border-bottom: solid 1px #5900c1;
  opacity: 0.3;
  margin-right: 2px;
  line-height: 1.42857143;
  border: 1px solid transparent;
  border-radius: 4px 4px 0 0;
  position: relative;
  display: block;
  padding: 10px 15px;
}
.nav-tabs > li > a .badge {
  margin-left: 0.25em;
}
.nav.nav-tabs.lp li span.glyphicon {
  margin-left: 0.5em;
}
/*Navbars (not main meu)*/

nav.navbar-default {
  border-color: white;
  background-color: white;
  color: #333333;
}
.navbar-default .navbar-brand,
.navbar-default .navbar-text.title {
  color: #333333;
  font-size: 1.1em;
  font-weight: bold;
}
.navbar-default .navbar-nav > .active > a,
.navbar-default .navbar-nav > .active > a:focus,
.navbar-default .navbar-nav > .active > a:hover,
.navbar-default .navbar-nav > li > a:focus,
.navbar-default .navbar-nav > li > a:hover,
#SupervisorView .dropdown:hover > .dropdown-menu li a .badge.count,
#SupervisorView .badge.count {
  background-color: #5900c1;
  color: white;
}
nav.navbar-default .navbar-nav > li > a {
  text-decoration: none;
  background-color: white;
  color: #333333;
}
nav.navbar-default #filter_by_options .dropdown-menu {
  min-width: 240px;
}
nav.navbar-default #sort_by_options .dropdown-menu > li > span,
nav.navbar-default #filter_by_options .dropdown-menu > li > span {
  cursor: pointer;
  cursor: hand;
  float: left;
  display: inline-block;
  width: 100%;
  padding: 5px;
  font-size: 0.9em;
}
nav.navbar-default #sort_by_options .dropdown-menu > li > span.sort .fa-check-circle,
nav.navbar-default #filter_by_options .dropdown-menu > li > span.show .fa-check-circle {
  display: inline-block;
}
nav.navbar-default #sort_by_options .dropdown-menu > li > span.sort .fa-circle-o,
nav.navbar-default #filter_by_options .dropdown-menu > li > span.show .fa-circle-o {
  display: none;
}
nav.navbar-default #sort_by_options .dropdown-menu > li > span .fa-check-circle,
nav.navbar-default #filter_by_options .dropdown-menu > li > span .fa-check-circle {
  display: none;
}
nav.navbar-default #sort_by_options .dropdown-menu > li > span .fa-circle-o,
nav.navbar-default #filter_by_options .dropdown-menu > li > span .fa-circle-o {
  display: inline-block;
}
nav.navbar-default #sort_by_options .dropdown-menu > li > span .svg-inline--fa,
nav.navbar-default #filter_by_options .dropdown-menu > li > span .svg-inline--fa {
  margin: 0 0.25em 0 1em;
}
/*#tabs span.tab {margin-right:2px; line-height:1.428571429; border:1px solid transparent; border-radius:4px 4px 0 0;}
#tabs span.tab span {position:relative; display:inline-block; padding:10px 15px;}
#tabs span.tab span.left_corner, #tabs span.tab span.right_corner {display:none;}*/

/*Alerts*/

.alert.alert-cookie {
  background-color: black;
  background-color: rgba(0, 0, 0, 0.8);
  border-radius: 0px;
  color: white;
  padding: 15px 0px;
}
.alert.alert-cookie h2 {
  color: white;
}
.alert.alert-cookie .close {
  color: white;
  opacity: 1;
  filter: alpha(opacity=100);
  top: auto;
  right: auto;
  float: right;
  margin-top: 15px;
}
.alert.alert-cookie .button_container {
  margin: 0px 0px 15px 0px;
}
.alert.alert-cookie .more-cookie-info {
  margin: 0px 0px 0px 15px;
}
.alert:empty,
.alert.alert-danger:empty {
  display: none;
}
.alert-danger,
.alert-warning {
  display: block;
}
/*Fortumo Offer*/

.alert-offer {
  background-color: transparent;
  border: solid 1px #eeeeee;
}
/*Panels*/

.panel {
  position: relative;
}
.panel-primary {
  border-color: #f0f3f5;
}
.panel-primary > .panel-heading {
  background-color: #5900c1;
  border-color: #f0f3f5;
  color: white;
}
.panel-default > .panel-heading {
  background-color: white;
  border-color: #f0f3f5;
  color: #003366;
}
.panel-default > .panel-content,
.panel-default > .panel-body,
.panel-default > .panel-body:hover {
  background-color: white;
  border-color: #f0f3f5;
  color: #333333;
}
.floating_children {
  display: inline-block;
  width: 100%;
}
.overview {
  margin-bottom: 1em;
}
.overview ul,
.description ol {
  overflow: hidden;
}
.overview ul > li,
.description ul > li {
  display: list-item;
  list-style-type: disc;
  margin-left: 18px;
}
.overview ol > li,
.description ol > li {
  display: list-item;
  list-style-type: decimal;
  margin-left: 18px;
}
/*.type {font-size:0.8em; text-transform:uppercase;}*/

.panel .type {
  width: auto;
  font-size: calc(12px * var(--font-scale, 1));
  font-weight: 700;
  color: #bbbbbb;
  text-transform: uppercase;
}
/*.panel .panel-body:hover {background-color:#FDFDF8;}*/

.panel-default {
  padding-left: 0px;
  padding-right: 0px;
}
/*Cards*/

.card .card-body {
  padding: 15px;
}
@media (min-width: 768px) {
  #catalogue .col-sm-6:nth-child(2n+1) {
    clear: left;
  }
  #catalogue .col-md-4:nth-child(3n+1) {
    clear: none;
  }
  #catalogue .col-lg-3:nth-child(4n+1) {
    clear: none;
  }
}
@media (min-width: 992px) {
  #catalogue .col-md-4:nth-child(3n+1) {
    clear: left;
  }
  #catalogue .col-lg-3:nth-child(4n+1) {
    clear: none;
  }
  #catalogue .col-sm-6:nth-child(2n+1) {
    clear: none;
  }
}
@media (min-width: 1200px) {
  #catalogue .catalogue-match.col-lg-3:nth-child(4n+1) {
    clear: left;
  }
  #catalogue .catalogue-match.col-md-4:nth-child(3n+2) {
    clear: none;
  }
  #catalogue .catalogue-match.col-sm-6:nth-child(2n+1) {
    clear: none;
  }
}
nav.inline {
  display: inline-block !important;
}
.pagination.left {
  float: left;
}
span.search {
  margin: 20px 0px 20px 0px;
  display: inline-block;
  width: 100%;
}
span.search input {
  width: 100%;
}
.ui-autocomplete {
  width: 200px !important;
  overflow: hidden;
  border-radius: 0px;
}
.ui-autocomplete .ui-menu-item {
  background-color: white;
  color: black;
}
.ui-autocomplete .ui-menu-item a:hover,
.ui-autocomplete .ui-menu-item:hover {
  background-color: white;
}
.ui-menu .ui-menu-item a {
  color: black;
  border-radius: 0px;
  border: 0px;
  cursor: pointer;
}
.custom-combobox-input,
.custom-combobox-input:focus,
.custom-combobox-input:active {
  border-radius: 4px;
  border-color: #cccccc;
  outline: none;
}
.custom-combobox {
  position: relative;
  display: inline-block;
  background: none;
}
.custom-combobox-toggle {
  position: absolute;
  top: 0;
  bottom: 0;
  margin-left: -1px;
  padding: 0;
}
.custom-combobox-input {
  margin: 0;
  padding: 5px 10px;
}
.custom-combobox-input.ui-widget.ui-widget-content.ui-state-default.ui-corner-left.ui-autocomplete-input {
  background: none;
  color: black;
  font-weight: normal;
}
#Category_Matches .nav-tabs > li > a {
  padding: 8px;
}
#Category_Matches .tab-content .col-md-4:nth-child(3n+1) {
  clear: left;
}
#Category_Matches .tab-content .col-md-6:nth-child(2n+1) {
  clear: left;
}
#Category_Matches .panel .img-thumbnail {
  max-width: 328px;
}
#Category_Matches .panel-heading h3 {
  margin-top: 1.5em;
}
#Category_Matches .matched_item_details {
  display: inline-block;
}
#Category_Matches .description_links {
  display: inline-block;
}
#Category_Matches .description_links .description-optional {
  width: auto;
  max-width: 100%;
}
#Category_Matches .description_links > div {
  display: inline-block;
  width: 100%;
}
#Category_Matches img.course-marquee.img-responsive {
  margin: 0px;
  max-width: 350px;
}
#Category_Matches .matched_item_details span,
#Category_Matches .description_links span {
  display: inline-block;
}
#Category_Matches .matched_item_details span.label {
  padding-left: 0px;
}
#Category_Matches .description_links span.label {
  width: 140px;
}
#Category_Matches table {
  margin-top: 1em;
}
#Category_Matches table tr > *:nth-child(2n) {
  max-width: 500px;
}
#Category_Matches table tr > *:nth-child(2n) > div {
  white-space: pre-line;
}
#Category_Matches .nofilters .panel .panel-heading > *,
#Category_Matches .nofilters .panel .panel-body > * {
  width: 100%;
  padding-left: 0px;
  padding-right: 0px;
}
#hasCredits {
  font-size: 1.2em;
  line-height: 2em;
  display: inline-block;
  width: auto;
  clear: right;
}
#LearningActivities #hasCredits {
  clear: none;
  margin-right: 15px;
}
#hasCredits > label {
  float: left;
  width: auto;
  margin: 0px 5px 0px 0px;
}
#hasCredits > span {
  display: inline-block;
}
#catalogueResults > .panel[data-creditstoggle="on"] {
  display: inherit;
  visibility: inherit;
}
#LearningActivities table#MyLearningActivities > tbody > tr[data-creditstoggle="on"],
#LearningActivities table#MyLearningActivities > tbody > tr[data-creditstoggle="on"][show="show"],
#LearningActivities table#MyLearningActivities > tbody > tr[show="show"],
#MyTranscripts table.transcript_table > tbody > tr[data-creditstoggle="on"],
#MyTranscripts table.transcript_table > tbody > tr[data-creditstoggle="on"][show="show"],
#MyTranscripts table.transcript_table > tbody > tr[show="show"] {
  display: table-row !important;
  visibility: inherit;
  width: 100%;
}
#catalogueResults > .panel[data-creditstoggle="off"],
#LearningActivities table#MyLearningActivities > tbody > tr[data-creditstoggle="off"],
#LearningActivities table#MyLearningActivities > tbody > tr[show="hide"],
#LearningActivities table#MyLearningActivities > tbody > tr[data-creditstoggle="off"][show="show"],
#LearningActivities table#MyLearningActivities > tbody > tr[data-creditstoggle="off"][show="hide"],
#MyTranscripts table.transcript_table > tbody > tr[data-creditstoggle="off"],
#MyTranscripts table.transcript_table > tbody > tr[show="hide"],
#MyTranscripts table.transcript_table > tbody > tr[data-creditstoggle="off"][show="show"],
#MyTranscripts table.transcript_table > tbody > tr[data-creditstoggle="off"][show="hide"] {
  display: none !important;
  visibility: hidden;
}
#MyTranscripts table > tbody > tr > .credit-categories .credit-category-name:after {
  content: ": ";
}
#catalogueResults #calendar .fc-col-header,
#catalogueResults #calendar .fc-daygrid-body.fc-daygrid-body-unbalanced,
#catalogueResults #calendar .fc-daygrid-body.fc-daygrid-body-unbalanced table {
  width: 100% !important;
}
#catalogueResults .modal.activity_calendar_modal .modal-header .badge {
  font-size: 0.8em;
  padding: 5px 10px;
  margin: -15px 15px 0px 15px;
  border-radius: 0px 0px 3px 3px;
  background-color: #cccccc;
  color: white;
}
#catalogueResults .modal.activity_calendar_modal .row > div {
  margin-bottom: 15px;
}
#catalogueResults .modal.activity_calendar_modal label {
  font-weight: bold;
  margin: 0px;
  padding: 0px;
  width: 100%;
}
#catalogueResults .modal.activity_calendar_modal .value {
  margin: 0px;
  padding: 0px;
  width: 100%;
}
/* Added as per Isobel's request*/

#catalogueResults .tc-btn-group .btn {
  margin-bottom: 5px;
}
#catalogueResults .panel .description_links .label {
  float: left;
}
#catalogueResults .panel .description_links .value {
  padding: 0px;
}
#catalogueResults .panel .description_links .credit-category .credit-category-name:after {
  content: ":";
}
/* Filter Labels */

.learning-activity-list #filtersPanel:empty {
  display: none;
  visibility: hidden;
}
.learning-activity-list #filtersPanel:empty + .learning-activities {
  width: 100%;
}
#filtersPanel label {
  width: auto;
  word-break: break-word;
}
#filtersPanel #metadataDiv .panel > .panel-body {
  max-height: 360px;
  overflow: auto;
}
/*#filtersPanel #metadataDiv .panel > .panel-body .show_moreless  {max-height:360px; overflow:auto;}*/

#filtersPanel #metadataDiv .panel > .panel-body .show_moreless a[aria-expanded="true"] .show_more,
#filtersPanel #metadataDiv .panel > .panel-body .show_moreless .show_less,
#filtersPanel #metadataDiv .panel > .panel-body .show_moreless a[aria-expanded="false"] .show_less {
  display: none;
  visibility: hidden;
}
#filtersPanel #metadataDiv .panel > .panel-body .show_moreless a[aria-expanded="true"] .show_less,
#filtersPanel #metadataDiv .panel > .panel-body .show_moreless a[aria-expanded="false"] .show_more {
  display: inline-block;
  visibility: visible;
}
#filtersPanel #CCFilters .children {
  padding-left: 20px;
}
#filtersPanel .panel {
  width: 100%;
}
#filtersPanel .form-check input.form-check-input {
  margin-top: 2px;
}
#filtersPanel .form-check {
  margin-bottom: 6px !important;
}
.suboptions {
  padding-left: 1.5rem;
  border-left: 2px solid #dee2e6;
}
#filtersPanel .suboptions {
  margin-left: -18px;
}
#filtersPanel .panel-heading,
#filtersPanel .panel-heading h3,
#filtersPanel .panel-heading .panel-heading__title {
  font-size: calc(16px * var(--font-scale, 1));
}
#filtersPanel .panel .panel-body.in {
  max-height: 200px;
  overflow: auto;
}
.learning_path_activities {
  border-top: solid 1px #dddddd;
}
/*.pass-activities.learning-activity-list[number_activities="0"] {display:none; visibility:hidden;}*/

#mycourse .col-md-3 .panel-body > div {
  display: block;
  clear: both;
}
#mycourse .col-md-3 .panel-body > div.btn-group,
#mycourse .col-md-3 .panel-body > div.button_container {
  display: inline-block;
  width: 100%;
  clear: both;
}
#mycourse .col-md-3 .panel-body > div > span {
  display: inline-block;
  width: 80px;
  float: left;
}
#mycourse .col-md-3 .panel-body > div > span.label + span {
  width: 150px;
}
#mycourse .panel.activity .separator,
#mycourse .progress-breakdown .modal small .separator {
  margin: 0px 0.5em;
}
#mycourse .progress-breakdown .modal small .glyphicon {
  margin: 0px 0.5em 0px 0px;
}
#mycourse .progress-breakdown > .tab-content > .tab-pane > .row {
  padding-left: 0px;
  margin: 0px;
  display: flex;
  flex-wrap: wrap;
}
#mycourse .progress-breakdown > .tab-content > .tab-pane > .row.next_activity_group_container {
  display: inline-block;
}
#mycourse .progress-breakdown > .tab-content > .tab-pane > .row li {
  padding-left: 0px;
  display: inline-block;
  list-style-type: none;
}
#mycourse .progress-breakdown > .tab-content > .tab-pane > .row {
  padding-left: 0px;
  margin: 0px;
  display: flex;
  flex-wrap: wrap;
  width: 100%;
}
#mycourse .progress-breakdown > .tab-content > .tab-pane > .row > div {
  display: flex;
  align-items: stretch;
  padding-bottom: 15px;
}
#mycourse .progress-breakdown > .tab-content > .tab-pane > .row > div > .panel {
  display: inline-block;
  width: 100%;
  align-items: stretch;
}
#mycourse .progress-breakdown > .tab-content > .tab-pane > .row > div > .panel > .panel-body {
  background-color: #f6f9fb;
  border-color: #f0f3f5;
  color: #333333;
  align-items: stretch;
  height: 100%;
}
#activity-content > iframe {
  width: 100%;
  min-height: 300px;
  border: none 0px;
  border-collapse: collapse;
  margin: 0px auto;
}
#mycourse .name .svg-inline--fa.fa-asterisk {
  margin-right: 3px;
  font-size: 0.7em;
  vertical-align: super;
}
#mycourse tbody th.item_progress {
  font-weight: 300;
  font-style: italic;
  font-size: 0.8em;
}
#mycourse .btn.activity-document .svg-inline--fa {
  margin-right: 5px;
}
#mycourse .modal-content .marquee.pull-left {
  max-width: 300px;
  margin: 0px 15px 15px 0px;
}
body.SurveyFeedback.modal {
  overflow-y: scroll;
  position: relative;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 0;
  display: block;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  outline: inherit;
}
/*Assignments*/

#mycourse .panel.progress-breakdown .panel-body > #StudentAssignments {
  display: flex;
  flex-wrap: wrap;
  align-content: stretch;
  justify-content: flex-start;
  align-items: stretch;
}
#mycourse .panel.progress-breakdown .panel-body > #StudentAssignments .card .card-body {
  padding: 15px;
}
#mycourse .panel.progress-breakdown .panel-body > #StudentAssignments .modal-dialog.modal-lg {
  height: 90% !important;
}
#mycourse .panel.progress-breakdown .panel-body > #StudentAssignments .modal-dialog.modal-lg .modal-content {
  height: 100% !important;
}
#mycourse .panel.progress-breakdown .panel-body > #StudentAssignments .modal-dialog.modal-lg .modal-content .modal-body {
  height: calc(100% - 118px) !important;
  padding: 0px;
}
body.submit.assignment.modal,
body.review assignment {
  overflow-y: auto !important;
}
#AssignmentDetails #Instruction img {
  max-width: 100%;
}
/*Credits*/

#mycourse .row.Learning_Path .lp_activities .tab-pane .activity-group-credits .panel.credits_certificates,
#mycourse .row.Learning_Path .lp_activities .tab-pane .activity-group-credits .panel.credits_certificates .panel-body {
  width: 100%;
  background-color: white !important;
  border-color: #f0f3f5;
  color: #333333;
}
#mycourse .row.Learning_Path .lp_activities .tab-pane .activity-group-credits .panel.credits_certificates .credit-provider-container {
  margin: 8px 0px;
}
#mycourse .row.Learning_Path .lp_activities .tab-pane .activity-group-credits .panel.credits_certificates .credit-provider-container .credit-provider {
  font-weight: bold;
}
#mycourse .row.Learning_Path .lp_activities .tab-pane .activity-group-credits .panel.credits_certificates .credit-category .credit-category-name {
  margin-right: 5px;
}
#mycourse .row.Learning_Path .lp_activities .tab-pane .activity-group-credits .panel.credits_certificates .credit-category .credit-category-name:after {
  content: ":";
}
#mycourse .row.Learning_Path .lp_activities .tab-pane .credit-details.modal .credit {
  margin: 0px;
  padding: 0px;
}
#mycourse .row.Learning_Path .lp_activities .tab-pane .credit-details.modal .credit + .credit {
  border-top: solid 1px #eeeeee;
  margin-top: 15px;
  padding-top: 15px;
}
#mycourse .panel.credits_certificates .credit-category .credit-category-name .credit-status {
  margin-left: 1em;
}
#mycourse .panel.credits_certificates .credit-category .credit-status.reporting-error {
  display: inline-block;
  width: 100%;
  color: red;
  font-weight: bold;
  margin-bottom: 5px;
}
/*Embed*/

.embed-responsive .embed-responsive-item,
.embed-responsive iframe,
.embed-responsive embed,
.embed-responsive object {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 0;
}
.embed-responsive {
  position: relative;
  display: block;
  height: 0;
  padding: 0;
  overflow: hidden;
}
.embed-responsive.embed-responsive-16by9 {
  padding-bottom: 56.25%;
}
/*Forms*/

form:focus {
  outline: none;
}
form.form-inline {
  display: inline;
}
fieldset {
  border: none 0px;
  padding: 1em;
  margin-bottom: 1em;
  background-color: white;
}
fieldset > legend,
fieldset > legend h1 {
  font-size: calc(21px * var(--font-scale, 1));
  font-weight: normal;
  color: #333333;
  background-color: white;
  border-color: #f0f3f5;
}
fieldset > legend h1 {
  margin: 0px;
}
input[type="radio"],
input[type="checkbox"],
fieldset input[type="radio"] + .label,
fieldset input[type="checkbox"] + .label {
  width: auto;
}
fieldset .label {
  width: 240px;
  height: auto;
}
.label {
  white-space: normal;
}
#Message .label {
  width: 185px;
}
fieldset > div {
  clear: both;
  margin-bottom: 0.5em;
}
fieldset #CustomMetadata_FieldTable tr > * {
  padding-bottom: 0.5em;
}
fieldset #availableCoursesLanguage + label {
  width: auto;
  margin-left: 5px;
}
.checkbox.form-control {
  padding-left: 15px;
}
.checkbox.form-control input[type="checkbox"] {
  margin-left: 0px;
  margin-right: 0.25em;
}
.checkbox.form-control label {
  width: auto;
}
.form-control.datepicker,
.date-range .input-group-addon,
.input-group.date-range {
  width: auto;
  display: inline-block;
}
.input-group.date-range {
  float: right;
  margin: 15px 0px;
}
.input-group.date-range > * {
  float: none;
}
.input-group.date-range .label {
  width: auto;
  padding: 0px 12px;
  line-height: calc(34px * var(--font-scale, 1));
}
.input-group.date-range .form-control {
  width: auto;
}
.input-group.date-range .input-group-addon {
  line-height: calc(20px * var(--font-scale, 1));
}
.input-group.date-range .form-control.datepicker {
  padding: 0px;
  cursor: pointer !important;
  cursor: hand !important;
}
.input-group.date-range .form-control.datepicker input {
  background: none !important;
  border: none 0px;
  padding: 6px 12px !important;
}
.input-group.date-range .input.hasDatepicker {
  background: none !important;
}
.input-group.date-range .btn {
  margin-left: 1em;
}
.row.mytranscripts span.form-control.datepicker {
  float: none;
}
input#transcript_search {
  max-width: 262px;
  display: inline-block;
  margin: 7px;
}
.input-group .form-control,
.input-group-btn:last-child > .btn,
.input-group-btn:last-child > .btn-group {
  z-index: 0;
}
span.form-control.datepicker {
  padding: 0px;
  background-image: url(../../images/calendar/calendar.png);
  background-repeat: no-repeat;
  background-position: right;
}
span.form-control.datepicker input[onmousedown*="datepicker"] {
  border: none 0px;
  background: none transparent !important;
  cursor: pointer;
  cursor: hand;
}
#ExternalTrainingModal .form-group {
  margin-bottom: 1em;
  width: 100%;
}
textarea {
  resize: vertical;
}
div.details > div {
  margin-bottom: 1px;
}
.label,
label {
  font-size: 1em;
  font-weight: 300;
  display: inline-block;
  width: 115px;
  text-align: left;
  padding-left: 0px;
}
.label.col-sm-3,
label.col-sm-3 {
  width: 25%;
}
.label.text-right {
  text-align: right;
}
.label.text-left {
  text-align: left;
}
.label.left {
  float: left;
  line-height: 1.1em;
}
.label.label-info {
  padding: 0.2em 0.6em 0.3em 0.6em;
  color: white;
  width: auto;
}
.value {
  display: inline-block;
  line-height: 1.1em;
  padding: 0.2em 0.6em;
}
/* width:115px;*/

input[type="radio"] {
  vertical-align: middle;
  margin: 0px 2px 0px 10px;
  height: 1.5em;
}
div.details h3 {
  width: auto;
}
.myprofile .form-horizontal .form-group:hover {
  background-color: #f6f6f6;
}
#login_info .form-group,
#login_info #register,
#login_info .log_in {
  margin-right: 0.5em;
}
#login_info .glyphicon.glyphicon-home {
  font-size: 2em;
  height: 34px;
  top: 9px;
}
#masthead #login_info .dropdown-menu {
  z-index: 10000;
}
#masthead #login_info .dropdown-menu > li > a {
  color: #333333;
  text-align: left;
  text-decoration: none;
}
#defaultSortingChoose label {
  width: auto;
}
#MyCourses .sort {
  font-size: 0.9em;
}
#MyCourses .details .status_breakdown {
  font-size: 0.9em;
  margin-top: -5px;
}
#MyCourses div.details div.row.status_breakdown > div {
  padding-bottom: 0;
}
#MyCourses .details label {
  text-align: right;
}
#ExternalTrainingModal .form-group {
  margin-bottom: 1em;
}
/*Images*/

.profile.img-thumbnail,
.profile.img-rounded {
  margin: 0 0.5em 0.5em 0;
}
.img-thumbnail.profile.fullsize {
  width: auto;
  height: auto;
  max-width: 300px;
  max-height: 300px;
}
.panel > img.profile {
  width: 100%;
  max-width: 300px;
  max-height: 300px;
}
/*Equivalancy Modal*/

#LPActivityEquivalenciesSelection #lpTitleDiv h1 {
  margin-top: 0px;
}
#LPActivityEquivalenciesSelection #series_titleDiv {
  margin-bottom: 1em;
}
#LPActivityEquivalenciesSelection #series_selectionDiv .course-row {
  margin: 0px 0px 15px 0px;
}
#LPActivityEquivalenciesSelection #series_selectionDiv .course-row .option {
  border: solid 1px #eeeeee;
  padding: 15px 15px 15px 3em;
  position: relative;
}
#LPActivityEquivalenciesSelection #series_selectionDiv .course-row .option:hover {
  background-color: #27004c;
}
#LPActivityEquivalenciesSelection #series_selectionDiv .course-row .option input {
  position: absolute;
  top: 1em;
  left: 5px;
}
/*Buttons*/

.btn,
.pagination > .active > a,
.pagination > .active > a:focus,
.pagination > .active > a:hover,
.pagination > .active > span,
.pagination > .active > span:focus,
.pagination > .active > span:hover,
#SupervisorView .btn-group.chart-nav .btn.active {
  text-decoration: none;
  color: white;
  border-color: #5900c1;
  background-color: #5900c1;
  z-index: 0;
}
.btn:hover,
.btn:active,
.btn:focus,
#SupervisorView .btn-group.chart-nav .btn.active:hover {
  text-decoration: none;
  color: white;
  border-color: #27004c;
  background-color: #27004c;
}
#SupervisorView .btn-group.chart-nav .btn {
  color: #5900c1;
  border-color: #5900c1;
}
.btn.single-resource .svg-inline--fa {
  margin-right: 0.25em;
}
.course-buttons .btn,
.course-buttons .btn-group {
  margin: 0px 5px 0px 0px;
}
.course-buttons .btn-group > .btn {
  margin: 0px;
}
.course-buttons .btn-group > .btn-refresh {
  margin-left: 1px;
}
.course-buttons .btn-group > .btn-refresh .svg-inline--fa {
  font-size: 0.7em;
}
.btn-group {
  margin: 0.5em 0em;
}
.btn-group.primaryButtons {
  float: right;
  margin: 0px 0px 5px 15px;
}
.btn.btn-disabled,
.btn[disabled],
.btn-primary[disabled],
.btn.btn-default[disabled] {
  background-color: white !important;
  color: #cccccc !important;
  border: 1px solid #cccccc !important;
}
.btn .topleft_corner,
.btn .bottomleft_corner,
.btn .bottomright_corner,
.btn .topright_corner {
  display: none;
}
#GoBackbtn + #btnPrint {
  margin-right: 0.5em;
}
.btn.btn-icon {
  background-color: transparent;
  border-color: transparent;
  color: #5900c1;
}
.btn.btn-icon:hover {
  background-color: transparent;
  border-color: transparent;
  color: #27004c;
}
#collapseCountryAlt .well {
  display: block;
  border: none 0px;
  background-color: transparent;
  padding: 15px 0px;
  font-style: italic;
  font-size: 0.9em;
  text-align: center;
  -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05);
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05);
}
#collapseCountryAlt.collapse .well {
  border: none 0px;
  background-color: transparent;
  padding: 15px 0px;
  font-style: italic;
  font-size: 0.9em;
  -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05);
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05);
}
/*List Groups*/

.list-group-item[onclick] {
  cursor: pointer;
}
.list-group-item[onclick]:hover {
  background-color: #f4f8fa;
}
.list-group-item.active {
  background-color: #eeeeee;
  border-color: #f0f3f5;
  color: #333333;
}
.list-group-item.active a {
  color: #333333;
}
.list-group-item {
  background-color: #f6f9fb;
  border-color: #f0f3f5;
  color: #333333;
}
.session-list {
  margin-top: 1.5em;
}
.session-list > li {
  display: list-item;
  list-style-type: disc;
  margin-left: 18px;
}
/*Modals*/

.modal-header {
  color: black;
}
.modal-body {
  color: black;
}
.modal ul.nav-tabs > li {
  display: inline-block !important;
  list-style-type: none !important;
  margin-left: 0px;
}
.modal .modal-body .container {
  width: 100% !important;
}
.modal .modal-dialog.modal-sm .modal-body .label,
.modal .modal-dialog.modal-sm .modal-body .form-control {
  float: none;
  text-align: center;
  width: 100%;
}
/*Tables*/

table.table {
  font-size: 1em;
}
table.course_progress {
  clear: both;
}
.table > thead > tr > th,
.table > thead > tr > td,
.table > thead > tr > th.type,
.table > thead > tr > th.success,
.panel-heading,
.table.grid tbody > tr.table_header > th {
  background-color: #5900c1;
  color: white;
  border-color: #f0f3f5;
}
.table > thead > tr > th,
.table > thead > tr > td,
.table > tbody > tr > th,
.table > tfoot > tr > th,
.table > tbody > tr > td,
.table > tfoot > tr > td {
  vertical-align: middle;
  border-color: #f0f3f5;
}
table.table > tbody > tr.tableSubHeader td,
table.table > tbody > tr.tableSubHeader th,
table.table thead tr.tableSubHeader th,
table.table > tbody > tr.tableSubHeader.active th,
table.table > tbody > tr.tableSubHeader.active:hover th,
table.table > tbody > tr.objective.tableSubHeader,
table.table > tbody > tr.tableSubHeader:hover td,
table.table > tbody > tr.tableSubHeader:hover th,
table.table > tbody > tr.objective.tableSubHeader:hover,
.table tr:nth-child(2n).tableSubHeader td,
.table tr:nth-child(2n).tableSubHeader th,
.table tr:nth-child(2n).objective.tableSubHeader,
.table tr:nth-child(2n).tableSubHeader:hover td,
.table tr:nth-child(2n).tableSubHeader:hover th,
.table tr:nth-child(2n).objective.tableSubHeader:hover {
  background-color: #cccccc;
  color: white;
}
.tablesorter-header-inner {
  cursor: pointer;
}
.table .tableSubSubHeader td,
.table .tableSubSubHeader th,
caption.tableSubSubHeader {
  background-color: white;
  color: #003366;
  border-color: #f0f3f5;
}
.table .tableSubSubSubHeader td {
  background-color: #eeeeee;
  color: #333333;
  border-color: #f0f3f5;
}
.table > tbody > tr:nth-child(2n-1) > td {
  background-color: white;
  color: #333333;
  border-color: #f0f3f5;
}
.table > tbody > tr:nth-child(2n) > td {
  background-color: #f6f9fb;
  color: #333333;
}
#content table > tbody > tr.divider > * {
  background-color: #f0f3f5;
  padding: 0px;
  height: 2px;
}
.table > thead > tr > td.info,
.table > tbody > tr > td.info,
.table > tfoot > tr > td.info,
.table > thead > tr > th.info,
.table > tbody > tr > th.info,
.table > tfoot > tr > th.info,
.table > thead > tr.info > td,
.table > tbody > tr.info > td,
.table > tfoot > tr.info > td,
.table > thead > tr.info > th,
.table > tbody > tr.info > th,
.table > tfoot > tr.info > th {
  background-color: #d9edf7;
}
.table > thead > tr > th,
.table > tbody > tr > th,
.table > tfoot > tr > th,
.table > thead > tr > td,
.table > tbody > tr > td,
.table > tfoot > tr > td {
  border-width: 1px 0px 0px 0px;
}
tr.table-footer > th,
.table.grid tr:last-child > * {
  border-top: double 3px #f0f3f5;
  background-color: transparent;
}
.table.grid tr:last-child > * > table {
  width: 100%;
}
.table.grid tr:last-child > * > table tr > * {
  padding: 8px;
  line-height: 1.428571429;
  vertical-align: top;
}
html[dir=rtl] .table tr td,
html[dir=rtl] .table tr th {
  text-align: right !important;
  direction: rtl !important;
}
.table tr > th:first-child,
.table tr > td:first-child {
  text-align: left;
}
.table th.text,
.table td.text {
  text-align: center;
}
.table th.number,
.table td.number {
  text-align: right;
}
.table .actions {
  white-space: nowrap;
}
.table .actions .modal {
  white-space: normal;
}
.table .moderators {
  white-space: nowrap;
}
.table td .courseTitle {
  margin-left: 15px;
  display: block;
}
td.badges img {
  width: 200px;
}
@media (max-width: 767px) {
  th,
  td {
    display: inline-block !important;
    float: left;
    width: 100%;
  }
  .picker__table th,
  .picker__table td {
    width: auto;
    height: auto;
    margin: 0;
    padding: 0;
    border: none;
    border-collapse: inherit;
    border-spacing: 0;
    border-color: inherit;
    vertical-align: inherit;
    text-align: center;
    font-weight: inherit;
    -webkit-border-horizontal-spacing: 0;
    -webkit-border-vertical-spacing: 0;
    display: table-cell !important;
    float: none !important;
  }
  .picker__table {
    text-align: center;
    border-collapse: collapse;
    border-spacing: 0;
    table-layout: fixed;
    font-size: inherit;
    width: 100%;
    margin-top: 0.75em;
    margin-bottom: 0.5em;
  }
  .picker__weekday {
    width: 14.285714286% !important;
    font-size: 0.75em !important;
    padding-bottom: 0.25em !important;
    color: #999999 !important;
    font-weight: 500 !important;
  }
  .visible-sm.visible-xs {
    border-width: 0px;
  }
  table > tbody > tr > td.course {
    border-top-width: 1px;
  }
  td.course span.courseTitle,
  td span.courseTitle {
    margin-left: 0px !important;
  }
  .table > tbody > tr {
    border: solid 0px #f0f3f5;
    border-bottom-width: 5px;
  }
  .table > tbody > tr > td {
    border-width: 0px;
    padding: 2px 15px 2px 15px;
  }
  .table > tbody > tr > td:first-child {
    border-width: 0px;
    padding: 15px 15px 0px 15px;
  }
  .table > tbody > tr > td:last-child {
    border-width: 0px;
    padding: 0px 15px 15px 15px;
  }
}
@media (max-width: 768px) {
  .table > * > tr > td.hidden-sm {
    width: 0px;
    padding: 0px;
  }
}
@media print {
  th,
  td {
    display: table-cell;
    float: none;
    /*width:;*/
  
  }
}
.table td .btn {
  margin-right: 0.5em;
}
#MyLearningPaths .progress,
.progress-breakdown .progress.progress-bar {
  margin-bottom: 0px;
  min-width: 200px;
  width: 100%;
  height: 30px;
  white-space: nowrap;
}
.progress-breakdown .progress[data-percent="10000%"] .progress-bar {
  width: 100% !important;
}
.progress-breakdown .progress.progress-bar {
  background-color: #f3f3f3;
  height: 30px;
  margin-bottom: 10px;
  -webkit-box-shadow: inset 0px 2px 3px 1px rgba(0, 0, 0, 0.2);
  -moz-box-shadow: inset 0px 2px 3px 1px rgba(0, 0, 0, 0.2);
  box-shadow: inset 0px 2px 3px 1px rgba(0, 0, 0, 0.2);
}
.progress-breakdown .progress.progress-bar .progress-bar-success {
  line-height: calc(30px * var(--font-scale, 1));
}
.progress.completed .progress-bar-success {
  background-color: #cccccc;
  color: white;
}
.progress.active .progress-bar-success {
  background-color: #5900c1;
  color: white;
}
.progress.inactive .progress-bar-success {
  background-color: #5900c1;
  color: #333333;
}
.progress_legend {
  font-size: 0.9em;
  line-height: calc(15px * var(--font-scale, 1));
  color: #888888;
  text-align: right;
  padding: 10px 0px;
  display: none;
  visibility: hidden;
}
.doughnut.progress_breakdown .progress_legend {
  position: absolute;
  bottom: -8px;
}
.progress_legend > div {
  display: inline-block;
  float: left;
  margin-right: 30px;
}
.progress_legend > div > .progress-bar {
  display: inline-block;
  float: left;
  margin-right: 5px;
  width: 15px;
  height: 15px;
  border-radius: 50%;
}
.activity-group-progress .progress-bar-required-inprogress,
.activity-group-progress .progress-bar-optional-inprogress {
  opacity: 0.5;
}
.progress_legend > div.required-inprogress > .progress-bar,
.progress_legend > div.optional-inprogress > .progress-bar {
  opacity: 0.4;
}
#MyLearningPaths .progress.progress-bar {
  height: 30px;
}
#MyLearningPaths .progress.progress-bar .progress-bar-success {
  line-height: calc(30px * var(--font-scale, 1));
}
#MyLearningPaths .progress.inactive .progress-bar-success {
  margin-left: 10px;
}
#MyLearningPaths .progress.inactive .progress-bar-success[aria-valuenow="0"] {
  padding-left: 0px;
}
.progress-bar.progress-bar-success[aria-valuenow="0"] {
  color: #333333;
}
.progress-bar-success[aria-valuenow="0"] {
  color: #cccccc;
  margin-left: 5px;
  padding-left: 0;
}
.progress-bar-success {
  height: 100%;
  line-height: calc(30px * var(--font-scale, 1));
  font-size: 0.8em;
  white-space: nowrap;
  padding-left: 5px;
}
.my_learning_path .item_progress {
  min-width: 160px;
  border-radius: 0;
}
@media (max-width: 767px) {
  #MyLearningPaths .lp-score > div {
    text-align: left;
  }
}
.my_learning_path .actions .btn {
  margin: 0;
}
.my_learning_path .actions {
  min-width: 200px;
  text-align: right;
}
.my_learning_path .actions .modal {
  text-align: left;
}
.my_learning_path .actions .modal #lpTitleLabel {
  margin: 0px;
}
.activity_progress_visuals .doughnut,
.activity_progress_visuals .doughnut_score {
  width: 175px !important;
  height: 175px !important;
}
.wedge.slice_0 {
  fill: #5900c1;
  color: white;
}
.wedge.slice_1 {
  fill: #5900c1;
  color: white;
  opacity: 0.2;
}
.ct-chart .ct-series.ct-series-a .ct-bar,
.ct-chart .ct-series.ct-series-a .ct-line,
.ct-chart .ct-series.ct-series-a .ct-point,
.ct-chart .ct-series.ct-series-a .ct-slice.ct-donut,
.ct-chart-donut .ct-series-a {
  stroke: #5900c1;
  color: #5900c1;
  fill: #5900c1;
}
.ct-chart .ct-series.ct-series-b .ct-bar,
.ct-chart .ct-series.ct-series-b .ct-line,
.ct-chart .ct-series.ct-series-b .ct-point,
.ct-chart .ct-series.ct-series-b .ct-slice.ct-donut,
.ct-chart-donut .ct-series-b {
  stroke: whitesmoke;
  color: whitesmoke;
  fill: whitesmoke;
}
.doughnut.score_breakdown .wedge.slice_1,
.doughnut_score .wedge.slice_1,
.progress_completed .wedge.slice_1 {
  fill: whitesmoke;
  opacity: 1;
}
/*.score_completed .wedge.slice_1,
    .score_breakdown .wedge.slice_1 {fill:#f5f5f5; opacity:1;}*/

.doughnut.score_breakdown + small {
  float: left;
  margin: 0px 0px 0px 0px;
  width: 175px;
  text-align: center;
}
#mycourse .progress-breakdown small .result-success {
  margin-left: 0.25em;
}
#mycourse .row.Learning_Path > tbody.objective {
  display: table-row-group !important;
}
#mycourse .row.Learning_Path tbody.objective .description ul,
#mycourse .row.Learning_Path tbody.objective .description ol {
  padding-left: 0px;
}
#mycourse .row.Learning_Path tbody.objective.collapse:not(.collapsed) tr.tableSubHeader .icon .svg-inline--fa {
  -ms-transform: rotate(90deg);
  -webkit-transform: rotate(90deg);
  transform: rotate(90deg);
  -moz-transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  transition: all 0.5s ease;
}
#mycourse .row.Learning_Path tbody.objective.collapse.collapsed tr.tableSubHeader .icon .svg-inline--fa {
  -ms-transform: rotate(0deg);
  -webkit-transform: rotate(0deg);
  transform: rotate(0deg);
  -moz-transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  transition: all 0.5s ease;
}
#mycourse .row.Learning_Path tbody.objective:hover {
  cursor: pointer;
  cursor: hand;
}
#mycourse .row.Learning_Path tbody.objective th.name {
  font-weight: 300;
}
#mycourse .row.Learning_Path tbody.objective th.name .objective-name {
  text-decoration: underline;
  font-weight: bold;
}
#mycourse .row.Learning_Path tbody.objective:hover th.name {
  text-decoration: none;
}
@media (max-width: 767px) {
  #transcript_list #transcripts_completed tr > td.lesson > div[style*="margin-left:"]:before {
    content: "- ";
  }
  #transcript_list #transcripts_completed tr > td.text-center {
    text-align: left;
  }
}
#mycourse .row.Learning_Path .panel.progress-breakdown .tab-content .tab-pane .subobjectiveactive.well ul {
  padding: 0px;
}
#mycourse .row.Learning_Path .panel.progress-breakdown .tab-content .tab-pane .subobjectiveactive.well li {
  list-style-type: none;
  display: inline-block;
}
.modal-body {
  display: inline-block;
  width: 100%;
}
.row.Learning_Path .progress-breakdown > .tab-content > .tab-pane > .row li.col-md-4:nth-child(3n+1) {
  clear: left;
}
.row.Learning_Path ul.prerequisites {
  margin-left: 0px;
  padding-left: 0px;
  display: block;
}
#mycourse .progress-breakdown > .tab-content > .tab-pane > .row ul.prerequisites li {
  margin-left: 1.4em;
  display: list-item;
  list-style-type: disc;
}
#mycourse .progress-breakdown > .tab-content > .tab-pane > .row ul.prerequisites li h3 {
  margin-top: 0px;
}
#mycourse .progress-breakdown > .tab-content > .tab-pane > .row ul.prerequisites li h3 {
  margin-top: 0px;
}
#mycourse .row.activity .activity-document {
  padding: 15px;
  margin-bottom: 15px;
  border: 1px solid #e3e3e3;
}
#mycourse tr.session .speaker {
  line-height: 1.2em;
  margin-bottom: 5px;
}
#mycourse tr.session .speaker img.profile.img-rounded {
  margin: 0px 5px 0px 0px;
  width: 1.2em;
  height: 1.2em;
}
#mycourse tr.session .location .provider-logo {
  margin-bottom: 10px;
}
#mycourse > .row.Learning_Path .next_activity_group {
  padding-left: 15px;
}
#learners table td.metadata .label {
  width: 130px;
}
#learners th.columns_7,
#learners th.columns_6,
#learners th.columns_5,
#learners th.columns_4 {
  white-space: nowrap;
}
#learners th {
  white-space: normal;
}
#mylearningpath .overview .label {
  font-weight: bold;
}
#mylearningpath .lp_doughnut_progress,
#mylearningpath .lp_doughnut_score {
  width: 200px !important;
  height: 200px !important;
  overflow: hidden;
}
/*This is redundant it messes up the display of the chart*/

/*#mylearningpath .lp_doughnut_progress x-pie, #mylearningpath .lp_doughnut_score x-pie {width:200px !important; height:200px !important;}*/

#mylearningpath #accordion tbody.objective[aria-expanded="true"] th.icon .svg-inline--fa.fa-chevron-circle-right {
  -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=1)";
  -webkit-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  transform: rotate(90deg);
}
#mylearningpath #accordion tbody.objective th.item_progress .progress,
#mylearningpath #accordion tbody.activities td.item_progress .progress {
  height: 30px;
  margin-bottom: 0px;
}
#mylearningpath #accordion tbody.objective th.item_progress .progress .progress-bar-success,
#mylearningpath #accordion tbody.activities td.item_progress .progress .progress-bar-success {
  height: 30px;
}
#mylearningpath #accordion tbody.objective th.name .svg-inline--fa.fa-check-circle {
  margin-left: 3px;
}
#mylearningpath #accordion tbody .actions .svg-inline--fa.fa-check-circle {
  margin-left: 3px;
}
.progress {
  margin-bottom: 0px;
  height: 30px;
}
.item_progress .progress {
  height: 30px;
}
#mycourse #mylearningpath .actions .btn.enter,
#mycourse #mylearningpath .actions .btn.Enter,
#mycourse #mylearningpath .actions button.btn[onclick*="#activity_"],
#mycourse #mylearningpath .name .svg-inline--fa.fa-check {
  display: inline-block !important;
  visibility: visible !important;
}
/*My Activity Details page - rows layout*/

#mycourse .activity-overview .activity_summary_info > .row {
  clear: left;
  margin-bottom: 15px;
}
#mycourse .activity-overview .activity_summary_info .course-buttons {
  text-align: left;
}
#mycourse .activity-overview .activity_summary_info .course-buttons > .btn {
  margin: 0px 5px 0px 0px;
}
#mycourse .activity-overview .activity_summary_info label,
#mycourse .activity-overview label {
  font-weight: bold;
  width: 100%;
  margin-bottom: 0px;
}
#mycourse .activity-overview .activity_summary_info .marquee {
  max-width: 300px;
  padding: 0px 15px 15px 0px;
}
#mycourse .activity-overview .activity_summary_info .credit-categories > div {
  display: block !important;
}
#mycourse .activity-overview .activity_summary_info .custom-fields {
  margin: 0px -15px 15px -15px;
}
#mycourse .activity-overview .activity_summary_info .credit-category .credit-category-name {
  margin-right: 5px;
}
#mycourse .activity-overview .activity_summary_info .credit-category .credit-category-name:after {
  content: ":";
}
#mycourse .activity-overview .activity_progress_visuals {
  text-align: right;
}
#mycourse .activity-overview .activity_progress_visuals .progress-bar.in_progress {
  opacity: 0.4;
}
/*#mycourse .activity-overview .activity_progress_visuals .doughnut {width:100% !important; height:100% !important; position:relative; margin:0px 0px 0px 0px;}*/

/*#mycourse .activity-overview .activity_progress_visuals .doughnut x-pie {width:140%; height:100%; text-align:left; margin:-10% 0px 0px -20%;}*/

/* set the width and height of the pie chart and it will take this and render dynamically based of these values */

#transcript_progress_doughnut.activity_progress_visuals {
  max-width: 175px;
  margin-top: -175px;
}
#mycourse .activity_progress_visuals x-pie,
#mycourse .column-packageresources .progress-breakdown x-pie,
#transcript_progress_doughnut.activity_progress_visuals x-pie {
  width: 350px;
  height: 350px;
  margin: 0px auto;
}
#mycourse .activity_progress_visuals x-pie svg,
#mycourse .column-packageresources .progress-breakdown x-pie svg,
#transcript_progress_doughnut.activity_progress_visuals x-pie svg {
  margin-left: -88px;
  margin-top: -88px;
  overflow: visible;
}
#mycourse .activity_progress_visuals x-pie svg .inner_fill,
#mycourse .column-packageresources .progress-breakdown x-pie svg .inner_fill,
#transcript_progress_doughnut.activity_progress_visuals x-pie svg .inner_fill {
  r: 76;
  fill: white;
  stroke-width: 1 !important;
  cx: 175 !important;
  cy: 175 !important;
}
#mycourse .activity_progress_visuals x-pie svg .inner_shadow,
#mycourse .column-packageresources .progress-breakdown x-pie svg .inner_shadow,
#mycourse .activity_progress_visuals x-pie svg .large_shadow,
#mycourse .column-packageresources .progress-breakdown x-pie svg .large_shadow,
#transcript_progress_doughnut.activity_progress_visuals x-pie svg .inner_shadow,
#transcript_progress_doughnut.activity_progress_visuals x-pie svg .large_shadow {
  display: none;
  visibility: hidden;
}
/*My LP Details page - nav with containers view*/

#mycourse #learning_path_nav {
  border-radius: 0px;
}
#mycourse #current_activity_group {
  padding: 0px;
}
#mycourse #learning_path_nav .navbar-text.title {
  font-size: 1.1em;
  color: #333333;
  margin-left: 0px;
}
#mycourse #learning_path_nav .chevron {
  padding: 0px;
}
#mycourse #learning_path_nav .chevron button {
  line-height: calc(48px * var(--font-scale, 1));
  padding: 0px 15px;
  border-radius: 0px;
  margin: 0px;
  border-color: white;
  background-color: white;
  color: #333333;
}
#mycourse #learning_path_nav .chevron button:hover {
  background-color: #5900c1;
  color: white;
}
/*#mycourse .activity-content #activities .navbar-default .navbar-nav > .active > a {
    background-color:@Tabs-Unselected-Tab-Background-Color; color:@Tabs-Unselected-Tab-Text-Color;}*/

#mycourse .activity-content #activities .navbar .svg-inline--fa {
  margin-right: 5px;
}
#mycourse .activity-content #activities .navbar .svg-inline--fa.completed {
  color: #5cb85c;
}
#mycourse .activity-content #activities .navbar .svg-inline--fa.incomplete {
  color: white;
}
/*#mycourse .activity-content #activities .navbar .fa.locked {color:#5cb85c;}*/

#mycourse .row.Learning_Path .lp_activities .tab-pane > .activity-group-progress .progress-bar-inprogress {
  opacity: 0.5;
}
#mycourse .row.Learning_Path .lp_activities .tab-pane > .activity-group-progress .progress-bar[style="width:0%"] {
  padding: 0px;
}
#mycourse .row.Learning_Path .lp_activities .tab-pane > .activity-group-progress .progress-bar[style="width:0%"] {
  padding: 0px;
}
#mycourse .row.Learning_Path .lp_activities .tab-pane > .activity-group-progress .optional-statement b {
  margin: 0px 0.25em;
}
#mycourse .row.Learning_Path .lp_activities .tab-pane .activity-description {
  padding: 15px;
}
#mycourse .row.Learning_Path .lp_activities .tab-pane .alert-locked .svg-inline--fa.fa-lock {
  margin-right: 5px;
}
#mycourse .row.Learning_Path .lp_activities .tab-pane .activity_block[lock="lock"] {
  position: relative;
}
#mycourse .row.Learning_Path .lp_activities .tab-pane .activity_block[lock="lock"] > .lock {
  position: absolute;
  top: 50%;
  left: 50%;
  margin: -30px 0px 0px -30px;
  z-index: 1000;
  font-size: calc(60px * var(--font-scale, 1));
  width: 60px;
  text-align: center;
}
#mycourse .row.Learning_Path .lp_activities .tab-pane .activity_block[lock="lock"] > .panel {
  opacity: 0.3;
  background-color: #aaaaaa !important;
  position: relative;
}
#mycourse .row.Learning_Path .lp_activities .tab-pane .activity_block .activity_number {
  border: solid 1px #333333;
  display: inline-block;
  border-radius: 50%;
  width: 2em;
  height: 2em;
  text-align: center;
  line-height: 1.7em;
}
#mycourse .row.Learning_Path .lp_activities .tab-pane .activity_block .status_icon {
  position: absolute;
  top: 0.5em;
  right: 0.5em;
}
#mycourse .row.Learning_Path .lp_activities .tab-pane .activity_block label {
  font-weight: bold;
  margin-bottom: 0;
  width: 100%;
}
#mycourse .row.Learning_Path .lp_activities .tab-pane .activity_block .panel-body > div {
  margin-bottom: 5px;
}
#mycourse .row.Learning_Path .lp_activities .tab-pane .activity_block .percentage_completed {
  margin: 15px 0px 0px 0px;
}
#mycourse .row.Learning_Path .lp_activities .tab-pane .activity_block .percentage_completed div.progress {
  background-color: #f6f6f6;
}
/*#mycourse .activity-content #activities .activity_block li[lock="lock"] div.progress {background-color:#bbbbbb;}*/

#mycourse .row.Learning_Path .lp_activities .tab-pane .activity_block .percentage_completed div.progress,
#mycourse .row.Learning_Path .lp_activities .tab-pane .activity_block .percentage_completed div.progress > .progress-bar {
  height: 4px;
}
/*#mycourse .progress-breakdown > .tab-content > .tab-pane > .row li[lock="lock"] div.progress + label {font-size:0.8em;}*/

#mycourse .activity-content .tab-content .tab-pane .row.activities {
  padding: 0px;
}
#mycourse .activity-content .tab-content .tab-pane .row.activities > li {
  display: inline-block;
  list-style-type: none;
}
#mycourse .activity-content .tab-content .tab-pane .row.activities > li:nth-child(3n+1) {
  clear: left;
}
#mycourse .activity-content .tab-content .tab-pane .row.activities > li .panel.activity {
  overflow: hidden;
}
#mycourse .activity-content .tab-content .tab-pane .row.activities > li .panel.activity[data-lock="true"] {
  opacity: 0.5;
  position: relative;
}
#mycourse .activity-content .tab-content .tab-pane .row.activities > li .panel.activity[data-lock="true"] .lock_icon {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
  line-height: 100%;
  text-align: center;
}
#mycourse .activity-content .tab-content .tab-pane .row.activities > li .panel.activity .activity_number {
  display: inline-block;
  border: solid 1px #333333;
  border-radius: 50%;
  width: 22px;
  height: 22px;
  line-height: calc(22px * var(--font-scale, 1));
  text-align: center;
}
#mycourse .activity-content .tab-content .tab-pane .row.activities > li .panel.activity .status_icon {
  position: absolute;
  top: 0px;
  right: 0px;
  width: 90px;
  height: 90px;
  background-color: whitesmoke;
  transform: rotate(-45deg);
  margin: -45px -45px 0 0;
}
#mycourse .activity-content .tab-content .tab-pane .row.activities > li .panel.activity .status_icon .svg-inline--fa {
  transform: rotate(45deg);
  margin: 36px 0px 0px 12px;
}
#mycourse .activity-content .tab-content .tab-pane .row.activities > li .panel.activity img.marquee {
  margin: 15px 0px;
}
#mycourse .activity-content .tab-content .tab-pane .row.activities > li .panel.activity h3 {
  margin-bottom: 1em;
}
#mycourse .activity-content .tab-content .tab-pane .row.activities > li .panel.activity label {
  width: 100%;
  font-weight: bold;
  margin-bottom: 0px;
}
#mycourse .activity-content .tab-content .tab-pane .row.activities > li .panel.activity .panel-body > div {
  margin-bottom: 8px;
}
#mycourse .lp_activities .row.activity_group_resources_container.next_activity_group_container > div {
  display: inline-block !important;
}
#mycourse .lp_activities .row.activity_group_resources_container .activity-group-resources div {
  display: block;
  width: 100%;
}
#mycourse .lp_activities .row.activity_group_resources_container .activity-group-resources .single-resource,
#mycourse .lp_activities .activity-modal .activity-resources .single-resource {
  margin: 0px 5px 5px 0px;
}
#mycourse .lp_activities .row.next_activity_group_container .next_activity_group {
  border-left: solid 1px #e7d8d8;
  padding-left: 15px;
}
#mycourse .modal.credit-details .manual-claim label {
  font-weight: bold;
}
#mycourse .modal.credit-details .manual-claim .input-group {
  max-width: 200px;
}
#mycourse .modal.credit-details .manual-claim .input-group input[disabled] {
  display: none;
  visibility: hidden;
}
#mycourse .modal.credit-details .manual-claim .input-group input[disabled] + .input-group-btn .btn {
  border-radius: 4px;
}
/* Printed Tables */

@media print {
  table {
    margin: 2em 0;
    text-align: left;
    display: table;
    width: 100%;
    clear: both;
  }
  thead {
    display: table-row-group;
  }
  tbody {
    display: table-row-group;
  }
  tfoot {
    font-style: italic;
    display: table-footer-group;
  }
  tr {
    display: table-row;
    white-space: nowrap;
  }
  table thead tr th,
  table tbody tr td,
  table tbody tr th {
    border-bottom: 1px solid #333333;
    padding: 4px 10px 4px 0;
    display: table-cell !important;
    float: none !important;
    width: inherit !important;
    color: black !important;
    text-align: center;
  }
  table thead tr th:first-child,
  table tbody tr td:first-child,
  table tbody tr th:first-child {
    text-align: left;
    white-space: normal;
  }
  th {
    font-weight: bold;
    font-size: 1.2em;
  }
  table tbody tr td {
    border-bottom: 1px solid #666666 !important;
  }
  table thead tr th.actions,
  table tbody tr td.actions {
    display: none !important;
  }
  caption {
    background: white;
    margin-bottom: 2em;
    text-align: left;
  }
  img,
  tr {
    page-break-inside: avoid;
  }
  table #myTab > li {
    display: block;
  }
}
/*Jumbotron*/

.jumbotron small {
  font-size: 0.5em;
}
.jumbotron .category_marquee {
  float: left;
  margin: 0px 1em 0px 0px;
}
#catalogue .category .jumbotron h1,
#catalogue .category .jumbotron .h1 {
  font-size: 2em;
}
#catalogue .category .jumbotron p {
  font-size: 1.4em;
  line-height: 1.4em;
}
/*Spinner*/

body > div#spinner.hidden {
  display: none;
}
body > div#spinner {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 10000;
  width: 100px;
  height: 100px;
  margin: -50px 0 0 -50px;
  -webkit-animation-duration: 3s;
  -webkit-animation-iteration-count: infinite;
  -webkit-animation-timing-function: linear;
  -webkit-animation-name: spin;
}
body > div#spinner:before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100px;
  height: 100px;
  margin: -50px 0 0 -50px;
  background: #5e9e71;
  border-radius: 50%;
  -webkit-animation-duration: 2s;
  -webkit-animation-iteration-count: infinite;
  -webkit-animation-timing-function: linear;
  -webkit-animation-name: throb;
}
body > div#spinner > i {
  position: absolute;
  bottom: 50%;
  left: 50%;
  width: 6px;
  height: 50px;
  margin: 0 0 0 -3px;
  -webkit-transform-origin: 50% 100%;
}
body > div#spinner > i:nth-child(1) {
  -webkit-transform: rotate(23deg);
}
body > div#spinner > i:nth-child(2) {
  -webkit-transform: rotate(45deg);
}
body > div#spinner > i:nth-child(3) {
  -webkit-transform: rotate(68deg);
}
body > div#spinner > i:nth-child(4) {
  -webkit-transform: rotate(90deg);
}
body > div#spinner > i:nth-child(5) {
  -webkit-transform: rotate(113deg);
}
body > div#spinner > i:nth-child(6) {
  -webkit-transform: rotate(135deg);
}
body > div#spinner > i:nth-child(7) {
  -webkit-transform: rotate(158deg);
}
body > div#spinner > i:nth-child(8) {
  -webkit-transform: rotate(180deg);
}
body > div#spinner > i:nth-child(9) {
  -webkit-transform: rotate(203deg);
}
body > div#spinner > i:nth-child(10) {
  -webkit-transform: rotate(225deg);
}
body > div#spinner > i:nth-child(11) {
  -webkit-transform: rotate(248deg);
}
body > div#spinner > i:nth-child(12) {
  -webkit-transform: rotate(270deg);
}
body > div#spinner > i:nth-child(13) {
  -webkit-transform: rotate(293deg);
}
body > div#spinner > i:nth-child(14) {
  -webkit-transform: rotate(315deg);
}
body > div#spinner > i:nth-child(15) {
  -webkit-transform: rotate(338deg);
}
body > div#spinner > i > b {
  display: block;
  position: absolute;
  bottom: 100%;
  left: 0;
  width: 6px;
  height: 6px;
  background: #5e9e71;
  border-radius: 50% 50% 0 0;
  -webkit-animation-duration: 2s;
  -webkit-animation-iteration-count: infinite;
  -webkit-animation-timing-function: ease-in-out;
  -webkit-animation-name: move;
}
@-webkit-keyframes move {
  0% {
    bottom: 0%;
  }
  50% {
    bottom: 100%;
  }
  100% {
    bottom: 0%;
  }
}
@-webkit-keyframes throb {
  0% {
    width: 2px;
    height: 2px;
    margin: -1px 0 0 -1px;
    opacity: 0.75;
  }
  50% {
    width: 100px;
    height: 100px;
    margin: -50px 0 0 -50px;
    opacity: 0;
  }
  51% {
    width: 2px;
    height: 2px;
    margin: -1px 0 0 -1px;
    opacity: 0;
  }
  100% {
    width: 2px;
    height: 2px;
    margin: -1px 0 0 -1px;
    opacity: 0;
  }
}
@-webkit-keyframes spin {
  0% {
    -webkit-transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
  }
}
/*Home*/

.tile {
  margin-top: 0px;
  margin-bottom: 15px;
}
#Tile-DomainStats {
  margin: 0px 0px 15px 0px;
}
#Tile-DomainStats ul {
  width: 100%;
  height: auto;
  margin: 15px 0px;
  padding: 0px;
  display: block;
  text-align: center;
  background-color: #f7f7ed;
}
#Tile-DomainStats ul li {
  display: inline-block;
  padding: 0.5em;
  margin: 0px;
  font-size: 1.5em;
  text-align: center;
  border: solid 1px #f6f6f6;
}
#Tile-DomainStats ul li span.count {
  display: block;
  height: 2em;
  line-height: 2em;
}
#Tile-DomainStats ul li h3 {
  display: block;
  height: 25px;
  line-height: 1em;
  font-size: 0.55em;
  font-weight: normal;
}
#Tile-DomainStats #lmsstats li {
  float: none;
  text-align: center;
  font-size: 1.4em;
  line-height: 1.4em;
}
#Tile-DomainStats #lmsstats li i {
  display: inline-block;
  float: none;
  font-size: 0.8em;
  line-height: 2em;
  margin-right: 0.2em;
}
#Tile-DomainStats #lmsstats li span.count {
  display: inline-block;
  float: none;
}
#Tile-DomainStats ul li h3 {
  display: block;
  width: 100%;
  clear: both;
  height: 2em;
  line-height: 1.2em;
  font-size: 0.5em;
  font-weight: normal;
  text-align: center;
  text-transform: uppercase;
}
@media (max-width: 767px) {
  span.count {
    font-size: 0.7em;
  }
}
#Tile-FeatureSlider {
  display: block;
  height: 179px;
  overflow: hidden;
  margin: 0px 15px 15px 15px;
  padding: 0px;
  position: relative;
  background-color: #f6f6f6;
}
#Tile-FeatureSlider .mtile {
  height: 179px;
  padding: 0px;
  margin: 0px;
  cursor: pointer;
}
#Tile-FeatureSlider .mtile h2 {
  font-size: 1.2em;
  font-weight: normal;
  display: block;
  width: 100%;
  padding: 0px 10px !important;
  position: absolute;
  bottom: 50px;
  background-color: rgba(255, 255, 255, 0.8);
  z-index: 10;
}
#Tile-FeatureSlider .mtile img {
  position: absolute;
  top: 0px;
  width: 100%;
}
#Tile-FeatureSlider .mtile div {
  display: block;
  width: 100%;
  height: 50px;
  padding: 0px 10px !important;
  font-size: 0.8em;
  line-height: 1.2em;
  white-space: normal;
  position: absolute;
  bottom: 0px;
  background-color: rgba(255, 255, 255, 0.8);
  z-index: 10;
}
#Tile-FeatureSlider ul {
  display: block;
  height: 169px;
  margin: 0px;
  overflow-y: hidden;
  white-space: nowrap;
}
#Tile-AboutMeTile .about_me_tile .svg-inline--fa {
  margin-right: 3px;
}
#Tile-AboutMeTile .about_me_tile .profile-container {
  display: block;
  width: 100%;
  background-color: #eeeeee;
  border-bottom: solid 1px #f0f3f5;
  text-align: center;
  margin: 0px 0px 15px 0px;
}
#Tile-AboutMeTile .about_me_tile .profile {
  margin: 0px auto;
  width: 100%;
}
#Tile-AboutMeTile .about_me_tile .panel-body > h4.learner-name {
  margin-bottom: 0px;
}
#Tile-AboutMeTile .about_me_tile .label {
  font-weight: bold;
  width: 100%;
}
#Tile-AboutMeTile .panel-body > .row {
  margin: 15px -15px;
}
#Tile-AboutMeTile .panel-body > .row.user_stats .user_stat {
  margin-bottom: 10px;
  display: inline-block;
}
#Tile-AboutMeTile .panel-body .user-credit-categories > div {
  margin-bottom: 5px;
}
#Tile-AboutMeTile .panel-body .user-credit-categories .category-name {
  width: 130px;
  display: inline-block;
}
#Tile-SharePage #share_page_tile {
  display: block;
  margin: 0;
  padding: 0;
}
#Tile-SharePage #share_page_tile li {
  display: inline-block;
  float: left;
  list-style-type: none;
  margin: 0 0.25em;
}
#Tile-SharePage #share_page_tile li.facebook a.btn.btn-default {
  background-color: #306199;
  border-color: #306199;
  color: white;
}
#Tile-SharePage #share_page_tile li.linkedin a.btn.btn-default {
  background-color: #007bb6;
  border-color: #007bb6;
  color: white;
}
#Tile-SharePage #share_page_tile li.twitter a.btn.btn-default {
  background-color: #26c4f1;
  border-color: #26c4f1;
  color: white;
}
#Tile-SharePage #share_page_tile li.googleplus a.btn.btn-default {
  background-color: #e93f2e;
  border-color: #e93f2e;
  color: white;
}
#Tile-SharePage #share_page_tile li.email a.btn.btn-default,
#Tile-SharePage #share_page_tile li.email a.btn.btn-default:hover {
  background-color: #9c9c9c;
  border-color: #9c9c9c;
  color: white;
}
#Tile-CalendarTile #calendar_tile_container #calendar h2 {
  margin-top: 0;
  margin-bottom: 0;
  font-size: 1em;
  font-weight: 300;
}
#Tile-SectionFeatures #section_menu.row {
  display: flex;
  flex-wrap: wrap;
  align-content: stretch;
  justify-content: flex-start;
  align-items: stretch;
}
#Tile-SectionFeatures #section_menu.row > div {
  margin-bottom: 30px;
  float: left !important;
}
#Tile-SectionFeatures #section_menu.row > div > .panel {
  width: 100%;
  height: 100%;
}
#Tile-SectionFeatures #section_menu.row > .background > .panel {
  background-size: cover;
  background-position: center center;
}
#Tile-SectionFeatures #section_menu .background .panel-default .panel-heading {
  max-height: 100px;
  margin-top: 140px;
  background-color: rgba(255, 255, 255, 0.8);
  padding-bottom: 0;
}
#Tile-SectionFeatures #section_menu .background .panel-default .panel-body {
  height: calc(100% - 240px);
  background-color: rgba(255, 255, 255, 0.8);
  padding-top: 0;
}
#Tile-SectionFeatures #section_menu .panel-default .panel-heading {
  min-height: 120px;
}
#Tile-CustomFeatures #custom_features_tile > .row {
  display: flex;
  flex-wrap: wrap;
  align-content: stretch;
  justify-content: flex-start;
  align-items: stretch;
}
#Tile-CustomFeatures #custom_features_tile > .row > div {
  margin-bottom: 30px;
  float: left !important;
}
#Tile-CustomFeatures #custom_features_tile > .row > div > .thumbnail {
  width: 100%;
  height: 100%;
}
#Tile-CouponTile #codeTile-learnerResponse ul {
  padding-left: 18px;
}
#Tile-CouponTile #codeTile-learnerResponse ul li {
  clear: both;
}
#Tile-CouponTile #codeTile-learnerResponse ul li button {
  float: right;
  margin-bottom: 8px;
}
.waitDialog {
  z-index: 20000;
}
/*#Tile-NewCoursesTile .courses.panel-body thumbnail {margin:0 -15px;}
#Tile-NewCoursesTile .thumbnail {display:inline-block; float:left;  margin:15px;}
#Tile-NewCoursesTile .thumbnail img  {width:auto; height:194px;}
#Tile-NewCoursesTile .thumbnail.nomarquee {width:auto; max-width:240px; height:240px; background-color:@Tables-Header-Background-Color; color:@Tables-Header-Text-Color; text-decoration:none;}
#Tile-NewCoursesTile .thumbnail.nomarquee h3 {color:@Tables-Header-Text-Color; text-decoration:none; font-size:1.4em;}*/

/*.tile .thumbnail {
    min-height: 370px;
}*/

.tile #posts .post {
  border-bottom: solid 1px #eeeeee;
}
.chat_messages,
.posts {
  min-height: 120px;
  max-height: 380px;
  overflow: auto;
  padding: 10px 14px 10px 10px;
}
.chat_message,
.post {
  margin-top: 20px;
}
.chat_message img,
.post img,
.wallposts #posts li.post div.wallcontainer .profile-pic {
  width: 48px;
  height: 48px;
  margin-right: 10px;
  border-color: #e3e3e3;
  float: left;
}
.chat_message_body,
.post_body {
  padding: 10px;
  border: 1px solid #e3e3e3;
  position: relative;
  overflow: hidden;
}
.chat_message_body .wall-title,
.wallcontainer .wall-title {
  font-weight: 600;
}
.chat_message_author,
.post_author {
  border-top: solid 1px #eeeeee;
  padding-top: 1em;
  font-size: 0.9em;
}
.chat_message_author img,
.post_author img {
  width: 40px;
  height: 40px;
  object-fit: cover;
  object-position: 50% 50%;
  float: left;
  margin-bottom: 5px;
}
.chat_message_date,
.post_date {
  color: #999999;
  font-size: 0.8em;
}
.post_body .forum_name {
  color: #999999;
  font-size: calc(11px * var(--font-scale, 1));
}
#Tile-NewCoursesTile .panel-body {
  padding: 0px;
  background-color: #f6f9fb;
}
#Tile-NewCoursesTile #carousel-NewCoursesTile,
#Tile-NewCoursesTile #carousel-NewCoursesTile .carousel-inner > .item {
  min-height: 200px;
}
#Tile-NewCoursesTile #carousel-NewCoursesTile .carousel-inner > .item .carousel-caption {
  padding-bottom: 35px;
}
#Tile-NewCoursesTile #carousel-NewCoursesTile .carousel-inner > .item .carousel-caption h3,
#Tile-NewCoursesTile #carousel-NewCoursesTile .carousel-inner > .item .carousel-caption > * {
  color: white;
}
#Tile-NewCoursesTile #carousel-NewCoursesTile .carousel-inner > .item .carousel-caption div {
  font-size: 0.9em;
  line-height: 1.2em;
}
#Tile-NewCoursesTile #carousel-NewCoursesTile .carousel-control {
  width: 24px;
}
#Tile-NewCoursesTile #carousel-NewCoursesTile .carousel-control .glyphicon {
  font-size: calc(20px * var(--font-scale, 1));
  width: 20px;
}
/*.tile .panel {min-height:280px;}*/

#Tile-CouponTile #validCode #validfor_course {
  font-weight: bold;
}
/*Global*/

.profile-menu li.dropdown-header .timezone {
  font-size: 0.8em;
  white-space: normal;
  line-height: 1em;
}
.timezone.space-left {
  margin-left: 0.25em;
}
/*Search*/

#filtersDiv .btn-group {
  width: 100%;
  margin-bottom: 20px;
}
#filtersDiv .btn-group > .btn {
  float: none;
}
#filtersDiv .panel-body {
  max-height: 150px;
  overflow-x: auto;
  font-size: 0.9em;
}
.advancedSearchResultsSortSpan {
  margin: 0px 0px 0px 5px;
  text-transform: uppercase;
  font-size: 0.8em;
}
#SearchType label {
  font-size: 0.9em;
  width: auto;
  clear: left;
}
#resultsSortDiv {
  margin-bottom: 20px;
}
.advancedSearchResultsSortSpan {
  line-height: 1.5em;
}
.advancedSearchResultsSortSpan input[type="radio"] {
  vertical-align: middle;
  margin: 0px 2px 0px 10px;
  height: 1.5em;
}
#more {
  clear: both;
  margin: 1em 0em;
}
#advancedSearchResultsDiv .thumbnail {
  height: 340px;
  overflow: hidden;
  position: relative;
}
#advancedSearchResultsDiv .thumbnail .caption {
  cursor: pointer;
}
#advancedSearchResultsDiv .thumbnail .caption:hover .advancedSearchResultsItemTitle h3 {
  text-decoration: underline;
}
#advancedSearchResultsDiv .thumbnail img {
  max-width: 100%;
  max-height: 100px;
}
#advancedSearchResultsDiv .thumbnail .label {
  width: 70px;
  text-align: left;
  padding-left: 0px;
}
.advancedSearchResultsItemTitle {
  height: 3em;
  margin-top: 1.4em;
}
div.advancedSearchResultsItemType {
  height: 1.4em;
  position: absolute;
  top: 0px;
  right: 5%;
  background-color: #eeeeee;
  color: #888888;
  border-radius: 0px 0px 4px 4px;
  font-size: 0.8em;
  padding: 0px 0.5em;
}
.advancedSearchResultsItemDetails {
  border-top: solid 1px #dddddd;
  margin-top: 1em;
  padding-top: 0.5em;
  font-size: 0.9em;
}
.advancedSearchResultsItemDetails div {
  clear: both;
}
.advancedSearchResultsItemDetails span span {
  display: inline-block;
  width: auto;
  float: left;
}
/*.advancedSearchResultsItemDetailsLanguage > span:nth-child(2n) {text-transform:upp.list-group-itemercase;}*/

.advancedSearchResultsItemDetailsDescription {
  margin-bottom: 1em;
}
.advancedSearchResultsItemDetails .advancedSearchResultsItemDetailsDescription span {
  width: 100%;
}
/*Catalogue*/

.carousel {
  overflow: hidden;
}
#Category-Features {
  border: solid 1px #f0f3f5;
  border-radius: 6px;
  margin: 0px -15px 30px -15px;
}
#Category-Features .carousel-caption {
  width: 30%;
  min-width: 300px;
  height: 100%;
  overflow: hidden;
  top: 0px;
  left: auto;
  right: 114px;
  text-align: left;
}
@media (max-width: 767px) {
  #catalogue #Category-Features .item {
    background-image: none;
  }
  #catalogue #Category-Features .carousel-caption {
    width: 100%;
  }
}
#Category-Features .item {
  background-size: 100% auto;
}
#Category-Features .carousel-caption > * {
  margin-left: 15%;
  margin-right: 15%;
}
#Category-Features .carousel-caption > h3 {
  font-size: 1.2em;
  color: white;
}
#Category-Features .carousel-indicators,
#myCarousel .carousel-indicators {
  width: 50%;
  left: 75%;
  bottom: 5px;
}
#Category-Features .carousel-indicators {
  width: auto;
  left: auto;
  right: 129px;
  bottom: 0px;
  text-align: right;
}
#Category-Features .carousel-indicators li {
  border-color: rgba(255, 255, 255, 0.8);
}
#Category-Features .carousel-indicators li.active {
  background-color: white;
}
#Category-Features .carousel-control {
  z-index: 10;
  width: 10%;
}
#Category_Matches .tab-content {
  padding: 15px 0px;
}
#catalogue .col-md-8 #container {
  margin: 0px;
  width: 100%;
  overflow: hidden;
}
#catalogue .popover.active {
  display: block;
  position: relative;
  top: auto;
  left: auto;
  width: 100%;
  max-width: 360px;
}
#catalogue .popover.top.active {
  margin: 0px;
}
.popover.active {
  z-index: 10;
}
#catalogue .thumbnail {
  padding-bottom: 2em;
}
#categories .media {
  padding-bottom: 2em;
}
/*#categories div.list-group-item.active, #categories div.list-group-item.active:hover,#categories  div.list-group-item.active:focus {
    background-color:#428bca; border-color:#428bca; color:#fff;}*/

#Category_Matches .img-responsive {
  /*max-width:400px;*/
  float: left;
  margin-right: 1em;
  margin-bottom: 1em;
}
#categories .img-responsive {
  width: 100%;
  max-height: 150px;
  float: left;
  margin-right: 1em;
  margin-bottom: 1em;
}
#catalogue_details .custom-field {
  display: block;
  margin-bottom: 1em;
}
#catalogue_details table.activity-sessions tr > .session-start,
#catalogue_details table.activity-sessions tr > .session-end {
  max-width: 140px;
}
#catalogue_details .price.discounts-applied,
#Category_Matches .price.discounts-applied,
#Category_Matches .price.discounts-applied span {
  text-decoration: line-through;
}
#catalogue_details .price .discounts ul,
#Category_Matches .price .discounts ul {
  margin-left: 0px;
  padding-left: 1.2em;
}
#catalogue_details .discount span,
#Category_Matches .discount span,
#catalogue_details .discount em,
#Category_Matches .discount em {
  display: block;
  width: 100%;
  white-space: normal;
}
#catalogue_details #resources ul li {
  margin-bottom: 1.5em;
}
#catalogue_details #resources ul li svg {
  margin: 0px 5px 0px 0px;
  vertical-align: middle;
}
/******************************* ecommerce **************************************/

span.instructions {
  font-family: MV Boli;
  float: left;
  font-size: 1.2em;
}
#progress_bar {
  position: absolute;
  top: 0px;
  right: 0px;
  display: inline-block;
  float: right;
  z-index: 5;
}
#progress_bar.ShoppingCart-LoggedOut {
  display: none;
}
#progress_bar span.instructions {
  padding: 10px 0px 10px 10px;
}
#progress_bar span.step {
  display: inline-block;
  padding: 10px 0px;
  margin: 0px;
  width: 140px;
  text-align: left;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
  filter: alpha(opacity=50);
  -moz-opacity: 0.4;
  -khtml-opacity: 0.4;
  opacity: 0.4;
}
#progress_bar span.step span {
  display: inline-block;
  margin: 0px 5px 0px 0px;
  width: 65px;
  font-weight: normal;
  float: left;
  font-size: 0.9em;
  line-height: 1em;
}
#progress_bar span.step span.number {
  font-weight: bold;
  margin: 0px 3px 0px 5px;
  width: 2em;
  height: 2em;
  line-height: 2em;
  -webkit-border-radius: 1em;
  -moz-border-radius: 1em;
  text-align: center;
}
#progress_bar span.step.current {
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  filter: alpha(opacity=100);
  -moz-opacity: 1;
  -khtml-opacity: 1;
  opacity: 1;
}
#buy.btn.btn-primary {
  margin: 1em 0;
}
span.payment_logos {
  display: inline-block;
  float: left;
  white-space: nowrap;
}
span.payment_logos span {
  display: inline-block;
  margin-right: 10px;
  vertical-align: middle;
}
div.shoppingCartList,
div.shoppingCartMessages {
  margin-top: 50px;
}
div.shoppingCartList span.label,
div.shoppingCartMessages span.label {
  display: inline-block;
}
span.shoppingCartPrint {
  background-color: #427d8b;
  color: white;
  cursor: pointer;
  float: right;
  padding: 1px 5px;
}
/* Payment Confirmation result layout (#92305) */

.paymentConfirmHeading {
  font-weight: bold;
  font-size: calc(16px * var(--font-scale, 1));
}
.paymentConfirmRow {
  margin: 2px 0;
}
.paymentConfirmLabel {
  display: inline-block;
  min-width: 200px;
  font-weight: bold;
  font-size: calc(13px * var(--font-scale, 1));
}
.paymentEnrollmentSection {
  margin-top: 12px;
}
.paymentEnrollmentLabel {
  display: block;
  font-weight: bold;
  font-size: calc(13px * var(--font-scale, 1));
  margin-bottom: 6px;
}
span.couponUsed {
  color: #cdcdcd;
}
div.courseListDiscounts {
  position: absolute;
  top: 90px;
  left: 340px;
  background-color: #cdcdcd;
  width: 250px;
  height: auto;
  overflow: auto;
  z-index: 1000;
}
div.courseDetailsDiscounts {
  position: absolute;
  top: 90px;
  left: -240px;
  background-color: #cdcdcd;
  width: 250px;
  height: auto;
  overflow: auto;
  z-index: 1000;
}
div.courseDiscounts li {
  min-height: 10px;
  height: auto;
}
div.itemMixedPriceDetailsDiscountsDiv {
  position: absolute;
  /*top:120px;
        left:500px;*/
  background-color: #cdcdcd;
  width: 250px;
  height: auto;
  overflow: auto;
  z-index: 1000;
}
div.itemMixedPriceDetailsInfo span.label {
  display: inline-block;
}
div.itemMixedPriceDetailsHeader {
  background-color: #cdcdcd;
  color: white;
}
div.itemMixedPriceDetailsHeader span.itemMixedPriceDetailsIndex,
div.itemMixedPriceDetailsRow span.itemMixedPriceDetailsIndex {
  width: 15px;
  display: inline-block;
}
div.itemMixedPriceDetailsHeader span.itemMixedPriceDetailsForName,
div.itemMixedPriceDetailsRow span.itemMixedPriceDetailsForName {
  width: 300px;
  display: inline-block;
}
div.itemMixedPriceDetailsHeader span.itemMixedPriceDetailsForEmail,
div.itemMixedPriceDetailsRow span.itemMixedPriceDetailsForEmail {
  width: 300px;
  display: inline-block;
}
div.itemMixedPriceDetailsHeader span.itemMixedPriceDetailsQuantity,
div.itemMixedPriceDetailsRow span.itemMixedPriceDetailsQuantity {
  width: 55px;
  display: inline-block;
}
div.itemMixedPriceDetailsHeader span.itemMixedPriceDetailsPrice,
div.itemMixedPriceDetailsRow span.itemMixedPriceDetailsPrice {
  width: 65px;
  display: inline-block;
}
div.itemMixedPriceDetailsHeader span.itemMixedPriceDetailsDiscounts,
div.itemMixedPriceDetailsRow span.itemMixedPriceDetailsDiscounts {
  width: 100px;
  display: inline-block;
}
div.itemMixedPriceDetailsRow span.itemMixedPriceDetailsDiscounts,
span.itemPriceDetailsDiscounts {
  cursor: pointer;
  color: red;
}
#masthead #login_info.tab span.shoppingCartIcon,
#masthead #login_info.tab span.ms_portal_icon {
  padding: 0px 2px 0px 0px;
  height: 16px;
  cursor: pointer;
  cursor: hand;
}
#content_page #tabs span.tab span.availableTokensNumber {
  width: 10px;
  padding: 0px 10px 0px 0px;
  background-image: url("../../images/layout/UnreadReport_BG.png");
  background-repeat: no-repeat;
  color: white;
  cursor: pointer;
  display: inline-block;
  height: 16px;
  line-height: calc(16px * var(--font-scale, 1));
  text-align: center;
}
/********************** Billing Info ***************************/

fieldset .label {
  color: black;
  width: 232px;
  display: inline-block;
  text-align: left;
}
fieldset div {
  margin-bottom: 10px;
}
/*My Agenda*/

.download_calendar.panel label {
  width: auto;
  margin-right: 5px;
}
.events .address {
  word-wrap: break-word;
}
.resources .tab-content {
  padding-top: 0px;
}
.resources .tab-content ul.long_content {
  padding-left: 0px;
}
.events ul.list-group > .list-group-item .date-box > .date_container {
  background-color: #5900c1;
  color: white;
  display: inline-block;
  padding: 15px;
  text-align: center;
  min-width: 95px;
}
.events ul.list-group > .list-group-item .date-box > .date_container > .day {
  display: block;
  font-size: 2.5em;
  line-height: 1.1em;
}
.events ul.list-group > .list-group-item .date-box > .date_container > .month {
  display: block;
}
.events ul.list-group > .list-group-item img.marquee {
  max-width: 200px;
  max-height: 200px;
  object-fit: cover;
  margin: 3px 1em 1em 0;
}
.events ul.list-group > .list-group-item label {
  font-weight: bold;
  width: 100%;
  margin-bottom: 0px;
}
.events ul.list-group > .list-group-item h3 {
  font-weight: bold;
  font-family: 'Arial', 'sans-serif';
  font-size: calc(10pt * var(--font-scale, 1));
}
.events ul.list-group > .list-group-item .resources {
  width: 100%;
  clear: both;
}
.events ul.list-group > .list-group-item .event-location .provider-logo {
  margin-bottom: 10px;
}
.events ul.list-group > .list-group-item .actions .btn {
  margin-right: 5px;
}
/*Learning Activities*/

#LearningActivities #tabs #filter_by_options .dropdown-menu > li > span,
#LearningActivities #tabs #sort_by_options .dropdown-menu > li > span {
  display: block;
  padding: 3px 20px;
  clear: both;
  font-weight: 400;
  line-height: 1.42857143;
  color: #333333;
  white-space: nowrap;
  cursor: pointer;
  cursor: hand;
}
#LearningActivities #tabs #filter_by_options .dropdown-menu > li:hover > span,
#LearningActivities #tabs #sort_by_options .dropdown-menu > li:hover > span {
  background-color: #f6f6f6;
}
#LearningActivities #tabs #sort_by_options .dropdown-menu > li > span.sort .fa-check-circle,
#LearningActivities #filter_by_options .dropdown-menu > li > span.show .fa-check-circle {
  display: inline-block;
}
#LearningActivities #tabs #sort_by_options .dropdown-menu > li > span.sort .fa-circle-o,
#LearningActivities #filter_by_options .dropdown-menu > li > span.show .fa-circle-o {
  display: none;
}
#LearningActivities #tabs #sort_by_options .dropdown-menu > li > span .fa-check-circle,
#LearningActivities #filter_by_options .dropdown-menu > li > span .fa-check-circle {
  display: none;
}
#LearningActivities #tabs #sort_by_options .dropdown-menu > li > span .fa-circle-o,
#LearningActivities #filter_by_options .dropdown-menu > li > span .fa-circle-o {
  display: inline-block;
}
#LearningActivities #tabs #sort_by_options .dropdown-menu > li > span .svg-inline--fa,
#LearningActivities #filter_by_options .dropdown-menu > li > span .svg-inline--fa {
  margin: 0 0.25em 0 1em;
}
#LearningActivities .sorting,
#LearningActivities .filters {
  font-size: 0.9em;
  width: auto;
  float: right;
}
#LearningActivities .sorting label,
#LearningActivities .filters label {
  width: auto;
  float: left;
}
#LearningActivities .sorting > span,
#LearningActivities .filters .filter-type > span {
  cursor: pointer;
  float: left;
}
#LearningActivities .sorting > span.sort .fa-check-circle,
#LearningActivities .filters .filter-type > span.show .fa-check-circle {
  display: inline-block;
}
#LearningActivities .sorting > span.sort .fa-circle-o,
#LearningActivities .filters .filter-type > span.show .fa-circle-o {
  display: none;
}
#LearningActivities .sorting > span .fa-check-circle,
#LearningActivities .filters .filter-type > span .fa-check-circle {
  display: none;
}
#LearningActivities .sorting > span .fa-circle-o,
#LearningActivities .filters .filter-type > span .fa-circle-o {
  display: inline-block;
}
#LearningActivities .sorting .fa,
#LearningActivities .filters .fa {
  margin: 0 0.25em 0 1em;
}
table#MyLearningActivities .la-expand a.collapsed .fa-chevron-down,
table#MyLearningActivities .la-expand a .fa-chevron-right {
  display: none;
  visibility: hidden;
}
table#MyLearningActivities .la-expand a .fa-chevron-down,
table#MyLearningActivities .la-expand a.collapsed .fa-chevron-right {
  display: inline-block;
  visibility: visible;
}
table#MyLearningActivities .la-type .badge {
  border-radius: 4px;
  font-weight: normal;
  background-color: #e0e0e0;
  color: #333333;
  padding: 5px 8px;
}
table#MyLearningActivities .la-title .new {
  font-size: 0.9em;
  font-weight: normal;
}
table#MyLearningActivities .la-title .well {
  margin: 1em 0;
  padding: 0px;
  background-color: transparent;
  border: none 0px;
  -webkit-box-shadow: none;
  box-shadow: none;
}
table#MyLearningActivities .la-title .well .marquee {
  margin: 0 15px 15px 0;
  float: left;
}
table#MyLearningActivities .la-title .well .marquee + .description_text {
  float: left;
  width: 100%;
}
table#MyLearningActivities .la-title .well .row {
  margin: 1em -15px 0 -15px;
  font-size: 0.9em;
  clear: both;
}
table#MyLearningActivities .la-title .well .row > div {
  margin-bottom: 15px;
}
table#MyLearningActivities .la-title .well .row label {
  font-weight: bold;
}
table#MyLearningActivities .la-title .well .custom-fields .custom-field {
  margin-bottom: 1em;
}
table#MyLearningActivities .la-progress .progress {
  height: 30px;
}
table#MyLearningActivities thead > tr > th,
table#MyLearningActivities tbody > tr > th,
table#MyLearningActivities tbody > tr > td,
table#MyLearningActivities tfoot > tr > th,
table#MyLearningActivities tfoot > tr > td {
  vertical-align: top;
}
#catalogueResults table#MyLearningActivities .la-progress > .progress {
  width: 100% !important;
  min-width: 100%;
  margin: 0px;
}
#catalogueResults table#MyLearningActivities .la-progress > .progress .progress-bar > span {
  white-space: nowrap;
  line-height: calc(30px * var(--font-scale, 1));
  margin-left: 5px;
  text-align: left;
}
#catalogueResults table#MyLearningActivities tr > * {
  padding: 15px;
}
#catalogueResults table#MyLearningActivities tbody > tr > td.la-title .well > .row {
  display: flex;
  flex-wrap: wrap;
}
#catalogueResults table#MyLearningActivities tbody > tr > td.la-title .well > .row > div.col-md-4 {
  align-items: stretch;
  padding-bottom: 15px;
}
#catalogueResults table#MyLearningActivities tbody > tr > td.la-title .well > .row > div.col-md-4 > label,
#catalogueResults table#MyLearningActivities tbody > tr > td.la-title .well > .row > div.col-md-4 > div,
#catalogueResults table#MyLearningActivities tbody > tr > td.la-title .well > .row > div.col-md-4 > div.value {
  display: inline-block;
  width: 100%;
  align-items: stretch;
  margin: 0px;
  padding: 0px;
}
/*Courses/Learning Paths*/

.modal.fade.course .modal-body {
  padding: 0px;
}
.modal.course .modal-content {
  border: none 0px;
}
div.details div.col-md-5 {
  padding-right: 0px;
}
div.details div.row > div > span {
  padding-right: 0px;
}
div.details div.row > div {
  padding-bottom: 0.6em;
}
div.details div.alert-details {
  background-color: #f6f6f6;
}
#mycourse .tab-content .slide.subobjective .carousel-inner > .item .row {
  padding-left: 0px;
}
#mycourse .tab-content .slide.subobjective .carousel-inner > .item .row > li {
  display: inline-block;
  list-style-type: none;
}
#mycourse .tab-content .slide.subobjective .carousel-inner > .item .prerequisites > li {
  margin-left: 1.25em;
}
#mycourse .tab-content .panel {
  min-height: 180px;
}
#mycourse .overview img.profile.profile-thumbnail.img-thumbnail {
  max-height: 40px;
  max-width: 40px;
}
#mycourse .panel.activity .glyphicon {
  top: 0.5em;
  right: 0.5em;
  position: absolute;
}
#mycourse .panel.activity .modal-header .glyphicon {
  margin-right: 0.5em;
  position: relative;
  right: auto;
  top: auto;
}
.panel.activity .modal-body .img-thumbnail.pull-left {
  margin: 0 0.5em 0.5em 0;
  max-width: 200px;
}
.panel.activity .panel-body > .btn {
  display: block;
}
.panel .nav-tabs.lp {
  padding: 15px 15px 0px 15px;
}
#mycourse h3 {
  margin: 1em 0 0 0;
}
#mycourse .carousel-inner > .item > h3 {
  text-align: center;
}
#mycourse .carousel-control {
  width: 5%;
}
#mycourse .carousel-control.left,
#mycourse .carousel-control.right {
  background-image: none;
}
#mycourse .carousel-control .glyphicon {
  margin-right: 0px;
}
#mycourse .carousel-control .glyphicon-chevron-left,
#mycourse .carousel-control .glyphicon-chevron-right {
  top: 30px;
}
#mycourse .modal-title .label {
  margin-left: 0.5em;
}
#mycourse .panel.activity small {
  display: block;
}
#mycourse .reference h4 .svg-inline--fa,
#Courses .reference h4 .svg-inline--fa {
  margin-right: 3px;
}
#mycourse .partial_score,
#Courses .partial_score,
#StudentCourseProgress .partial_score {
  font-size: 0.8em;
  line-height: 1.2em;
  font-style: italic;
  display: inline-block;
}
.status_breakdown .list-group-item,
.status_breakdown .divider {
  display: inline-block;
  width: 100%;
}
.status_breakdown .divider {
  border-width: 2px 0 0 0;
  height: 1px;
  display: block;
}
.status_breakdown .pull-right {
  max-width: 180px;
  text-align: right;
  line-height: 1.2em;
}
/*.list-group-item.active {background-color:#eee; border-color:#ddd; color:#333; font-weight:bold;}*/

#MyCoursesNote {
  display: block;
}
#mycourse .profile.img-thumbnail {
  max-width: 40px;
  max-height: 40px;
}
#mycourse .note.approver > span + span {
  margin-left: 0.25em;
}
@media (min-width: 768px) {
  .modal-lg {
    width: 600px;
    margin: 30px auto;
  }
}
@media (min-width: 992px) {
  .modal-lg {
    width: 900px;
  }
}
.modal div.seriesCoursesWizardPages,
.modal div.seriesCoursesLPInfoDiv {
  border: none 0px;
}
ul.seriesSelectionILTSessionsDiv {
  display: block;
  margin-left: 1.8em;
}
ul.seriesSelectionILTSessionsDiv li {
  display: list-item;
  margin-left: 1.5em;
  list-style-type: disc;
  margin-bottom: 0.5em;
}
ul.seriesSelectionILTSessionsDiv li h3 {
  display: block;
}
/*Forums*/

/*#GoToForumsDropDown {max-width:90%;}*/

#MyForums th.type,
#MyForums td.type {
  text-transform: none;
}
#MyForums tr > .title {
  word-break: break-word;
  max-width: 400px;
}
#MyForums tr > .lastpost {
  word-break: break-word;
  max-width: 300px;
}
#forum_threads,
#forum_threads .row,
#replies .row {
  padding: 0px;
}
#forum_threads > li.col-md-12 {
  border-bottom: solid 1px #e7e7e7;
  margin-bottom: 1em;
}
#forum_threads .panel-heading,
#forum_threads .panel-body {
  padding: 0.5em 0.8em;
}
.author-details {
  display: inline-block;
}
.profile-container {
  display: inline-block;
  float: left;
  margin-top: 3px;
}
#one_post .jumbotron ul.original_post,
#one_post .jumbotron #post_reply_form {
  background-color: transparent;
}
/*.votes .btn {font-size:0.8em;}*/

.svg-inline--fa.fa-circle.unread {
  font-size: 0.8em;
  line-height: inherit;
  margin-right: 3px;
}
#one_post .votes .btn {
  margin-bottom: 1em;
}
#one_post .panel {
  margin-bottom: 1em;
}
#replies .row {
  border-bottom: solid 1px #dddddd;
  margin-bottom: 1em;
}
#one_post #your_reply #post_reply_form {
  background-color: transparent;
}
#post_reply_form .row {
  margin-bottom: 1em;
}
#post_reply_form textarea {
  height: 8em;
}
#MyForums .type {
  color: #bbbbbb;
  font-size: 0.8em;
  text-transform: none;
}
#MyForums .profile,
#forum_threads .profile,
.moderators .profile,
.jumbotron .profile {
  width: 40px;
  height: 40px;
  object-fit: cover;
  border-radius: 50%;
  margin-right: 5px;
  margin-bottom: 5px;
}
.forum_thread .body .edit-post,
.forum_thread .body .delete-post {
  margin-left: 0.5em;
}
#one_post .well .original_post.row .author .profile {
  max-width: 80px;
  max-height: 100px;
}
#one_post .tab-content .author .profile {
  max-width: 40px;
  max-height: 60px;
}
.question_details div .body,
.question_details .body {
  white-space: pre-line;
  display: inline-block;
  width: 100%;
}
.question_details div .body .edit-post,
.question_details .body .edit-post,
.question_details div .body .delete-post,
.question_details .body .delete-post {
  margin-left: 0.5em;
  cursor: pointer;
  cursor: hand;
}
#forum_threads .row > li.question_details > h2,
#one_post ul.original_post li.question_details > h2 {
  margin: 0px;
  word-break: break-word;
}
#one_post ul.original_post li,
.votes,
#forum_threads > li,
#forum_threads .row > li,
#replies .row > li {
  display: inline-block;
  list-style-type: none;
}
#forum_details .jumbotron .stat-summary {
  font-size: 0.5em;
}
#forum_details .jumbotron .stat-summary span {
  margin-right: 1em;
}
#forum_details .jumbotron .stat-summary span i {
  margin-right: 0.25em;
}
#forum_details {
  background-color: transparent;
}
#forum_details .forum.well,
.forum_thread .forum.well {
  display: inline-block;
  width: 100%;
  background-color: transparent;
  box-shadow: none;
  -webkit-box-shadow: none;
  padding: 0px 0px 15px 0px;
  border: none 0px;
  border-bottom: solid 1px #eeeeee;
}
.forum.well h1 {
  margin: 0px;
}
.forum.well img.profile {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  margin-right: 5px;
}
#forum_details .forum.well .forum_buttons .btn,
.forum_thread .forum.well .forum_buttons .btn {
  margin-right: 5px;
  font-size: 0.9em;
}
#forum_details + .forum_thread .thread.row.original_post {
  margin-top: 0px;
}
.forum_thread .thread.row {
  margin-right: 0px;
  margin-top: 30px;
  position: relative;
  clear: both;
}
.thread.row.original_post h2 {
  margin: 0px 0px 5px 0px;
}
.thread.row.original_post h2 p {
  margin-bottom: 0px !important;
  margin: 0px;
}
.forum_thread .thread.row.reply {
  border-left: solid 4px #dddddd;
  margin-left: 10px;
}
.forum_thread .thread.row.col-md-offset-0 {
  margin-left: 0px;
}
.forum_thread .ChildPosts {
  padding-left: 30px;
  display: inline-block;
  width: 100%;
}
.forum_thread .thread.row .svg-inline--fa.fa-caret-left {
  position: absolute;
  left: -9px;
  font-size: calc(25px * var(--font-scale, 1));
  top: -5px;
  color: #dddddd;
}
.forum_thread .thread.row .panel {
  margin-bottom: 0px;
}
.forum_thread .profile-container {
  margin: 0px 10px 10px 0px;
}
.forum_thread .profile-container .profile {
  width: 60px;
  height: 60px;
  border-radius: 50%;
}
.forum_thread .thread.row.reply .profile-container .profile {
  width: 32px;
  height: 32px;
  border-radius: 50%;
}
.forum_thread .thread.row .badge {
  background-color: white;
  color: #333333;
}
.forum_thread .thread.row .badge.btn {
  color: white;
  border-color: #5900c1;
  background-color: #5900c1;
}
.forum_thread .thread.row .badge.btn:hover,
.forum_thread .thread.row .badge.btn:active {
  text-decoration: none;
  color: white;
  border-color: #27004c;
  background-color: #27004c;
}
.forum_thread .thread.row .panel .panel-footer {
  padding: 0px;
}
.forum_thread .thread.row .panel .panel-footer .btn {
  border-radius: 0px 0px 4px 4px;
  width: 100%;
}
.forum_thread .thread.row .btn.reply {
  margin-left: 0.3em;
}
.forum_thread .thread.row .author {
  margin-bottom: 5px;
  padding-bottom: 5px;
  width: 100%;
}
.forum_thread .thread.row.reply .author small {
  margin: 0px 5px;
}
.forum_thread small + small {
  margin-left: 5px;
}
.forum_thread .profile {
  width: 50px;
  height: 50px;
  border-radius: 50%;
  border: solid 1px #eeeeee;
  object-fit: cover;
  margin-right: 5px;
  float: left;
}
.forum_thread .thumbnail {
  margin-bottom: 0px;
}
.forum_thread .thread.row .body .attachment {
  margin: 0px 0px 5px 5px;
  width: 100%;
}
#discussion.Forum_Threads .forum_thread .thread.row .body .attachment {
  margin: 0px 0px 5px 5px;
  width: auto;
}
.forum_thread .thread.row .body .attachment a {
  display: inline-block;
  clear: both;
  width: auto;
}
#forum_details .forum.well .stats {
  display: block;
  padding: 5px 0px;
}
.forum_thread .thread.row.original_post .stats {
  display: inline-block;
  padding: 0px;
}
.forum_thread .thread.row.reply .stats {
  width: 100%;
  display: inline-block;
  padding: 5px 0px;
}
.forum_thread .stats .badge,
#forum_details .forum.well .stats .badge {
  margin-right: 1em;
  border-radius: 4px;
}
#forum_details .forum.well .stats .badge {
  color: inherit !important;
  background-color: transparent;
}
.forum_thread .stats .badge.btn-disabled,
#forum_details .forum.well .stats .badge.btn-disabled {
  color: #333333 !important;
}
.forum_thread .stats .badge .fa,
#forum_details .forum.well .stats .badge .fa,
.forum_thread .stats .badge svg,
#forum_details .forum.well .stats .badge svg {
  margin-right: 0.5em;
}
.forum_thread .post_edit_delete small + small {
  margin-left: 1em;
}
.forum_thread .post_edit_delete small span[onclick],
.post_edit_delete small span[onclick].btn-small {
  color: #5900c1;
  background-color: white;
  border: solid 1px #5900c1;
  border-radius: 4px;
  text-decoration: none;
  font-weight: normal;
  cursor: pointer;
  display: inline-block;
  padding: 3px 5px;
  margin-top: 5px;
}
.forum_thread .stats small span[onclick]:hover {
  text-decoration: underline;
}
.forum_thread .stats small span[onclick] .svg-inline--fa {
  margin-right: 0.25em;
}
.forum_thread .attachment {
  position: relative;
  display: inline-block;
}
.forum_thread .attachment .fa-external-link {
  position: absolute;
  top: 1px;
  right: 1px;
  padding: 5px;
}
.forum_thread .attachment.embedded_image .fa-external-link {
  background-color: white;
  padding: 7px;
  display: inline-block;
}
.forum_thread .reply-inline {
  position: relative;
  padding: 5px 0px;
}
.forum_thread .original_post .reply-inline {
  padding: 5px 0px 5px 0px;
}
.forum_thread .reply-inline .input-group-addon:first-child {
  padding: 0px;
  vertical-align: top;
  background-color: transparent;
  border: none 0px;
}
.forum_thread .reply-inline img.profile {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  margin-right: 15px;
}
.forum_thread .reply-inline textarea.reply {
  padding-right: 30px;
  height: 34px;
}
.forum_thread .reply-inline .input-group-btn {
  white-space: nowrap;
  vertical-align: top;
  background-color: #eeeeee;
}
.forum_thread .reply-inline .btn.attachment {
  /*background-image:url(https://cdn2.iconfinder.com/data/icons/windows-8-metro-style/256/attach.png);
    background-size:16px 16px; background-repeat:no-repeat; background-position:center center;*/
  width: 34px;
  height: 34px;
  margin: 5px 0 0 0.5em;
}
.fa-rotate-45 {
  -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=1)";
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}
.forum_thread .reply-inline .btn.submit-reply {
  margin: 5px 0 0 0.25em;
}
.forum_thread .reply-inline input[type="file"] {
  cursor: inherit;
  font-size: calc(1000px * var(--font-scale, 1)) !important;
  width: 34px;
  height: 34px;
  overflow: hidden;
  margin: 0;
  padding: 0;
  opacity: 0;
  position: absolute;
  right: 0;
  bottom: 0;
}
.forum_thread .reply-inline .redactor_editor div,
.forum_thread .reply-inline .redactor_editor p,
.forum_thread .reply-inline .redactor_editor ul,
.forum_thread .reply-inline .redactor_editor ol,
.forum_thread .reply-inline .redactor_editor table,
.forum_thread .reply-inline .redactor_editor dl,
.forum_thread .reply-inline .redactor_editor blockquote,
.forum_thread .reply-inline .redactor_editor pre,
.forum_thread .redactor_editor,
.forum_thread .redactor_editor div,
.forum_thread .redactor_editor p,
.forum_thread .redactor_editor ul,
.forum_thread .redactor_editor ol,
.forum_thread .redactor_editor table,
.forum_thread .redactor_editor dl,
.forum_thread .redactor_editor blockquote,
.forum_thread .redactor_editor pre,
.forum_thread .redactor_editor h1,
.forum_thread .redactor_editor h2,
.forum_thread .redactor_editor h3,
.forum_thread .redactor_editor h4,
.forum_thread .redactor_editor h5 {
  font-size: 1em !important;
  font-family: 'Arial', 'sans-serif' !important;
}
.forum_thread .reply-inline .redactor_box {
  /*margin-left:42px;*/
  border-radius: 4px;
}
.forum_thread .reply-inline .redactor_box .redactor_toolbar {
  border-radius: 4px 4px 0 0;
  background: white;
  border-bottom: 1px solid #f0f3f5;
}
.forum_thread .reply-inline .redactor_box .redactor_toolbar li {
  padding: 0px;
}
.forum_thread .reply-inline .redactor_box .redactor_toolbar li a {
  border: none 0px;
  margin: 0px 3px;
  height: 32px;
}
.forum_thread .reply-inline .redactor_box .redactor_toolbar li.redactor_separator {
  display: none;
}
.forum_thread .reply-inline .redactor_box .redactor_editor {
  padding: 5px;
  border-radius: 0 0 4px 4px;
  font-family: 'Arial', 'sans-serif';
  min-height: 80px;
}
/*Attachment Forums, i.e. Instagram*/

div.thread.display_attachment.row {
  margin: 0px;
}
div.thread.reply.display_attachment:nth-child(3n+1) {
  clear: left;
}
div.thread.display_attachment > .question_details {
  border: 1px solid #e6e6e6;
  padding: 0px;
}
div.thread.reply.display_attachment .question_details {
  display: inline-block;
  width: 100%;
  margin-bottom: 15px;
}
div.thread.display_attachment > .question_details > div,
div.thread.display_attachment > .question_details > .attachment,
div.thread.display_attachment.row > .question_details > h3 {
  display: inline-block;
  width: 100%;
  float: left;
}
div.thread.display_attachment.row > .question_details > h3 {
  padding: 15px;
}
div.thread.display_attachment > .question_details > .author {
  border-bottom: 1px solid #e6e6e6;
  padding: 15px;
}
div.thread.display_attachment > .question_details > .author img.profile {
  vertical-align: middle;
  border: solid 1px #fefefe;
}
div.thread.reply.display_attachment .question_details > .author img.profile {
  max-width: 40px !important;
  max-height: 40px !important;
}
div.thread.display_attachment.row .question_details > p {
  padding-left: 15px;
  padding-right: 15px;
}
div.thread.display_attachment > .question_details > div {
  padding: 0px;
}
div.thread.display_attachment > .question_details > .attachment:empty {
  background-color: #e6e6e6;
  min-height: 200px;
}
div.thread.display_attachment.row .question_details .attachment img,
div.thread.reply.display_attachment > .question_details > .attachment img {
  border: none 0px;
  border-radius: 0px;
  padding: 0px;
  margin: 0px;
  width: 100% !important;
  height: auto !important;
  max-width: 2000px !important;
  max-height: 2000px !important;
}
div.thread.display_attachment .question_details .attachment .fa-external-link {
  background-color: rgba(255, 255, 255, 0.8);
}
/*div.thread.reply.display_attachment > .question_details > div {display:inline-block; width:100%; float:left;}
div.thread.reply.display_attachment > .question_details > .author {border-bottom:1px solid #e6e6e6; padding:15px;}
div.thread.reply.display_attachment > .question_details > .author img.profile {vertical-align:middle; max-width:40px !important; max-height:40px !important; border:solid 1px #fefefe;}
div.thread.reply.display_attachment > .question_details > .author > a {float:none !important;}
div.thread.reply.display_attachment > .question_details > .attachment img {
    border:none 0px; border-radius:0px; padding:0px; margin:0px; width:100% !important; height:auto !important;  max-width:1000px !important; max-height:1000px !important;}
div.thread.reply.display_attachment > .question_details > .content {padding:15px;}*/

div.thread.reply.display_attachment > .question_details > .content {
  padding: 15px;
}
div.thread.reply.display_attachment .question_details > .content .badge.btn {
  margin-bottom: 5px;
}
div.thread.reply.display_attachment .question_details > .content .badge.btn .fa,
div.thread.reply.display_attachment .question_details > .content .badge.btn svg {
  margin-right: 3px;
}
div.modal .ChildPosts {
  padding-left: 0px;
}
div.modal .ChildPosts .attachment,
div.modal .ChildPosts .attachment img {
  width: 100%;
}
div.modal .ChildPosts .thread.display_attachment {
  border: none 0px;
  width: 100%;
}
div.modal .ChildPosts .thread.display_attachment .fa-caret-left {
  display: none;
  visibility: hidden;
}
.modal.newpost .modal-body,
#editPostModal.modal .modal-body {
  padding: 0px;
}
.modal.newpost .modal-header .close,
#editPostModal.modal .modal-header .close {
  opacity: 1;
  filter: alpha(opacity=100);
  text-shadow: none;
}
.modal.newpost iframe,
#editPostModal.modal iframe {
  width: 100%;
  min-height: 480px;
  border: none 0px;
}
.redactor_box {
  border: solid 1px #eeeeee;
}
.redactor_form-control.redactor_editor {
  padding: 15px;
}
/*Visual Forums, i.e. Instagram*/

#visual.Forum_Threads .visual-masthead > .well {
  border-radius: 0px;
  border: solid 1px #eeeeee;
}
#visual.Forum_Threads .forum_buttons {
  text-align: right;
}
#visual.Forum_Threads .forum_buttons .btn {
  margin: 0px 0px 5px 5px;
}
#visual.Forum_Threads .contributors .contributor {
  margin-bottom: 5px;
}
#visual.Forum_Threads .contributors .contributor .profile_image {
  margin-right: 5px;
}
#visual.Forum_Threads .contributors .contributor .profile_image > img {
  width: 30px;
  height: 30px;
  border: solid 1px #eeeeee;
  vertical-align: middle;
  float: none;
  object-fit: cover;
}
#visual.Forum_Threads .contributors .contributor .profile_name {
  margin: 0px 5px;
  line-height: calc(48px * var(--font-scale, 1));
}
#visual.Forum_Threads .col-md-4:nth-child(3n+1) {
  clear: left;
}
#visual.Forum_Threads .thumbnail.post {
  border-radius: 0px;
  padding: 0px;
  margin: 0px 0px 15px 0px;
  display: inline-block;
  width: 100%;
}
#visual.Forum_Threads .thumbnail.post .caption {
  width: 100%;
}
#visual.Forum_Threads .thumbnail.post.comment {
  border: none 0px;
}
#visual.Forum_Threads .thumbnail.post.comment > div {
  padding: 30px 15px;
}
#visual.Forum_Threads .thumbnail.post a.attachment {
  width: 100%;
}
#visual.Forum_Threads .thumbnail.post a.attachment > img {
  object-fit: cover;
}
#visual.Forum_Threads .thumbnail.post .unread {
  position: absolute;
  top: -5px;
  right: 10px;
}
#visual.Forum_Threads .thumbnail.post > div {
  padding: 30px;
  display: inline-block;
}
#visual.Forum_Threads .thumbnail.post > div.contributor {
  padding: 15px;
  display: inline-block;
}
#visual.Forum_Threads .thumbnail.post > div.contributor img.profile {
  width: 30px;
  height: 30px;
  vertical-align: middle;
  float: none;
  object-fit: cover;
  border: solid 1px #eeeeee;
}
#visual.Forum_Threads .thumbnail.post > div.contributors a .name {
  text-decoration: underline;
}
#visual.Forum_Threads .thumbnail.post > a.attachment > img {
  width: 100% !important;
  height: 300px;
  object-fit: cover;
}
#visual.Forum_Threads .thumbnail.post.thread > a.attachment > img {
  width: 100% !important;
  height: 200px !important;
  object-fit: cover;
}
#visual.Forum_Threads .one-thread .thumbnail.post.thread > a.attachment > img {
  width: 100% !important;
  height: auto !important;
  object-fit: cover;
}
#visual.Forum_Threads .thumbnail.post > a.attachment > .fa-external-link {
  display: none;
  visibility: hidden;
}
/*.Forum_Threads .thumbnail.post .stats {font-size:1em; margin-bottom:15px;}
.Forum_Threads .thumbnail.post .stats > .stat:hover {color:@Links-Text-Color;}
.Forum_Threads .thumbnail.post .stats > .stat {margin-right:15px;}
.Forum_Threads .thumbnail.post .stats > .stat.date-posted {border-left:solid 1px #eee; display:inline-block; padding-left:15px;}
.Forum_Threads .thumbnail.post .stats > .stat > .fa
    .Forum_Threads .thumbnail.post .stats > .stat > svg {margin-right:5px;}*/

#visual.Forum_Threads .thumbnail {
  padding: 0px;
}
#visual.Forum_Threads .thumbnail > .contributor {
  border-bottom: 1px solid #dddddd;
}
#visual.Forum_Threads .thumbnail > .attachment {
  padding: 0px;
}
#visual.Forum_Threads .thumbnail > * {
  padding: 15px;
}
#visual.Forum_Threads .thumbnail > .attachment {
  padding: 0px;
}
#visual.Forum_Threads .thumbnail > .attachment a {
  width: 100%;
}
#visual.Forum_Threads .thumbnail > .attachment img {
  width: 100%;
  max-height: 100%;
  object-fit: cover;
}
#visual.Forum_Threads .thumbnail.comment > .attachment img {
  max-height: 300px !important;
}
#visual.Forum_Threads .thumbnail > .attachment.document {
  color: white;
  background-color: #5900c1;
  min-height: 200px;
  margin-bottom: 0px;
  position: relative;
  border-radius: 0px;
}
#visual.Forum_Threads .thumbnail > .attachment.document > .svg-inline--fa {
  color: white;
  position: absolute;
  top: 50%;
  left: 50%;
  margin: -30px 0px 0px -25px;
  padding: 0px;
  font-size: calc(60px * var(--font-scale, 1));
}
#visual.Forum_Threads .thumbnail > .attachment > .fa #visual.Forum_Threads .thumbnail > .attachment > svg {
  margin: 0px auto;
  line-height: 100%;
  color: white;
}
#visual.Forum_Threads .thumbnail > .attachment > .fa-external-link {
  display: none;
  visibility: hidden;
}
#visual.Forum_Threads .visual-threads .thumbnail.post.thread .stats {
  margin-bottom: 15px;
  padding-bottom: 15px;
}
#visual.Forum_Threads .visual-threads .post .stats > .stat,
#visual.Forum_Threads .visual-threads .post .stats > * {
  margin-right: 15px;
}
#visual.Forum_Threads .visual-threads .post .stats > .stat.date-posted {
  display: block;
  border-top: solid 1px #eeeeee;
  margin: 5px 0px 15px 0px;
  padding: 5px 0px 0px 0px;
  font-size: 1em;
}
#visual.Forum_Threads .visual-threads .post .stats > .stat.date-posted > .post_edit_delete {
  display: inline-block;
  float: right;
  padding-top: 5px;
  margin-top: 5px;
  margin-bottom: 15px;
}
#visual.Forum_Threads .visual-threads .thumbnail.post.thread .stats > .post_edit_delete > small {
  display: inline-block;
  padding-left: 15px;
  font-size: 1em;
}
#visual.Forum_Threads .visual-threads .post .post_edit_delete > small + small {
  margin-left: 5px;
}
#visual.Forum_Threads .visual-threads .post .post_edit_delete > small > .svg-inline--fa {
  margin-right: 5px;
}
#visual.Forum_Threads .visual-threads .post .stats > small {
  margin-right: 0px;
}
#visual.Forum_Threads .visual-threads .thumbnail.post.comment .stats > small.delete {
  margin-right: 0px;
}
#visual.Forum_Threads .visual-threads .thumbnail.post.comment .stats > small.delete + .move {
  margin-left: 15px;
}
#visual.Forum_Threads .visual-threads .thumbnail.post.thread .stats > small {
  display: none;
  visibility: hidden;
}
#visual.Forum_Threads .visual-threads .post .stats > * .fa,
#visual.Forum_Threads .visual-threads .post .stats > * svg {
  margin-right: 5px;
}
#visual.Forum_Threads .visual-masthead .stats .stat {
  background-color: rgba(255, 255, 255, 0.5);
}
#visual.Forum_Threads .visual-threads .comment {
  padding-left: 40px;
}
#visual.Forum_Threads .visual-threads .comment .stats {
  display: block;
  width: 100%;
  padding-left: 40px;
}
/*Blog Forums*/

#blog.Forum_Threads .blog-masthead > .well {
  border-radius: 0px;
  border: solid 1px #eeeeee;
}
#blog.Forum_Threads .blog-info > * {
  padding: 0px 0px 30px 0px;
  border-bottom: solid 1px #eeeeee;
  margin-bottom: 30px;
}
#blog.Forum_Threads .blog-info .contributors .contributor {
  margin-bottom: 10px;
}
#blog.Forum_Threads .blog-info .contributors .contributor .profile_image {
  margin-right: 5px;
}
#blog.Forum_Threads .blog-info .contributors .contributor .profile_image > img {
  width: 40px;
  height: 40px;
  object-fit: cover;
  vertical-align: middle;
  float: none;
  border: solid 1px #eeeeee;
}
#blog.Forum_Threads .blog-info .contributors .contributor .profile_name {
  margin-right: 5px;
}
#blog.Forum_Threads .blog-info .forum_stats {
  display: inline-block;
  width: 100%;
}
#blog.Forum_Threads .blog-info .forum_buttons {
  text-align: left;
}
#blog.Forum_Threads .blog-info .forum_buttons .btn {
  margin: 0px 0px 5px 5px;
}
#blog.Forum_Threads .blog-threads .post.latest-post,
#blog.Forum_Threads .blog-threads .post {
  border: solid 1px #eeeeee;
  margin: 0px 0px 15px 0px;
}
#blog.Forum_Threads .blog-threads .post .svg-inline--fa.unread {
  position: absolute;
  top: -5px;
  right: 10px;
}
#blog.Forum_Threads .blog-threads .post h3 {
  font-size: 1.4em;
  line-height: 1.2em;
}
#blog.Forum_Threads .blog-threads .post.latest-post .attachment {
  width: 100% !important;
  height: auto !important;
  display: inline-block;
  width: 100%;
}
#blog.Forum_Threads .blog-threads .post.latest-post .attachment > .fa,
#blog.Forum_Threads .blog-threads .post.latest-post .attachment > svg {
  display: none;
  visibility: hidden;
}
#blog.Forum_Threads .blog-threads .post.latest-post .attachment > img {
  padding: 0px;
  width: 100% !important;
  height: 100% !important;
  min-height: 200px;
  object-fit: cover;
}
#blog.Forum_Threads .blog-threads .post.latest-post .caption {
  padding: 15px;
  display: inline-block;
  width: 100%;
}
.Forum_Threads .comments {
  margin-top: 15px;
}
.Forum_Threads .comments .thumbnail {
  display: inline-block;
  width: 100%;
}
.Forum_Threads .comments .badge {
  margin-left: 5px;
  color: white;
  border-color: #5900c1;
  background-color: #5900c1;
}
#blog.Forum_Threads .comments .post + .post {
  margin-top: 30px;
  border-top: solid 1px #eeeeee;
  padding-top: 30px;
}
.Forum_Threads .comments .post .text-content > *,
#post_reply_form > * {
  margin-left: 58px;
}
.Forum_Threads .comments .post .text-content > .contributor,
.Forum_Threads .comments .post .text-content > .stats,
#post_reply_form > .profile_image {
  margin-left: 0px;
}
.Forum_Threads .comments .profile_image,
#post_reply_form > .profile_image {
  width: 48px;
  height: 48px;
  margin-right: 10px;
  object-fit: cover;
}
.Forum_Threads .comments .post .text-content > .stats > span,
.Forum_Threads .comments .post .text-content > .stats > small {
  margin-right: 15px;
}
.Forum_Threads .comments .post .text-content > .stats > span > .svg-inline--fa,
.Forum_Threads .comments .post .text-content > .stats > small .fa,
.Forum_Threads .comments .post .text-content > .stats > small svg {
  margin-right: 5px;
}
.Forum_Threads .comments .post .embedded_media {
  max-width: 300px;
}
#blog.Forum_Threads .blog-threads .post .attachment {
  height: 100% !important;
  text-align: center;
}
#blog.Forum_Threads .blog-threads .post .attachment.document {
  color: white;
  background-color: #5900c1;
  min-height: 200px;
  margin-bottom: 0px;
  position: relative;
  border-radius: 0px;
}
#blog.Forum_Threads .blog-threads .post .attachment.document > .fa,
#blog.Forum_Threads .blog-threads .post .attachment.document > svg {
  color: white;
  position: absolute;
  top: 50%;
  left: 50%;
  margin: -30px 0px 0px -25px;
  font-size: calc(60px * var(--font-scale, 1));
}
#blog.Forum_Threads .blog-threads .post .attachment > .fa,
#blog.Forum_Threads .blog-threads .post .attachment > svg {
  margin: 0px auto;
  line-height: 100%;
  color: white;
}
#blog.Forum_Threads .blog-threads .post .attachment > .fa-external-link {
  display: none;
  visibility: hidden;
}
#blog.Forum_Threads .blog-threads .post .attachment > img {
  padding: 0px;
  width: 100% !important;
  height: 100% !important;
  min-height: 200px;
  object-fit: cover;
}
#blog.Forum_Threads .blog-threads .post .text-content {
  padding: 15px;
}
#blog.Forum_Threads .blog-threads .post .contributor,
#blog.Forum_Threads .blog-threads .post .stats {
  display: inline-block;
  width: 100%;
  margin-bottom: 8px;
}
#blog.Forum_Threads .blog-threads .post .contributor img.profile-pic,
#blog.Forum_Threads .blog-threads .post .contributor img.profile_image {
  vertical-align: middle;
  float: none;
  object-fit: cover;
}
#blog.Forum_Threads .blog-masthead .stats stat {
  border: solid 1px #eeeeee;
}
#blog.Forum_Threads .blog-threads .post .stats > .stat,
#blog.Forum_Threads .blog-threads .post .stats > * {
  margin-right: 15px;
}
#blog.Forum_Threads .blog-threads .post .stats > .post_edit_delete {
  display: block;
  border-top: solid 1px #eeeeee;
  padding-top: 5px;
  margin-top: 5px;
  margin-bottom: 15px;
}
#blog.Forum_Threads .blog-threads .post .stats > .post_edit_delete > small {
  display: inline-block;
  padding-left: 15px;
  font-size: 1em;
}
#blog.Forum_Threads .blog-threads .post .stats > * .svg-inline--fa,
#blog.Forum_Threads .blog-threads .post .stats > .post_edit_delete > small > .fa,
#blog.Forum_Threads .blog-threads .post .stats > * svg,
#blog.Forum_Threads .blog-threads .post .stats > .post_edit_delete > small > svg {
  margin-right: 5px;
}
/*Chatrooms*/

#ChatRoomModal .modal-body {
  padding: 0px;
  min-height: 400px;
}
#ChatRoomModal #ChatRoomIframe {
  width: 100%;
  height: 100%;
  min-height: 400px;
  border: none 0px;
}
/*Wall*/

.wallposts #posts {
  min-width: 200px;
  word-wrap: break-word;
  float: right;
  position: relative;
  top: 19px;
  margin: 0;
}
.wallposts #posts ul {
  display: block;
  margin: 0px;
  padding: 0px;
}
.wallposts #posts li.post {
  border-bottom: solid 1px #e8e8e8;
  display: inline-block;
  margin: 0px;
  padding: 15px;
}
.wallposts #posts li.post:first-child {
  border-top: solid 1px #e8e8e8;
}
.wallposts #posts li.post:hover {
  background-color: #f8f8f8;
}
.wallposts #posts li.post div.wallcontainer {
  background-color: transparent;
  display: inline-block;
  width: 100%;
}
.wallposts #posts li.post div.wallcontainer .btn.remove-wall-post {
  clear: both;
}
.wallposts #posts li.post div.wallcontainer .profile-pic {
  margin: 0px 0.5em 0.5em 0px;
}
.wallposts #posts li.post div.wallcontainer .modal .modal-header {
  clear: both;
  display: inline-block;
  width: 100%;
}
.wallposts #posts li.post div.wallcontainer .screenname {
  display: block;
}
.wallposts #posts li.post div.wallcontainer .post_details {
  display: block;
  font-size: 0.8em;
  color: #666666;
}
/*Portfolio*/

body.modal.userprofile > #content.container {
  width: 100%;
}
#LearnerPortfolio .jumbotron img.profile_pic {
  margin: 15px;
}
#LearnerPortfolio .jumbotron div {
  font-size: 1em;
  line-height: 1.4;
}
#LearnerPortfolio .jumbotron #portfolio_stats {
  margin-top: 30px;
}
#LearnerPortfolio .jumbotron #portfolio_stats div[data-count="0"] {
  display: none;
  visibility: hidden;
}
#LearnerPortfolio .jumbotron #portfolio_stats .stat {
  background-color: #ffffffde;
  padding: 15px;
  margin: 0px;
  text-align: center;
  display: inline-block;
  float: left;
  width: 100%;
  height: 100%;
}
body.modal.userprofile #LearnerPortfolio .jumbotron #portfolio_stats .stat {
  min-width: 110px;
}
#LearnerPortfolio .jumbotron #portfolio_stats .stat label {
  font-weight: bold;
  width: 100%;
  text-align: center;
}
#LearnerPortfolio .jumbotron #portfolio_stats .stat .count {
  font-size: 2em;
  line-height: 1.2em;
}
#LearnerPortfolio .jumbotron #portfolio_stats .stat .icon {
  font-weight: bold;
  width: 100%;
}
#LearnerPortfolio .jumbotron #portfolio_stats .stat .icon img,
#LearnerPortfolio .jumbotron #portfolio_stats .stat .icon .fa,
#LearnerPortfolio .jumbotron #portfolio_stats .stat .icon svg {
  font-size: calc(36px * var(--font-scale, 1));
  width: 36px;
  height: 36px;
}
#LearnerPortfolio .card .card-body {
  padding: 15px;
}
.complete-msg {
  font-style: italic;
  font-weight: bold;
}
/*My Profile*/

#transcriptTabsPanel {
  display: inline-block;
}
xhtml[myprofile] #tabs {
  display: none;
}
.myprofile .nav-tabs {
  margin-bottom: 1em;
}
.myprofile .tab-pane {
  display: none !important;
}
.myprofile .tab-pane.active {
  display: block !important;
}
.myprofile .tab-pane.active fieldset {
  border: none 0px;
  margin-bottom: 1em;
  padding: 0px;
}
.myprofile .tab-pane.active legend {
  display: block !important;
  padding: 0.5em 0;
  margin: 1em 0 0.5em 0;
}
.myprofile .form-horizontal .form-group {
  margin-right: 0px;
  margin-left: 0px;
}
.myprofile .form-horizontal .control-label {
  padding: 6px 0px;
  text-align: left;
}
.myprofile input[type=checkbox] + label {
  width: auto;
  margin-left: 0.5em;
}
/* New myprofile */

.student-profile .card {
  border-radius: 10px;
}
.student-profile .card .card-header .profile_img {
  width: 150px;
  height: 150px;
  object-fit: cover;
  margin: 10px auto;
  /*border: 10px solid #ccc;
    border-radius: 50%;*/

}
.student-profile .card h3 {
  font-size: calc(20px * var(--font-scale, 1));
  font-weight: 700;
}
.student-profile .card p {
  font-size: calc(16px * var(--font-scale, 1));
  color: black;
}
.student-profile .table th,
.student-profile .table td {
  font-size: calc(14px * var(--font-scale, 1));
  padding: 5px 10px;
  color: black;
}
/* End */

/*Media Cards*/

#mediaResults.flex-row {
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
  align-content: stretch;
  justify-content: flex-start;
  align-items: stretch;
  row-gap: 30px;
}
#mediaResults.flex-row .media.card {
  position: relative;
  display: flex;
  flex-direction: column;
  word-wrap: break-word;
  background-clip: border-box;
  border: 1px solid #eeeeee;
  border-radius: 4px;
  overflow: hidden;
  width: 100%;
  height: 100%;
}
body.media {
  overflow: scroll !important;
}
.media.card .card-img-top-container {
  background-color: #cccccc;
  height: 200px;
  overflow: hidden;
}
.media.card .card-img-top-container > img {
  height: 200px;
  width: 100%;
  object-fit: cover;
  object-position: center center;
}
.media.card .card-img-top-container > svg {
  height: 90% !important;
  width: auto !important;
  object-fit: cover;
  object-position: center center;
  margin: 10px;
}
.media.card .card-body {
  flex: 1 1 auto;
  padding: 15px;
  color: var(--bs-card-color);
}
.media.card .card-body .card-title,
.media.card .card-body .card-text {
  margin-bottom: 1em;
}
#transcriptsPanel span.courseTitle {
  display: inline-block;
}
#TranscriptExtras-Content {
  border: 1px solid #dddddd;
}
.availability .dayName,
.availability .dayAvailability,
.availability .exceptionDate,
.availability .regularDate {
  display: inline-block;
}
.availability .dayName,
.availability .exceptionDate {
  width: 120px;
}
ul.supervisors li {
  display: list-item;
  list-style-type: disc;
  margin-left: 2em;
}
#ForwardOptionDiv .form-control {
  width: auto;
  height: auto;
}
.ForwardOption ul {
  margin-left: 0px;
}
.ForwardOption .label,
.ForwardOption label {
  width: auto;
}
.myprofile table#CustomMetadata4_FieldTable {
  border-top: solid 1px #dddddd;
}
.myprofile table#CustomMetadata4_FieldTable,
.myprofile table#CustomMetadata1_FieldTable {
  width: 100%;
  max-width: 100%;
}
.myprofile table#CustomMetadata1_FieldTable tr > *,
.myprofile table#CustomMetadata4_FieldTable tr > * {
  padding: 8px 8px 8px 0px;
  vertical-align: top;
  line-height: 1.42857143;
  border-top: 1px solid #dddddd;
}
.myprofile table#CustomMetadata1_FieldTable span.label,
.myprofile table#CustomMetadata4_FieldTable span.label {
  white-space: normal;
}
.myprofile table#CustomMetadata1_FieldTable tr > * {
  width: 75%;
  padding-left: 15px;
}
.myprofile table#CustomMetadata1_FieldTable tr > *:first-child {
  width: 25%;
  padding-left: 0px;
}
#EditAccountDetails .btn > .fa,
#EditAccountDetails .btn > svg {
  margin-right: 5px;
}
#EditAccountDetails .tc metadata.form-group,
.myprofile .form-horizontal .form-group {
  margin: 0px;
  padding: 5px 15px;
  border-bottom: solid 1px #f0f3f5;
}
#EditAccountDetails .tc.metadata .controls.col-md-6 {
  width: 100%;
}
#EditAccountDetails .tc.metadata .controls.col-md-6 > * {
  display: inline-block;
  float: left;
  width: 300px;
  max-width: 100%;
}
#EditAccountDetails .tc.metadata .controls.col-md-6 > label {
  width: 200px !important;
  max-width: 100% !important;
  float: left;
  margin-right: 5px;
}
#EditAccountDetails .tc.metadata .controls.col-md-6 > label + .ro.learner.value + input {
  display: none;
  visibility: hidden;
}
#EditAccountDetails #block2 input[type="checkbox"] {
  float: left;
}
#EditAccountDetails #block2 input[type="checkbox"] + label {
  display: inline-block;
  float: left;
  margin-right: 2em;
}
.myprofile > .col-md-12 > .container {
  width: 100%;
}
/*Portfolio - aka public profile*/

#LearnerPortfolio img.img-round.profile_pic {
  width: 200px;
  height: 200px;
  object-fit: cover;
  object-position: center;
}
body.userprofile.modal #LearnerPortfolio img.img-round.profile_pic {
  width: 120px;
  height: 120px;
  object-fit: cover;
}
#LearnerPortfolio .display-flex {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: space-between;
  align-items: stretch;
  margin: 0px -15px 30px -15px;
}
#LearnerPortfolio .display-flex > .card {
  margin: 15px 15px 30px 15px;
}
#LearnerPortfolio .display-flex > .card .card-body {
  padding: 30px;
}
#LearnerPortfolio .display-flex > .card .card-body .row > div {
  margin-bottom: 1em;
}
#LearnerPortfolio .display-flex > .card .card-body label {
  width: 100%;
  max-width: 100%;
  margin-bottom: 0px;
  font-weight: bold;
}
#StudentCourseProgress th[align="center"],
#StudentCourseProgress td[align="center"] {
  text-align: center;
}
.course_progress .objective,
.course_progress .objective > td,
.course_progress .objective > td.score {
  float: none;
}
#pie_chart {
  width: auto !important;
  clear: right;
}
#pie_chart rect {
  fill: transparent !important;
}
#pie_chart .ct-chart-pie {
  min-height: 260px;
  padding: 10px;
  overflow: visible;
}
#pie_chart .ct-chart-pie path.ct-slice.ct-donut {
  fill: transparent;
  fill-opacity: 0;
}
#pie_chart .ct-chart-pie text.ct-label {
  stroke: none;
}
#pie_chart .ct-chart-pie .ct-series-a {
  stroke: white;
}
#pie_chart .ct-chart-pie .ct-series-b {
  stroke: #cccccc;
}
#pie_chart .ct-chart-pie .ct-series-c {
  stroke: #5900c1;
}
@media print {
  #pie_chart {
    float: right;
    min-height: 100px;
  }
  #pie_chart .ct-chart-pie {
    margin-right: 50%;
  }
  #pie_chart .ct-chart-pie .ct-series-a {
    stroke: #eeeeee;
    -webkit-print-color-adjust: exact;
  }
  #pie_chart .ct-chart-pie .ct-series-b {
    stroke: #aaaaaa;
    -webkit-print-color-adjust: exact;
  }
  #pie_chart .ct-chart-pie .ct-series-c {
    stroke: black;
    -webkit-print-color-adjust: exact;
  }
  ul.legend .ct-series-a {
    fill: #aaaaaa;
    background-color: #eeeeee !important;
    -webkit-print-color-adjust: exact;
  }
  ul.legend .ct-series-b {
    fill: #eeeeee;
    background-color: #aaaaaa !important;
    -webkit-print-color-adjust: exact;
  }
  ul.legend .ct-series-c {
    fill: black;
    background-color: black !important;
    -webkit-print-color-adjust: exact;
  }
  table.course_progress th {
    font-size: 1em;
  }
  table.course_progress td:empty {
    display: table-cell !important;
  }
  table.course_progress .progress_bar.text-center.hidden-sm {
    display: table-cell !important;
  }
}
ul.legend {
  clear: right;
}
ul.legend li {
  display: inline-block;
  float: left;
}
ul.legend li svg {
  margin-right: 0.25em;
  margin-left: 1em;
}
ul.legend li svg rect {
  fill: transparent !important;
}
@media screen {
  ul.legend .ct-series-a {
    background-color: white !important;
  }
  ul.legend .ct-series-b {
    background-color: #cccccc !important;
  }
  ul.legend .ct-series-c {
    background-color: #5900c1 !important;
  }
}
.course_progress .objective.tableSubHeader > * {
  background-color: #cccccc !important;
}
#CourseReport .button_container {
  display: flex;
  flex-direction: row-reverse;
  flex-wrap: nowrap;
  align-content: stretch;
  align-items: stretch;
  justify-content: flex-start;
  column-gap: 10px;
}
#CourseReport .label,
#ProgressOverview .summary-info .label {
  width: 135px;
  float: left;
  clear: left;
}
#CourseReport .formContent,
#ProgressOverview .summary-info .formContent {
  float: left;
}
#ProgressOverview .summary-info {
  /*margin: 0px 15px 15px 15px;*/
  padding-left: 30px;
}
table#MyPurchasesGrid {
  border: none 0px;
  margin: 1em 0;
}
table#MyPurchasesGrid tr > th.tablesorter-header {
  cursor: pointer;
}
table#MyPurchasesGrid tr > * {
  text-align: right;
}
table#MyPurchasesGrid tr > *:first-child {
  text-align: left;
}
/* My profile constsuction */

.student-profile .card {
  border-radius: 10px;
}
.shadow-sm {
  box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075) !important;
}
.card {
  position: relative;
  display: flex;
  flex-direction: column;
  min-width: 0;
  word-wrap: break-word;
  background-color: white;
  background-clip: border-box;
  border: 1px solid rgba(0, 0, 0, 0.125);
}
/* *******************My Transcripts********************* */

/*Transcripts*/

.training-title {
  color: #5900c1;
  font-weight: normal;
  text-decoration: underline;
  cursor: pointer;
}
.training-title:hover {
  text-decoration: none;
}
#btnSaveCeu {
  clear: right;
  margin-bottom: 1em;
}
#transcript_list td.title .activity-title {
  font-weight: bold;
}
#transcript_list td.title label {
  width: 100%;
  display: block;
  margin: 5px 0px 0px 0px;
  font-weight: normal;
}
#MyTranscripts .nav-tabs.date-range {
  border: none 0px;
}
#MyTranscripts .date-filter {
  margin: 15px 0px 0px 0px;
  padding: 5px 15px;
  border-radius: 8px 8px 0px 0px;
  background-color: white;
  color: #333333;
}
#MyTranscripts .nav-tabs.date-range li {
  border-bottom: solid 2px white;
}
#MyTranscripts .date-filter label {
  max-width: 300px;
}
#MyTranscripts .date-filter .form-control {
  max-width: 156px;
  display: inline-block;
  margin-left: 5px;
  margin-right: 15px;
}
#MyTranscripts .date-filter .btn-default {
  padding: 5px 15px;
}
#MyTranscripts #list_filters_sorting > div {
  padding: 0px;
}
#MyTranscripts #list_filters_sorting #filter_by_options li.dropdown-header {
  clear: both;
}
#MyTranscripts #list_filters_sorting #filter_by_options li {
  clear: both;
}
#MyTranscripts #transcript-search-container {
  min-width: 282px;
}
#MyTranscripts #transcript-search-container #transcript_search {
  max-width: 222px;
}
#MyTranscripts #transcript-search-container .clear-search {
  cursor: pointer;
  cursor: hand;
  margin-left: 0.5em;
  line-height: calc(34px * var(--font-scale, 1));
}
#MyTranscripts #transcript-filters-sort .btn-group {
  margin-right: 10px;
}
#MyTranscripts #transcript-filters-sort .btn-group .dropdown-menu {
  min-width: 180px;
  max-height: 200px;
  overflow: auto;
}
#MyTranscripts #transcript-filters-sort .btn-group .dropdown-menu > li {
  color: #333333;
}
#MyTranscripts #transcript-filters-sort .btn-group .dropdown-menu > li span:hover {
  background-color: #5900c1;
  color: white;
}
#MyTranscripts #transcript-filters-sort .btn-group .dropdown-menu > li span {
  display: inline-block;
  width: 100%;
  padding: 5px 10px;
  cursor: pointer;
  cursor: hand;
}
#MyTranscripts #transcript-filters-sort .btn-group .dropdown-menu > li span svg {
  margin-right: 4px;
}
#MyTranscripts #transcript-filters-sort .btn-group .dropdown-menu > li span .fa-circle-check {
  display: none;
  visibility: hidden;
}
#MyTranscripts #transcript-filters-sort .btn-group .dropdown-menu > li span.show .fa-circle,
#MyTranscripts #transcript-filters-sort .btn-group .dropdown-menu > li span.selected .fa-circle,
#MyTranscripts #transcript-filters-sort .btn-group .dropdown-menu > li span.show.selected .fa-circle {
  display: none;
  visibility: hidden;
}
#MyTranscripts #transcript-filters-sort .btn-group .dropdown-menu > li span.show .fa-circle-check,
#MyTranscripts #transcript-filters-sort .btn-group .dropdown-menu > li span.selected .fa-circle-check,
#MyTranscripts #transcript-filters-sort .btn-group .dropdown-menu > li span.show.selected .fa-circle-check {
  display: inline-block;
  visibility: visible;
}
#MyTranscripts #transcript-filters-sort .btn-group .dropdown-menu > li ul {
  padding-left: 0px;
}
#MyTranscripts #transcript-filters-sort .btn-group .dropdown-menu > li ul li.credit-category span {
  padding: 5px 10px 5px 27px;
}
#MyTranscripts #transcript-filters-sort .btn-group .dropdown-menu > li.credit-category + .credit-provider {
  border-top: solid 1px #cccccc;
}
#selected-filters {
  line-height: calc(30px * var(--font-scale, 1));
}
#selected-filters .filter {
  display: inline-block;
  float: left;
  margin: 0px 0px 0px 15px;
  padding: 0px 0px 0px 10px;
  background-color: #5900c1;
  color: white;
}
#selected-filters .filter .remove {
  display: inline-block;
  padding: 0px 10px;
  margin-left: 10px;
  cursor: pointer;
  cursor: hand;
  background-color: white;
  color: #333333;
}
#filter-description {
  margin: 15px 0 0 0;
}
#filter-description > span {
  margin-right: 0.5em;
}
#filter-description > span:before {
  content: " | ";
  margin-right: 0.5em;
}
#filter-description > label + span.hidden:before,
#filter-description > label + span:before,
#filter-description > label + span.hidden + span:before,
#filter-description > label + span.hidden + span.hidden + span:before,
#filter-description > label + span.hidden + span.hidden + span.hidden + span:before,
#filter-description > label + span.hidden + span.hidden + span.hidden + span.hidden + span:before {
  display: none;
}
@media (max-width: 767px) {
  #transcript_list #transcripts_completed tr > .credit-categories.text-center,
  #transcript_list #transcripts_completed tr > .credits-awarded.text-center {
    text-align: left;
  }
  #transcript_list #transcripts_completed tr > .total-credits.credits-awarded.text-right,
  #transcript_list #transcripts_completed tr > .total-credits.credits-awarded.text-center {
    text-align: center;
  }
  #transcript_list #transcripts_completed tfoot > tr > th:empty {
    display: none;
  }
}
@media (max-width: 499px) {
  #transcript_list #transcripts_completed tr > .total-credits.credits-awarded.text-center {
    text-align: right;
  }
  #transcript_list div.sdms-approval-number,
  #transcript_list div.domain {
    margin: 10px 0px 10px 0px;
  }
}
#transcript_list .digital-signature > span {
  font-size: 0.9em;
}
#transcript_list .actions {
  white-space: normal;
}
#transcript_list .actions .btn {
  margin-top: 2px;
  margin-bottom: 2px;
}
#transcript_list tbody tr > .credit-categories .credit-provider-container + .credit-provider-container {
  margin-top: 1em;
}
#transcript_list tbody tr > .credit-categories .credit-provider {
  font-weight: bold;
}
/*#transcript_list tbody tr > .credit-categories .credit-provider:after,
    #transcript_list tbody tr > .credit-categories .credit-category .credit-category-name:after {content:":";}*/

/*#transcript_list tbody tr > .credit-categories .credit-category  {white-space:nowrap;}*/

/*Credentials Page*/

#creditCategoriesDIV.panel-group {
  margin: 30px 0px;
}
#creditCategoriesDIV.panel-group .panel-collapse {
  padding: 15px;
}
/*My Codes aka My Coupons*/

table.allocations td.expand span.collapse {
  display: inline-block;
  visibility: visible;
  cursor: pointer;
  cursor: hand;
}
table.allocations td.expand span.collapse[data-collpase="collapsed"] .fa-chevron-down {
  display: none;
  visibility: hidden;
}
table.allocations td.expand span.collapse[data-collpase="expanded"] .fa-chevron-right {
  display: none;
  visibility: hidden;
}
/*Login*/

.login-logo {
  width: 100%;
  max-height: 300px;
  margin-bottom: 1em;
}
#login_page fieldset > legend {
  display: block;
}
#Login .form-group {
  margin-right: 0px;
  margin-left: 0px;
}
#Login .control-label {
  text-align: left;
  width: 180px;
}
#Login #registrationButtonSpan {
  display: none;
}
#login_page span.button input {
  background-color: transparent;
  border: none 0px;
}
#dividerDiv {
  margin-top: 1em;
}
#login_page .select2-container.form-control {
  padding: 0px;
  border-radius: 4px;
}
#login_page .select2-dropdown-open .select2-choice,
#login_page .select2-container .select2-choice {
  margin: 0px 0px;
  height: 34px;
  padding: 0px 20px 0px 12px;
  box-shadow: none;
  background: transparent;
  border: none 0px;
}
#login_page .select2-dropdown-open .select2-choice > *,
#login_page .select2-container .select2-choice > * {
  height: 34px;
}
#login_page .federatedIcon {
  height: 30px;
  width: 30px;
  margin-right: 5px;
}
#login_page #FederationLoginButton {
  margin-left: 0.25em;
}
#login_page .select2-container.form-control > * {
  border-radius: 4px;
}
/* Adjusting custom css for line height - PCA skin */

.gigya-composite-control > p {
  line-height: 1.2 !important;
}
body.Login.Login_compressed > #content.container {
  padding: 0px 15px 30px 15px;
}
body.Login.Login_compressed #log_in_bar.container,
body.Login.Login_compressed #masthead.container,
body.Login.Login_compressed #content.container,
body.Login.Login_compressed #footer.container {
  max-width: 400px;
}
body.Login.Login_compressed > .container:first-child {
  margin-top: 45px;
}
body.Login.Login_compressed #masthead .notloggedin {
  padding: 30px 30px 0px 30px;
}
body.Login.Login_compressed #masthead #logo {
  margin: 30px 30px 0px 30px;
}
body.Login.Login_compressed #masthead.container #logo img {
  max-height: 100px;
}
body.Login.Login_compressed #masthead.container > .row > div {
  width: 100%;
}
body.Login.Login_compressed #content.container #login_page {
  padding: 0px 45px;
}
body.Login.Login_compressed #content.container #login_page > * {
  width: 100%;
}
body.Login.Login_compressed #content.container .log-in-form {
  padding: 0px;
}
body.Login.Login_compressed #content.container fieldset {
  padding: 0px;
  margin: 0px;
}
body.Login.Login_compressed #content.container fieldset > legend {
  padding: 30px 0px 15px 0px;
  margin: 0px;
  border-bottom: solid 1px;
}
body.Login.Login_compressed #content.container fieldset > div.row,
body.Login.Login_compressed #content.container .log-in-form fieldset > div.row div {
  margin-bottom: 0px;
}
body.Login.Login_compressed #content.container #Login .formContent.col-sm-6 {
  width: 100%;
  padding: 0px;
}
body.Login.Login_compressed #content.container fieldset .form-group {
  padding-bottom: 15px;
  display: inline-block;
  width: 100%;
}
body.Login.Login_compressed #content.container #Login .control-label {
  width: 100%;
  padding: 0px 0px 5px 0px;
}
body.Login.Login_compressed #content.container #Login .formContent.col-sm-6 {
  width: 100%;
  padding: 0px 0px 0px 0px;
}
body.Login.Login_compressed #footer.container > .row.logo-copyright > div {
  width: 100%;
  font-size: 0.8em;
  line-height: 1.5em;
  text-align: center;
}
span.loginForgot.pull-right {
  margin: -5px 0px 10px 0px;
}
/*Activity Modal*/

body.StudentMyCourse.activity-modal {
  background-image: none;
  background-color: white;
}
body.activity-modal #content.container {
  width: 100% !important;
}
body.activity-modal .page-header {
  display: none;
  visibility: hidden;
}
body.activity-modal #content.container .column-overview .panel.overview,
body.activity-modal #content.container .column-packageresources .panel.resources {
  margin: 15px 15px 0px 15px;
}
/*Feedback Survey*/

.choices {
  display: inline-block;
  clear: both;
  margin-top: 0px;
}
.choices .choice {
  list-style-type: none;
}
.choices .choice.checkbox,
.choices .choice.radio {
  display: block;
  width: auto;
}
.choices .choice.checkbox-inline,
.choices .choice.radio-inline {
  width: auto;
  float: left;
}
.form-group[question_type="default"] .form-group[question_type="checkbox"] .choices.checkbox > label.choice,
.form-group[question_type="default"] .form-group[question_type="radio"] .choices.radio > label.choice {
  width: 100%;
  clear: left;
  margin: 5px 0px;
}
#CourseFeedback select.form-control {
  width: auto;
  max-width: 100%;
}
.LikertScale.choices {
  clear: both;
  display: inline-block;
}
.LikertScale.choices .radio-inline {
  float: left;
  width: auto;
}
.LikertScale.choices .radio-inline:first-child {
  padding: 0px 2em 0px 0px;
  margin: 0px;
  font-weight: 600;
}
.LikertScale.choices .radio-inline:last-child {
  padding: 0px 0px 0px 2em;
  margin: 0px;
  font-weight: 600;
}
.LikertScale.choices .likert-selected {
  font-weight: 700;
  border: 2px solid currentColor;
  border-radius: 50%;
  padding: 0 0.3em;
  background-color: rgba(0, 0, 0, 0.07);
}
#CourseFeedback li[data-required="required"] > div > h3:before {
  content: "*";
  float: left;
  margin-right: 5px;
}
#CourseFeedback li[question_type="radio"] .choices label {
  width: 100%;
}
#CourseFeedback .button_container {
  width: 100%;
  display: inline-block;
  margin: 1em 0;
}
#CourseFeedback select.feedbackControl.multiSelect {
  height: 100%;
  resize: both;
  overflow: auto;
}
body.SurveyFeedback #content.container #CourseFeedback li[question_type="checkbox"] .choices.checkbox,
body.SurveyFeedback #content.container #CourseFeedback li[question_type="checkbox"] .choices.checkbox .checkbox,
body.SurveyFeedback #content.container #CourseFeedback li[question_type="checkbox"] .choices.checkbox .checkbox label {
  width: 100%;
}
/* Admin Previeew */

body.PreviewFeedback #content.container #CourseFeedback li[question_type="checkbox"] .choices.checkbox,
body.PreviewFeedback #content.container #CourseFeedback li[question_type="checkbox"] .choices.checkbox .checkbox,
body.PreviewFeedback #content.container #CourseFeedback li[question_type="checkbox"] .choices.checkbox .checkbox label {
  width: 100%;
}
body.page_PreviewFeedback #container #CourseFeedback li[question_type="checkbox"] .choices.checkbox,
body.page_PreviewFeedback #container #CourseFeedback li[question_type="checkbox"] .choices.checkbox .checkbox,
body.page_PreviewFeedback #container #CourseFeedback li[question_type="checkbox"] .choices.checkbox .checkbox label {
  width: 100%;
}
.modal #CourseFeedback ol[type="a"] li {
  list-style-type: lower-alpha !important;
  display: list-item !important;
}
/*!
 * FullCalendar v1.6.1 Stylesheet
 * Docs & License:http://arshaw.com/fullcalendar/
 * (c) 2013 Adam Shaw
 */

.fc {
  direction: ltr;
  text-align: left;
}
.fc table {
  border-collapse: collapse;
  border-spacing: 0;
}
html .fc,
.fc table {
  font-size: 1em;
}
.fc td,
.fc th {
  padding: 0;
  vertical-align: top;
}
.fc-theme-standard td.fc-day {
  min-height: 99px;
}
/* Header
------------------------------------------------------------------------*/

.fc-header {
  position: relative;
}
.fc-header .btn + .btn {
  margin-left: 6px;
}
.fc-header-title {
  margin: 0;
  white-space: nowrap;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  text-align: center;
  font: 300 calc(20px * var(--font-scale, 1))/1.7 'Roboto', sans-serif;
}
.fc .fc-header-space {
  padding-left: 10px;
}
.fc-header .fc-button {
  margin-bottom: 1em;
  vertical-align: top;
}
.fc-header-center {
  position: absolute;
  top: -35px;
  height: 34px;
  width: 100%;
}
.fc-button-prev,
.fc-button-next {
  position: relative;
  z-index: 10;
  margin: 0 14px;
  line-height: 1.8889;
  font-size: calc(18px * var(--font-scale, 1));
  cursor: pointer;
}
.fc-button-prev {
  float: left;
}
.fc-button-next {
  float: right;
}
.fc-header-left {
  padding: 14px;
  overflow: hidden;
}
.fc-header-left > span {
  display: inline-block;
  border: 1px solid #e1e1e1;
  padding: 2px 8px;
  cursor: pointer;
}
.fc-header-left > span + span {
  margin-left: 10px;
}
.fc-header-left > span.fc-state-active {
  border-color: rgba(0, 0, 0, 0.2);
  color: white;
}
/* Content
------------------------------------------------------------------------*/

.fc-content {
  clear: both;
}
.fc-view {
  width: 100%;
  /* needed for view switching (when view is absolute) */
  overflow: hidden;
}
/* Cell Styles
------------------------------------------------------------------------*/

.fc-widget-header,
/* <th>, usually */ .fc-widget-content {
  /* <td>, usually */
  border: 1px solid #dddddd;
}
.fc-state-highlight {
  /* <td> today cell */
  /* TODO:add .fc-today to <th> */
  background: #fcf8e3;
}
.fc-state-highlight .fc-day-number {
  background: #f9f0c4 !important;
}
.fc-cell-overlay {
  /* semi-transparent rectangle while dragging */
  background: #d6e4f8;
  opacity: 0.4;
  filter: alpha(opacity=40);
  /* for IE */

}
.fc-border-separate tr .fc-first {
  border-left: none;
}
.fc-border-separate tr .fc-last {
  border-right: none;
}
.fc-border-separate tr.fc-last td {
  border-bottom: none;
}
.fc-button-today {
  float: right;
}
.fc-state-disabled {
  color: #999999;
  background: #f8f8f8;
}
/* Global Event Styles
------------------------------------------------------------------------*/

.fc-event {
  border: none;
  /* default BORDER color */
  background-color: rgba(0, 0, 0, 0.4);
  /* default BACKGROUND color */
  color: white;
  /* default TEXT color */
  font-size: 0.85em;
  cursor: default;
  padding: 2px 1px;
}
a.fc-event {
  text-decoration: none;
}
a.fc-event:hover {
  text-decoration: none;
  color: #222222;
}
a.fc-event,
.fc-event-draggable {
  cursor: pointer;
}
.fc-rtl .fc-event {
  text-align: right;
}
.fc-event-inner {
  width: 100%;
  height: 100%;
  overflow: hidden;
  line-height: calc(14px * var(--font-scale, 1));
  padding: 1px 2px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
.fc-event-time,
.fc-event-title {
  padding: 0 1px;
}
.fc .ui-resizable-handle {
  display: block;
  position: absolute;
  z-index: 99999;
  overflow: hidden;
  /* hacky spaces (IE6/7) */
  font-size: 300%;
  /* */
  line-height: 50%;
  /* */

}
/* Horizontal Events
------------------------------------------------------------------------*/

.fc-event-hori {
  border-width: 1px 0;
  margin-bottom: 2px;
}
.fc-ltr .fc-event-hori.fc-event-start,
.fc-rtl .fc-event-hori.fc-event-end {
  border-left-width: 1px;
}
.fc-ltr .fc-event-hori.fc-event-end,
.fc-rtl .fc-event-hori.fc-event-start {
  border-right-width: 1px;
}
/* resizable */

.fc-event-hori .ui-resizable-e {
  top: 0 !important;
  /* importants override pre jquery ui 1.7 styles */
  right: -3px !important;
  width: 7px !important;
  height: 100% !important;
  cursor: e-resize;
}
.fc-event-hori .ui-resizable-w {
  top: 0 !important;
  left: -3px !important;
  width: 7px !important;
  height: 100% !important;
  cursor: w-resize;
}
.fc-event-hori .ui-resizable-handle {
  _padding-bottom: 14px;
  /* IE6 had 0 height */

}
/* Reusable Separate-border Table
------------------------------------------------------------*/

table.fc-border-separate {
  border-collapse: separate;
}
.fc-border-separate th,
.fc-border-separate td {
  border-width: 1px 0 0 1px;
}
.fc-border-separate th.fc-last,
.fc-border-separate td.fc-last {
  border-right-width: 1px;
}
.fc-border-separate tr.fc-last th,
.fc-border-separate tr.fc-last td {
  border-bottom-width: 1px;
}
.fc-border-separate tbody tr.fc-first td,
.fc-border-separate tbody tr.fc-first th {
  border-top-width: 0;
}
/* Month View, Basic Week View, Basic Day View
------------------------------------------------------------------------*/

.fc-grid th {
  text-align: center;
  text-transform: uppercase;
  background: #f4f4f4;
}
.fc .fc-week-number {
  width: 22px;
  text-align: center;
}
.fc .fc-week-number div {
  padding: 0 2px;
}
.fc-grid .fc-day-number {
  padding: 0 4px;
  background: #f8f8f8;
  text-align: right;
  font-size: calc(11px * var(--font-scale, 1));
}
.fc-grid .fc-other-month .fc-day-number {
  opacity: 0.3;
  filter: alpha(opacity=30);
  /* for IE */

  /* opacity with small font can sometimes look too faded
	   might want to set the 'color' property instead
	   making day-numbers bold also fixes the problem */

}
.fc-grid .fc-day-content {
  clear: both;
  padding: 2px 2px 1px;
  /* distance between events and day edges */

}
/* event styles */

.fc-grid .fc-event-time {
  font-weight: bold;
}
/* right-to-left */

.fc-rtl .fc-grid .fc-day-number {
  float: left;
}
.fc-rtl .fc-grid .fc-event-time {
  float: right;
}
/* Agenda Week View, Agenda Day View
------------------------------------------------------------------------*/

.fc-agenda table {
  border-collapse: separate;
}
.fc-agenda-days th {
  text-align: center;
}
.fc-agenda .fc-agenda-axis {
  width: 50px;
  padding: 0 4px;
  vertical-align: middle;
  text-align: right;
  white-space: nowrap;
  font-weight: normal;
}
.fc-agenda .fc-week-number {
  font-weight: bold;
}
.fc-agenda .fc-day-content {
  padding: 2px 2px 1px;
}
/* make axis border take precedence */

.fc-agenda-days .fc-agenda-axis {
  border-right-width: 1px;
}
.fc-agenda-days .fc-col0 {
  border-left-width: 0;
}
/* all-day area */

.fc-agenda-allday th {
  border-width: 0 1px;
}
.fc-agenda-allday .fc-day-content {
  min-height: 34px;
  /* TODO:doesnt work well in quirksmode */
  _height: 34px;
}
/* divider (between all-day and slots) */

.fc-agenda-divider-inner {
  height: 2px;
  overflow: hidden;
}
.fc-widget-header .fc-agenda-divider-inner {
  background: #eeeeee;
}
/* slot rows */

.fc-agenda-slots th {
  border-width: 1px 1px 0;
}
.fc-agenda-slots td {
  border-width: 1px 0 0;
  background: none;
}
.fc-agenda-slots td div {
  height: 20px;
}
.fc-agenda-slots tr.fc-slot0 th,
.fc-agenda-slots tr.fc-slot0 td {
  border-top-width: 0;
}
.fc-agenda-slots tr.fc-minor th,
.fc-agenda-slots tr.fc-minor td {
  border-top-style: dotted;
}
.fc-agenda-slots tr.fc-minor th.ui-widget-header {
  border-top-style: solid;
  /* doesn't work with background in IE6/7 */

}
/* Vertical Events
------------------------------------------------------------------------*/

.fc-event-vert {
  border-width: 0 1px;
}
.fc-event-vert.fc-event-start {
  border-top-width: 1px;
}
.fc-event-vert.fc-event-end {
  border-bottom-width: 1px;
}
.fc-event-vert .fc-event-time {
  white-space: nowrap;
  font-size: calc(10px * var(--font-scale, 1));
}
.fc-event-vert .fc-event-inner {
  position: relative;
  z-index: 2;
}
.fc-event-vert .fc-event-bg {
  /* makes the event lighter w/ a semi-transparent overlay  */
  position: absolute;
  z-index: 1;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: white;
  opacity: 0.25;
  filter: alpha(opacity=25);
}
.fc .ui-draggable-dragging .fc-event-bg,
/* TODO:something nicer like .fc-opacity */ .fc-select-helper .fc-event-bg {
  display: none \9;
  /* for IE6/7/8. nested opacity filters while dragging don't work */

}
/* resizable */

.fc-event-vert .ui-resizable-s {
  bottom: 0 !important;
  /* importants override pre jquery ui 1.7 styles */
  width: 100% !important;
  height: 8px !important;
  overflow: hidden !important;
  line-height: 0.7273 !important;
  font-size: calc(11px * var(--font-scale, 1)) !important;
  font-family: monospace;
  text-align: center;
  cursor: s-resize;
}
.fc-agenda .ui-resizable-resizing {
  /* TODO:better selector */
  _overflow: hidden;
}
.highcharts-title {
  font-size: 1.2em !important;
}
table.course_progress tr > .description {
  min-width: 300px;
}
/*@media print (max-width:767px) {

    table.course_progress tr {
        display:block; float:none; clear:both;}
    table.course_progress th, table.course_progress .objective > td {
        display:inline-block !important; float:left; text-align:left;}
    table.course_progress td{text-align:left;} 

    table.course_progress td.hidden-xs, table.course_progress th.hidden-xs {
        display:none !important; float:left;}
    table.course_progress>tbody>tr>td > div, table.course_progress>tbody>tr>th > div {margin-left:0 !important; padding-left:0 !important;}
    
    .table>thead>tr>th, .table>tbody>tr>th, .table>tfoot>tr>th, 
    .table>thead>tr>td, .table>tbody>tr>td, .table>tfoot>tr>td {border-top:none 0px; padding:3px 8px;}
    table.course_progress>tbody>tr>th:first-child, table.course_progress>tbody>tr>td:first-child {border-top:solid 1px;}
    
    .course_progress .objective > td.score {width:100% !important;}
    .course_progress .activity > td.title {font-size:1.2em; font-weight:600;}
    .course_progress .activity > td.description {display:block !important;}
    
    .course_progress td h3 {width:120px; font-weight:bold; display:inline-block !important; float:left; margin:0px;}
}*/

/*Browser Detection*/

#browser-detection {
  background: #ffffe5;
  color: #333333;
  position: fixed;
  _position: absolute;
  padding: 10px 15px;
  font-size: calc(13px * var(--font-scale, 1));
  font-family: "Trebuchet MS", "Segoe UI", Arial, Tahoma, sans-serif;
  border-radius: 5px;
  border: 1px solid #d6d6c1;
  -moz-border-radius: 5px;
  width: 700px;
  z-index: 1001;
  top: 180px !important;
}
#browser-detection P {
  margin: 0;
  padding: 0;
  background: transparent;
  line-height: 135%;
  width: auto;
  float: none;
  border: none;
  text-align: center;
}
#browser-detection P.bd-title {
  padding-top: 0px;
  font-size: calc(25px * var(--font-scale, 1));
  line-height: 100%;
}
#browser-detection P.bd-notice {
  padding-bottom: 5px;
  padding-top: 28px;
}
#browser-detection SPAN.bd-highlight {
  color: #b50e0e;
}
#browser-detection A#browser-detection-close {
  width: 15px;
  height: 15px;
  outline: none;
  position: absolute;
  right: 10px;
  top: 10px;
  text-indent: -500em;
  line-height: 100%;
  background: url(./images/close.gif) no-repeat center center;
}
#browser-detection A#browser-detection-close:HOVER {
  background-color: beige;
}
#browser-detection UL.bd-browsers-list,
#browser-detection UL.bd-browsers-list LI,
#browser-detection UL.bd-skip-buttons,
#browser-detection UL.bd-skip-buttons LI {
  padding: 0;
  margin: 0;
  float: left;
  list-style: none;
}
#browser-detection UL.bd-browsers-list {
  clear: both;
  margin-top: 3px;
  padding: 7px 0;
  border-top: 1px solid beige;
  border-bottom: 1px solid beige;
  width: 100%;
}
#browser-detection UL.bd-browsers-list LI {
  text-align: left;
}
#browser-detection UL.bd-browsers-list LI A {
  width: 60px;
  height: 55px;
  display: block;
  color: #666666;
  padding: 10px 10px 0 65px;
  text-decoration: none;
}
#browser-detection UL.bd-browsers-list LI A:HOVER {
  text-decoration: underline;
}
#browser-detection UL.bd-browsers-list LI.firefox A {
  background: url(./images/firefox.gif) no-repeat left top;
}
#browser-detection UL.bd-browsers-list LI.chrome A {
  background: url(./images/chrome.gif) no-repeat left top;
}
#browser-detection UL.bd-browsers-list LI.safari A {
  background: url(./images/safari.gif) no-repeat left top;
}
#browser-detection UL.bd-browsers-list LI.opera A {
  background: url(./images/opera.gif) no-repeat left top;
}
#browser-detection UL.bd-browsers-list LI.msie A {
  background: url(./images/msie.gif) no-repeat left top;
}
#browser-detection UL.bd-skip-buttons {
  margin-top: 10px;
}
#browser-detection UL.bd-skip-buttons LI {
  display: inline;
  margin-right: 10px;
}
#browser-detection UL.bd-skip-buttons LI BUTTON {
  font-size: calc(13px * var(--font-scale, 1));
}
#browser-detection DIV.bd-poweredby {
  font-size: calc(9px * var(--font-scale, 1));
  position: absolute;
  bottom: 10px;
  right: 10px;
  font-style: italic;
}
#browser-detection DIV.bd-poweredby,
#browser-detection DIV.bd-poweredby A {
  color: #aaaaaa;
}
#browser-detection DIV.bd-poweredby A {
  text-decoration: underline;
}
#browser-detection DIV.bd-poweredby A:HOVER {
  text-decoration: none;
}
/* Accessibility for Amazon Compliance */

a.showOnFocus {
  position: absolute;
  clip: rect(1px 1px 1px 1px);
  /* IE6, IE7 */
  clip: rect(1px, 1px, 1px, 1px);
  padding: 0;
  border: 0;
  height: 1px;
  width: 1px;
  overflow: hidden;
  white-space: nowrap;
}
a.showOnFocus:focus,
a.showOnFocus:active {
  overflow: visible;
  height: auto;
  width: auto;
  clip: auto;
}
/* End */

#black_overlay {
  position: absolute;
  top: 0%;
  left: 0%;
  width: 100%;
  height: 100%;
  background-color: black;
  z-index: 1000;
  -moz-opacity: 0.8;
  opacity: 0.8;
  filter: alpha(opacity=80);
}
/*assessment*/

body#tc-assessment {
  background-color: white;
  color: white;
}
body#tc-assessment .qustion .question-text {
  color: white;
}
body#tc-assessment ol.choices li {
  color: white;
  background-color: white;
  border: solid 1px white;
}
body#tc-assessment ol.choices li:hover,
body#tc-assessment ol.choices li.selected {
  color: white;
  background-color: white;
  border: solid 1px white;
}
body#tc-assessment ol.choices li.correct {
  color: white;
  background-color: white;
  border: solid 1px white;
}
body#tc-assessment ol.choices li.incorrect {
  color: white;
  background-color: white;
  border: solid 1px white;
}
body#tc-assessment .feedback.alert {
  border-radius: 6px;
}
body#tc-assessment .correct.feedback.alert-success {
  color: white;
  background: white;
  border: solid 1px white;
}
body#tc-assessment .incorrect.feedback.alert-danger {
  color: white;
  background: white;
  border: solid 1px white;
}
body#tc-assessment .fb-review.incorrect {
  color: white;
  background: white;
  border: solid 1px white;
  width: 90%;
  min-height: 50px;
  margin: 20px 0px 0px 30px;
  padding: 10px;
}
body#tc-assessment .fb-review.correct {
  color: white;
  background: white;
  border: solid 1px white;
  width: 90%;
  min-height: 50px;
  margin: 20px 0px 0px 30px;
  padding: 10px;
}
/* Scheduler */

.AvailabilityScheduler {
  width: 100%;
  font-size: 0.9em;
  /*position:relative; max-height:500px; overflow-y:auto; display:block;*/

}
.AvailabilityScheduler > table {
  width: 100%;
}
.AvailabilityScheduler > table > tr > td {
  padding: 0px;
  border: none 0px;
}
/*.AvailabilityScheduler table table.headerTable {position:absolute; top:0px; left:0px; z-index:10; margin-top:0px;}*/

.AvailabilityScheduler table table {
  padding: 0px;
  margin: 0px 0px 0px 0px;
  border: none 0px;
  width: 100%;
}
.AvailabilityScheduler table table tr > td {
  width: 10%;
  padding: 8px;
  border: none 0px;
  cursor: pointer;
  border-bottom: solid 1px #f0f3f5;
}
.AvailabilityScheduler table thead tr > td,
.AvailabilityScheduler table table tr > td.hours {
  background-color: #5900c1;
  color: white;
}
.AvailabilityScheduler table thead tr > td:last-child {
  padding-left: 0px;
  padding-right: 0px;
  width: 17px !important;
  display: none;
}
.AvailabilityScheduler table table thead tr > td.month,
.AvailabilityScheduler table table tr > td.hours {
  width: 150px !important;
  cursor: default !important;
}
/*.AvailabilityScheduler table >tbody > tr > td > div  {height:auto !important; overflow-y:visible !important;}*/

.AvailabilityScheduler table table thead tr > td.days:nth-child(odd),
.AvailabilityScheduler table table tr > td.selected:nth-child(odd) {
  opacity: 0.9 !important;
}
.AvailabilityScheduler table table tr > td.selected {
  background-color: #cccccc;
  color: white;
}
.AvailabilityScheduler table table tr > td.unselected:nth-child(odd) {
  background-color: #f6f9fb;
  color: #333333;
}
.AvailabilityScheduler table table tr > td.unselected:nth-child(even) {
  background-color: white;
  color: #333333;
}
.AvailabilityScheduler td.selectedlegend {
  background-color: #ff5900;
  color: black;
  border-color: black;
  cursor: pointer;
}
.AvailabilityScheduler td.unavailable {
  background-color: lightgray;
  color: black;
  border-color: black;
}
.AvailabilityScheduler td.marked {
  background-color: green;
  color: black;
  border-color: black;
  cursor: pointer;
}
.AvailabilityScheduler .unselectable {
  -moz-user-select: none;
  -webkit-user-select: none;
}
#transcript_list #transcripts_completed tr > .credit-categories .cc-value.show {
  font-weight: 400;
  display: inline-block !important;
  margin-left: 4px;
}
/*Learner Notes*/

.modal-footer.learner-note {
  border: none !important;
}
.modal .wysihtml5-toolbar li {
  list-style-type: none !important;
}
.learner-note .fa-sticky-note {
  font-size: 1.2em;
}
.tc-btn-group .btn {
  margin-left: 5px;
}
/*Supervisor View*/

body.SuperviserView .counters > div {
  padding: 15px;
}
body.SuperviserView .counters .box {
  height: 240px;
  border: solid 1px #f0f3f5;
  padding: 30px;
}
body.SuperviserView .counters .box .count {
  font-size: 3em;
}
#SupervisorView .filter-container #filters {
  display: inline-block;
  width: 100%;
}
.counters .box .count-container {
  display: inline-block;
  margin: 15px 0px;
  padding: 15px;
  width: 100%;
}
.my-learners .filters {
  margin-top: 15px;
  padding: 15px;
  display: inline-block;
  width: 100%;
  border: solid 1px #eeeeee;
}
.my-learners .filters label,
.my-learners .filters .label {
  display: block;
  width: 100%;
}
.my-learners .filters ul {
  padding: 15px;
  border: solid 1px #eeeeee;
  height: 200px;
  overflow: auto;
}
.my-learners .filters ul input[type="radio"],
.my-learners .filters ul input[type="checkbox"] {
  margin-right: 3px;
}
.my-learners .filters ul,
.my-learners .filters ul li {
  list-style-type: none;
}
.my-learners table,
.my-modules table,
.my-assignments table {
  margin-top: 15px;
}
.my-modules tr:hover.hover,
.my-modules tr:hover.hover td {
  background-color: #ababab !important;
}
.my-modules tr.hover {
  cursor: pointer;
}
.my-modules .enrollment-actions > .btn {
  margin-bottom: 15px;
}
/* Learner view dougnut charts*/

div.doughnut,
span.doughnut {
  width: 300px;
  height: 300px;
  display: inline-block;
}
x-pie {
  display: block;
  width: 525px;
  height: 400px;
  margin: -50px auto;
  text-align: left;
}
svg {
  overflow: visible;
}
svg .wedge {
  cursor: pointer;
}
x-pie h1 {
  font-size: 1.5em;
}
/*draggable notes cursor*/

.learner-note .modal-header {
  cursor: pointer;
}
/*draggable notes cursor*/

.learner-note .modal-header {
  cursor: pointer;
}
/* Accessibility Settings */

.page-header.AccessibilityPreference {
  display: none;
}
#frmAccessibilityPreferences {
  margin-top: 15px;
}
/* Text Size */

#textSizeDiv > #TextSizeLabel {
  margin-right: 1rem;
}
/* Line Spacing */

#lineSpacingDiv #LineSpacingLabel {
  margin-right: 1rem;
}
/* Contrast */

.abw {
  color: black !important;
  background-color: white !important;
}
.awb {
  color: white !important;
  background-color: black !important;
}
.aby {
  color: black !important;
  background-color: yellow !important;
}
.ayb {
  color: yellow !important;
  background-color: black !important;
}
#contrastDiv > #ContrastLabel {
  margin-right: 1rem;
}
/* Font */

.fl-font-arial {
  font-family: Arial !important;
}
.fl-font-times {
  font-family: Georgia, Times, Times New Roman, serif !important;
}
.fl-font-verdana {
  font-family: Verdana !important;
}
.fl-font-open {
  font-family: OpenDyslexic, sans-serif !important;
}
#fontDiv > #FontLabel {
  margin-right: 1rem;
}
.enhance-inputs {
  font-weight: bold;
}
/* My Profile (2022) */

#MyProfile {
  position: relative;
}
#MyProfile .cover {
  margin: 0px -15px 15px -15px;
  position: relative;
  height: 200px;
}
#MyProfile .cover img.cover_bg {
  position: absolute;
  top: -4px;
  width: calc(100% + 8px);
  height: 200px;
  object-fit: cover;
  object-position: center center;
  filter: blur(8px);
  -webkit-filter: blur(8px);
  opacity: 0.2;
}
#MyProfile #Avatar {
  position: relative;
  top: -160px;
  width: 100%;
  height: 0;
  padding-bottom: 80%;
  margin-bottom: -120px;
  overflow: hidden;
}
#MyProfile #Avatar img.profile {
  position: absolute;
  top: 0px;
  left: 0;
  width: 80%;
  height: 100%;
  object-fit: cover;
}
#MyProfile .supervisor {
  margin-bottom: 1em;
}
#MyProfile .supervisor img.profile,
#MyProfile .connections img.profile,
#MyProfile .collaborations img.profile {
  padding: 0px;
  border: solid 1px #f6f6f6;
  width: 40px;
  height: 40px;
  object-fit: cover;
  object-position: center center;
}
#MyProfile .supervisor > a {
  margin-right: 5px;
}
#MyProfile .stats {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: stretch;
  align-content: stretch;
  margin-left: -15px;
  margin-right: -15px;
}
#MyProfile .stats > div {
  margin-bottom: 30px;
}
#MyProfile .stats .stat {
  background-color: #f0f3f5;
  padding: 15px;
  margin: 0px;
  text-align: center;
  display: inline-block;
  float: left;
  width: 100%;
  height: 100%;
}
#MyProfile .stats .stat.certificate {
  padding-bottom: 5em !important;
  position: relative;
}
#MyProfile .stats .stat.certificate .btn {
  position: absolute;
  bottom: 15px;
  left: auto;
  right: 15px;
}
#MyProfile .stats .stat .count {
  font-size: 2em;
  line-height: 1.2em;
}
#MyProfile .stats .stat label {
  font-weight: bold;
  width: 100%;
  text-align: center;
}
#MyProfile .stats .stat .icon {
  background-color: #f0f3f5;
  padding: 15px;
  text-align: center;
  display: inline-block;
  border-radius: 50%;
}
#MyProfile .stats .stat .icon img,
#MyProfile .stats .stat .icon .fa,
#MyProfile .stats .stat .icon svg {
  font-size: calc(36px * var(--font-scale, 1));
  width: 36px;
  height: 36px;
}
#MyProfile .card {
  margin-bottom: 15px;
}
#MyProfile .card .card-body {
  padding: 15px;
}
#MyProfile .card .card-body label {
  font-weight: bold;
  width: 100%;
}
#MyProfile .card .card-body .setting,
#MyProfile .card .card-body .custom-field,
#MyProfile .card .card-body .preference,
#MyProfile .card .card-body .certificate,
#MyProfile .card .card-body .openbadge {
  margin-bottom: 1em;
}
#MyProfile .card .card-body .setting > div {
  display: inline-block;
  width: 100%;
  line-height: calc(60px * var(--font-scale, 1));
}
#MyProfile .card .card-body .setting .profile {
  width: 60px;
  height: 60px;
  object-fit: cover;
  margin: 0px 5px 0px 0px;
  float: left;
  clear: left;
}
#MyProfile .card .card-body .custom-field .field-value:empty {
  content: "�";
}
#MyProfile .card .card-body .certificate,
#MyProfile .card .card-body .openbadge {
  text-align: center;
}
#MyProfile .card .card-body .certificate .icon,
#MyProfile #myBadges .badge-panel .media {
  background-color: #f0f3f5;
  padding: 15px;
  text-align: center;
  display: inline-block;
  border-radius: 50%;
  margin: 0px !important;
}
#MyProfile .card .card-body .certificate .certificate_thumbnail img,
#MyProfile #myBadges .badge-panel .media img {
  width: 100%;
  height: auto;
}
#MyProfile .card .card-body .certificate .icon img,
#MyProfile #myBadges .badge-panel .media img {
  width: 36px;
  height: 36px;
}
#MyProfile .card .card-body .certificate label,
#MyProfile .card .card-body .openbadge label {
  text-align: center;
}
/*    #MyProfile .card .card-body .connectionType .connection tr > * {
        padding: 5px;
    }*/

#MyProfile .card .card-body table tr .waitDialog.connection-options {
  white-space: nowrap;
}
#MyProfile .card .card-body .btn-share img {
  height: 14px;
}
#MyProfile #myBadges > .row {
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
  justify-content: flex-start;
  align-items: stretch;
}
#MyProfile #myBadges > .row .badge-panel {
  margin: 0px 30px 30px 0px !important;
  border: none 0px !important;
  text-align: center;
  position: relative;
}
#MyProfile #myBadges > .row .badge-panel .panel-heading,
#MyProfile #myBadges > .row .badge-panel .panel-body,
#MyProfile #myBadges > .row .badge-panel .panel-footer {
  background-color: transparent !important;
  border: none 0px !important;
  padding: 0px !important;
}
#MyProfile #myBadges > .row .badge-panel .panel-heading {
  min-height: 4em;
}
#MyProfile #myBadges > .row .badge-panel .panel-heading h4 {
  font-size: 1em;
}
#MyProfile #myBadges > .row .badge-panel .panel-body .list-group {
  display: none;
  visibility: hidden;
}
#MyProfile #myBadges > .row .badge-panel .panel-footer .btn-group {
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: center;
}
#MyProfile #myBadges > .row .badge-panel .panel-footer .btn-group .btn {
  clear: both;
  border-radius: 4px;
  margin-bottom: 2px;
  border: none 0px;
}
#MyProfile #myBadges > .row .badge-panel .panel-footer .btn-group .btn:empty {
  display: none;
  visibility: hidden;
}
#MyProfile #myBadges > .row .badge-panel .panel-footer .btn-group .btn .fa,
#MyProfile #myBadges > .row .badge-panel .panel-footer .btn-group .btn svg {
  margin-right: 5px;
}
#MyProfile .card.connections .connectionType {
  margin-bottom: 1em;
}
#MyProfile .card.connections .connectionType > .connection {
  display: flex;
  align-items: center;
  align-content: stretch;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-between;
  padding: 5px;
  margin: 0px -5px 5px -5px;
  height: auto;
}
#MyProfile .card.connections .connectionType > .connection:hover {
  background-color: #f0f3f5;
}
#MyProfile #accountDetailsModalForm .form-group {
  display: inline-block;
  width: 100%;
  margin-bottom: 1em;
}
#MyProfile .card .custom-field > span > div {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
}
#MyProfile .card .custom-field .edit-container .md-field {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
}
#MyProfile .card .custom-field .edit-container > div,
#MyProfile .card .custom-field .edit-container > div .controls {
  padding: 0px;
  margin-bottom: 0px;
}
#MyProfile .card .custom-field .edit-container > div .controls {
  width: 100%;
}
#MyProfile .card .custom-field .edit-container .btn.save-md {
  margin: 0px 0px 0px 15px;
}
/*Inbox*/

#Inbox #inbox-pagination ul.pagination {
  margin: 0px;
}
#Inbox #unread_counts {
  line-height: calc(38px * var(--font-scale, 1));
  margin: 0px 15px;
}
#Inbox #inbox-search .input-group {
  max-width: 200px;
}
#Inbox > .row {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: stretch;
  align-content: stretch;
}
#Inbox #inbox-messages .well {
  border: solid 1px #f0f3f5;
  border-radius: 0px;
  -webkit-box-shadow: none;
  box-shadow: none;
  height: 100%;
  background-color: white;
  background-color: #f0f3f5;
  color: #333333;
}
#Inbox #inbox-messages .well .message {
  margin-bottom: 1em;
}
#Inbox #inbox-messages .well .message .readstatus {
  display: inline-block;
  float: left;
  margin-right: 5px;
}
#Inbox #inbox-messages .well .message .readstatus .fa,
#Inbox #inbox-messages .well .message .readstatus svg {
  color: #5900c1;
}
#Inbox #inbox-messages .well .message .subject {
  font-weight: normal;
  font-weight: bold;
  text-decoration: underline;
  color: #5900c1;
  cursor: pointer;
  cursor: hand;
}
#Inbox #inbox-messages .well .message .subject:hover {
  text-decoration: none;
}
#Inbox #inbox-content:empty {
  text-align: center;
}
#Inbox #inbox-content:empty:before {
  content: "\f1ce";
  display: inline-block;
  font: normal normal normal calc(14px * var(--font-scale, 1))/1 FontAwesome;
  font-size: 2em;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  margin: 60px auto;
  -webkit-animation: fa-spin 2s infinite linear;
  animation: fa-spin 2s infinite linear;
}
#Inbox #inbox-content .message_full .message_head {
  margin-bottom: 2em;
}
#Inbox #inbox-content .message_full .message_body {
  border: solid 1px #f0f3f5;
  width: 100%;
  overflow: auto;
  padding: 15px;
  word-break: break-word;
}
#CollaborationLearners #AvailableLearners,
#CollaborationLearners #ConnectedLearners {
  width: 100%;
  display: inline-block;
}
#CollaborationLearners #AvailableLearners > .learners,
#CollaborationLearners #ConnectedLearners > .learners {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  align-content: stretch;
  justify-content: flex-start;
  align-items: stretch;
}
#CollaborationLearners .learner {
  display: flex;
  flex-wrap: nowrap;
  flex-direction: row;
  align-content: stretch;
  justify-content: flex-start;
  align-items: stretch;
  margin-bottom: 30px;
  text-transform: capitalize;
}
#CollaborationLearners .profile_pic img.profile_pic {
  width: 40px;
  height: 40px;
  object-fit: cover;
  border-radius: 50%;
  margin: 0px 5px 5px 0px;
  border: solid 1px #eeeeee;
}
#CollaborationLearners .learner .btn {
  margin-bottom: 5px;
}
#CollaborationLearners #CollaborationMessage {
  border-top: solid 1px #dddddd;
  border-bottom: solid 1px #dddddd;
  padding: 15px;
  margin-bottom: 15px;
}
/*Esignature modal*/

#modal_esignature_submission .modal-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
}
#modal_esignature_submission .modal-header > .modal-title {
  flex-grow: 1;
}
#modal_esignature_submission .modal-header > .btn-close {
  border: none 0px;
  background: transparent;
}
#modal_esignature_submission .tab-content {
  padding: 15px 0px;
}
#modal_esignature_submission .tab-content > .tab-pane.active {
  display: inline-block !important;
  width: 100%;
}
#modal_esignature_submission .mb-3 {
  margin-bottom: 1em;
}
#modal_esignature_submission .acknowledgment .full-name {
  font-weight: bold;
  padding: 0px 5px;
  display: inline-block;
  border-bottom: solid 1px black;
}
#modal_esignature_submission .signature-drawn-display {
  display: inline-block;
  border-radius: 10px;
  border-left: solid 2px black;
}
#modal_esignature_submission .signature-typed-display {
  font-family: 'Alex Brush', 'Birthstone', 'Dancing Script', 'Ephesis', 'Great Vibes', 'Kalam', 'Marck Script', 'Monte Carlo', 'Satisfy', 'Whisper', 'Dancing Script', 'Pacifico', 'Great Vibes', 'Satisfy', 'Cedarville Cursive', 'Lucida Handwriting', 'MV Boli', cursive;
  font-size: calc(24px * var(--font-scale, 1));
  display: inline-block;
  border: solid 1px black;
  border-width: 0px 0px 1px 0px;
  border-radius: 0px;
  -webkit-box-shadow: none;
  box-shadow: none;
  padding: 5px 0px 0px 0px;
}
#modal_esignature_submission #eSignature_submission_response {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: center;
  gap: 10px;
}
#modal_esignature_submission #eSignature_submission_response:empty {
  display: none;
  visibility: hidden;
}
#signatureData .signature {
  display: inline-block;
  border-radius: 12px !important;
  border-left: solid 3px black;
  padding: 10px;
  background: #f9f9f9;
  margin-bottom: 5px;
}
#signatureData .signature #eSigLearnerName.written {
  display: block;
}
#signatureData .signature #eSigLearnerName.written:after {
  content: ":";
}
#signatureData .signature #eSigLearnerName.drawn {
  display: block;
  font-family: 'Alex Brush', 'Birthstone', 'Dancing Script', 'Ephesis', 'Great Vibes', 'Kalam', 'Marck Script', 'Monte Carlo', 'Satisfy', 'Whisper', 'Dancing Script', 'Pacifico', 'Great Vibes', 'Satisfy', 'Cedarville Cursive', 'Lucida Handwriting', 'MV Boli', cursive;
  font-size: calc(24px * var(--font-scale, 1));
  padding: 20px;
}
/* #90440 modal-page: hide chrome when page is loaded in a modal iframe */

body.modal-page #log_in_bar,
body.modal-page #masthead,
body.modal-page #footer {
  display: none;
}
/*************** #97802 font-scale: Froala editor UI follows the learner font selector ***************/

/* Values mirror froala_editor.pkgd(.min).css; body prefix guarantees the override wins
   regardless of stylesheet load order. Visually identical at --font-scale: 1 */

body .fr-box.fr-basic .fr-element {
  font-size: calc(14px * var(--font-scale, 1));
}
body .fr-box a.fr-floating-btn i,
body .fr-box a.fr-floating-btn svg {
  font-size: calc(14px * var(--font-scale, 1));
}
body .fr-wrapper .fr-placeholder {
  font-size: calc(14px * var(--font-scale, 1));
}
body .fr-tooltip {
  font-size: calc(11px * var(--font-scale, 1));
}
body .fr-toolbar .fr-command.fr-btn span,
body .fr-popup .fr-command.fr-btn span,
body .fr-modal .fr-command.fr-btn span {
  font-size: calc(14px * var(--font-scale, 1));
}
body .fr-command.fr-btn + .fr-dropdown-menu .fr-dropdown-wrapper .fr-dropdown-content ul.fr-dropdown-list li {
  font-size: calc(15px * var(--font-scale, 1));
}
body .fr-modal .fr-modal-wrapper .fr-modal-head h4 {
  font-size: calc(20px * var(--font-scale, 1));
}
body .fr-modal .fr-modal-wrapper div.fr-modal-body button.fr-command {
  font-size: calc(16px * var(--font-scale, 1));
}
body .fr-popup .fr-icon {
  font-size: calc(20px * var(--font-scale, 1));
}
body .fr-popup .fr-input-line input[type="text"],
body .fr-popup .fr-input-line textarea {
  font-size: calc(14px * var(--font-scale, 1));
}
body .fr-popup .fr-input-line input + label,
body .fr-popup .fr-input-line textarea + label {
  font-size: calc(14px * var(--font-scale, 1));
}
body .fr-popup .fr-input-line input.fr-not-empty + label,
body .fr-popup .fr-input-line textarea.fr-not-empty + label {
  font-size: calc(11px * var(--font-scale, 1));
}
body .fr-popup .fr-action-buttons button.fr-command {
  font-size: calc(16px * var(--font-scale, 1));
}
body .fr-popup .fr-checkbox-line {
  font-size: calc(14px * var(--font-scale, 1));
}
body .fr-box .fr-counter {
  font-size: calc(14px * var(--font-scale, 1));
}
body textarea.fr-code {
  font-size: calc(14px * var(--font-scale, 1));
}
body .fr-box.fr-inline .fr-command.fr-btn.html-switch i {
  font-size: calc(24px * var(--font-scale, 1));
}
body .fr-popup .fr-layer.fr-color-hex-layer .fr-action-buttons button.fr-command {
  font-size: calc(13px * var(--font-scale, 1));
}
body .fr-popup .fr-color-set > span > i,
body .fr-popup .fr-color-set > span > svg {
  font-size: calc(13px * var(--font-scale, 1));
}
body .fr-popup .fr-color-set > span .fr-selected-color {
  font-size: calc(13px * var(--font-scale, 1));
}
body .fr-popup .fr-file-upload-layer,
body .fr-popup .fr-image-upload-layer,
body .fr-popup .fr-video-upload-layer {
  font-size: calc(14px * var(--font-scale, 1));
}
body .fr-popup .fr-file-progress-bar-layer > h3,
body .fr-popup .fr-image-progress-bar-layer > h3,
body .fr-popup .fr-video-progress-bar-layer > h3 {
  font-size: calc(16px * var(--font-scale, 1));
}
body div.fr-modal-body div.fr-image-list div.fr-image-container.fr-image-deleting::before {
  font-size: calc(15px * var(--font-scale, 1));
}
body .fr-popup .fr-buttons.fr-tabs .fr-special-character-category span {
  font-size: calc(16px * var(--font-scale, 1));
}
body .fr-popup .fr-table-size .fr-table-size-info {
  font-size: calc(14px * var(--font-scale, 1));
}
body .fr-view .fr-img-caption .fr-img-wrap > span {
  font-size: calc(14px * var(--font-scale, 1));
}
/* Partner Schools learner CSS — tokens in design.md */

@font-face {
  font-family: "BCSans";
  font-weight: 100;
  src: url(https://tcmagnum.blob.core.windows.net/cdn/fonts/BritishCouncilSansW/BritishCouncilSansW08-Lt.woff2) format("woff2"), url(https://tcmagnum.blob.core.windows.net/cdn/fonts/BritishCouncilSansW/BritishCouncilSansW08-Lt.woff) format("woff");
}
@font-face {
  font-family: "BCSans";
  font-weight: 300;
  font-style: normal;
  src: url(https://tcmagnum.blob.core.windows.net/cdn/fonts/BritishCouncilSansW/BritishCouncilSansW08-Rg.woff2) format("woff2"), url(https://tcmagnum.blob.core.windows.net/cdn/fonts/BritishCouncilSansW/BritishCouncilSansW08-Rg.woff) format("woff");
}
@font-face {
  font-family: "BCSans";
  font-weight: 600;
  src: url(https://tcmagnum.blob.core.windows.net/cdn/fonts/BritishCouncilSansW/BritishCouncilSansW08-Bd.woff2) format("woff2"), url(https://tcmagnum.blob.core.windows.net/cdn/fonts/BritishCouncilSansW/BritishCouncilSansW08-Bd.woff) format("woff");
}
@font-face {
  font-family: "BCSansHeading";
  font-weight: 700;
  src: url(https://tcmagnum.blob.core.windows.net/cdn/fonts/BritishCouncilSansW/BritishCouncilSansW05-Headline.woff2) format("woff2"), url(https://tcmagnum.blob.core.windows.net/cdn/fonts/BritishCouncilSansW/BritishCouncilSansW05-Headline.woff) format("woff");
}
:root {
  --brand-primary: #5900c1;
  --brand-primary-dark: #27004c;
  --brand-primary-light: #ebe0f8;
  --brand-accent: #ff2d2d;
  /* sparse highlight only — currently the unread inbox badge */
  --brand-highlight: #ffd500;
  --text-on-brand: white;
  --body-font: "BCSans", Arial, sans-serif;
  --heading-font: "BCSansHeading", Arial, sans-serif;
  /* Shell measure. The purple bars stay full width; their contents sit on the
       same rail as the page. The page fills the window up to --shell-max and
       holds a fixed gutter below that, rather than stepping between Bootstrap's
       fixed container widths. */
  --shell-max: 1280px;
  --shell-gutter: 16px;
}
@media (min-width: 768px) {
  :root {
    --shell-gutter: 32px;
  }
}
/* ----- Fonts and page shell ----- */

/* Bootstrap 3 gives .container a fixed width per breakpoint (750 / 970 / 1170),
   so the gap between the window edge and the text jumps from 26px to 135px as
   you cross 992px. This makes it fill the window instead and keeps one gutter
   at every size. Bootstrap's own rules are earlier in the cascade, so plain
   .container is enough to win. */

.container {
  width: 100%;
  max-width: var(--shell-max);
  padding-left: var(--shell-gutter);
  padding-right: var(--shell-gutter);
}
html body {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
  font-family: var(--body-font) !important;
  font-size: 16px;
}
html body h1,
html body h2,
html body h3,
html body h4,
html body h5,
html body h6,
html body .h1,
html body .h2,
html body .h3,
html body .h4,
html body .h5,
html body .h6 {
  font-family: var(--heading-font) !important;
  font-weight: 700;
  color: var(--brand-primary-dark);
}
html body h1,
html body .h1 {
  font-size: 2em;
  line-height: 1.3;
}
html body h2,
html body .h2 {
  font-size: 1.5em;
  line-height: 1.3;
}
html body h3,
html body .h3 {
  font-size: 1.25em;
  line-height: 1.35;
}
html body h4,
html body .h4 {
  font-size: 1.125em;
  line-height: 1.4;
}
html body h5,
html body .h5,
html body h6,
html body .h6 {
  font-size: 1em;
  line-height: 1.4;
}
#content.container > .page-header {
  margin-top: 0;
  margin-bottom: 16px;
  padding-top: 0;
  padding-bottom: 8px;
}
#content.container > .page-header h1 {
  font-size: 2em;
  margin-top: 0;
}
#content.container > .page-header h1 small {
  font-size: 0.5em;
}
body #content.container {
  flex: 1;
  background-color: transparent !important;
  border-color: transparent !important;
  padding: 32px var(--shell-gutter) 20px !important;
}
body.Login #content.container {
  padding: 0px 0px 20px 0px !important;
}
body.Login.Login_compressed #content.container #login_page {
  margin-left: 0;
  margin-right: 0;
  padding-bottom: 40px;
}
/* ----- Buttons and Bootstrap leftovers -----
   Default button / link / tab / table colours now come from admin
   (Experience → Branding → Content Layout). Keep shape, hover, and
   Bootstrap helpers that the pickers do not cover. */

a:hover,
a:focus {
  color: var(--brand-primary-dark);
}
.btn,
.btn-default,
.btn-primary {
  padding: 8px 12px;
  line-height: 1.4;
  border-radius: 9999px;
  /* Hover colours come from admin; this just stops them snapping. */
  transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}
.btn.active,
.btn-primary.active,
.open > .dropdown-toggle.btn-primary {
  background-color: var(--brand-primary-dark);
  border-color: var(--brand-primary-dark);
  color: var(--text-on-brand);
}
.btn.disabled,
.btn[disabled],
.btn-primary.disabled,
.btn-primary[disabled],
fieldset[disabled] .btn,
fieldset[disabled] .btn-primary {
  background-color: var(--brand-primary);
  border-color: var(--brand-primary);
}
.btn.btn-link,
.btn.btn-icon {
  background-color: transparent;
  border-color: transparent;
  color: var(--brand-primary);
  padding: 0;
  border-radius: 0;
}
.btn.btn-link:hover,
.btn.btn-icon:hover {
  background-color: transparent;
  border-color: transparent;
  color: var(--brand-primary-dark);
}
/* Secondary action on catalogue cards. Yellow is --brand-highlight (the
   red --brand-accent token is not this). Enrol stays the purple primary. */

.btn.more-info {
  background-color: var(--brand-highlight);
  border-color: var(--brand-highlight);
  color: var(--brand-primary-dark);
}
.btn.more-info:hover,
.btn.more-info:focus,
.btn.more-info:active {
  background-color: var(--brand-primary-dark);
  border-color: var(--brand-primary-dark);
  color: var(--text-on-brand);
}
/* Facebook's own iframe is the control. Thinking Cap still marks the wrapper
   as .btn.btn-primary (and sets an inline Facebook-blue fill), so strip our
   pill without blocking clicks on the plugin. */

.btn.fb-share-button,
.btn.fb-share-button:hover,
.btn.fb-share-button:focus,
.btn.fb-share-button:active,
.btn.fb_iframe_widget,
.btn.fb_iframe_widget:hover,
.btn.fb_iframe_widget:focus,
.btn.fb_iframe_widget:active {
  display: inline-flex;
  align-items: center;
  background: transparent !important;
  background-color: transparent !important;
  border: none;
  border-radius: 0;
  padding: 0 !important;
  line-height: 0;
  box-shadow: none;
}
.nav-pills > li.active > a,
.nav-pills > li.active > a:hover,
.nav-pills > li.active > a:focus {
  background-color: var(--brand-primary);
  border-color: var(--brand-primary);
  color: var(--text-on-brand);
}
.progress-bar,
.progress-bar-success {
  background-color: var(--brand-primary);
}
.label-primary,
.bg-primary {
  background-color: var(--brand-primary);
  border-color: var(--brand-primary);
  color: var(--text-on-brand);
}
.text-primary {
  color: var(--brand-primary);
}
/* Bootstrap 5 pagination (inbox, forums). some-bs-5.css loads after this
   file and paints stock blue (#0d6efd) through variables on .pagination.
   Repeating the class beats that later rule. Admin colour pickers do not
   reach these variables. Unselected numbers follow link colour; the
   current page follows the primary button. */

.pagination.pagination {
  --bs-pagination-color: var(--brand-primary);
  --bs-pagination-hover-color: var(--brand-primary-dark);
  --bs-pagination-focus-color: var(--brand-primary-dark);
  --bs-pagination-active-color: var(--text-on-brand);
  --bs-pagination-active-bg: var(--brand-primary);
  --bs-pagination-active-border-color: var(--brand-primary);
}
.pagination.pagination .page-link:hover,
.pagination.pagination .page-link:focus-visible {
  color: var(--brand-primary-dark);
}
.pagination.pagination .page-link:focus-visible {
  outline: 2px solid var(--brand-primary);
  outline-offset: 2px;
  z-index: 3;
}
.pagination.pagination .active > .page-link:hover,
.pagination.pagination .active > .page-link:focus-visible {
  color: var(--text-on-brand);
  background-color: var(--brand-primary-dark);
  border-color: var(--brand-primary-dark);
}
/* Catalogue filters, result cards, and other default panels. Admin has no
   panel-heading picker; the compiled file leaves these white / navy.
   Children (h3, activity-type, collapse <a> + FA SVG) inherit white so
   they are not restyled as in-page links. .ps-page accordions stay
   transparent — that selector is more specific. */

.panel-default > .panel-heading,
.panel-primary > .panel-heading {
  background-color: var(--brand-primary);
  border-color: var(--brand-primary);
  color: var(--text-on-brand);
}
.panel-default > .panel-heading *,
.panel-primary > .panel-heading * {
  color: inherit;
}
/* Catalogue cards show the description only. The platform prints code,
   custom fields, start date and credits under it with no admin toggle. */

#catalogueResults .course-code,
#catalogueResults .meta-data,
#catalogueResults .course-start,
#catalogueResults .course-credit,
#catalogueResults .credit-categories {
  display: none;
}
#catalogueResults .description-text {
  display: -webkit-box;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
/* Enrolled cards carry a progress bar. The platform gives it a fixed 250px
   inline width and a "17% Completed" label that wraps inside a bar narrower
   than itself, spilling over the Status line below. Full width, and the bar
   is never narrower than its own label. */

#catalogueResults .progress {
  width: auto !important;
  margin: 12px 0 8px;
}
#catalogueResults .progress-bar {
  min-width: fit-content;
  padding: 0 10px;
  white-space: nowrap;
}
/* Bootstrap floats the tiles, so a tall card snags the one that should start
   the next row and leaves a hole beside it. Flex wrap gives real rows, and
   stretching each panel to its row lets the buttons share a baseline. Only
   needed with several cards, which is why the one-tile sandbox never showed it. */

#catalogueResults.box-format {
  display: flex;
  flex-wrap: wrap;
}
#catalogueResults.box-format .activity_result {
  float: none;
  display: flex;
}
#catalogueResults.box-format .activity_result .panel {
  display: flex;
  flex-direction: column;
  width: 100%;
}
#catalogueResults.box-format .panel .panel-body {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
}
#catalogueResults.box-format .panel-body .tc-btn-group {
  margin-top: auto;
}
/* Result cards are white, not a purple bar: the filter panels beside them
   keep the bar, so the cards read as content rather than more chrome.
   Square corners per the no-radius rule. */

#catalogueResults .panel {
  border: 1px solid #e6ddf3;
  border-radius: 0;
  box-shadow: none;
  /* Clips the hover zoom on .course-marquee, which in the tile layout sits
       directly inside the panel rather than in .course-image-col. */
  overflow: hidden;
  transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
}
#catalogueResults .panel:hover {
  border-color: var(--brand-primary);
  box-shadow: 0 8px 24px rgba(39, 0, 76, 0.12);
  transform: translateY(-2px);
}
/* The type label comes first in the markup, so a column puts it above the
   title as an eyebrow. */

#catalogueResults .panel > .panel-heading {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
  padding: 20px 20px 0;
  background-color: white;
  border: 0;
  color: var(--brand-primary-dark);
}
#catalogueResults .panel > .panel-heading .activity-type {
  float: none;
  font-size: 12px;
  letter-spacing: 0.08em;
  color: var(--brand-primary);
}
#catalogueResults .panel > .panel-heading .course-title {
  margin: 0;
  font-family: var(--heading-font);
  color: var(--brand-primary-dark);
}
/* Same keyline as the home section headings. */

#catalogueResults .panel > .panel-heading .course-title::after {
  content: "";
  display: block;
  width: 48px;
  height: 4px;
  margin-top: 10px;
  background-color: var(--brand-primary);
}
#catalogueResults .panel .panel-body {
  padding: 16px 20px 20px;
}
#catalogueResults .course-image-col {
  overflow: hidden;
}
/* The platform sets height:100% and max-height:250px. Inside the stretched
   flex panel that 100% resolves to a real height and beats aspect-ratio, so
   both come off; flex-shrink:0 stops the column squeezing the image. */

#catalogueResults .course-marquee {
  width: 100%;
  height: auto;
  max-height: none;
  aspect-ratio: 1.777777778;
  object-fit: cover;
  flex-shrink: 0;
  transition: transform 0.4s ease;
}
/* In the tile layout the image is a direct child of the panel, right after
   the heading, whose bottom padding is 0 so headings without an image do not
   double up with the body padding. The image carries the gap instead. */

#catalogueResults .panel > .course-marquee {
  margin-top: 16px;
}
#catalogueResults .panel:hover .course-marquee {
  transform: scale(1.04);
}
/* Buttons come before the text in the markup; order moves them underneath.
   The platform's .p-0 is !important, hence the override here. */

#catalogueResults .course-info-container {
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding-left: 20px !important;
}
#catalogueResults .course-info-container > * {
  float: none;
  width: auto;
  padding: 0;
}
#catalogueResults .tc-btn-group {
  order: 2;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  text-align: left;
}
#catalogueResults .tc-btn-group .btn {
  margin: 0;
}
/* Below Bootstrap's md columns the image stacks. The platform floats it
   (!important inline) and caps it at 200px. */

@media (max-width: 991px) {
  #catalogueResults .course-image-col {
    float: none !important;
    width: 100%;
    max-width: none;
  }
  #catalogueResults .course-info-container {
    margin-top: 16px;
    padding-left: 0 !important;
  }
}
@media (prefers-reduced-motion: reduce) {
  #catalogueResults .panel,
  #catalogueResults .course-marquee {
    transition: none;
  }
  #catalogueResults .panel:hover,
  #catalogueResults .panel:hover .course-marquee {
    transform: none;
  }
}
#inbox_unread {
  background-color: var(--brand-accent);
}
/* ----- Footer -----
   Layout stays here. Colour too until Footer Layout in admin is purple
   (sandbox compiled file still has grey #f6f9fb). */

#footer {
  width: 100%;
  margin-top: auto;
  background-color: var(--brand-primary);
  color: var(--text-on-brand);
}
#footer.container {
  background-color: var(--brand-primary);
  color: var(--text-on-brand);
  width: 100%;
  max-width: none;
  padding: 28px 0;
}
/* Bar stays full width, contents sit on the rail. The columns inside already
   carry Bootstrap's 15px gutter, so the text lines up with the page. */

#footer.container > .row {
  width: 100%;
  max-width: var(--shell-max);
  margin: 0 auto;
  /* The columns inside carry Bootstrap's own 15px, so take that off the
       gutter rather than paying it twice. */
  padding: 0 calc(var(--shell-gutter) - 15px);
}
/* The links block nests a second column inside the first, which would other-
   wise indent it one gutter further than the rows below it. */

#footer.container > .row > [class*="col-"] > .tile {
  padding-left: 0;
  padding-right: 0;
}
#footer a,
#footer .copyright,
#footer address {
  color: var(--text-on-brand);
}
/* Link row reads as navigation, so it carries the bold cut. */

#footer a {
  font-weight: 600;
}
#footer a:hover,
#footer a:focus {
  color: var(--text-on-brand);
  text-decoration: underline;
}
#footer.container .row.divider {
  display: none;
  visibility: hidden;
}
#footer.container .row.tiles #quick_links_tile {
  min-height: 1em;
  margin: 0 0 16px 0;
}
#footer.container .row.tiles #quick_links_tile h3 {
  display: none;
  visibility: hidden;
}
#footer.container .row.tiles #quick_links_tile div {
  display: inline-block;
  float: left;
  margin-right: 30px;
}
#footer.container .row.tiles #quick_links_tile div a {
  text-decoration: none;
}
#footer.container .row.logo-copyright > div {
  width: 100%;
  text-align: left;
  line-height: 1.4em;
}
#footer.container .row.logo-copyright > div h2,
#footer .copyright,
#footer h2 {
  color: var(--text-on-brand);
  font-family: var(--heading-font);
  font-size: 1em;
  margin: 0;
}
/* Copyright block pasted in admin (#bc-copyright). The wrapper above puts
   the headline face on everything inside .copyright, and BCSansHeading only
   ships a 700 cut — so without this the small print renders bold. The h2
   keeps the headline face; the paragraph drops to the regular body cut. */

#footer #bc-copyright p {
  font-family: var(--body-font);
  font-weight: 300;
  margin: 6px 0 0;
}
/* Same 767 breakpoint as the header. Floated inline links overflow the
   viewport (Home also clips overflow-x), so they vanish. Stack them. */

@media screen and (max-width: 767px) {
  #footer.container .row.tiles #quick_links_tile {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    margin: 0 0 24px;
  }
  #footer.container .row.tiles #quick_links_tile div {
    display: block;
    float: none;
    width: 100%;
    margin-right: 0;
  }
  #footer.container .row.tiles #quick_links_tile div a {
    display: inline-block;
    padding: 10px 0;
  }
}
/* ----- Masthead ----- */

#masthead {
  width: 100%;
  /* Also carries .container, so the cap has to come back off for the purple
       to reach the window edge. .main-brand inside it holds the measure. */
  max-width: none;
  position: relative;
  /* No top padding: the signposting tab is the top of the screen, not a
       box sitting on purple. Bottom padding reserves the nav row, which is
       pinned to #masthead's bottom edge so it stays put whatever height the
       logo row ends up. 62 = 12px gap above the nav + the 50px nav row. */
  padding: 0 0 62px;
}
/* Login has no nav row. Keep a little purple under the tab; none above it. */

body.Login #masthead {
  padding: 0 0 16px;
}
body.Login.Login_compressed #masthead #logo {
  margin: 0;
}
#masthead a,
#masthead a:hover,
#masthead a:focus {
  color: var(--text-on-brand);
}
#masthead .main-brand {
  display: flex;
  align-items: center;
  width: 100%;
  max-width: var(--shell-max);
  margin: 0 auto;
  /* Logo and menu are Bootstrap columns carrying their own 15px. */
  padding: 0 calc(var(--shell-gutter) - 15px);
}
#masthead .masthead_logo {
  width: auto;
}
#masthead .masthead_menu {
  width: auto;
  margin-left: auto;
  position: static;
}
#masthead .masthead_menu .masthead-container {
  /* .main-brand already centres this row against the 80px tab. */
  margin-top: 0;
}
#masthead #main_menu_bar {
  float: unset;
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  top: auto;
  width: auto;
  height: 50px;
  background: var(--brand-primary);
  z-index: 1;
}
/* Hairline set to the content measure, not the full bleed. It reads the two
   purple rows as one header and marks the rail the whole page aligns to. */

#masthead #main_menu_bar::before {
  content: "";
  position: absolute;
  top: 0;
  left: var(--shell-gutter);
  right: var(--shell-gutter);
  width: auto;
  max-width: calc(var(--shell-max) - 2 * var(--shell-gutter));
  height: 1px;
  margin: 0 auto;
  background: rgba(255, 255, 255, 0.22);
}
#masthead #main_menu_bar .navbar {
  background: transparent;
}
/* Matches the platform's own selector so this wins on specificity, not
   !important. The platform sets width:auto and padding:0 here. */

#masthead .masthead_menu #main_menu_bar .navbar-default > .container {
  display: flex;
  justify-content: flex-start;
  width: 100%;
  max-width: var(--shell-max);
  margin: 0 auto;
  padding: 0 var(--shell-gutter);
}
/* Every top-level item, not just .dropdown ones. A page the LMS adds to the
   header is a plain <li><a>, and the platform paints those white with dark
   text (#masthead #main_menu_bar .navbar-default .navbar-nav > li > a). */

#masthead #main_menu_bar .navbar-nav > li > a,
#masthead #main_menu_bar .navbar > .container .home.navbar-brand {
  background: transparent !important;
  color: var(--text-on-brand) !important;
  /* Inset shadow rather than a border so the state costs no layout. */
  box-shadow: inset 0 -3px 0 transparent;
  transition: box-shadow 0.15s ease;
}
/* First item in the row. Equal side padding centres the house in its slot
   and gives the hover underline a little width, without Bootstrap's old
   15px-right-only padding that made the line overshoot. */

#masthead #main_menu_bar .navbar > .container .home.navbar-brand {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 50px;
  padding: 0 10px;
}
#masthead #main_menu_bar .navbar-default .navbar-nav > li > a:hover,
#masthead #main_menu_bar .navbar-default .navbar-nav > li > a:focus,
#masthead #main_menu_bar .navbar-default .navbar-nav > li.open > a,
#masthead #main_menu_bar .navbar-default .navbar-nav > li.active > a,
#masthead #main_menu_bar .navbar > .container .home.navbar-brand:hover,
#masthead #main_menu_bar .navbar > .container .home.navbar-brand:focus {
  background: transparent !important;
  color: var(--text-on-brand) !important;
  box-shadow: inset 0 -3px 0 var(--text-on-brand);
}
.dropdown-menu > li > a {
  white-space: normal;
}
#masthead #main_menu_bar .dropdown-menu > .active > a {
  background-color: transparent !important;
}
#masthead #main_menu_bar .dropdown-menu > li > a:hover {
  text-decoration: underline;
}
#masthead #login_info {
  background-color: transparent;
}
#logo .pageLogo img {
  content: url(https://BritishCouncil.b-cdn.net/medialibrary/62a4499f-0607-4987-b864-4082d77e341d/67679ed3-fbf3-4650-a13d-c6cde19b9760/1/67679ed3-fbf3-4650-a13d-c6cde19b9760.png);
  object-fit: contain;
  width: auto;
  height: 34px;
}
#logo .pageLogo {
  flex-shrink: 0;
}
#logo {
  display: flex;
  white-space: nowrap;
  gap: 16px;
  align-items: center;
}
/* Beats the platform's #masthead #logo margin without needing !important. */

#masthead #logo {
  margin: 0;
}
/* Signposting tab. Thinking Cap has no markup for this, so the yellow square
   is a ::after on #logo — stacked lockup, dark indigo on highlight yellow.
   It hangs from the top of the masthead (no padding above it). */

#logo::after {
  content: "Partner\A Schools";
  white-space: pre;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  box-sizing: border-box;
  flex-shrink: 0;
  width: 80px;
  height: 80px;
  padding: 0 10px;
  background-color: var(--brand-highlight);
  color: var(--brand-primary-dark);
  font-family: var(--heading-font);
  font-size: 14px;
  font-weight: 700;
  line-height: 1.1;
}
/* ===== Megamenu: Learn and Connect =====
   Editing guide with worked examples: re-brand/MEGAMENU.md

   HOW IT WORKS
   Thinking Cap builds the menu and gives us no way to add our own classes. So
   each item is styled by the class the platform gives it, which is the page
   name with spaces swapped for underscores:

       page "Self Assessment Tools"  ->  <li class="Self_Assessment_Tools">

   To check an item's class: right-click it in the browser, choose Inspect, and
   read the class on the <li>. Rename a page in the LMS and its class changes,
   so its rules here must change too.

   Every item in a megamenu is one of two kinds:

     QUICK LINK   a small text link in the left-hand column.
     CARD         a picture, a title and a one-line caption, on the right.

   The panel is a CSS grid. Each kind of item is dropped into a named slot:

       quickLinks1 | bigLinks1 | bigLinks2 | bigLinks3
       quickLinks2 | bigLinks1 | bigLinks2 | bigLinks3
       quickLinks3 | bigLinks1 | bigLinks2 | bigLinks3
       quickLinks4 | bigLinks1 | bigLinks2 | bigLinks3
       quickLinks5 | bigLinks1 | bigLinks2 | bigLinks3

   A card is a tall block, so one card fills the full height of its column.
   A page with no rule below still appears, but at the wrong size and in the
   wrong place. If a new page looks wrong, it is almost always missing here.

   The sections below, in order: panel look, grid, quick links, cards, card
   content (pictures and captions), and the disabled Manage/Resources rules. */

/* ----- Panel: how it opens and what it looks like -----
   Opens on hover or keyboard focus on desktop, and when the platform adds the
   .open class (tap or click). Hangs under the nav bar, as wide as the page. */

#main_menu_bar .navbar-collapse .dropdown:hover > .dropdown-menu,
#main_menu_bar .navbar-collapse .dropdown:focus > .dropdown-menu,
#main_menu_bar .navbar-collapse .dropdown:focus-within > .dropdown-menu,
#main_menu_bar .navbar-collapse .dropdown.open > .dropdown-menu {
  position: absolute;
  left: 0;
  right: 0;
  width: 100%;
  max-width: var(--shell-max);
  margin: 0 auto;
  /* Stock Bootstrap puts a 1px border and a hard drop shadow on all four
       sides, which showed as a seam against the viewport edge. */
  border: 0;
  border-radius: 0 0 8px 8px;
  box-shadow: 0 20px 36px -22px rgba(39, 0, 76, 0.35);
}
/* Items must not be positioned, or the panel would size itself to its own
   menu item instead of the whole bar. */

#main_menu_bar .navbar-collapse .nav.navbar-nav > li {
  position: static;
}
#main_menu_bar .navbar-collapse .dropdown .dropdown-menu a {
  text-decoration: none;
  padding: 0;
  color: var(--brand-primary-dark);
}
#main_menu_bar .navbar-collapse .dropdown .dropdown-menu a:hover {
  background: transparent;
  color: var(--brand-primary-dark);
}
/* ----- Grid: the slots every item is dropped into -----
   Four equal columns: one for quick links, three for cards. The slot names
   are what the rules further down refer to. Add a row here only if a menu
   needs more than five quick links. */

#main_menu_bar .navbar-collapse li.dropdown:hover > .dropdown-menu,
#main_menu_bar .navbar-collapse li.dropdown.open > .dropdown-menu {
  display: grid !important;
  grid-template-areas: "quickLinks1 bigLinks1 bigLinks2 bigLinks3" "quickLinks2 bigLinks1 bigLinks2 bigLinks3" "quickLinks3 bigLinks1 bigLinks2 bigLinks3" "quickLinks4 bigLinks1 bigLinks2 bigLinks3" "quickLinks5 bigLinks1 bigLinks2 bigLinks3";
  grid-template-columns: repeat(4, 1fr);
  column-gap: 30px;
  row-gap: 10px;
  padding: 40px var(--shell-gutter) 44px;
}
/* ----- Quick links -----
   The small text links down the left. One rule per slot; each carries the
   same look (14px, a little room on the right).

   TO ADD A QUICK LINK: put its class name in one of the lists below. Names
   in the same list share a slot, which is fine because each menu only has
   one item per slot (Learn uses its own names, Connect uses its own).
   If a slot is already taken in that menu, use the next free one. */

li.My_Connections,
li.Getting_Started {
  grid-area: quickLinks1;
  padding-right: 10px;
  font-size: 14px;
}
li.Inbox,
li.My_Learning_Portfolio {
  grid-area: quickLinks2;
  padding-right: 10px;
  font-size: 14px;
}
/* Edit_My_Profile and My_Profile are the same page under its old and new
   name. Keep whichever the LMS currently uses and delete the other. */

li.Edit_My_Profile,
li.My_Profile,
li.Safeguarding {
  grid-area: quickLinks3;
  padding-right: 10px;
  font-size: 14px;
}
/* Sandbox-only page for now; live has no Self Assessment Tools, which is why
   Safeguarding takes slot 3 and this sits below it. */

li.Self_Assessment_Tools {
  grid-area: quickLinks4;
  padding-right: 10px;
  font-size: 14px;
}
/* The "Quick Links" heading is drawn above whichever item sits in slot 1, so
   the first rule above and this one must name the same items. If you move or
   rename the slot-1 item, update both. On mobile the heading comes from the
   platform's hidden "Learn" / "Connect" item instead (see the mobile block). */

li.My_Connections::before,
li.Getting_Started::before {
  content: "Quick Links";
  display: block;
  color: var(--brand-primary-dark);
  font-weight: 600;
  font-size: 16px;
  margin-bottom: 15px;
}
/* ----- Cards: the look they all share -----
   TO ADD A CARD, do three things:
     1. Add its class name to the LOOK list below (the three selectors).
     2. Add it to a SLOT rule below (bigLinks1, 2 or 3).
     3. Add a block for it under "Card content" with its picture and caption.
   Keep the lists in step, or the card loses its picture, caption or place. */

/* Title */

li.Partner_Schools_Connect a span,
li.Forums a span,
li.Messages a span,
li.Courses a span,
li.Modules a span,
li.Webinars a span {
  font-weight: 600;
  color: var(--brand-primary-dark);
  font-size: 16px;
  display: block;
  margin-top: 10px;
}
/* Picture. The image itself comes from --card-image (set per card below).
   The grey is what shows if the image is missing or still loading. */

li.Partner_Schools_Connect a:before,
li.Forums a:before,
li.Messages a:before,
li.Courses a:before,
li.Modules a:before,
li.Webinars a:before {
  content: '';
  display: block;
  height: 150px;
  width: 100%;
  background-color: #d6d6d6;
  background-image: var(--card-image);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  border-radius: 0;
}
/* Caption. The text itself comes from --card-text (set per card below). */

li.Partner_Schools_Connect a:after,
li.Forums a:after,
li.Messages a:after,
li.Courses a:after,
li.Modules a:after,
li.Webinars a:after {
  content: var(--card-text);
  color: #666666;
  font-size: 13px;
}
/* ----- Cards: which column each one sits in -----
   bigLinks1 is the first card column. Its cards also get the thin vertical
   line that separates the cards from the quick links. */

li.Partner_Schools_Connect,
li.Courses {
  grid-area: bigLinks1;
  margin-bottom: 20px;
  position: relative;
}
li.Partner_Schools_Connect::before,
li.Courses::before {
  display: block;
  content: '';
  background: #e0e0e0;
  height: 100%;
  width: 1px;
  position: absolute;
  left: -30px;
  top: 0;
}
li.Forums,
li.Modules {
  grid-area: bigLinks2;
  margin-bottom: 20px;
}
li.Messages,
li.Webinars {
  grid-area: bigLinks3;
  margin-bottom: 20px;
}
/* ----- Card content: pictures and captions -----
   HOW TO CHANGE A PICTURE OR CAPTION
   Edit the two lines for that card. Nothing else needs touching.

     --card-image   the picture. Any image URL works. Upload new pictures in
                    the LMS (Learner View > Advanced files, or the media
                    library) and paste the link here. Cards are about 380px
                    wide by 150px tall on desktop; use images at least 760px
                    wide, landscape, with the subject near the middle (the
                    picture is cropped to fit, not stretched).
     --card-text    the caption. Plain text in quotes. Keep it to one or two
                    short lines. An apostrophe is fine inside double quotes.

   PICTURES THAT ARE SHARED
   Modules and Webinars are using placeholder pictures borrowed from the
   Manage and Resources menus (see "Disabled" below), so those two will repeat
   if Manage and Resources are switched back on. Replace them when final
   pictures are ready. */

/* ----- Learn ----- */

li.Courses {
  --card-image: url('https://newpsgn-bc.thinkingcap.com/FormatResource.ashx/learnerView/551b98de-ebf9-4549-a00c-5fee996b833d/advanced/image%20(courses).png');
  --card-text: "Comprehensive learning pathways designed to develop your professional skills";
}
/* Placeholder: "team learning" picture, borrowed from Manage. */

li.Modules {
  --card-image: url('https://newpsgn-bc.thinkingcap.com/FormatResource.ashx/learnerView/551b98de-ebf9-4549-a00c-5fee996b833d/advanced/image%20(team%20learning).png');
  --card-text: "Focused, bite-sized learning modules on specific topics";
}
/* Placeholder: "leadership zone" picture, borrowed from Manage. */

li.Webinars {
  --card-image: url('https://newpsgn-bc.thinkingcap.com/FormatResource.ashx/learnerView/551b98de-ebf9-4549-a00c-5fee996b833d/advanced/image%20(leadership%20zone).png');
  --card-text: "Live and recorded sessions with expert facilitators";
}
/* ----- Connect ----- */

li.Partner_Schools_Connect {
  --card-image: url('https://newpsgn-bc.thinkingcap.com/FormatResource.ashx/learnerView/551b98de-ebf9-4549-a00c-5fee996b833d/advanced/image%20(connect%20directory).png');
  --card-text: "Find and collaborate with teachers from around the world";
}
li.Forums {
  --card-image: url('https://newpsgn-bc.thinkingcap.com/FormatResource.ashx/learnerView/551b98de-ebf9-4549-a00c-5fee996b833d/advanced/image%20(forums).png');
  --card-text: "Engage in discussions and share insights with your peers";
}
li.Messages {
  --card-image: url('https://newpsgn-bc.thinkingcap.com/FormatResource.ashx/learnerView/551b98de-ebf9-4549-a00c-5fee996b833d/advanced/image%20(messages).png');
  --card-text: "Communicate directly with your connections and collaborators";
}
/* ----- DISABLED: Manage and Resources megamenus -----
   Manage and Resources are plain pages added in the LMS (no dropdown), so none
   of the rules below are needed. They are commented out, not deleted, so they
   can be brought back if either becomes a dropdown with sub-pages again.

   TO SWITCH THEM BACK ON
   Delete the opening comment marker on the line just after this note and the
   closing comment marker on the last line of the block. Everything inside is
   self-contained. Then check that each LMS page name still matches its class
   (for example "My Team Overview" must still give li.My_Team_Overview).

   Manage uses the same 4-column grid as Learn and Connect. Resources has no
   third card column, so it gets its own 3-column grid at the top.

   Two of these cards (Leadership_Zone, Assign_and_Customize_Learning) have
   their pictures lent to Webinars and Modules above. Give them or Webinars
   and Modules their own pictures before switching this on, or the same
   picture will appear twice. */

/*

#main_menu_bar .navbar-collapse li.dropdown.Resources:hover > .dropdown-menu,
#main_menu_bar .navbar-collapse li.dropdown.Resources.open > .dropdown-menu {
    grid-template-areas:
        "quickLinks1 bigLinks1 bigLinks2"
        "quickLinks2 bigLinks1 bigLinks2"
        "quickLinks3 bigLinks1 bigLinks2"
        "quickLinks4 bigLinks1 bigLinks2"
        "quickLinks5 bigLinks1 bigLinks2";
    grid-template-columns: repeat(3, 1fr);
}

li.My_Team_Overview,
li.Recently_Added {
    grid-area: quickLinks1;
    padding-right: 10px;
    font-size: 14px;
}

li.My_Team_Overview::before,
li.Recently_Added::before {
    content: "Quick Links";
    display: block;
    color: var(--brand-primary-dark);
    font-weight: 600;
    font-size: 16px;
    margin-bottom: 15px;
}

li.Team_Progress_Dashboard,
li.Most_Popular {
    grid-area: quickLinks2;
    padding-right: 10px;
    font-size: 14px;
}

li.Create_Custom_Course,
li.Saved_Resources {
    grid-area: quickLinks3;
    padding-right: 10px;
    font-size: 14px;
}

li.Assign_Learning {
    grid-area: quickLinks4;
    padding-right: 10px;
    font-size: 14px;
}

li.Leadership_Zone a span,
li.My_Team a span,
li.Assign_and_Customize_Learning a span,
li.Resource_Library a span,
li.Blogs_and_Articles a span {
    font-weight: 600;
    color: var(--brand-primary-dark);
    font-size: 16px;
    display: block;
    margin-top: 10px;
}

li.Leadership_Zone a:before,
li.My_Team a:before,
li.Assign_and_Customize_Learning a:before,
li.Resource_Library a:before,
li.Blogs_and_Articles a:before {
    content: '';
    display: block;
    height: 150px;
    width: 100%;
    background-color: #d6d6d6;
    background-image: var(--card-image);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    border-radius: 0;
}

li.Leadership_Zone a:after,
li.My_Team a:after,
li.Assign_and_Customize_Learning a:after,
li.Resource_Library a:after,
li.Blogs_and_Articles a:after {
    content: var(--card-text);
    color: #666666;
    font-size: 13px;
}

li.Leadership_Zone,
li.Resource_Library {
    grid-area: bigLinks1;
    margin-bottom: 20px;
    position: relative;
}

li.Leadership_Zone::before,
li.Resource_Library::before {
    display: block;
    content: '';
    background: #E0E0E0;
    height: 100%;
    width: 1px;
    position: absolute;
    left: -30px;
    top: 0;
}

li.My_Team,
li.Blogs_and_Articles {
    grid-area: bigLinks2;
    margin-bottom: 20px;
}

li.Assign_and_Customize_Learning {
    grid-area: bigLinks3;
    margin-bottom: 20px;
}

li.Leadership_Zone {
    --card-image: url('https://newpsgn-bc.thinkingcap.com/FormatResource.ashx/learnerView/551b98de-ebf9-4549-a00c-5fee996b833d/advanced/image%20(leadership%20zone).png');
    --card-text: "Access leadership-specific content and resources";
}

li.My_Team {
    --card-image: url('https://newpsgn-bc.thinkingcap.com/FormatResource.ashx/learnerView/551b98de-ebf9-4549-a00c-5fee996b833d/advanced/image%20(my%20team).png');
    --card-text: "Manage and monitor your team's professional development";
}

li.Assign_and_Customize_Learning {
    --card-image: url('https://newpsgn-bc.thinkingcap.com/FormatResource.ashx/learnerView/551b98de-ebf9-4549-a00c-5fee996b833d/advanced/image%20(team%20learning).png');
    --card-text: "Create tailored learning pathways for your staff";
}

li.Resource_Library {
    --card-image: url('https://newpsgn-bc.thinkingcap.com/FormatResource.ashx/learnerView/551b98de-ebf9-4549-a00c-5fee996b833d/advanced/image%20(resource%20library).png');
    --card-text: "Access a comprehensive collection of teaching materials and guides";
}

li.Blogs_and_Articles {
    --card-image: url('https://newpsgn-bc.thinkingcap.com/FormatResource.ashx/learnerView/551b98de-ebf9-4549-a00c-5fee996b833d/advanced/image%20(blogs).png');
    --card-text: "Read insights and best practices from education experts";
}

@media screen and (max-width: 767px) {
    li.My_Team_Overview::before,
    li.Recently_Added::before,
    li.Leadership_Zone::before,
    li.Resource_Library::before {
        display: none;
    }

    li.Leadership_Zone,
    li.Resource_Library {
        margin-top: 10px;
    }
}

*/

#masthead #search span.search_container {
  padding: 3px 11px;
  height: 35px;
}
#masthead #login_info .btn.profile-inbox {
  height: 35px;
  background: transparent;
  border: none;
  border-radius: 0;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px 6px;
}
#masthead .caret {
  margin-left: 5px;
}
#masthead #login_info .btn.profile-inbox .fa-envelope {
  font-size: 19px;
}
#masthead #login_info .btn.profile-dropdown {
  height: 35px;
  background: transparent;
  border: none;
  border-radius: 0;
  display: flex;
  align-items: center;
  gap: 1px;
  padding: 6px 6px;
}
#masthead #login_info .btn.profile-dropdown .fa-gear {
  font-size: 17px;
}
#masthead #login_info .open .btn {
  color: white;
}
#login_info {
  gap: 3px;
}
.profile-menu li img.profile,
#log_in_bar .profile-menu li img.profile {
  margin: 0;
  margin-right: -10px;
}
.profile-menu li.dropdown-header {
  white-space: unset;
}
/* ----- Home slide tile -----
   Caption panel is the old #myCarousel rules (image in flow, caption
   absolute on the right) with yellow + dark indigo (same pairing as the
   signposting tab). No diamond corners, no pull-up over the masthead.
   The lavender frame is a ::before so the row can stay in the page flow. */

body.Home {
  overflow-x: hidden;
}
body.Home #content.container {
  padding-top: 0 !important;
}
body.Home .row.slideshow {
  position: relative;
  /* Own stacking context at 0 so the columns below cannot rise above
       #main_menu_bar (z-index 1) and hide the mega menu. */
  z-index: 0;
  display: flex;
  padding-top: var(--shell-gutter);
  padding-bottom: var(--shell-gutter);
}
body.Home .row.slideshow::before {
  content: "";
  /* Bootstrap's .row clearfix sets display: table on this pseudo, which
       shrink-wraps to 0 and swallows the band. */
  display: block;
  position: absolute;
  top: 0;
  bottom: 0;
  left: calc(50% - 50vw);
  right: calc(50% - 50vw);
  background-color: var(--brand-primary-light);
  /* Two soft purple glows over the flat tint so the band has depth without
       extra markup or hosted images. Kept under 10% alpha so slide imagery
       still owns the hero. */
  background-image: radial-gradient(circle at 85% -30%, rgba(89, 0, 193, 0.09), transparent 55%), radial-gradient(circle at 6% 130%, rgba(89, 0, 193, 0.07), transparent 45%);
  z-index: 0;
  pointer-events: none;
}
body.Home .row.slideshow > [class*="col-"] {
  position: relative;
  z-index: 1;
  float: none;
  flex: 1 1 auto;
  width: 100%;
}
/* Platform caps this at 300px. Beat that so the image can size itself. */

body.Home #myCarousel,
body.Home #myCarousel .carousel-inner > .item {
  max-height: none;
}
body.Home #myCarousel .carousel-inner > .item > img {
  width: 100%;
  height: auto;
}
body.Home #myCarousel .carousel-control {
  width: 40px;
}
body.Home #myCarousel .carousel-indicators {
  left: 0;
  right: 0;
  width: 100%;
  margin: 0;
}
/* Caption rises in on load. Opacity + transform only, so it composites
   cheaply; reduced-motion turns it off at the bottom of the file. */

@keyframes home-caption-in {
  from {
    opacity: 0;
    transform: translateY(12px);
  }
  to {
    opacity: 1;
    transform: none;
  }
}
body.Home #myCarousel .carousel-caption {
  background-color: var(--brand-highlight);
  top: 0;
  bottom: 0;
  left: auto;
  right: 0;
  padding: 30px 45px;
  /* Fixed panel, not shrink-to-fit, so short slide copy still fills it.
       The percentage only bites once the carousel drops below ~890px. */
  width: 400px;
  max-width: 45%;
  color: var(--brand-primary-dark);
  text-shadow: none;
  text-align: left;
  animation: home-caption-in 0.6s ease-out both;
}
body.Home #myCarousel .carousel-caption > h1,
body.Home #myCarousel .carousel-caption h1,
body.Home #myCarousel .carousel-caption h2,
body.Home #myCarousel .carousel-caption p,
body.Home #myCarousel .carousel-caption > div {
  color: var(--brand-primary-dark);
}
/* Match home section headings (h2) and body copy — the panel is a card,
   not a page title, so the 2em h1 was wrapping too large. */

body.Home #myCarousel .carousel-caption > h1,
body.Home #myCarousel .carousel-caption h1,
body.Home #myCarousel .carousel-caption h2 {
  font-size: 1.5em;
  line-height: 1.3;
}
body.Home #myCarousel .carousel-caption > h1 {
  margin: 0 0 12px;
}
body.Home #myCarousel .carousel-caption > div,
body.Home #myCarousel .carousel-caption p {
  margin: 0;
  font-size: 1em;
  line-height: 1.5;
}
body.Home #myCarousel .carousel-caption > div br {
  margin: 0;
}
body.Home #myCarousel .carousel-caption > div p + br {
  display: none;
  visibility: hidden;
}
body.Home #myCarousel .carousel-caption a {
  color: var(--brand-primary-dark);
}
body.Home #myCarousel .carousel-caption .more-button,
body.Home #myCarousel .carousel-caption .btn {
  display: inline-block;
  float: none;
  margin-top: 1em;
  padding: 8px 12px;
  line-height: 1.4;
  border-radius: 9999px;
  background-color: var(--brand-primary);
  border: 1px solid var(--brand-primary);
  color: var(--text-on-brand);
  font-weight: 600;
  text-decoration: none;
}
body.Home #myCarousel .carousel-caption .more-button:hover,
body.Home #myCarousel .carousel-caption .more-button:focus,
body.Home #myCarousel .carousel-caption .btn:hover,
body.Home #myCarousel .carousel-caption .btn:focus {
  background-color: var(--brand-primary-dark);
  border-color: var(--brand-primary-dark);
  color: var(--text-on-brand);
  text-decoration: none;
}
body.Home #myCarousel .carousel-caption > div p + br + .more-button {
  margin-top: 0;
}
/* ----- Home page columns ----- */

body.Home .home-layout {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  gap: 40px 48px;
  margin-left: 0;
  margin-right: 0;
  width: 100%;
  padding-top: 40px;
  padding-bottom: 40px;
}
body.Home .home-layout > [class*="col-"] {
  float: none;
  width: auto;
  flex: 1 1 calc(26%);
  min-width: 0;
  max-width: 100%;
  padding-left: 0;
  padding-right: 0;
}
#home-rightcolumn,
#home-leftcolumn {
  display: flex;
  flex-direction: column;
  gap: 40px;
}
#home-rightcolumn .home_feature,
#home-leftcolumn #psgn-welcome {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
  width: 100%;
}
#home-rightcolumn .home_feature h2,
#home-leftcolumn h2 {
  margin: 0;
}
/* Short brand keyline under each section heading — same device family as
   .ps-eyebrow. Square-ended to match the no-radius rule. */

#home-rightcolumn .home_feature h2::after,
#home-leftcolumn h2::after {
  content: "";
  display: block;
  width: 48px;
  height: 4px;
  margin-top: 10px;
  background-color: var(--brand-primary);
}
#home-rightcolumn .home_feature > div,
#home-rightcolumn .home_feature p,
#home-leftcolumn p {
  margin: 0;
  max-width: 42em;
}
#home-rightcolumn .home_feature img,
#home-leftcolumn img,
#home-leftcolumn .embed-responsive {
  width: 100%;
  max-width: 100%;
  height: auto;
  border-radius: 0;
  display: block;
}
#home-rightcolumn .home_feature > a.btn {
  align-self: flex-start;
  float: none;
  margin: 4px 0 0 0;
}
/* 767, not 768. Bootstrap un-collapses the navbar at min-width 768, so a mobile
   block ending at 768 leaves a one-pixel window where the stacked rules and the
   horizontal navbar are both live. */

@media screen and (max-width: 767px) {
  .masthead_search #search {
    display: none !important;
    visibility: hidden !important;
  }
  /* Sit in the hamburger row. Do not use bottom: 0 — that stretches these
         icons through the open megamenu and centres them over Connect. */
  
  #login_info {
    position: absolute;
    z-index: 2;
    top: 0;
    right: 70px;
    height: 50px;
    display: flex;
    align-items: center;
  }
  /* Megamenu on mobile. The desktop "Quick Links" heading (drawn above the
         slot-1 item) is switched off here, and the platform's own hidden menu
         title item (class hidden-sm hidden-md hidden-lg, shown only on mobile)
         carries the heading instead. Keep the first list in step with the
         slot-1 items in the "Quick links" section. Desktop-only picture
         separators are switched off further down. */
  
  li.My_Connections::before,
  li.Getting_Started::before {
    display: none;
  }
  li.hidden-sm.hidden-md.hidden-lg::before {
    content: "Quick Links";
    display: block;
    color: var(--brand-primary-dark);
    font-weight: 600;
    font-size: 16px;
    margin-bottom: 15px;
  }
  #masthead {
    padding: 0;
  }
  /* Nav stacks into the flow on mobile, so it needs no rail and no reserved row. */
  
  #masthead #main_menu_bar::before {
    display: none;
  }
  #main_menu_bar .navbar-collapse .dropdown .dropdown-menu a {
    max-width: 400px;
  }
  #main_menu_bar .navbar-collapse li.dropdown:hover > .dropdown-menu,
  #main_menu_bar .navbar-collapse li.dropdown:focus > .dropdown-menu,
  #main_menu_bar .navbar-collapse li.dropdown:focus-within > .dropdown-menu {
    display: none !important;
    outline: none;
  }
  #main_menu_bar .navbar-collapse li.dropdown.open > .dropdown-menu {
    position: static;
    display: flex !important;
    flex-direction: column;
    row-gap: 11px;
    padding: 25px 15px 5px 15px;
    background: white;
    width: calc(100% - 20px);
    margin: 15px 10px;
    border-radius: 7px;
    margin-top: 7px;
  }
  #main_menu_bar .navbar-default .navbar-collapse,
  #main_menu_bar .navbar-default .navbar-form {
    border: none;
  }
  /* Stacked list on mobile, so a filled block reads better than an underline.
         Same width and inset as the open panel below, so the two line up. */
  
  #masthead #main_menu_bar .navbar-default .navbar-nav > li > a:hover,
  #masthead #main_menu_bar .navbar-default .navbar-nav > li > a:focus,
  #masthead #main_menu_bar .navbar-default .navbar-nav > li.open > a,
  #masthead #main_menu_bar .navbar-default .navbar-nav > li.active > a {
    background: rgba(255, 255, 255, 0.12) !important;
    color: white !important;
    box-shadow: none;
    width: calc(100% - 20px);
    margin: 0 10px;
    border-radius: 7px;
    outline: none;
  }
  /* Home icon sits in the toggle row, not the stacked list, so it keeps its
         own size rather than taking the full-width block. */
  
  #masthead #main_menu_bar .navbar > .container .home.navbar-brand:hover,
  #masthead #main_menu_bar .navbar > .container .home.navbar-brand:focus {
    background: rgba(255, 255, 255, 0.12) !important;
    color: white !important;
    box-shadow: none;
    border-radius: 7px;
    outline: none;
  }
  /* Cards stack in one column on mobile, so the vertical separator line goes
         and the first card of each menu gets a little space above it. Name the
         same items as the bigLinks1 cards in the "Cards" section. */
  
  li.Partner_Schools_Connect::before,
  li.Courses::before {
    display: none;
  }
  li.Partner_Schools_Connect,
  li.Courses {
    margin-top: 10px;
  }
  #masthead .masthead_menu,
  #masthead .masthead_logo {
    width: 100%;
  }
  #masthead .main-brand {
    flex-direction: column;
    /* Centring is a horizontal instruction once the axis turns, which would
             shrink both rows to their content. */
    align-items: stretch;
  }
  #masthead .masthead_menu .masthead-container {
    position: relative;
    margin-top: 0px;
    margin-bottom: 0;
  }
  #masthead .masthead_menu {
    position: relative;
    margin-top: 10px;
  }
  #masthead #main_menu_bar {
    position: static;
    height: auto;
    /* .masthead-container is a row-reverse flex row, so the bar has to be
             told to fill it. Left to itself it shrinks to its content and packs
             to the right, which is what the old width:100vw was masking. */
    flex: 1 1 auto;
    /* Its column edge sits exactly one gutter in, so pulling back by the
             same amount lands the bar on the window edge. */
    margin: 0 calc(-1 * var(--shell-gutter)) !important;
  }
  /* Bootstrap's own 15px gutter, on top of the container padding, would hold
         the toggle short of the rail the logo sits on. */
  
  #masthead #main_menu_bar .navbar-toggle {
    margin-right: 0;
  }
  #main_menu_bar .navbar-collapse > .navbar-nav {
    display: flex;
    flex-direction: column;
  }
  .navbar-default .navbar-toggle {
    background: transparent;
    border: none;
    width: 40px;
    padding: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
  }
  .navbar-default .navbar-toggle:focus,
  .navbar-default .navbar-toggle:hover {
    background: transparent;
  }
  .navbar-default .navbar-toggle .icon-bar {
    background-color: white;
    width: 27px;
  }
  .navbar-toggle .icon-bar + .icon-bar {
    margin-top: 6px;
  }
  /* Image, then the yellow panel underneath. Same flex stack as the old
         file, without the overlap or the 260px min-height. */
  
  body.Home #myCarousel .carousel-inner > .item {
    display: none;
    max-height: none;
  }
  body.Home #myCarousel .carousel-inner > .item.active {
    display: flex !important;
    flex-direction: column;
    align-items: stretch;
    max-height: none;
  }
  body.Home #myCarousel .carousel-inner > .item img {
    width: 100%;
    height: auto;
  }
  body.Home #myCarousel .carousel-caption {
    position: relative;
    top: auto;
    bottom: auto;
    left: auto;
    right: auto;
    width: auto;
    max-width: none;
    padding: 24px 20px;
  }
  body.Home .home-layout {
    flex-direction: column;
    flex-wrap: nowrap;
    gap: 32px;
  }
  body.Home .home-layout > [class*="col-"] {
    flex: 1 1 auto;
    width: 100%;
    max-width: 100%;
  }
  #home-rightcolumn,
  #home-leftcolumn {
    gap: 32px;
  }
  #home-rightcolumn .home_feature > div,
  #home-rightcolumn .home_feature p,
  #home-leftcolumn p {
    max-width: none;
  }
}
@media screen and (max-width: 576px) {
  #masthead .profile-menu.open .dropdown-menu {
    right: -40px;
  }
}
@media screen and (max-width: 350px) {
  #masthead .profile-menu.open .dropdown-menu {
    right: -50px;
  }
}
@media (prefers-reduced-motion: reduce) {
  #masthead #main_menu_bar .navbar-nav > li > a,
  #masthead #main_menu_bar .navbar > .container .home.navbar-brand,
  .btn,
  .btn-default,
  .btn-primary,
  .btn_brand {
    transition: none;
  }
  body.Home #myCarousel .carousel-caption {
    animation: none;
  }
}
/* ----- Static content pages (.ps-*) -----
   Reusable blocks for hand-built Content Pages (safeguarding, Aptis, etc.)
   so their HTML needs no inline styles. Everything is namespaced .ps- so
   nothing leaks into platform screens. Markup pattern:
   pages/safeguarding_resources_new.html. */

/* Content pages centre their reading column with .mx-auto, but this platform
   is Bootstrap 3, which does not ship that class. float:none beats the
   column float so the margins can actually centre it. */

.mx-auto {
  float: none;
  margin-left: auto;
  margin-right: auto;
}
.ps-page {
  padding-bottom: 64px;
}
/* Reading measure. The column is ~810px on desktop; capping text at 70ch
   keeps lines comfortable without narrowing images or panels. */

.ps-page p,
.ps-page ul,
.ps-page ol {
  max-width: 70ch;
}
.ps-lede {
  font-size: 1.125em;
  line-height: 1.6;
}
/* Sections separate themselves: air always, hairline between neighbours.
   No spacer divs or inline margins in the HTML. */

.ps-section {
  margin-top: 48px;
}
.ps-section + .ps-section {
  border-top: 1px solid #e6ddf3;
  padding-top: 40px;
}
.ps-section > h2 {
  margin-top: 0;
  margin-bottom: 16px;
}
/* Small uppercase label above a heading (e.g. "New resource"). */

.ps-eyebrow {
  display: block;
  font-family: var(--heading-font);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--brand-primary);
  margin-bottom: 8px;
}
/* Images and containers are square — no diamond/offset corners (old brand). */

.ps-hero {
  overflow: hidden;
}
.ps-figure {
  overflow: hidden;
  margin: 20px 0;
}
.ps-hero img,
.ps-figure img {
  width: 100%;
  height: auto;
  display: block;
}
/* Lavender featured panel — "featured" reads visually, not typed in caps. */

.ps-callout {
  background-color: var(--brand-primary-light);
  padding: 28px 32px 32px;
}
.ps-callout .ps-figure {
  margin-top: 0;
}
.ps-actions {
  margin-top: 20px;
  margin-bottom: 0;
}
/* Media list: thumbnail + text rows (course units, downloads). */

.ps-media {
  display: flex;
  align-items: flex-start;
  gap: 28px;
  padding: 28px 0;
}
.ps-media + .ps-media {
  border-top: 1px solid #e6ddf3;
}
.ps-media-figure {
  flex: 0 0 232px;
  max-width: 232px;
  overflow: hidden;
}
.ps-media-figure img {
  width: 100%;
  height: auto;
  display: block;
}
.ps-media-body {
  flex: 1 1 auto;
  min-width: 0;
}
.ps-media-body h3 {
  margin: 0 0 10px;
}
.ps-media-body p {
  margin: 0 0 12px;
}
/* 50/50 variant for feature rows with bigger imagery (Aptis variant pages). */

.ps-media--split .ps-media-figure {
  flex-basis: 46%;
  max-width: 46%;
}
/* Responsive 16:9 video embed (YouTube etc.) — drop-in alternative to .ps-hero. */

.ps-video {
  position: relative;
  height: 0;
  padding-bottom: 56.25%;
  overflow: hidden;
}
.ps-video iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 0;
}
/* Centred call-to-action panel: heading + button. */

.ps-cta {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  text-align: center;
  background-color: var(--brand-primary-light);
  padding: 32px 24px;
  margin-top: 40px;
}
.ps-cta h3,
.ps-cta h4 {
  margin: 0;
}
/* Brand button that works with or without .btn on the element.
   Replaces the red .btn_brand in pages/Aptis ESOL/new.css — that red is the
   English Assessment brand, not Partner Schools. */

.btn_brand {
  display: inline-block;
  background-color: var(--brand-primary);
  border: 1px solid var(--brand-primary);
  color: var(--text-on-brand);
  font-weight: 600;
  padding: 8px 12px;
  line-height: 1.4;
  border-radius: 9999px;
  text-decoration: none;
  transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}
.btn_brand:hover,
.btn_brand:focus,
.btn_brand:active {
  background-color: var(--brand-primary-dark);
  border-color: var(--brand-primary-dark);
  color: var(--text-on-brand);
  text-decoration: none;
}
/* Bootstrap 3 accordions on content pages: square, hairline, brand heading.
   Scoped to .ps-page so platform panels elsewhere keep their stock look. */

.ps-page .panel-group .panel {
  border: 1px solid #e6ddf3;
  border-radius: 0;
  box-shadow: none;
}
.ps-page .panel-group .panel + .panel {
  margin-top: 12px;
}
.ps-page .panel-group .panel-heading {
  background-color: transparent;
  border: 0;
  padding: 0;
}
.ps-page .panel-title a {
  display: block;
  padding: 16px 20px;
  font-weight: 700;
  color: var(--brand-primary-dark);
  text-decoration: none;
}
.ps-page .panel-title a:hover,
.ps-page .panel-title a:focus {
  color: var(--brand-primary);
  text-decoration: none;
}
/* Open/closed affordance. Bootstrap toggles .collapsed on the link. */

.ps-page .panel-title a::after {
  content: "\2212";
  float: right;
  color: var(--brand-primary);
}
.ps-page .panel-title a.collapsed::after {
  content: "+";
}
.ps-page .panel-collapse .panel-body {
  border: 0;
  border-top: 1px solid #e6ddf3;
  padding: 20px;
}
.ps-page .panel-body img {
  max-width: 100%;
  height: auto;
  display: block;
  margin: 12px 0;
}
.ps-page .panel-body h3 {
  margin-top: 20px;
}
/* Arrow link. The arrow is CSS, so the HTML never types "→". */

.ps-more {
  display: inline-block;
  font-weight: 600;
  text-decoration: none;
}
.ps-more::after {
  content: "\2192";
  display: inline-block;
  margin-left: 6px;
  transition: transform 0.15s ease;
}
.ps-more:hover,
.ps-more:focus {
  text-decoration: underline;
}
.ps-more:hover::after,
.ps-more:focus::after {
  transform: translateX(3px);
}
@media screen and (max-width: 767px) {
  .ps-section {
    margin-top: 36px;
  }
  .ps-section + .ps-section {
    padding-top: 32px;
  }
  .ps-callout {
    padding: 20px;
  }
  .ps-media {
    flex-direction: column;
    gap: 16px;
    padding: 24px 0;
  }
  .ps-media-figure,
  .ps-media--split .ps-media-figure {
    flex-basis: auto;
    max-width: 100%;
  }
  .ps-cta {
    padding: 24px 20px;
  }
}
@media (prefers-reduced-motion: reduce) {
  .ps-more::after {
    transition: none;
  }
}