@import url('https://fonts.googleapis.com/css?family=Muli');
@import url('https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700');

/* ICONS */
@font-face {
  font-family: 'icomoon';
  src:  url('/framework/css/fonts/icomoon.eot?8nqx8');
  src:  url('/framework/css/fonts/icomoon.eot?8nqx8#iefix') format('embedded-opentype'), 
  url('/framework/css/fonts/icomoon.ttf?8nqx8') format('truetype'), 
  url('/framework/css/fonts/icomoon.woff?8nqx8') format('woff'), 
  url('/framework/css/fonts/icomoon.svg?8nqx8#icomoon') format('svg');
  font-weight: normal;
  font-style: normal;
}

[class^="icon-"]:before, [class*=" icon-"]:before {
  font-family: icomoon!important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;

  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

:root {
    /* Framework defaults */
    --black: #000;
    --ablack: #000;
    --dark: #333;
    --staywhite: white;
    --xwhite: #fff;
    --awhite: #fff!important;
    --primary: #1285ff;
    --primary-hover: #00A3fe;
    --primary-light: #E1F2FF;
    --primary-light-border: #d3ebff;
    --primary-very-light: #f0f7ff;
    --notice: #FFAD00;
    --warning: #F61F0D;
    --warning-hover: #d31204;
    --primary-color: #1285ff;
    --background-color: #f5f5f5;
    --hover-item: #fcfcfc;
    --extra-extra-light: #fafafa;
    --extra-light: #eaeaea;
    --light-plus: #d8d8d8;
    --icon-color: #757575;
    --common-grey: #e0e0e0;
    --placeholder1: #bdbdbd;
    --border-color: #8c8c8c;
    --border: #e0e0e0;
    --lt-text: #757575;
    --border-light: #eee;
    --lightgrey: lightgrey;
    --light-text: #8c8c8c;
    --very-light: #ececec;
    --selected-tab: #4f7294;
    --hovered-tab: #0e2a3e;
    --topbar-bg: #0e2a3e;
    --light: #dedddd;
    --good: #0AC24C;
    --white: white;
    --shadow: #d0d0d0;
    --note: #ffda767d;
    --fa: #fafafa;
    --f2: #f2f2f2;
    --77: #777777;

    /* Ontraport's CSS */
    --op-color: #1285ff;
    --op-color-triplet: 18, 133, 255;
    --op-color-light: #6cb4ff;
    --op-color-dark: #0059cb;
    --op-color-blue: #1285ff;
    --op-color-blue-dark: #0059cb;
    --op-color-link: var(--op-color-blue);
    --op-color-text-light: #bdbdbd;
    --op-color-text: #333;
    --op-color-text-dark: #000;
    --op-color-text-muted: #616161;
    --op-color-highlight-bg: #f0f7ff;
    --op-color-status-active: #7ccb20;
    --op-color-status-inactive: #bdbdbd;
    --op-color-icon: #777;
    --op-color-form-control-dark-background: #5e5e5e;
    --op-color-error-dark: #c21d02;
    --op-color-warning-dark: #fca332;
    --op-color-warning-light: #fff2b7;
    --op-color-warning-white: #fff;
    --op-color-bg-light: #fff;
    --op-color-bg-dark: #000;
    --op-color-gray-50: #fafafa;
    --op-color-gray-170: #f2f2f2;
    --op-color-gray-225: #e6e6e6;
    --op-color-gray-238: #eee;
    --op-color-gray-300: #e0e0e0;
    --op-color-gray-377: #ccc;
    --op-color-gray-700-legacy: #757575;
    --op-shadow-1: 0 1px 3px rgba(0 0 0 .25);
    --op-header-bar-height: 62px;
    --op-offset: 52px;
    --op-offset-small: 20px;
    --op-offset-medium: 33px;
    --op-button-padding: 13px 17px;
    --op-button-padding-small: 7px 12px;
    --op-form-control-padding: 10px;
    --op-form-control-height: 33px;
    --op-guttersize-width-large: 723px;
    --op-guttersize-width-medium: 1080px;
    --op-guttersize-width-small: 1280px;
    --op-editor-top-bar-height: 53px;
    --op-editor-full-header-height: calc(var(--op-header-bar-height) + var(--op-editor-top-bar-height));
    --op-loader-url: url(/images/loading-pages.gif);
    --op-progress-bar-light-color: #dcedc8;
    --op-progress-bar-dark-color: #7ecb20;
    --op-progress-bar-light-blue-color: #bbdefb;

  /* Will's new additions */
    --op-conversation-log-bg: #F9FDFF;
    --op-conversation-log-border: #DDE9EE;
}

:root.dark {
    --black: #fff;
    --ablack: black;
    --dark: white;
    --staywhite: white;
    --white: #121212!important;
    --xwhite: black;
    --warning: #c21d02;
    --warning-hover: #d31204;
    --background-color: #333!important;
    --border-light: #232323!important;
    --border: #333;
    --hover-item: var(
    --extra-light);
    --extra-light: #222;
    --extra-extra-light: #222;
    --common-grey: var(
    --border-light);
    --light-plus: #333;
    --icon-color: #999;
    --lightgrey: #333!important;
    --light-text: #8c8c8c;
    --lt-text: var(
    --light-text);
    --very-light: #111;
    --selected-tab: #4f7294;
    --hovered-tab: #0e2a3e;
    --topbar-bg: black;
    --light: #333;
    --good: #8BC34A;
    --shadow: #000000;
    --note: #ffda767d;
    --primary-light: #717171;
    --primary-light-border: #2e2e2e;
    --f2: #222;
    --fa: #131313;
    --primary-very-light: #1265ff15;
    --op-color-gray-50: #111111;
    --op-color-gray-170: #222222;
    --op-color-gray-225: #252525;
    --op-color-gray-300: #333333;
    --op-color-highlight-bg: #f0f7ff45;
    --op-conversation-log-bg: #515252;
    --op-conversation-log-border: #6b6b6b;
    --op-color-text-dark: #e0e0e0;
    --op-color-gray-238: #252525;
}


img {
  width: 100%;
}

/* Materialize Overrides */
.row:last-child {
    margin-bottom: 0px;
}


/* Custom Stylesheet */

nav ul a,
nav .brand-logo {
  color: var(--dark);
}

nav.main-nav {
    background-color: var(--xwhite);
    box-shadow: 0px 1px 2px var(--shadow);
    border-bottom: none;
}

nav ul li:hover {
    background-color: var(--primary);
}

h1, h2, h3, h4, h5, h6 {
    font-weight: 100!important;
    font-family: "Open Sans", sans-serif;
}

a.brand-logo img {
    max-width: 247px;
    margin-top: -22px;
    margin-left: -20px;
}

nav ul li:hover a {
    color: #ffffff;
}

.cke_wysiwyg_div {
    padding: 10px 0px!important;
}

p {
  line-height: 1.5rem;
  margin-top: 0px;
}

.changelog-item p {
    margin-bottom: 0px;
}

.button-collapse {
  color: var(--white);
}

.parallax-container {
  min-height: 380px;
  line-height: 0;
  height: auto;
  color: rgba(255,255,255,.9);
}
  .parallax-container .section {
    width: 100%;
  }

@media only screen and (max-width : 992px) {
  .parallax-container .section {
    position: absolute;
    top: 40%;
  }
  #index-banner .section {
    top: 10%;
  }
}

@media only screen and (max-width : 600px) {
  #index-banner .section {
    top: 0;
  }

  .modal {
    width: 100%;
    max-height: 100%!important;
    top: 0px!important;
  }

  .page-footer {
    position: relative!important;
  }
  .body {
    padding: 0px!important;
  }
  .body-container {
    /* padding-top: 63px; */
    /* vertical-align: top; */
    /* position: absolute; */
    /* top: 0px; */
    width: 100%;
  }

  .settings-section-wrapper .card {
      border-radius: 0px!important;
  }

  .profile-body {
      background-color: var(--xwhite);
  }

  .product-posts .list-header {
      padding-left: 30px;
      padding-right: 30px;
  }

  .the-posts .listing-item {
      /* border-top: 5px solid var(--extra-light); */
      border-radius: 0px!important;
      margin-bottom: 0px;
      margin-top: -2px;
      /* padding-left: 10px; */
      /* padding-right: 10px; */
  }

  .members-page .list-header {
      padding-left: 30px;
      padding-right: 30px;
      background-color: var(--xwhite);
  }

  .the-user-list .search-users input {
      background-color: var(--extra-light);
      color: var(--dark);
  }

  .body-container .sidebar {
      padding-left: 30px!important;
      padding-right: 30px!important;
  }

.body-container .group-page .sidebar {
    width: 100%;
    max-width: 100%;
    /* height: 190px!important; */
    display: inline-block;
    float: none;
    vertical-align: top;
}

.body-container .group-page {
    overflow-y: auto;
    height: calc(100vh - 66px);
}

.body-container .group-page .a-body {
    height: unset!important;
    vertical-align: top;
    width: 100%;
}

  .profile-page {
    padding-top: 0px!important;
    padding-bottom: 0px!important;
  }

  .row.settings-body ul.vertical-tabs {
    border-radius: 0px!important;
  }

  .settings {
    padding: 0px!important;
  }

  .settings .container {
    padding: 0px!important;
    width: 100%;
  }

  .settings-section-wrapper {
    border-radius: 0px!important;
  }

  .settings.account .settings-body > .m3 {
      padding-right: 0px!important;
  }

  .account .settings-section-wrapper {
      border-radius: 0px;
      background-color: var(--xwhite);
  }

  .disabled-users {
      padding-top: 30px;
  }

  .settings.account .container {
      margin-left: 0px;
      margin-right: 0px!important;
      width: 100%;
  }

  .team-settings-header {
      background-color: var(--xwhite);
      padding-left: 30px;
      padding-right: 30px;
      padding-top: 20px;
  }

  .team-settings-body {
      padding-top: 0px!important;
  }

  .settings.account {
    padding-top: 0px!important;
    padding-bottom: 0px!important;
  }

  body .settings-body > .s12.m3 {
    padding-right: 0px!important;
  }

  .team-settings-body .team {
      margin-bottom: 0px!important;
      background-color: var(--xwhite)!important;
  }

  .settings.account .container ul.vertical-tabs {
      border-radius: 0px!important;
      background-color: var(--xwhite);
  }

  .settings.account .container ul.vertical-tabs li {
      display: inline-block;
      margin-right: -4px;
  }

  body .account-info > .m6:first-child {
      padding-right: 0px!important;
  }

  .account-owners {
      margin-top: 20px;
      margin-bottom: 40px!important;
  }

  .social-login-providers .col {
    padding-right: 0px!important;
  }
  .row.login {
    padding: 20px;
  }

  .social-login-providers .icon-text:before {
    /* content: 'Log in with '; */
    text-transform: uppercase;
    font-family: Sofia Pro, sans-serif!important;
  }
  
  .responsive-page {
    display: none;
  }

  .responsive-page.open {
    display: block;
    position: fixed;
    top: 0px;
    left: 0px;
    width: 100%;
    background-color: var(--extra-light);
    height: 100%;
    box-sizing: border-box;
    z-index: 99999999999;
  }

  .mail {
    padding: 0px!important;
  }
  
  .messages .message-item-body {
    margin-left: 50px!important;
    position: relative;
  }

  .messages .message-item-meta .user-image {
    max-height: 32px!important;
    max-width: 32px!important;
    left: -5px;
  }
  
  .message .message-members {
    display: none!important;
  }
  
  .message-actions.go-back {
    display: block!important;
  }
  
  .message .message-body {
    height: calc(100vh - 160px)!important;
  }
  
  .mail .message-members {
    display: none;
  }

  .notification {
    display: none;
  }

  .notification.open {
    display: inline-block;
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    background-color: var(--extra-light);
    padding: 20px;
    height: 100%;
  }

  .notification.open .notification-nav-buttons {
    display: inline-block;
  }

  .notification-subject {
    white-space: inherit!important;
    width: 90%!important;
    padding-right: 10px;
  }

  .notification-actions .btn span {
    display: none!important;
  }

  a.brand-logo {
    width: 83px!important;
    line-height: 64px!important;
    margin-top: -2px;
    right: 0px!important;
    margin-right: 0px!important;
    left: unset;
    position: absolute!important;
    top: 0px;
    transform: none!important;
    margin-left: unset!important;
    padding: 0px!important;
    /* float: right; */
  }

  .side-nav li > a > i
  {
    margin-right: 0px!important;
  }
  
  .subscription-item {
    width: 100%!important;
    margin-right: 0px!important;
  }
  
  .account-page .account-billing .current-plan {
      padding-right: 0px!important;
      margin-bottom: 40px;
  }

  .profile-body .user-profile-image {
    padding-left: 30px!important;
    padding-top: 30px;
    background-color: var(--xwhite);
  }

  .user-profile-url.text-field {
      /* background-color: var(--xwhite)!important; */
      padding-left: 30px;
  }

  .pum-name {
    width: 100%!important;
  }

  .the-user-list .user > div {
    width: calc(100% - 70px)!important;
  }

  .the-user-list .user .user-image {
      display: inline-block;
      float: left;
  }

  .the-user-list .user-name > span {
      display: block;
      width: 100%;
      line-height: 1.5!important;
  }

  .the-user-list .user-name > .the-user-name {
      font-size: 12pt;
  }

  .the-user-list .user-name > .user-title {
      color: var(--icon-color);
  }

  .teams-page {
    padding: 30px 0px!important;
    /* overflow-y: auto; */
    background-color: var(--xwhite);
    /* height: calc(100vh - 66px); */
  }

  .team-section {
      margin-bottom: 5px!important;
      background-color: var(--xwhite)!important;
  }

  .teams-page .list-header {
      padding-left: 30px;
      padding-right: 30px;
  }

  .users-home {/* padding: 30px 0px; */background-color: var(--xwhite);}

  .members-page {
      padding: 30px 0px;
      background-color: var(--xwhite);
  }

  .dark .members-page, .dark .profile-page, .dark .teams-page, .dark .users-home {
      background-color: black!important;
      padding-top: 0px;
      padding-bottom: 0px;
  }

  nav ul {
      position: relative;
      height: 100vh;
  }

  body .users-home .main-content {
    padding-left: 0px!important;
  }

  .team-photos .team-member {
    padding-right: 0px!important;
    margin-bottom: 20px;
  }

  .team-photos .team-member:last-child {
      margin-bottom: 0px;
  }

  .teams-page .team-member .member-image {
    margin-right: 0px!important;
    right: -10px!important;
    min-height: 300px!important;
  }

  .user-profile-links {
    /* padding-left: 30px; */
    padding-top: 0px!important;
    /* padding-bottom: 30px; */
    background-color: var(--xwhite);
    padding-left: 0px!important;
    margin-top: 10px!important;
    margin-bottom: 0px!important;
  }

  body .user-profile-links > div, body .user-profile-links > div a {
      font-size: 10pt!important;
  }

  .user-profile-body.card {
      margin-bottom: 0px;
      border-radius: 0px!important;
  }

  .profile-sidebar-meta.icon-link {}

  .team-member-wrapper {
    width: 100%!important;
  }

  .profile-menu {
    margin-left: 0px!important;
    margin-right: 0px!important;
    margin-top: 30px;
    margin-bottom: 30px;
    width: 100%!important;
    border-radius: 0px!important;
  }

  .profile-menu .profile-menu-item {
      padding-left: 30px!important;
      padding-right: 30px!important;
  }

  .listing-item {
    margin-bottom: 5px!important;
    border-radius: 0px!important;
  }

  .profile-posts {
    background-color: var(--extra-light)!important;
  }

  .posts-create {
    border-top: 5px solid var(--extra-light)!important;
    margin-bottom: 0px!important;
    border-radius: 0px!important;
    border-bottom: 5px solid var(--background-color);
  }

  .users-home .main-content .the-posts {
    padding-top: 0px!important;
    max-width: 100%!important;
    width: 100%!important;
    padding-bottom: 0px!important;
  }

  .listing-items {
    background-color: var(--background-color)!important;
  }

  .listing-item-header, .post-footer, body .listing-description, .listing-description [data-oembed-url] {
      padding-left: 15px!important;
      padding-right: 15px!important;
  }

  .a-post .listing-item {
    margin-top: 0px!important;
  }

  .notifications-mobile {
    border-radius: 0px !important;
  }
}

.icon-block {
  padding: 0 15px;
}
.icon-block .material-icons {
  font-size: inherit;
}

footer.page-footer {
  margin: 0;
  bottom: 0;
  padding-top: 0;
  padding-left: 20px;
  padding-right: 20px;
}

a.brand-logo {
    font-size: 14pt!important;
    font-family: "Open sans", arial;
    padding-left: 20px!important;
    padding-right: 20px;
    display: inline-block;
    position: relative;
    vertical-align: top;
}
.loggedin a.brand-logo:hover .our {
    color: var(--primary);
}

.login, .register {
    margin: 0px auto 0px!important;
}

.register {
    max-width: 420px;
    text-align: center;
    margin: 50px auto 0px!important;
}

.login {
  max-width: 400px;
}

.body {
    background-size: cover;
    width: 100%;
    height: calc(100vh - 64px);
}

body {
    background-color: var(--op-color-gray-170);
    overflow: hidden;
    height: 100vh;
}

nav .dropdown-content {
    min-width: 250px;
    top: 64px!important;
    right: 0px!important;
    left: inherit!important;
    background-color: var(--xwhite);
}

.count {
    display: inline-block;
    background-color: transparent;
    border-radius: 20px;
    height: 22px;
    width: 22px;
    text-align: center;
    line-height: 1;
    color: var(--light);
    padding-top: 3px;
    font-weight: bold;
    margin-left: 0px;
    font-size: 9.5pt;
}

.dd-nav-heading {
    /* font-weight: 200; */
    /* font-size: 1.2rem; */
    /* font-family: Muli, arial, sans-serif; */
    background-color: var(--xwhite)!important;
    color: var(--primary)!important;
    padding-left: 15px;
    padding-right: 15px;
    box-sizing: border-box;
    /* display: flex; */
    cursor: pointer;
    max-height: 66px;
}

.dd-nh-text {
    height: 64px;
    line-height: 64px;
    font-size: 13pt;
    display: inline-block;
    text-align: left;
}

.dd-nh-icon i {white-space: normal;max-width: 30px;margin-right: 15px;line-height: 64px!important;height: 64px!important;}

#notifications, #messages {
    min-width: 420px;
}

.mn-user {
    display: inline-block;
    width: 13%;
    float: left;
    text-align: center;
}

.mn-message {
    display: inline-block;
    padding: 10px 10px 10px 0px;
    box-sizing: border-box;
    width: 72%;
}

.mn-time {
    display: inline-block;
    width: 11%;
    vertical-align: top;
    text-align: center;
    border-radius: 2px;
    margin-right: 3%;
}

.message-notification {
    border-bottom: 1px solid #E0E0E0;
}

.message-notification.selected {
    background-color: var(--extra-light)!important;
    color: var(--icon-color);
}

.message-notification.selected i {
    color: var(--white);
}

.message-notification:hover {
    background-color: var(--light);
    cursor: pointer;
}

.message-notification p:first-child {
    margin-top: 0px;
}

.message-notification p:last-child {
    margin-bottom: 0px;
}

.dropdown-content .message-notification:last-child {
    border-bottom: 0px;
}

.mn-message p, .mn-notification p, .mn-time p {
    line-height: 1.4rem;
}

.toast.dark {
    color: var(--white);
    background-color: #111!important;
    font-weight: bold;
}

.toast.warning {
    color: var(--white);
    background-color: #F44336!important;
    font-weight: bold;
}

.toast.white {
    color: var(--dark);
    background-color: var(--white)!important;
    font-weight: bold;
}

.page-footer {
    position: fixed;
    bottom: 0;
    width: 100%;
}

.mn-notification {
    padding: 10px 10px 10px 20px;
    max-width: 90%;
}

navigation .dropdown-button {
    cursor: pointer;
    /* border-left: 1px solid var(--extra-light); */
}

.mn-notifications-dismiss {
    box-sizing: border-box;
    margin-left: auto;
    text-align: center;
    padding: 0px;
    width: 10%;
    position: relative;
}

.mn-notifications-dismiss:hover {
    background-color: #db5461;
    color: var(--white);
}

.mn-created-date {
    font-size: 9.5pt;
}

.notification .mn-created-date {
    background-color: var(--white);
    cursor: pointer;
    border: 1px solid var(--extra-light);
}

.mn-notifications-dismiss i {
    color: var(--white);
    font-size: 1.7rem!important;
    position: absolute;
    top: calc(50% - 13px);
    width: 100%;
    left: 0;
    line-height: 1!important;
    margin: auto;
    height: 26px!important;
}

.dropdown-content .mn-notifications i {
    font-size: 9px!important;
}

.dropdown-content li > a, .dropdown-content li > span {
    color: var(--dark);
    padding-left: 20px;
    padding-right: 20px;
    text-decoration: none;
}

h1, h2, h3, h4, h5, h6 {
    font-weight: 300;
    margin-top: 0px;
}

nav ul li a {font-weight: 300;font-size: 11.5pt!important;}

.footer-copyright {
    color: var(--black)!important;
}

a {
    color: var(--primary);
    cursor: pointer;
}

a:hover {
    text-decoration: underline;
}

.two .card {
    width: 50%;
    display: inline-block;
    margin: 0px;
    float: left;
}

.users-home .card:last-child {
    margin: 0;
}

.card {
    margin-top: 0px;
    margin-bottom: 50px;
    background-color: var(--white);
    box-shadow: none;
    border: 1px solid var(--common-grey);
}

nav a {
    text-decoration: none!important;
}

.top-menu-item {
    display: inline-block;
    float: left;
}

ul.notifications {
    margin: 0px;
}

ul.notifications {
    max-height: calc(100vh - 128px);
    overflow-y: auto;
}

.mn-wrapper {
    width: 100%;
    display: flex;
}

.nav-wrapper .notifications li {
    box-sizing: border-box;
}

.notifications-home .message-notification {
    background-color: var(--white);
    display: inline-block;
    padding: 0px;
    width: 100%;
}

.message-notification.selected i, .message-notification:hover i {
    color: var(--white);
}

.dropdown-content li.message-notification:hover, .message-notification:hover {
    background-color: var(--extra-light);
}

.message-notification .mn-notifications-dismiss:hover i {
    color: var(--white);
}

.card-header {
    display: block;
    width: 100%;
    padding: 0px 0px 20px;
}

.card-title {
}

.card-actions {
    display: inline-block;
    vertical-align: top;
    float: right;
}

.socialLogins.dialog {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 500px;
    display: flex;
    background-color: var(--white);
    z-index: 999;
}

.socialLogins.dialog iframe {
  width: 100%;
  height: 100%;
}

.btn.facebook,
.btn.facebook:hover {
    background-color: #3b5998;
}

.btn.twitter,
.btn.twitter:hover {
    background-color: #00aced;
}

.btn.linkedin,
.btn.linkedin:hover {
    background-color: #007bb6;
}

.btn.google,
.btn.google:hover {
    background-color: var(--primary);
}

.icon-google:before {
  content: "\ea8b";
}
.icon-facebook:before {
  content: "\ea90";
}
.icon-twitter:before {
  content: "\ea96";
}
.icon-linkedin:before {
  content: "\eaca";
}

.register .social-login-providers {
  padding: 0px 15px 10px;
}

.social-login-providers {
  text-align: center;
  padding-top: 0px;
  padding-bottom: 10px;
}

.social-login-providers .btn {
    width: 100%;
    /* margin-bottom: 6px; */
    text-align: center!important;
    padding: 0px;
    min-width: 60px;
    font-size: 14px;
    display: inline-block;
    text-align: left;
    max-width: 180px;
    border-radius: 10px;
}

.social-login-providers a:nth-child(2n) .btn {
    margin-right: 0px!important;
}

.social-login-providers .btn:hover {
    opacity: 0.85;
    background-color: var(--primary)!important;
    color: var(--awhite)!important;
}

.social-login-providers .btn span:first-child {
    display: inline-block;
    text-align: left;
}

.card .title {
    /* padding: 10px; */
    color: var(--dark);
    font-size: 17px;
}

html .ontraport {
    font-family: 'Open Sans', sans-serif;
    font-size: 13px;
    font-weight: 600;
}

.login-form button {
    width: 100%;
    margin-top: 10px;
}

.login-form {
    /* padding: 30px; */
    background-color: var(--white);
    /* border: 1px solid var(--extra-light); */
    margin-top: 10px;
    display: inline-block;
    width: 100%;
}

.registration-form button {
    width: 100%;
    margin-top: 10px;
}

.social-login-providers .col {
    text-align: center;
}

.social-login-providers .col:last-child {
    padding-right: 0px;
}

.icon-text {
    font-size: 13px;
    vertical-align: top;
}

.row {
    margin-bottom: 0px;
    margin-left: 0px!important;
    margin-right: 0px!important;
}

.forgot-password, .go-back {
    text-align: center;
    margin-top: 10px;
    line-height: 1;
    display: inline-block;
}

nav ul .login-widget a {
  color: var(--icon-color);
  line-height: 1.5;
  padding: 0px;
}

nav ul .login-widget a:hover {
  color: #db5461;
}

nav ul .login-widget a:hover {
    background: none;
}

nav ul .forgot-password a:hover {
    background: none;
}

.login h3, .register h3 {
    margin-bottom: 5px;
}

.btn-large {
    font-size: 15px;
}

.registration-form {
    background-color: var(--white);
    margin-bottom: 30px;
    border: 1px solid var(--extra-light);
    padding: 30px;
    display: inline-block;
    width: 100%;
}

.card .card-body {
    padding: 20px 0px 0px;
}

.card-body {}

.empty-notifications {
    color: var(--icon-color);
    text-align: center;
    padding: 0px 20px 10px;
}

#login-widget {
    max-width: 400px!important;
    width: 100%!important;
    box-sizing: border-box;
    overflow: hidden;
}

.login-widget {
    padding: 30px 30px;
}

.login-widget .login-text {
    color: var(--icon-color);
    text-align: center;
}

.login-widget .login-form {
  padding: 0px;
  border: none;
  width: 100%;
  margin-top: -20px;
}

.login-widget form > p {
    margin-top: 20px;
    margin-bottom: 15px;
}

.login-widget form > p label {
    padding-left: 45px;
}

.login-widget .input-field input {
    border-bottom: 1px solid var(--icon-color)!important;
    width: calc(100% - 3rem);
    padding-left: 0px;
    color: var(--icon-color);
}

nav .input-field {
    display: inline-block;
    width: 100%;
}

.login-widget .input-field label.active {
    transform: translateY(-50%);
    /* color: var(--black); */
}


.notifications-page .card-header {
    background-color: #8aa29e;
    color: var(--white);
}

.notifications-page .card-header h4 {
    color: var(--white);
    margin-bottom: 0px;
}

.btn {
    /* box-shadow: 0px 2px 3px lightgrey!important; */
    padding: 0px 15px;
}

.btn:hover {
    box-shadow: 0px 2px 5px var(--shadow)!important;
}

.page-header {
    display: flex;
    width: 100%;
    padding: 15px 20px;
    position: fixed;
    margin-bottom: 0px;
    border-bottom: 1px solid var(--extra-light);
    /* box-shadow: 0px 2px 3px lightgrey; */
}

.page-actions, .sidebar-actions {
    align-items: flex-end;
    justify-content: flex-end;
    margin-left: auto;
}

.page-header h5 {
    margin-bottom: 0px;
    display: inline-block;
}

.page-sidebar {
    padding: 0px!important;
    height: calc(100vh - 64px);
    border-right: 1px solid var(--extra-light);
    background-color: var(--white);
}

.page {
    position: relative;
}

.page-content {
    padding: 20px!important;
}

.page-title .icon {
    display: inline-block;
    margin-right: 5px;
}

nav .input-field input {
    font-size: 1rem;
}

ul {
    margin: 0px;
}

.nav-wrapper.container {
    /* max-width: 100%; */
    /* width: 100%; */
    /* padding-left: 10px; */
}

.usermenu {
    margin-right: 0px;
}

.empty-content-message {
    display: block;
    width: 100%;
    margin: 50px auto;
    max-width: 50%;
    background-color: var(--background-color);
    padding: 7px 40px;
    border-radius: 100px;
    text-align: center;
    border: 1px solid var(--extra-light);
    color: var(--dark);
    line-height: 1;
}

.empty-content-message.linked {
    background-color: #db5461;
    cursor: pointer;
    opacity: 1;
}

.empty-content-message.linked:hover {
    opacity: .85;
}

.sidebar-header {
    border-bottom: 1px solid var(--extra-light);
    display: flex;
    vertical-align: middle;
    max-height: 60px;
    background-color: var(--background-color);
    height: 60px;
}

.sidebar-title h5 {line-height: 40px;color: var(--black);font-size: 14pt;/* font-weight: bold; */}

.sidebar-title {
    padding: 10px 20px;
    cursor: pointer;
}

.btn a {
    color: var(--white);
}

.sidebar-button {
    height: 59px;
    width: 60px;
    text-align: center;
    vertical-align: middle;
    cursor: pointer;
    color: var(--white);
    float: left;
    box-sizing: border-box;
    position: relative;
}

.sidebar-button:hover {
    background-color: var(--background-color);
    color: var(--white);
}

.mn-subject, .mn-text {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.dropdown-content .mn-notification {
    width: 85%;
}

nav ul li:hover {
    background-color: var(--primary);
}

nav ul a:hover {
    background-color: transparent;
}

nav ul li:hover a {
    color: var(--staywhite)!important;
}

nav.main-nav {
  position: fixed;
  width: 100%;
  z-index: 9999999;
  height: 64px;
  top: 0px;
}

.mn-subject {font-family: Sofia Pro Medium, sans-serif;}

.notification-subject {
    font-size: 24px;
    font-family: Sofia Pro, sans-serif;
    line-height: 1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 100%;
    display: inline-block;
}

.notification-headerbar {
    display: inline-block;
    margin-bottom: 10px;
    position: relative;
    width: 100%;
}

.notification-actions {
    margin-left: auto;
    z-index: 1;
    width: 100%;
    text-align: right;
}

.notification-actions > div i {
    float: left;
}

.notification-actions > div .btn-txt {
    display: inline-block;
    padding-top: 2px;
    padding-left: 5px;
}

.message-notification:hover .mn-wrapper i {
    color: var(--white);
}

.sidebar-button i {
    position: absolute;
    width: 100%;
    text-align: center;
    left: 0;
    top: calc(50% - 13px);
    height: 24px!important;
    line-height: 24px!important;
    font-size: 1.7rem!important;
    color: var(--icon-color);
}

.notification-text {
    background-color: var(--white);
    padding: 20px;
    border: 1px solid var(--extra-light);
    margin-bottom: 20px;
}

.mn-created-date i {
    float: left;
    margin-right: 5px;
    margin-left: -10px;
    border-radius: 50px;
    font-size: 2rem;
    line-height: 2rem;
}

nav a i {
    float: left;
    height: 64px!important;
    line-height: 64px!important;
}

.notification-nav-buttons {
    float: right;
    display: none;
}

.usermenu img {
    max-width: 44px;
}

.dd-nh-icon img {
    margin-top: 0px;
    height: 64px;
    padding: 0px;
}

.usermenu a {
    padding: 0px;
}

ul#notifications .sidebar-header {
    display: none;
}

.usermenu.dropdown-button, .usermenu.dropdown-button a {
    max-height: 64px!important;
    height: 100%;
}

.usermenu.dropdown-button a {
    padding: 10px;
    box-sizing: border-box;
    overflow: hidden;
}

.usermenu.dropdown-button img {
    opacity: .9;
    max-height: 64px;
    border-radius: 10px;
}

.usermenu.dropdown-button img:hover {
    opacity: 1;
}

#toast-container {
    bottom: 20px!important;
    left: 0px!important;
    top: initial;
    /* right: initial; */
    max-width: 520px;
    right: unset;
    text-align: left;
    float: left;
    z-index: 999999999999999999999999999999999999999999;
}

.toast {
    line-height: 16pt!important;
    padding: 20px 25px;
}

.social-login-providers > div {
    padding-right: 2px;
    padding-left: 2px;
}

.col {
    padding-left: 0px!important;
    padding-right: 0px!important;
}

.scheduler {
    padding: 20px;
}

.scheduler-toolbar {
    padding: 20px;
}

.the-scheduler .srow input {
    border-bottom: none!important;
}

.profile-page .bio-text {
    padding: 20px;
    margin-top: 50px;
}

.profile-page .bio-text .title {
    padding-left: 0px!important;
    display: none;
}

.sidebar-button.main {
    background-color: var(--primary);
    right: -1px;
}

.sidebar-button.main i {
    color: var(--white);
}

.user-list .user-image {
    width: 20%;
    max-width: 50px;
    max-height: 50px;
    margin-right: 5px;
    overflow: hidden;
    vertical-align: middle;
    /* border-radius: 50%; */
    display: inline-block;
}

.messages-page .user-list .user > div {
    display: inline-block;
    vertical-align: middle;
}

.messages-page .user-list .user-image
 img {
    width: 100%;
    height: 100%;
}

.messages-page .user-list
 .user {
    width: 100%;
    display: inline-block;
    vertical-align: top;
    font-size: 10pt;
    box-sizing: border-box;
    cursor: pointer;
    /* background-color: rgb(249, 248, 248); */
    /* border-bottom: 1px solid #f4f4f4; */
    padding: 5px 20px;
    transition: all .1s ease;
}

.messages-page .user-list
 .user:hover, .user-list
 .user.selected {
    background-color: #b1b9bf!important;
    /* color: white; */
}

.messages-page .user-list
 .user .user-name {
    text-align: center;
    overflow: hidden;
    font-size: 10pt;
    margin-left: 10px;
}

.messages-page .user-list
 .user:nth-child(5n) {
    margin-right: 0px;
}

.messages-page .user-list
 h5 {
    margin-bottom: 10px;
}

.section-title {
    font-weight: bold;
    margin-bottom: 4px;
}

.modal-content .user-search input {
    /* border: 1px solid lightgrey; */
    /* padding: 5px 10px; */
    /* margin-top: 10px; */
    box-sizing: border-box;
}

.message-footer {
    position: absolute;
    bottom: 0px;
    height: 105px;
    width: 100%;
    box-sizing: border-box;
    right: 0px;
    /* overflow: hidden; */
    border: 10px solid rgba(177, 185, 191, 0.41)!important;
    background-color: var(--white);
}

.message-footer .message-actions {
    float: right;
    width: 6%;
    padding: 0px;
}

.message-footer .message-actions .btn {
    /* height: 246px; */
    /* line-height: 99px; */
}

.message-footer textarea {
    padding: 5px 20px 0px 0px;
    font-size: 11pt!important;
    width: calc(100% - 70px);
    max-width: calc(100% - 70px)!important;
    height: 85px!important;
    max-height: 85px!important;
    border: none;
    overflow: auto;
    outline: none;
    box-sizing: border-box;
}

.message {
    position: relative;
    /* display: inline-block; */
    /* width: 100%; */
    height: calc(100vh - 64px);
}

.messages li {
    padding: 15px 0px 0px 0px;
    display: block;
    width: 100%;
    margin-top: 15px;
    border-top: 1px solid var(--extra-light);
}

.mail .messages li {
    padding: 0px;
}

.messages li:nth-child(2) {
    border-top: none;
    margin-top: 0px;
}

.messages li:first-child {
    margin-top: 0px!important;
    border-top: none;
}

.messages li.sameuser {
    border-top: none;
    padding: 0px;
    min-height: 0px;
    margin-top: 0px;
}

.messages li.sameuser:last-child {
    margin-bottom: 10px;
}

.messages li:last-child {
    border-bottom: none;
}

.messages li .user-image {
    max-width: 50px;
    max-height: 50px;
    overflow: hidden;
    display: inline-block;
    position: absolute;
    float: left;
    margin-left: 15px;
    margin-bottom: 15px;
    border-radius: 2px;
}

.mail .messages li .user-image {
}

.messages li .user-image img {
    width: 100%;
}

.message .message-header {
    position: absolute;
    left: 0px;
    top: 0px;
    height: 60px;
    max-height: 60px;
    background-color: var(--background-color);
    width: 100%;
    border-bottom: 1px solid var(--extra-light);
}

.message .message-body {
    position: absolute;
    top: 60px;
    /* display: inline-block; */
    width: 100%;
    height: calc(100vh - 225px);
    overflow: auto;
    background-color: var(--white);
}

.messages .message-item-body {
    margin-left: 80px;
    font-size: 11pt;
    position: relative;
    word-break: break-word;
}

.mail .message-item-body {
    padding-right: 20px;
    padding-bottom: 20px;
    padding-top: 20px;
}

.messages .message-item-body img {
    width: auto;
    max-width: 100%;
}

.messages .message-item-body iframe {
    margin-top: 5px;
    margin-bottom: 5px;
    max-width: 100%!important;
}

.messages .message-item-body .user-name {
    font-weight: 600;
}

.mail .messages .message-item-body .user-name {
    margin-bottom: 10px;
}

.messages-page .messages-home {
    /* height: calc(100vh - 64px); */
}

.message-footer .textarea-btn {
    position: absolute;
    bottom: 0;
    right: 0px;
    background-color: transparent;
    color: var(--icon-color);
    box-shadow: none!important;
    width: 40px;
    text-align: right;
}

.message-footer .textarea-btn.btn:nth-child(2n) {
    top: 40px;
}

.message-header-left {
    width: 33%;
    padding: 10px 15px!important;
}

.user-pic {
    height: 30px;
    width: 30px;
    display: inline-block;
    vertical-align: middle;
    margin-left: 1px;
    overflow: hidden;
    /* border-radius: 50%; */
}

.message-header-right {
    text-align: right;
    /* padding: 12px!important; */
}

.message-subject {
    font-weight: bold;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    width: 100%;
}

.mail .message-subject {
    padding-top: 10px;
    color: #0f0f0f;
}

.message-header .user-pic.more-button {
    border: 1px solid var(--extra-light);
    height: 61px;
    width: 60px;
    text-align: center;
    line-height: 78px;
    background-color: var(--background-color);
    color: var(--icon-color);
    cursor: pointer;
    margin-left: 0px;
}

.textarea-btn .btn {
    height: 40px;
    background: none!important;
    box-shadow: none!important;
    color: var(--icon-color);
    display: inline-block;
    width: 40px;
    text-align: center;
    vertical-align: middle;
    padding: 0px;
}

.textarea-btn .btn:hover {
    background-color: #db5461!important;
    color: white!important;
}

.message-items {
    box-sizing: border-box;
    height: calc(100vh - 124px);
    overflow-y: auto;
}

.message-items .message-name {
    padding: 10px 20px;
    width: 100%;
    display: inline-block;
    float: left;
}

.message-items .message-name > span {
    width: 100%;
    display: inline-block;
    line-height: 1;
}

.message-item {
    border-bottom: 1px solid var(--extra-light);
    cursor: pointer;
    display: inline-block;
    width: 100%;
    position: relative;
    margin-bottom: -6px;
}

.message-item:hover .message-updated {
    display: block;
}

.message-item:hover {
    background-color: var(--background-color);
}

.messages .date-created {
    color: var(--icon-color);
    font-size: 8pt;
    padding-left: 4px;
}

.mail .messages .date-created {
    float: right;
}

.modal-title {
    font-weight: bold;
}

.load-more-messages {
    text-align: center;
    padding: 10px!important;
    font-style: italic;
    margin-bottom: -10px!important;
    cursor: pointer;
}

.load-more-messages:hover {
    background-color: var(--background-color);
    color: #db5461;
}

#createMessage.modal {
    max-width: 480px;
    max-height: 100%;
    padding: 0px;
    background-color: var(--white);
    height: calc(100vh - 20%);
}

#createMessage.modal .modal-content {
    padding: 0px;
    display: inline-block;
    height: 100%;
    margin-bottom: -2px;
    position: relative;
    width: 100%;
}

#createMessage.modal .modal-content .subject input {
    padding-left: 20px;
    box-sizing: border-box;
    /* margin-bottom: 0px; */
    /* border-bottom: 0px; */
}

#createMessage .modal-header-content {padding-top: 20px;}

#createMessage .user-list {
    overflow-y: auto;
    display: inline-block;
    width: 100%;
}

#createMessage .input-field label {
    color: var(--black);
    padding-left: 20px;
}

#createMessage .user-list-search input {
    width: 100%;
    margin-left: 0px;
    padding-left: 20px;
    padding-bottom: 10px;
    padding-top: 10px;
    box-sizing: border-box;
    border-bottom: 1px solid var(--extra-light);
    border-top: 1px solid var(--extra-light);
    margin-bottom: 0px;
    height: 50px;
    background-color: var(--background-color);
    font-size: 10pt;
}

#createMessage .user-list-search input::placeholder {
    color: var(--black);
}

#createMessage .user-list-search input:focus {
    border-bottom: 1px solid var(--extra-light)!important;
    box-shadow: 0px 1px transparent!important;
}

#createMessage .user-list-search {
    background-color: var(--background-color);
    margin-top: 0px;
    border: none;
}

.user-list-search.input-field i {
    text-align: center;
    padding: 12px 0px;
    background-color: var(--background-color);
    height: 50px;
    border-top: 1px solid var(--extra-light);
    border-bottom: 1px solid var(--extra-light);
    position: absolute;
    right: 0px;
    width: 50px;
    padding-right: 10px;
}

#createMessage .input-field.subject {
    padding: 0px 20px 0px;
    /* margin-top: 0px; */
    margin-top: 0px;
}

#createMessage .modal-footer-content a {
    width: 100%!important;
    text-align: center;
    padding: 10px;
    height: 50px;
    background-color: #db5461;
    color: var(--white);
    font-weight: bold;
    text-decoration: none;
    display: inline-block;
    left: 0px;
    border-radius: 0px;
}

.message-members li {
    max-width: 30px;
    height: 30px;
    display: inline-block;
    margin-left: 1px;
    margin-top: 16px!important; */
}

.message-members li img {
    /* border-radius: 50%; */
}

.message-items .message-members {
    display: inline-block;
    width: 100%;
    max-width: 50%;
    height: 64px;
    text-align: right;
    vertical-align: top;
    position: absolute;
    right: 0px;
}

.messages-page .hidden {
    display: none;
}

.message-header-right ul {
    display: inline-block;
}

.message-header-right .message-actions {
    width: 50px;
    float: right;
    display: inline-block;
    text-align: center;
    padding: 15px 0px;
    background-color: var(--background-color);
    cursor: pointer;
}

.mail .message-header-right .message-actions {
    background-color: var(--white);
}

.message-actions.go-back {
    display: none;
  }

.message-header-right .message-actions:hover {
    /* background-color: #db5461; */
    /* color: var(--white); */
}

.message-item .message-updated-text {
    box-sizing: border-box;
    font-size: 10pt;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}

.message-item .message-updated {
    text-align: right;
    font-size: 10pt;
    padding-right: 3px;
    bottom: 13px;
    right: 0px;
    font-style: italic;
    background-color: var(--background-color);
    display: none;
    padding-left: 20px;
    width: auto!important;
    position: absolute;
}

.icon-emoticon {
    font-size: 14pt;
    color: #293a47;
}

.message-delete-item {
    position: absolute;
    left: -20px;
    top: 0px;
    color: var(--icon-color);
    cursor: pointer;
    display: none;
}

.message-item-body:hover .message-delete-item {
    display: block;
}

.message-delete-item i {
    font-size: 15pt;
    color: var(--icon-color);
}

.modal-close {
    /* z-index: 9999; */
}

img.emoji-img {
  max-width: 19px!important;
  margin-bottom: -4px;
}

.message-emoji-picker {
    float: left;
    width: 30px;
    text-align: center;
    padding-top: 5px;
}

.message-emoji-picker
 > i {
    margin-right: 0px;
}

.message-emoji-picker .emoji-popover {bottom: 0px!important;left: 35px!important;top: initial!important;width: 100%!important;border: 1px solid #e4e3e3;border-radius: 0px;padding: 0px;}

#createMessage .modal-footer-content {
    display: inline-block;
    width: 100%;
    box-sizing: border-box;
    position: absolute;
    bottom: 0px;
    left: 0px;
}

#pickusers {
    background-color: var(--white);
}

.emoji-popover .emoji-popover-title {
    background-color: var(--background-color);
    color: var(--black);
    border-radius: 0px;
}

#createMail {max-height: calc(100% - 65px)!important;/* height: 100%; */top: 65px!important;width: 100%!important;max-width: 1280px;}

#createMail .modal-content {
    width: 100%!important;
    /* height: 100%!important; */
    box-sizing: border-box;
}

.modal-close.top-m-close {
    position: absolute;
    right: 20px;
    top: 20px;
}

.modal-footer-content {
}

#createMail #users {
    margin-top: 61px;
    box-sizing: border-box;
    width: 100%;
}

.user-list .user-item {
    /* padding: 5px 10px; */
    border-bottom: 1px solid var(--extra-light);
    cursor: pointer;
}

.user-list .user-item:hover {
    background-color: var(--background-color);
}

.user-list .user-name {
    display: inline-block;
}

text-angular .btn-group {
    display: inline-block;
    width: auto;
    padding-right: 10px;
    float: left;
}

text-angular .btn {
    width: 40px;
    padding: 0px;
    margin-right: 2px;
    margin-bottom: 1px;
    cursor: pointer;
}

text-angular .ta-toolbar {
    display: inline-block;
    width: 100%;
}

text-angular #toolbarWC, text-angular #toolbarCC {
    display: none!important;
    width: auto;
    padding: 0px 10px;
}

text-angular .ta-scroll-window {
    border: 1px solid var(--extra-light)!important;
    height: calc(100vh - 430px)!important;
    overflow-y: auto!important;
    display: inline-block;
    width: 100%;
    box-shadow: none!important;
}

.mail-message text-angular ul li {list-style-type: initial!important;}

.mail-message text-angular ul {
    padding-left: 30px;
    padding-top: 5px;
    padding-bottom: 5px;
}

text-angular .ta-scroll-window > .ta-bind {
    padding: 10px;
}

text-angular .ta-scroll-window {
    background-color: var(--white);
}

#createMail .modal-footer-content {
    text-align: right;
}

text-angular textarea {
    /* padding: 10px; */
}

text-angular .btn {
    background-color: var(--light)!important;
    color: var(--dark)!important;
}

text-angular p {
    line-height: 1rem;
    margin-bottom: 8px;
}

text-angular .btn-group:first-child {
    display: none;
}

.user-search i {
    position: absolute;
    right: 5px;
    top: 7px;
}

.user-search input {
    padding-left: 10px;
    padding-right: 30px;
    margin-bottom: 0px;
    border-bottom: 1px solid var(--extra-light);
}

text-angular .btn.active {
    background-color: var(--background-color)!important;
    color: var(--white)!important;
}

.mail-recipient {
    max-width: 220px;
    max-height: 37px;
    width: auto;
    display: inline-block;
    margin-right: 5px;
    background-color: var(--white);
    box-shadow: 0px 1px 3px var(--shadow);
    padding: 4px;
}

.mail-recipient .user-image {
    max-width: 28px;
    max-height: 28px;
    /* margin-bottom: -2px; */
    display: inline-block;
    float: left;
    border-radius: 50%;
    overflow: hidden;
}

.mail-recipient .user-name {
    display: inline-block;
    width: auto;
    vertical-align: top;
    margin-top: 7px;
    margin-left: 10px;
    margin-right: 5px;
    float: left;
    font-size: 10pt;
}

.mail-recipient .remove-user {
    display: inline-block;
    color: var(--light);
    padding-top: 4px;
    cursor: pointer;
}

.mail-recipients {
    padding-left: 44px;
    width: 100%;
    position: absolute;
    z-index: 9;
}

.mail-recipients-list input {
    /* display: inline-block; */
    /* width: auto!important; */
    /* border-bottom: 0px; */
    /* margin-left: 0px!important; */
}

.input-field.mail-recipients-list {/* margin-top: 0px; */}

.mail-message {
    background-color: var(--white);
}

.mail-message p {
    margin-bottom: 2px;
}

.mail {
    padding: 20px;
    overflow-y: auto;
    height: calc(100vh - 64px);
    background-color: var(--background-color);
}

.mail .message-header {border-bottom: 1px solid var(--background-color);}

.mail .mail-reply {
    display: inline-block;
    width: 100%;
    position: relative;
    height: 70px;
    background-color: var(--background-color);
    margin-bottom: 0px;
    border-top: 1px solid var(--extra-light);
    line-height: 70px;
}

.mail .mail-reply .message-item-meta .user-image {
    margin-top: 10px!important;
    margin-bottom: 0px;
    line-height: 70px;
    padding: 0px;
    overflow: visible;
}

.mail .messages .user-pic {
    display: inline-block;
    margin-right: 1px;
    height: 100%;
    padding-top: 0px;
}

.mail .messages li:first-child {
    margin-top: 16px!important;
}

.mail .messages .user-pic .user-image {
    display: inline-block;
    position: relative;
    vertical-align: top;
    margin-left: 0px;
    margin-bottom: 0px!important;
    width: 30px!important;
    height: 30px!important;
}

.message-reply-item {
    display: inline-block;
    float: right;
    padding-right: 10px;
    padding-top: 6px;
}

.message-reply-item
 i {
    font-size: 16pt;
}

.mail .message-reply {
    width: 100%;
}

.mail .message-reply
 > div:first-child {
    margin-left: 80px;
    width: auto;
    display: inline-block;
}

.mail .message-item-meta .user-image {
    margin-top: 20px;
}

ul.main-menu-items {
    display: inline-block;
}

nav ul li a {
    transition: color .3s ease;
    padding-left: 20px;
    padding-right: 20px;
    color: var(--dark)!important;
    line-height: 64px;
    cursor: pointer!important;
    font-weight: 400;
}

.page-padding {
    padding: 40px 0px;
}

ul.tabs {
    background-color: var(--background-color);
    margin-top: 30px;
}

.tabs .tab a {
    text-decoration: none;
    font-weight: bold;
    color: var(--icon-color);
}

.tab-content {
    padding-top: 50px;
    display: inline-block;
    width: 100%;
}

.input-field {
    padding-right: 20px;
}

.social-name {
    font-size: 16pt;
}

.account-general .social-login-providers {
    display: inline-block;
    width: 100%;
    text-align: left;
}

.social-button {
    display: inline-block;
    /* min-width: 170px; */
}

.account-settings .social-login-providers {
    text-align: left;
}

.account-settings .checkbox-input {
    margin-bottom: 15px;
    display: inline-block;
    width: 100%;
}

.account-settings .checkbox-input:last-child {
    margin-bottom: 0px;
}

.account-settings .save-settings {
    margin-top: 50px;
}

td.user-image img {
    max-width: 40px;
}

.account-users table td:last-child, .account-users table th:last-child {
    text-align: right;
}

.add-user {
    /* float: right; */
    color: var(--primary);
    cursor: pointer;
    width: 100%;
    display: inline-block;
    padding-left: 6px;
}

.account-users-header {
    margin-bottom: 30px;
}

.account-users-header .title {
    /* font-size: 17pt; */
}

.top-of-page {
    background-color: var(--background-color);
    padding-top: 60px;
}

.dropdown-content li i {
    width: 25px!important;
}

.account-page .input-field
 label {
    left: 0px!important;
}

.subscription-item {
    padding: 20px!important;
    /* border: 1px solid var(--extra-light); */
    margin-bottom: -1px;
    cursor: pointer;
}

.subscription-item:hover,
 .subscription-item.selected {
    background-color: var(--background-color)!important;
}

.subscription-item .features {
    text-align: left;
    margin-bottom: 0px;
    margin-top: 10px;
}

.subscription-item .price:before {
    content: "$";
    margin-right: -5px;
}

.subscription-item .feature {
    list-style: disc;
    margin-left: 20px;
    margin-bottom: 4px;
}

.account-page .section {
    margin-bottom: 100px!important;
    display: inline-block;
    width: 100%;
}

.account-page .current-plan {
    padding-right: 30px!important;
}

.subscription-item .item-details {
    padding-left: 20px!important;
}

.subscription-item .title {
    font-size: 1.3rem;
}

.subscription-item .title,
 .subscription-item .price {
    display: inline-block;
}

.subscription-item .price {
    margin-left: 5px;
    float: right;
}

.social-login-card {
    margin: 0px auto;
    width: auto;
    float: none;
    text-align: center;
    max-width: 420px;
    background-color: var(--white);
    padding: 40px;
    /* margin-top: 120px; */
    border-radius: 10px;
    box-shadow: 0px 1px 3px var(--shadow);
}

.the-user-list .user .user-image {
    max-width: 40px;
    height: 40px;
    margin-bottom: 0px;
    margin-top: 5px;
    display: inline-block;
    float: left;
    margin-right: 29px;
    /* border-radius: 10px; */
    overflow: hidden;
}

.the-user-list .user {
    padding: 5px 20px;
    background-color: var(--xwhite);
    color: var(--dark);
    /* border-radius: 6px; */
    overflow: hidden;
    /* height: 65px; */
    line-height: 50px;
    display: block;
    width: 100%;
    cursor: pointer;
    margin-bottom: 0px;
}

.the-user-list .user .the-profile-image {
    border-radius: 6px!important;
}

.the-user-list .user > div {
    display: inline-block;
    width: 30.5%;
    font-size: 10.5pt;
}

.the-user-list .user:hover {
    background-color: var(--primary);
    color: var(--staywhite);
}

.the-user-list {
    max-width: 960px;
    margin: 0px auto;
    padding-top: 30px;
    /* padding-bottom: 40px; */
    /* height: calc(100vh - 66px); */
    /* overflow-y: auto; */
}

.the-user-list .user-name {
    font-size: 12pt;
}

navigation.nav-container {
    display: block;
    width: 100%;
    height: 0px;
    box-sizing: border-box;
    margin-bottom: 0px;
}

navigation.nav-container.main-nav {
    height: 64px;
}

.search-users input {
    margin-bottom: 30px!important;
    background-color: var(--xwhite);
    color: var(--dark);
    padding: 0px 20px;
    height: 50px;
    line-height: 50px;
    box-sizing: border-box;
    border-radius: 10px;
    border-bottom: 0px!important;
    /* box-shadow: 0px 1px 2px var(--shadow)!important; */
}

.user-list-header {
    background: var(--xwhite);
    color: var(--dark);
    padding: 10px 10px 10px 90px;
}

.user-list-header > .ulh-item {
    display: inline-block;
    /* float: left; */
    padding: 5px 0px;
    width: 32.5%;
    font-weight: bold;
}

.user-list-section {
    /* padding: 20px; */
    border-radius: 10px;
    overflow: hidden;
    display: inline-block;
    width: 100%;
    /* box-shadow: 0px 1px 2px var(--shadow); */
}

ul.vertical-tabs {/* box-shadow: 0px 1px 2px var(--shadow); */border-radius: 10px;overflow-y: auto;/* position: absolute; *//* width: calc(100% - 30px); */}

.settings-body > .col.m3 {
    position: relative;
    padding-right: 30px!important;
}

.vertical-tabs li {
    padding: 15px 20px;
    background-color: var(--xwhite);
    color: var(--dark);
    cursor: pointer;
}

.vertical-tabs li:hover {
    background-color: var(--primary);
    color: var(--white);
}

.vertical-tabs li.active {color: var(--primary);background-color: var(--xwhite);}

.settings-section-wrapper {
    padding: 0px 30px;
    border-radius: 10px;
    box-shadow: none;
    margin-bottom: 0px;
    /* background-color: var(--xwhite); */
}

.account .settings-section-wrapper {
    padding: 30px;
}

.account .team-settings .settings-section-wrapper {
    padding: 0px;
}

.account-user.user .image {
    max-width: 36px;
    height: 36px;
    border-radius: 10px;
    overflow: hidden;
    display: inline-block;
    float: left;
    margin-right: 20px;
}

.account-user.user {
    height: 40px;
    display: block;
    line-height: 40px;
    position: relative;
    margin-bottom: 5px;
    text-align: left;
}

.account-user.user .profile-image {
    max-width: 36px;
    display: inline-block;
    float: left;
    width: 100%;
    margin-right: 20px;
    border-radius: 5px;
}

.team-member.account-user.user {
    display: inline-block;
    width: 100%;
    margin-bottom: 0px;
    /* padding-top: 10px; */
    height: 50px;
    line-height: 50px;
}

.search-input .account-user.user {
    padding-left: 20px;
    padding-right: 20px;
    height: 50px;
    line-height: 50px;
    margin-bottom: 0px;
    cursor: pointer;
}

.search-input .account-user.user:hover {
    background-color: var(--primary);
    color: var(--white);
}

.search-input .account-user.user:hover .name {
    color: var(--white);
}

.search-input .account-user.user .image {
    margin-top: 5px;
}

.account-user.user .user-actions {
    position: absolute;
    top: 0px;
    right: 0px;
    line-height: 40px;
    bottom: 0px;
    height: 40px;
    cursor: pointer;
}

.account-user.user .user-actions .edit {
    opacity: 0;
    transition: opacity .4s ease-in-out;
}

.account-user.user:hover .user-actions .edit {
    opacity: 1;
}

.account-user.user .user-actions i {
    line-height: 40px;
    width: 40px;
    height: 40px;
    text-align: center;
    vertical-align: top;
}

.account-user.user .name {padding-right: 50px;color: var(--dark);}

.account-user-list {
    margin-bottom: 20px;
    display: inline-block;
    width: 100%;
    margin-top: 20px;
}

.account-users .account-user-list {
    margin-top: 0px;
    margin-bottom: 10px;
}

.team-members.account-user-list {
    margin-bottom: 0px;
    margin-top: 0px;
}

.team-members.account-user-list .dropdown-select {
    padding-left: 0px;
    padding-right: 0px;
    text-transform: initial;
}

.document-modal {
    position: fixed;
    top: 0px;
    right: 0px;
    bottom: 0px;
    left: 0px;
    background-color: var(--background-color);
    z-index: 99999;
    overflow-y: auto;
}

.document-modal .modal-card {
    max-width: 780px;
    margin: 100px auto 40px;
    padding: 30px;
    border-radius: 10px;
    box-shadow: 0px 1px 2px var(--shadow);
}

.sub-text {
    margin-bottom: 10px;
    font-size: 10pt;
    color: var(--dark);
}

.modal-title .sub-text {
    font-weight: normal;
}

.tab-wrapper {
    /* position: fixed; */
    /* width: calc(100% - 30px); */
}

.account-user-settings .search-users input {
    color: var(--dark)!important;
    margin-bottom: 0px!important;
    background-color: var(--background-color);
    border-bottom: 0px!important;
    box-shadow: none!important;
    padding-right: 20px;
    box-sizing: border-box;
}

.text-field input:focus {
    border-bottom: 0px!important;
    box-shadow: none!important;
}

.text-field .label {
    font-size: 10pt;
    font-weight: bold;
    margin-bottom: 4px;
    /* padding-left: 20px; */
}

.user-settings.m6:first-child {
    padding-right: 20px!important;
}

.text-field {
    margin-bottom: 20px;
    position: relative;
}

.modal-card > .row > .m6:first-child {
    padding-right: 20px!important;
}

.modal-button {
    padding: 10px 20px;
    display: inline-block;
    cursor: pointer;
    border: 1px solid var(--light);
    background-color: var(--white);
    margin-left: 10px;
    /* border-radius: 10px; */
}

.modal-button:first-child {
    margin-left: 0px;
}

.modal-button:hover {
    border-color: var(--dark);
}

.modal-button:last-child {
    background-color: var(--primary);
    color: var(--white);
    border-color: var(--primary);
}

.modal-button:last-child:hover {
    background-color: var(--primary);
    opacity: .9;
}

.modal-buttons {
    text-align: right;
}

.account-info > .m6:first-child {
    padding-right: 30px!important;
}

.account-user .delete {
    position: absolute;
    top: 0px;
    right: 0px;
    width: 40px;
    height: 40px;
    color: var(--icon-color);
    cursor: pointer;
}

.account-user .delete:hover {
    color: var(--warning);
}

.account-user .delete i {
    line-height: 40px;
    font-size: 15pt;
}

.settings-section-header.label {
    font-weight: bold;
}

.account-owners {
    display: inline-block;
    width: 100%;
    margin-bottom: 30px;
}

.account-info {
    /* padding-top: 10px; */
}

.account-user-settings {
    /* padding-top: 10px; */
}

.text-field.search-input i {
    position: absolute;
    top: 0px;
    right: 5px;
    height: 45px;
    width: 45px;
    line-height: 45px;
    cursor: pointer;
    text-align: center;
}

.search-input .account-users {
    position: absolute;
    width: 100%;
    background-color: var(--white);
    z-index: 99999;
    /* padding: 5px 20px 0px; */
    /* padding-bottom: 10px; */
    box-shadow: 0px 1px 2px var(--shadow);
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
    overflow-y: auto;
}

.account-info > .col.m6:last-child > div .sub-text {
    margin-bottom: 10px;
}

.text-field.search-input.selected {
    box-shadow: 0px 1px 2px var(--shadow);
}

.user-picker .text-field.search-input.selected {
    box-shadow: none!important;
    margin-bottom: 0px;
}

.users-home-page {
    /* max-width: 960px; */
    margin: 0px auto;
}

.users-home-page .label {
    font-weight: bold;
    color: var(--primary);
}

.users-home .users-top-section {
}

.users-home .users-top-section h5 {
    color: var(--primary);
}

.profile-body {
    max-width: 1000px;
    margin: 0px auto!important;
}

.profile-body .user-profile-image {
    position: relative;
    border-radius: 10px;
    width: calc(100% - 30px);
}

.profile-body .user-profile-image img {
    border-radius: 10px;
    box-shadow: 0px 1px 2px var(--shadow);
}

.user-profile-body.card {
    padding: 30px;
    border-radius: 10px;
    box-shadow: none;
}

.profile-user-meta.name {
    font-size: 21pt!important;
}

.profile-user-meta input {
    background-color: var(--background-color);
    border-bottom: 1px solid transparent;
    padding: 5px 20px;
    box-sizing: border-box;
    vertical-align: top;
    color: var(--dark);
    margin-bottom: 30px;
}

.profile-user-meta.name input {
    background-color: var(--background-color);
    color: var(--primary);
    padding-left: 0px;
    /* border-bottom: 1px solid var(--extra-light); */
}

body textarea {
    border: none;
    background-color: var(--background-color);
    color: var(--dark);
    padding: 20px;
    min-height: 100px;
    max-width: 100%;
    min-width: 100%;
}

.profile-user-meta ::placeholder {
    color: var(--icon-color);
}

.edit-profile-button i {font-size: 11pt;}

.pum-name {
    display: inline-block;
    width: 70%;
    color: var(--primary);
    font-size: 24pt;
}

body .btn.btn-transparent {
    background-color: transparent;
    color: var(--primary);
    box-shadow: none;
}

.btn.btn-transparent.disabled {
    background-color: transparent!important;
}

body .btn.btn-transparent:hover {
    background-color: var(--primary);
    color: var(--white);
}

.btn.btn-transparent.settings-back-button {
    background-color: var(--primary)!important;
    color: var(--white)!important;
    border-radius: 0px;
    float: left;
}

.btn.btn-transparent.settings-back-button i {
    font-weight: bold;
}

.user-profile-body .profile-user-meta.title {
    padding: 0px!important;
}

.profile-user-meta.about {
    margin-top: 20px;
    color: var(--dark);
    /* font-size: 10.5pt; */
}

.profile-user-meta textarea {
    background-color: var(--background-color);
    border-bottom: 1px solid transparent;
    padding: 15px 20px;
    box-sizing: border-box;
    min-height: 45px;
    height: 100%;
    margin-bottom: 30px;
    max-height: 100%;
}

.edit-profile .profile-user-meta.about {
    margin-top: 0px;
}

.list-header h5 {
    font-size: 21pt;
    color: var(--primary);
    margin-bottom: 3px;
    margin-top: -5px;
}

.profile-user-meta.video {
    margin-top: 20px;
}

.nav-wrapper .button-collapse {
    position: absolute;
    color: var(--primary);
    top: 0px;
    left: 0px;
    height: 64px;
}

.profile-sidebar-meta {
    /* color: var(--icon-color); */
    /* margin-top: 4px; */
    margin-bottom: 7px;
    font-size: 9pt;
}

.profile-sidebar-meta i {
    font-size: 13pt;
    margin-right: 8px;
}

.team-actions {
    text-align: right;
    position: relative;
}

.team-actions .add-team-member {
    display: inline-block;
    /* height: 36px; */
    /* line-height: 36px; */
    /* width: 40px; */
    /* text-align: center; */
}

.team-actions .btn {
    padding-left: 20px;
    padding-right: 20px;
}

.team-actions .add-team-member i {
    line-height: 36px;
    height: 36px;
    /* width: 36px; */
    text-align: center;
}

.team-settings-body .team {
    margin-bottom: 30px;
    background-color: var(--xwhite);
    padding: 30px;
    border-radius: 10px;
    /* box-shadow: 0px 1px 2px var(--shadow); */
}

.team-settings-body .team-name {
    font-size: 16pt;
    color: var(--dark);
}

.team-member .team-member-image {
    display: inline-block;
    max-width: 40px;
}

.team-member .team-member-image img {
    border-radius: 10px;
}

.team-members .team-member-name {}

body .switch label input[type=checkbox]:checked + .lever {
    background-color: var(--light);
}

body .switch label input[type=checkbox]:checked + .lever:after {
    background-color: var(--primary);
}

.login-text {
    color: var(--dark);
}

.login-text h4 {
    margin-bottom: 10px;
    margin-top: -5px;
}

.edit-profile-button .btn {
    height: 45px;
    line-height: 45px;
    /* margin-top: 5px; */
}

.team-sections {
    max-width: 960px;
    margin: 0px auto;
}

.teams-page .team-member .member-text {
    padding: 0px 0px;
    border-radius: 3px;
    width: 100%;
    color: var(
    --black);
}

.teams-page .team-member .member-text, .teams-page .team-member .member-text .about, .teams-page .team-member .member-text .started, .teams-page .team-member .member-text .title, .teams-page .team-member .member-text .name {
    /* transition: all .3s ease-in-out; */
}

.teams-page .team-member .member-text:hover {
    /* background-color: var(--primary); */
    /* color: var(--white)!important; */
    /* cursor: pointer; */
}

.teams-page .team-member .member-text:hover .about, .teams-page .team-member .member-text:hover .started, .teams-page .team-member .member-text:hover .title {/* color: var(--white); */}

.teams-page .team-member .member-text:hover {}

.teams-page .team-member .member-text .about {
    margin-top: 10px;
    font-size: 9pt;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3; /* number of lines to show */
    -webkit-box-orient: vertical;
    color: var(--dark);
}

.teams-page .team-member .member-image {
    /* max-width: 100px; */
    max-height: 120px;
    min-height: 120px;
    width: 100%;
    overflow: hidden;
    display: inline-block;
    /* float: left; */
    /* margin-right: 10px; */
    /* position: absolute; */
    /* padding-top: 20px; */
    top: 0px;
    right: 30px;
    background-size: 100%;
    background-position: center center;
    /* border-top-left-radius: 10px; */
    /* border-top-right-radius: 10px; */
    border-radius: 10px;
    /* border: 2px solid transparent; */
    transition: all .6s ease-in-out;
}

.teams-page .team-member-wrapper:hover .member-image {
    /* border-radius: 90px!important; */
    /* overflow: hidden; */
    /* border: 5px solid transparent; */
    /* background-position: bottom; */
    background-size: 106%;
}

.teams-page .team-member .member-image img {
    border-radius: 10px 10px 0px 0px;
    box-shadow: 0px 1px 2px black;
    /* margin-bottom: 10px; */
}

.member-text {
    /* padding: 10px 0px; */
    text-align: center;
    display: inline-block;
    vertical-align: top;
}

.member-text .name {
    font-weight: bold;
    font-size: 9pt;
}

.member-text .title, .member-text .started {
    font-size: 9pt;
    color: var(--dark);
    /* margin-bottom: 5px; */
}

.team-section > .name {
    font-size: 16pt;
    font-weight: 100;
    /* text-align: center; */
    color: var(--primary);
    /* border-bottom: 1px dashed var(--dark); */
    /* padding-bottom: 20px; */
    margin-bottom: 10px;
}

.team-section {
    padding: 30px 30px 30px;
    background-color: var(--xwhite);
    /* box-shadow: 0px 1px 2px var(--shadow); */
    margin-bottom: 50px;
    border-radius: 10px;
}

.team-section > .description, .team-section > .focus {
    /* font-size: 10pt; */
    margin-bottom: 10px;
}

.teams-page .list-header {
    max-width: 960px;
    margin: 0px auto!important;
    float: none!important;
    display: block;
    width: 100%;
}

h6 {
    font-size: 14pt;
}

.team-settings-body {
    /* border-radius: 10px; */
    /* overflow: hidden; */
    /* box-shadow: 0px 1px 2px var(--shadow); */
    /* background-color: var(--white); */
    padding-top: 10px;
}

.text-field input, .text-field textarea {
    margin-bottom: 0px;
    background-color: var(--background-color);
    border-bottom: none!important;
    padding-left: 20px;
    padding-top: 0px;
    padding-bottom: 0px;
    box-sizing: border-box;
    box-shadow: none!important;
    height: 50px;
    line-height: 50px;
}

.teams-page .team-member {
    /* position: relative; */
    /* padding-right: 20px!important; */
    /* margin-bottom: 10px; */
    text-align: center;
    /* background-color: var(--extra-light); */
    min-height: 190px!important;
}

.bottom-nav-fixed {
    /* position: absolute; */
    /* bottom: 0px; */
    /* left: 0px; */
    /* right: 0px; */
}

.team-actions .user-picker {
    min-width: 400px;
    right: 0px!important;
    top: 0px!important;
    left: unset!important;
    border-radius: 10px;
}

.team-actions .user-picker .text-field {
    margin-bottom: 0px;
}

.team-settings-header .btn-transparent {
    padding-right: 0px!important;
}

body .btn-transparent:hover {
    background-color: transparent!important;
    color: var(--black)!important;
    box-shadow: none!important;
}

.modal .modal-content {
    padding: 30px;
}

.modal .modal-content .text-field.input-field {
    margin-bottom: 5px!important;
}

.user-picker {
    min-width: 300px;
    border-radius: 10px;
    overflow: hidden;
}

.team-section .team-photos {
    padding-top: 20px;
}

.focus ul li, .description ul li {list-style-type: disc;}

.focus ul, .description ul {
    padding-left: 30px;
}

.sidebar-widget {
    font-size: 12pt;
    margin-bottom: 30px;
}

.users-top-section .intro {
    margin-bottom: 30px;
}

.profile-user-meta .label {
    /* font-size: 10pt; */
    color: var(--icon-color);
    margin-bottom: 5px;
    /* font-weight: bold; */
}

.pum-name input {
    font-size: 18pt;
}

.users-home .sidebar {
    /* background-color: var(--xwhite); */
    /* color: var(--dark); */
    /* padding: 30px!important; */
    /* border-radius: 10px; */
    /* padding-right: 30px!important; */
    /* margin-top: -2px; */
    /* position: absolute; */
    /* left: 0px; */
    /* top: 66px; */
    /* bottom: 0px; */
}

.sidebar > div {
    /* background-color: var(--xwhite); */
    color: var(--dark);
    /* padding: 30px!important; */
    /* border-radius: 10px; */
    margin-bottom: 30px!important;
}

.the-text {
    font-size: 10pt;
    line-height: 1.8;
}

.users-home .main-content {
    /* padding-left: 30px!important; */
    height: calc(100vh - 66px);
    overflow-y: auto;
}

.user-profile-links .icon-link a {
    color: var(--primary);
    font-size: 9pt;
}

.user-profile-links .icon-link {
    margin-bottom: 7px;
    /* padding-left: 10px; */
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.user-profile-links .icon-link a i {
    font-size: 13pt;
    line-height: 15pt;
    vertical-align: middle;
    margin-right: 5px;
}

.user-profile-links {
    padding-top: 10px;
    width: calc(100% - 30px);
    background-color: var(--xwhite);
    border-radius: 10px;
    /* border-top-left-radius: 0px; */
    /* border-top-right-radius: 0px; */
    padding: 20px;
    margin-top: 30px;
    margin-bottom: 30px;
}

html, html body {
    color: var(--dark);
    font-family: "Open Sans", sans-serif;
}

.user-profile-url.text-field {
    margin-top: 10px;
    max-width: calc(100% - 30px);
}

.team-member-wrapper {
    /* background-color: var(--extra-light); */
    width: calc(100% - 20px);
    padding-top: 0px;
    /* border-radius: 10px; */
    /* padding-bottom: 20px; */
    cursor: pointer;
}

.team-member-wrapper:hover {
    /* background-color: var(--primary); */
    /* box-shadow: 0px 1px 5px var(--shadow); */
}

body .dropdown-content {
    background-color: var(--xwhite);
    overflow-x: hidden;
    /* width: auto!important; */
}

body .dropdown-content ul li {
    height: 40px!important;
    line-height: 40px!important;
}

.bs-searchbox input {
    margin-bottom: 0px;
    padding-left: 20px;
    border-bottom: none;
    height: 50px;
    line-height: 50px;
}

#changeCategory {
    min-width: 220px;
}

body .cke_toolgroup {
    margin-bottom: 0px;
    margin-right: 0px;
}

.the-team-name {
    color: var(--primary);
    font-size: 16pt;
    margin-bottom: 10px;
}

.team .team-name .description, .team .team-name .focus {
    font-size: 11pt;
    margin-bottom: 15px;
}

.team-member-wrapper:hover .member-text .name, .team-member-wrapper:hover .member-text .title {
    /* color: var(--white)!important; */
}

.sidebar-widget ul {
    padding-left: 20px;
}

.sidebar-widget ul li {
    list-style: disc;
}

#nav-mobile {
    background-color: var(--white);
    color: var(--dark);
}

.cke .cke_toolbar_separator {
    display: none;
}

.change-profile-image {
    position: absolute;
    top: 0px;
    right: 0px;
    padding: 6px 6px 0px;
    background-color: var(--xwhite);
    /* border-radius: 10px; */
    border-bottom-left-radius: 10px;
    border-top-right-radius: 8px;
    opacity: .4;
    cursor: pointer;
    transition: opacity .3s ease-in-out;
}

.user-profile-image:hover .change-profile-image {
    color: var(--primary);
    opacity: 1;
}

.profile-user-meta.introvideo {
    /* display: inline-block; */
    width: 100%;
    padding-top: 30px;
}

.reset-profile-image {
    /* position: absolute; */
    /* top: 30px; */
    /* right: 30px; */
    /* width: 30px; */
}

.the-profile-image {
    width: 100%;
    border-radius: 6px;
    background-position: center center;
    background-size: cover;
    background-repeat: no-repeat;
    background-color: var(--xwhite);
    border-radius: 10px;
}

nav .the-profile-image {
    width: 45px;
    border-radius: 7px;
    padding: 5px!important;
    overflow: hidden;
}

.the-profile-image:after {
    content: "";
    display: block;
    padding-bottom: 100%;
}

.profile-user-meta.video video {
    width: 100%;
}

.profile-user-meta.introvideo video {
    width: 100%;
}

.profile-page .recording-btn {
    /* float: right; */
    background-color: var(--primary)!important;
}

.profile-user-meta.video > .row {
    margin-bottom: 10px;
}

.recording-buttons {
    text-align: right;
}

.recording-buttons .btn {
    margin-left: 5px;
}

nav .notifications > i {
    padding-left: 20px;
    padding-right: 20px;
    cursor: pointer;
}

#notifications .questions-queue-header, #notifications .notifications-queue {
    padding: 10px 20px;
    background-color: var(--white);
}

#notifications .notifications-queue {
    text-align: center;
    padding-bottom: 20px;
    padding: 0px;
    /* max-height: calc(100vh - 126px); */
    /* overflow-y: auto; */
}

.listing-author-img {
    display: inline-block;
    float: left;
    margin-right: 15px;
    width: 36px;
    cursor: pointer;
}

.listing-meta-wrapper {
    /* display: inline-block; */
    /* overflow: hidden; */
}

.listing-created-date {
    color: var(--icon-color);
}

.edit-profile .profile-user-meta.video {
    margin-top: 0px;
    margin-bottom: 20px;
}

.profile-user-meta.extraquestion {
    margin-top: 30px;
}

.feedback-header h5 {
    color: var(--primary);
}

.feedback-wrapper {
    max-width: 980px;
    margin: 0px auto;
}

.feedback-answer textarea {
    margin-bottom: 0px;
    min-height: 60px;
    height: 100%;
    max-height: 100%;
    background-color: var(--xwhite);
    padding: 20px;
    box-sizing: border-box;
    border-bottom: none!important;
    box-shadow: none!important;
    border-radius: 10px;
}

.feedback-as {
    margin-bottom: 30px;
    font-size: 10pt;
    width: auto;
    display: inline-block;
}

.feedback-item {
    padding: 30px;
    background-color: var(--xwhite);
    border-radius: 10px;
    margin-bottom: 20px;
}

.feedback-items {
    padding-top: 60px;
}

.feedback-item .item-user {
    font-weight: bold;
}

.feedback-item .item-body {
    margin-top: 20px;
    white-space: pre-line;
}

.post-creator textarea {
    background-color: var(--xwhite);
    padding: 0px;
}

.post-creator textarea::placeholder {
    color: var(--dark);
}

.cke p {
    margin-bottom: 0px;
}

.listing-description strong, .cke strong {
    font-weight: bold;
}

.listing-description ul, .listing-description ol, .cke ol, .cke ul {
    padding-left: 30px;
}

.listing-description ul li {
    list-style-type: disc;
}

.listing-description ul ul, .listing-description ol ol, .cke ol ol, .cke ul ul {
    padding-left: 60px;
}

.listing-description ul ul ul, .listing-description ol ol ol, .cke ol ol ol, .cke ul ul ul {
    padding-left: 90px;
}

.listing-description ul ul ul ul, .listing-description ol ol ol ol, .cke ol ol ol ol, .cke ul ul ul ul {
    padding-left: 120px;
}

.listing-description ol li, .cke ol li, .listing-description ol li li li, .cke ol li li li, .listing-description ol li li li li li, .cke ol li li li li li, .listing-description ol li li li li li li li li li, .cke ol li li li li li li li li li {
    list-style-type: decimal;
}

.listing-description ol li li, .cke ol li li, .listing-description ol li li li li, .cke ol li li li li, .listing-description ol li li li li li li, .cke ol li li li li li li {
    list-style-type: lower-alpha;
}

.users-home .sidebar .sticky-icky {
    max-width: 300px;
    padding: 30px 30px;
    max-height: calc(100vh - 66px);
    overflow-y: auto;
    display: none;
}

.the-posts {
    max-width: 700px;
    margin: 0px auto;
    padding-top: 30px;
    padding-bottom: 30px;
}

.members-page {
    max-height: calc(100dvh - 64px);
    overflow-y: auto;
    padding-top: 30px;
    padding-bottom: 30px;
}

.teams-page {
    max-height: calc(100vh - 66px);
    overflow-y: auto;
    padding-top: 30px;
    padding-bottom: 30px;
}

.settings.account {
    max-height: calc(100vh - 66px);
    overflow-y: auto;
    padding-top: 30px;
    padding-bottom: 30px;
}

.profile-user-meta.extraquestion .the-answer {
    white-space: pre-line;
}

.profile-user-meta:last-child textarea, .profile-user-meta:last-child input {
    margin-bottom: 0px;
}

.dark body {background-color: var(--extra-light);}

.feedback {
    height: calc(100vh - 66px);
    overflow-y: auto;
    padding: 30px 0px;
    padding-left: 30px;
    padding-right: 30px;
}

.listing-action.dislike.selected, .listing-action.dislike:hover {
    color: var(--black)!important;
}

.listing-action.love.selected, .listing-action.love:hover {
    color: red!important;
}

.listing-action.laugh.selected, .listing-action.laugh:hover {
    color: orange!important;
}

.listing-action.wtf.selected, .listing-action.wtf:hover {
    color: var(--good)!important;
}

.listing-actions .listing-action.sad.selected, .listing-actions .listing-action.sad:hover {
    color: lightblue!important;
}

.listing-action.social {
    font-size: 13pt!important;
    filter: grayscale(1);
    opacity: .5;
    transition: .3s all ease-in-out;
    float: left;
    padding-right: 20px!important;
    margin-top: -5px;
}

.listing-action.social.selected, .listing-action.social:hover {
    filter: grayscale(0);
    opacity: 1;
}

.listing-action.save-post .btn {
    text-transform: none!important;
    padding-right: 0px;
    padding-top: 0px!important;
    padding-left: 5px;
    height: 17px!important;
    vertical-align: top;
    line-height: 23px;
    font-size: 9pt;
}

.listing-action.save-post .btn i {
    font-size: 12pt;
}

.modal {
    max-width: 700px;
    background-color: var(--xwhite);
    border-radius: 10px;
    /* transform: none!important; */
    /* transition: all .2s ease-in-out; */
}

.modal .modal-footer a {
    text-decoration: none;
    background-color: transparent;
    color: var(--black);
    text-transform: none;
}

.modal .modal-footer a:hover {
    color: var(--primary);
}

.reaction-totals span {
    padding-right: 9px;
    cursor: pointer;
}

.feedback-body .feedback-btn.btn {
    background-color: transparent;
    box-shadow: none;
    color: var(--primary);
    text-transform: none;
    float: right;
    width: auto;
    height: 24px;
    line-height: 24px;
    padding-right: 0px;
}

.feedback-body {
}

.feedback-answer {
    margin-bottom: 0px;
}

.feedback-body .feedback-btn.btn:hover {
    background-color: transparent!important;
    box-shadow: none!important;
}

.edit-post-actions > a.dropdown-button {
    /* height: 45px; */
    /* min-height: 45px; */
    /* line-height: 45px; */
    /* max-height: 45px; */
    color: var(--icon-color);
    float: right;
    display: inline-block;
    padding-left: 20px;
    padding-right: 0px;
}

.edit-post-actions > a.dropdown-button:hover {
    color: var(--primary);
}

.edit-post-actions > a.dropdown-button i {
    line-height: 35px;
}

.modal .modal-footer {
    background-color: var(--xwhite);
}

.social-login-providers a {
    display: inline-block;
    text-align: center;
    margin-right: 5px;
    margin-left: 5px;
}

a.google-btn .btn {
    background-color: var(--op-color-gray-170)!important;
    color: var(
    --dark);
    border-radius: 5px;
    padding: 0px 35px 0px 40px;
    max-width: 210px;
    text-transform: unset;
    transition: all .2s ease-in-out;
}

a.google-btn .btn img {
    width: 20px;
    line-height: 50px;
    vertical-align: middle;
    display: inline-block;
    margin-top: 16px;
    margin-left: 7px;
}

a.google-btn .btn:hover img {
    background-color: var(--awhite);
    border-radius: 5px;
}

body .space {
    color: var(--primary);
}

body .our {
    color: var(--black);
    padding-right: 0px;
    line-height: 64px;
}

nav .main-menu-items {
    /* padding-left: 130px; */
}

nav .main-menu-items li a {
    font-weight: 400;
}

body .cke_autocomplete_selected, body .cke_autocomplete_panel > li:hover {
    background-color: var(--xwhite);
    color: var(--black);
}

body .cke_autocomplete_panel {
    background-color: var(--white);
}

body a.email-btn button {
    background-color: var(--dark);
    color: var(--white);
}

.login-form input, .login-form label {
    text-align: left!important;
    background-color: transparent;
}

.login-form .input-field {
    padding-right: 0px;
}

a.twitter-btn button {
    background-color: #1DA1F2;
}

.login-form button.submit {
    margin-top: 20px;
    /* background-color: var(--black); */
    border-radius: 10px;
}

.login-screen {
    padding-top: 50px;
    padding-bottom: 50px;
    height: calc(100vh - 66px);
    overflow-y: auto;
}

.login-text p {
    font-size: 10pt;
    margin-top: -15px;
    /* margin-bottom: 30px; */
}

.register-instructions {
    margin-bottom: 10px;
}

.register-header h6 {font-weight: 300!important;margin-top: 10px;}

.login-form form input, .login-form form input:focus {
    border-bottom: 1px solid var(--light)!important;
    box-shadow: none!important;
    padding-left: 0px;
    color: var(--black)!important;
}

.login-form form input:focus {
    border-bottom-color: var(--primary)!important;
}

.login-form form label.active {
    color: var(--primary)!important;
}

.login-form form label {
    text-align: left!important;
    float: left;
    width: 100%;
    display: inline-block;
    margin-bottom: 4px;
    /* margin-top: 20px; */
}

.hidden {
    display: none;
}

.login-form .input-field.disabled input {color: var(--icon-color)!important;user-select: none;}

.social-login-card .change-profile-image {
    right: 0px!important;
}

.modal-overlay {
    backdrop-filter: blur(16px);
    display: none!important;
}

.btn.btn-transparent.add-image-btn {
    color: var(--icon-color);
}

.btn.btn-transparent.add-image-btn:hover {
    color: var(--primary)!important;
}

.cke_widget_wrapper:hover>.cke_widget_element {
    outline: none!important;
    border: none!important;
}

.cke_widget_drag_handler_container {
    display: none!important;
}

.cke_editable.cke_wysiwyg_div {
    min-height: 100px;
}

div[data-grammarly-part="gbutton"] {
    display: none!important;
}

.cke_notification_message {
    background-color: var(--primary)!important;
}

.cke_notification {
    background-color: var(--primary)!important;
}

.cke_notification {
    border: none;
    outline: none;
}

.notifications i {
    color: var(--icon-color);
}

.notifications:hover i, .notifications.selected i {
    color: var(--xwhite);
}

.profile-body .user-profile-image .the-profile-image {
    border-radius: 10px;
    /* border-bottom-right-radius: 0px; */
    /* border-bottom-left-radius: 0px; */
}

.profile-section-header {
    /* text-transform: uppercase; */
    font-weight: bold;
    margin-bottom: 20px;
    font-size: 13pt;
    color: var(--primary);
    margin-top: 40px;
}

.profile-page h6 {
    color: var(--primary);
    margin-bottom: 10px;
    margin-top: 30px;
}

.embedded-media {
    margin-bottom: -5px;
}

.profile-section-header.top-psh {
    margin-top: 0px;
}

.profile-user-meta.link input {
    margin-bottom: 0px;
}

.profile-user-meta.link .sub-text {
    /* margin-bottom: 30px; */
}

.profile-user-meta.link {
    margin-bottom: 30px;
    display: inline-block;
    width: 100%;
}

.legal-page-container {
    height: calc(100vh - 64px);
    overflow-y: auto;
}

.legal-pages .legal-wrapper {
    max-width: 1080px;
    margin: 50px auto;
    padding: 40px!important;
    background-color: var(--white);
    border-radius: 10px;
}

body [data-custom-class='heading_1'], body [data-custom-class='heading_1'] * {
    color: var(--black)!important;
}

body [data-custom-class='title'], body [data-custom-class='title'] * {
    color: var(--black)!important;
}

body [data-custom-class='body_text'], body [data-custom-class='body_text'] * {
    color: var(--dark)!important;
}

body .legal-pages .legal-wrapper a {
    color: var(--primary)!important;
}

.legal-item {
    padding: 10px 0px;
    /* background-color: var(--background-color); */
    margin-bottom: 5px;
    border-radius: 10px;
    cursor: pointer;
}

.legal-item .legal-item-title {
    font-size: 13pt;
    color: var(--primary);
}

.legal-item:hover {
    /* background-color: var(--light); */
    color: var(--primary-color);
}

body [data-custom-class='heading_2'], body [data-custom-class='heading_2'] * {
    color: var(--black)!important;
}

.link-to-legal {
    /* margin-top: 40px; */
    font-size: 9.5pt;
    margin-bottom: 15px;
}

.link-to-legal a {
    color: var(--icon-color);
}

.link-to-legal:hover a {
    color: var(--primary);
}

.puml-subtext {
    font-size: 10pt;
}

.profile-sidebar-meta.icon-link a {
    /* color: var(--dark); */
}

.profile-menu {
    border-radius: 10px;
    overflow: hidden;
    width: calc(100% - 30px);
}

.profile-menu {}

.profile-menu-item {
    padding: 10px 20px;
    background-color: var(--xwhite);
    color: var(--black);
    cursor: pointer;
    font-size: 10.5pt;
}

.profile-menu-item.selected {
    color: var(--primary);
}

.profile-menu-item.selected:hover, .profile-menu-item:hover {
    background-color: var(--primary);
    color: white;
}

body [data-custom-class='link'], body [data-custom-class='link'] * {
    color: var(--primary)!important;
}

.sidebar .legal-item {
    font-size: 10pt!important;
    margin-bottom: 0px!important;
    padding: 15px 20px;
    border-radius: 0px;
}

.sidebar .legal-item-title {
    font-size: 11pt;
    color: var(--black);
}

.legal-pages .sidebar {
    margin-top: 50px;
    max-width: 240px;
    background-color: var(--white);
    border-radius: 10px;
    overflow: hidden;
}

.sidebar .legal-item:hover {
    background-color: var(--light);
}

.sidebar .legal-item:hover .legal-item-title, .sidebar .legal-item.selected .legal-item-title {
    color: var(--primary);
}

.create-actions {
    position: relative;
    text-align: right;
}

.create-actions .create-action {
    display: inline-block;
    width: auto;
    /* max-width: 100px; */
    line-height: 50px;
    padding-left: 20px;
    user-select: none;
}

.create-actions .create-action i {
    /* display: inline-block; */
    /* width: auto; */
    /* max-width: 20px; */
    vertical-align: middle;
}

.create-action .listing-action {
    line-height: 50px;
    padding: 0px 10px;
}

.create-action a, .create-action button {
    line-height: 50px;
}

.create-actions .create-action i {
    line-height: 50px;
}

.profile-sidebar-title {
    margin-bottom: 7px;
    font-size: 12pt;
    /* text-align: center; */
}

.listing-item.private {
    /* background-color: var(--light); */
}

.listing-item.creation {
    /* border: 1px solid var(--primary); */
}

.post-badge {
    font-size: 8pt;
    color: var(--primary);
    padding-left: 1px;
    padding: 2px 8px 3px;
    background-color: transparent;
    border: 1px solid var(--primary);
    border-radius: 5px;
    margin-left: 5px;
}

.notifications-queue.empty {
    color: var(--black);
}

.notification-thread .item > .item-section {
    vertical-align: top;
    line-height: 1.6;
}

.notification-thread .item > .item-section.todos-icons {
    width: 36px;
    float: left;
    padding-top: 2px;
}

#notifications .notifications-queue .item {
    padding: 15px 20px;
    position: relative;
    height: auto;
}

.notification-thread .todo-widget-meta {
    vertical-align: top;
    overflow: hidden;
}

.notification-thread .item > .item-section:last-child {
    overflow: hidden;
    padding-left: 20px;
    padding-right: 0px;
}

.notification-thread .item-section .dismiss-notification {
    position: absolute;
    top: 5px;
    right: 0px;
    vertical-align: top;
    height: 30px;
    line-height: 30px;
    user-select: none;
    cursor: pointer;
    opacity: 0;
}

.notification-thread .item-section .dismiss-notification i {
    line-height: 22px;
    font-size: 19px;
}

.notification-thread .item-section img {
    border-radius: 5px;
}

.todo-comment-system-message {
    font-size: 10pt;
    /* font-weight: bold; */
    color: var(--black);
}

.notification-thread .item:hover .item-section .dismiss-notification {
    opacity: 1;
}

.post-badge:first-child {
    margin-left: 5px;
}

.notification-thread .item-section .dismiss-notification:hover {
    /* color: var(--warning); */
}

.todo-summary-message-content {
    color: var(--black);
    font-size: 10pt;
    padding: 5px!important;
    background-color: var(--extra-light);
    display: inline-block;
    width: 100%;
    border-radius: 5px;
    margin-top: 5px;
}

li.item:hover .todo-summary-message-content {
    background-color: rgba(255, 255, 255, .2);
}

.todo-comment-system-message span {
    color: var(--icon-color);
    /* font-size: 9pt; */
    /* padding-left: 4px; */
}

.notification-thread li:hover span {
    color: var(--black)!important;
}

li.notifications {
    position: relative;
}

.notification-alert {
    position: absolute;
    right: 5px;
    top: 10px;
    font-size: 8pt;
    font-weight: bold;
    color: black;
    height: 20px;
    width: 20px;
    border-radius: 50px;
    background-color: var(--primary);
    line-height: 20px;
    text-align: center;
}

.notification-count {
    font-size: 10pt;
    color: var(--primary);
}

.dismiss-all-notifications {
    position: absolute;
    right: 20px;
    top: 12px;
    line-height: 32px;
    user-select: none;
    font-size: 10pt;
    color: var(--primary);
    cursor: pointer;
}

.dismiss-all-notifications:hover {
    color: var(--primary-hover);
}

.questions-queue-header h5 {
    width: auto;
    max-width: 80%;
}

.setting-option:last-child {
    margin-bottom: 0px;
}

.listing-items {}

.cke_editable.cke_wysiwyg_div:before {/* content: 'Add your creations here...'; *//* color: var(--light); */}

.a-dialog {
    position: fixed;
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    z-index: 99999999999999;
    background-color: #181818bd;
}

.dialog-wrapper {
    max-width: 740px;
    background-color: var(--xwhite);
    padding: 30px;
    margin: 100px auto;
    border-radius: 10px;
}

.dialog-footer {
    text-align: right;
}

.dialog-content {
    padding-bottom: 20px;
}

.todo-summary-text {
    /* display: inline-block; */
    width: 100%;
}

.add-user i {
    margin-right: 26px;
}

.logo-image {
    height: 64px;
    display: inline-block;
    float: left;
    vertical-align: middle;
    min-width: 64px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center center;
    margin-right: 10px;
}

.item.system-notification .the-icon {
    display: inline-block;
    float: left;
    vertical-align: middle;
    /* width: 40px; */
    line-height: 20px;
    height: 22px;
    margin-left: 6px;
    margin-right: 5px;
}

.item.system-notification .the-icon i {
    line-height: 23px;
    color: var(--warning);
}

.item.system-notification .the-text {
    /* display: inline-block; */
    overflow: hidden;
    padding-left: 20px;
    font-size: 10pt;
    line-height: 1.8;
}

.item.system-notification .the-text a {
    padding: unset!important;
    line-height: 1.5;
    display: inline-block;
    font-size: inherit!important;
}

.system-notification {}

.show-who {
    position: absolute;
    background-color: var(--white);
    z-index: 999999;
    padding: 10px;
    box-shadow: 0px 1px 2px var(--shadow);
    bottom: 40px;
    left: 0px;
    max-width: 360px;
    width: auto;
    max-height: 50vh;
    overflow-y: auto;
}

.listing-comment-body .show-who {
    bottom: 20px;
    min-width: 180px;
}

.side-nav .brand-logo {
    display: inline-block;
    padding-right: 0px!important;
    padding-left: 0px!important;
    width: auto;
    text-align: left;
    float: left;
}

.dd-nh-icon.left {
    display: inline-block;
}

.listing-description [data-oembed-url] {
    margin-left: -30px;
    margin-right: -30px;
    margin-bottom: -5px;
}

.listing-item-header {padding: 40px 40px 0px;}

.post-footer {
    padding: 0px 40px 40px;
}

.iframely-embed iframe {
    border-left: none!important;
    border-right: none!important;
}

.listings.specs {
    /* background-color: var(--background-color); */
}

.a-post {
    max-height: calc(100vh - 66px);
    /* overflow-y: auto; */
}

.a-single-post {
    max-width: 740px;
    margin: 0px auto;
}

.a-post .listing-item {
    /* max-width: 700px; */
    margin: 40px auto;
}

.cke_wysiwyg_div ul li {
    list-style-type: disc;
}

.cke_wysiwyg_div > ul, .cke_wysiwyg_div > ol {
    padding-left: 40px!important;
    padding-top: 0px;
    padding-bottom: 5px;
    margin-bottom: 0px;
    margin-top: 5px;
}

.cke_wysiwyg_div > ul ul, .cke_wysiwyg_div > ol ol {
    padding-left: 30px!important;
}

.btn.btn-transparent.show-more-less {
    padding-left: 0px;
}

.post-synopsis {
    white-space: pre-line;
}

.btn.go-to-post {
    display: inline-block;
    vertical-align: top;
    padding-left: 10px;
    padding-right: 10px;
    line-height: 34px;
    color: var(--icon-color)!important;
    opacity: 0;
    visibility: hidden;
    transition: all .5s ease-in-out;
}

.btn.go-to-post:hover {
    color: var(--primary)!important;
}

.post-synopsis:after {content: '...';}

.posts-sidebar-container {
    /* max-width: 300px; */
    padding: 30px;
    max-height: calc(100vh - 66px);
    overflow-y: auto;
}

.posts-search {
    position: relative;
    margin-bottom: 30px;
}

.btn.clear-search {
    position: absolute;
    top: 0px;
    right: 0px;
    padding-left: 20px;
    padding-right: 20px;
    height: 50px;
    line-height: 50px;
}

.input-search {
    /* background-color: var(--white); */
    /* border-radius: 5px; */
    /* overflow: hidden; */
}

.input-search input {
    margin-bottom: 0px;
    padding-left: 20px;
    box-sizing: border-box;
    border-bottom: none;
    background-color: var(--xwhite);
    border-radius: 10px;
    overflow: hidden;
    height: 50px;
}

.input-search input:focus {
    border-bottom: none!important;
    /* box-shadow: 0px 1px 4px black!important; */
}

.invite-group-members {
    padding-left: 0px;
    /* padding-top: 30px; */
    padding-right: 0px;
    text-transform: initial;
}

.invite-group-members i {
    vertical-align: middle;
}

.sidebar-section {
    padding: 20px;
    /* text-transform: uppercase; */
    /* font-weight: bold; */
    /* color: var(--dark); */
    background-color: var(--xwhite);
    margin-bottom: 30px;
    border-radius: 10px;
}

.sidebar-heading {
    /* text-transform: uppercase; */
    font-weight: bold;
    color: var(--dark);
    margin-bottom: 5px;
}

.sidebar {
    max-width: 340px;
    width: 100%;
    /* display: inline-block; */
    float: left;
}

.a-body {
    /* display: inline-block; */
    overflow: hidden;
    height: calc(100vh - 66px);
    overflow-y: auto;
}

.cag-settings.card {
    max-width: 780px;
    margin: 0px auto 30px;
    padding: 30px;
    border-radius: 10px;
}

.cag-settings.card h5 {
    margin-bottom: 30px;
}

.add-new-group {
    padding-left: 0px;
    /* margin-top: 10px; */
}

.add-new-group i {
    vertical-align: middle;
}

.text-field .dropdown-button {
    height: 50px;
    min-height: 50px;
    display: inline-block;
    line-height: 50px;
    background-color: var(--background-color);
    padding: 0px 20px;
    width: auto;
    color: var(--dark);
    user-select: none;
}

.settings-option .dropdown-button {
    width: 100%;
}

.text-field .dropdown-button i {
    line-height: 50px;
    height: 50px;
    float: right;
    padding-left: 10px;
}

.dropdown-content li {
    line-height: 50px;
    height: 50px;
    /* padding-left: 20px; */
    /* padding-right: 20px; */
    background-color: var(--white);
    /* box-shadow: 0px 1px 2px var(--shadow); */
    color: var(--dark)!important;
}

.btn.create-group {
    height: 50px;
    line-height: 50px;
    border-radius: 5px;
    margin-top: 20px;
    padding-left: 0px;
}

.group-section {
    background-color: var(--xwhite);
    padding: 30px;
    cursor: pointer;
    border-bottom: 1px solid var(--background-color);
}

.group-section:last-child {
    border-bottom: none!important;
}

.group-section:hover {
    background-color: var(--primary);
    color: black;
}

.group-sections {
    padding-top: 30px;
}

.group-sections-wrapper {
    max-width: 740px;
    margin: 0px auto 0px;
    border-radius: 10px;
    overflow: hidden;
}

.group-section .name {
    /* font-size: 12pt; */
    margin-bottom: 5px;
    /* font-weight: bold; */
    text-transform: uppercase;
}

.item .todo-summary {
    /* overflow: hidden; */
}

.notifications-mobile {
    max-height: calc(100vh - 66px);
    overflow-y: auto;
    padding: 30px;
    max-width: 740px;
    margin: 0px auto;
    background-color: var(--xwhite);
    position: relative;
    border-radius: 10px;
}

.notifications-mobile li {
    list-style: none;
    padding: 10px 0px;
}

.toast-action {
    color: var(--primary);
    cursor: pointer;
    user-select: none;
}

.item.system-notification {
    background-color: var(--extra-light);
}

.see-more-posts {
    padding-bottom: 30px;
    /* padding-top: 10px; */
}

.comment-comment-reply .textarea {
    margin: 0px!important;
}

.comment-comment-reply textarea {
    margin-bottom: 0px;
    background-color: var(--extra-light);
    border-bottom: none!important;
    box-shadow: none!important;
    line-height: 1.5;
    min-height: 40px;
    text-align: left;
    padding: 10px 20px;
    box-sizing: border-box;
    font-size: 10pt;
}

.comment-comment-reply .input-field {
    overflow: hidden;
    border-radius: 10px;
    padding-right: 0px;
}

.comment-comment-reply {
    width: 100%;
    margin-bottom: 20px;
}

.like-num {
    background-color: var(--extra-light);
    /* width: 20px!important; */
    display: inline-block;
    text-align: center;
    border-radius: 50px;
    padding-left: 6px;
    padding-right: 6px;
    margin-left: 5px;
    margin-right: 0px;
    color: var(--primary);
}

.comment-comments {
    padding-top: 12px;
}

.questions-queue-header {
    position: relative;
}

.notifications-mobile .dismiss-all-notifications {
    top: 0px;
    right: 0px;
}

.dismiss-notificationn {
    /* text-align: right; */
    margin-top: 5px;
    cursor: pointer;
    font-size: 10pt;
    color: var(--primary);
    user-select: none;
}

.toast {
    left: 20px!important;
    margin-left: 0px!important;
    bottom: 0px!important;
    float: left!important;
    background-color: #111!important;
    line-height: 30px;
    padding-left: 15px;
    padding-right: 15px;
    word-break: break-word;
}

.social-login-providers.disabled button.btn {
    opacity: .3;
    transition: opacity .4s ease-in-out;
}

.agree-to-terms {
    margin-top: 7px;
}

.agree-to-terms label {
    font-size: 11pt;
    color: var(--dark);
}

.dashboard-wrapper > .row {
    padding-top: 40px;
}

.dashboard-wrapper {
    max-height: calc(100vh - 66px);
    overflow-y: auto;
}

.dashboard-wrapper h5 {
    max-width: 740px;
    margin: 0px auto 10px;
}

.loggedin a.brand-logo:hover .space {
    color: var(--black);
}

.show-hide-nav-button {
    position: absolute;
    top: 64px;
    right: 20px;
    background-color: var(--white);
    border-radius: 0px 0px 5px 5px;
    box-shadow: 0px 1px 2px var(--shadow);
    z-index: 999999999999999;
    display: none;
}

.show-hide-nav-button .btn.btn-transparent {
    /* text-transform: capitalize; */
    font-size: 8pt;
    padding: 0px 10px;
    height: 20px;
    line-height: 20px;
    color: var(--black);
    background-color: var(--background-color);
}

.show-hide-nav-button.hidden-nav {
    top: 0px;
    opacity: .5;
}

.show-hide-nav-button.hidden-nav:hover {
    opacity: 1;
}

nav.main-nav.ng-hide {
    height: 0px!important;
    line-height: 0px!important;
}

.ta-right {
    text-align: right;
}

.border-right {
    border-right: 1px solid var(--border-light);
}

.w700 {
    font-weight: 700;
}

.sidepanel-widget .w700 {
    font-size: 14pt;
}

.w600 {
    font-weight: 600;
}

.relative {
    position: relative;
}

.dim {
    opacity: .3!important;
    user-select: none!important;
    cursor: default!important;
}

.f13 {
    font-size: 13px;
}

.cLT {
    color: var(--light-text);
}

.op-tooltip, .tooltip-btn {
    display: inline-block !important;
    height: 20px;
    width: 20px;
    line-height: 18px!important;
    font-size: 10pt;
    vertical-align: middle!important;
    border: 1px solid #e0e0e0;
    border-radius: 50%;
    color: var(--primary);
    font-weight: bold;
    text-align: center;
    margin: 0px !important;
    cursor: pointer;
    user-select: none;
    position: relative;
}

.pricing-plan-selector .op-tooltip {
    vertical-align: top!important;
    margin-top: 2px!important;
}

.op-tooltip:hover, .op-tooltip.selected {
    background-color: var(--primary);
    color: var(--white);
    border-color: var(--primary);
}

#appSpecNav li a i {
    color: var(--primary);
    font-size: 13pt;
}

#appSpecNav {
    padding: 0px 26px;
}

#appSpecNav li a {
    /* padding: 0px!important; */
    font-weight: bold!important;
}

.main-nav li {
    cursor: pointer;
}

#appSpecNav li {
    margin-left: -26px;
    margin-right: -26px;
    width: calc(100% + 54px);
}

.border-top {
    border-top: 1px solid var(--border)!important;
}

.header-row {
    padding-bottom: 10px;
}

.header-row .dropdown-content li {
    height: 50px!important;
    line-height: 50px!important;
    font-size: 10pt;
}

.front-arrow {
    transform: rotate(270deg);
}

.back-arrow {
    transform: rotate(90);
}

html body .back-arrow {
    transform: rotate(90deg);
    padding-bottom: 0px!important;
    height: 20px!important;
    margin-left: -8px;
}

.search-list {
    color: var(--dark);
    padding: 0px 25px;
    position: relative;
    display: flex;
    margin-bottom: 25px;
}

.search-list input {
    margin-bottom: 0px;
    padding: 0px 15px!important;
    border: 1px solid var(--border);
    box-sizing: border-box;
    height: 40px;
    line-height: 40px;
    font-size: 10pt;
}

.search-list input:focus {
    border: 1px solid var(--primary);
}

.search-list i {
    position: absolute;
    top: 0px;
    right: 35px!important;
    height: 40px!important;
    line-height: 40px!important;
    font-size: 13pt;
    cursor: pointer;
}

.version-item {
    color: var(--dark);
    font-size: 10pt;
    padding: 10px 25px;
    line-height: 12.5pt;
    cursor: pointer;
    position: relative;
}

.version-item.selected {
    color: var(--primary);
    background-color: var(--extra-light);
}

.version-item:hover {
    background-color: var(--extra-light);
}

.version-item .version-link i {
    width: 18px;
    height: 18px;
    line-height: 18px;
    font-size: 12pt!important;
    float: right;
    padding: 0px!important;
    cursor: pointer;
}

.version-item .version-link i:hover {
    color: var(--primary);
}

.version-link {
    position: absolute;
    right: 20px;
    bottom: 11px;
    z-index: 999999;
}

.text-overflow {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.prototype-versions {
    position: relative;
}

#developerMode .menu-container > li i.front-arrow {position: absolute!important;right: 25px;top: 0px;user-select: none;}

.front-arrow {
    margin-right: -5px;
}

html body .margin-bottom-20 {
    margin-bottom: 20px!important;
}

.padding-top-20 {
    padding-top: 20px;
}

#usermenu {
    padding-bottom: 0px;
    background-color: var(--white);
}

#usermenu li a, #usermenu li {
    padding: 0px;
    height: 50px!important;
    line-height: 50px;
}

#usermenu li a {
    padding: 0px 20px;
}

.the-view-view {
    overflow: hidden;
}

.bold {
    font-weight: bold;
}