/********************recolors***********************/

/*gold gamification icon*/
.internal-header-gamification ui-button-icon button ui-icon span.color-neutral svg {fill: #FFD700;}
/*blue robot icon*/
.internal-header-virtual-coach ui-button-icon button ui-icon span.color-neutral svg {fill: #133D8D;}

/*compactify "my home page" bar*/
div#page-title__wrapper {
	padding-top: 2px !important;
	padding-bottom: 2px !important;
	min-height: 50px !important;
}

/*compactify homepage widgets */
.single-widget.ng-star-inserted {
    margin-bottom: 10px;
}/* make all UI boxes closer together vertically*/

/********************avatar image***********************/

/*default profile image - not working yet
.avatar__initials.bg-main.text-grey-superlight.ng-star-inserted
.avatar-clip.border-main.ng-star-inserted
myprofile-widget div.avatar-container  {
    background: url(https://docebo-institute.s3.us-east-2.amazonaws.com/public/branding_hacks/default-profile-image.png) no-repeat !important;
    height: 100px;
    background-size: contain;
    width: 100px;
    background-position: top;
    margin: 0 auto;
}*/

/*move avatar image up and left*/
myprofile-widget div.wrapper.wrapper-shadow.ng-star-inserted div.cover div.profile { 
    padding-top: 10px !important;
    padding-left: 10px !important;
}
/*resize profile widget avatar image*/
myprofile-widget .profile .avatar-container avatar .avatar-clip .avatar__image {
    height: 100px !important;
    width: 100px !important;
}
/*move profile widget realname and email to the right*/
myprofile-widget .profile .details-container {padding-left: 110px !important;}

/* disable overflow on my profile text */
myprofile-widget myprofile-additional-field.additional-field div.root div.label {
	overflow: hidden;
	width: 100%;
}
/*expand my profile widget */
myprofile-widget div.additional-fields-container {
	padding-top: 8px !important;
	padding-left: 8px !important;
	padding-right: 8px !important;
}

/* compactify my profile buttons*/
myprofile-widget widget-action-button div.root.action a.mdl-button.mdl-js-button.text-main {
	height: 24px;
    line-height: 24px;
}

I accidentally put this in Ideas, but it would definitely be cool if this were implemented so I’ll leave it there!

@lrodman Question for you: I’m simply looking to modify the color of the breadcrumbs bar and the color of the circle around the ‘home’ icon on a single page. Any suggestions? 

On a single page meaning not other http urls I presume?

you’d edit doc-layout-breadcrumbs div.breadcrumbs { background-color and the circle, but do them within the page(s) you want

Here’s some examples of a different edit:

#doc-page-86 div.pages-widget-page, #doc-page-96 div.pages-widget-page {
    padding-top: 0px !important;
}
so you’d want

#doc-page-XX div.breadcrumbs { background-color: red; } 

whatever the page and color are

Thanks for the response! Unfortunately I tried that command already and it appears that the Doc-page reference only refers to content that exists below the page title and first fold.

While you can do the .breadcrumbs command globally, you can’t alter it on a specific page without altering it on another (page 147 and page 68 as an example) can not be different. 

@lrodman do you happen to have some CSS to change the banner colour on the Sign-in page? We used the code for the header once you are in and it works great but need the same for the login page...thanks in advance!

@gstager any ideas about my post above? trying to change the colour of the header on the sign-in page….Thx

@lrnlab - have you tried something along these lines?

I am picturing the header banner on the page where you log in…?

/** Begin color change Login banner **/

#doc-layout-external-header > div {
    background-color: black;
}

/** End color change Login banner **/

@gstager you are the best...that did it!!