/* Major overrides */
body {
	font-size: 10pt !important;
}

h5 {
	font-size: 9pt !important;
}

/* Custom header */
.template-header {
	background-color: #990D76;
	text-align:center;
	height: 96px;
}

.template-header > a > img {
	height: 96px;
}

@media only screen and (max-width: 768px) {
	.template-header {
		height: 64px;
	}
	
	.template-header > a > img {
		height: 64px;
	}
}

/* Custom footer */
.template-footer {
	border-top: 1px solid #cccccc;
	padding-top: 1em;
	padding-bottom: 1em;
	min-height: 10em;
	line-height: 175%;
	background-color: #fbfcf9;
}

.template-footer .right-column {
	float: right;
	margin-right: 1em;
}

.template-footer .n4l-links {
	display: inline-block;
	margin-bottom:  1em;
}

.template-footer .social-links {
	margin-bottom: 1em;
}

.template-footer .copyright {
	margin-bottom: 1em;
}

.template-footer .social-links li {
	display: inline-block
}

.template-footer ul,  .template-footer li{
	list-style: none;
}

.template-footer li::before {
	content: initial !important;
}

@media only screen and (max-width: 768px) {
	.template-footer .right-column {
		float: none;
		display: block;
	}
	
	.template-footer .n4l-links {
		display: block;
	}
}

/*
Custom sign up button - it's used inline now only, but for the reference hosted here. Make sure any update here
makes it into inline style and vice versa.
 */
a.button__sign-up {
	margin: 15px 0;
	padding: 10px 12px;
	color: rgb(100, 101, 104) !important;
	display: inline-block;
	width: 100%;
	text-align: center;
	vertical-align: middle;
	border: 1px solid rgb(100, 101, 104);
	font-size: 16px;
	font-weight: 700;
	border-radius: 2px;
}

/* This takes care of the weird inverse colour link is set to on login form by default */
.salesforceIdentityLoginBody2 a {
	color:#44C8F5 !important;
}

/* This bit handles preformatted code block generated by CKEditor plugin */
.ckeditor_codeblock {
	background: #efefef;
	display: block;
	padding: 8px;
	border: 1px solid #ccc;
	white-space: pre;
	word-wrap: normal;
}

/* Miscellaneous customised stuff */
.cHeaderPanel .cProfileCon .login svg {
	/* This is to fix icon alignment */
	vertical-align: baseline;
}

/* Next two rules are to override box size displaying the link label */
@media only screen and (min-width: 64.0625em) {
	.siteforceNapiliBody .cProfileCon {
		width: 20% !important;
	}
}

@media only screen and (min-width: 48em) {
	.siteforceNapiliBody .cProfileCon {
		width: 25% !important;
	}
}

.home-page-tiles {
	--td-padding: 3px;
	--max-td-width: 240px;
	
	max-width: calc(var(--max-td-width) * 3)
}

.home-page-tiles td {
	padding: var(--td-padding);
	position: relative;
}

.home-page-tiles td .caption {
	/* CSS trick to vertically/horizontally center the text */
	position: absolute;
	left: 50%;
	top: 50%;
	color: white;
	font-weight: bold;
	text-transform: uppercase;
	margin-right: -50%;
	transform: translate(-50%, -50%);
	text-align: center;
}

@media only screen and (max-width: 768px) {
	.home-page-tiles td .caption {
		font-size: 0.75rem;
	}
}

article h2 {
	margin-top: 1.75rem;
}

/* Custom training page stuff */
.hero-training-materials {
	text-align: center;
}

.hero-training-materials ul, .hero-training-materials li {
	list-style: none;
	padding-left: 0 !important;
	margin-right: 8px;
}

.hero-training-materials li::before {
	content: initial !important;
}

.hero-training-materials li {
	display: inline-block;
	width: 33%;
	height: 250px;
	background: no-repeat center -50px;
}

.hero-training-materials li a {
	position: relative;
	width: 100%;
	height: 100%;
	display: block;
}

@media only screen and (max-width: 768px) {
	.hero-training-materials li {
		width: 75%;
		height: 200px;
		margin-bottom: 8px;
		background-position: center -80px;
	}
}

/*iframe classes*/
.contact-us-iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
.contact-us-iframe-parent {
	position: relative;
	padding-bottom:56.25%;
	height: 0;
	overflow: hidden;
}
.contact-us-iframe-block {
	max-width: 500px;
	margin: auto;
}

.siteforceServiceBody .cProfileCon .login .linkLabel {
	color: #980d76 !important; 
	text-shadow:none !important
}

.forceCommunityRichText a {
	color:#980d76 !important
}

.siteforceServiceBody .cProfileCon a.trigger-link {
	color:#980d76 !important; 
	text-shadow: none !important
}

.forceCommunitySearchBox .search-field {
	border: 1px solid #e4e4e5 !important
}

.forceCommunitySearchBox .search-button {
	display: none !important
}

body .siteforceServiceBody .cHeaderOverlay {
	background: #FFFFFF
}

body .siteforceServiceBody .cHeaderLine {
	padding-top: 10px !important; 
	padding-bottom:10px !important
}

body .siteforceServiceBody .cHeaderLine {
	max-width: none; 
	border-bottom: 3px solid #980d76 !important
}

body .siteforceServiceBody .cHeaderPanel {
	height:106px !important
}


.siteforceServiceBody .cAltToggleNav .slds-button__icon {
	color:#646568 !important
}

.siteforceServiceBody .cSearchPublisher .mobile-search-icon {
	color:#646568 !important
}

.slds-button slds-button_neutral mobile-search-icon {
	color:#646568 !important
}

.slds-button__icon slds-button__icon_left {
	color:#646568 !important
}

@media only screen and (max-width: 47.9375em) {
	.forceCommunitySearchBox.focused .body-search {
		left: 0 !important; width: 96%!important; margin: 8px
	}
}

@media only screen and (max-width: 47.9375em) {
	.siteforceServiceBody .cProfileCon {
		width:auto !important; max-width:none !important
	}
}


body .forceCommunityHomeTabs .forceTopicFeaturedTopics .topicContent {
	background-color:transparent;
}

body .forceTopicFeaturedTopics .topicContent {
	background-color:transparent;
}

body .forceTopicFeaturedTopics .topicContent:hover .topicLabel {
	opacity:1;
}

.forceCommunityHomeTabs .forceTopicFeaturedTopics .topicLabel {
	display: block !important;
	opacity:0
}

.selfServiceArticleLayout .uiOutputRichText ul{
	padding-left: 20px
}

.selfServiceArticleLayout .uiOutputRichText ol{
	padding-left: 20px
}

.selfServiceArticleLayout .uiOutputRichText table{
	display:table
}

body .selfServiceArticleListItem .article-head {
	font-size:1rem
}

body .selfServiceUserProfileMenu .login .linkLabel {
	font-size: 0.9rem
}

body .selfServiceArticleLayout .forcePageBlockSectionView .full .test-id__field-label {
	font-size:0.7rem
}

.selfServiceArticleLayout .uiOutputRichText {
	font-size:0.825rem
}

.forceCommunityForceCommunityFeed  .forceChatterFeedItem {
	font-size:0.825rem
}

.selfServiceArticleLayout .uiOutputText {
	font-size:0.825rem
}

.selfServiceArticleLayout .uiOutputRichText .h4 {
	font-size: 0.875rem; 
	font-weight:bold
}

.selfServiceArticleLayout .uiOutputRichText .h3 {
	font-size: 1.075rem; 
	font-weight:normal
}

.selfServiceArticleLayout .uiOutputRichText .h2 {
	font-size: 1.1rem; 
	font-weight:bold
}

.selfServiceArticleLayout .uiOutputRichText .h1 {
	font-size: 1.2rem; 
	font-weight:normal
}

.selfServiceCaseCreate .forceRecordLayout .textarea {
	height:300px
}

.slds-text-align--center {
	text-align:left
}

.forceChatterGroupAnnouncement .announcementIcon {
	display:none
}

body .salesforceIdentityLoginForm2 .uiButton {
	background-color:transparent; 
	border:1px solid lightgrey; 
	color:#646568
}

body .salesforceIdentityLoginForm2 .uiButton .label {
	color:#646568
}

body .siteforceServiceBody .cProfileCon a.trigger-link {
	color:#0070d2; 
	text-shadow: none
}

body .siteforceServiceBody .cSearchPublisher .forceCommunityGlobalSearchInput .forceSearchInputDesktop .contentWrapper {
	border-color: #DDDBDA
}

body .siteforceServiceBody .cSearchPublisher .forceCommunityGlobalSearchInput .forceSearchInputDesktop .contentWrapper .slds-input__icon {
	color: #646568
}

body .siteforceServiceBody .cSearchPublisher .forceCommunityGlobalSearchInput .forceSearchInputDesktop .contentWrapper .slds-input {
	color: #646568 !important
}

body .forceSearchInputDesktop input::placeholder, .siteforceServiceBody .cSearchPublisher .forceCommunityGlobalSearchInput .forceSearchInputDesktop .contentWrapper .slds-input__icon {
	color:#646568}

body .siteforceServiceBody .cSearchPublisher .forceCommunityGlobalSearchInput .forceSearchInputDesktop .input {
	color:#8f9092 !important
}

body .siteforceServiceBody .cSearchPublisher .forceCommunityGlobalSearchInput .forceSearchInputDesktop input, .siteforceServiceBody .cSearchPublisher .forceCommunityGlobalSearchInput .forceSearchInputDesktop input::-webkit-input-placeholder, .siteforceServiceBody .cSearchPublisher .forceCommunityGlobalSearchInput .forceSearchInputDesktop .contentWrapper .slds-input__icon {
	color: #646568 !important
}

.siteforceServiceBody .cSearchPublisher .forceCommunityGlobalSearchInput .forceSearchInputDesktop input, .siteforceServiceBody .cSearchPublisher .forceCommunityGlobalSearchInput .forceSearchInputDesktop input::placeholder, .siteforceServiceBody .cSearchPublisher .forceCommunityGlobalSearchInput .forceSearchInputDesktop .contentWrapper .slds-input__icon {
	color:#646568 !important
} 

.siteforceServiceBody .cSearchPublisher .forceCommunityGlobalSearchInput .forceSearchInputDesktop input, .siteforceServiceBody .cSearchPublisher .forceCommunityGlobalSearchInput .forceSearchInputDesktop input::-webkit-input-placeholder, .siteforceServiceBody .cSearchPublisher .forceCommunityGlobalSearchInput .forceSearchInputDesktop .contentWrapper .slds-input__icon {
	color:#646568 !important
}
