/* ***************************************************************** */
/*                                                                   */
/* HCL Confidential                                                  */
/*                                                                   */
/* OCO Source Materials                                              */
/*                                                                   */
/* Copyright HCL Technologies Limited 2021, 2024                     */
/*                                                                   */
/* The source code for this program is not published or otherwise    */
/* divested of its trade secrets, irrespective of what has been      */
/* deposited with the U.S. Copyright Office.                         */
/*                                                                   */
/* ***************************************************************** */

/* =================================================================================================
* THEME VARIABLES
* Properties that control colors and sizes of elements and fonts
* ================================================================================================*/
:root
{
  --color-base-background: #FFFFFF;
  --color-main-background: #FFFFFF;
  --color-main-hover-background: #E6E6E6;
  --color-main-box-shadow: 0 0 0;
  --color-main-secondary-background: #F2F2F2;
  --color-main-secondary-border: #E6E6E6;

  --color-scrollbar: #F2F2F2;
  --color-scrollbar-thumb: #8F8F8F;
  --color-scrollbar-thumb-hover: #5C5C5C;

  --color-header: #0D264D;
  --color-header-text: #FFFFFF;

  --color-navigation: #14356A;
  --color-navigation-selected: #01539B;
  --color-navigation-text: #FFFFFF;

/*Third level navigation colors according to new design requirements*/
  --color-third-navigation: #F2F4F5;
  --color-third-navigation-selected: #DAE1E6;
  --color-third-navigation-text: #000000;

  --color-third-navigation-base: #F2F4F5;
  --color-third-navigation-selected-option: #DAE1E6;
  --color-third-navigation-border: #93A2AD;

  --color-footer: #0D264D;
  --color-footer-text: #FFFFFF;
  --color-footer-text-hover: #D3D9DE;

  --color-search: #FFFFFF;
  --color-search-text-primary: #000000;
  --color-search-text-secondary: #3D5466;
  --color-search-selected: rgba(0, 0, 0, 0.04);

  --color-itmbar: #F2F2F2;

  --color-link: #01539B;
  --color-link-hover: #092B51;

  --color-button: #01539B;
  --color-button-hover: #092B51;
  --color-button-text: #FFFFFF;

  --color-button-secondary: rgba(0, 0, 0, 0);
  --color-button-secondary-hover: rgba(1, 83, 155, 0.1);

  --color-button-disabled: rgba(18, 25, 31, 0.2);
  --color-button-disabled-background: rgba(1, 83, 155, 0.1);
  /* may want to remove this property at some point */
  --color-button-disabled-text: #ADADAD;

  --color-info-message: #273641;
  --color-info-message-text: #FFFFFF;
  --color-info-message-link: #71D9F3;
  --color-info-message-link-hover: #14A1DE;

  --color-admin-banner-success:#E4FDED;
  --color-admin-banner-success-text:#000000;

  --color-admin-banner-error:#FFF2F2;
  --color-admin-banner-error-text:#000000;

  --color-admin-banner-warning:#FFF6E2;
  --color-admin-banner-warning-text:#000000;

  --color-admin-banner-info:#F9EEFF;
  --color-admin-banner-info-text:#000000;

  --color-modal-header: #FFFFFF;
  --color-modal-header-text: #000000;

  --color-badge: #C10C0D;
  --color-badge-text: #FFFFFF;

  --color-chip: #E6E6E6;
  --color-chip-text: #000000;
  --color-chip-close: #ADADAD;
  --color-chip-close-hover: #8F8F8F;

  --color-tab: #FFFFFF;
  --color-tab-text: #3D5466;
  --color-tab-text-selected: #01539B;
  --color-tab-border-selected: #0D264D;

  --color-text-primary: #000000;
  --color-text-secondary: #3D5466;
  --color-text-warning: #F95454;
  --color-switch-primary:#6e9bc2;

  --color-text-blue: #0066B3;
  --color-profile-connect-status: #506575;

  --color-border-left-success: #A4BB0B;

  --size-header-image-height: 30px;
  --size-header-spacing: 20px;
  --size-itmbar-icon: 48px;

  --font-size-xlarge: 1.5rem;
  --font-size-large: 1rem;
  --font-size-medium: 0.875rem;
  --font-size-small: 0.75rem;
  --font-size-xsmall: 0.625rem;
  --font-size-header: 18px;

  --font-weight-bold: bold;
  --font-weight-normal: 400;
  --font-weight-medium: 500;
  --font-weight-header: bold;

  --font-family:
  "Helvetica Neue", Arial, sans-serif;

  --grid-template-columns: 70px auto 0px;
  --grid-template-rows: auto auto 50px auto;
  --grid-template-columns-itm: 70px auto 75px;

  --tagcloud-chip-border: #93A2AD;
  --tagcloud-chip-border-hover: #DAE1E6;
  --tagcloud-chip-background: #FFFFFF;
  --tagcloud-chip-background-hover: #DAE1E6;
  --tagcloud-chip-text: var(
  --color-chip-text)

  /* CNXSERV-15294 - added style for mui tooltip */
  --font-size-tooltip: 0.625rem;
  --color-tooltip: black;
  --background-color-tooltip: white;
  --border-tooltip: 1px solid black;
  --border-radius-tooltip: 0px;

  /* CNXSERV-15791 - style for Pagination */
  --color-pagination-icon: #5D5D5D;
  --opacity-pagination-icon-disabled: 0.38;

  --color-cancel-background-hover: #01539b1a;

  --color-disabled-text: #0066b133;
  --color-disabled-background: #0066b11a;

  /* left navigation */
  --left-navigation-width: 200px;

  /* Snackbar colors as per enchanted doc - https://pages.git.cwp.pnp-hcl.com/websphere-portal-incubator/enchanted-material-ui-showroom/#/components/snackbars/ */
  --color-snackbar-success: #bed732;

    /* input-controls */
	--input-border-radius: 2px;
	--input-border-color: #93a2ad;
	--input-border-color-focus: #587387;
	--input-background-color: #ffffff;

  /* transitions */
  --transition-time-default: 200ms;
  --hover-transition-fast: .25s;
  --hover-transition-medium: .5s;
  --hover-transition-slower: .75s;

  /* chips layout */
  --chip-background-color: #DAE1E6;
  --chip-background-color-hover: #DAE1E6;
  --chip-border-color: #DAE1E6;
  --chip-border-color-hover: #93A2AD;

  --chip-sec-background-color: transparent;
  --chip-sec-background-color-hover: #DAE1E6;
  --chip-sec-border-color: #93A2AD;
  --chip-sec-border-color-hover: #DAE1E6;

  /* row heights */
  --top-navigation-banner-height: 0px;
  --top-navigation-height: 48px;
  --tertiary-level-nav-height: 0px;
}

body.has-banner {
  --top-navigation-banner-height: 63px;
}

body.cl-3columnsTopMenuLayout,
body.cl-3columnsWithBannerTopMenuLayout
{
  --tertiary-level-nav-height: 134px;
}

/* =================================================================================================
 * CNX8 COMMON STYLE RULES
 *
 * The rules within this file are split into the following sections:
 * - General Rules (overall page)
 * - Generic Components (Links, Modals, Tables, ...)
 * - Main Areas (Navbar, Header, ...)
 * - Specific Apps (Homepage, Blogs, ...)
 * - Miscellaneous
 * ================================================================================================*/


/* =================================================================================================
 * GENERAL RULES
 * ================================================================================================*/

/* Layout for CNX8 UI -----------------------------------------------------------------------------*/
body {
  display: grid;
  grid-template-areas:
    'banner banner banner'
    'header header header'
    'menu tertiary-nav itm'
    'menu main itm';
  grid-template-columns: var(--grid-template-columns);
  position: fixed;
  top: 0px;
  left: 0px;
  right: 0px;
  padding: 0px;
}
/* CNX-30356 CNX-30355 fix ui issues in communities */
body:not(.cnx8-ui.app-blogs, .cnx8-ui.app-communities, .cnx8-ui.app-wikis,
 .cnx8-ui.app-forums, .cnx8-ui.app-dogear, .cnx8-ui.app-files),
 body.cnx8-ui.lotusAbout{
  grid-template-rows: var(--grid-template-rows);
}
body.cnx8-ui.app-activities .activities.searchFrame {
  height: unset !important;
}
body.cnx8-ui.app-activities .lotusFrame.searchFrame #search-result-wrapper #searchDetails {
  margin-top: 0px !important;
}
/* adjust in case itm bar should be rendered */
body.itm-bar-open {
  grid-template-columns: var(--grid-template-columns-itm);
}
/* CNX-30494 fix ui issues in blogs, CNX-30495 fix ui issues in moderation */
body.cnx8-ui.app-metrics,
body.cnx8-ui.app-moderation,
body.cnx8-ui.app-blogs,
body.cnx8-ui.app-profiles,
body.cnx8-ui.app-homepage,
body.cnx8-ui.app-activities {
	grid-template-rows: auto !important;
}
/* CNX-31991 Fix template rows height */
body.cnx8-ui.app-forums.has-banner,
body.cnx8-ui.app-profiles.has-banner,
body.cnx8-ui.app-activities.has-banner {
  grid-template-rows: var(--top-navigation-banner-height) var(--top-navigation-height) 50px auto !important;
}
body #itm-bar {
  width: 0;
}
#lotusFrame, .lotusFrame {
  grid-area: main;
}
#top-navigation {
  grid-area: header;
}
#tertiary_level_nav {
  grid-area: tertiary-nav;
}
#side-navigation {
  grid-area: menu;
}
#itm-bar {
  grid-area: itm;
}
#top-navigation-banner {
  grid-area: banner;
}


/* Positioning and sizes -------------------------------------------------------------------------*/
/* set overflow to allow scrolling */
body.lotusui30_body {
  overflow: hidden;
}
/* set min width for content and height transition */
.lotusui30_layout .lotusMain {
  min-height: calc(100vh - 99px);
  transition: min-height 0.15s ease-out;
}
/* padding for main content */
.lotusMain {
  margin-top: 70px !important;
  margin-left: 70px !important;
  margin-right: 80px !important;
  min-width: auto !important;
  /* min-height: calc(100vh - 99px) !important; */
}
#lotusFrame {
  margin: 0 !important;
  height: calc(100vh - 98px);
  overflow-y: scroll;
}
.app-homepage .lotusFrame, .app-search .lotusFrame, .app-forums .lotusFrame, .app-blogs .lotusFrame,
.app-activities .lotusFrame, .app-profiles .lotusFrame, .app-dogear .lotusFrame, .app-wikis .lotusFrame {
  height: calc(100vh - 98px);
  overflow-y: scroll;
}
.app-homepage.has-banner .lotusFrame, .app-search.has-banner .lotusFrame, .app-forums.has-banner .lotusFrame, .app-wikis.has-banner .lotusFrame,
.app-blogs.has-banner .lotusFrame, .app-activities.has-banner .lotusFrame, .app-profiles.has-banner .lotusFrame, .app-dogear.has-banner .lotusFrame {
  height: calc(100vh - 120px)!important;
  overflow-y: scroll;
}
body.has-banner .navigation-box .navigation-menu-list {
  height: calc(100vh - 113px)!important;
}
.app-moderation .lotusFrame {
  height: calc(100vh - 48px) !important;
  overflow-y: scroll;
}
.app-moderation.has-banner .lotusFrame {
  height: calc(100vh - 50px) !important;
  overflow-y: scroll;
}
.app-moderation.cnx8-ui.has-banner .lotusFooter {
  padding-bottom: 88px !important;
}
.app-search .lotusFrame{
  height: calc(100vh - 49px);
  overflow-y: auto;
  margin: 0;
}
.app-search .lotusMain {
  min-height: calc(100vh - 230px) !important;
}

.xccstyle #xccContent {
  min-height: 400px;
  position: relative;
}

/* Temp adjustment for build info pushed off the page when banner is enabled on about pages */
.has-banner.lotusui30 .lotusLegal .lotusBuild { padding-bottom: 40px !important; }


/* =================================================================================================
 * GENERIC COMPONENTS
 * ================================================================================================*/

/* Scrollbar -------------------------------------------------------------------------------------*/
/* formatting and colors */
::-webkit-scrollbar {
  width: 10px;
}
::-webkit-scrollbar-track {
  background: var(--color-scrollbar);
}
::-webkit-scrollbar-thumb {
  background: var(--color-scrollbar-thumb);
}
::-webkit-scrollbar-thumb:hover {
  background: var(--color-scrollbar-thumb-hover);
}

/* Any Text --------------------------------------------------------------------------------------*/
/* primary color for any text */
body:not(.richtext *, .lotusPersonInactive),
p:not(.richtext *),
span:not(.richtext *, .titleNodeSpanSelected, .lotusMessageBody *, .CodeMirror, .CodeMirror *, .lotusMessage2, .lotusMessage2 *, .restricted-title),
div:not(.richtext *, .widgetBox *, .lotusMessage2, .lotusMessage2 *,  .CodeMirror, .CodeMirror *, .MuiAlert-message, .MuiAlert-icon),
abbr:not(.richtext *),
h1:not(.richtext *),
h2:not(.richtext *),
h3:not(.richtext *),
h4:not(.richtext *) {
  color: var(--color-text-primary) !important;
}
/* medium font size, defined font family and no letter spacing for any text */
body:not(.richtext *),
p:not(.richtext *),
span:not(.richtext *, .CodeMirror, .CodeMirror *, .fa),
div:not(.richtext *, .widgetBox *, .lotusMessage2 *, .CodeMirror, .CodeMirror *),
a:not(.richtext *),
label:not(.richtext *) {
  font-size: var(--font-size-medium) !important;
  font-family: var(--font-family) !important;
  letter-spacing: 0px !important;
}


/* Caption Text ----------------------------------------------------------------------------------*/
/* small text for captions, meta information, etc. */
.lotusActions li a:not(.lotusPersonInactive),
abbr.timeago,
.lotusCommentItem .lotusMeta a,
.lotusui30 .lotusPostDetails .lotusMeta,
.lotusui30 .lotusPostDetails .lotusMeta a,
.lotusui30 .lotusPostDetails a,
.lotusui30 .lotusPostDetails .lotusMeta a,
.ibm-type-c, .ibm-type-d, h4 {
  font-size: var(--font-size-small) !important;
}


/* Header Text -----------------------------------------------------------------------------------*/
.lotusHeader h1 {
  margin-bottom: 0.35em !important;
  font-size: var(--font-size-xlarge) !important;
  font-family: var(--font-family) !important;
  font-weight: var(--font-weight-medium) !important;
  line-height: 1.235 !important;
}


/* Links -----------------------------------------------------------------------------------------*/
/* link color and no decoration */
.lotusui30 #lotusContent a:not(.lotusPersonInactive), .lotusContent a:not(.lotusPersonInactive),
.lotusui30 #lotusContent a:visited,
a.lotusFeed,
button.MuiButtonBase-root span,
.MuiButtonBase-root.Mui-selected span,
.blogsBoard .lotusPost .lotusPerson {
  color: var(--color-link) !important;
  line-height: 1.5;
  font-weight: var(--font-weight-medium) !important;
  text-decoration: none !important;
  margin: unset;
}

.lotusui30 #lotusContent .lotusTable td .commFocusPTUI8 a {
  line-height: 1.8;
  font-weight: var(--font-weight-normal) !important;
  font-size: 14px !important;
}
.lotusui30 .commFocusPTUI8 a{
  padding: 4px;
}
.lotusui30 .commFocusPTUI8 a:hover{
  background-color: var(--color-button-secondary-hover);
}
/* link hover color */
.lotusui30 #lotusContent a:hover,
a.lotusFeed:hover,
button.MuiButtonBase-root span:hover,
.MuiButtonBase-root.Mui-selected span:hover,
.blogsBoard .lotusPost .lotusPerson:hover {
  color: var(--color-link-hover) !important;
}


/* Author Links / Mentions  ----------------------------------------------------------------------*/
/* user name text style, e.g. @mention */
.vcard a,
.lotusActions li .vcard a,
.blogsBoard .lotusPost .lotusPerson,
.lotusui30 .lotusTable td a.vcard,
.lotusui30 .lotusTable td a.vcard:hover {
  color: var(--color-text-primary) !important;
}


/* Selects ---------------------------------------------------------------------------------------*/
/* this is used for e.g. AS selects in Profiles application
  however this may need to be changed going forward as our selects should look differently */
/* to be evaluated */
select {
  padding: 10px 20px 10px 8px !important;
  font-size: var(--font-size-medium) !important;
  border: 1px solid transparent !important;
  cursor: pointer;
  vertical-align: middle;
  background-color: transparent;
  /* appearance property is not supported in Safari */
  -webkit-appearance: none;
  appearance: none;
  background: url(/connections/resources/web/com.ibm.social.hikari.theme/sprite/svg/caret_down.svg) right center no-repeat !important;
  color: var(--color-link);
  outline: none;
}

select option { color: var(--color-text-primary); }
/* set min width for react dropdown popovers */
.MuiPopover-root .MuiMenu-paper .MuiMenu-list {
  min-width: 150px !important;
}


/* Buttons ---------------------------------------------------------------------------------------*/
/* button background, padding, size */
span.lotusBtn a,
button.lotusBtn,
.lotusui30 .lotusMain span.lotusBtn a,
input.lotusFormButton,
button.MuiButtonBase-root.MuiButton-contained {
  background-color:var(--color-button) !important;
  border: 0 !important;
  padding: 8px 24px !important;
  min-width: 80px !important;
  min-height: 36px !important;
  box-shadow:none !important;
  box-sizing: border-box  !important;
  transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,
              border 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms !important;
  border-radius: 2px !important;
  background-image: unset !important;
}
/* button color */
span.lotusBtn a,
button.lotusBtn,
.lotusui30 .lotusMain span.lotusBtn a,
input.lotusFormButton,
button.MuiButtonBase-root.MuiButton-contained,
#search-wrapper button.MuiButtonBase-root:last-child {
  background-color:var(--color-button) !important;
}
/* button hover */
span.lotusBtn a:hover,
button.lotusBtn:hover,
.lotusui30 .lotusMain span.lotusBtn a:hover,
input.lotusFormButton:hover,
button.MuiButtonBase-root.MuiButton-contained:hover,
#search-wrapper button.MuiButtonBase-root:last-child:hover
{
  background-color: var(--color-button-hover) !important;
}
/* button text */
span.lotusBtn a,
span.lotusBtn a:hover,
button.lotusBtn,
button.lotusBtn:hover,
button.lotusBtn span,
button.lotusBtn span:hover,
.lotusui30 #lotusContent .lotusBtn a,
.lotusui30 #lotusContent .lotusBtn a:hover,
.lotusui30 .lotusMain span.lotusBtn a,
.lotusui30 .lotusMain span.lotusBtn a:hover,
input.lotusFormButton,#composeEmailForm input.lotusFormButton,
input.lotusFormButton:hover,
button.MuiButtonBase-root.MuiButton-contained span,
button.MuiButtonBase-root.MuiButton-contained span:hover {
  color: var(--color-button-text) !important;
  font-size: var(--font-size-medium) !important;
  font-family: var(--font-family) !important;
  font-weight: var(--font-weight-normal) !important;
  text-shadow: none !important;
}

/* styles for secondary buttons */
span.lotusBtn.cnxSecondaryBtn a,
span.lotusBtn.cnxSecondaryBtn a:hover,
.lotusui30 #lotusContent .lotusBtn.cnxSecondaryBtn a,
.lotusui30 #lotusContent .lotusBtn.cnxSecondaryBtn a:hover,
.lotusui30 .lotusMain span.lotusBtn.cnxSecondaryBtn a,
.lotusui30 .lotusMain span.lotusBtn.cnxSecondaryBtn a:hover {
  color: var(--color-button) !important;
}

/* styles for disabled buttons */
button.MuiButtonBase-root.MuiButton-contained.Mui-disabled,
button.MuiButtonBase-root.MuiButton-contained.Mui-disabled:hover,
button.MuiButtonBase-root.MuiButton-contained.Mui-disabled span,
.lotusui30 #lotusContent .lotusBtn a.lotusBtnDisabled,
.lotusui30 #lotusContent .lotusBtn a.lotusBtnDisabled:hover {
  color: var(--color-button-disabled-text) !important;
  background-color: var(--color-button-disabled) !important;
}
/* search action etiquette style (same as button) */
.search-history-view-ui .lotusui30 .icSearchPaneButton {
  background-color: var(--color-button) !important;
  z-index: 0;
  display: none;
}


/* Input Boxes -----------------------------------------------------------------------------------*/
/* size */
input[type="checkbox"] {
  height: 18px;
  width:18px;
}
/* colors and fonts */
.lotusFormField input[type="text"],
.lotusFormFieldRow input[type="text"],
.lotusFormFieldRow textarea {
  font-size: var(--font-size-medium) !important;
  font-family: var(--font-family) !important;
  border-radius: 2px;
  border: #93A2AD;
  background: #FFFFFF;
  padding: 10px 14px !important;
  width: calc(100% - 28px) !important;
}
/* input box border color */
.lotusFormField input[type="text"]:hover,
.lotusFormFieldRow input[type="text"]:hover,
.lotusFormFieldRow textarea:hover {
  border-color: var(--color-button) !important;
}
/* input box border color */
.lotusFormField input[type="text"]:focus,
.lotusFormFieldRow input[type="text"]:focus,
.lotusFormFieldRow textarea:focus {
  border-color: rgba(0, 0, 0, 0.23) !important;
}


/* Notifications / Snackbars ---------------------------------------------------------------------*/
.lotusMessage2 {
  color: var(--color-info-message-text) !important;
  display: flex;
  padding: 6px 16px !important;
  flex-grow: 1;
  flex-wrap: wrap;
  font-size: var(--font-size-medium) !important;
  align-items: center;
  font-family: var(--font-family) !important;
  font-weight: var(--font-weight-normal) !important;
  line-height: 1.43 !important;
  border-radius: 2px !important;
  background-color: var(--color-info-message) !important;
}
/* message text color */
.lotusui30 #lotusContent .lotusMessage2 span,
.lotusui30 #lotusContent .lotusMessage2 div ,
.lotusMessageBody {
  color: var(--color-info-message-text) !important;
}
.lotusui30 #lotusContent .lotusMessage2 a {
  color: var(--color-info-message-link) !important;
  font-weight: var(--font-weight-medium) !important;
}
.lotusui30 #lotusContent .lotusMessage2 a:hover {
  color: var(--color-info-message-link-hover) !important;
}

/* message delete icon formatting */
.lotusMessage2 .lotusDelete {
  top: 15px !important;
  transform: scale(1.2);
  filter: brightness(0) invert(1);
}
/* make close icon show full white */
.lotusMessage2 .lotusDelete img, .lotusui30 .lotusMessage2 .lotusDelete img {
  opacity: 1;
}

/*CNXSERV-14255-icon success */
/*CNXSERV-16425:[Blogs]Get icons on snackbar*/
.lotusui30 .lotusMessage2 img.lotusIcon.lotusIconMsgSuccess {
  /* color changed as per enchanted doc - https://pages.git.cwp.pnp-hcl.com/websphere-portal-incubator/enchanted-material-ui-showroom/#/components/snackbars/ */
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='MuiSvgIcon-root jss36' focusable='false' viewBox='0 0 32 32' aria-hidden='true' role='presentation' data-mui-test='checkmark--outlineIcon' fill='%23bed732'%3E%3Cpath d='M16 2a14 14 0 1 0 14 14A14 14 0 0 0 16 2zm0 26a12 12 0 1 1 12-12 12 12 0 0 1-12 12z'%3E%3C/path%3E%3Cpath d='M14 21.5l-5-4.96 1.59-1.57L14 18.35 21.41 11 23 12.58l-9 8.92z'%3E%3C/path%3E%3C/svg%3E") !important;
  background-position: unset !important;
  height: 24px !important;
  width: 24px !important;
}
.lotusui30 .lotusMessage2.lotusSuccess {
  /* color changed as per enchanted doc - https://pages.git.cwp.pnp-hcl.com/websphere-portal-incubator/enchanted-material-ui-showroom/#/components/snackbars/ */
  border-left: 4px solid var(--color-snackbar-success) !important;
}
/*CNXSERV-16425:[Blogs]Get icons on snackbar*/
/*CNXSERV-14255-icon warning */
.lotusui30 .lotusMessage2 img.lotusIcon.lotusIconMsgWarning {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='MuiSvgIcon-root jss36' focusable='false' viewBox='0 0 32 32' aria-hidden='true' role='presentation' data-mui-test='warningIcon' fill='%23FFB400'%3E%3Cpath d='M16 2a14 14 0 1 0 14 14A14 14 0 0 0 16 2zm0 26a12 12 0 1 1 12-12 12 12 0 0 1-12 12z'%3E%3C/path%3E%3Cpath d='M15 8h2v11h-2zm1 14a1.5 1.5 0 1 0 1.5 1.5A1.5 1.5 0 0 0 16 22z'%3E%3C/path%3E%3C/svg%3E") !important;
  background-position: unset !important;
  height: 24px !important;
  width: 24px !important;
}
.lotusui30 .lotusMessage2.lotusWarning {
  border-left: 4px solid #FFB400 !important;
}

/*CNXSERV-14255-icon Info icon */
.lotusui30 .lotusMessage2 img.lotusIcon.lotusIconMsgInfo {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='MuiSvgIcon-root jss36' focusable='false' viewBox='0 0 32 32' aria-hidden='true' role='presentation' data-mui-test='informationIcon' fill='%232abdea'%3E%3Cpath d='M17 22v-9h-4v2h2v7h-3v2h8v-2h-3zM16 7a1.5 1.5 0 1 0 1.5 1.5A1.5 1.5 0 0 0 16 7z'%3E%3C/path%3E%3Cpath d='M16 30a14 14 0 1 1 14-14 14 14 0 0 1-14 14zm0-26a12 12 0 1 0 12 12A12 12 0 0 0 16 4z'%3E%3C/path%3E%3C/svg%3E") !important;
  height: 24px !important;
  width: 24px !important;
  background-position: unset !important;
}
.lotusui30 .lotusMessage2.lotusInfo {
  border-left: 4px solid #2abdea !important;
}

/* Toast Notifications -------------------------*/
/* font formatting */
.MuiSnackbar-root .MuiAlert-root *:not(path, svg, .MuiAlert-icon) {
  color: #FFFFFF !important;
  font-size: var(--font-size-small) !important;
}
/* dimensions */
.cnx8-ui.ic-is-notifications-expanded #ic-action-center-root .ic-notifications
{
  left: 70px !important;
  right:auto !important;
  top:70px !important;
}
/* transition */
.cnx8-ui #ic-action-center-root .ic-notifications
{
  position: fixed !important;
  transition: left .5s ease !important;
  left: -400px !important;
  right: auto !important;
}

.dijitTooltipDialogPopup[aria-label="notifications_action_wrapper_popup"]{overflow:none !important;}
#notifications_action_wrapper_popup,#notifications_popup{padding:0 !important;}
#notifications_popup{box-shadow: none !important;}

#lotusBannerNotifications_dropdown {
  z-index: 1400 !important;
}

/* Tooltips --------------------------------------------------------------------------------------*/
.dijitTooltipDialogPopup .dijitTooltipContainer {
  background-color: rgba(61, 84, 102, 0.9) !important;
  border: 0 !important;
}
.dijitTooltipDialogPopup .dijitTooltipFocusNode {
  background-color: rgba(61, 84, 102, 0.9) !important;
}
.dijitTooltipDialogPopup .lotusHelp {
  background-color: rgba(61, 84, 102, 0.9) !important;
}
.dijitTooltipDialogPopup .lotusInfoBox {
  background-color: rgba(61, 84, 102, 0.9) !important;
}
.dijitTooltipDialogPopup .lotusInfoBox p {
  color: var(--color-button-text) !important;
  padding: 4px 8px  !important;
  font-size: var(--font-size-small) !important;
  /* CNXSERV-17357 - adjusted for SK lang */
  max-width: 400px  !important;
  word-wrap: break-word  !important;
  font-family: var(--font-family) !important;
  font-weight: var(--font-weight-medium) !important;
  line-height: 1.4em  !important;
  border-radius: 2px  !important;
  background-color: rgba(61, 84, 102, 0.9)  !important;
}
.dijitTooltipDialogPopup .lotusRight,
.dijitTooltipDialogPopup h3 {
  display: none !important;
}
/* Adjustments for any Enchanted Design Tooltips being overridden */
/* CNXSERV-15294 - referred to mui tooltip variables */
.MuiTooltip-tooltip {
  font-size: var(--font-size-tooltip) !important;
  color: var(--color-tooltip) !important;
  background-color: var(--background-color-tooltip) !important;
  border : var(--border-tooltip) !important;
  border-radius : var(--border-radius-tooltip) !important;
}


/* Tabs ------------------------------------------------------------------------------------------*/
/* render in one line, remove border */
.lotusTabContainer,
#tabNavMenu {
  display: inline-block !important;
  border-bottom: none !important;
  background-color: var(--color-tab) !important;
}
/* remove padding */
.lotusTabContainer ul.lotusTabs li,
#tabNavMenu ul.lotusTabs li {
  margin: 0 !important;
  padding: 0 !important;
}
/* styles for links within a tab view, e.g. /forums/html/my */
.lotusTabContainer ul.lotusTabs li a,
.lotusui30 .tabNavBar .lotusTabs li a,
ul.lotusTabs li a {
  padding: 0px 20px !important;
  height: 25px;
  font-size: var(--font-size-large) !important;
  font-weight: var(--font-weight-normal) !important;
  color: var(--color-tab-text) !important;
}
/* adjust community tabs height */
.lotusui30 .tabNavBar .lotusTabs li a {
  height: 30px;
  outline: none;
  line-height: 1.3;
}
.lotusui30 .tabNavBar div#lotusTitleBar {
  height: 92px;
}
/* color change on hover */
ul.lotusTabs li:hover a,
ul.lotusTabs li:focus a,
.lotusui30 .tabNavBar .lotusTabs li:hover a,
.lotusui30 .tabNavBar .lotusTabs li:focus a,
ul.lotusTabs li.lotusSelected a,
.lotusui30 .tabNavBar .lotusTabs li.lotusSelected a {
  color: var(--color-tab-text-selected) !important;
}
ul.lotusTabs li.lotusSelected,
.lotusui30 .tabNavBar .lotusTabs li.lotusSelected {
  border-bottom: 2px solid var(--color-tab-border-selected) !important;
}


/* Chips -----------------------------------------------------------------------------------------*/
/* render tags in in chip design */
.lotusFilter,
.lotusui30 .lotusFilters2 .lotusInlinelist li a.lotusFilter {
  padding: 5px 12px;
  border-radius: 25px;
  margin-bottom: 10px;
}
a.lotusFilter .lotusDelete,
.lotusui30 .lotusFilters2 img.lotusDelete {
  margin: 0px 0px 0px 10px;
}

/* set colors to filter chips */
.MuiChip-deletable{
  background-color: var(--color-chip) !important;
}

.MuiChip-label{
  color: var(--color-chip-text) !important;
}

.MuiChip-deleteIcon{
  color: var(--color-chip-close) !important;
}

.MuiChip-deleteIcon:hover{
  color: var(--color-chip-close-hover) !important;
}


/* Badges ----------------------------------------------------------------------------------------*/
/* set colors and fonts */
.MuiBadge-badge,
.MuiButtonBase-root .MuiBadge-badge,
#side-navigation .MuiButtonBase-root .MuiBadge-badge,
#notifications_action .icBanner-badge {
  background-color: var(--color-badge) !important;
  color: var(--color-badge-text) !important;
  font-size: var(--font-size-small) !important;
  font-weight: var(--font-weight-medium) !important;
}

#notifications_action .icBanner-badge {
  border-radius: 50% !important;
  height: 18px !important;
  width: 18px !important;
  padding: 0px !important;
  left: 15px !important;
  top: -26px !important;
}


/* Tables ----------------------------------------------------------------------------------------*/
/* font sizes */
.lotusPaging * {
  font-size: var(--font-size-small) !important;
}
.lotusPaging li a {
  font-weight: var(--font-weight-normal) !important;
}
.lotusui30 .lotusTable .lotusSort *, .lotusui30 #lotusContent .lotusTable .lotusSort * {
  font-weight: var(--font-weight-small) !important;
}
/*CNXSERV-16892 - richtext editor adjustements*/
.lotusui30 :has(#lotusContent) .lotusTable td *:not(.richtext *, a, label, .lotusBtnSmall, .lotusRight, .lotusSection #adminError, #adminErrorText, .lotusRight .MuiSnackbar-root *) {
  font-size: var(--font-size-small) !important;
  color: var(--color-text-secondary) !important;
}
.lotusui30 .lotusTable td a, .lotusui30 #lotusContent .lotusTable td a, .lotusui30 .lotusFlyout .lotusFlyoutHeader a {
  color: var(--color-link) !important;
}
.lotusui30 .lotusTable td a:hover, .lotusui30 #lotusContent .lotusTable td a:hover, .lotusui30 .lotusFlyout .lotusFlyoutHeader a:hover {
  color: var(--color-link-hover) !important;
}
.lotusui30 .lotusTable td h4 a,
.lotusui30 #lotusContent .lotusTable td h4 a,
.lotusui30 .lotusTable td h4 a:hover,
.lotusui30 #lotusContent .lotusTable td h4 a:hover {
  font-size: var(--font-size-medium) !important;
}
#websiteForm table td {
  padding: 20px 5px 20px 0 !important;
}
#websiteForm table td label {
  display: inline-flex !important;
  position: relative;
  font-size: var(--font-size-medium) !important;
  color: var(--color-text-secondary) !important;
  transform: none;
  align-items: center;
  font-family: var(--font-family) !important;
  font-weight: var(--font-weight-medium) !important;
  margin-bottom: 4px !important;
  pointer-events: inherit;
}

/* =================================================================================================
 * MAIN AREAS
 * ================================================================================================*/

/* Header Area -----------------------------------------------------------------------------------*/
/* set position, color */
#top-navigation {
  display: flex;
  justify-content: space-between;
  height: var(--top-navigation-height);
  background-color: #0d264d;
  z-index: 100;
  background-color: var(--color-header) !important;
  width: 100vw;
}
/* set up left, center and right area in top nav */
#top-navigation .top-navigation-area {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 33%
}
/* properly align elements */
#top-navigation .top-navigation-area.left-area {
  justify-content: flex-start;
}
#top-navigation .top-navigation-area.center-area {
  justify-content: center;
}
#top-navigation .top-navigation-area.right-area {
  justify-content: flex-end;
}
/* add some spacing between elements */
#top-navigation .top-navigation-area > * {
  padding: 0px var(--size-header-spacing);
  order: 5;
}
#top-navigation .top-navigation-area h1 {
  margin: 0;
  -webkit-font-smoothing: unset;
  -moz-osx-font-smoothing: unset;
}
/* Header image logo */
img.header-logo {
  height: var(--size-header-image-height) !important;
  display: block !important;
}
/* Theme switcher styles */
#theme-switcher-wrapper {
  z-index: 899;
  color: #FFFFFF !important;
}
#actions-wrapper {
  display: flex;
}
#actions-wrapper *:not(.MuiSnackbar-root *) {
  margin: 0px 5px;
}
/* Formatting for text field in top navigation */
#top-navigation-text {
  color: var(--color-header-text) !important;
  font-size: var(--font-size-header) !important;
  font-weight: var(--font-weight-header) !important;
}


/* Top Navigation --------------------------------------------------------------------------------*/
/* box shadow */
#tertiary_level_nav {
  box-shadow: 0 1px 6px 0 rgb(var(--color-main-box-shadow) / 40%) !important;
  background-color: var(--color-tab) !important;
  height: 50px;
  z-index: 90;
  background-color: '#ffffff';
  box-shadow: '0px 0px 8px 0px black';
  display: flex;
  justify-content: center;
  align-items: center;
}
/* padding */
#tertiary_level_nav ul {
  margin: 0;
  padding: 0;
}
/* fix issues with tab alignment in rtl */
#tertiary_level_nav ul.lotusTabs {
  width: auto !important;
 }
/* list element formatting */
#tertiary_level_nav li {
  display: inline-block;
  line-height: 40px;
}
/* link color */
#tertiary_level_nav a {
  color: var(--color-tab-text) !important;
}
/* text styles */
#tertiary_level_nav a,
#tertiary_level_nav a:visited,
#tertiary_level_nav a.lotusFeed {
  padding: 17px 20px;
  font-size: var(--font-size-large) !important;
  font-weight: var(--font-weight-normal) !important;
}
#tertiary_level_nav a span {
  font-size: var(--font-size-large) !important;
  color: var(--color-tab-text) !important;
}
/* selection and hover styles */
#tertiary_level_nav li.lotusSelected a {
  color: var(--color-tab-text-selected) !important;
  box-shadow: inset 0px -2px 0px 0px var(--color-tab-border-selected) !important;
}
#tertiary_level_nav li a:hover, #tertiary_level_nav li a:hover span {
  color: var(--color-tab-text-selected) !important;
}
#tertiary_level_nav li.lotusSelected a span {
  color: var(--color-tab-text-selected) !important;
}
/* CNXSERV-14105 hide tertiary level nav when search is displayed */
.searchFrame #tabNavBar,
.searchFrame #lotusTitleBar,
.searchFrame #lotusToolBar {
  display: none !important;
}
/* CNXSERV-16474 fix issue with top nav not being centered if itm-bar it not being displayed */
body #tertiary_level_nav {
  padding-right: 75px;
}
body.itm-bar-open #tertiary_level_nav {
  padding-right: 0px;
}


/* Side Navigation -------------------------------------------------------------------------------*/
/* background color */
#side-navigation,
.icCatalogCommunityCreate.bx--dropdown:hover {
  background-color: var(--color-navigation) !important;
}

.icCatalogCommunityCreate.bx--dropdown {
  background-color: var(--color-button) !important;
}
/* position and color */
#side-navigation {
  height: calc(100vh - 49px);
  width: 70px;
  display: flex;
  flex-direction: column !important;
  z-index: 100;
}
.navigation-main {
  height: calc(100vh - 50px) !important;
  display: flex;
  flex-direction: column;
}
/* text styles */
#side-navigation li span,
#transitional_side_navigation li span,
.MuiBox-root .MuiList-root .MuiListItem-button span:not(#search-wrapper *) {
  font-size: var(--font-size-xsmall) !important;
  color: var(--color-navigation-text) !important;
  font-weight: var(--font-weight-normal) !important;
}
/* selection highlighting */
#side-navigation .MuiListItem-button.Mui-selected {
  border-left-color: var(--color-navigation-text) !important;
  background-color: var(--color-navigation-selected) !important;
}
/* sizing adjustments of navbar buttons to accommodate the text */
#side-navigation .MuiListItem-button {
  height: 55px !important;
  min-height: 40px !important;
  padding: 9.6px 2px !important;
}
/* apply custom side navigation color to the nav box elements as well */
#side-navigation .navigation-box {
  background-color: var(--color-navigation) !important;
}
/* CNXSERV-13413, CNXSERV-14105 Fix Dancing icons centered to left justified when react cmpt filter used */
#side-navigation ul li {
  text-align: center !important;
  justify-content: center !important;
  width: auto;
}
/* center content for actions */
:is(#side-navigation, .subnavigation) ul li :is(a img, span) {
  margin: 0 auto;
}
/* apply custom side navigation color to the submenu nav box elements as well */
.navigation-submenu-box {
  background-color: var(--color-navigation) !important;
}
/* CNXSERV-17882 - don't need for RTL lang */
html:not([lang^='ar'], [lang^='iw'], [lang^='he']) .subnavigation {
  left: 69px !important;
}

/* fix line height to ensure icons and text remain in consistent positioning */
#side-navigation .MuiButtonBase-root.navigation-menu-item span,
#side-navigation .MuiButtonBase-root.Mui-selected.navigation-menu-item span {
  line-height: 20px;
}

/* ensure white left border is always visible for selected menu option */
#side-navigation .MuiButtonBase-root.navigation-menu-item {
  border-left: 0px !important;
}
#side-navigation .MuiButtonBase-root.Mui-selected.navigation-menu-item {
  box-shadow: inset 3px 0px 0px 0px var(--color-navigation-text);
}

/* set text element to display block to fix issue with clientWidth calculation */
#side-navigation .navigation-menu-list > li > a > span,
.subnavigation .navigation-submenu-list > li > a > span {
  display: block;
}


/* Third Level Navigation -------------------------------------------------------------------------*/
#lotusFrame #lotusColLeft {
  background-color: var(--color-third-navigation) !important;
}

#lotusFrame #lotusColLeft div.lotusSelected {
  background-color: var(--color-third-navigation-selected) !important;
}

#lotusFrame #lotusColLeft div *:not(a) {
  color: var(--color-third-navigation-text) !important;
}


/* ITM Bar ----------------------------------------------------------------------------------------*/
/* formatting and color */
#itm-bar {
  height: 100%;
  width: 75px;
  padding-top: 0px;
  z-index: 100 !important;
  background-color: var(--color-itmbar) !important;
}
#itm-bar .setSideBar, #itm-bar .setSideBarInner, #itm-bar .carousel, #itm-bar .set-actions {
  background-color: var(--color-itmbar) !important;
}
.set-base {
  height: var(--size-itmbar-icon) !important;
  width: var(--size-itmbar-icon) !important;
}
/* CNXSERV-13999 make sure there is no conflict between normal biz card and itm bar profiles */
.lotusui30dojo .ic-itm-bar .set-base.ic-bizCard {
  margin: 0px !important;
  padding: 0px !important;
  position: absolute;
  border: 0px !important;
  background-color: #f4f4f4 !important;
}


/* Footer -----------------------------------------------------------------------------------------*/
/* footer background color and size */
.lotusui30 .lotusFooter {
  background-color: var(--color-footer) !important;
  bottom: 0px;
  padding-bottom: 48px;
  padding-top: 5px;
  max-width: unset;
  margin-top: 50px;
}
/* footer text formatting */
.lotusui30 .lotusFooter ul a {
  color: var(--color-footer-text) !important;
  font-weight: var(--font-weight-normal) !important;
}
/* footer link hover/focus */
.lotusui30 .lotusFooter ul a:hover,
.lotusui30 .lotusFooter ul a:active,
.lotusui30 .lotusFooter ul a:focus {
  color: var(--color-footer-text-hover) !important;
}
body.lotusProfiles .lotusFooter {
margin-top: 0px !important;
}
/* may not be needed later */
#profilePaneLeft{
min-height: calc(100vh - 99px) !important;
}


/* Search -----------------------------------------------------------------------------------------*/
/* Search Bar ----------------------------------*/
#search-wrapper {
  min-width: 300px;
  width: 80%;
  max-width: 600px;
}
#search-wrapper * {
  box-sizing: border-box;
  word-break: break-word;
}
#search-wrapper > div, #cnx-search-box-wrapper > div {
  max-width: 600px;
}
#search-wrapper div.MuiBox-root * {
  font-size: var(--font-size-medium) !important;
}
#search-wrapper div.MuiBox-root input::placeholder {
  color: var(--color-search-text-secondary) !important;
}

#search-wrapper div.MuiBox-root, #search-wrapper div.MuiPaper-root, #search-wrapper div.MuiInputBase-root, #search-wrapper button.MuiButtonBase-root:first-child {
  background: var(--color-search) !important;
}

#search-wrapper .MuiListItem-button:hover {
  background: var(--color-search-selected) !important;
}

/* Search Results ------------------------------*/
body #lotusFrame.searchFrame #search-result-wrapper{
  display: grid;
  grid-template-areas:
    'searchResultBar'
    'searchResultDetails';
  top: 0px;
  left: 0px;
  right: 0px;
  padding: 0px;
}
body #lotusFrame.searchFrame #search-result-wrapper #tertiary_level_nav {
  grid-area: searchResultBar;
  position: fixed;
  width: calc(100% - 10em);
}
body .lotusFrame.searchFrame #search-result-wrapper #searchDetails {
  grid-area: searchResultDetails;
  margin: 60px 30px 0 30px !important;
}
body.cnx8-ui.app-communities .lotusFrame.searchFrame#mainContentDiv #search-result-wrapper #searchDetails {
  margin-top: 0px !important;
}
body.cnx8-ui.has-banner #lotusFrame.searchFrame,
body.cnx8-ui #lotusFrame.searchFrame {
  height: calc(100vh - 40px) !important;
  overflow-y: scroll;
  min-width: unset;
  margin: 0 !important;
  display: block !important;
}
body #search-result-wrapper.lotusMain {
  padding: 0 !important;
  margin: 0 !important;
  min-width: auto !important;
  max-width: unset !important;
  overflow-x: hidden;
}
body.app-wikis.app-communities #search-result-wrapper #tertiary_level_nav *{
  display: flex !important;
}
/* search/web/search page */
.app-search.lotusui30 .lotusTitleBar2 h2.lotusHeading .lotusText{
  font-size: var(--font-size-large) !important;
  font-weight: var(--font-weight-bold) !important;
}

.app-search.lotusui30 .lotusTitleBar2 {
  background: none !important;
  width: unset !important;
  border-bottom: 1px dotted #ccc;
  margin-bottom: 1rem;
}

.app-search.lotusui30 .lotusTitleBar2 .lotusWrapper,
.app-search .lotusMain .lotusColLeft {
  padding-left: 20px !important;
}

.app-search.lotusui30 .lotusMenu li.lotusSelected,
.app-search .lotusMain {
  margin: 0px !important;
  padding: 0px !important;
}

.app-search.lotusui30 .lotusMessage2 {
  padding: 0 !important;
}

.app-search.lotusui30 .lotusHeader h1 {
  font-size: var(--font-size-large) !important;
  font-weight: var(--font-weight-bold) !important;
}


/* Banner -----------------------------------------------------------------------------------------*/
/* position severity icon */
#top-navigation-banner {
  z-index: 100;
}
.adminBanner .MuiSvgIcon-root {
  margin-right: 10px;
}

.adminBanner div.MuiGrid-container, .adminBanner div.MuiGrid-container > .MuiGrid-item, .adminBanner p.MuiTypography-root {
  padding: 0px !important;
  margin: 0px !important;
  height: 42px !important;
  overflow: hidden !important;
  max-width: 100% !important;
}

/* custom styles */
.adminBanner .adminBannersuccess > div{
background-color: var(--color-admin-banner-success) !important;
}
.adminBanner .adminBannersuccess  p{
  color: var(--color-admin-banner-success-text) !important;
}

.adminBanner .adminBannererror > div{
background-color: var(--color-admin-banner-error) !important;
}
.adminBanner .adminBannererror  p{
  color: var(--color-admin-banner-error-text) !important;
}

.adminBanner .adminBannerwarning > div{
background-color: var(--color-admin-banner-warning) !important;
}
.adminBanner .adminBannerwarning  p{
  color: var(--color-admin-banner-warning-text) !important;
  }

.adminBanner .adminBannerinfo > div{
background-color: var(--color-admin-banner-info) !important;
}
.adminBanner .adminBannerinfo p{
  color: var(--color-admin-banner-info-text) !important;
}


/* File Viewer ------------------------------------------------------------------------------------*/
.ics-viewer .ics-viewer-banner {
  height: 60px;
  padding-top: 10px;
}
.ics-viewer .ics-viewer-banner *,
.ics-viewer .ics-viewer-icon-preview span {
  color: #FFFFFF !important;
}
.ics-viewer .ics-viewer-banner a {
  color: var(--color-link) !important;
}
.ics-viewer .ics-viewer-tabs a {
  color: #FFFFFF !important;
}
.fileviewer-panels-textnav .ics-viewer .ics-viewer-details {
  top: 70px !important;
}

.ics-viewer .ics-panel-entry-container .ics-sharing-panel .streamContainer .panelContent .icon svg {
  width: 30px;
  height: 30px;
}

/* Embedded Experience -------------------------------------------------------------------------------*/
.lotusui30 .lotusFlyout .lotusFlyoutHeader .flyoutTitleInner a {
  bottom: 2px !important;
}


/* Language Switcher ------------------------------------------------------------------------------*/
#language-switcher-wrapper #headerLanguageSelectorMenu {
  color: white !important;
}

#language-switcher-wrapper .lotusDropDownSprite {
    background-position: -8px -2713px !important;
    background-size: 26px !important;
    width: 12px !important;
    height: 12px !important;
    opacity: 1.0 !important;
}

/* Rich Text Editor / RTE ---------------------------------------------------------------------------*/
/* CNXSERV-16941 - adjust css for RTE tooltips */
.cnx8-ui .cke_toolbar {
  padding: 10px 0px 5px 0px;
}
/* CNX-31947 - remove extra padding in tinymce */
.cnx8-ui .cke_toolbar:has(div.tox.tox-tinymce) {
  padding: unset;
}
.cnx8-ui .cke_toolbar .cke_toolgroup {
  float: none;
}
.cnx8-ui .cke_toolbox {
  opacity: 1 !important;
}
/* CNXSERV-16753 - fix jumping around of tooltip elements on hover */
/* - set min height for elements and element rows */
.cnx8-ui .cke_tooltip, .cnx8-ui a.cke_button {
  min-height: 19px;
}
/* - RCW requires more height */
.cnx8-ui #showRichContent .cke_tooltip,
.cnx8-ui #showRichContent a.cke_button {
  min-height: 23px;
}
/* - Profiles requires even more height */
.cnx8-ui.app-profiles .cke_tooltip,
.cnx8-ui.app-profiles a.cke_button {
  min-height: 23px;
}

.cnx8-ui.app-profiles .cke_toolbar .cke_toolgroup {
  float: left;
}
/* - set normal padding to two pixels, remove top/bottom margin */
.cnx8-ui a.cke_button,
.cnx8-ui a.cke_button_off {
  padding: 2px !important;
  margin: 0px 2px !important;
}
/* - reduce hover/on padding to 1px to counteract 1px border */
.cnx8-ui a.cke_button:hover,
.cnx8-ui a.cke_button_off:hover,
.cnx8-ui a.cke_button__bold,
.cnx8-ui a.cke_button_on {
  padding: 1px !important;
}
/* CNXSERV-16285 - css for cke editor */
:is(.app-wikis, .app-blogs, .app-forums.cnx8-ui) .cke_floating_toolbox {
  top: 98px;
}
:is(.has-banner.app-wikis, .has-banner.app-blogs, .has-banner.app-forums.cnx8-ui) .cke_floating_toolbox {
  top: 160px;
}
/* add different offsets for cke to match community scroll behavior */
.app-communities.cnx8-ui .cke_floating_toolbox {
  top: 47px;
}
.app-communities.cnx8-ui.has-banner .cke_floating_toolbox {
  top: 110px;
}
/* CKEditor Tooltip */
.cnx8-ui.lotusui div.cke_tooltip.cke_reset.cke_reset_all, .cnx8-ui.lotusui30 .cke_tooltip.cke_reset.cke_reset_all {
  /* TODO replace with color code */
  color: #ffffff !important;
}
/* CNX-32871 fix edit area not scrollable when content is too long */
.cnx8-ui .tox-edit-area {
  overflow-y: auto;
}
/* =================================================================================================
 * APP SEPCIFIC ADJUSTMENTS
 * - TODO - Break out into seperate resources
 * ================================================================================================*/

 /* Forums -----------------------------------------------------------------------------------------*/
#myForumTableDescription {
  font-size: var(--font-size-medium) !important;
  font-family: var(--font-family) !important;
  font-weight: var(--font-weight-medium) !important;
  line-height: 1.5 !important;
}
body.app-forums #lotusFrame {
  margin-top: 99px;
  margin-right: 76px;
  overflow-y: auto;
}
body.app-forums #lotusContent {
  margin-left:0 !important;
}

.cnx8-ui.app-communities .tox-insert-table-picker div
{
  box-sizing: border-box !important;
}

/* Homepage ---------------------------------------------------------------------------------------*/
/* mostly font adjustments */
/* many other changes contained in /homepage/v8/main.css */
/* adjust frame size */
body.app-homepage #lotusFrame {
  margin-top: 99px;
  margin-right: 76px;
  overflow-y: scroll;
}
/* share something headline */
.shareSome-desc {
  font-size: var(--font-size-large) !important;
}
/* widgets heading */
.lotusui30 .lotusColRight .lotusSection2 .lotusHeading, .lotusui30 .lotusColRight .lotusSection2 .lotusHeading2 {
  font-size: var(--font-size-medium) !important;
}
/* top updates links */
.ic-tile .ic-title {
  font-size: var(--font-size-large) !important;
}
/* AS entry actions */
.lotusui30 .lotusStream #activityStreamMain.lotusWidgetBody .lotusInlinelist.lotusActions a,
.lotusui30 .lotusStream #activityStreamMain.lotusWidgetBody .lotusPost .lotusInlinelist a {
  font-weight: var(--font-weight-medium) !important;
}
/* adjustments for People who like this... popup on AS entries */
.lotusui30 .lotusLikeLightBox .lotusLikeHeader,
.lotusui30 .lotusDialog .lotusDialogHeader,
.lotusui30 .lotusFlyout .lotusFlyoutHeader,
.app_palette_modal_header {
  background-color: var(--color-modal-header) !important;
  border-bottom: 1px solid rgba(0, 0, 0, 0.12);
}
/* change color of close icon to black via sprite position */
.lotusui30 .lotusDialog .lotusClose img, .lotusui30 .lotusDialog .lotusDialogHeader .lotusDialogClose img,
.lotusui30 .dijitPopup .lotusPopup .lotusPopupClose img,
.lotusui30 .lotusFlyoutHeader .lotusClose input {
  background-position: -555px -5px !important;
}
.lotusRight.lotusPaletteClose .otherFramework16 {
  background-position: 0 -606px !important;
}
/* adjust My page customize header */
.lotusui30 .lotusLikeLightBox .lotusLikeHeader span,
.lotusui30 .lotusDialog .lotusDialogHeader *,
.lotusui30 .lotusFlyout .lotusFlyoutHeader .flyoutTitleInner * {
  color: var(--color-modal-header-text) !important;
  font-weight: var(--font-weight-medium) !important;
  font-size: var(--font-size-large) !important;
}
.app_palette_modal_header_title {
  font-size: var(--font-size-large) !important;
}
.app_palette_modal_tabs_ul strong {
  color: var(--color-modal-header-text) !important;
}
/* recommendation widget caption */
.lotusui30 .homepage-widget .lotusMeta .lotusAction {
  font-size: var(--font-size-small) !important;
  font-weight: var(--font-weight-medium) !important;
}
.lotusui30 .lotusContent .lotusWidget,
.lotusui30 .lotusPortlet {
  background-color: var(--color-main-background);
}


/* Activity Stream -----------------------------*/
/* hide unwanted elements */
.lotusBanner{
  display: none;
}
.app-homepage #lotusColLeft,
.app-homepage .lotusColLeft,
.app-forums #lotusColLeft,
.app-forums .lotusColLeft {
  display: none !important;
}
/* set background colors */
body.lotusui30_body,
#lotusFrame,
.lotusMain,
.lotusContent,
.lotusui30 .lotusBoard .lotusStream {
  background-color: var(--color-base-background) !important;
}
/* set background color for main content areas */
.lotusui30 .lotusPost,
.lotusui30 .lotusStream .lotusPostContent .file,
.lotusui30 .lotusStream .lotusPostContent .fileBody,
.lotusui30 .lotusStream ul > li.pagingHandler,
.lotusui30 .streamMore {
  background-color: var(--color-main-background) !important;
}
/* set background color for hover on main content areas */
.lotusui30 .lotusBoard .lotusStream .lotusPostSelected,
.lotusui30 .streamMore:hover,
.lotusui30 .streamMore a:hover,
.lotusui30 .streamMore:focus,
.lotusui30 .streamMore a:focus,
.lotusui30 .streamMore:active,
.lotusui30 .streamMore a:active {
  background-color: var(--color-main-hover-background) !important;
}
/* set background color for secondary main content areas */
.lotusui30 .streamMore,
.lotusui30 .lotusStream .lotusPostContent .file,
.lotusui30 .lotusStream .lotusPostContent .fileBody {
  background-color: var(--color-main-secondary-background) !important;
}
/* set border color */
#asPermLinkAnchor > li,
.lotusui30 .lotusStream .lotusPostContent .file {
  border: 1px solid var(--color-main-secondary-border) !important;
}
/* set border box shadow */
.ic-tile,
#asPermLinkAnchor > li,
.lotusui30 .lotusContent .lotusWidget,
.lotusui30 .lotusPortlet {
  box-shadow: 0 4px 10px 0 rgb(var(--color-main-box-shadow) / 10%) !important;
}
/*CNXSERV-17372,CNXSERV-16767,CNXSERV-16843 - fix alignment in social links*/
.lotusStream .lotusWidgetBody#activityStreamMain .activityStreamNewsItemContainer .lotusLike .lotusLikeCount .lotusIconLike{
  margin-top: -1px !important;
}
.lotusui30 .lotusStream #activityStreamMain.lotusWidgetBody .lotusInlinelist.lotusActions .lotusLikeCount .lotusLikeText{
  margin-top: 0px !important;
}
.lotusui30 .lotusStream #activityStreamMain.lotusWidgetBody .lotusInlinelist.lotusActions li.lotusFirst.savethisAction {
  margin-top: 0px !important;
}
/*  CNXSERV-16767,CNXSERV-16843 ------ END ------*/
.lotusui30 .lotusStream #activityStreamMain.lotusWidgetBody .lotusInlinelist.lotusActions .lotusLikeCount .lotusLikeConnector {
  display: block;
  background: url(/connections/resources/web/com.ibm.social.hikari.theme/sprite/otherActivityStream14-8bit.png?etag=20220127.053151) 0 -125px no-repeat;
  width: 3px;
  height: 3px;
  position: absolute;
  margin-top: 7px;
  top: 0;
  bottom: 3px;
}


/* Communities ------------------------------------------------------------------------------------*/
.app-communities #lotusFrame {
  height:calc(100vh - 48px);
}
#tabNavCommunityName .comNavInline {
  font-size: var(--font-size-xlarge) !important;
}
/* CNXSERV-16474 - ensure Communities top nav bar is centered */
.app-communities .catalog-top-nav {
  padding: unset !important;
}
.app-communities .catalog-top-nav .bx--tabs__nav {
  padding-right: 75px;
}


/* Blogs ------------------------------------------------------------------------------------------*/
.lotusBoard .lotusPost .lotusInlinelist * {
  font-size: var(--font-size-small) !important;
  font-weight: var(--font-weight-normal) !important;
}
.lotusBoard h4 a {
  font-size: var(--font-size-large) !important;
}
.lotusBoard h4 span {
  font-size: var(--font-size-medium) !important;
  color: var(--color-text-secondary) !important;
}
.lotusBoard.blogsBoard {
  margin-right: 25px;
}
.app-blogs.cnx8-ui .lotusFrame {
  min-width: 550px;
}


/* Profiles ---------------------------------------------------------------------------------------*/
/* Directory Search styles */
.cnx8-ui-pagination-next, .cnx8-ui-pagination-prev, .cnx8-ui-pagination-first, .cnx8-ui-pagination-last{
  height: 20px;
  width: 20px;
  display: inline-block;
  background-repeat: no-repeat;
  opacity: 1;
}

.cnx8-ui-pagination-disable {
  opacity: 0.3 !important;
}

#dropdown-selection {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32' %3E%3Cpath d='M23 12l-7 8-7-8h14z'%3E%3C/path%3E%3C/svg%3E");
}

.cnx8-ui-pagination-next{
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32' %3E%3Cpath d='M22 16L12 26l-1.4-1.4 8.6-8.6-8.6-8.6L12 6z'%3E%3C/path%3E%3C/svg%3E");
}

.cnx8-ui-pagination-prev{
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32' %3E%3Cpath d='M10 16L20 6l1.4 1.4-8.6 8.6 8.6 8.6L20 26z'%3E%3C/path%3E%3C/svg%3E");
}

.cnx8-ui-pagination-first{
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32' %3E%3Cpath d='M14 16L24 6l1.4 1.4-8.6 8.6 8.6 8.6L24 26zM8 4h2v24H8z'%3E%3C/path%3E%3C/svg%3E");
}

.cnx8-ui-pagination-last{
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32' %3E%3Cpath d='M18 16L8 26l-1.4-1.4 8.6-8.6-8.6-8.6L8 6zm4-12h2v24h-2z'%3E%3C/path%3E%3C/svg%3E");
}

/* Do You Know widget styles */
/* style 'Invite to Connect' button as link - https://jira.cwp.pnp-hcl.com/browse/CNXSERV-14002 */
div#sand_DYK button {
  text-align: center;
  box-shadow: none !important;
  font-weight: var(--font-weight-medium) !important;
  color: var(--color-link) !important;
  padding: 5px 0px 0px 0px !important;
  font-size: var(--font-size-medium) !important
}
div#sand_DYK button:hover {
  color: var(--color-link-hover) !important
}
/* add a bit of room between header and user images */
div#sand_DYK {
  padding: 20px 0px 5px 0px !important;
}
/* style widget title */
div#sand_DYK .widgetTitle {
  font-size: var(--font-size-large) !important
}

/* enlarge presented user name */
div#sand_DYK .vcard a.lotusPerson {
  font-size: var(--font-size-large) !important
}
/* make sure enlarged user is displayed in front of prev/next user*/
div#sand_DYK .Content span {
  position: relative;
  z-index: 10;
}
/* 2nd child span = current/highlighted user - should be in front */
div#sand_DYK .Content span:nth-child(2) {
  z-index: 11;
}
/* pull user images closer together/overlap */
div#sand_DYK .Content span img {
  margin: -11px !important;
  padding: 0px !important;
  border-radius: 50% !important;
}


/* Activities--------------------------------------------------------------------------------------*/
/* add space between community activity content and feed section */
.cnx8-ui.app-communities #activityFeeds {
  margin-top: 20px;
}


/* =================================================================================================
 * MISCELLANEOUS
 * - Not sure what connections components they relate to
 * - TODO - identify and categorize
 * ================================================================================================*/
/* Dojo Compatibilities */
.dijitDialogUnderlayWrapper{
  top:0 !important;
  left:0 !important;
}

.catalog-top-nav{
  box-shadow: 0px 0px 8px 0px black;
}

.switch {
  position: relative;
  display: inline-block;
  width: 60px;
  height: 34px;
}

.switch input {
  opacity: 0;
  width: 0;
  height: 0;
}

.slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  -webkit-transition: .4s;
  transition: .4s;
}

.slider:before {
  position: absolute;
  content: "";
  height: 26px;
  width: 26px;
  left: 4px;
  bottom: 4px;
  background-color: white;
  -webkit-transition: .4s;
  transition: .4s;
}

input:checked + .slider {
  background-color: #2196F3;
}

input:focus + .slider {
  box-shadow: 0 0 1px #2196F3;
}

input:checked + .slider:before {
  -webkit-transform: translateX(26px);
  -ms-transform: translateX(26px);
  transform: translateX(26px);
}

.active-sets .ic-bizcard span.setLabel,
.suggested-sets .ic-bizcard span.setLabel {
  font-size: var(--font-size-small) !important;
}

#ui-control-title {
  color: #ffffff !important;
}

#ui-control-title:hover {
  color: #267dc7 !important;
  cursor: pointer;
}

#catalog-backToTop {
  z-index: 9 !important;
}

.catalog-card-view.catalog-ui-updated .catalog {  background-color: #FFFFFF;}

body.isAuthenticated-false #lotusFrame
{
  margin-right:0 !important;
}

/* handle css for profile left side links - #CNXSERV-14083 & CNXSERV-13996*/
ul#profilesNavMenuUL li a {
  font-weight: var(--font-weight-normal) !important;
  margin: 5px 0px 5px 5px !important;
}
/* css for CNXSERV-13426 [Activity Stream][RTL] EE Close icon overlaps with text */
[dir="rtl"] .lotusui30 .lotusFlyout .lotusFlyoutHeader .flyoutTitleInner{
	width: 100%;
}
[dir="rtl"] .lotusui30 .lotusFlyout .lotusClose {
	left: 5px;
	right: Auto;
}
[dir="rtl"]  :is(.lotusTwistyClosed, .lotusTwistyClosedMenu, .lconnSprite.lconnSprite-iconHelp16, .lconnSprite.lconnSprite-iconHelp16-ar) {
	transform: scaleX(-1);
}
.subcommunity-title span {
  color: var(--color-text-blue) !important;
  display: inline-block;
  width: 100%;
}

/* CNXSERV-15413 wiki icon update*/
.otherActivityStream14-asWikis14,
.lconnSprite.lconnSprite-iconWikis16,
.lconnSprite.lconnSprite-iconWikisItem16 {
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='MuiSvgIcon-root' focusable='false' viewBox='0 0 32 32' aria-hidden='true' role='presentation' data-mui-test='wikisIcon' style='font-size: 3em;' fill='%233D5466'%3E%3Cpath d='M16 2a14 14 0 1 0 14 14A14 14 0 0 0 16 2zm12 13h-6a24.26 24.26 0 0 0-2.79-10.55A12 12 0 0 1 28 15zM16 28a5 5 0 0 1-.67 0A21.85 21.85 0 0 1 12 17h8a21.85 21.85 0 0 1-3.3 11 5 5 0 0 1-.7 0zm-4-13a21.85 21.85 0 0 1 3.3-11 6 6 0 0 1 1.34 0A21.85 21.85 0 0 1 20 15zm.76-10.55A24.26 24.26 0 0 0 10 15H4a12 12 0 0 1 8.79-10.55zM4.05 17h6a24.26 24.26 0 0 0 2.75 10.55A12 12 0 0 1 4.05 17zm15.16 10.55A24.26 24.26 0 0 0 22 17h6a12 12 0 0 1-8.79 10.55z'%3E%3C/path%3E%3C/svg%3E") !important;
  /* CNXSERV-16882 - [Wikis] Wiki icon for elements in trash show 1.5 times */
  background-repeat: no-repeat !important;
}

/* CSS for iframe integration use case (/homepage/web/pageWrapper) */
#lotusFrame.cnxPageWrapper .lotusContent {
  width: 100%;
}

#lotusFrame.cnxPageWrapper .lotusContent .lotusMain {
  width: 100%;
  margin: unset !important;
  max-width: unset;
  padding: unset !important;
}

#lotusFrame.cnxPageWrapper .lotusContent .lotusMain #cnxPageWrapperIframe {
  width: 100%;
  height: 100%;
  border: none;
}

/* CNXSERV-15874 - css for community activity */
#lotusMainColumns {
  margin-left: 0px !important;
}

#cancel_button, .app-communities.cnx8-ui .lotusDialogFooter input[value="Cancel"], .customizebuttonCNX8.bx--btn--secondary.btn-default{
  background-color: #fff !important;
  color: var(--color-tab-text-selected) !important;
  border: none !important;
}

#cancel_button:hover, .app-communities.cnx8-ui .lotusDialogFooter input[value="Cancel"]:hover,
.customizebuttonCNX8.bx--btn--secondary.btn-default:hover{
  background-color: var(--color-cancel-background-hover) !important;
  box-shadow: none !important;
  color: var(--color-tab-text-selected) !important;
}

.lotusFormButton.lotusBtnDisabled, .lotusFormButton.lotusBtnDisabled:hover, button:disabled{
  color: var(--color-disabled-text) !important;
  box-shadow: none !important;
  background: var(--color-disabled-background) !important;
  cursor: default;
  border: none !important;
  margin:0 !important;
}

.shareIconInline {
  margin-right: 10px;
  margin-left: 0;
}
[dir=rtl] .shareIconInline {
  margin-left: 10px;
  margin-right: 0;
}
button.Mui-disabled#share-button span {
  color: var(--color-button-disabled-text) !important;
  background-color: unset !important;
}

button#cancel-button:hover {
  padding: 8px 20px;
  background-color: var(--color-button-secondary-hover)!important;
  border-radius: 0px;
}

#uploadFile .lotusMessage2 img.lotusIcon.lotusIconMsgSuccess {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='MuiSvgIcon-root jss36' focusable='false' viewBox='0 0 32 32' aria-hidden='true' role='presentation' data-mui-test='checkmark--outlineIcon' fill='%23bed732'%3E%3Cpath d='M16 2a14 14 0 1 0 14 14A14 14 0 0 0 16 2zm0 26a12 12 0 1 1 12-12 12 12 0 0 1-12 12z'%3E%3C/path%3E%3Cpath d='M14 21.5l-5-4.96 1.59-1.57L14 18.35 21.41 11 23 12.58l-9 8.92z'%3E%3C/path%3E%3C/svg%3E") !important;
  background-position: unset !important;
  height: 25px !important;
  width: 25px !important;
  margin: 0 12px 0 0 !important;
}

#uploadFile .lotusMessage .lotusMessageBody, .lotusui30 .lotusMessage span, .lotusui30 .lotusMessage2 .lotusMessageBody {
  padding: 5px !important;
  margin: 0;
  word-wrap: break-word;
  color: var(--color-info-message-text) !important;
}

#uploadFile .lotusMessageContainer .lotusMessage2 {
  padding: 6px 16px !important;
  width: fit-content !important;
  border: 0;
  border-radius: 2px !important;
  border-left: 4px solid var(--color-snackbar-success) !important;
  display: flex;
  align-items: center !important;
  justify-content: space-between;
  flex-wrap: nowrap !important;
  margin: 8px !important;
}

#uploadFile .lotusMessageContainer .lotusMessage2 .lotusMessageBody a {
  color: var(--color-header-text) !important;
  text-decoration-line: underline !important;
}

#uploadFile .lotusMessage2 .lotusDelete img {
  opacity: 1;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='MuiSvgIcon-root' focusable='false' fill='grey' viewBox='0 0 32 32' aria-hidden='true' role='presentation' data-mui-test='closeIcon' style='font-size: 3em;'%3E%3Cpath d='M24 9.4L22.6 8 16 14.6 9.4 8 8 9.4l6.6 6.6L8 22.6 9.4 24l6.6-6.6 6.6 6.6 1.4-1.4-6.6-6.6L24 9.4z'%3E%3C/path%3E%3C/svg%3E") !important;
  height: 24px !important;
  width: 24px !important;
  background-repeat: no-repeat;
  background-position: center !important;
}

#uploadFile .lotusMessage2 .lotusDelete img:hover {
  opacity: 0.55 !important;
}

.lotusMain #catalog-app-container #uploadFile {
  top: 60px;
  position: relative;
  margin: 0px 30px;
}

#dijit_Dialog .lotusDialog .lotusDialogHeader .lotusDialogClose img, .app-files.cnx8-ui .dijitDialogCloseIcon, .app-files.cnx8-ui .dijitPopup .lotusPopup .lotusPopupClose img, .app-files.cnx8-ui .lotusMessage2 .lotusDelete img {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='MuiSvgIcon-root' focusable='false' fill='grey' viewBox='0 0 32 32' aria-hidden='true' role='presentation' data-mui-test='closeIcon' style='font-size: 3em;'%3E%3Cpath d='M24 9.4L22.6 8 16 14.6 9.4 8 8 9.4l6.6 6.6L8 22.6 9.4 24l6.6-6.6 6.6 6.6 1.4-1.4-6.6-6.6L24 9.4z'%3E%3C/path%3E%3C/svg%3E") !important;
  height: 24px !important;
  width: 24px !important;
  background-repeat: no-repeat;
  background-position: center !important;
}

#dijit_Dialog .lotusDialog .lotusDialogHeader .lotusDialogClose img {
  background-size: 25px !important;
  margin: 0 !important;
}

#dijit_Dialog .lotusDialog .lotusDialogHeader .lotusHeading {
  color: var(--color-modal-header-text) !important;
  font-weight: var(--font-weight-medium) !important;
  font-size: var(--font-size-large) !important;
}

.dialogGlobalFileUpload#dijit_Dialog .lotusDialogWrapper.dijitDialog.globalUploadFile {
  top: -278px !important;
}

/* CNXSERV-16852 , CNXSERV-16851 - adjust user image css */
.cnx8-ui .lconnPeopleTypeAheadMenu.dijitComboBoxMenu .dijitMenuItem img {
  padding: 5px;
}

#top-updates #uploadFile {
  top: 20px !important;
  position: relative;
  margin: 0px 30px !important;
}

body.app-profiles #uploadFile {
  margin: 10px 0px !important;
}

body.app-files #uploadFile .lotusMessageContainer {
  overflow-x: hidden !important;
  margin: 10px 10px 0px 0px !important;
}

/* CNXSERV-17209 - spacing for 'Likes' window in files */
.communities-widget-appearance .lotusui30 ul.lotusList li {
  padding: 4px 6px !important;
  text-align: revert;
}

body.app-dogear.cnx8-ui #lconn_share_widget_Dialog_1 div.lotusDialogBorder form.lotusDialog.lotusForm {
  width: 664px !important;
}

body.app-dogear.cnx8-ui #lconn_share_widget_Dialog_1 .lotusDialog .lotusDialogHeader .lotusDialogClose {
  top: 15px !important;
  right: -50px !important;
}

body.app-profiles.cnx8-ui #lconn_share_widget_Dialog_1 .lotusDialog .lotusDialogHeader .lotusDialogClose {
  top: 12px !important;
}

.MuiAlert-standardSuccess .MuiAlert-icon {
  color: #15D36E !important;
}

/* CNXSERV-15104 for notification clickable button wrapper */
#notifications_wrapper {
  position: absolute;
  width: 100%;
  height: 100%;
}


/* ************************************************************************************ */
/* BEGINN Settings                                                                      */
/* ************************************************************************************ */
.lotusui30.cnx8-ui.app-oauth .lotusTitleBar2.lotusTitleBar2Tabs,
.lotusui30.cnx8-ui.app-deploymentConfig .lotusTitleBar2.lotusTitleBar2Tabs
{
  background: var(--color-third-navigation) !important;
  border-right: 1px solid var(--color-third-navigation-border);
}

/* */
.lotusui30.cnx8-ui.app-oauth #lotusFrame .lotusTitleBar2.lotusTitleBar2Tabs .lotusWrapper,
.lotusui30.cnx8-ui.app-deploymentConfig #lotusFrame .lotusTitleBar2.lotusTitleBar2Tabs .lotusWrapper

{
  /* width: var(--left-navigation-width) !important; */
  margin: 0;
  padding: 0;
  min-width: unset;
  max-width: unset;
}

.lotusui30.cnx8-ui.app-oauth ul.lotusNavTabs,
.lotusui30.cnx8-ui.app-deploymentConfig ul.lotusNavTabs
{
  margin-left: 0 !important;
  min-width: unset;
  border-right: 0;
  height: unset;
  width: unset;
}


.lotusui30.cnx8-ui.app-oauth #lotusFrame.lotusFrame .lotusMain,
.lotusui30.cnx8-ui.app-deploymentConfig #lotusFrame.lotusFrame .lotusMain
{
  margin: 15px 30px !important;
  width: unset !important;
  padding: 0;
}

.lotusui30.cnx8-ui.app-oauth #lotusFrame.lotusFrame .lotusMain .lotusContent
{
  padding: 0;
}

.lotusui30.cnx8-ui.app-oauth ul.lotusNavTabs .lotusTabWrapper a,
.lotusui30.cnx8-ui.app-oauth ul.lotusNavTabs .lotusTabWrapper a .lotusTabInner,
.lotusui30.cnx8-ui.app-oauth ul.lotusNavTabs .lotusTabWrapper a .lotusTabInner strong,
.lotusui30.cnx8-ui.app-deploymentConfig ul.lotusNavTabs .lotusTabWrapper a,
.lotusui30.cnx8-ui.app-deploymentConfig ul.lotusNavTabs .lotusTabWrapper a .lotusTabInner,
.lotusui30.cnx8-ui.app-deploymentConfig ul.lotusNavTabs .lotusTabWrapper a .lotusTabInner strong
{
  border: 0px solid transparent !important;
  font-weight: normal;
}

.lotusui30.cnx8-ui.app-oauth ul.lotusNavTabs .lotusTabWrapper a .lotusTabInner,
.lotusui30.cnx8-ui.app-deploymentConfig ul.lotusNavTabs .lotusTabWrapper a .lotusTabInner
{
  padding-left: 20px;
}

.lotusui30.cnx8-ui.app-oauth .lotusTitleBar2 ul.lotusNavTabs li a.lotusTab,
.lotusui30.cnx8-ui.app-oauth .lotusTitleBar2 ul.lotusNavTabs li a.lotusTab:visited,
.lotusui30.cnx8-ui.app-oauth ul.lotusNavTabs li, .lotusui30.cnx8-ui.app-deploymentConfig .lotusTitleBar2 ul.lotusNavTabs li a.lotusTab,
.lotusui30.cnx8-ui.app-deploymentConfig .lotusTitleBar2 ul.lotusNavTabs li a.lotusTab:visited,
.lotusui30.cnx8-ui.app-deploymentConfig ul.lotusNavTabs li
{
  padding: 3px 0 3px 0;
  width: calc(var(--left-navigation-width) - 1px) !important;
  margin-left: 0;
}

.lotusui30.cnx8-ui.app-oauth .lotusWrapper.modifiedLotusWrapper, .lotusui30.cnx8-ui.app-deploymentConfig .lotusWrapper.modifiedLotusWrapper
{
  min-width: unset !important;
}

.lotusui30.cnx8-ui.app-news #lotusMain,
.lotusui30.cnx8-ui.app-oauth #lotusFrame,
.lotusui30.cnx8-ui.app-deploymentConfig #lotusFrame
{
  display: grid;
  grid-template-areas:
    "settings-nav settings-main"
    "settings-footer settings-footer";
  grid-template-columns: var(--left-navigation-width) 1fr;
  grid-gap: 0px;
}

.lotusui30.cnx8-ui.app-oauth #lotusFrame .lotusFooter, .lotusui30.cnx8-ui.app-deploymentConfig #lotusFrame .lotusFooter
{
  padding: 0;
}

.lotusui30.cnx8-ui.app-news #settingsNavigation,
.lotusui30.cnx8-ui.app-oauth .lotusTitleBar2.lotusTitleBar2Tabs.modifiedLotusTitleBar2,
.lotusui30.cnx8-ui.app-deploymentConfig .lotusTitleBar2.lotusTitleBar2Tabs.modifiedLotusTitleBar2
{
  grid-area: settings-nav;
  background: var(--color-third-navigation) !important;
  width: var(--left-navigation-width) !important;
  border-right: 1px solid var(--color-third-navigation-border) !important;
  box-sizing: border-box;
  border-bottom: 0 !important;
  height: calc(100vh - 99px);
}

.lotusui30.cnx8-ui.app-news #lotusMain
{
  padding-left: 0;
  padding-right: 0;
  max-width: unset;
}

.lotusui30.cnx8-ui.app-news #settingsNavigation
{
  margin-left: 0;
}

.lotusui30.cnx8-ui.app-news #pageTabs
{
  list-style-type: none;
  padding-left: 0 !important;
  padding: 5px 0;
  margin: 0;
}

.lotusui30.cnx8-ui.app-news #pageTabs li
{
  margin-bottom: 2px;
}

.lotusui30.cnx8-ui.app-news #pageTabs li:hover
{
  background: var(--color-third-navigation-selected-option) !important;
  transition: ease 250ms background-color;
}

.lotusui30.cnx8-ui.app-news #pageTabs li,
.lotusui30.cnx8-ui.app-news #pageTabs li a.lotusTab
{
  padding: 3px 0;
  line-height: 1.75;
  display: block;
  margin: 0;
}

.lotusui30.cnx8-ui.app-news #pageTabs li a.lotusTab:hover
{
  text-decoration: none;
}

.lotusui30.cnx8-ui.app-news #pageTabs li.lotusSelected .lotusTabWrapper
{
  background: #DAE1E6 !important;
}

.lotusui30.cnx8-ui.app-news #pageTabs li a.lotusTab span.lotusTabInner
{
  padding: 2px 0 2px 20px !important;
  margin-left: 0 !important;
  display: block;
  font-weight: normal;
}

.lotusui30.cnx8-ui.app-news .lotusContent,
.lotusui30.cnx8-ui.app-oauth .lotusMain.modifiedLotusMain,
.lotusui30.cnx8-ui.app-deploymentConfig .lotusMain.modifiedLotusMain
{
  grid-area: settings-main;
  right: 0 !important;
  left: 0 !important;
  float: none;
  width: 100% !important;
  padding: 0 !important;
  margin: 0px !important;
  top: 0;
}

.lotusui30.cnx8-ui.app-news .lotusContent,
.lotusui30.cnx8-ui.app-oauth .lotusMain.modifiedLotusMain .lotusContent,
.lotusui30.cnx8-ui.app-deploymentConfig .lotusMain.modifiedLotusMain .lotusContent
{
  margin: 15px 30px !important;
  padding: 0;
}

.lotusui30.cnx8-ui.app-news #lotusFooter,
.lotusui30.cnx8-ui.app-oauth #lotusFooter.lotusHidden,
.lotusui30.cnx8-ui.app-deploymentConfig #lotusFooter.lotusHidden
{
  display: block;
  margin-top: 0;
  width: 100%;
  grid-area: settings-footer;
  padding-bottom: 67px;
  box-sizing: border-box;
}

.lotusui30.cnx8-ui.app-oauth .lotusTitleBar2.lotusTitleBar2Tabs ul li:hover,
.lotusui30.cnx8-ui.app-oauth .lotusTitleBar2.app-deploymentConfig ul li:hover,
.lotusui30.cnx8-ui.app-deploymentConfig .lotusTitleBar2.lotusTitleBar2Tabs ul li:hover,
.lotusui30.cnx8-ui.app-deploymentConfig .lotusTitleBar2.app-deploymentConfig ul li:hover
{
  background: var(--color-third-navigation-selected-option) !important;
  transition: ease 250ms background-color;
}


.lotusui30.cnx8-ui.app-news .updatedNotification h1#page_heading,
.lotusui30.cnx8-ui.app-oauth .lotusHeader h1.lotusHeading,
.lotusui30.cnx8-ui.app-deploymentConfig .lotusHeader h1.lotusHeading
{
  font-size: var(--font-size-xlarge) !important;
  font-weight: 500;
}
.lotusui30.cnx8-ui.app-news .lotusHeader
{
  margin: 0;
}


.lotusui30.cnx8-ui.app-oauth .lotusTitleBarContent.modifiedLotusTitleBarContent,
.lotusui30.cnx8-ui.app-deploymentConfig .lotusTitleBarContent.modifiedLotusTitleBarContent
{
  margin: 0 !important;
  width: var(--left-navigation-width);
}

.lotusui30.cnx8-ui.app-news #lotusFrame,
.lotusui30.cnx8-ui.app-oauth #lotusFrame,
.lotusui30.cnx8-ui.app-deploymentConfig #lotusFrame,
.lotusui30.cnx8-ui.app-news .lotusMain.modifiedLotusMain,
.lotusui30.cnx8-ui.app-oauth .lotusMain.modifiedLotusMain,
.lotusui30.cnx8-ui.app-deploymentConfig .lotusMain.modifiedLotusMain,
.lotusui30.cnx8-ui.app-news .lotusContent,
.lotusui30.cnx8-ui.app-oauth .lotusContent,
.lotusui30.cnx8-ui.app-deploymentConfig .lotusContent,
.lotusui30.cnx8-ui.app-deploymentConfig .lotusui30 .lotusFooter
{
  min-width: unset;
  width: unset;
}

.lotusui30.cnx8-ui.app-news.settings-def-hp .lotusContent
{
  margin: 0 !important;
}

.lotusui30.cnx8-ui.app-news .lotusui30 .lotusFooter ul
.lotusui30.cnx8-ui.app-oauth .lotusui30 .lotusFooter ul
.lotusui30.cnx8-ui.app-deploymentConfig .lotusui30 .lotusFooter ul
{
  margin: 0;
}

.cnx8-ui.app-news .def-hp
{
  margin: 15px 30px;
}

.lotusui30.cnx8-ui.app-deploymentConfig .lotusForm2 .lotusFormFooter input,
.lotusui30.cnx8-ui.app-deploymentConfig .lotusForm2 .lotusFormFooter input:hover
{
  border-radius: 3px !important;
  font-family: var(--font-family);
  text-shadow: none;
  box-shadow: none !important;
  border-width: 1px !important;
  border-color: var(--color-button);
  height: 36px;
}
.lotusui30.cnx8-ui.app-deploymentConfig .lotusForm2 .lotusFormFooter input:hover
{
  background-color: var(--color-button-secondary-hover);
}

.lotusui30.cnx8-ui.app-deploymentConfig .lotusMain .lotusFieldWrapper select,
.lotusui30.cnx8-ui.app-deploymentConfig .modifiedLotusMain .lotusFieldWrapper select
{
  font-family: var(--font-family);
  border-radius: 3px;
  color: var(--color-button) !important;
  border: 1px solid var(--color-button) !important;
}

.lotusui30.cnx8-ui.app-deploymentConfig .lotusMain .lotusFieldWrapper select:disabled,
.lotusui30.cnx8-ui.app-deploymentConfig .modifiedLotusMain .lotusFieldWrapper select:disabled,
.lotusui30.cnx8-ui.app-deploymentConfig .lotusForm2 .lotusFormFooter input.lotusBtnDisabled,
.lotusui30.cnx8-ui.app-deploymentConfig .lotusForm2 .lotusFormFooter input.lotusBtnDisabled:hover
{
  border-color: var(--color-button-disabled) !important;
  color: var(--color-button-disabled-text) !important;
  background-color: var(--color-button-disabled-background) !important;
}

/* BEGIN SEARCH IN SETTINGS */
.lotusui30.cnx8-ui.app-news #lotusMain,
.lotusui30.cnx8-ui.app-oauth #lotusFrame,
.lotusui30.cnx8-ui.app-deploymentConfig #lotusFrame {
  display: grid;
  grid-template-areas:
    "settings-nav settings-main"
    "settings-footer settings-footer";
  grid-template-columns: var(--left-navigation-width) 1fr;
  grid-gap: 0px;
}

.lotusui30.cnx8-ui.app-oauth #lotusFrame.searchFrame,
.lotusui30.cnx8-ui.app-deploymentConfig #lotusFrame.searchFrame {
  display: grid;
  grid-template-areas:
    "settings-search"
    "settings-footer";
  grid-template-columns: 1fr;
}

.lotusui30.cnx8-ui.app-news #search-result-wrapper,
.lotusui30.cnx8-ui.app-oauth #search-result-wrapper,
.lotusui30.cnx8-ui.app-deploymentConfig #search-result-wrapper
{
  grid-area: settings-search;
}

.lotusui30.cnx8-ui.app-oauth #lotusFrame.searchFrame .lotusFooter,
.lotusui30.cnx8-ui.app-deploymentConfig #lotusFrame.searchFrame .lotusFooter
{
  display: none;
}
/* END SEARCH IN SETTINGS */

/* ************************************************************************************ */
/* END Settings                                                                         */
/* ************************************************************************************ */


.lotusui30.cnx8-ui.app-deploymentConfig .lotusMain .lotusFieldWrapper select {
  min-width: max-content;
}
/*CNXSERV-16827 adjust text styling in contents */
.app-communities .wheader .wtitle,.app-communities h2.widgetTitle .ibmDndDragHandle {
  line-height: 32px !important;
  font-weight: var(--font-weight-medium) !important;
  font-size: 20px !important;
}
.lotusui30.app-forums tr.lotusFirst.lotusSort{
  font-size: var(--font-size-medium) !important;
}
.app-blogs.cnx8-ui #lotusContent .lotusInlinelist li a {
  font-weight: var(--font-weight-medium) !important;
  font-size: var(--font-size-medium) !important;
}
.app-activities.lotusui30 .lotusColRight .lotusSection h2{
  font-weight: var(--font-weight-bold) !important;
}
/* ************************************************************************************ */
/* END CNXSERV-16827                                                                    */
/* ************************************************************************************ */

/* METRICS BUTTONS CNXSERV-16748 */
.lotusui30 #lotusContent #lineChartViewTable #lineChartViewChartLink,
.lotusui30 #lotusContent #lineChartViewTable #lineChartViewTableLink {
  margin-left: 10px !important;
}

.app-metrics .metricsLotusMain #lotusColLeft {
  padding-right: 0 !important;
  border-left: 0 !important;
  width: 230px !important;
  position : absolute;
  border-right: 1px solid var(--color-third-navigation-border);
  height: 100% !important;
}

.lotusui30_layout.app-metrics .lotusColLeft::after {
  border-left: 0 !important;
  background: #f1f1f1;
  width: 0 !important;
  border-right: 0 !important;
  content: "";
  margin-left: 0 !important;
  position: fixed !important;
  bottom: 0 !important;
  height: 0 !important;
  z-index: 0 !important;
}

.lotusui30_layout.app-metrics .lotusColLeft {
  margin-right: 20px;
  margin-left: 0px !important;
  padding-top: 0;
  width: 220px;
  background: #f1f1f1;
  height: 100% !important;

}

.app-metrics .metricsLotusMain #lotusColLeft #lotusSidenav .lotusBottomCorner .lotusMenuSubsection a,
.app-metrics .metricsLotusMain #lotusColLeft #viewAllMetricsDivID a {
  padding-left: 45px !important;
}

.app-metrics .metricsLotusMain #lotusColLeft .lotusBottomCorner li.lotusSelected {
  background-color: var(--color-third-navigation-selected-option);
}

.app-metrics #lotusFrame {
  height: calc(100vh - 48px) !important;
}

.lotusui30.app-metrics .lotusFooter {
  position: relative !important;
  bottom: 0px !important;
  margin-top: 0px !important;
}

.app-metrics.has-banner #lotusFrame {
  height: calc(100vh - 90px) !important;
  margin-top: -40px !important;
}

.cnx8-ui.app-metrics.has-banner .lotusFrame .lotusFooter {
  bottom: 12px !important;
}

.lotusui30.cnx8-ui .lotusMain.metricsLotusMain {
  margin: 0 !important;
  padding: 0 !important;
}

.lotusui30.cnx8-ui .lotusMain.metricsLotusMain #lotusContent {
  margin: 50px 4rem 0px 0px !important;
  padding-left: 250px;
  width: auto !important;
}

.lotusui30.app-metrics .lotusMenu .lotusHeading {
  visibility: hidden;
}

.app-metrics #lotusTopNav {
  z-index: 1;
  position: relative;
}

.app-metrics div#lineChartBodyDivID {
  width: 100% !important;
}

.app-metrics div#lineChartViewChart, div#lineChartViewTable {
  width: 100% !important;
}

.app-metrics #appFilterDivId, div#reportDivId.metricsReport {
  width: 100% !important;
}

.app-metrics #statisticHeaderTableID th {
  border-right: 1px solid var(--tagcloud-chip-border) !important;
  border-left: 1px solid var(--tagcloud-chip-border) !important;
  border-top: 1px solid var(--tagcloud-chip-border) !important;
  background-color: #ffffff;
}

.app-metrics #statisticHeaderTableID {
  border-collapse: inherit;
  border-spacing: 2rem 0px;
  width: calc(100% + 4rem) !important;
  margin-left: -2rem;
}

.app-metrics #statisticHeaderTableID tr:nth-child(2) td {
  border-right: 1px solid var(--tagcloud-chip-border) !important;
  border-left: 1px solid var(--tagcloud-chip-border) !important;
  background-color: var(--color-base-background);
}

.app-metrics #statisticHeaderTableID tr:nth-child(3) td {
  border-right: 1px solid var(--tagcloud-chip-border) !important;
  border-left: 1px solid var(--tagcloud-chip-border) !important;
  border-bottom: 1px solid var(--tagcloud-chip-border) !important;
  background-color: var(--color-base-background);
}

.app-metrics .lotusContent .dijitSelect {
  border: none !important;
  margin-right: 10px !important;
}

.app-metrics .lotusContent .dijitSelect .dijitButtonText {
  padding: 2px 10px !important;
}

.app-metrics .lotusContent .dijitSelect .dijitButtonNode, .app-metrics .lotusContent .dijitSelect .dijitButtonContents {
  border: none !important;
}


.app-metrics .lotusContent .dijitSelect .dijitArrowButtonInner, .app-metrics .dijitButtonNode .dijitArrowButtonInner {
  background: url(/connections/resources/web/com.ibm.social.hikari.theme/sprite/svg/caret_down.svg) right center no-repeat !important;
  width: 15px !important;
}

/* CNX8 UI Adjustments */
/* CNXSERV-15614, Export To PDF Page Design Changes */
/* Text: Export As PDF */
.dijitDialogPdfExport .lotusDialogHeader.lotusDialogHeader-header {
  font-weight: var(--font-weight-header) !important;
  font-size: var(--font-size-large-header) !important;
}

/* CNXSERV-16872 [Wikis] Member page - back to wiki breadcrumb needs updated chevron icon */
.app-wikis.cnx8-ui .wiki-content.members .lotusBreadcrumbs::before {
  content: "";
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='MuiSvgIcon-root' focusable='false' viewBox='0 0 32 32' aria-hidden='true' role='presentation' data-mui-test='chevron--leftIcon' style='font-size: 3em;' fill='%2301539B'%3E%3Cpath d='M10 16L20 6 21.4 7.4 12.8 16 21.4 24.6 20 26z'%3E%3C/path%3E%3C/svg%3E%0A");
  background-repeat: no-repeat;
  position: relative;
  height: 23px;
  width: 23px;
  display: inline-block;
  top: 7px;
  left: -5px;
}

/* CNXSERV-18949:lock and unlock links should toggle display*/
.cnx8-ui.app-forums #cnx8_forumActionsMenu .lotusSectionBody ul.lotusList li.dijitMenuItemDisabled {
  display: none;
}


/* CNXSERV-19139 ITM bar collapses as soon as user starts creating community event */
/* CNXSERV-19123 Communities: Screen overlays the ITM bar */
.cnx8-ui .tox.tox-silver-sink.tox-tinymce-aux {
  width: unset !important
}

/* CNXSERV-19140 adjust css for biz card in typeahead result while mentioning when tinymce installed */
.cnx8-ui .tox.tox-silver-sink.tox-tinymce-aux .tox-tooltip-worker-container,
.cnx8-ui .tox.tox-silver-sink.tox-tinymce-aux .tox-menu.tox-collection.tox-collection--list.tox-selected-menu{
  min-width: 210px;
}
/* CNX-29435 hide old chevron in tinymce select fields */
.cnx8-ui .tox-tinymce-aux .tox-form__group .tox-selectfield .tox-selectfield__icon-js{
  display:none;
}
.lotusui30 .tabNavTabBar .lotusAllCapsAllowed li { text-transform: capitalize !important }

.lotusui30dojo .dijitTextBox{ border: none }
.btn-fileupload span{
  color:#fff !important;
}

.xccstyle .chpFlyout .lotusFlyout .lotusFlyoutHeader .printSpan { top: 7px !important; }
.xccstyle .chpFlyout .lotusFlyoutHeader .lotusInlinelist li, .xccstyle .chpFlyout .lotusFlyoutHeader .lotusMeta, .xccstyle .chpFlyout .lotusFlyout .lotusFlyoutHeader .lotusClose {color: #000 !important;font-size: var(--font-size-medium) !important;}

/**************sametime chat status icons**********************/

.lconnStMenuItem .dijitMenuItemIcon {
  -webkit-appearance: none;
  -moz-appearance: none;
  background-position: 100%;
  width: 15px !important;
  height: 15px !important;
  background-size: 1em 1em;
  background-repeat: no-repeat;
  margin: 0 5px !important;
  cursor: pointer;
}
.lconnStMenuItem .stproxy_statusIconOffline {
  background-image: url("data:image/svg+xml,%3Csvg width='21' height='21' viewBox='0 0 21 21' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_33_1948)'%3E%3Crect width='21' height='21' fill='none'/%3E%3Cpath d='M10.5 21C16.299 21 21 16.299 21 10.5C21 4.70101 16.299 0 10.5 0C4.70101 0 0 4.70101 0 10.5C0 16.299 4.70101 21 10.5 21Z' fill='%23DEDEDE'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M8.64394 10.5001L4.32202 6.17818L6.17818 4.32202L10.5001 8.64394L14.822 4.32202L16.6782 6.17818L12.3563 10.5001L16.6782 14.822L14.822 16.6782L10.5001 12.3563L6.17818 16.6782L4.32202 14.822L8.64394 10.5001Z' fill='black' fill-opacity='0.38'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_33_1948'%3E%3Crect width='21' height='21' fill='none'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A");
}
.lconnStMenuItem .stproxy_statusIconMeeting {
  background-image: url("data:image/svg+xml,%3Csvg width='21' height='21' viewBox='0 0 21 21' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_33_1971)'%3E%3Crect width='21' height='21' fill='none'/%3E%3Cpath d='M10.5 21C16.299 21 21 16.299 21 10.5C21 4.70101 16.299 0 10.5 0C4.70101 0 0 4.70101 0 10.5C0 16.299 4.70101 21 10.5 21Z' fill='%23FF7A7A'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_33_1971'%3E%3Crect width='21' height='21' fill='none'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A");
}
.lconnStMenuItem .stproxy_statusIconAway {
  background-image: url("data:image/svg+xml,%3Csvg width='21' height='21' viewBox='0 0 21 21' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_33_1964)'%3E%3Crect width='21' height='21' fill='none'/%3E%3Cpath d='M10.5 21C16.299 21 21 16.299 21 10.5C21 4.70101 16.299 0 10.5 0C4.70101 0 0 4.70101 0 10.5C0 16.299 4.70101 21 10.5 21Z' fill='%23FFAF38'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M9.1875 3.5H11.8125V9.95634L15.8031 13.9469L13.9469 15.8031L9.1875 11.0437V3.5Z' fill='black' fill-opacity='1.6'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_33_1964'%3E%3Crect width='21' height='21' fill='none'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A");
}
.lconnStMenuItem .stproxy_statusIconAvailable {
  background-image: url("data:image/svg+xml,%3Csvg width='21' height='21' viewBox='0 0 21 21' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_33_1949)'%3E%3Crect width='21' height='21' fill='none'/%3E%3Cpath d='M10.5 21C16.299 21 21 16.299 21 10.5C21 4.70101 16.299 0 10.5 0C4.70101 0 0 4.70101 0 10.5C0 16.299 4.70101 21 10.5 21Z' fill='%2315D36E'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M14.8219 6.07193L16.6781 7.92809L8.74998 15.8562L4.3219 11.4281L6.17805 9.57193L8.74998 12.1439L14.8219 6.07193Z' fill='black' fill-opacity='1.6'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_33_1949'%3E%3Crect width='21' height='21' fill='none'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A");
}
.lconnStMenuItem .stproxy_statusIconDisturb {
  background-image: url("data:image/svg+xml,%3Csvg width='21' height='21' viewBox='0 0 21 21' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_33_1953)'%3E%3Crect width='21' height='21' fill='none'/%3E%3Cpath d='M10.5 21C16.299 21 21 16.299 21 10.5C21 4.70101 16.299 0 10.5 0C4.70101 0 0 4.70101 0 10.5C0 16.299 4.70101 21 10.5 21Z' fill='%23FF7A7A'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M17.5 11.8125H3.5V9.1875H17.5V11.8125Z' fill='black' fill-opacity='1.6'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_33_1953'%3E%3Crect width='21' height='21' fill='none'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A");
}
.dijitMenuPopup .dijitMenuTable td.dijitMenuItemIconCell {
  vertical-align: middle;
}

/* Sametime status bar */
.cnx8-ui #stStatusArea_dropdown.dijitMenuPopup .dijitMenuTable .dijitMenuItemFocused td.dijitMenuItemLabel,
.cnx8-ui .dijitMenuPopup .dijitMenuTable .dijitMenuItemFocused td.dijitMenuItemLabel {
  border-bottom:  none !important;
  border-top:  none !important;
}
.cnx8-ui #stStatusArea_dropdown.dijitMenuPopup .dijitMenuTable .dijitMenuItemSelected td.dijitMenuItemIconCell,
.cnx8-ui .dijitMenuPopup #STLoggedUserMenu.dijitMenuTable .dijitMenuItemSelected td.dijitMenuItemIconCell {
  border-left: none !important;
}
.cnx8-ui.app-activities #stStatusArea_dropdown.dijitMenuPopup .dijitMenuTable .dijitMenuItemSelected td.dijitMenuItemIconCell,
.cnx8-ui.app-activities .dijitMenuPopup #STLoggedUserMenu.dijitMenuTable .dijitMenuItemSelected td.dijitMenuItemIconCell {
  border-left: 4px solid transparent !important;
}
.cnx8-ui.app-homepage button#stStatusArea {
  box-sizing: border-box;
}
.cnx8-ui #stStatusArea_dropdown .dijitMenuItem td.dijitMenuItemLabel,
.cnx8-ui #STLoggedUserMenu .dijitMenuItem td.dijitMenuItemLabel {
  padding: 10px 20px 8px 5px !important;
}
.cnx8-ui #stStatusArea_dropdown.dijitMenuPopup .dijitMenuActive .dijitMenuItemHover td,
.cnx8-ui .dijitMenuPopup #STLoggedUserMenu.dijitMenuActive .dijitMenuItemHover td{
    background: var(--color-main-hover-background);
    border-left: 0px !important;
    text-align: left;
}
.cnx8-ui #stStatusArea_dropdown.dijitMenuPopup .dijitMenuTable,
.cnx8-ui .dijitMenuPopup #STLoggedUserMenu.dijitMenuTable {
  padding: 0px;
}

/* Start Share Menu Item for Connections on pages */
.extension-menu-item-img {
  width: unset !important;
  height: 24px !important;
}
[dir='ltr'] .extension-menu-item {
  padding-left: 12px !important;
  padding-right: 12px !important;
  padding-top: 5px !important;
  padding-bottom: 5px !important;
}
[dir='ltr'] .share-menu-item-top, [dir='ltr'] .share-menu-item {
  padding-left: 16px !important;
  padding-right: 12px !important;
  padding-top: 5px !important;
  padding-bottom: 5px !important;
}
.cnx8-ui .share-menu-item-top-img, .cnx8-ui .share-menu-item-img {
  height: 18px !important;
}
/***************End Share Menu Item for Connections on pages **********/

.cnx8-ui.app-blogs.has-banner #lotusFrame {
  margin-top: -18px !important;
}
/* CNX-32884: [Community Blogs]Need some spacing between action menus and tags control */
.cnx8-ui.app-blogs.has-banner.app-communities #lotusFrame{
  margin-top: 0 !important
}

.cnx8-ui.app-blogs .lotusColLeft:after {
  display: none !important;
}
/* CNX-32233: [Forums]Missing line-spacing between login message and topic display */
.app-forums.cnx8-ui #contentArea #topicList .lotusBtnContainer {
  position: relative;
  float: none;
}

/*********************** BEGIN CNX8CR4-iFix for Communities **********************/
/* These are the Layouts to support:                                             */
/*  2 Columns with side menu            --> .cl-2columnLayout                    */
/*  3 Columns with side menu            --> .cl-3columnLayout                    */
/*  3 Columns with side menu and banner --> .cl-3columnLayoutWithBanner          */
/*  3 Columns with top menu             --> .cl-3columnsTopMenuLayout            */
/*  3 Columns with top menu and banner  --> .cl-3columnsWithBannerTopMenuLayout  */
/* top menu ones have to hide left navigation  */
/* left menu ones have to show left navigation */

/* Community icon hover effect is wrong here*/
.cnx8-ui.lotusui30 .lotusColLeft .lotusMenu li a,
.cnx8-ui.lotusui30 .lotusColLeft .lotusMenu li a:hover,
.cnx8-ui.lotusui30 .lotusColLeft .lotusMenu li a:focus,
.cnx8-ui.lotusui30 .lotusColLeft .lotusMenu li a:active,
.cnx8-ui.lotusui30 .lotusColLeft .lotusMenu li a:visited
{
  border-color: transparent !important;
  border-top-width: 0px !important;
  border-bottom-width: 0px !important;
}

/* show "Applications:" label in normal font-weight */
.cnx8-ui.lotusui30 .lotusColLeft .lotusMenu .comm-dropdown-label
{
  font-weight: normal;
}

/* show entries in Application nav menu in normal font weight */
.cnx8-ui.lotusui30 .lotusColLeft .lotusMenu div#dropdownNavMenuContainer div#dropdownNavMenu li a,
.cnx8-ui.lotusui30 .lotusColLeft div#dropdownNavMenuContainer div#dropdownNavMenuTitle li.lotusSelected a,
.cnx8-ui.lotusui30 .lotusColLeft .lotusMenu div#dropdownSubMenuContainer div#dropdownSubMenu li a,
.cnx8-ui.lotusui30 .lotusColLeft div#dropdownSubMenuContainer div#dropdownSubMenuTitle li.lotusSelected a
{
  font-weight: normal;
}

/* show collapsed menu with white background */
.cnx8-ui.lotusui30 .lotusColLeft div#dropdownNavMenuContainer div#dropdownNavMenuTitle li.lotusSelected a,
.cnx8-ui.lotusui30 .lotusColLeft div#dropdownNavMenuContainer div#dropdownNavMenuTitle li.lotusSelected a:hover,
.cnx8-ui.lotusui30 .lotusColLeft div#dropdownSubMenuContainer div#dropdownSubMenuTitle li.lotusSelected a,
.cnx8-ui.lotusui30 .lotusColLeft div#dropdownSubMenuContainer div#dropdownSubMenuTitle li.lotusSelected a:hover
{
  background-color: white !important; /* need to override blogs.css important */
}

/* make Application menus selected entry not flicker when opening the dropdown */
.cnx8-ui.lotusui30 .lotusColLeft div#dropdownNavMenuContainer div#dropdownNavMenuTitle li a:focus,
.cnx8-ui.lotusui30 .lotusColLeft div#dropdownSubMenuContainer div#dropdownSubMenuTitle li a:focus
{
  border-width: 1px;
}

/* display left column in forums */
.cnx8-ui.app-communities.app-forums #lotusMain:not([role="tabpanel"]) .lotusColLeft,
.cnx8-ui.app-communities.app-forums #lotusMain:not([role="tabpanel"]) #lotusColLeft
{
  display: unset !important;
}

/* Show left navigation for Layouts with left nav */
.cnx8-ui.app-blogs.cl-2columnLayout .lotusMain div#lotusColLeft, /* show left Navigation in Blogs */
.cnx8-ui.app-blogs.cl-3columnLayout .lotusMain div#lotusColLeft, /* show left Navigation in Blogs */
.cnx8-ui.app-blogs.cl-3columnLayoutWithBanner .lotusMain div#lotusColLeft, /* show left Navigation in Blogs */
.cnx8-ui.app-communities.app-forums .lotusMain #lotusColLeft .vcomm.X-community-display-inline, /* show left Navigation in Forums */
.cnx8-ui.app-communities.app-forums .lotusMain #lotusColLeft .vcomm.X-community-display-inline .lotusMenu, /* show left Navigation Menu in Forums */
.cnx8-ui.app-communities.app-wikis .wiki-content .lotusMain #lotusColLeft .vcomm.X-community-display-inline /* show left Navigation in Wikis */
{
  display: block !important;
}

/* hide left navigation for Layouts with top nav*/
.cnx8-ui.app-blogs .lotusMain[role="tabpanel"] div#lotusColLeft, /* hide left Navigation in Blogs */
.cnx8-ui.app-blogs.cl-3columnsTopMenuLayout .lotusMain[role="tabpanel"] div#lotusColLeft, /* hide left Navigation in Blogs */
.cnx8-ui.app-blogs.cl-3columnsWithBannerTopMenuLayout .lotusMain[role="tabpanel"] div#lotusColLeft, /* hide left Navigation in Blogs */
.cnx8-ui.app-communities.app-forums .lotusMain[role="tabpanel"] #lotusColLeft .vcomm.X-community-display-inline, /* hide left Navigation in Forums */
.cnx8-ui.app-communities.app-forums .lotusMain[role="tabpanel"] #lotusColLeft .vcomm.X-community-display-inline .lotusMenu, /* hide left Navigation Menu in Forums */
.cnx8-ui.app-communities.app-wikis .wiki-content .lotusMain[role="tabpanel"] #lotusColLeft .vcomm.X-community-display-inline /* hide left Navigation in Wikis */
{
  display: none !important;
}

/* adjust left col for forums */
.cnx8-ui.app-forums .lotusMain #lotusColLeft
{
  position: relative;
}

/* adjust left col to top */
.cnx8-ui.app-forums #lotusMain.lotusMain,
.cnx8-ui.app-communities #lotusMain.lotusMain
{
  overflow: visible !important;
}

/* adjust community avatar when left nav is visible*/
.cnx8-ui.app-communities:not(.app-forums) .lotusMain:not([role="tabpanel"]) #lotusColLeft
{
  margin-top: -120px !important;
}

.cnx8-ui.app-communities.app-moderation.cl-2columnLayout .lotusMain:not([role="tabpanel"]) #lotusColLeft,
.cnx8-ui.app-communities.app-moderation.cl-3columnLayout .lotusMain:not([role="tabpanel"]) #lotusColLeft,
.cnx8-ui.app-communities.app-moderation.cl-3columnLayoutWithBanner .lotusMain:not([role="tabpanel"]) #lotusColLeft
{
  margin-top: -90px !important;
  position: relative !important;
}

.cnx8-ui.app-communities.app-moderation.lotusui30 .lotusInlinelist li {
  border: none;
}

.cnx8-ui.app-communities.app-moderation ul#communityActions.lotusActions li a[role="button"] {
  font-size: var(--font-size-medium) !important;
}

/* remove padding in left Nav*/
.cnx8-ui.lotusui30 #lotusMain
{
  padding: 0;
}

/* adjust margin in left col*/
.cnx8-ui.app-blogs #lotusMain #lotusColLeft,
.cnx8-ui.app-wikis #lotusMain #lotusColLeft,
.cnx8-ui.app-communities #lotusMain #lotusColLeft
{
  margin: 0 10px 0 0;
}

.cnx8-ui.app-blogs.cl-3columnLayoutWithBanner #lotusMain #lotusColLeft,
.cnx8-ui.app-communities.app-blogs.cl-3columnLayoutWithBanner #lotusMain #lotusColLeft

{
  margin-top: -116px !important; /* overriding blogs:main.css#593*/
}

/* vertically center left nav for Wikis*/
.cnx8-ui.app-wikis .wiki-content .lotusMain #lotusColLeft #sideNav
{
  padding-left: 10px;
  padding-right: 10px;
}

/* make page links in Wikis left nav column fill entire column */
.cnx8-ui.app-wikis .wiki-content .lotusMain #lotusColLeft #sideNav .lotusNavTree
{
  padding-right: 0;
}

/* adjust menu entries more to the left in activities details left nav */
.cnx8-ui.app-activities .lotusMenu li,
.cnx8-ui.app-activities .lotusMenu li.lotusSelected,
.cnx8-ui.app-activities .lotusMenu li:hover,
.cnx8-ui.app-activities .lotusMenu li:active,
.cnx8-ui.app-activities .lotusMenu li.lotusSelected:hover,
.cnx8-ui.app-activities .lotusMenu li.lotusSelected:active
{
  padding-left: 0px !important;
  background-color: transparent !important; /* overriding main.css#848 */
}

.cnx8-ui.app-communities.app-blogs .lotusMenu li a,
.cnx8-ui.app-communities.app-blogs .lotusMenu li.lotusSelected a,
.cnx8-ui.app-communities.app-blogs .lotusMenu li:hover a,
.cnx8-ui.app-communities.app-blogs .lotusMenu li:active a,
.cnx8-ui.app-communities.app-blogs .lotusMenu li.lotusSelected:hover a,
.cnx8-ui.app-communities.app-blogs .lotusMenu li.lotusSelected:active a
{
  background-color: transparent !important;

}

.cnx8-ui.app-blogs.lotusui30_fonts #lotusFrame #lotusColLeft .lotusMenu .lotusInner .lotusMenuSection li.lotusSelected a,
.cnx8-ui.app-blogs.lotusui30_fonts #lotusFrame #lotusColLeft .lotusMenu .lotusInner .lotusMenuSection li.lotusSelected a strong,
.cnx8-ui.app-activities.lotusui30_fonts .ActivityNavPanel.lotusMenu li.lotusSelected a,
.cnx8-ui.app-activities.lotusui30_fonts .ActivityNavPanel.lotusMenu li.lotusSelected a span
{
  font-weight: bold !important; /* overriding main.css#838*/
  font-style: italic;
}

.cnx8-ui.app-blogs.app-communities div#dropdownNavMenuContainer div#dropdownNavMenu li.lotusSelected,
.cnx8-ui.app-blogs.app-communities div#dropdownSubMenuContainer div#dropdownSubMenu li.lotusSelected
{
  background-color: #000;
}
.cnx8-ui.app-blogs.app-communities .lotusMenu li a
{
  color: #000;
}

.cnx8-ui.app-activities .ActivityNavPanel.lotusMenu li a,
.cnx8-ui.app-activities .ActivityNavPanel.lotusMenu li.lotusSelected a
{
  padding-left: 10px;
}

.cnx8-ui.app-communities.cl-2columnLayout #widget-container-col1,
.cnx8-ui.app-communities.cl-3columnLayout #widget-container-col1,
.cnx8-ui.app-communities.cl-3columnLayoutWithBanner #widget-container-col1
{
  margin-left: 10px;
  margin-right: -10px;
}

/* adjust menu entries more to the left in blogs left nav */
.cnx8-ui.app-communities.app-blogs .lotusMenu li a
{
  padding-left: 10px !important;
}

/* remove indenatation form currently selected menu entry in blogs left nav*/
.cnx8-ui.app-blogs .lotusMenu li a::before
{
  display: none;
}

/* remove top border from Community Avatar link in left nav*/
.cnx8-ui.lotusui30 .lotusMenu li a,
.cnx8-ui.lotusui30 .lotusMenu li a:active,
.cnx8-ui.lotusui30 .lotusMenu li a:focus,
.cnx8-ui.lotusui30 .lotusMenu li a:hover,
.cnx8-ui.lotusui30 .lotusMenu li a:visited,
.cnx8-ui.lotusui30 .lotusColLeft .lotusMenu li a:hover
{
  border-top-width: 0px !important;
}

/* blogs left nav menu entries hover color needs to be black (and remain untouched for other apps) */
.cnx8-ui.app-blogs div#dropdownNavMenu li a:hover,
.cnx8-ui.app-blogs div#dropdownSubMenu li a:hover
{
  color: #000 !important;
}

/* remove extra space at bottom in subcommunities opened menu */
.cnx8-ui.lotusui30 #lotusColLeft .lotusMenu #dropdownSubMenuContainer #dropdownSubMenu .lotusMenuSection
{
  margin: 0;
  padding: 0;
}

/* make menu entries hover effect consistent in all menu entries */
.cnx8-ui.lotusui30 #lotusColLeft .lotusMenu #dropdownNavMenuContainer li a:hover,
.cnx8-ui.lotusui30 #lotusColLeft .lotusMenu #dropdownSubMenuContainer li a:hover
{
  color: #ffffff !important;
  background-color: #000000 !important;
}

/* remove hover effcet on community avatar in blogs */
.cnx8-ui.app-blogs #lotusColLeft .lotusMenu li.lconnCommLogo a:hover
{
  background-color: transparent !important;
}

/* set size of Community(App) title in banner */
.cnx8-ui .lotusFrame .lotusPlaceBar .lotusRightCorner .lotusInner h2 .comNavInline
{
  font-size: var(--font-size-xlarge) !important;
  font-weight: var(--font-weight-medium);
}


/*** BEGIN style scrollbars in Communities                                 ***/
.cnx8-ui.app-wikis ::-webkit-scrollbar, /* the scrollbar in wikis */
.cnx8-ui.app-files ::-webkit-scrollbar, /* the scrollbar in files */
.cnx8-ui .lotusStyledScroll::-webkit-scrollbar /* the scrollbar in files */
{
  width: 10px !important;
  background: var(--color-scrollbar) !important;
  border-radius: 0 !important;
}

.cnx8-ui.app-wikis ::-webkit-scrollbar-thumb, /* the scrolling handle that can be dragged */
.cnx8-ui.app-files ::-webkit-scrollbar-thumb, /* the scrolling handle that can be dragged */
.cnx8-ui .lotusStyledScroll::-webkit-scrollbar-thumb /* the scrolling handle that can be dragged */
{
  background: var(--color-scrollbar-thumb) !important;
  border-radius: 0 !important;
}

.cnx8-ui.app-wikis ::-webkit-scrollbar-thumb:hover, /* the scrolling handle that can be dragged */
.cnx8-ui.app-files ::-webkit-scrollbar-thumb:hover, /* the scrolling handle that can be dragged */
.cnx8-ui .lotusStyledScroll::-webkit-scrollbar-thumb:hover /* the scrolling handle that can be dragged */
{
  background: var(--color-scrollbar-thumb-hover) !important;
}

.cnx8-ui.app-wikis ::-webkit-scrollbar-track, /* progress bar (where thumb scrolls on) */
.cnx8-ui.app-files ::-webkit-scrollbar-track, /* progress bar (where thumb scrolls on) */
.cnx8-ui .lotusStyledScroll::-webkit-scrollbar-track /* progress bar (where thumb scrolls on) */
{
  border: initial !important;
  -webkit-border-radius: initial !important;
  border-radius: initial !important;
  background: initial !important;
}
/*** END style scrollbars in Communities                                   ***/


/* Set a border to left column */
.cnx8-ui.app-communities.app-blogs #lotusColLeft,
.cnx8-ui.app-forums #lotusColLeft,
.cnx8-ui.app-wikis #lotusColLeft
{
  border-right: 0px solid var(--color-third-navigation-border) !important;
}

/*** ***/
/* reposition leftNav resizable handle in Wikis */
.cnx8-ui.app-wikis .lotusResizable {
    cursor: col-resize;
    margin-left: -10px!important;
    transition: background-color var(--hover-transition-fast);
}

/* let the hover fade in */
.cnx8-ui.app-wikis .lotusResizableHover {
    transition: background-color var(--hover-transition-fast);
}


/*** BEGIN Community Actions:                                              ***/
/* show blogs community actions without wrap */
.cnx8-ui.app-blogs #lotusContent .lotusPlaceBar.displayInline
{
  width: fit-content;
}

/* Actions font size */
.cnx8-ui ul#communityActions.lotusActions li a[role="button"]
{
  font-size: var(--font-size-large);
}
/* Actions font size for Wikis */
.cnx8-ui.app-blogs ul#communityActions.lotusActions li a[role="button"],
.cnx8-ui.app-forums ul#communityActions.lotusActions li a[role="button"],
.cnx8-ui.app-wikis ul#communityActions.lotusActions li a[role="button"],
.cnx8-ui.wikis ul#communityActions.lotusActions li a[role="button"]
{
  font-size: var(--font-size-large) !important;
}

/* show blogs community actions in normal font-weight */
.cnx8-ui.app-blogs #lotusContent .lotusPlaceBar.displayInline .lotusInlinelist li a
{
  font-weight: normal !important;
}
/* END Community Actions                                                     */


/* hide communities link in title bar */
.cnx8-ui.app-activities.app-communities #activitiesBanner #activitiesTitleBar .lotusTitleBar2 .lotusHeading .lotusText,
.cnx8-ui.app-activities.app-communities #activitiesBanner #activitiesTitleBar .lotusTitleBar2 .lotusInner .lotusTitleBarContent,
.cnx8-ui .lotusCommunities .lotusTitleBar2 .lotusHeading .top_nav_link
{
  display: none;
}


/* Highlights warning message on Overview Page */
.cnx8-ui.app-communities .lotusWidget2 .lotusMessage2.lotusWarning
{
  background-color: #fcfcfc !important;
  border: 1px solid #d3d3d3 !important;
  flex-direction: row;
  align-items: flex-start;
  padding: 2px !important;
}

.cnx8-ui.app-communities .lotusWidget2 .lotusMessage2.lotusWarning .lotusIcon
{
  vertical-align: top;
}
.cnx8-ui.app-communities .lotusWidget2 .lotusMessage2.lotusWarning .lotusMessageBody
{
  flex: 50%;
}

/* Fix Overview layout*/

/* hide unneccesary footer pseudo block */
.communities-widget-appearance .cnx8-ui .lotusWidget_2columnLayout #lotusFooter::after,
.communities-widget-appearance .cnx8-ui .lotusWidget_2columnLayout::after,
.communities-widget-appearance .cnx8-ui .lotusWidget_3columnLayout #lotusFooter::after,
.communities-widget-appearance .cnx8-ui .lotusWidget_3columnLayout::after,
.communities-widget-appearance .cnx8-ui .lotusWidget_3columnLayoutWithBanner #lotusFooter::after,
.communities-widget-appearance .cnx8-ui .lotusWidget_3columnLayoutWithBanner::after
{
  display: none;
}

/* show banner as comm-header to correctly wrap */
.communities-widget-appearance .cnx8-ui .lotusWidget_2columnLayout > div:first-of-type,
.communities-widget-appearance .cnx8-ui .lotusWidget_3columnLayout > div:first-of-type,
.communities-widget-appearance .cnx8-ui .lotusWidget_3columnLayoutWithBanner > div:first-of-type
{
  grid-area: comm-header;
}

/* hide potentially distorting empty block element in Footer*/
.cnx8-ui.lotusui30 .lotusFrame #removeBlankFooter
{
  display: none;
}

/* make left col transparent (i.e. white) */
.cnx8-ui.app-communities #lotusMain #lotusColLeft,
.cnx8-ui.app-communities.app-blogs #lotusMain #lotusColLeft,
.cnx8-ui.app-communities.app-blogs .lotusMenu li.lconnCommLogo a,
.cnx8-ui.app-communities.app-blogs .lotusMenu li.lconnCommLogo a:hover,
.cnx8-ui.app-communities.app-files .lotusMenu li.lconnCommLogo a,
.cnx8-ui.app-communities.app-files .lotusMenu li.lconnCommLogo a:hover
{
  background-color: transparent !important;
}

/* hide element for Forums subnavigation display fix */
.cnx8-ui.app-forums #lotusMain.lotusMain:not([role="tabpanel"]) .forumsActions
{
  position: absolute;
}

/* fix width of lotusContent element for forums to correctly position right col */
.cnx8-ui.app-forums #lotusContent.lotusContent
{
  width: unset;
}
/* fix top padding for left col in Forums */
.cnx8-ui.app-forums #lotusFrame #lotusColLeft
{
  padding-top: 30px;
}

/* fix horz scrolling of lotusMain due to extensive width if right cols tag Cloud Filter*/
.cnx8-ui.app-forums #lotusFrame #lconnTagCloudFilter #lconnTagCloudContent
{
  margin: 0;
}

/* Fix forum actions separators*/
.cnx8-ui.app-forums #lotusFrame #communityActions li
{
  margin-left: 0px;
  padding: 0 0 0 10px;
  border-left-color: #4178be;
  border-left-width: 1px;
}
.cnx8-ui.app-forums #lotusFrame #communityActions li:first-of-type
{
  margin-left: 0px;
  padding: 0 0 0 10px;
  border-left-color: transparent;
  border-left-width: 0;
}

/* show dropdown arrow at better position */
.cnx8-ui.app-forums #lotusFrame #communityActions li a img
{
  margin: 5px;
}


/* Activities left col in transparent */
.cnx8-ui.app-communities.app-activities .lotusColLeft
{
  background-color: transparent !important;
}

/* Activities*/
.cnx8-ui.app-activities .lotusColLeft div#dropdownNavMenuContainer div#dropdownNavMenuTitle li.lotusSelected,
.cnx8-ui.app-activities .lotusColLeft div#dropdownNavMenuContainer div#dropdownNavMenuTitle li,
.cnx8-ui.app-activities .lotusColLeft div#dropdownSubMenuContainer div#dropdownSubMenuTitle li.lotusSelected,
.cnx8-ui.app-activities .lotusColLeft div#dropdownSubMenuContainer div#dropdownSubMenuTitle li
{
  padding-left: 0 !important;
  padding-right: 0 !important;
}


.cnx8-ui.app-activities.app-communities.cl-2columnLayout .ActivityTitleBar.lotusPlaceBar,
.cnx8-ui.app-activities.app-communities.cl-3columnLayout .ActivityTitleBar.lotusPlaceBar,
.cnx8-ui.app-activities.app-communities.cl-3columnLayoutWithBanner .ActivityTitleBar.lotusPlaceBar
{
  margin-top: -29px;
}

.cnx8-ui.app-activities.app-communities.cl-2columnLayout .ActivityTitleBar.lotusPlaceBar #communityActionBarContainer ul,
.cnx8-ui.app-activities.app-communities.cl-3columnLayout .ActivityTitleBar.lotusPlaceBar #communityActionBarContainer ul,
.cnx8-ui.app-activities.app-communities.cl-3columnLayoutWithBanner .ActivityTitleBar.lotusPlaceBar #communityActionBarContainer ul
{
  padding-bottom: 3px;
}

.cnx8-ui.app-activities.app-communities.cl-3columnLayoutWithBanner #activitiesTitleBar,
.cnx8-ui.app-activities.app-communities.cl-3columnLayout #activitiesTitleBar,
.cnx8-ui.app-activities.app-communities.cl-3columnLayoutWithBanner #activitiesTitleBar
{
  _display: none;
}

.cnx8-ui.app-activities.app-communities.cl-2columnLayout .ActivityTitleBar.lotusPlaceBar #lotusPlaceBar-Title,
.cnx8-ui.app-activities.app-communities.cl-3columnLayout .ActivityTitleBar.lotusPlaceBar #lotusPlaceBar-Title,
.cnx8-ui.app-activities.app-communities.cl-3columnLayoutWithBanner .ActivityTitleBar.lotusPlaceBar #lotusPlaceBar-Title
{
  margin-top: -30px;
}

.cnx8-ui.app-activities.app-communities.cl-2columnLayout #activitypage .lotusColLeft,
.cnx8-ui.app-activities.app-communities.cl-3columnLayout #activitypage .lotusColLeft,
.cnx8-ui.app-activities.app-communities.cl-3columnLayoutWithBanner #activitypage .lotusColLeft
{
  margin-top: -25px;
}


/* show left col in Start an Activity View */
.cnx8-ui.app-activities.app-communities.cl-2columnLayout #commActFormColLeft.lotusColLeft,
.cnx8-ui.app-activities.app-communities.cl-3columnLayout #commActFormColLeft.lotusColLeft,
.cnx8-ui.app-activities.app-communities.cl-3columnLayoutWithBanner #commActFormColLeft.lotusColLeft
{
  display: block;
}

.cnx8-ui.app-activities.app-communities.cl-3columnsTopMenuLayout #activitiesMain.lotusFrame #activitiesBanner #activitiesTitleBar #tabNavBar #lotusPlaceBar.lotusPlaceBar.ActivityTitleBar,
.cnx8-ui.app-activities.app-communities.cl-3columnsWithBannerTopMenuLayout #activitiesMain.lotusFrame #activitiesBanner #activitiesTitleBar #tabNavBar #lotusPlaceBar.lotusPlaceBar.ActivityTitleBar
{
  display: block !important;
}

/*  2 Columns with side menu            --> .cl-2columnLayout                    */
/*  3 Columns with side menu            --> .cl-3columnLayout                    */
/*  3 Columns with side menu and banner --> .cl-3columnLayoutWithBanner          */

.cnx8-ui.app-blogs.cl-2columnLayout .cnx8_lotusFrame .lotusContent #pagePlaceBar .lotusRightCorner,
.cnx8-ui.app-blogs.cl-3columnLayout .cnx8_lotusFrame .lotusContent  #pagePlaceBar .lotusRightCorner,
.cnx8-ui.app-blogs.cl-3columnLayoutWithBanner .cnx8_lotusFrame .lotusContent #pagePlaceBar .lotusRightCorner
{
  padding: 0;
}

.cnx8-ui.app-blogs.cl-2columnLayout .cnx8_lotusFrame .lotusContent #pagePlaceBar .lotusRightCorner .lotusInner .blogsWrapText.bidiAware,
.cnx8-ui.app-blogs.cl-3columnLayout .cnx8_lotusFrame .lotusContent  #pagePlaceBar .lotusRightCorner .lotusInner .blogsWrapText.bidiAware,
.cnx8-ui.app-blogs.cl-3columnLayoutWithBanner .cnx8_lotusFrame .lotusContent #pagePlaceBar .lotusRightCorner .lotusInner .blogsWrapText.bidiAware
{
  display: block;
  margin: 0;
  top: 0;
}

.cnx8-ui.app-blogs.cl-2columnLayout #tertiary_level_nav,
.cnx8-ui.app-blogs.cl-3columnLayout #tertiary_level_nav,
.cnx8-ui.app-blogs.cl-3columnLayoutWithBanner #tertiary_level_nav
{
  display: none;
}

.cnx8-ui.cl-2columnLayout #search-result-wrapper #tertiary_level_nav,
.cnx8-ui.cl-3columnLayout #search-result-wrapper #tertiary_level_nav,
.cnx8-ui.cl-3columnLayoutWithBanner #search-result-wrapper #tertiary_level_nav
{
  display: revert;
}

.cnx8-ui.cl-2columnLayout #lotusFrame.searchFrame,
.cnx8-ui.cl-3columnLayout #lotusFrame.searchFrame,
.cnx8-ui.cl-3columnLayoutWithBanner #lotusFrame.searchFrame
{
  border-top: 50px solid transparent;
}
.cnx8-ui.cl-2columnLayout #lotusFrame.searchFrame #pagePlaceBar,
.cnx8-ui.cl-3columnLayout #lotusFrame.searchFrame #pagePlaceBar,
.cnx8-ui.cl-3columnLayoutWithBanner #lotusFrame.searchFrame #pagePlaceBar,
.cnx8-ui.cl-2columnLayout #lotusFrame.searchFrame .lotusPlaceBar *,
.cnx8-ui.cl-3columnLayout #lotusFrame.searchFrame .lotusPlaceBar *,
.cnx8-ui.cl-3columnLayoutWithBanner #lotusFrame.searchFrame .lotusPlaceBar *
{
  display: none !important;
}
.cnx8-ui.cl-2columnLayout #lotusFrame.searchFrame #search-result-wrapper #tertiary_level_nav,
.cnx8-ui.cl-3columnLayout #lotusFrame.searchFrame #search-result-wrapper #tertiary_level_nav,
.cnx8-ui.cl-3columnLayoutWithBanner #lotusFrame.searchFrame #search-result-wrapper #tertiary_level_nav
{
  margin-top: -50px;
}
.cnx8-ui.cl-2columnLayout #lotusFrame.searchFrame #search-result-wrapper #searchDetails,
.cnx8-ui.cl-3columnLayout #lotusFrame.searchFrame #search-result-wrapper #searchDetails,
.cnx8-ui.cl-3columnLayoutWithBanner #lotusFrame.searchFrame #search-result-wrapper #searchDetails
{
  margin-top: 20px !important;
}

/* Blogs body as grids */
body.cnx8-ui.app-blogs.cl-2columnLayout,
body.cnx8-ui.app-blogs.cl-3columnLayout,
body.cnx8-ui.app-blogs.cl-3columnLayoutWithBanner
{
  display: grid;
  grid-template-areas:
    'banner banner banner'
    'header header header'
    'menu main itm';
}

.cnx8-ui.app-blogs.cl-2columnLayout #lotusFrame,
.cnx8-ui.app-blogs.cl-3columnLayout #lotusFrame,
.cnx8-ui.app-blogs.cl-3columnLayoutWithBanner #lotusFrame
{
  height: 100vh;
}

.cnx8-ui.app-blogs #lotusFrame.cnx8_lotusFrame {
  min-height: calc(100vh
      - var(--top-navigation-banner-height)
      - var(--top-navigation-height)
      - var(--tertiary-level-nav-height)) !important;
  height: calc(100vh - var(--top-navigation-banner-height)
      - var(--top-navigation-banner-height)
      - var(--top-navigation-height)
      - var(--tertiary-level-nav-height)) !important;
  overflow-y: auto;
}

/* make Activities left nav scrollable when screen height requires it */
.cnx8-ui.app-activities.app-communities.cl-2columnLayout .lotusFrame #activitypage .lotusColLeft,
.cnx8-ui.app-activities.app-communities.cl-3columnLayout .lotusFrame #activitypage .lotusColLeft,
.cnx8-ui.app-activities.app-communities.cl-3columnLayoutWithBanner .lotusFrame #activitypage .lotusColLeft
{
  overflow-x: hidden;
  overflow-y: auto;
  margin-top: 0;
  margin-right: 0;
}

/* show main Activity Area without margins*/
.cnx8-ui.app-activities.app-communities.cl-2columnLayout .lotusFrame #activitypage,
.cnx8-ui.app-activities.app-communities.cl-3columnLayout .lotusFrame #activitypage,
.cnx8-ui.app-activities.app-communities.cl-3columnLayoutWithBanner .lotusFrame #activitypage
{
  margin-top: 0;
  padding-top: 0;
}

.cnx8-ui.app-activities.app-communities .lotusFrame #activitypage .lotusColLeft .lconnCommLogo:hover,
.cnx8-ui.app-activities.app-communities .lotusFrame #activitypage .lotusColLeft .lconnCommLogo:focus
{
  background-color: transparent !important; /* overrides main.css#853*/
}

.cnx8-ui.app-activities.app-communities .app-activities .lotusMenuSubsection {
  padding-left: 0 !important; /* overrides main.css#863*/
  margin-left: 0 !important; /* overrides main.css#863*/
}

.cnx8-ui.app-activities.app-communities.cl-2columnLayout .lotusFrame #activitypage .lotusColLeft #actPageCommCard .X-community-display-inline .personinlinemenu .lotusMenu,
.cnx8-ui.app-activities.app-communities.cl-3columnLayout .lotusFrame #activitypage .lotusColLeft #actPageCommCard .X-community-display-inline .personinlinemenu .lotusMenu,
.cnx8-ui.app-activities.app-communities.cl-3columnLayoutWithBanner .lotusFrame #activitypage .lotusColLeft #actPageCommCard .X-community-display-inline .personinlinemenu .lotusMenu
{
  padding-left: 0 !important; /* overides main.css#73*/
  padding-right: 0 !important; /* overides main.css#73*/
}
.cnx8-ui.app-activities.app-communities.cl-2columnLayout .lotusFrame #activitypage .lotusColLeft #actPageCommCard .X-community-display-inline .personinlinemenu .lotusMenu ul,
.cnx8-ui.app-activities.app-communities.cl-3columnLayout .lotusFrame #activitypage .lotusColLeft #actPageCommCard .X-community-display-inline .personinlinemenu .lotusMenu ul,
.cnx8-ui.app-activities.app-communities.cl-3columnLayoutWithBanner .lotusFrame #activitypage .lotusColLeft #actPageCommCard .X-community-display-inline .personinlinemenu .lotusMenu ul
{
  margin-left: 0 !important; /* overides main.css#859*/
  margin-right: 0 !important; /* overides main.css#859*/
}

/* fix main grid on Firefox */
body.cnx8-ui.app-metrics,
body.cnx8-ui.app-moderation,
body.cnx8-ui.app-blogs,
body.cnx8-ui.app-profiles,
body.cnx8-ui.app-homepage,
body.cnx8-ui.app-activities
{
  grid-template-rows: auto auto auto auto !important; /* overrides ui.css#239 */
}

/* Forums title */
.cnx8-ui.app-forums.cl-2columnLayout #lotusMain .forumsActions .lotusPlaceBar .lotusRightCorner h2,
.cnx8-ui.app-forums.cl-3columnLayout #lotusMain .forumsActions .lotusPlaceBar .lotusRightCorner h2,
.cnx8-ui.app-forums.cl-3columnLayoutWithBanner #lotusMain .forumsActions .lotusPlaceBar .lotusRightCorner h2
{
  top: 0;
}

.cnx8-ui.app-forums.cl-2columnLayout #lotusMain .forumsActions .lotusPlaceBar .lotusRightCorner h2,
.cnx8-ui.app-forums.cl-3columnLayout #lotusMain .forumsActions .lotusPlaceBar .lotusRightCorner h2,
.cnx8-ui.app-forums.cl-3columnLayoutWithBanner #lotusMain .forumsActions .lotusPlaceBar .lotusRightCorner h2
{
  float: none;
}
.cnx8-ui.app-forums.cl-2columnLayout #lotusMain .forumsActions .lotusPlaceBar .lotusRightCorner #communityActions,
.cnx8-ui.app-forums.cl-3columnLayout #lotusMain .forumsActions .lotusPlaceBar .lotusRightCorner #communityActions,
.cnx8-ui.app-forums.cl-3columnLayoutWithBanner #lotusMain .forumsActions .lotusPlaceBar .lotusRightCorner #communityActions
{
  float: none;
}

.cnx8-ui.app-forums.cl-2columnLayout #lotusMain,
.cnx8-ui.app-forums.cl-3columnLayout #lotusMain,
.cnx8-ui.app-forums.cl-3columnLayoutWithBanner #lotusMain
{
  display: grid;
  grid-template-areas:
    'comm-nav comm-title comm-title'
    'comm-nav forum-main forum-rc' !important;
  grid-template-rows: 100px 1fr;
  grid-template-columns: 240px auto 375px;
  gap: 20px;
}

.cnx8-ui.app-forums.cl-2columnLayout #lotusMain .forumsActions,
.cnx8-ui.app-forums.cl-3columnLayout #lotusMain .forumsActions,
.cnx8-ui.app-forums.cl-3columnLayoutWithBanner #lotusMain .forumsActions
{
  grid-area: comm-title;
  position: relative !important;

}

.cnx8-ui.app-forums.cl-2columnLayout #lotusMain .forumsActions .lotusRightCorner,
.cnx8-ui.app-forums.cl-3columnLayout #lotusMain .forumsActions .lotusRightCorner,
.cnx8-ui.app-forums.cl-3columnLayoutWithBanner #lotusMain .forumsActions .lotusRightCorner,
.cnx8-ui.app-forums.cl-2columnLayout #lotusMain .forumsActions .lotusRightCorner h2,
.cnx8-ui.app-forums.cl-3columnLayout #lotusMain .forumsActions .lotusRightCorner h2,
.cnx8-ui.app-forums.cl-3columnLayoutWithBanner #lotusMain .forumsActions .lotusRightCorner h2
{
  margin: 20px 0 0 0;
  padding: 0;
}

.cnx8-ui.app-forums.cl-2columnLayout #lotusMain #lotusColRight,
.cnx8-ui.app-forums.cl-3columnLayout #lotusMain #lotusColRight,
.cnx8-ui.app-forums.cl-3columnLayoutWithBanner #lotusMain #lotusColRight
{
  grid-area: forum-rc;
  margin: 0;
}

.cnx8-ui.app-forums.cl-2columnLayout #lotusMain #lotusColLeft,
.cnx8-ui.app-forums.cl-3columnLayout #lotusMain #lotusColLeft,
.cnx8-ui.app-forums.cl-3columnLayoutWithBanner #lotusMain #lotusColLeft
{
  grid-area: comm-nav;
  padding: 30px 0 0 0;
  margin: 0;
}

.cnx8-ui.app-forums.cl-2columnLayout #lotusMain .lotusContent,
.cnx8-ui.app-forums.cl-3columnLayout #lotusMain .lotusContent,
.cnx8-ui.app-forums.cl-3columnLayoutWithBanner #lotusMain .lotusContent
{
  grid-area: forum-main;
  margin: 0 !important;
  padding: 0 !important;
}

/* outline left col menu dropdowns */
.cnx8-ui.cl-2columnLayout .lotusColLeft div#dropdownNavMenuContainer div#dropdownNavMenuTitle,
.cnx8-ui.cl-3columnLayout .lotusColLeft div#dropdownNavMenuContainer div#dropdownNavMenuTitle,
.cnx8-ui.cl-3columnLayoutWithBanner .lotusColLeft div#dropdownNavMenuContainer div#dropdownNavMenuTitle,
.cnx8-ui.cl-2columnLayout .lotusColLeft div#dropdownSubMenuContainer div#dropdownSubMenuTitle,
.cnx8-ui.cl-3columnLayout .lotusColLeft div#dropdownSubMenuContainer div#dropdownSubMenuTitle,
.cnx8-ui.cl-3columnLayoutWithBanner .lotusColLeft div#dropdownSubMenuContainer div#dropdownSubMenuTitle
{
  transition: border-bottom-color 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
  border-bottom: 1px solid rgba(0, 0, 0, 0.42) !important;
}

.cnx8-ui.cl-2columnLayout .lotusColLeft div#dropdownNavMenuContainer div#dropdownNavMenuTitle #dropdownNavMenuIcon,
.cnx8-ui.cl-3columnLayout .lotusColLeft div#dropdownNavMenuContainer div#dropdownNavMenuTitle #dropdownNavMenuIcon,
.cnx8-ui.cl-3columnLayoutWithBanner .lotusColLeft div#dropdownNavMenuContainer div#dropdownNavMenuTitle #dropdownNavMenuIcon,
.cnx8-ui.cl-2columnLayout .lotusColLeft div#dropdownSubMenuContainer div#dropdownSubMenuTitle #dropdownSubMenuIcon,
.cnx8-ui.cl-3columnLayout .lotusColLeft div#dropdownSubMenuContainer div#dropdownSubMenuTitle #dropdownSubMenuIcon,
.cnx8-ui.cl-3columnLayoutWithBanner .lotusColLeft div#dropdownSubMenuContainer div#dropdownSubMenuTitle #dropdownSubMenuIcon
{
  background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGNsYXNzPSJNdWlTdmdJY29uLXJvb3QgTXVpU2VsZWN0LWljb24iIGZvY3VzYWJsZT0iZmFsc2UiIHZpZXdCb3g9IjAgMCAyNCAyNCIgYXJpYS1oaWRkZW49InRydWUiIHJvbGU9InByZXNlbnRhdGlvbiI+PHBhdGggZD0iTTcgMTBsNSA1IDUtNXoiLz48L3N2Zz4=);
  background-position: -5px -5px;
  background-size: 150%;
}

.cnx8-ui.cl-2columnLayout .lotusColLeft div#dropdownNavMenuContainer:hover div#dropdownNavMenuTitle,
.cnx8-ui.cl-2columnLayout .lotusColLeft div#dropdownNavMenuContainer:active div#dropdownNavMenuTitle,
.cnx8-ui.cl-2columnLayout .lotusColLeft div#dropdownNavMenuContainer:focus div#dropdownNavMenuTitle,
.cnx8-ui.cl-2columnLayout .lotusColLeft div#dropdownNavMenuContainer:focus-within div#dropdownNavMenuTitle,
.cnx8-ui.cl-3columnLayout .lotusColLeft div#dropdownNavMenuContainer:hover div#dropdownNavMenuTitle,
.cnx8-ui.cl-3columnLayout .lotusColLeft div#dropdownNavMenuContainer:active div#dropdownNavMenuTitle,
.cnx8-ui.cl-3columnLayout .lotusColLeft div#dropdownNavMenuContainer:focus div#dropdownNavMenuTitle,
.cnx8-ui.cl-3columnLayout .lotusColLeft div#dropdownNavMenuContainer:focus-within div#dropdownNavMenuTitle,
.cnx8-ui.cl-3columnLayoutWithBanner .lotusColLeft div#dropdownNavMenuContainer:hover div#dropdownNavMenuTitle,
.cnx8-ui.cl-3columnLayoutWithBanner .lotusColLeft div#dropdownNavMenuContainer:active div#dropdownNavMenuTitle,
.cnx8-ui.cl-3columnLayoutWithBanner .lotusColLeft div#dropdownNavMenuContainer:focus div#dropdownNavMenuTitle,
.cnx8-ui.cl-3columnLayoutWithBanner .lotusColLeft div#dropdownNavMenuContainer:focus-within div#dropdownNavMenuTitle,
.cnx8-ui.cl-2columnLayout .lotusColLeft div#dropdownSubMenuContainer:hover div#dropdownSubMenuTitle,
.cnx8-ui.cl-2columnLayout .lotusColLeft div#dropdownSubMenuContainer:active div#dropdownSubMenuTitle,
.cnx8-ui.cl-2columnLayout .lotusColLeft div#dropdownSubMenuContainer:focus div#dropdownSubMenuTitle,
.cnx8-ui.cl-2columnLayout .lotusColLeft div#dropdownSubMenuContainer:focus-within div#dropdownSubMenuTitle,
.cnx8-ui.cl-3columnLayout .lotusColLeft div#dropdownSubMenuContainer:hover div#dropdownSubMenuTitle,
.cnx8-ui.cl-3columnLayout .lotusColLeft div#dropdownSubMenuContainer:active div#dropdownSubMenuTitle,
.cnx8-ui.cl-3columnLayout .lotusColLeft div#dropdownSubMenuContainer:focus div#dropdownSubMenuTitle,
.cnx8-ui.cl-3columnLayout .lotusColLeft div#dropdownSubMenuContainer:focus-within div#dropdownSubMenuTitle,
.cnx8-ui.cl-3columnLayoutWithBanner .lotusColLeft div#dropdownSubMenuContainer:hover div#dropdownSubMenuTitle,
.cnx8-ui.cl-3columnLayoutWithBanner .lotusColLeft div#dropdownSubMenuContainer:active div#dropdownSubMenuTitle,
.cnx8-ui.cl-3columnLayoutWithBanner .lotusColLeft div#dropdownSubMenuContainer:focus div#dropdownSubMenuTitle,
.cnx8-ui.cl-3columnLayoutWithBanner .lotusColLeft div#dropdownSubMenuContainer:focus-within div#dropdownSubMenuTitle
{
  border-bottom: 2px solid #354958;
  transition: border-bottom-color 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
}

/*  Create Community Dialog without extra space on top                      */
.cnx8-ui.app-communities.view-community-create
{
  grid-template-areas:
    'banner banner banner'
    'header header header'
    'menu tertiary-nav itm'
    'menu main itm';
  grid-template-rows: auto auto auto 1fr;
}

.cnx8-ui.app-communities.view-community-create #lotusFrame
{
  grid-template:
        'comm-body'
        'comm-footer';
  grid-template-rows: 1fr auto;
  overflow-y: auto;
  overflow-x: auto;
}

.cnx8-ui.app-communities.view-community-create #lotusFrame > div:first-child
{
  display: none;
}

.cnx8-ui.app-communities.view-community-create #lotusFrame #lotusMain
{
  margin: 0;
}

.cnx8-ui.app-communities.view-community-create #lotusFrame #lotusMain #addCommunityTitle
{
  font-size: var(--font-size-xlarge) !important; /* overrides ui.css#379*/
  font-weight: var(--font-weight-header);
}
/* END Create Community Dialog without extra space on top                   */

/*  Show Blogs title top of view                                            */
.cnx8-ui.app-communities.app-blogs .lotusColLeft .lotusMenu
{
  margin: 0; /* overrules blogs.css#1206 - potential candidate to remove there */
}

.cnx8-ui.app-communities.app-blogs #lotusContent #pagePlaceBar .lotusInlinelist li a
{
  font-weight: var(--font-weight-normal) !important;
  font-size: var(--font-size-large) !important;
}

.cnx8-ui.app-communities.app-blogs #lotusContent #pagePlaceBar #communityActions
{
  margin: 0;
}

.cnx8-ui.app-communities.app-blogs #lotusContent > div.lotusLayout.lotusHeader.blogsWrapText
{
  overflow: visible;
}
.cnx8-ui.app-communities.app-blogs #lotusContent > div.lotusLayout.lotusHeader.blogsWrapText > h1
{
  font-weight: var(--font-weight-header) !important; /* overruling blogs.css#2451 */
}
/*  END Show Blogs title top of view                                        */

/*********************** END CNX8CR4-iFix for Communities ********************/

/* Community Layout fixes for right padding */
.cnx8-ui.app-communities .lotusContent,
.cnx8-ui.app-communities .lotusMain .lotusColRight {
  padding-right: 20px;
}
[dir="rtl"] .cnx8-ui.app-communities .lotusContent,
[dir="rtl"] .cnx8-ui.app-communities .lotusMain .lotusColRight {
  padding-left: 20px;
}

/* CNX-31993 [Moderation]: Loading spinner along with action name (Approving) is being displayed on pop up window while approving content */
.cnx8-ui.app-moderation .dijitDialog.dijitDialogFocused.dijitFocused .lotusDialogBorder form.lotusForm .lotusDialogFooter span.qkrStatus {
  display: none !important;
}

/* CNX-32442: [Communities]Remove the Communities link & left column outline from the Metrics, Moderation screen */
.cnx8-ui.app-metrics.app-communities .lotusTopNav h2.lotusHeading, .cnx8-ui.app-moderation.app-communities .lotusTopNav h2.lotusHeading {
  display: none;
}
.cnx8-ui.app-metrics.app-communities .metricsLotusMain #lotusColLeft {
  border-right: unset;
}
 /* CNX-32516 [Bookmarks]: No margin on My Updates Bookmarks screen */
.cnx8-ui.app-dogear .lotusColRight {
  margin-right: 30px;
  margin-left: 30px;
  padding-left: 0;
}

.app-moderation.app-communities.cnx8-ui #lotusTopNav {
  display: block !important; 
}
.app-moderation.app-communities.cnx8-ui.lotusui30 .lotusui30_layout .lotusColLeft {
  border-right: none;
}
.cnx8-ui.app-metrics .metricsLotusMain #lotusColLeft li.lconnCommLogo:hover {
  background-color: unset;
}