/*-------------------------------------------------------------------
    This is the global styling used for the new button design 
    and Dashboard UI - Power of 16 Standardization
-------------------------------------------------------------------*/
/* Settings for Spacing */
/**-------------------------------------------------------------------
    Button Css 
--------------------------------------------------------------------*/
/* Base button Style */
.btn {
  padding: 6px 16px;
  font-size: 13px;
  border-radius: 2px;
  line-height: 1.5;
  transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out; }

.btn + .btn {
  margin-left: 4px; }

.modal-footer .btn + .btn {
  margin-left: 4px; }

.btn:focus, .btn:hover, .btn.focus {
  outline: 0; }

/* Primary button */
.btn-primary-satisfi {
  color: #FFF !important;
  background-color: var(--satisfi-surface-base) !important;
  border-color: var(--satisfi-surface-base) !important;
  min-width: 91px; }

/* Secondary button */
.btn-secondary-satisfi {
  color: var(--satisfi-surface-base) !important;
  background-color: #FFF !important;
  border-color: var(--satisfi-surface-base) !important;
  min-width: 91px; }

/* Danger button */
.btn-danger-satisfi {
  color: #FFF !important;
  background-color: var(--satisfi-surface-base) !important;
  border-color: var(--satisfi-surface-base) !important;
  min-width: 91px; }

/* Primary toolbar button */
.btn-primary-tb-satisfi {
  color: #FFF !important;
  background-color: var(--satisfi-surface-base) !important;
  border-color: var(--satisfi-surface-base) !important;
  min-width: 33px;
  padding: 6px; }

/* Secondary toolbar button */
.btn-secondary-tb-satisfi {
  color: var(--satisfi-surface-base) !important;
  background-color: #FFF !important;
  border-color: var(--satisfi-surface-base) !important;
  min-width: 33px;
  padding: 6px; }

/**-------------------------------------------------------------------
    Bootstrap Modal Css 
--------------------------------------------------------------------*/
.modal-header, .modal-footer, .modal-body {
  padding: 16px !important; }

.modal-title {
  text-align: left;
  font-size: 13px;
  line-height: 1.2; }

/**-------------------------------------------------------------------
    Forms Css 
--------------------------------------------------------------------*/
.form-group {
  margin-bottom: 0 !important; }

.form-group + .form-group {
  margin-top: 16px !important; }

label {
  margin-bottom: 8px !important; }

.col-xs-1, .col-sm-1, .col-md-1, .col-lg-1, .col-xs-2, .col-sm-2, .col-md-2, .col-lg-2, .col-xs-3, .col-sm-3, .col-md-3, .col-lg-3, .col-xs-4, .col-sm-4, .col-md-4, .col-lg-4, .col-xs-5, .col-sm-5, .col-md-5, .col-lg-5, .col-xs-6, .col-sm-6, .col-md-6, .col-lg-6, .col-xs-7, .col-sm-7, .col-md-7, .col-lg-7, .col-xs-8, .col-sm-8, .col-md-8, .col-lg-8, .col-xs-9, .col-sm-9, .col-md-9, .col-lg-9, .col-xs-10, .col-sm-10, .col-md-10, .col-lg-10, .col-xs-11, .col-sm-11, .col-md-11, .col-lg-11, .col-xs-12, .col-sm-12, .col-md-12, .col-lg-12 {
  padding-right: 16px;
  padding-left: 16px; }

.primary-padding-satisfi {
  padding: 16px; }

.secondary-padding-satisfi {
  padding: 8px; }

.alert {
  padding: 16px;
  margin-bottom: 16px; }

/**-------------------------------------------------------------------

    This .scss loop will create "margin helpers" and "padding helpers"
    It will generate several classes such as:

    .mr-8 which gives margin-right 8 pixels.
    .mr-16 gives MARGIN to the RIGHT 16 pixels.
    .mt-16 gives MARGIN to the TOP 16 pixels and so on.
    .pb-8 gives PADDING to the BOTTOM of 8 pixels
    .pl-16 gives PADDING to the LEFT of 16 pixels

    The first letter is "m" or "p" for MARGIN or PADDING
    Second letter is "t", "b", "l", or "r" for TOP, BOTTOM, LEFT, or RIGHT
    Third letter is the number of spacing in pixels. 

--------------------------------------------------------------------*/
.mt-0 {
  margin-top: 0px !important; }

.pt-0 {
  padding-top: 0px !important; }

.mb-0 {
  margin-bottom: 0px !important; }

.pb-0 {
  padding-bottom: 0px !important; }

.ml-0 {
  margin-left: 0px !important; }

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

.mr-0 {
  margin-right: 0px !important; }

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

.mt-4 {
  margin-top: 4px !important; }

.pt-4 {
  padding-top: 4px !important; }

.mb-4 {
  margin-bottom: 4px !important; }

.pb-4 {
  padding-bottom: 4px !important; }

.ml-4 {
  margin-left: 4px !important; }

.pl-4 {
  padding-left: 4px !important; }

.mr-4 {
  margin-right: 4px !important; }

.pr-4 {
  padding-right: 4px !important; }

.mt-8 {
  margin-top: 8px !important; }

.pt-8 {
  padding-top: 8px !important; }

.mb-8 {
  margin-bottom: 8px !important; }

.pb-8 {
  padding-bottom: 8px !important; }

.ml-8 {
  margin-left: 8px !important; }

.pl-8 {
  padding-left: 8px !important; }

.mr-8 {
  margin-right: 8px !important; }

.pr-8 {
  padding-right: 8px !important; }

.mt-16 {
  margin-top: 16px !important; }

.pt-16 {
  padding-top: 16px !important; }

.mb-16 {
  margin-bottom: 16px !important; }

.pb-16 {
  padding-bottom: 16px !important; }

.ml-16 {
  margin-left: 16px !important; }

.pl-16 {
  padding-left: 16px !important; }

.mr-16 {
  margin-right: 16px !important; }

.pr-16 {
  padding-right: 16px !important; }

.px-16 {
  padding-left: 16px;
  padding-right: 16px; }

.py-16 {
  padding-top: 16px;
  padding-bottom: 16px; }

.mx-16 {
  margin-left: 16px;
  margin-right: 16px; }

.my-16 {
  margin-top: 16px;
  margin-bottom: 16px; }

.d-flex {
  display: -ms-flexbox !important;
  display: flex !important; }

.justify-content-between {
  -webkit-box-pack: justify !important;
  -ms-flex-pack: justify !important;
  justify-content: space-between !important; }

.align-items-center {
  -webkit-box-align: center !important;
  -ms-flex-align: center !important;
  align-items: center !important; }

.justify-content-end {
  justify-content: flex-end; }

/**-------------------------------------------------------------------
    Company Selection Page
--------------------------------------------------------------------*/
.selectCompanyBtn.selectCompanyBtn-satisfi {
  margin: 0 auto 16px auto;
  display: block; }

.createCompanyLink.createCompanyLink-satisfi {
  display: block;
  text-align: center;
  margin-left: 0; }

#DlgCreateCompany {
  /*.col-sm-6 {
        padding: 0 !important;
    }*/ }
  #DlgCreateCompany .validation-summary-valid ul {
    margin-bottom: 0 !important; }
  @media (max-width: 768px) {
    #DlgCreateCompany .col-sm-6 + .col-sm-6 {
      padding-left: 0 !important; } }

/**-------------------------------------------------------------------
    Main MIXINs here
--------------------------------------------------------------------*/
/**-------------------------------------------------------------------
    Settings > Company Profile Page
--------------------------------------------------------------------*/
#divProfilePartial table.table {
  margin-bottom: 16px !important; }
  #divProfilePartial table.table td {
    padding: 0 !important; }
  #divProfilePartial table.table tr td:first-child:not(:only-child) {
    padding-right: 16px !important; }
  #divProfilePartial table.table tr:not(:first-child) td {
    padding-top: 16px !important; }
  #divProfilePartial table.table text {
    padding-left: 6px !important; }

/**-------------------------------------------------------------------
    Settings > Company Logo
--------------------------------------------------------------------*/
.company-logo-container {
  display: flex;
  justify-content: center;
  align-items: center; }
  .company-logo-container .company-logo-main {
    width: 350px;
    height: 170px; }
    .company-logo-container .company-logo-main .company-logo-img {
      display: flex;
      justify-content: center;
      align-items: center;
      width: inherit;
      height: inherit;
      border: 1px solid #ddd;
      border-radius: 4px;
      box-shadow: 4px 4px 4px -4px rgba(0, 0, 0, 0.2); }

/**-------------------------------------------------------------------
    Settings > Invite Settings
--------------------------------------------------------------------*/
#divInviteSettings .dashedDiv {
  border: 1px solid #ddd;
  border-radius: 4px;
  box-shadow: 4px 4px 4px -4px rgba(0, 0, 0, 0.2);
  padding: 16px !important; }

#divInviteSettings .smsInviteMessage > div {
  text-align: justify;
  line-height: 1.5;
  padding-bottom: 16px !important;
  color: #4a4a4a; }

#divInviteSettings .inviteSectionHeaders {
  border-bottom: 1px solid #ddd;
  padding: 0 !important;
  font-size: 14px;
  font-weight: bold; }

#divInviteSettings .table-responsive {
  margin-top: 16px !important; }

#divInviteSettings table.table {
  margin-bottom: 0 !important; }
  #divInviteSettings table.table td {
    padding: 0 !important; }
  #divInviteSettings table.table tr td:first-child:not(:only-child) {
    padding-right: 16px !important; }
  #divInviteSettings table.table tr:not(:first-child) td {
    padding-top: 16px !important; }

/**-------------------------------------------------------------------
    Settings > Tag Manager
--------------------------------------------------------------------*/
#divTags table.table {
  margin-bottom: 16px !important; }
  #divTags table.table tr th:first-child, #divTags table.table tr td:first-child {
    width: calc(100% - 16px - 33px); }
  #divTags table.table > tbody > tr > td {
    line-height: 1.23 !important; }
  #divTags table.table td.width-icon, #divTags table.table th.width-icon {
    padding-top: 0 !important;
    padding-bottom: 0 !important; }
  #divTags table.table th.width-icon {
    min-width: 49px; }
  #divTags table.table td .fa, #divTags table.table td .fab, #divTags table.table td .fal, #divTags table.table td .far, #divTags table.table td .fas {
    min-width: 33px;
    height: 33px;
    display: flex;
    justify-content: center;
    align-items: center; }
  #divTags table.table td input[type="radio"], #divTags table.table td input[type="checkbox"] {
    margin-top: 0 !important; }

/**-------------------------------------------------------------------
    Settings > Email Settings
--------------------------------------------------------------------*/
#divEmailSettings table.table {
  margin-bottom: 16px !important; }
  #divEmailSettings table.table td {
    padding: 0 !important; }
  #divEmailSettings table.table tr td:first-child:not(:only-child) {
    padding-right: 16px !important; }
  #divEmailSettings table.table tr:not(:first-child) td {
    padding-top: 16px !important; }

#divEmailSettings .errorDiv {
  padding-bottom: 16px !important; }

#divEmailSettings .width40 {
  min-width: 280px; }

/**-------------------------------------------------------------------
    Settings > System Setup
--------------------------------------------------------------------*/
#divSystemSetupNew .contentSections {
  margin-bottom: 16px !important;
  padding-top: 0;
  padding-left: 0 !important;
  border-bottom: 1px solid #ddd; }
  #divSystemSetupNew .contentSections:not(:first-child) {
    padding-top: 16px; }

#divSystemSetupNew .contentSettings:last-child {
  padding-bottom: 16px; }

#divSystemSetupNew .contentSettings .cuscheckbox .cr, #divSystemSetupNew .contentSettings select, #divSystemSetupNew .contentSettings input[type="text"] {
  margin: 0 8px; }

#divSystemSetupNew .contentSettings .control-label {
  padding-top: 0 !important;
  margin-bottom: 0 !important; }

#divSystemSetupNew .contentSettings + .contentSettings {
  padding-top: 16px !important; }

/**-------------------------------------------------------------------
    Settings > Users
--------------------------------------------------------------------*/
#divUsersPartial table.table > tbody > tr > td {
  line-height: 1.23 !important; }

#divUsersPartial table.table td.width-icon, #divUsersPartial table.table th.width-icon {
  padding-top: 0 !important;
  padding-bottom: 0 !important; }

#divUsersPartial table.table th.width-icon {
  min-width: 49px; }

#divUsersPartial table.table td .fa, #divUsersPartial table.table td .fab, #divUsersPartial table.table td .fal, #divUsersPartial table.table td .far, #divUsersPartial table.table td .fas {
  min-width: 33px;
  height: 33px;
  display: flex;
  justify-content: center;
  align-items: center; }

#divUsersPartial table.table td input[type="radio"], #divUsersPartial table.table td input[type="checkbox"] {
  margin-top: 0 !important; }

#divUsersPartial table.table > tbody > tr {
  display: flex; }

#divUsersPartial table.table .width-grow {
  flex-grow: 1; }

#DlgCmpUserForm .FormRow {
  padding-bottom: 16px !important; }

#DlgCmpUserForm .table-bordered {
  padding: 16px !important; }
  #DlgCmpUserForm .table-bordered input[type="radio"], #DlgCmpUserForm .table-bordered input[type="checkbox"] {
    margin-top: 0 !important; }

/**-------------------------------------------------------------------
    Settings > User Notifications
--------------------------------------------------------------------*/
#divUserNotifications table.table {
  margin-bottom: 0 !important; }
  #divUserNotifications table.table > tbody > tr > td {
    line-height: 1.23 !important; }
  #divUserNotifications table.table td input[type="radio"], #divUserNotifications table.table td input[type="checkbox"] {
    margin-top: 0 !important; }

/**-------------------------------------------------------------------
    Settings > Super Admin Tools
--------------------------------------------------------------------*/
#divSuperAdminTools table.table {
  margin-bottom: 0 !important; }

/**-------------------------------------------------------------------
    Responsive Float
--------------------------------------------------------------------*/
@media (min-width: 768px) {
  .pull-sm-left {
    float: left !important; }
  .pull-sm-right {
    float: right !important; }
  .pull-sm-none {
    float: none !important; } }

@media (min-width: 992px) {
  .pull-md-left {
    float: left !important; }
  .pull-md-right {
    float: right !important; }
  .pull-md-none {
    float: none !important; } }

@media (min-width: 1200px) {
  .pull-lg-left {
    float: left !important; }
  .pull-lg-right {
    float: right !important; }
  .pull-lg-none {
    float: none !important; } }

.pull-none {
  float: none !important; }

/**-------------------------------------------------------------------
    Bootstrap Switch Css
--------------------------------------------------------------------*/
.bootstrap-switch.bootstrap-switch-large {
  min-height: 33px !important; }
  .bootstrap-switch.bootstrap-switch-large .bootstrap-switch-handle-on, .bootstrap-switch.bootstrap-switch-large .bootstrap-switch-handle-off, .bootstrap-switch.bootstrap-switch-large .bootstrap-switch-label {
    min-height: 31px !important;
    line-height: 18px !important; }
  .bootstrap-switch.bootstrap-switch-large .bootstrap-switch-label {
    margin: 0 !important; }

/**-------------------------------------------------------------------
    Studio > Tiles List Page
--------------------------------------------------------------------*/
#divTiles table.table, #divPopups table.table, #divChatPages table.table, #divResponsePages table.table, #divExternalPages table.table, #divLocatorPages table.table, #divLandingPages table.table, #divActivityPages table.table, #divSubmissionForms table.table {
  margin-bottom: 16px !important; }
  #divTiles table.table > tbody > tr > td, #divPopups table.table > tbody > tr > td, #divChatPages table.table > tbody > tr > td, #divResponsePages table.table > tbody > tr > td, #divExternalPages table.table > tbody > tr > td, #divLocatorPages table.table > tbody > tr > td, #divLandingPages table.table > tbody > tr > td, #divActivityPages table.table > tbody > tr > td, #divSubmissionForms table.table > tbody > tr > td {
    line-height: 1.23 !important; }
  #divTiles table.table td.width-icon, #divTiles table.table th.width-icon, #divPopups table.table td.width-icon, #divPopups table.table th.width-icon, #divChatPages table.table td.width-icon, #divChatPages table.table th.width-icon, #divResponsePages table.table td.width-icon, #divResponsePages table.table th.width-icon, #divExternalPages table.table td.width-icon, #divExternalPages table.table th.width-icon, #divLocatorPages table.table td.width-icon, #divLocatorPages table.table th.width-icon, #divLandingPages table.table td.width-icon, #divLandingPages table.table th.width-icon, #divActivityPages table.table td.width-icon, #divActivityPages table.table th.width-icon, #divSubmissionForms table.table td.width-icon, #divSubmissionForms table.table th.width-icon {
    padding-top: 0 !important;
    padding-bottom: 0 !important; }
  #divTiles table.table th.width-icon, #divPopups table.table th.width-icon, #divChatPages table.table th.width-icon, #divResponsePages table.table th.width-icon, #divExternalPages table.table th.width-icon, #divLocatorPages table.table th.width-icon, #divLandingPages table.table th.width-icon, #divActivityPages table.table th.width-icon, #divSubmissionForms table.table th.width-icon {
    min-width: 49px; }
  #divTiles table.table td .fa, #divTiles table.table td .fab, #divTiles table.table td .fal, #divTiles table.table td .far, #divTiles table.table td .fas, #divPopups table.table td .fa, #divPopups table.table td .fab, #divPopups table.table td .fal, #divPopups table.table td .far, #divPopups table.table td .fas, #divChatPages table.table td .fa, #divChatPages table.table td .fab, #divChatPages table.table td .fal, #divChatPages table.table td .far, #divChatPages table.table td .fas, #divResponsePages table.table td .fa, #divResponsePages table.table td .fab, #divResponsePages table.table td .fal, #divResponsePages table.table td .far, #divResponsePages table.table td .fas, #divExternalPages table.table td .fa, #divExternalPages table.table td .fab, #divExternalPages table.table td .fal, #divExternalPages table.table td .far, #divExternalPages table.table td .fas, #divLocatorPages table.table td .fa, #divLocatorPages table.table td .fab, #divLocatorPages table.table td .fal, #divLocatorPages table.table td .far, #divLocatorPages table.table td .fas, #divLandingPages table.table td .fa, #divLandingPages table.table td .fab, #divLandingPages table.table td .fal, #divLandingPages table.table td .far, #divLandingPages table.table td .fas, #divActivityPages table.table td .fa, #divActivityPages table.table td .fab, #divActivityPages table.table td .fal, #divActivityPages table.table td .far, #divActivityPages table.table td .fas, #divSubmissionForms table.table td .fa, #divSubmissionForms table.table td .fab, #divSubmissionForms table.table td .fal, #divSubmissionForms table.table td .far, #divSubmissionForms table.table td .fas {
    min-width: 33px;
    height: 33px;
    display: flex;
    justify-content: center;
    align-items: center; }
  #divTiles table.table td input[type="radio"], #divTiles table.table td input[type="checkbox"], #divPopups table.table td input[type="radio"], #divPopups table.table td input[type="checkbox"], #divChatPages table.table td input[type="radio"], #divChatPages table.table td input[type="checkbox"], #divResponsePages table.table td input[type="radio"], #divResponsePages table.table td input[type="checkbox"], #divExternalPages table.table td input[type="radio"], #divExternalPages table.table td input[type="checkbox"], #divLocatorPages table.table td input[type="radio"], #divLocatorPages table.table td input[type="checkbox"], #divLandingPages table.table td input[type="radio"], #divLandingPages table.table td input[type="checkbox"], #divActivityPages table.table td input[type="radio"], #divActivityPages table.table td input[type="checkbox"], #divSubmissionForms table.table td input[type="radio"], #divSubmissionForms table.table td input[type="checkbox"] {
    margin-top: 0 !important; }
  #divTiles table.table > tbody > tr, #divPopups table.table > tbody > tr, #divChatPages table.table > tbody > tr, #divResponsePages table.table > tbody > tr, #divExternalPages table.table > tbody > tr, #divLocatorPages table.table > tbody > tr, #divLandingPages table.table > tbody > tr, #divActivityPages table.table > tbody > tr, #divSubmissionForms table.table > tbody > tr {
    display: flex; }
  #divTiles table.table .width-grow, #divPopups table.table .width-grow, #divChatPages table.table .width-grow, #divResponsePages table.table .width-grow, #divExternalPages table.table .width-grow, #divLocatorPages table.table .width-grow, #divLandingPages table.table .width-grow, #divActivityPages table.table .width-grow, #divSubmissionForms table.table .width-grow {
    flex-grow: 1; }

/**-------------------------------------------------------------------
    Studio > Tiles add/edit Page
--------------------------------------------------------------------*/
.divChatEditorPartial #tblTileRules, .divChatEditorPartial #tblPopupRules {
  margin-bottom: 16px !important; }
  .divChatEditorPartial #tblTileRules > tbody > tr > td, .divChatEditorPartial #tblPopupRules > tbody > tr > td {
    line-height: 1.23 !important; }
  .divChatEditorPartial #tblTileRules td.width-icon, .divChatEditorPartial #tblTileRules th.width-icon, .divChatEditorPartial #tblPopupRules td.width-icon, .divChatEditorPartial #tblPopupRules th.width-icon {
    padding-top: 0 !important;
    padding-bottom: 0 !important; }
  .divChatEditorPartial #tblTileRules th.width-icon, .divChatEditorPartial #tblPopupRules th.width-icon {
    min-width: 49px; }
  .divChatEditorPartial #tblTileRules td .fa, .divChatEditorPartial #tblTileRules td .fab, .divChatEditorPartial #tblTileRules td .fal, .divChatEditorPartial #tblTileRules td .far, .divChatEditorPartial #tblTileRules td .fas, .divChatEditorPartial #tblPopupRules td .fa, .divChatEditorPartial #tblPopupRules td .fab, .divChatEditorPartial #tblPopupRules td .fal, .divChatEditorPartial #tblPopupRules td .far, .divChatEditorPartial #tblPopupRules td .fas {
    min-width: 33px;
    height: 33px;
    display: flex;
    justify-content: center;
    align-items: center; }
  .divChatEditorPartial #tblTileRules td input[type="radio"], .divChatEditorPartial #tblTileRules td input[type="checkbox"], .divChatEditorPartial #tblPopupRules td input[type="radio"], .divChatEditorPartial #tblPopupRules td input[type="checkbox"] {
    margin-top: 0 !important; }
  .divChatEditorPartial #tblTileRules > tbody > tr, .divChatEditorPartial #tblPopupRules > tbody > tr {
    display: flex; }
  .divChatEditorPartial #tblTileRules .width-grow, .divChatEditorPartial #tblPopupRules .width-grow {
    flex-grow: 1; }

.divChatEditorPartial .table-fixed thead tr {
  display: block; }

.divChatEditorPartial .table-fixed tbody td, .divChatEditorPartial .table-fixed thead > tr > th {
  float: left;
  border-bottom-width: 0; }

.divChatEditorPartial .table-fixed thead > tr > th {
  border-bottom: 1px solid #ddd; }

.divChatEditorPartial table:not(.dataTable) {
  display: block;
  width: 100%; }

.divChatEditorPartial table:not(.dataTable) > thead {
  display: inline-block;
  width: 100%; }

.divChatEditorPartial table:not(.dataTable) > tbody {
  display: inline-block;
  width: 100%;
  overflow: auto;
  border-bottom-width: 0px; }

.divChatEditorPartial table:not(.dataTable) tr th {
  text-align: left; }

.divChatEditorPartial .table-fixed tbody {
  overflow-y: auto;
  width: 100%; }

.divChatEditorPartial .table-fixed tbody tr {
  display: table;
  width: 100%; }

.divChatEditorPartial .checkboxGroups .form-group {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important; }
  .divChatEditorPartial .checkboxGroups .form-group label {
    margin-bottom: 0 !important; }
  .divChatEditorPartial .checkboxGroups .form-group input[type="checkbox"].col-sm-1 {
    margin-top: 0 !important;
    width: auto; }

.divChatEditorPartial .customTextArea textarea.form-control {
  height: 141px; }

#modalAddEditTileRule .form-icons, #modalAddEditPopupRule .form-icons {
  min-width: 33px;
  height: 33px;
  line-height: 33px;
  text-align: center; }
  #modalAddEditTileRule .form-icons + .form-icons, #modalAddEditPopupRule .form-icons + .form-icons {
    margin-left: 4px; }

/**-------------------------------------------------------------------
    Studio > Response Page Editor
--------------------------------------------------------------------*/
.divResponseEditorPartial .flexcontainer, .divLocatorEditorPartial .flexcontainer, .divLandingEditorPartial .flexcontainer, .divActivityEditorPartial .flexcontainer {
  width: 364px !important; }

/**-------------------------------------------------------------------
    Studio > Landing Page Editor
--------------------------------------------------------------------*/
#divLandingPageContainer .rowLowerSectionButtons .row {
  display: flex;
  justify-content: start;
  align-items: stretch; }
  #divLandingPageContainer .rowLowerSectionButtons .row .col-xs-1 {
    flex: 0 0 100px; }
  #divLandingPageContainer .rowLowerSectionButtons .row .col-xs-5 {
    flex-grow: 1; }
  #divLandingPageContainer .rowLowerSectionButtons .row .landingPageButton, #divLandingPageContainer .rowLowerSectionButtons .row .landingPageButtonTextBox {
    margin-left: 0 !important;
    margin-right: 0 !important;
    width: 252px; }
  #divLandingPageContainer .rowLowerSectionButtons .row input[type="checkbox"] {
    margin-top: 0 !important; }

#divLandingPageContainer .rowLowerSectionButtons .landingPageLink {
  margin-bottom: 0 !important; }

#divLandingPageContainer .rowLowerSectionButtons .landingPageLink + .landingPageLink {
  margin-top: 16px !important; }

/**-------------------------------------------------------------------
    Studio > Submission Page Editor
--------------------------------------------------------------------*/
.divActivityEditorPartial .checkboxGroups .form-group:not(.notCheckboxGroup) {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important; }
  .divActivityEditorPartial .checkboxGroups .form-group:not(.notCheckboxGroup) label.noPaddingLeft {
    margin-bottom: 0 !important; }
  .divActivityEditorPartial .checkboxGroups .form-group:not(.notCheckboxGroup) input[type="checkbox"].col-sm-1 {
    margin-top: 0 !important;
    width: auto; }

.divActivityEditorPartial .tableNotifications td {
  padding: 0 !important; }

.divActivityEditorPartial .tableNotifications tr td:first-child:not(:only-child) {
  padding-right: 16px !important; }

.divActivityEditorPartial .tableNotifications tr:not(:first-child) td {
  padding-top: 16px !important; }

.divActivityEditorPartial .tableNotifications tbody > tr {
  display: flex; }

/**-------------------------------------------------------------------
    Studio > Locator Pages Editor
--------------------------------------------------------------------*/
.divLocatorEditorPartial #divSelectPages table.table {
  margin-bottom: 16px !important; }
  .divLocatorEditorPartial #divSelectPages table.table thead > tr {
    display: flex !important; }
    .divLocatorEditorPartial #divSelectPages table.table thead > tr > th {
      color: #454545;
      font-weight: bold; }
  .divLocatorEditorPartial #divSelectPages table.table th input[type="checkbox"], .divLocatorEditorPartial #divSelectPages table.table td input[type="checkbox"] {
    margin-top: 0 !important; }

/**-------------------------------------------------------------------
    General Styling
--------------------------------------------------------------------*/
.width7 {
  width: 7% !important; }

.width28 {
  width: 28% !important; }

.width252 {
  width: 252px !important; }

/* Desktops and laptops (B/w 1024px to 1199px) */
@media only screen and (min-width: 1024px) and (max-width: 1199px) {
  .width30Percent {
    width: 34% !important; } }

/* Desktops (B/w 1200px to 1399px) */
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .width-30-sm {
    width: 38% !important; }
  .width-sm-10 {
    width: 12% !important; }
  .width-10-sm {
    min-width: 75px !important; }
  .width-20-sm {
    width: 29% !important; }
  .width-49-sm {
    width: 40% !important; }
  .col-lg-8-expand {
    width: 83.33333333% !important; }
  .col-lg-11-expand {
    width: 100% !important; } }

/**-------------------------------------------------------------------
    Textarea and Pre tags Styling
--------------------------------------------------------------------*/
.divResponseEditorPartial textarea, .divResponseEditorPartial pre, .divLocatorEditorPartial textarea, .divLocatorEditorPartial pre, .divLandingEditorPartial textarea, .divLandingEditorPartial pre, .divActivityEditorPartial textarea, .divActivityEditorPartial pre, .divChatEditorPartial textarea, .divChatEditorPartial pre {
  padding: 8px !important;
  margin-bottom: 0 !important; }

/**-------------------------------------------------------------------
    Font Awesome Icon CSS
--------------------------------------------------------------------*/
.faIconSize {
  height: 33px;
  min-width: 33px; }

/**-------------------------------------------------------------------
    Studio > Page Themes
--------------------------------------------------------------------*/
#divPageThemes table.table {
  margin-bottom: 16px !important; }
  #divPageThemes table.table > tbody > tr > td {
    line-height: 1.23 !important; }
  #divPageThemes table.table td.width-icon, #divPageThemes table.table th.width-icon {
    padding-top: 0 !important;
    padding-bottom: 0 !important; }
  #divPageThemes table.table th.width-icon {
    min-width: 49px; }
  #divPageThemes table.table td .fa, #divPageThemes table.table td .fab, #divPageThemes table.table td .fal, #divPageThemes table.table td .far, #divPageThemes table.table td .fas {
    min-width: 33px;
    height: 33px;
    display: flex;
    justify-content: center;
    align-items: center; }
  #divPageThemes table.table td input[type="radio"], #divPageThemes table.table td input[type="checkbox"] {
    margin-top: 0 !important; }
  #divPageThemes table.table > tbody > tr {
    display: flex; }
  #divPageThemes table.table .width-grow {
    flex-grow: 1; }

/**-------------------------------------------------------------------
    Studio > Tags
--------------------------------------------------------------------*/
.divTagManager table.tblTemp {
  border-bottom: 0 !important; }
  .divTagManager table.tblTemp tr th {
    padding: 1px 8px !important; }

.divTagManager .table-container {
  padding-right: 0;
  margin-bottom: 16px; }
  .divTagManager .table-container table tr td {
    line-height: 1.23 !important;
    padding: 8px !important; }
  .divTagManager .table-container table td.width-icon, .divTagManager .table-container table th.width-icon {
    padding: 0 !important; }
  .divTagManager .table-container table td .GridIcon {
    min-width: 33px;
    height: 33px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    margin: 0 8px; }

/**-------------------------------------------------------------------
    Studio > Tags > Add/Edit Tag Modal
--------------------------------------------------------------------*/
#modalAddEditTags .form-icons, #modalAddEditTagSets .form-icons, #modalAddEditTagSetMember .form-icons, #divImageLibrary .form-icons, #editDataGridFromModalShow .form-icons {
  min-width: 33px;
  height: 33px;
  line-height: 33px;
  text-align: center; }
  #modalAddEditTags .form-icons + .form-icons, #modalAddEditTagSets .form-icons + .form-icons, #modalAddEditTagSetMember .form-icons + .form-icons, #divImageLibrary .form-icons + .form-icons, #editDataGridFromModalShow .form-icons + .form-icons {
    margin-left: 8px; }

/**-------------------------------------------------------------------
    Studio > Page Themes > Theme Editor
--------------------------------------------------------------------*/
.divThemeEditorPartial table.table {
  margin-bottom: 0 !important; }
  .divThemeEditorPartial table.table > thead > tr > th {
    padding: 0 8px 8px !important; }
  .divThemeEditorPartial table.table td.checkbox-cell, .divThemeEditorPartial table.table th.checkbox-cell {
    text-align: center !important; }
    .divThemeEditorPartial table.table td.checkbox-cell input[type="checkbox"], .divThemeEditorPartial table.table th.checkbox-cell input[type="checkbox"] {
      margin-top: 0 !important;
      float: none; }
  .divThemeEditorPartial table.table #txtCustomCSSMain {
    resize: vertical;
    padding: 8px !important; }

/**-------------------------------------------------------------------
    Pagination Styling
--------------------------------------------------------------------*/
#divTableMetaInfo .pagination > li > a {
  padding: 6px 16px !important;
  font-size: 13px;
  line-height: 1.5;
  transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out; }

#divTableMetaInfo .pagination .page > a {
  min-width: 33px;
  padding: 6px !important;
  text-align: center; }

#GridFooterPageList > li > a {
  padding: 6px 16px !important;
  font-size: 13px;
  line-height: 1.5;
  transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out; }

#GridFooterPageList .page:not(#GridFooterPaginationPrev):not(#GridFooterPaginationNext) > a {
  min-width: 33px;
  padding: 6px !important;
  text-align: center; }

/**-------------------------------------------------------------------
    General Styling
--------------------------------------------------------------------*/
/* Desktops (B/w 1200px to 1399px) */
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .width-15-sm {
    min-width: 110px !important; } }

@media (min-width: 768px) {
  .form-horizontal .control-label {
    padding-top: 8px; } }

/**-------------------------------------------------------------------
    Textarea and Pre tags Styling
--------------------------------------------------------------------*/
#previewGridDynamicListAreaModal textarea, #previewGridDynamicListAreaModal pre {
  padding: 8px !important;
  margin-bottom: 0 !important; }

#addNewDynamicListsListItemsModal .cuscheckbox .cr, #addNewDynamicListAreaModal .cuscheckbox .cr {
  width: 33px !important;
  height: 33px !important; }

.react-grid-Cell:not(.editing) .react-grid-Cell__value .GridIcon {
  min-width: 33px;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  margin: 0 8px; }

#divDynamicList .reactDataGridCustomStyle {
  padding-bottom: 16px !important;
  margin-left: 16px !important;
  margin-right: 16px !important; }

#divDynamicList .DynamicListFooter {
  padding-bottom: 16px !important; }

/**-------------------------------------------------------------------
    Submission Form Editor Styling
--------------------------------------------------------------------*/
#DisplayFeedbackForm .open-card-composer {
  padding: 8px !important;
  margin: 0;
  transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out; }
  #DisplayFeedbackForm .open-card-composer + .open-card-composer {
    margin-left: 8px; }

#DisplayFeedbackForm .portlet-header, #DisplayFeedbackForm .portlet-content-header {
  margin-bottom: 8px !important;
  padding: 8px; }

#DisplayFeedbackForm .notificationItemIcons, #DisplayFeedbackForm .notificationIcons {
  margin-left: 8px !important;
  display: flex; }
  #DisplayFeedbackForm .notificationItemIcons > i, #DisplayFeedbackForm .notificationIcons > i {
    display: flex;
    justify-content: center;
    align-items: center; }

#DisplayFeedbackForm .portlet-toggle {
  margin-right: 8px !important; }

#DisplayFeedbackForm .portlet-content {
  margin-bottom: 16px !important;
  padding: 0 !important; }

#DisplayFeedbackForm .portlet-sub-content {
  margin: 0 8px 8px !important;
  padding: 8px !important; }

#DisplayFeedbackForm .demo-icon {
  margin-left: 0px !important;
  margin-right: 8px !important; }

#DisplayFeedbackForm textarea {
  padding: 8px !important; }

#DisplayFeedbackForm #tblTags > tbody > tr > td {
  line-height: 1.23 !important; }

#DisplayFeedbackForm #tblTags > tbody > tr > td {
  line-height: 1.23 !important;
  font-size: 13px !important; }
  #DisplayFeedbackForm #tblTags > tbody > tr > td > label {
    margin-bottom: 0px !important; }

/**-------------------------------------------------------------------
    Resources Styling
--------------------------------------------------------------------*/
.resource-grid table tr th {
  padding: 4px 16px !important; }

.resource-grid table tr td {
  padding: 8px 8px 8px 16px !important; }

.resource-grid .table-container {
  margin-bottom: 12px !important; }

.resourceResultContainer table.dataTable thead th, .resourceResultContainer table.dataTable thead td {
  padding: 8px 16px; }

.resourceResultContainer .dataTables_wrapper .dataTables_paginate .paginate_button {
  padding: 7px 16px; }

.resourceResultContainer .dataTables_wrapper .dataTables_paginate span .paginate_button {
  min-width: 33px;
  padding: 7px; }

/**-------------------------------------------------------------------
    NLC Manager Pages Styling
--------------------------------------------------------------------*/
.divNLCManager #divRecordDetail {
  margin-bottom: 16px !important; }

.divNLCManager .GridIconTableData {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  font-size: 0; }
  .divNLCManager .GridIconTableData .GridIcon {
    min-width: 33px;
    height: 33px;
    display: inline-flex;
    justify-content: center;
    align-items: center; }
    .divNLCManager .GridIconTableData .GridIcon:not(:last-child) {
      margin-right: 16px !important; }

.divNLCManager .table-container table > tbody > tr > td {
  line-height: 1.23 !important; }

.divNLCManager .modal-footer .form-icons, .divNLCManager .modal-footer .form-icons2 {
  min-width: 33px;
  height: 33px;
  line-height: 33px;
  text-align: center; }
  .divNLCManager .modal-footer .form-icons + .form-icons, .divNLCManager .modal-footer .form-icons2 + .form-icons {
    margin-left: 4px; }

.divNLCManager .modal-footer-margin {
  font-size: 0; }
  .divNLCManager .modal-footer-margin span.spnSuccessMsg {
    font-size: 13px;
    vertical-align: middle;
    padding-right: 8px !important; }
  .divNLCManager .modal-footer-margin .btn + .btn {
    margin-left: 8px; }
  .divNLCManager .modal-footer-margin .form-icons + .form-icons {
    margin-left: 8px !important; }
  .divNLCManager .modal-footer-margin .form-icons2 + .form-icons2 {
    margin-left: 8px !important; }

.divNLCManager .td-icon {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  font-size: 0; }
  .divNLCManager .td-icon .fa {
    min-width: 33px;
    height: 33px;
    display: inline-flex;
    justify-content: center;
    align-items: center; }
    .divNLCManager .td-icon .fa:not(:last-child) {
      margin-right: 16px !important; }

.divNLCManager .adv-filter-multi-class {
  min-height: 34px; }
  .divNLCManager .adv-filter-multi-class .search-select {
    width: 95.5% !important; }
  .divNLCManager .adv-filter-multi-class .search-input {
    width: 90% !important; }

.divNLCManager .table-container td span.cr {
  width: 16px !important;
  height: 16px !important; }

.divNLCManager .table-container td.workFlowStatus .label {
  padding: 1px 8px;
  line-height: 1.23 !important; }

.divNLCManager .btn-icon-response {
  min-width: 33px;
  height: 33px;
  display: inline-flex;
  justify-content: center;
  align-items: center; }
  .divNLCManager .btn-icon-response > .fa {
    font-size: 19px; }

.divNLCManager .leftsidepanel .col-sm-8.pl-0 {
  flex-grow: 1; }

.divNLCManager .leftsidepanel .td-copy-icon {
  width: 33px !important;
  padding: 0 !important; }
  .divNLCManager .leftsidepanel .td-copy-icon .copySelectedData {
    width: 33px;
    height: 33px;
    display: inline-flex;
    justify-content: center;
    align-items: center; }

.divNLCManager .ulNavTabsResponsePublishAddEdit > li > a, .divNLCManager .ulNavTabsResponseAddEdit > li > a {
  padding: 8px 16px !important; }

.divNLCManager .changeHistoryData {
  min-width: 33px;
  height: 33px;
  display: inline-flex;
  justify-content: center;
  align-items: center; }
  .divNLCManager .changeHistoryData > .fa {
    font-size: 16px; }

.divNLCManager .tabAddEditResponsePublishCopyIcon .fa-copy, .divNLCManager .JsonTemplatePosition, .divNLCManager .history-icon,
.divNLCManager .tabAddEditResponseCopyIcon .fa-copy {
  min-width: 33px;
  height: 33px;
  display: inline-flex;
  justify-content: center;
  align-items: center; }

.divNLCManager #modalAddEditVolumes .modal-body .copySelectedData, .divNLCManager #modalAddEditEntities .modal-body .copySelectedData, .divNLCManager #modalAddEditClassifiers .modal-body .copySelectedData, .divNLCManager #modalAddEditClasses .modal-body .copySelectedData, .divNLCManager #modalAddEditMultiClasses .modal-body .copySelectedData,
.divNLCManager #addEditMultiClassPhrase .modal-body .copySelectedData, .divNLCManager #addEditMultiClassAdvResponse .modal-body .copySelectedData, .divNLCManager #modalAdvFilterMulticlass .modal-body .copySelectedData {
  min-width: 33px;
  height: 33px;
  display: inline-flex;
  justify-content: center;
  align-items: center; }

.divNLCManager .multiselect-container > li > a > label.checkbox {
  margin-bottom: 0 !important; }

/** This is for testing purpose only */
/*span.Title {
    margin-left: $SatisfiPrimarySpacing !important;
    width: calc(100% - 16px) !important;
}*/
/**-------------------------------------------------------------------
    Submission Inbox > Submission Manager Page Styling
--------------------------------------------------------------------*/
.container-fluid {
  padding-right: 16px;
  padding-left: 16px; }

.bootstrap-switch.bootstrap-switch-off .bootstrap-switch-label,
.bootstrap-switch.bootstrap-switch-inverse.bootstrap-switch-on .bootstrap-switch-label,
.bootstrap-switch .bootstrap-switch-handle-on {
  border-bottom-left-radius: 2px;
  border-top-left-radius: 2px; }

.bootstrap-switch.bootstrap-switch-on .bootstrap-switch-label,
.bootstrap-switch.bootstrap-switch-inverse.bootstrap-switch-off .bootstrap-switch-label,
.bootstrap-switch .bootstrap-switch-handle-off {
  border-bottom-right-radius: 2px;
  border-top-right-radius: 2px; }

.bootstrap-switch.bootstrap-switch-large {
  border-radius: 2px; }

#textAreaReply, .notesPlanel {
  border-radius: 0 !important;
  padding: 8px 16px 8px 8px !important; }

.notesPlanel {
  padding: 0 !important; }

.txtAreaFeedBackNotes {
  padding: 8px !important; }

.bottom-div-chat {
  display: flex;
  width: 100%; }
  .bottom-div-chat .left {
    flex-grow: 1;
    position: relative; }
    .bottom-div-chat .left .float-icon-top {
      position: absolute;
      top: 8px;
      right: 38px;
      z-index: 20; }
      .bottom-div-chat .left .float-icon-top .fal {
        font-weight: 900; }
  .bottom-div-chat .right {
    width: 91px;
    flex: 0 0 91px; }

.aside-icon-top {
  position: absolute;
  top: 16px;
  right: 0;
  width: auto;
  z-index: 20; }

#submissionManagerTagsContainer .clickDownArrow {
  right: -9px !important;
  margin-top: -2% !important; }

#submissionManagerTagsContainerDiv > span {
  width: 100% !important; }

/**-------------------------------------------------------------------
    Submission Inbox Page Styling
--------------------------------------------------------------------*/
.divSearchBoxCss > .input-group {
  width: calc(100% - 26px) !important; }

.col-submission-status div > .fa {
  padding-right: 16px; }
  .col-submission-status div > .fa:last-child {
    padding-right: 0; }

.divFilterLoader {
  min-height: 33px;
  display: inline-flex;
  align-items: center; }

/**-------------------------------------------------------------------
    Remove not allowed pointer from all disabled fields
    Based on Pages 2021 formless issue sheet.
--------------------------------------------------------------------*/
.form-control[disabled], .form-control[readonly], fieldset[disabled] .form-control {
  cursor: default !important; }

.divNLCManager #addEditMultiClassResponsePublish .modal-footer-margin .btn + .btn {
  margin-left: 6px !important; }

/**-------------------------------------------------------------------
    Satisfi Bridge NEW Inbox page CSS
--------------------------------------------------------------------*/
.bridge-cards {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  grid-auto-rows: 82px;
  grid-gap: 32px;
  margin: 16px; }

.bridge-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px;
  gap: 10px;
  background: #FFFFFF;
  border: 1px solid rgba(0, 0, 0, 0.1);
  box-sizing: border-box;
  box-shadow: 10px 10px 30px rgba(0, 0, 0, 0.05);
  border-radius: 8px;
  transform: translateY(0);
  transition: all 0.3s; }

.bridge-card-label {
  font-family: 'Noto Sans', sans-serif;
  font-style: normal;
  font-weight: normal;
  font-size: 16px;
  line-height: 22px;
  display: flex;
  align-items: center;
  letter-spacing: 0.15px;
  color: #000000; }

.bridge-card-stats {
  font-family: 'Noto Sans', sans-serif;
  font-style: normal;
  font-weight: normal;
  font-size: 34px;
  line-height: 46px;
  display: flex;
  align-items: center;
  text-align: right;
  letter-spacing: 0.25px;
  color: #000000; }

.bridge-buttons {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  padding: 16px;
  padding-top: 85px; }

.bridge-button {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 16px;
  background: #FFFFFF;
  border: 1px solid #EB1000;
  box-sizing: border-box;
  border-radius: 8px;
  transition: all 0.3s;
  text-decoration: none;
  -webkit-appearance: button;
  -moz-appearance: button;
  appearance: button; }

.bridge-button:hover {
  box-shadow: 0px 1px 1px 0px #EB1000; }

.bridge-button:hover, .bridge-button:visited, .bridge-button:focus {
  text-decoration: none; }

.bridge-button-label {
  font-family: 'Noto Sans', sans-serif;
  font-size: 13px;
  font-style: normal;
  font-weight: 700;
  line-height: 18px;
  letter-spacing: 1.25px;
  text-align: left;
  color: #EB1000; }

.bridge-button-icon .fas {
  width: 30px;
  height: 30px;
  font-size: 30px;
  color: #EB1000; }