You can customize the overall look and feel of your LMS by editing or adding Cascading Style Sheet files (*.css files). The best practice is to copy and save the original Stylesheet code to Notepad or other text editor so that you can revert to the original if necessary. 
 
  1. From the left navigation menu, select Site Management > Edit Stylesheets.
  2. On the Edit Stylesheets page, use the Stylesheet File drop-down list to select the stylesheet you wish to edit. Most of the commonly customized settings are found in the default stylesheet file. Simply edit color codes and remove the block comment syntax to apply changes.
  3. Click Submit to save changes.

NOTE: If you do not see the changes you implemented in the stylesheet and you are certain that your syntax is correct, try clearing your browser cache and refreshing the browser.

LMS Style Guide

/* Default Stylesheet */
/* Branding: change #ffffff to desired header color */
/*
.navbar-bg,
div#headerContainer 
{ background-color:#ffffff;border-bottom-color:#ffffff; }
*/

/* Branding: change #ffffff to desired footer color */
/*
div#footer{ background-color:#ffffff; }
*/

/* Branding: change #ffffff to desired background color */
/*
body{ background-color:#ffffff; }
div#wrapper{ background-color:#ffffff; }
*/

/* Branding: change #727272 to desired link color */
/*
div.list-item-container .list-item .list-item-name > a,
a:link { color: #727272;}
*/

/* Branding: change #7088B4 to desired link state visited, hover, active color */
/*
div.list-item-container .list-item .list-item-name > a:visited, 
div.list-item-container .list-item .list-item-name > a:hover, 
div.list-item-container .list-item .list-item-name > a:active,
a:visited,a:hover, a:active { color:#7088B4 }
*/

/*List Headers*/
/*Branding: change #337ab7 to desired background color*/
/*.hTableHeader,
.list-header-container .row,
.content-panel > .content-panel-heading {
    background-color: #337ab7;
    color: #fff;
}*/

/*Action Buttons*/
/*Branding: change #2d71b3 to desired background color*/
/*.prettyButtons,a.prettyButtons,a.prettyButtons:link,.actionLinkVertical,a.actionLinkVertical,a.actionLinkVertical:link,.actionLink,a.actionLink,a.actionLink:link,
.btn-primary, .btn-primary:link {
    background-color: #2d71b3;
    border-color: #204d74;
    color:#fff;
} */

    /*Branding: change #2c7fb2 to desired background for hover state color*/
/*.prettyButtons:hover, a.prettyButtons:hover, .actionLinkVertical:hover, a.actionLinkVertical:hover, .actionLink:hover, a.actionLink:hover,
    .btn-primary:visited, .btn-primary:hover, .btn-primary[disabled]:hover, .btn-primary:active, .btn-primary:focus,
    .btn-primary:active:hover, .btn-primary:hover:focus, .btn-primary:active:focus {
        background-color: #2c7fb2;
        border-color: #204d74;
        color:#fff;
    }*/

/* uncomment below css to hide the custom Quick Links menu*/
div#ctlTemplate_regLeftNav_ctlMenuFooter_custom_Left_Nav
{ /*display: none;*/ }
 
  

 

Element Notes Code to Edit or Insert: change color codes to desired
Action Buttons color

Covers many common action button colors.

 

/*Note:

.prettyButtons,a.prettyButtons,a.prettyButtons:link,.actionLinkVertical,a.actionLinkVertical,a.actionLinkVertical:link,.actionLink,a.actionLink,a.actionLink:link,

a.btn-primary,.action-link,.action-btn-container .action-link,div.list-item-container .list-item .action-btn-container .action-link {

    background-color: #2d71b3;

    border-color: #204d74;

    color:#fff;
     
LMS Header icons and links Change header link and icon colors

/*NOTE: this updates the  color of buttons/texts in the header*/

div#headerContainer a:link, div#headerContainer a:visited, div#ctlTemplate_regMainBody_ctlTrainingContent_adminTrainingDiv a:link, div#ctlTemplate_regMainBody_ctlTrainingContent_adminTrainingDiv a:visited, .headerText {

    color: #190B07

}
LMS Header background Change Header background

/*NOTE: this updates the header background color*/

.navbar-bg,
div#headerContainer
{ background-color:#ffffff;border-bottom-color:#ffffff; }
LMS Footer Background Background color for the small footer area at the bottom of the page

/*NOTE: this updates the footer background color*/

div#footer{ background-color:#ffffff; }
LMS Background Primary background color for pages such as the Navigation page

/*NOTE: this updates the LMS background color*/

body{ background-color:#ffffff; }
div#wrapper{ background-color:#ffffff; }
Login Page Credentials Text Text for Credentials box

/*NOTE: this updates the text color for the Login Page credentials box*/

.loginLabel {

   color: #190B07

}